@charset 'UTF-8';
/* --------------------- Header  ----------------------*/
#top		{position:relative; margin:0 auto; padding:0px; height:29px; background:rgb(255,255,255);}
#header, #header2		{position:relative; margin:0 auto 6px auto; padding:0px; height:auto;}
#bgCanvas 	{position:absolute; }

/* --------------------- fecha ------------------------*/
.datewraper { width:25%; height:25px; float:left; margin:0px 0px 0px; }
.date 		{ text-align:left; font-size:10px; color:rgb(100,182,191); margin:3px 0px 0px; padding:5px 0px 0px 0px; float:left; position:relative; }
.date span	{ color:rgb(100,182,191);}

/* --------------------- LINK SUPERIOR  ------------------------*/
.infowraper				{position:relative; float:right; margin:-50px 0px 0px 0px; padding:0px; margin-right:0px; width:55%; min-width:300px; text-align:right; *width:auto;} /*width:75%; height:20px; float:left; text-align:center; padding-top:0px; top:0px; */}
.infotop 				{ height:20px; font-size:10px; line-height:15px; text-align:center; margin:5px 0px 0px;}
.infotop ul 			{ list-style:none; display:inline-block; margin:0px; padding:0px;}
.infotop ul li 			{ height:15px; float:left; display:inline-block; padding-right:7px;  margin-right:5px;  border-right:1.5px solid #999; color:#999; line-height:10px; margin-top:5px;}
.infotop ul li.last 	{ border:0; width:auto; margin:0px; padding:0px; margin-right:0px}
.infotop ul li a 		{text-decoration:none; color:#595959; font-size:14px;}
.infotop ul li a img    {margin-top:-3px;}

/* --------------------- BOTON MENU MIBILE Y TABLET  ------------------------*/
#btnMenu-mobil{ float:right; padding-top:5px; top:0px; margin-right:20px; display:none;}/* <--- NEVO*/
#nav-icon3 {  width: 22px;  height: 20px;  position: relative;  -webkit-transform: rotate(0deg);  -moz-transform: rotate(0deg);  -o-transform: rotate(0deg);  transform: rotate(0deg);  -webkit-transition: .5s ease-in-out;  -moz-transition: .5s ease-in-out;  -o-transition: .5s ease-in-out;
  transition: .5s ease-in-out;  cursor: pointer;}
 #nav-icon3 span {
  display: block;   position: absolute;  height: 2px;  width: 100%;  background: #006368;    opacity: 1;  left: 0;  -webkit-transform: rotate(0deg);
  -moz-transform: rotate(0deg);  -o-transform: rotate(0deg);  transform: rotate(0deg);  -webkit-transition: .25s ease-in-out;  -moz-transition: .25s ease-in-out;  -o-transition: .25s ease-in-out;  transition: .25s ease-in-out;}
#nav-icon3 span:nth-child(1) {  top: 0px;}
#nav-icon3 span:nth-child(2),#nav-icon3 span:nth-child(3) {  top: 10px;}
#nav-icon3 span:nth-child(4) {  top: 20px;}
#nav-icon3.open span:nth-child(1) {  top: 10px;  width: 0%;  left: 50%;}
#nav-icon3.open span:nth-child(2) {  -webkit-transform: rotate(45deg);  -moz-transform: rotate(45deg);  -o-transform: rotate(45deg);
  transform: rotate(45deg);}
#nav-icon3.open span:nth-child(3) {  -webkit-transform: rotate(-45deg);  -moz-transform: rotate(-45deg);  -o-transform: rotate(-45deg);
  transform: rotate(-45deg);}
#nav-icon3.open span:nth-child(4) {  top: 10px;  width: 0%;  left: 50%;}


/* -------------------- Link------------------------*/
.link	{ text-align:right; font-size:10px; color:rgb(100,182,191);}
.link a { color:rgb(100,182,191); }

/* --------------------- Logo ------------------------*/
#logo					{position:relative; float:left; height:50px; width:40%; margin-right:0px; font-size:36px; line-height:70px;  margin-bottom:15px;}
#logo a					{display:block; color:#000;}
#logo img				{display:block; max-width:100%; margin-left:0px;}
#logo a.standard-logo	{display:block;}

/* --------------------- buscador ----------------------------*/
.buscador 		{ position:relative; float:right; margin:0px; height:27px; float:right; font-size:10px; line-height:normal; text-align:right; display:inline-block;}
.buscadorbox 	{ margin-right:0px;
background: rgba(255,255,255,0.4) url(../imagen/ico/h-search.png) no-repeat right; 
 border: 1px solid rgb(204,204,204); 
outline:0; height:20px; width: 100px; padding-left: 5px; padding-right:10px; color:#ccc;	
}

/* ---------------------------- top menu ----------------------------*/

.top-menu-wraper {position:relative; display: block; width:100%; font-size:12px; text-transform:uppercase; margin:0; }
#top-menu-prin		{ float:left; margin:8px 0 0 0; padding:0px; width:48%; }
#top-operaciones 	{ float:right; margin:0px; padding:0px;width:48%; text-align:right;}
#top-menu-prin li, #top-operaciones li {display:inline-block; position:relative;}
#top-menu-prin li {border-right: 1.5px solid #999;padding-right: 7px;margin-right: 5px; padding-top:4px;}
#top-menu-prin li a {text-decoration:none; color: #888;font-weight:bold;}
#top-menu-prin li.last 	{ border:0; width:auto; margin:0px; padding:0px; margin-right:0px}
#top-menu-prin li a.current {text-decoration:none; color: #00525b; }

#top-operaciones li { padding:8px 8px; outline:#E6E6E6 solid 1px; }
#top-operaciones li.fder { margin-left:3px; margin-right: 3px;}
#top-operaciones li a {text-decoration:none; color: #fff; font-size:13px; font-weight:bold; text-transform: capitalize;}
 
#top-operaciones  ul li	{display:block; float:none; width:100%; margin:0; padding:0; height:auto; text-align:left; border-bottom:1px solid #fff;  }
#top-operaciones ul a{display:block; line-height:25px; padding:0 15px; font-weight:normal; font-size:12px; }
#top-operaciones ul li:first-child	{border-top:0; margin-top:0; }
#top-operaciones ul li:last-child	 	{padding-left:0; margin-left:0; left:0px;border:none; padding-bottom:0;}

/*#top-operaciones li:hover > ul {  display: block;visibility: visible; color: #666 !important; position: absolute; padding: 3px 0 8px 0px;  background: rgb(237,237,237); margin: 1px 0 0 0;}
#top-operaciones ul li:hover    { }
#top-operaciones ul a:hover, 
#top-operaciones ul li:hover > a	{ width:auto; display:block; background:rgba(237,237,237,0.5); color:#fff; }
#top-operaciones li:hover    {}
#top-operaciones ul li img {position:relative; float: right; margin-top:7px;}*/


/* ---------------------------- top social ----------------------------*/
#top-social-wraper	{position:relative; float:right; margin:10px 0px 0px 0px; padding:0px; margin-right:0px; width:55%; min-width:300px; text-align:right; *width:auto; }
#top-social			{ }
#top-social ul		{ display:inline-block; margin:0px; padding:0px;}
#top-social li, #top-social li a, #top-social  li .ts-icon, #top-social li .ts-text	{float:right ;display:inline-block; position:relative; width:25px; height:25px; padding:0px; margin:0px; }
#top-social li, #top-social li a, #top-social li .ts-text	{ text-align:left; width:auto; overflow:hidden; padding:0px; }
#top-social li a	{width:25px; line-height:25px; margin:-1px; padding:0px 0px 0px 5px; color:#FFF; font-size:12px; font-weight:bold; }
#top-social li .ts-text	{ padding-left:3px; float:left;}
#top-social li .ts-icon	{ float:left; }

#top-social li.ts-fbok a, #top-social li.ts-twit a, #top-social li.ts-yout a, #top-social li.ts-inst a, #top-social li.ts-cale a, #top-social li.ts-bole a, #top-social li.ts-gplu a, #top-social li.ts-drib a, #top-social li.ts-forr a,#top-social li.ts-blog a, #top-social li.ts-flic a, #top-social li.ts-pint a, #top-social li.ts-rss a, #top-social li.ts-vime a, #top-social li.ts-phon a, #top-social li.ts-mail a, #top-social li.ts-link a		{ }
#top-social li.ts-fbok .ts-icon		{ background:url("../imagen/head/red/fbok.png") no-repeat center center; }
#top-social li.ts-twit .ts-icon		{ background:url("../imagen/head/red/twit.png") no-repeat center center; }
#top-social li.ts-yout .ts-icon		{ background:url("../imagen/head/red/yout.png") no-repeat center center; }
#top-social li.ts-inst .ts-icon		{ background:url("../imagen/head/red/inst.png") no-repeat center center; }
#top-social li.ts-cale .ts-icon		{ background:url("../imagen/head/red/cale.png") no-repeat center center; }
#top-social li.ts-bole .ts-icon		{ background:url("../imagen/head/red/bole.png") no-repeat center center; }
#top-social li.ts-gplu .ts-icon		{ background:url("../imagen/head/red/gplu.png") no-repeat center center; }
#top-social li.ts-link .ts-icon		{ background:url("../imagen/head/red/link.png") no-repeat center center; }
#top-social li.ts-ayud .ts-icon		{ background:url("../imagen/head/red/ayud.png") no-repeat center center; }

#top-social li.ts-drib .ts-icon		{ background:url("../imagen/head/red/drib.png") no-repeat center center; }
#top-social li.ts-forr .ts-icon		{ background:url("../imagen/head/red/forr.png") no-repeat center center; }
#top-social li.ts-blog .ts-icon		{ background:url("../imagen/head/red/blog.png") no-repeat center center; }
#top-social li.ts-flic .ts-icon		{ background:url("../imagen/head/red/flic.png") no-repeat center center; }
#top-social li.ts-pint .ts-icon		{ background:url("../imagen/head/red/pint.png") no-repeat center center; }
#top-social li.ts-rss .ts-icon		{ background:url("../imagen/head/red/rss.png") no-repeat center center; }
#top-social li.ts-vime .ts-icon		{ background:url("../imagen/head/red/vime.png") no-repeat center center; }
#top-social li.ts-phon .ts-icon		{ background:url("../imagen/head/red/phon.png") no-repeat center center; }
#top-social li.ts-mail .ts-icon		{ background:url("../imagen/head/red/mail.png") no-repeat center center; }

/*---------------------reponsive-------------------------*/
/* Mobile Portrait Size to Mobile Landscape Size (devices and browsers) */
@media only screen and (max-width:979px)	{ 
#top-social, #top-social-wraper, #top-bar.top-bar2 #top-social		{ margin:0px auto 0px auto; text-align:center;}
#top-social-wraper	{ margin:20px 0px 0px 0px; }
#top-social ul						{display:inline-block; float:none; margin:0 auto; text-align:center; }
#top-social li						{display:inline-block; }
}
/* Tablet Portrait size to Tablet Landscape (devices and browsers) */
@media screen and (max-width: 1024px){
#btnMenu-mobil {display:block; margin-right:0px;}
.infowraper	{float:none;clear: both; width: 100%;height: 25px;}
.infotop {width:100%;}
.infotop ul {width:48%;}
.link { text-align: left;}
.buscador {width:50%;}
.buscadorbox {width: 92%; padding-left: 1.8%; padding-right: 4%;}

#top-menu-prin {display:none;}
#top-operaciones 	{ float:none; margin:0px; padding:0px;width:100%; text-align:right; height: auto;}
/*#top-operaciones li {width:48%; text-align:center; padding:15px 0px; margin-top:5px;}
#top-operaciones li.fizq {float: left;}
#top-operaciones li.fder {float: right;}*/
#top-operaciones ul {width:100%; }
#top-operaciones li:hover > ul { margin-left:-5px;}

	
/************* Cambios *************/
	#top-operaciones {	display:flex;flex-direction:row;  	align-items: center;	justify-content:center;		}
	#top-operaciones li {width:33%;text-align: center;}
 }

@media only screen and (max-width:800px)	{
#header2 {top:35px; padding-bottom:40px;}
}

@media only screen and (max-width:767px)	{
.datewraper 	{ width:40%; }
.infowraper		{ width:100%; height:50px; }
.date 		{ float:none; text-align:center;}
.infotop	{ width:100%; height:25px; }
/*header */
#logo		{ display:block; text-align:left; margin-top:-15px;}
#logo a,
#logo a.standard-logo	{ display:inline-block; }

#top-social-wraper		{position:relative; float:right; margin:10px 0px 0px 0px; padding:0px; }
#top-social ul			{display:inline-block; float:none; margin:0px 0; text-align:center; }
#top-social li			{ margin:0; margin-right:2px;}

#btnMenu-mobil {display:block;}

.infotop ul {width:100%;}
.buscador 	{ width:100%; margin-top:16px; float:none; padding-right:0px; text-align:left;}
#menutop {    margin-top: 50px;}
.buscadorbox {width: 99.7%; padding-right: 0; padding-left: 0;}

#top-operaciones 	{ /*float:none; */ margin:15px 0 0 0; padding:0px;width:100%; text-align:right; height: auto;flex-direction: column;}
#top-operaciones li {width:99.7%; text-align:center; padding:15px 0px;  margin-top:5px; }
#top-operaciones li.fizq, #top-operaciones li.fder{float: none;}
#top-operaciones li.fder{ margin-left:0px;}
 #top-operaciones li:hover > ul {    margin-left: 0px;     height: auto;     position: relative;}
.top-menu-wraper {margin-top:5px;}
}
/* Mobile Landscape Size to Tablet Portrait (devices and browsers) */
@media only screen and (min-width:480px) and (max-width:767px)	{ 
}

@media only screen and (min-width:414px) and (max-width:736px) and (orientation:portrait) 	{ 

}
/* Mobile Portrait Size to Mobile Landscape Size (devices and browsers) */
@media only screen and (max-width:479px)	{
#top		{position:relative; margin:0 auto; padding:0px; height:auto; background:rgb(0,82,91);}

/* FECHA */
.datewraper { width:100%; height:25px; float:none; margin:0px; text-align:center;}
.date 		{ float:none; text-align:center;}
/* LINK SUPERIOR  */
.infowraper				{ width:100%; height:50px; float:none; padding-top: 27px;}
.infotop				{ width:100%; height:20px; } 
.link	{ text-align:center; }
/*header */
#header					{ padding-bottom:0px; }
#header2 {top:10px; padding-bottom:10px;}
#logo					{  float: left;  margin-top: 15px; height: auto;}
#logo a					{ display:block; color:#000;}
#logo img				{ display:block; margin:0 auto;}
#logo a.standard-logo	{ display:block;}

#btnMenu-mobil {    margin-top: 15px; }

#top-social-wraper	{ width:auto; height:25px; position:relative; float:none; margin:0px auto; padding:0px; text-align:center; }
#top-social 		{ width:300px; height:25px; margin:0 auto; padding:0px; }
#top-social ul		{ margin:0px; }
#top-social li a	{float:none; display:block; position:relative; width:25px; height:25px; padding:0px; margin:0px auto; text-align:center;}
#top-social li		{ width:35px;} 
#top-social li a, 
#top-social  li .ts-icon, 
#top-social li .ts-text	{ text-align:center; margin:0 auto; }
#top-operaciones 	{ margin-top:35px;}

}

@media only screen and (max-width:320px) {
	#top-operaciones 	{ margin-top:35px;}
}
@media only screen and (min-width:240px) and (max-width:320px)	{

/*header */
#header					{ padding-bottom:3px;}
#logo					{height:40px; width:auto;max-width:100%; margin-left:0px; margin-top:5px; font-size:36px; line-height:30px; float:left; }
#logo a					{display:block; color:#000;}
#logo img				{display:block; width:auto;}
#logo a.standard-logo	{display:block;}
#top-social ul	        { margin:0 -20px; width:80%;}
.buscadorbox            {width: 95%;    padding-right: 0;    padding-left: 0;}

#top-operaciones li     {text-align: center;  padding: 4px 0px; }
}