html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video, h1, h2, h3, h4, h5, h6 {	margin: 0;	padding: 0;	border: 0;	font-size: 100%;	font: inherit;	vertical-align: baseline; box-sizing:border-box; -moz-box-sizing: border-box;  -webkit-box-sizing: border-box; /* 2 */}
*:before, *:after {box-sizing: border-box;-moz-box-sizing: border-box;  -webkit-box-sizing: border-box;}
body{font-family:sans-serif;}


html {
  font-family: sans-serif; 
  -ms-text-size-adjust: 100%; 
  -webkit-text-size-adjust: 100%; 
  -webkit-tap-highlight-color:rgba(0,0,0,0);
  font-size:1em;
  background-color: #031219;
  background-image: url(../imagenes/login_bk.jpg);
   background-repeat: no-repeat;
   background-position: center top;
   background-size: auto 100%;
   width: 100%; 
   height: 100%;
}

a {
  background-color: transparent;
  text-decoration:none;
  width: 100%;
}

a:focus,
a:active,
a:hover {
  outline: 0;
  text-decoration:none;
}

b,
strong {
  font-weight: bold;
}

@font-face {
  font-family: 'Montserrat Thin';
  font-style: normal;
  src: url("Montserrat-Thin.otf");
}
@font-face {
    font-family: 'Gotham Book';
    src: url('gotham-book-webfont.eot');
    src: url('gotham-book-webfont.eot.eot?#iefix') format('embedded-opentype'),
         url('gotham-book-webfont.woff') format('woff'),
         url('gotham-book-webfont.ttf') format('truetype'),
         url('gotham-book-webfont.svg') format('svg');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'Gotham Light';
    src: url('gotham-light-webfont.eot');
    src: url('gotham-light-webfont.eot.eot?#iefix') format('embedded-opentype'),
         url('gotham-light-webfont.woff') format('woff'),
         url('gotham-light-webfont.ttf') format('truetype'),
         url('gotham-light-webfont.svg') format('svg');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'Gotham Medium';
    src: url('gotham-medium-webfont.eot');
    src: url('gotham-medium-webfont.eot.eot?#iefix') format('embedded-opentype'),
         url('gotham-medium-webfont.woff') format('woff'),
         url('gotham-medium-webfont.ttf') format('truetype'),
         url('gotham-medium-webfont.svg') format('svg');
    font-weight: normal;
    font-style: normal;
}

input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
input:-webkit-autofill:active {
    -webkit-box-shadow: 0 0 0px 1000px #031219 inset !important;
    -moz-box-shadow: 0 0 0px 1000px #031219 inset !important;
    background-color: #031219 !important;
    color: #13E5FF !important;
    -webkit-text-fill-color: #13E5FF !important;
}


#signup .text:focus{
	outline:0px;
	color: #13E5FF !important;;
}
input:focus {
   outline: none;
   background-color: transparent !important;
   color: #13E5FF !important;
}

input { color: #13E5FF !important; }

textarea:focus {
   outline: none ;
   color: #13E5FF !important;
}

a,img,input {
	-webkit-transition-property: all;
	-moz-transition-property: all;
	-o-transition-property: all;
	transition-property: all;
	 -webkit-transition: all 0.2s ease;
   -moz-transition: all 0.2s ease;
   -o-transition: all 0.2s ease;
   transition: all 0.2s ease;
   color: #13E5FF !important;
}

.zoomin {
  display: inline-block;
  vertical-align: middle;
  -webkit-transform: perspective(1px) translateZ(0);
  transform: perspective(1px) translateZ(0);
  box-shadow: 0 0 1px transparent;
  -webkit-transition-duration: 0.3s;
  transition-duration: 0.3s;
  -webkit-transform: scale(0.9);
  transform: scale(0.9);
}
.zoomin:hover, .zoomin:focus, .zoomin-in:active {
  -webkit-transform: scale(1.0);
  transform: scale(1.0);
  -webkit-transition-timing-function: cubic-bezier(0.47, 2.02, 0.31, -0.36);
  transition-timing-function: cubic-bezier(0.47, 2.02, 0.31, -0.36);
}

.zoomin2 {
  display: inline-block;
  vertical-align: middle;
  -webkit-transform: perspective(1px) translateZ(0);
  transform: perspective(1px) translateZ(0);
  box-shadow: 0 0 1px transparent;
  -webkit-transition-duration: 0.3s;
  transition-duration: 0.3s;
  -webkit-transform: scale(1.0);
  transform: scale(1.0);
}
.zoomin2:hover, .zoomin:focus, .zoomin:active {
  -webkit-transform: scale(1.1);
  transform: scale(1.1);
  -webkit-transition-timing-function: cubic-bezier(0.47, 2.02, 0.31, -0.36);
  transition-timing-function: cubic-bezier(0.47, 2.02, 0.31, -0.36);
}


.atenua  {
	-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
	filter: alpha(opacity=100);
	-moz-opacity:1.0;
	-khtml-opacity: 1.0;
	opacity: 1.0;
	-webkit-transition-property: all;
	-moz-transition-property: all;
	-o-transition-property: all;
	transition-property: all;
	 -webkit-transition: all 0.2s ease;
   -moz-transition: all 0.2s ease;
   -o-transition: all 0.2s ease;
   transition: all 0.2s ease;
}
.atenua:hover {
	-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=70)";
	filter: alpha(opacity=70);
	-moz-opacity:0.7;
	-khtml-opacity: 0.7;
	opacity: 0.7;
}

.cleaner {
    clear: both !important;
    line-height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    visibility: hidden !important;
}

.centrar { 
   width: auto; 
   height: 100%;
   margin-left: auto;
   margin-right: auto;
}







/*** LOGIN  */

.loginwrapper { 
   position: absolute;	 
   width: 100%; 
   height: 100%;
   display: flex;
   flex-direction: column;
   justify-content: center;
   align-items: center;
   margin-top: -5%;
}
.logologin { 
   width: 410px; 
   height: auto;
   margin-bottom: 50px;
}

@media only screen and (max-width: 650px) { .logologin { width: 350px;  } }
@media only screen and (max-width: 480px) { .logologin { width: 250px;  } }

.linlogin { 
   width: 100%; 
   height: 1px;
   background-image: url(../imagenes/linlogin.png);
   background-repeat: repeat-x;
   background-position: top top;
}

.linloginin { 
   width: 30%; 
   height: 1px;
   margin-left: auto;
   margin-right: auto;
   margin-top: -1px;
   margin-bottom: 50px;
   background-image: url(../imagenes/linlogin2.png);
   background-repeat: repeat-x;
   background-position: top top;
   font-family: 'Gotham Book',sans-serif;
   font-size: 10px;
   color: #9D9EA0;
   text-align: center;
   line-height: 35px;
   text-transform: uppercase;
}

@media only screen and (max-width: 1400px) { .linloginin { width: 40%;   } }
@media only screen and (max-width: 1000px) { .linloginin { width: 50%;   } }
@media only screen and (max-width: 700px) {  .linloginin { width: 60%;   } }
@media only screen and (max-width: 500px) {  .linloginin { width: 80%;   } }
@media only screen and (max-width: 400px) {  .linloginin { width: 90%;   } }

.input_usuario { 
   width: 30%;  
   height: 55px;
   display: flex;
   flex-direction: row;
   justify-content: center;
   align-items: center;
}

@media only screen and (max-width: 1400px) { .input_usuario { width: 40%;   } }
@media only screen and (max-width: 1000px) { .input_usuario { width: 50%;   } }
@media only screen and (max-width: 700px) {  .input_usuario { width: 60%;   } }
@media only screen and (max-width: 500px) {  .input_usuario { width: 80%;   } }
@media only screen and (max-width: 400px) {  .input_usuario { width: 90%;   } }

.input_usuario input{ 
   width: 450px;  
   height: 50px;
   background-image: url(../imagenes/input_usuario.png);
   background-position: bottom left;
   border: none;
   background-color: transparent;
   font-family: 'Gotham Light',sans-serif;
   font-size: 20px;
   color: #13E5FF !important;
   text-align: center;
}

.input_pwd { 
   width: 30%;  
   height: 55px;
   display: flex;
   flex-direction: row;
   justify-content: center;
   align-items: center;
}

@media only screen and (max-width: 1400px) { .input_pwd { width: 40%;   } }
@media only screen and (max-width: 1000px) { .input_pwd { width: 50%;   } }
@media only screen and (max-width: 700px) {  .input_pwd { width: 60%;   } }
@media only screen and (max-width: 500px) {  .input_pwd { width: 80%;   } }
@media only screen and (max-width: 400px) {  .input_pwd { width: 90%;   } }

.input_pwd input{ 
   width: 450px; 
   height: 50px;
   background-image: url(../imagenes/input_pwd.png);
   background-position: bottom left;
   border: none;
   background-color: transparent;
   font-family: 'Gotham Light',sans-serif;
   font-size: 20px;
   color: #13E5FF !important;
   text-align: center;
}

.btn_login { 
   width: 20%;  
   height: auto;
   margin-top: 40px;
   display: flex;
   flex-direction: row;
   justify-content: center;
   align-items: center;
}

@media only screen and (max-width: 1400px) { .btn_login { width: 30%;   } }
@media only screen and (max-width: 1000px) { .btn_login { width: 40%;   } }
@media only screen and (max-width: 700px) {  .btn_login { width: 50%;   } }
@media only screen and (max-width: 500px) {  .btn_login { width: 60%;   } }
@media only screen and (max-width: 400px) {  .btn_login { width: 70%;   } }

.btn_cms { 
   width: 100%;
   height: auto;	  
   background: #18191c;
   background: -moz-linear-gradient(top,  #18191c 0%, #26282d 100%);
   background: -webkit-linear-gradient(top,  #18191c 0%,#26282d 100%);
   background: linear-gradient(to bottom,  #18191c 0%,#26282d 100%);
   filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#18191c', endColorstr='#26282d',GradientType=0 );
   -webkit-border-radius: 20px;
   -moz-border-radius: 20px;
   border-radius: 20px;
   padding: 4px 5px 3px 5px ;
   border-top:1px solid #2F3136;
   border-bottom: 1px solid #383A40;
}

.btn_cms_in { 
   width: 100%;
   height: auto;	  
   background: #6f7482;
   background: -moz-linear-gradient(top,  #6f7482 0%, #474a53 100%);
   background: -webkit-linear-gradient(top,  #6f7482 0%,#474a53 100%);
   background: linear-gradient(to bottom,  #6f7482 0%,#474a53 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#6f7482', endColorstr='#474a53',GradientType=0 );
   -webkit-border-radius: 20px;
   -moz-border-radius: 20px;
   border-radius: 20px;
   padding: 10px 10px 10px 10px ;
   border-top:1px solid #898FA0;
   border-bottom: 1px solid #1C1D21;
   font-family: 'Gotham Medium',sans-serif;
   font-size: 9.5px;
   color: #F5F5F6;
   text-align: center;
   text-transform: uppercase;
   text-shadow:  0px 1px 1px #000000;
   -webkit-transition-property: all;
	-moz-transition-property: all;
	-o-transition-property: all;
	transition-property: all;
	 -webkit-transition: all 0.2s ease;
   -moz-transition: all 0.2s ease;
   -o-transition: all 0.2s ease;
   transition: all 0.2s ease;
}

.btn_cms_in:hover {  color: #13E5FF !important; }


.cabeceratop { 
   width: 100%; 
   height: 5px;
   position: absolute;
   bottom: 0px;
}

.topin { 
   width: 25%; 
   height: 6px;
   float: left;
}

.cl1 {  background-color: #2ab4c6; }
.cl2 {  background-color: #d354af; }
.cl3 {  background-color: #fcd03c; }
.cl4 {  background-color: #b2cf48; }