body { font-family:'Nunito', sans-serif; }
#box_login {}
#box_login #C_A { z-index:10; position:relative; display:flex; height:100%; background-color:#00aaff; align-items: center; justify-content: center;
    background-image: url("../images/bg-st2.jpg"); background-repeat: no-repeat; background-position: center left -170px; background-size:cover; }
#box_login #C_A .circulo { position:absolute; border-radius:50%; background-color:#ffffff; width:215px; height:215px; right: calc(-215px/2); top: 50%; margin-top: calc(-215px/2); }
#box_login #C_A #logo { width:300px; }
#box_login #C_B { z-index:20; position:relative; display:flex; height:100%; background-color:#ffffff; align-items: center; justify-content: center; }

#form_login { display:block; width:400px; }
#form_login label { font-size: 15px; font-weight: 300; color: #5A5A5A; padding-left: 11px; }
#form_login input { background: #FBFBFB; border: solid 1px #d2d2d2; padding: 25px 13px !important; -webkit-border-radius: 10px; -moz-border-radius: 10px; border-radius: 10px; margin-bottom: 15px; }

.h_100p { height:100%; }
.btn-login {
    width: 100%;
    background: #5b8def;
    width: 100%;
    color: #ffffff;
    display: block;
    padding: 10px;
    text-align: center;
    font-size: 18px;
    font-weight: 600;
    text-decoration: none;
    -webkit-border-radius: 50px;
    -moz-border-radius: 50px;
    border-radius: 50px;
    margin-top: 30px;
    border: solid 1px #5b8def;
}
.btn-login:hover {
    background: #3284ff;
    border: solid 1px #3284ff;
    color: #ffffff;
}

.h4-st1 { margin: 0; padding: 0; font-size: 14px; color: #5A5A5A; font-weight: normal; line-height: 50px; margin-bottom: 20px; }
.h4-st1 strong { font-size:70px; color:#5b8def; font-weight: 900; }

.h_op70:hover { opacity:0.70; -moz-opacity:0.70; filter:alpha(opacity=70); }

.alert-danger { background: #ffd9d9; }

@media(max-width:1200px){
    #box_login #C_A #logo { width:230px; }
}

@media(max-width:900px){
    #form_login { width:300px; }
    #box_login #C_A .circulo { width:150px; height:150px; right: calc(-150px/2); margin-top: calc(-150px/2); }
}

@media(max-width:767px){
    #form_login { width:400px; margin:0 auto; }
    #box_login { }
    #box_login #C_A { display:grid; height:50%; background-position: center left; }
    #box_login #C_B { display:block; min-height:50%; height:auto; align-items: flex-start; padding-top:30px; padding-bottom:30px; }
    #box_login #C_A .circulo { width:100px; height:100px; top: auto; right: 50%; margin-right: calc(-100px/2); bottom: calc(-100px/2); }
}

@media(max-width:550px){
    #form_login { width:100%; padding-left:15px; padding-right:15px; }
}

@media(max-height:630px){
    #box_login #C_A .circulo { display:none; }
}