@import url('https://fonts.googleapis.com/css2?family=Gabarito:wght@400;500;600;700;800;900&family=Roboto:wght@100;300;400;500;700;900&display=swap');
    @import url('https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css');

    ul, li, div, a, img, table,
    tr, td, input, textarea, select { box-sizing: border-box; outline:none; }
    a, a:link, a:hover              { cursor:pointer; text-decoration:none; }
    a:active                        { text-decoration:none; }
    ::-webkit-input-placeholder     { color:#999; }
    ::-moz-placeholder              { color:#999; }
    :-ms-input-placeholder          { color:#999; }
    :-moz-placeholder               { color:#999; }
    input[type="text"], textarea, select   { outline:none; background-color:#fff; }
    input[type=radio] { background:#fff !important; }
    input[type=checkbox] { background:#fff !important; }
    input[type=number]::-webkit-inner-spin-button,
    input[type=number]::-webkit-outer-spin-button { opacity: 1; }

    table { border-collapse: collapse; }
    select {
        padding: 10px;
        margin: 0;
        color:#000;
        border:#dfdfdf 1px solid;
        -webkit-appearance:none; /* remove the strong OSX influence from Webkit */
    }

    body            {
        background:#f4f6fc;
        color:#333; font:400 14px 'Roboto', sans-serif;
        line-height:20px;
        margin:0; overflow-x:hidden;
    }
    .transeffect    {
        -webkit-transition: 0.3s ease-in-out;
        -moz-transition: 0.3s ease-in-out;
        -o-transition: 0.3s ease-in-out;
        transition: 0.3s ease-in-out;
    }
    .img-responsive { width:auto; }  .DNone { display:block; }
    .col-lg-1_5     { width:20%; padding:0 15px; }
    hr              { border:none; border-top:#dfdfdf 1px dashed; margin:15px 0; }
    a               { color:#666; font:500 13px 'Roboto', sans-serif; cursor:pointer; -webkit-transition: 0.3s ease-in-out; -moz-transition: 0.3s ease-in-out; -o-transition: 0.3s ease-in-out; transition: 0.3s ease-in-out; }
    a:hover         { color:#333; text-decoration:underline; cursor:pointer; -webkit-transition: 0.3s ease-in-out; -moz-transition: 0.3s ease-in-out; -o-transition: 0.3s ease-in-out; transition: 0.3s ease-in-out; }
    a:active { text-decoration:none; -webkit-transition: 0.3s ease-in-out; -moz-transition: 0.3s ease-in-out; -o-transition: 0.3s ease-in-out; transition: 0.3s ease-in-out; }
    a:before { text-decoration:none; cursor:pointer; -webkit-transition: 0.3s ease-in-out; -moz-transition: 0.3s ease-in-out; -o-transition: 0.3s ease-in-out; transition: 0.3s ease-in-out; }
    .ta-left        { text-align:left !important; }
    .ta-right       { text-align:right !important; }
    .ta-center      { text-align:center !important; }

    .va-top     { vertical-align:top !important; }
    .va-middle  { vertical-align:middle !important; }
    .va-bottom  { vertical-align:bottom !important; }

    .container      { max-width:600px; }

    .loginUp_Header     { width:100%; height:140px; display: flex; align-items:flex-end; justify-content: center; background:#da3832; padding-bottom:60px; }
    .loginDown_Area     { width:100%; max-width:400px; padding:0 20px; margin:-30px auto 0 auto; }
    .loginDown_Footer   { width:100%; max-width:400px; padding:0 20px; margin:20px auto 0 auto; }
    .arex               { width:100%; background:#fff; padding:30px 30px 15px 30px; border-radius:10px; box-shadow: rgba(255, 255, 255, 0.1) 0 1px 1px 0 inset, rgba(50, 50, 93, 0.25) 0 50px 100px -20px, rgba(0, 0, 0, 0.3) 0 30px 60px -30px; }
    .login_area_loading { padding-bottom:15px; }

    .arex h2                        { color:#da3832; font:700 22px 'Gabarito', sans-serif; margin:0; }
    .arex input[type=text]          { width:100%; background:#f2f3f7; border-radius:5px; border:#dfe4ea 1px solid; padding:15px; font:400 14px 'Gabarito', sans-serif; color:#333; margin-bottom:15px; }
    .arex input[type=password]      { width:100%; background:#f2f3f7; border-radius:5px; border:#dfe4ea 1px solid; padding:15px; font:400 14px 'Gabarito', sans-serif; color:#333; margin-bottom:15px; }
    .arex input.RDYM_username       { background:#f2f3f7 url(https://app.radyum.com.tr/images/RDYM_email.png?version=1.0.0) no-repeat calc(100% - 10px) center; }
    .arex input.RDYM_password       { background:#f2f3f7 url(https://app.radyum.com.tr/images/RDYM_password.png?version=1.0.0) no-repeat calc(100% - 10px) center; }
    .RDYM_loginButton   { padding:12px 25px; font:600 14px 'Gabarito', sans-serif; color:#fff; background:#da3832; border:none; border-radius:5px; cursor:pointer; margin-bottom:15px; }


    .alert {
        width: 100%;
        padding: 8px 12px;
        border-radius: 5px;
        border-style: solid;
        border-width: 0px;
        margin: 6px 0;
        font-size: 12px;
    }

    .alert.alert-success {
        background-color: rgba(227, 253, 235, 1);
        border-color: rgba(38, 179, 3, 1);
        color: rgba(60, 118, 61, 1);
    }

    .alert.alert-info {
        background-color: rgba(217, 237, 247, 1);
        color: rgba(49, 112, 143, 1);
        border-color: rgba(126, 182, 193, 1);
    }


    .alert.alert-warning {
        background-color: rgba(252, 248, 227, 1);
        border-color: rgba(177, 161, 129, 1);
        color: rgba(138, 109, 59, 1);
    }

    .alert.alert-danger {
        background-color: rgba(248, 215, 218, 1);
        border-color: rgba(220, 53, 69, 1);
        color: rgba(114, 28, 36,1);
    }

@media (max-width: 900px) {

    .loginUp_Header     { background-size:100%; }

}