body{
    margin: 0;
}

[class*="sdx-col-"]{
    display: flex !important;
    flex-direction: column;
}


/***********************
    Frame start
************************/

.sdx-frame{
    padding: 0px 10px;
    display: flex;
    flex-direction: column;
    border: 1px solid #FEFEFE;
    box-shadow: #FEFEFE 0px 0px 5px, inset #FEFEFE 0px 0px 5px;
    border-radius: 5px;
}

.sdx-frame .frame-header{
    width: 100%;
    font-family: 'Space Age';
    font-size: 2.4rem;
    line-height: 2.6rem;
    padding: 10px 0px;
}

.sdx-frame .frame-content{
    padding: 10px 0px;
}

/***********************
    Frame end
************************/

/***********************
    Form start
************************/

.sdx-form{
    display: flex;
    flex-direction: column;
}

.sdx-form .sdx-input-row{
    padding: 0.5rem 0;
    display: flex;
    flex-direction: row;
}

.sdx-input-row .sdx-label{
    font-size: 1rem;
    flex: 0 0 9rem;
    overflow: hidden;
    text-overflow: ellipsis;
    padding-right: 5px;
    display: block;
}

.sdx-input-row .sdx-input{
    flex: 0 1 100%;
    font-size: 1rem;
    line-height: 1rem;
}

input.sdx-input,
select.sdx-input,
textarea.sdx-input{
    border-radius: 5px;
    box-shadow: #FFFFFF 0px 0px 3px, inset #FFFFFF 0px 0px 3px;
    padding-left: 10px;
    padding-right: 10px;
    border: 1px solid #FEFEFE;
    background-color: transparent;
    color: #FEFEFE;
}

input.sdx-input:focus,
select.sdx-input:focus,
textarea.sdx-input:focus{
    background-color: #222222;
    outline: none;
    box-shadow: #78A3FF 0px 0px 7px, inset #78A3FF 0px 0px 7px;
    border: 1px solid #78A3FF;
}

.sdx-form .sdx-button-row{
    padding: 0.5rem 0;
    display: flex;
    justify-content: center;
}

.sdx-button-row .sdx-button{
    font-family: 'Space Age';
    background: transparent;
    border: 1px solid #FEFEFE;
    color: #FEFEFE;
    border-radius: 5px;
    padding: 0px 20px 3px 20px;
    font-size: 1.2rem;
    box-shadow: #FFFFFF 0px 0px 3px, inset #FFFFFF 0px 0px 3px;
    text-shadow: #FFFFFF 0px 0px 5px;
    cursor: pointer;
    transition: linear 0.1s;
    height: 2em;
    line-height: 2rem;
    vertical-align: middle;
}

.sdx-button-row .sdx-button:hover{
    box-shadow: #78A3FF 0px 0px 5px, inset #78A3FF 0px 0px 5px;
    border: 1px solid #78A3FF;
    color: #78A3FF;
    text-shadow: #78A3FF 0px 0px 5px;
}
/***********************
    Form end
************************/