﻿
@font-face {
    font-family: AlegreyaThin;
    src: url(../font/AlegreyaSansSC-Thin.otf) format("opentype");
}
@font-face {
    font-family: sesation-light;
    src: url(../font/Sansation_Light.ttf);
}

@font-face {
    font-family: geosans-light;
    src: url(../font/GeosansLight.ttf);
}

* {
    box-sizing: border-box;
}

*:focus {
	outline: none;
}
body {
    font-family: Arial;
    background-color: #3498DB;
    padding: 50px;
}


/*Styles para Login AOL*/
.backgroundLogin {
    background:url('') no-repeat fixed center;
    background-size:cover;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
}

.backColor {
    background:rgb(241, 217, 171);
    width:100%;
    height:100%;
    position:absolute;

}

body, html {
    background:gray;
    margin:0;
    padding:0;
}

#bg {
    width: 100%; 
    height: 100%;
    z-index:10;
    position: absolute; 
    top: 0; 
    left: 0; 
    right: 0; 
    bottom: 0; 
    margin: auto; 
    min-width: 50%;
    min-height: 50%;
    background-size: cover !important;
   
}



.frontbackground {
   /*background:rgba(241,217,171,0.5);*/ 
    width:100%;
    height:100%;
    position:absolute;
    z-index:11;
}
.box-login-pie {
    width: 24.5em;    
    position:relative;
    top:96%;
    left:5%;
    border-radius:10px;
    margin:-12em 0 0;
    padding:7px;
}

.box-login {
    width: 24.5em;
    height:22.625em;
    position:absolute;
    top:36%;
    left:5%;
    border-radius:10px;
    margin:-12em 0 0;
    box-shadow: 0px 0px 0px 100vw rgba(255,255,255,0.60);
    -webkit-box-shadow: 0px 0px 0px 100vw rgba(255,255,255,0.60);
    -moz-box-shadow: 0px 0px 0px 100vw rgba(255,255,255,0.60);
    padding:7px;
}

.into-box-login {
    background:rgba(13, 142, 235, 0.9);
    width:100%;
    height:100%;
    position:relative;
    border-radius:10px;
    padding:5px;
}

.into-box-login h3{
    text-align:center;
    color:#145373;
    font-weight:lighter;
    font-size:22px;
}

.into-box-login p {
    text-align:center;
    color:#145373;
}

.logo-aol {
    right:5em;
    top:40%;
    position:absolute;
    z-index: 12;
    width:334px;
}

.logo-aol img {
    /*width:100%;*/
}



.into-box-login input {
    width:80%;
    border-radius:5px;
    margin-left:35px;
    border:2px solid gray;
    padding-left:15px;
    height:30px;
    color:#145373;
}

.btnLogin {    
    /* margin-top: -400px !important; */
    width:30% !important;
    margin:0 auto !important;
    font-family:FontAwesome,Arial;
    font-weight:lighter;    
    font-size: 14px !important;    
    /*border:2px solid #335c26 !important;*/
    border: 2px solid #154f73 !important;
    height: 40px !important;
    cursor:pointer;
    /* color:#154f73 !important;     */
    /* background:#1eaace; */
    color:#ffffff !important;    
    background:#D0581C;
}
.btnLogin:hover {
    width:30% !important;
    margin:0 auto !important;
    font-family:FontAwesome,Arial;
    font-weight:lighter;    
    font-size: 14px !important;    
    /*border:2px solid #335c26 !important;*/
    border: 2px solid #154f73 !important;
    height: 40px !important;
    cursor:pointer;
    color:#ffffff !important;
    background:	#FCC40D;
    transition: background 0.5s, color 0.5s;
}

/* .btn:link,
.btn:visited,
input[type=submit]{
    display: inline-block;
    padding: 10px 30px;
    font-weight: 300;    
    text-decoration: none;
    border-radius: 200px;
    -webkit-transition: background-color 0.5s, border 0.5s, color 0.5s;
    transition: background-color 0.5s, border 0.5s, color 0.5s;
}

.btn:hover,
.btn:active,
input[type=submit]:hover,
input[type=submit]:active{
    background-color: #cf6d17;
} */

.footer-login {
    bottom:0;
    position:fixed;
    width:100%;
    height:57px;
    background:rgb(56,56,56);
    box-shadow:inset 0px 4px 10px #5d5a5a;
}

.footer-login-credits {
    float:right;
}

.footer-login-credits img{
    width:90px;
    margin-top:13px;
}


.into-footer-login {
    width:100%;
    height:100%;
    background:rgb(56, 56, 56);
    color:white;
    font-size:9px;
    text-align:right;
}

.into-footer-login i{
    margin-top:16px;
}


hr.style7 {
    border-top: 1px solid #ffffff;
    border-bottom: 1px solid #D0581C;
    width: 80%;
    margin-bottom: -5px;
    border: 0; 
    height: 1px; 
    background-image: -webkit-linear-gradient(left, #D0581C, #ffffff, #D0581C);
    background-image: -moz-linear-gradient(left, #D0581C, #ffffff, #D0581C);
    background-image: -ms-linear-gradient(left, #D0581C, #ffffff, #D0581C);
    background-image: -o-linear-gradient(left, #D0581C, #ffffff, #D0581C); 
}

.msgErrorLogin {
    position: absolute;
    color: white;
    font-size: 10px;
    text-align: center;
    width: 100%; 

}

.validation-summary-errors ul{
    list-style-type:none;   
    padding:0;
    margin:0;
}

#imgLogo {
min-width:280px;
}

.img-circular{
    width:50px;
    height:50px;
}

.hidden {
    visibility:hidden;
}

.text-blue {
    color:#0063AC;    
}

.text-yellow {
    color:#D0581C;
    font-size:12px;                    
}

/* JUAN */
.background-blue {
    background-color: rgb(9, 128, 212);
}

.background-yellow {
    background-color: #f8a602;
}

.border-rounded {
    border:2px solid inherit;
    border-radius:5px;
}

.padding-top-5 {
    padding-top: 5px;
}

.padding-bottom-5 {
    padding-bottom: 5px;
}

.padding-top-15 {
    padding-top: 15px;
}

.padding-bottom-10 {
    padding-bottom: 10px;
}

.margin-top-10 {
    margin-top: 10px;
}

.margin-bottom-10 {
    margin-bottom: 10px;
}

.margin-top-20 {
    margin-top: 20px;
}

.margin-bottom-20 {
    margin-bottom: 20px;
}

.margin-top-40 {
    margin-top: 40px;
}

.margin-bottom-40 {
    margin-bottom: 40px;
}

.margin-top-5 {
    margin-top: 5px;
}

.into-bottom {
    margin-top: -6px;
    border-bottom: 38px solid #eac444;
    border-left: 358px solid transparent;
}

@media screen and (max-width: 1070px) {
    .box-login  {
        margin:0 auto;
        top: 124px;
        right:0px;
        position:relative;
        left:0;
    }
    .box-login-pie  {
        margin:0 auto;
        top: 124px;
        right:0px;
        position:relative;
        left:0;
    }
    .logo-aol {
        margin: 0px auto;
        top: 7px;
        width: 100%;
        left:0;
        position:absolute;
    }
    #tetxFoot {
        position:fixed;
        padding-right: 113px;
    }
    .into-footer-login {
        text-align:center;
        vertical-align:middle;
    }
    .logo-aol img {
        max-height: 81px;
        min-width: 0px !important;
        min-width: 0px !important;
        margin: 0 auto;
        display: block;
        margin-top: 17px;
    }
    .footer-login-credits {
        float:none;
        margin:0 auto;
        text-align:center;
        vertical-align:middle;
    }
}
