* {    
    padding:0;
    margin:0;
    box-sizing: border-box;    
    font-family: sans-serif;
}

body{
    background-color: #ebeef2;
}
a {
    color: #006ee0;
    text-decoration: none;
}
a:hover {
    text-decoration: underline;
    cursor:pointer;
}
a:visited  {
    color: blueviolet;
}
.fondo-login{
    background-image: url(assets/imagenes/conta4.jpg);
    background-size: cover;
    width: 100%;
    height:100%;
    z-index: -10;
    top:0;
    left:0;
    display: block;
    position: fixed;
    background-position: center;
}
.float-left{ float:left; }
.loginContainer{
    background-color: rgba(255,255,255, 0.6);
    /* background-image: url('assets/loginfondo2.jpg'); */
    width:550px;
    display:flex;
    flex-direction: column;
    justify-content: space-between;
    box-shadow: 3px 3px 15px black;
    animation-name:aniLogin;
    animation-duration:1s;
    animation-timing-function: ease-out;    
    position: relative;   
    margin-left:30px;
}
.loginContainer paginas {
    width:550px;
    display:flex;
    flex-direction: row;
    justify-content: space-between;
    padding:25px;
}
.loginContainer paginas  pagina{
    display:flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    margin:15px;
}
@keyframes aniLogin {
    0%{
            transform:translateY(-50px)
    }
    100%{
            transform:translateY(0px)
    }    
}
.loginTitulo{
    width:90%;
}
.loginLogotipoContainer{
    width:90%;
	margin:auto;
    margin-top:10px;
    height:150px;
    display:flex;
    justify-content: center;
}
.loginLogotipoImg{        
    height: 150px;
}
.empresaSliderImg{        
    height: 300px;
}

.loginInputs{
    width:100%;
    display:flex;
    flex-direction: column;    
    align-items: center;
}
.loginInputs label{
    font-size: 12px;
    font-style: italic;
    cursor: pointer;
    padding:8px;
    user-select:none;
    touch-callout:none;
}
.loginInputs input {
    width:90%;
    text-align: center;
}
input[type="text"], input[type="password"], input[type="date"], input[type="search"], 
input[type="number"], textarea 
{
    height:30px;
    border-radius: 8px 8px 8px 8px;
    background-color: #FFF;
    padding:4px;
    color:#666;
    border: thin solid #999;
}
select
{
    height:30px;
    border-radius: 8px 8px 8px 8px;
    background-color: white;
    padding:4px;
    color:#666;
    border: thin solid #CCC;
}
input[type="text"]:read-only, input[type="password"]:read-only, input[type="date"]:read-only, 
input[type="search"]:read-only, input[type="number"]:read-only, textarea:read-only
{
    background-color: #EFEFEF;
    border: thin solid #CCC;
}
textarea{
    padding:10px;
}


.loginError{
    width:100%;
    height:60px;
    font-size: 12px;
    color:red;
    font-style: italic;
    text-align: center;
    display:flex;
    justify-content: center;
    align-items: center;
}
.loginSend{
    width:100%;
    padding:20px;
    display:flex;
    justify-content: center;
    align-items: center;
    
}

.loginRadios{
    width:80%;
    margin-top:5px;
    margin-bottom:5px;
    margin-left:10%;
    display:flex;
    flex-direction: column;
    justify-content: center;
    align-items:start;
}

button{    
    background:#4fa8fb;
    color:white;
    padding:3px;
    padding-left:  10px;
    padding-right: 10px;
    border:none;
    cursor:pointer;
    transition-duration: 0.6s;
	
}
button:hover{    
    background:#3b68d9;
    box-shadow: 0px 0px 10px #006ee0;
}
button.active{    
    background-color: #3B5998;
}

.button{    
    background:#4fa8fb;
    color:white;
    padding:5px;
    padding-left:  10px;
    padding-right: 10px;
    border:none;
    cursor:pointer;
    transition-duration: 0.6s;
    display: inline-block;
}
.button:hover{    
    background:#3b68d9;
    box-shadow: 0px 0px 10px #006ee0;
}
.button.active{    
    background-color: #3B5998;
}

.btn{    
    background:#4fa8fb;
    color:white;
    padding:5px;
    padding-left:  15px;
    padding-right: 15px;
    border:none;
    cursor:pointer;
    transition-duration: 0.6s;
    display: block;	
}
.btn:hover{    
    background:#3b68d9;
    box-shadow: 0px 0px 10px #006ee0;
}
.btn.active{    
    background-color: #3B5998;
}

.btnLogin{
    padding:10px;
    color:white;
    padding-left:50px;
    padding-right:50px;
}


.sliderContainer{
    width:100%;
    height:100%;
    z-index: -1;
    top:0;
    left:0;
    position:fixed;
    overflow: hidden;
    background-repeat:no-repeat;
    background-position:center;
    background-size:cover;
    background-attachment:fixed;
    background-image: none;
    
    
    transition:         background-image 4s ease;
    -moz-transition:    background-image 4s ease;
    -webkit-transition: background-image 4s ease;
    
    
}
.slideW{
    width:125%;      
}
.slideH{
    height: 125%;
}
.background-color-gray{  background-color: gray; }
.background-color-white{  background-color: white !important; }
.background-color-black{  background-color: black; }
.background-color-red{  background-color: red !important; }
.background-color-green{  background-color: green !important; }
.background-color-blue{  background-color: blue; }
.background-color-blue-light{  background-color: lightskyblue; }
.background-color-lime{  background-color: lime !important; }
.background-color-btnazul{  background-color: #4fa8fb; }
.background-color-gray-hover:hover{  background-color: #CCC; }
.background-color-white-hover:hover{  background-color: white; }
.background-color-black:hover{  background-color: black; }
.background-color-red-hover:hover{  background-color: red; }
.background-color-orange{  background-color: orange; }
.background-color-orange-hover:hover{  background-color: orange; }
.background-color-blue-hover:hover{  background-color: blue; }
.background-color-lime:hover{  background-color: lime; }
.background-color-yellow{  background-color: yellow; }
.background-color-btnazul-hover{  background-color: #4fa8fb; }
.color-white{ color:white !important;}
.color-black{ color:black !important;}
.color-red{ color:red !important;}
.color-blue{ color:blue !important;}
.color-lime{ color:lime !important;}
.color-gray{ color:gray !important;}
.color-grey{ color:grey !important;}
.color-green{ color:green !important;}

.slides{
    transition-duration: 0.5s;
    display:none;
}
@media only screen and (max-width: 810px) {
    .loginContainer{
        width:350px;
            position: relative;   
            margin-left:50%;
    }
    

    .loginContainer paginas{
        flex-direction: column;
        width:350px;
    }
    .loginContainer paginas  pagina{
        width:250px;
    }
    
}
@media screen and (min-width:320px) and (max-width:767px) and (orientation:portrait) {

    .loginLogotipoImg{
        height: 75px;
    }
    .empresaSliderImg{
        height:125px;
    }
    .loginLogotipoContainer{
        height: 75px;
    } 
    .slideW{
        height: 125%;    
        width:auto;
    }
    .slideH{
        width: 125%;
        height:auto;
    }    
     
}
@media only screen and (max-width: 600px) {
    body {
      background-color: lightblue;
    }  
    h1{
        font-size:18px;
    }  

    .loginContainer{
        width: 300px;
        padding:0px;
        margin-left:auto;
    }
    .loginContainer paginas{
        flex-direction: column;
        padding:0px;
    }    
    .loginContainer paginas pagina{
        width:270px;
    }
    .btn{    
        padding:2px;
        padding-left:  4px;
        padding-right: 4px;
    }
}
.fadeSlider {
  -webkit-animation-name: fadeSlider;
  -webkit-animation-duration: 1.5s;
  animation-name: fadeSlider;
  animation-duration: 1.5s;
}

@-webkit-keyframes fadeSlider {
  from {opacity: .1} 
  to {opacity: 1}
}

@keyframes fadeSlider {
  from {opacity: .1} 
  to {opacity: 1}
}


.text-align-center  { text-align: center !important;}
.text-align-left    { text-align: left !important;}
.text-align-right    { text-align: right !important;}

.font-size-8{  font-size: 8px;}
.font-size-10{ font-size: 10px;}
.font-size-12{ font-size: 12px;}
.font-size-14{ font-size: 14px;}
.font-size-16{ font-size: 16px;}
.font-size-18{ font-size: 18px;}
.font-size-20{ font-size: 20px;}
.font-size-22{ font-size: 22px;}
.font-size-24{ font-size: 24px;}
.font-size-26{ font-size: 26px;}
.font-size-28{ font-size: 28px;}
.font-size-30{ font-size: 30px;}
.font-size-32{ font-size: 32px;}
.font-size-34{ font-size: 34px;}
.font-size-36{ font-size: 36px;}
.font-size-38{ font-size: 38px;}
.font-size-40{ font-size: 40px;}
.font-size-42{ font-size: 42px;}
.font-size-44{ font-size: 44px;}
.font-size-46{ font-size: 46px;}
.font-size-48{ font-size: 48px;}
.font-size-50{ font-size: 50px;}
.font-bold{ font-weight: bold; }
.font-weight-bold{   font-weight: bold !important; }
.font-weight-normal{ font-weight: normal !important; }

.contenedorV{
    display:flex;
    flex-direction: column;
    width:100%;
    height:100%;
}
.contenedorH{
    display:flex;
    flex-direction: row;
    width:100%;
    height:100%;
}


.maestrosHeader{
    height: 50px;
    background-color: #FFF;
    border-bottom: thin solid #CCC;
    display:flex;
    justify-content: space-between;
}

.flex-end { justify-content: flex-end;}
.flex-wrap { flex-wrap: wrap;}
.flex-direction-column { flex-direction: column;}
.flex-direction-row { flex-direction: row;}
.justify-content-center { justify-content: center;}
.justify-content-space { justify-content: space-between;}
.align-items-center { align-items: center;}

.contenedor-top {
    width:100%;
    min-height:65px;
    background-color: rgba(250,251,252,0.9);
    display:flex;
    top:0;
    left:0;
    border-bottom: thin solid  rgba(200,200,200, 1);
    padding:10px;
}

.text-decoration-underline-only-hover {
    text-decoration: none;
}
.text-decoration-none  {
    text-decoration: none;
}
.text-decoration-underline-only-hover:hover {
    text-decoration: underline;
}

#btnShowPanel{ display: none;  }

.cursor-pointer{ cursor:pointer;}
.padding-1{ padding: 1px !important; }
.padding-2{ padding: 2px !important; }
.padding-3{ padding: 3px !important; }
.padding-4{ padding: 4px !important; }
.padding-5{ padding: 5px !important; }
.padding-6{ padding: 6px !important; }
.padding-7{ padding: 7px !important; }
.padding-8{ padding: 8px !important; }
.padding-9{ padding: 9px !important; }
.padding-10{ padding: 10px !important;  }
.padding-15{ padding: 15px !important; }
.padding-20{ padding: 20px !important; }
.padding-25{ padding: 25px !important; }
.padding-30{ padding: 30px !important; }
.padding-35{ padding: 35px !important; }
.padding-40{ padding: 40px !important; }
.padding-45{ padding: 45px !important; }
.padding-50{ padding: 50px !important; }

.padding-left-1{  padding-left: 1px !important; }
.padding-left-2{  padding-left: 2px !important; }
.padding-left-3{  padding-left: 3px !important; }
.padding-left-4{  padding-left: 4px !important; }
.padding-left-5{  padding-left: 5px !important; }
.padding-left-6{  padding-left: 6px !important; }
.padding-left-7{  padding-left: 7px !important; }
.padding-left-8{  padding-left: 8px !important; }
.padding-left-9{  padding-left: 9px !important; }
.padding-left-10{ padding-left: 10px !important;  }
.padding-left-15{ padding-left: 15px !important; }
.padding-left-20{ padding-left: 20px !important; }
.padding-left-25{ padding-left: 25px !important; }
.padding-left-30{ padding-left: 30px !important; }
.padding-left-35{ padding-left: 35px !important; }
.padding-left-40{ padding-left: 40px !important; }
.padding-left-45{ padding-left: 45px !important; }
.padding-left-50{ padding-left: 50px !important; }

.padding-right-1{  padding-right: 1px !important; }
.padding-right-2{  padding-right: 2px !important; }
.padding-right-3{  padding-right: 3px !important; }
.padding-right-4{  padding-right: 4px !important; }
.padding-right-5{  padding-right: 5px !important; }
.padding-right-6{  padding-right: 6px !important; }
.padding-right-7{  padding-right: 7px !important; }
.padding-right-8{  padding-right: 8px !important; }
.padding-right-9{  padding-right: 9px !important; }
.padding-right-10{ padding-right: 10px !important;  }
.padding-right-15{ padding-right: 15px !important; }
.padding-right-20{ padding-right: 20px !important; }
.padding-right-25{ padding-right: 25px !important; }
.padding-right-30{ padding-right: 30px !important; }
.padding-right-35{ padding-right: 35px !important; }
.padding-right-40{ padding-right: 40px !important; }
.padding-right-45{ padding-right: 45px !important; }
.padding-right-50{ padding-right: 50px !important; }

.padding-top-1{ padding-top: 1px; }
.padding-top-2{ padding-top: 2px; }
.padding-top-3{ padding-top: 3px; }
.padding-top-4{ padding-top: 4px; }
.padding-top-5{ padding-top: 5px; }
.padding-top-6{ padding-top: 6px; }
.padding-top-7{ padding-top: 7px; }
.padding-top-8{ padding-top: 8px; }
.padding-top-9{ padding-top: 9px; }
.padding-top-10{ padding-top: 10px; }
.padding-top-15{ padding-top: 15px; }
.padding-top-20{ padding-top: 20px; }
.padding-top-25{ padding-top: 25px; }
.padding-top-30{ padding-top: 30px; }
.padding-top-35{ padding-top: 35px; }
.padding-top-40{ padding-top: 40px; }
.padding-top-45{ padding-top: 45px; }
.padding-top-50{ padding-top: 50px; }

.margin-left-1 { margin-left:1px;  }
.margin-left-2 { margin-left:2px;  }
.margin-left-3 { margin-left:3px;  }
.margin-left-4 { margin-left:4px;  }
.margin-left-5 { margin-left:5px;  }
.margin-left-6 { margin-left:6px;  }
.margin-left-7 { margin-left:7px;  }
.margin-left-8 { margin-left:8px;  }
.margin-left-9 { margin-left:9px;  }
.margin-left-10 { margin-left:10px;  }
.margin-left-11 { margin-left:11px;  }
.margin-left-12 { margin-left:12px;  }
.margin-left-13 { margin-left:13px;  }
.margin-left-14 { margin-left:14px;  }
.margin-left-15 { margin-left:15px;  }
.margin-left-16 { margin-left:16px;  }
.margin-left-17 { margin-left:17px;  }
.margin-left-18 { margin-left:18px;  }
.margin-left-19 { margin-left:19px;  }
.margin-left-20 { margin-left:20px;  }
.margin-left-21 { margin-left:21px;  }
.margin-left-22 { margin-left:22px;  }
.margin-left-23 { margin-left:23px;  }
.margin-left-24 { margin-left:24px;  }
.margin-left-25 { margin-left:25px;  }
.margin-left-26 { margin-left:26px;  }
.margin-left-27 { margin-left:27px;  }
.margin-left-28 { margin-left:28px;  }
.margin-left-29 { margin-left:29px;  }
.margin-left-30 { margin-left:30px;  }
.margin-left-31 { margin-left:31px;  }
.margin-left-32 { margin-left:32px;  }
.margin-left-33 { margin-left:33px;  }
.margin-left-34 { margin-left:34px;  }
.margin-left-35 { margin-left:35px;  }
.margin-left-36 { margin-left:36px;  }
.margin-left-37 { margin-left:37px;  }
.margin-left-38 { margin-left:38px;  }
.margin-left-39 { margin-left:39px;  }
.margin-left-40 { margin-left:40px;  }
.margin-left-41 { margin-left:41px;  }
.margin-left-42 { margin-left:42px;  }
.margin-left-43 { margin-left:43px;  }
.margin-left-44 { margin-left:44px;  }
.margin-left-45 { margin-left:45px;  }
.margin-left-46 { margin-left:46px;  }
.margin-left-47 { margin-left:47px;  }
.margin-left-48 { margin-left:48px;  }
.margin-left-49 { margin-left:49px;  }
.margin-left-50 { margin-left:50px;  }
.margin-left-55 { margin-left:55px;  }
.margin-left-60 { margin-left:60px;  }

.margin-bottom-5 { margin-bottom:5px;  }
.margin-bottom-10 { margin-bottom:10px;  }
.margin-bottom-15 { margin-bottom:15px;  }
.margin-bottom-20 { margin-bottom:20px;  }
.margin-bottom-25 { margin-bottom:25px;  }
.margin-bottom-30 { margin-bottom:30px;  }
.margin-bottom-35 { margin-bottom:35px;  }
.margin-bottom-40 { margin-bottom:40px;  }
.margin-bottom-45 { margin-bottom:45px;  }
.margin-bottom-50 { margin-bottom:50px;  }
.margin-bottom-55 { margin-bottom:55px;  }
.margin-bottom-60 { margin-bottom:60px;  }


.margin-top-5 { margin-top:5px;  }
.margin-top-10 { margin-top:10px;  }
.margin-top-15 { margin-top:15px;  }
.margin-top-20 { margin-top:20px;  }
.margin-top-25 { margin-top:25px;  }
.margin-top-30 { margin-top:30px;  }
.margin-top-35 { margin-top:35px;  }
.margin-top-40 { margin-top:40px;  }
.margin-top-45 { margin-top:45px;  }
.margin-top-50 { margin-top:50px;  }
.margin-top-55 { margin-top:55px;  }
.margin-top-60 { margin-top:60px;  }

.margin-1 { margin:1px;  }
.margin-2 { margin:2px;  }
.margin-3 { margin:3px;  }
.margin-4 { margin:4px;  }
.margin-5 { margin:5px;  }
.margin-10 { margin:10px;  }
.margin-15 { margin:15px;  }
.margin-20 { margin:20px;  }
.margin-25 { margin:25px;  }
.margin-30 { margin:30px;  }
.margin-35 { margin:35px;  }
.margin-40 { margin:40px;  }
.margin-45 { margin:45px;  }
.margin-50 { margin:50px;  }
.margin-55 { margin:55px;  }
.margin-60 { margin:60px;  }


.width-100{ 	width:100%; }
.width-96{ 	width:96%; }
.width-95{ 	width:95%; }
.width-90{ 	width:90%; }
.width-85{ 	width:85%; }
.width-80{ 	width:80%; }
.width-10px{ 	width:10px; }
.width-15px{ 	width:15px; }
.width-20px{ 	width:20px; }
.width-25px{ 	width:25px; }
.width-30px{ 	width:30px; }
.width-35px{ 	width:35px; }
.width-40px{ 	width:40px; }
.width-45px{ 	width:45px; }
.width-50px{ 	width:50px; }
.width-55px{ 	width:55px; }
.width-60px{ 	width:60px; }
.width-65px{ 	width:65px; }
.width-70px{ 	width:70px; }
.width-75px{ 	width:75px; }
.width-80px{ 	width:80px; }
.width-85px{ 	width:85px; }
.width-90px{ 	width:90px; }
.width-95px{ 	width:95px; }
.width-100px{ 	width:100px; }
.width-110px{ 	width:110px; }
.width-120px{ 	width:120px; }
.width-130px{ 	width:130px; }
.width-140px{ 	width:140px; }
.width-150px{ 	width:150px; }
.width-175px{ 	width:175px; }
.width-200px{ 	width:200px; }
.width-250px{ 	width:250px; }
.width-300px{ 	width:300px; }
.width-350px{ 	width:350px; }
.width-400px{ 	width:400px; }
.width-450px{ 	width:450px; }
.width-500px{ 	width:500px; }
.width-550px{ 	width:550px; }
.width-600px{ 	width:600px; }
.width-650px{ 	width:650px; }
.width-auto { width:auto;}

.height-100{ 	height:100%; }
.height-96{ 	height:96%; }
.height-95{ 	height:95%; }
.height-90{ 	height:90%; }
.height-85{ 	height:85%; }
.height-80{ 	height:80%; }

.height-10px{ 	height:10px; }
.height-15px{ 	height:15px; }
.height-20px{ 	height:20px; }
.height-25px{ 	height:25px; }
.height-30px{ 	height:30px; }
.height-35px{ 	height:35px; }
.height-40px{ 	height:40px; }
.height-45px{ 	height:45px; }
.height-50px{ 	height:50px; }
.height-55px{ 	height:55px; }
.height-60px{ 	height:60px; }
.height-65px{ 	height:65px; }
.height-70px{ 	height:70px; }
.height-75px{ 	height:75px; }
.height-80px{ 	height:80px; }
.height-85px{ 	height:85px; }
.height-90px{ 	height:90px; }
.height-95px{ 	height:95px; }
.height-100px{ 	height:100px; }
.height-110px{ 	height:110px; }
.height-120px{ 	height:120px; }
.height-130px{ 	height:130px; }
.height-140px{ 	height:140px; }
.height-150px{ 	height:150px; }
.height-200px{ 	height:200px; }
.height-250px{ 	height:250px; }
.height-300px{ 	height:300px; }
.height-350px{ 	height:350px; }
.height-400px{ 	height:400px; }
.height-450px{ 	height:450px; }
.height-500px{ 	height:500px; }

.min-height-5{          min-height:5px; }
.min-height-10{ 	min-height:10px; }
.min-height-15{ 	min-height:15px; }
.min-height-20{ 	min-height:20px; }
.min-height-25{ 	min-height:25px; }
.min-height-30{ 	min-height:30px; }
.min-height-35{ 	min-height:35px; }
.min-height-40{ 	min-height:40px; }
.min-height-45{ 	min-height:45px; }
.min-height-50{ 	min-height:50px; }
.min-height-55{ 	min-height:55px; }
.min-height-60{ 	min-height:60px; }
.min-height-65{ 	min-height:65px; }
.min-height-70{ 	min-height:70px; }
.min-height-75{ 	min-height:75px; }
.min-height-80{ 	min-height:80px; }
.min-height-85{ 	min-height:85px; }
.min-height-90{ 	min-height:90px; }
.min-height-95{ 	min-height:95px; }
.min-height-100{ 	min-height:100px; }
.min-height-150{ 	min-height:150px; }
.min-height-200{ 	min-height:200px; }
.min-height-250{ 	min-height:250px; }
.min-height-300{ 	min-height:300px; }
.min-height-400{ 	min-height:400px; }

.min-width-100{ 	min-width:100px; }
.min-width-150{ 	min-width:150px; }
.min-width-175{ 	min-width:175px; }
.min-width-200{ 	min-width:200px; }
.min-width-250{ 	min-width:250px; }
.min-width-300{ 	min-width:300px; }
.min-width-325{ 	min-width:325px; }
.min-width-350{ 	min-width:350px; }
.min-width-375{ 	min-width:375px; }
.min-width-400{ 	min-width:400px; }
.min-width-425{ 	min-width:425px; }
.min-width-450{ 	min-width:450px; }
.min-width-475{ 	min-width:475px; }
.min-width-500{ 	min-width:500px; }


.max-width-100{ max-width:400px; }
.max-width-200{ max-width:200px; }
.max-width-300{ max-width:300px; }
.max-width-400{ max-width:400px; }
.max-width-500{ max-width:500px; }
.max-width-600{ max-width:600px; }
.max-width-700{ max-width:700px; }
.max-width-800{ max-width:800px; }



#idemCerrarMenuPanel{ display: none;}

.display-flex{ display:flex; }
.display-block{ display:block; }
.align-items-center { align-items: center; }

.space-between{ justify-content: space-between }
.divContainerBase{
    width:100%;
	display:flex;
	flex-direction:column;
	align-items:center;
	
}
.table{
	width:80%;
}
.dvRow {
    display:flex;
    flex-direction: column;
	width:100%;
	margin-top:3px;
	margin-bottom:3px;
	
}
.dvRow button {
}
.divContainerBase label {
        width:95%;
}
.divContainerBase input {
        width:95%;
}

.divDocenteImagenPerfil{
    height:250px;
    width:100%;
}
.divDocenteImagenPerfil img {
    border-radius: 50%;
    border: thin solid #aaa;
    height: 250px;
    width:250px;
}

.espacios-1 { width: 100%; height: 20px !important;}
.espacios-2 { width: 100%; height: 40px !important;}
.espacios-3 { width: 100%; height: 60px !important;}
.espacios-4 { width: 100%; height: 80px !important;}
.espacios-5 { width: 100%; height: 100px !important;}
.espacios-6 { width: 100%; height: 120px !important;} 
.espacios-7 { width: 100%; height: 140px !important;}
.espacios-8 { width: 100%; height: 160px !important;}
.espacios-9 { width: 100%; height: 180px !important;}
.espacios-10{ width: 100%; height: 200px !important;}



.font-style-normal{ font-style:normal;}
.font-style-italic{ font-style:italic;}
.font-color-red { color:red;}
.font-color-blue { color:blue;}
.font-color-green { color:green;}
.font-color-lime { color:lime;}
.font-color-gray { color:#999;}
.font-color-grey { color:#CCC;}
.divStaticDown{
	width:100%;
	height:50px;
	background-color:white;
	border-top:thin solid #666;
	position:fixed;
	bottom:0px;
	padding:5px;
	transition-duration:0.5s;
	display:none;
}

.btn-menu{
  padding:8px;
  padding-left: 12px;
  padding-right: 12px;
  background-color: #ebeef2;
  color: black;
  font-size: 12px;
  cursor: pointer;
  border-radius: 10px;
  transition-duration: 0.6s;    
  position: relative;
  display: inline-block;
}
.btn-menu:hover {
  background-color: #4fa8fb;
  color:white;
}  
.btn-menu label {
    margin-right: 13px;
  cursor: pointer;
}

h1{ color: #333;}
h2{ color: #666;}
h3{ color: #999;}


.customFileUpload {
    display: inline-block;
    padding: 6px 12px;
    cursor: pointer;

    color:white;
    padding:5px;
    padding-left:  15px;
    padding-right: 15px;
    border:none;
    font-size:14px;
    text-align:center;
}

.loading{
	width:100%;
	height:100%;
	top:0;
	left:0;
	display:flex;
	position:absolute;
	align-items:center;
	justify-content:center;	
	background-color:rgba(200,200,200,0.6);
	z-index:36;
	display:none;
}
.imgLoading{
	background-image:url(9c969972f31be24de51532534aada5c1/app/loadings/loading.gif);
	width:414px;
	height:233px;	
	background-position:center;
}
input[type="file"] {
    display: none;
}
.border-1{
    border: thin solid #666;
}
.label-link{
    color: dodgerblue;
}
.label-link:hover{
    color:#006ee0;
    cursor:pointer;
    text-decoration: underline;
    display: block;
    min-width: 10px !important;
}

.banda-anotacion{
    display: flex;
    position: fixed;
    justify-content: center;
    left:0;
    bottom: 0;
    width:100%;
    height: 50px;
    background:white;
    border: thin solid black;
    border-bottom:none;
    padding: 5px;
    z-index:11;
}
.lbl-imagen{
    display:block;
    width:100px;
    height:100px;
}
.lbl-imagen img {
    z-index:0;
    position:absolute;    
}
.lbl-imagen button {
    z-index:1;
    position:absolute;  
    margin-left:35px;
    margin-top:35px;

}

.input-container {
    display: -ms-flexbox; /* IE10 */
    display: flex;
    width: 100%;
    margin-bottom: 15px;
}
.input-container  i {
    padding: 8px;
    background: dodgerblue;
    color: white;
    min-width: 30px;
    font-size: 12px;
    height: 30px;
    text-align: center;
    cursor:pointer;
    border-top:     thin solid #333 !important;
    border-left:   thin solid #333 !important;
    border-bottom:  thin solid #333 !important;    
}
.input-container input[type="text"], input[type="password"] {
    width: 100%;
    padding: 5px;
    padding-left:20px;
    padding-right:20px;
    outline: none;
    margin:0px;
    border-top:     thin solid #333 !important;
    border-right:   thin solid #333 !important;
    border-bottom:  thin solid #333 !important;
    border-radius: 0px;
}
.input-container input[type="text"]:focus {
    border: 2px solid dodgerblue;
}

@media print{
    .no-print{
        display:none;
    }
}
@media print{    
    .no-print, .no-print *, button, .button
    {
        display: none !important;
    }
}
.break-word{
    word-break: break-word;
     word-wrap: break-word;
}
.info{
    color:red !important;
    font-size: 10;
}
.topNavegacion{
    width:100%;
    padding:5px;
}
.topNavegacion a, label {
    padding  : 10px;
    padding-top:5px;
}
.folder{
    display: flex;
    flex-direction: row;
}
.folder .pestania{
    width:85px;
    height: 75px;
    background-color: #4fa8fb;
    color:black;
    margin-left:10px;
    margin-top: 20px;
    border-radius:              10px 0px 0px 10px;
    -moz-border-radius:         10px 0px 0px 10px;
    -web-kit-border-radius:     10px 0px 0px 10px;
    padding:10px;
    justify-content: center;
    align-items: center;
    display:flex;
    box-shadow: 2px 1px 5px black;
    z-index: 0;
}
.folder .container{
    width:100%;
    min-height: 125px;
    
    border-radius:              0px 10px 10px 10px;
    -moz-border-radius:         0px 10px 10px 10px;
    -web-kit-border-radius:     0px 10px 10px 10px;
    background-color: #DDD;
    color:white;
    margin-right: 10px;
    margin-top: 20px;
    padding:20px;
    justify-content: center;
    align-items: center;
    display:flex;
    box-shadow: 3px 1px 5px black;
    z-index: 1;
}
.divTop{
    width:100%;
    height:30px;
    background-color: black;
    color:white;
    display:flex;
    justify-content: space-between;
}
.divTopT{
    width:100%;
    height:30px;
    background-color: transparent;
    color:#666;
    display:flex;
    justify-content: space-between;
    font-size: 22px;
    font-weight: bold;
}
.hiddenDiv{
    display: none;
}
.foto-usuario{
    width: 200px;
    height: auto;
    border: thin solid #ccc;
    cursor: pointer;
    border-radius: 50%;
    box-shadow: 3px 3px 10px gray;       
}
.foto-usuario-50{
    width: 50px;
    height: auto;
    border: thin solid #ccc;
    cursor: pointer;
    border-radius: 50%;
    box-shadow: 3px 3px 10px gray;       
}
.foto-usuario-75{
    width:  75px;
    height: auto;
    border: thin solid #ccc;
    cursor: pointer;
    border-radius: 50%;
    box-shadow: 3px 3px 10px gray;       
}
.gar-div-img{
	width:auto;
	max-width:96% !important;
	height:400px;
	border:thin solid black;
	overflow:hidden;
	display:flex;
	justify-content:center;
}
.gar-div-img img{
	height:96% !important;
	width:auto !important;
	border-radius:10%;
}
.logo{
    width:100px !important;
}
.logo img {
    max-width: 100%;
}
.div-animada1{
    animation-name: aniContenedorCentral;
    animation-duration: 0.6s;
    animation-timing-function: ease;
    position: relative;    
}
@keyframes aniContenedorCentral{
    from{ top:20px;}
    to{top:0px;}
}
.div-info-modal{
    display: flex;
    position: fixed;
    width:100%;
    height:100%;
    top: 0;
    left:0;
    background-color: rgba(0,0,0,0.8);
    z-index: 100000;
    flex-direction: column;
    animation-name: aniContenedorCentral;
    animation-duration: 0.6s;
    animation-timing-function: ease;    

}
@keyframes ani-div-modal {
    from{ top:20px;}
    to{ top:0px;}
}
.div-info-modal titulo {
    width:100%;
    height:30px;
    background-color: white;
    display: flex;
}
.div-info-modal titulo label {
    flex:1;
    font-size:18px;
    
}
.div-info-modal titulo button {
    
}
.div-info-modal content {
    display: flex;
    height: 100%;
    width:100%;
    justify-content: center;
    align-items: center;
    color: white;
    font-size: 20px;
}

.div-dev{
    display: flex;
    flex-direction: column;
    position: relative;
    width:100%;
    padding:0px;
    background-color: black;
    color:white;
    bottom:0;
    height:100%;
    overflow: hidden;
    z-index:500;
}
.div-dev titulo{
    height:50px;
    width:100%;
    background-color: #333;
    padding:8px;
}
.div-dev contenido{
    display:flex;
    flex:1;
    padding:10px;
    overflow-y: scroll;
    flex-direction: column;
}