@charset "utf-8";
/* CSS Document */


body { background:url(../img/bg.png) repeat-x top #CCC; margin:0px; font-family:Arial, Helvetica, sans-serif;}
#header{ max-width:710px; width:100%; margin:auto; height:80px; position:relative;}
#logohead{ position:absolute; left:5px;}
#maincontainer{ max-width:710px; width:100%; margin:auto; background-color:#FFFFFF; -webkit-border-radius: 10px; -moz-border-radius: 10px; border-radius: 10px; margin-bottom:25px;}
#contentcontainer{width:100%; max-width:630px; margin:auto; padding-top:30px;}

#contentcontainer h1 {color:#ce002e; font-size:45px; font-weight:bold; margin-top:0px; margin-bottom:15px;}
#contentcontainer h2 { color:#666666; font-size:28px; margin-top:0px;}

#tabmenu{width:291px; height:58px; position:absolute; right:25px; bottom:0px; background-color:#ccc;
-webkit-border-top-left-radius: 8px;
-webkit-border-top-right-radius: 8px;
-moz-border-radius-topleft: 8px;
-moz-border-radius-topright: 8px;
border-top-left-radius: 8px;
border-top-right-radius: 8px;

}
#tabmenu span{ float:left; width:100%; text-align:center; margin-top:15px; color:#ce002e; font-size:22px; text-shadow: 0.1em 0.1em 0.1em white; font-weight:bold; }
#accede{float:left; width:100%; max-width:233px;}
	
#accede img{ width:100%; max-width:233px;}
.loginbox{ max-width:308px; width:100%; height:319px; float:right; background:url(../img/bg-login-form.png) no-repeat top center;}
.passwordlostbox{ max-width:308px; width:100%; height:319px; float:right; background:url(../img/bg-lostpass-form.png) no-repeat top center;}

.inputstyle{ padding-left:15px; height:45px; font-size:22px; font-family:Arial, Helvetica, sans-serif; color:#999; max-width:245px; width:100%; border:none; -webkit-border-radius: 10px; -moz-border-radius: 10px; border-radius: 10px;}
.passlost{clear: both; font-size:22px; font-weight:bold; display: block; margin-top: 35px; text-align: center; width: 100%;}
.passlost a{color:#ce002e;  text-decoration:none;}
.passlost a:hover{ text-decoration:underline;}
.dividerloginbox{width:100%; clear:both; height:70px;}
.dividercontent{width:100%; clear:both; height:10px}

@media screen and (min-width: 320px) and (max-width: 560px) {
#loginbox{ float:left; margin:auto; width:100%; max-width:none;}
#accede{ text-align:center; max-width:100%;}
#bannerfoot{width:90%;}
#tabmenu{ width:115px; right:10px;}
#tabmenu span{font-size: 12px; margin-top: 16px;}
#contentcontainer h1 { font-size:38px;}
#contentcontainer h2 {  font-size:22px;}

}
@media screen and (min-width: 10px) and (max-width: 320px) {
#loginbox{max-width:308px; width:100%;}
.inputstyle{    max-width: 210px;}
#accede{ text-align:center; max-width:100%;}
#tabmenu{ width:115px; right:10px;}
#tabmenu span{font-size: 12px; margin-top: 16px;}
#contentcontainer h1 { font-size:35px;}
#contentcontainer h2 {  font-size:20px;}
	}	

.botcontainer{ margin:auto; width:245px;}
.btleft{ background:url(../img/bt-left.png) no-repeat; width:13px; height:51px; float:left;}
.btright{ background:url(../img/bt-right.png) no-repeat; width:13px; height:51px; float:left;}
.btmid{ background:url(../img/bt-mid.png) repeat-x; width:100%; height:51px; float:left; max-width:218px;}
.btmid span{ font-size:18px;  font-weight:bold; display:block; padding-top:12px;}
.btmid span a{ color:#FFF; text-decoration:none;}
.btmid span a:hover{ text-decoration:underline;}
#bannerfoot{width:100%; text-align:left; margin-left:-2px; padding-bottom:25px;}
#bannerfoot img{ width:100%; max-width:627px;}


.logintabscontainer {width:100%; max-width:625px; margin:auto;}
.logintabhead { width:100%; max-width:625px; height:73px; border-top-left-radius:14px; border-top-right-radius:14px; border:1px solid #666; background-color:#cfcfcf}
.tab1{background:url(../img/login-tab1.png) top center no-repeat; width:625px; height:89px;}
.tab2{background:url(../img/login-tab2.png) top center no-repeat; width:625px; height:100px; }
.tab3{background:url(../img/login-tab3.png) top center no-repeat; width:625px; height:126px; }
.tab4{background:url(../img/login-tab4.png) top center no-repeat; width:625px; height:130px; }
.tab5{background:url(../img/login-tab5.png) top center no-repeat; width:625px; height:116px; }

.tabb{  background-color:#eaeaea; border-bottom: 1px solid #666; border-left: 1px solid #666; border-right: 1px solid #666; width:100%; max-width:625px; height:80px;
padding-top:2%;}

.bot2left{ height:30px; background:url(../img/bot2left.png) no-repeat; width:7px; float:left; }
.bot2mid{ height:30px; background:url(../img/bot2mid.png) repeat-x; float:left; font-size:12px; max-width:120px; width:100%; text-align:center;}
.bot2mid a{color:#FFF; text-decoration:none;}
.bot2mid a:hover{ text-decoration:underline;}
.bot2mid span{ display:block; margin-top:2px; font-weight:bold; margin-top:7px;}
.bot2right{height:30px; background:url(../img/bot2right.png) no-repeat; float: left; width:7px;}
.contentbot2{ width:135px; float:right; margin-bottom:5px;}

.tabsicon{float:left; width:75px; margin-left:13px; margin-right:13px;}

.logintabhead .tabsicon{ margin-top:14px;}
.tab1 .tabsicon{ margin-top:7px;}
.tab2 .tabsicon{ margin-top:10px;}
.tab3 .tabsicon{ margin-top:25px;}
.tab4 .tabsicon{ margin-top:30px;}
.tab5 .tabsicon{ margin-top:30px;}

.tabcontent{ float:left;}
.tabtit{ font-weight:bold; color:#000; font-size:16px;}
.tabsubtit{ color:#000; font-size:13px;}
.tabsubtit a{ font-weight:bold; color:#ce002e; text-decoration:underline;}
.tabsubtit a:hover{ text-decoration: none;}

.logintabhead .tabsubtit{color:#7a7a7a; font-size:18px;}
.tabsicon img{ max-width:60px; width:100%;}
.tabonactive{ width:180px; float:right; text-align:center;}
.tabonactive img{ max-width:113px; width:100%;}
.taboffactive{ width:180px; float:right; text-align:center;}

.tabright{ width:170px; float:right;}
.tabright .contentbot2{ margin-right:25px;}
.tabonactivesingle{ margin-top:15px;}

.logintabhead .tabcontent{ margin-top:15px;}
.tab1 .tabcontent{ margin-top:24px;}
.tab2 .tabcontent{ margin-top:22px;}
.tab3 .tabcontent{ margin-top:24px;}
.tab3 .tabtit{ font-size:18px;}
.tab4 .tabcontent{ margin-top:26px;}
.tab4 .tabtit{ font-size:18px;}
.tab5 .tabcontent{ margin-top:26px;}
.tab5 .tabtit{ font-size:18px;}

.tabsbots{ float:right; margin-right:28px;}
.logintabhead .tabsbots{ margin-top:8px;}
.tab1 .tabsbots{ margin-top:30px;}
.tab2 .tabsbots{ margin-top:35px;}
.tab3 .tabsbots{ margin-top:30px;}
.tab4 .tabsbots{ margin-top:50px;}
.tab5 .tabsbots{ margin-top:25px;}


.lostpasslogpanel{font-size:13px; ; text-align:center;}
.lostpasslogpanel a{color:#ce002e}

.historialtab1{ width:625px; height:85px; background:url(../img/historial-tabs-head.png) no-repeat top center;}
.historialtablist{width:100%; max-width:625px; height:81px; background-color:#eaeaea; border-bottom: 1px solid #666; border-left: 1px solid #666; border-right: 1px solid #666; }


.historialtabfoot{width:625px; height:91px; background:url(../img/historial-tabs-bot.jpg) no-repeat top center;}

.historialtablast{width:100%; max-width:625px; height:63px; background-color:#cfcfcf; border-bottom: 1px solid #666; border-left: 1px solid #666; border-right: 1px solid #666;
-webkit-border-bottom-right-radius: 8px;
-webkit-border-bottom-left-radius: 8px;
-moz-border-radius-bottomright: 8px;
-moz-border-radius-bottomleft: 8px;
border-bottom-right-radius: 8px;
border-bottom-left-radius: 8px;
}
.historialtablast a {color:#ED0C43;text-decoration:none}
.historialtablast:hover a {text-decoration:underline}


.contehistoriatabs{ float:left; margin-left:15px; margin-top:18px;}
.tithisto{ color:#000; font-weight:bold; font-size:20px;}
.tithistonum{ color:#757575; font-size:16px; font-weight:bold;}
.detallehistorialtaba{font-size:17px; color:#757575; float:right; margin-top:25px; margin-right:15px;}
.detallehistorialtaba img{ max-width:113px; width:100%;}

.vermashistorial{ float:right; margin-right:25px; margin-top:10px;}

#historialnavcontainer{ margin:auto; width:412px; padding-top:9px;}
.nav{ float: left;}

.contenotifi{ float:left; margin-left:15px; margin-top:18px; color:#333333;}
.contenotifi .tithisto{ margin-top:10px;}
.logintabhead .contenotifi{ color:#333333; font-size:20px; font-weight:bold; margin-top:25px; }

@media screen and (min-width: 320px) and (max-width: 560px) {
.contenotifi{  margin-left:5px; }	
.tithisto{ font-size:14px;}	
.detallehistorialtaba img{ max-width:80px; width:100%;}
.detallehistorialtaba{font-size:14px;}
.tabtit{ font-size:12px;}
.tabsbots{ margin-right:2px;}
.bot2mid{ max-width:90px; font-size:10px;} 
.tabsubtit{ font-size:10px;}
.tabonactive img{max-width: 74px;}

.tabsicon img{ max-width:40px;}
.tabsicon{ width:40px;}
.tabright .contentbot2{ margin-right:0px;}
	}
	
@media screen and (min-width: 10px) and (max-width: 320px) {
.detallehistorialtaba{ margin-top:15px;}	
.contenotifi{  margin-left:5px; }	
.tithisto{ font-size:12px;}		
.contenotifi .tithisto{ margin-top:2px;}
.detallehistorialtaba img{ max-width:60px; width:100%;}
.detallehistorialtaba{font-size:12px;}
.tabsubtit{ font-size:9px;}
.tabonactive img{max-width: 74px;}
.tabtit{ font-size:10px;}
.bot2mid{ max-width:80px; font-size:9px;} 
.tabsicon img{ max-width:30px;}
.tabsicon{ width:40px;   margin-left: 2px; margin-right:2px;}
.tabright .contentbot2{ margin-right:0px;}
.contentbot2{ width:95px;}
.tabonactive{ width:auto;}
.tabright{width: 90px;}
.lostpasslogpanel{ font-size:10px;}
.tabsbots{ margin-right:2px;}
.tabcontent{ width:120px;}
	}	
	
	
/* Container */
.switch {
  cursor: pointer;
  display: inline-block;
  overflow: hidden;
  position: relative;
  width: 105px;
  height: 30px;
  vertical-align: middle;
}
/* Background image */
.switch .background {
  background: url('../img/switch-background.png');
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  width: 161px;
  height: 30px;
}
/* Mask */
.switch .mask {
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  width: 105px;
  height: 30px;
}	

#maincontainer .editable-click, #maincontainer a.editable-click, #maincontainer a.editable-click:hover{ border-bottom:none;}
.Tabbutton {
	width: 141px;
	height: 51px;
	display: block;
	text-indent: -9999px;
}
.Tabbutton:hover { background-position: 0 -104px; }
.TabbuttonActive { background-position: 0 -52px !important;}

.Tabbutton1 {
	background: url(../img/historial-nav1.jpg) no-repeat 0 0;
 }

.Tabbutton2 {
	background: url(../img/historial-nav2.jpg) no-repeat 0 0;
}

.Tabbutton3 {
	background: url(../img/historial-nav3.jpg) no-repeat 0 0;
}

.oculto { display: none;}

.grisado { background-color: white; width: 100%; height: 100%; position: relative; z-index: 100; opacity: .6; margin-top: -1%; }

 .botonBlue {
    text-decoration: none;
}
.botonBlue div{
	border:solid 1px #DEDEDE;
    border-radius:5px;
    text-align:center;
    padding:5px;
    color:#fff;
    background:#3898C5;
    width:12em;
    font-weight: bold;
    font-family: arial, sans-serif;
    display:inline-block;
}
.botonBlue:hover div{
    border:solid 1px #3898C5;
    color:#3898C5;
    background:#fff;    
}

.botonPink {
    text-decoration: none;
}
.botonPink div{
	border:solid 1px #DEDEDE;
    border-radius:5px;
    text-align:center;
    padding:5px;
    color:#fff;
    background:#ED0C43;
    width:8em;
    font-weight: bold;
    font-family: arial, sans-serif;
    display:inline-block;
}
.botonPink:hover div{
    border:solid 1px #ED0C43;
    color:#ED0C43;
    background:#fff;    
}
	
.botonGreen {
    text-decoration: none;
}
.botonGreen div{
	border:solid 1px #DEDEDE;
    border-radius:5px;
    text-align:center;
    padding:5px;
    color:#fff;
    background:#2EB273;
    width:8em;
    font-weight: bold;
    font-family: arial, sans-serif;
    display:inline-block;
}
.botonGreen:hover div{
    border:solid 1px #2EB273;
    color:#2EB273;
    background:#fff;    
}

#aConfigurar {
	text-decoration:none;
}

#aConfigurar:hover {
	text-decoration:underline;
}

.homeButton {
	position:relative;
	left:335px;
	top:28px;
	width:37px;
	overflow:hidden;
}
.homeButton  a{
	text-decoration:none;
	color:#fff;
	font-size: 14px;
}

.homeButton  a:hover{
	text-decoration:underline;
}
.homeButton  div{
	background: url(../img/HOME.png) no-repeat 0 0;
	width: 36px;
	height: 31px;
	display: block;
}

.homeButton  div:hover{
	background: url(../img/HOME-over.png) no-repeat 0 0;	
}