/*

azul obscuro  131a22

rojo e32027

azul claro 30bee2



*/



@font-face {

font-family: 'always';

src: url('font/always_forever_1-webfont.eot?#iefix') format('embedded-opentype'), 

url('font/always_forever_1-webfont.ttf')  format('truetype');

}





@font-face {

font-family: 'normal';

src: url('font/din_condensed_medium_alternative_1-webfont.eot?#iefix') format('embedded-opentype'), 

url('font/din_condensed_medium_alternative_1-webfont.ttf')  format('truetype');

}







@font-face {

font-family: 'script';

src: url('font/wg_legacy_edition-webfont.eot?#iefix') format('embedded-opentype'), 

url('font/wg_legacy_edition-webfont.ttf')  format('truetype');

}





@font-face {

font-family: 'black';

src: url('font/MyriadPro-BlackSemiCn.eot?#iefix') format('embedded-opentype'), 

url('font/MyriadPro-BlackSemiCn.ttf')  format('truetype');

}





@font-face {

font-family: 'gato';

src: url('font/gato.eot?#iefix') format('embedded-opentype'), 

url('font/gato.ttf')  format('truetype');

}







@font-face {

font-family: 'iconos';

src: url('font/fontawesome-webfont.eot?#iefix') format('embedded-opentype'), 

url('font/fontawesome-webfont.ttf')  format('truetype');

}







@font-face {

font-family: 'iconos2';

src: url('font/icomoon.eot?#iefix') format('embedded-opentype'), 

url('font/icomoon.ttf')  format('truetype');

}





@font-face {

font-family: 'mas';

src: url('font/mas.eot?#iefix') format('embedded-opentype'), 

url('font/mas.ttf')  format('truetype');

}















* {

  margin: 0;

  padding: 0;

  list-style-type: none;

  font-style: normal;

  text-decoration: none;

  font-weight: normal;

line-height:1em;

box-sizing: border-box;

text-decoration:none;

}





::-webkit-input-placeholder { /* WebKit browsers */

    color:    #fff;

}

:-moz-placeholder { /* Mozilla Firefox 4 to 18 */

    color:    #fff;

}

::-moz-placeholder { /* Mozilla Firefox 19+ */

    color:    #fff;

}

:-ms-input-placeholder { /* Internet Explorer 10+ */

    color:    #fff;

}









html{ height:100%;

}





body{	color:#333;

font-family:normal;

height:100%;

}







body.detalle{background-size:100% auto;

background-attachment:fixed;

background-position:center center;}



@media only screen and (max-width:1025px) {



body.detalle{background-size:auto 100%;



}





}



#menu a.item{ font-size:45px !important}



/*GENERALES ***********************************************************************/

a {text-decoration:none;color:#30bee2;}  

a:hover{color:#000;}

a:active{color:#000;}

p {margin:0px;padding:0px;}

#separador {clear: both;visibility:hidden; height:0;}

*:focus{outline:none;}



















#tapa{

	position:fixed;

	top:0;

	left:0;

	width:100%;

	height:100%;

	background-image:url(SVimagenes/logo.png);

	background-repeat:no-repeat;

	background-position:center center;

	background-color:rgba(0,0,0,0.90);

	z-index:1000;

transition:all 5s ease-out 0s;

background-size: 200px 200px;  

	cursor:pointer;

	display:none;

 }

		

		

#tapa:hover{

background-size: 315px 315px;  

}









/* CIERRA GENERALES ***********************************************************************/



















/*BLOQUES PRCINCIPALES DEL WEB SITE *********************************************/





#wrapper{

	position:relative;	

	height:100%;

}







body.bodylistados #wrapper{

	width:95%;

	margin-right:auto;

	margin-left:auto;

}







body.interno #wrapper{ 

margin-top:350px ;

height:auto;



}



body.bodyuserhome{ background-image:url(fondos/rotator.php);

background-size:100%;

background-attachment:fixed;

background-position:center center;}





body.detalle #wrapper,

body.bodyuserhome #wrapper{ background-color:#fff;

width:95%;

max-width:1200px;

margin:70px auto 25px auto;

padding: 290px 25px 25px 25px;

box-sizing: border-box;

height:auto;



}















#subir{

	position:fixed;

	display:none;

	bottom:-40px;

	left:1%;



	width:80px;

	height:80px;

	text-align:center;

	border-radius:40px;

	line-height:40px;

	color:#fff;

	background-color:#e32027;

	font-size:55px;

	cursor:pointer;

	font-family:iconos;

	z-index:100;

	transition:all 0.3s linear;

	

}









#subir:hover{

	background-color:#30bee2;

	bottom:10px;

	line-height:75px;

	font-size:60px;

}







@media only screen and (max-width:600px) {



#subir{display:none!important;}



}





/* ///////////// BLOQUES PRCINCIPALES DEL WEB SITE *********************************************/















/* menu  *************************************/



#menucontainer{	position:fixed;

	width:100%;

	height:100%;

	top:0;

	left:100%;

	background-color:#e32027;

	z-index:100000;

	overflow:hidden;

	transition:left 0.5s ease-in-out;



 }

	

	

	

	#menucontainer.abierto{

		left:0;

}

	

	



	

	



#menucontainer #cerrarmenu{

	position:absolute;

	display:block;

	top:10px;

	right:10px;

	width:60px;

	height:60px;

	text-align:center;

	line-height:60px;

	color:#fff;

	font-size:60px;

	cursor:pointer;

	

}









	

	

#menucontainer #cerrarmenu:hover{

 color:#000;

}

	

	

	#menucontainer #menu{position:absolute;

left: 50%;

top: 50%;

transform: translate(-50%, -50%);

width:95%;

max-width:600px;

box-sizing: border-box;

padding:25px;

z-index:2;

text-align:center;

}











#menu a.item{ display:block;

font-family:always;

margin-bottom:15px;

font-size:60px;

text-transform: capitalize;

color:#fff;

position:relative;}





@media only screen and (max-width:600px) {



#menu a.item{ 

margin-bottom:12px;

font-size:30px;

}





}



#menu a.item:before,

#menu a.item:after{ display:inline-block;

content:"";

height:1px;

border-bottom:2px dashed #000;

width:5%;

opacity:0;



}



#menu a.item:before{ left:0;}



#menu a.item:after{ right:0;}



#menu a.item:hover:after,

#menu a.item:hover:before{ opacity:1;}









body.index #menu a.inicio{display:none;}



#menu a.item:hover{ color:#000;}

























/*cerro menu **********************************/















/* vcabeza  *************************************/



#vcabeza{ height:100%;

overflow:hidden;

position:relative;

z-index:1;}





#vcabeza:after{top:0;

left:0;

width:100%;

height:100%;

position:absolute;

display:block;

content:"";

background-color:#131a22;

opacity:0.5;

z-index:2;}



@media only screen and (max-width:600px) {



#vcabeza:after{

opacity:0.1;

}





}



#vcabeza video{

height:125%;

display:block;

position:absolute;

left: 50%;

top: 50%;

transform: translate(-50%, -50%);

z-index:1;}



#vcabeza #pantalla{ background-image:url(video/video.jpg);

background-size:auto 100%;

height:100%;

position:relative;

z-index:1;

background-position:center center;

background-attachment:fixed;}









#vcabeza #slogan{

position:absolute;

width:90%;

left: 50%;

top: 50%;

transform: translate(-50%, -50%);

color:#fff;

text-align:center;

z-index:3;

max-width:950px;

font-size:35px;

letter-spacing:0.03em;

}







#vcabeza #slogan img{ transition:all 0.8s linear 1s;

margin-bottom:25px;

max-width:120px;}







#slogan h2, #slogan h3{ font-family:always;}





#slogan h2{ font-size:120px;}











#slogan h2:after,

#infoindex h2:after,

.bloquesito h2:after{ display:block;

font-family:gato;

content: "\e608";

text-align:center;

font-size:0.2em;

line-height:1em;

margin:-20px 0 30px 0;

}



@media only screen and (max-width:729px) {



#slogan h2:after,

#infoindex h2:after,

.bloquesito h2:after{ 

display:none;

}





}





#slogan #texto{ margin-bottom:50px;}



#slogan p{ font-size:25px;

line-height:1.3em;}





@media only screen and (max-width:1400px) {



#vcabeza #slogan img{ max-width:80px;}



#slogan h2{ font-size:80px;}



#slogan p{ font-size:20px;}

}





	@media only screen and (min-width:1025px) {



#slogan #texto{ margin-bottom:20px;}



}





@media only screen and (max-width:600px) {



#slogan h2{ font-size:50px;}

#slogan #texto{ margin-bottom:10px;}



#vcabeza #slogan{

font-size:25px;



}



}





a.ir{ color:#fff;

font-size:40px;

width:40px;

display:inline-block;

position:absolute;

bottom:30px;

left:50%;

z-index:3;

transition:bottom 0.5s linear, color 0.3s linear;

transform:rotate(-90deg) translateY(-50%);

}



a.ir:before{ font-family:gato;

 content: "\e605";

}



a.ir:hover{ color:#000;}



#vcabeza:hover a.ir{ bottom:40px;}





@media only screen and (max-width:600px) {



a.ir{display:none!important;}





}







/*cerro vcabeza **********************************/















/* header  *************************************/





#header {

box-sizing: border-box;

position:absolute;

top:0;

left:0;

width:100%;

z-index:1000;

text-align:center;

padding:50px 0 0 0;



}









body.detalle #header,

body.bodyuserhome #header {

padding-top:90px;



}







#header #trigger{

	display:block;

 cursor:pointer;

	position:absolute;

	width:26px;

	height:26px;

	line-height:26px;

	font-size:26px;

	right:30px;

	top:20px;

	color:#fff;

	transition:all 0.3s linear;	 }

	

#header	#trigger.azul{ color:#000;}

	

	

body.interno	#header #trigger{ color:#30bee2;}

body.detalle	#header #trigger{ color:#fff;}







body.interno #separaheader{ }









#logoheader img{ max-width:230px;}



body.index #logoheader{display:none!important;}





	

		@media only screen and (max-width:600px) {



#trigger{



	right:10px;

		 }





}















#trigger:before{ position:absolute;

display:inline-block;

font-size:16px;

text-transform:uppercase;

letter-spacing:1px;

content:"menu";

left:-150%;

top:52%;

transform:translate(0,-50%);

color:rgba(255,255,255,0.2);}









/*cerro header **********************************/



















/* redes sociales  *************************************/



#redessociales{ text-align:center;

margin-bottom:30px;}



#redessociales a { 

    display:inline-block; 

    font-size:25px;

    margin:0 60px 0 0;

    color:#fff;

    height: 60px;

    width: 60px;

    text-align: center;

    box-sizing: border-box;

    line-height: 55px;

				border-radius:30px;

				border: solid 3px #fff;

				transition:all 0.5s ease-out 0s;

cursor:pointer;

}





#redessociales a:last-child{ margin-right:0;}







@media only screen and (max-width:500px) {



#redessociales a { 



    font-size:20px;

    margin:0 15px 15px 0;

    height: 50px;

    width: 50px;

    line-height: 50px;

				border-radius:25px;

				border: solid 2px #fff;

}





}



#redessociales a:last-child{ margin-right:0;}



#redessociales a:hover{

	color:#000;

	border-color:#000;

	transform:rotate(359.9deg);

    

}





		





#redessociales a:before{ font-family:iconos;}













/*cerro  redes sociales **********************************/











/* Generales d los bloques  *************************************/



.bloque{ transform:skewY(-3deg);

position:relative;

padding:80px 0;

}



@media only screen and (max-width:1400px) {



.bloque{ 

padding:40px 0 80px 0;

}



}



.bloquesito{ 

transform: skewY(3deg);

position:relative;

margin-right:auto;

margin-left:auto;

width:95%;







}



.bloquesito h2{text-align:center;

font-family:black;

color:#e32027;

text-transform:uppercase;

font-size:80px;

}







@media only screen and (max-width:580px) {



.bloquesito h2{

font-size:40px!important;

}





}



.bloquesito h2:after{ margin:-5px 0 0 0;

font-size:0.5em;

color:#30bee2;}



@media only screen and (max-width:729px) {



.bloquesito h2:after{

display:none;

}





}



.bloquesito .resumen{ text-align:center;

margin:15px auto 70px auto;

font-size:25px;

font-family:script;

line-height:1.3em;

max-width:800px;}





@media only screen and (max-width:1400px) {



.bloquesito .resumen{ 

margin:15px auto 40px auto;

}





}







.bloque a.ir:hover{ bottom:20px;

color:#000;}





.bloque a.fb.ir{ bottom:30px;

color:#30bee2;}





.bloque a.ir:hover{ bottom:20px;

color:#000;}





.bloque a.fb.ir:hover{ 

color:#e32027;}





/*

azul obscuro  131a22

rojo e32027

azul claro 30bee2



*/









/*cerro  Generales d los bloques  *************************************/











/* infoindexcontainer  *************************************/



#infoindexcontainer{ background-color:#e32027;

background-image:url(SVimagenes/fondo-rojo.jpg);

color:#fff;

z-index:2;

 transform:skewY(0);

	padding: 80px 0 180px 0;

}









#infoindexcontainer #infoindex{ max-width:900px;

margin:0 auto;

 transform:skewY(0);

	text-align:center;}

	

	#infoindex img{ margin-bottom:20px;

	transition:all 0.3s ease-in-out 0.3s;}

	

	@media only screen and (max-width:1400px) {



#infoindexcontainer{ 

	padding: 40px 0 140px 0;

}





	#infoindex img{ max-width:100px;}





}

	

	

	#infoindexcontainer:hover img{ transform:translate(0,-4%)}

	

	



#infoindex h2{ font-family:script; font-size:60px;

color:#fff;

margin-bottom:25px;

text-transform:none;}



#infoindex h2:after{ color:#fff;

font-size:0.5em;

margin:10px 0 0 0;}





#infoindex p{ font-size:25px;

margin-bottom:25px;

line-height:1.3em;}



#infoindexcontainer a.ir{ bottom:80px;}



/*cerro infoindexcontainer **********************************/

























/* el show  *************************************/



#showcontainer{ background-color:#fff;

z-index:3;

margin-top:-2.8%;

 

}



#showcontainer #show{ max-width:1100px;

margin:0 auto;

overflow:hidden;}



#show #izq,#show #der{ width:50%; float:left;

box-sizing: border-box;}







@media only screen and (max-width:1012px) {



#show #izq{ width:30%;

}



#show #der{ width:70%; 

}





}







@media only screen and (max-width:730px) {



#show #izq{ width:100%;

float:none; 

text-align:center;

}



#show #der{ width:100%;

float:none;

}





}











#show #izq img{ max-width:100%;

transition:all 0.5s ease-in-out 0.5s;}



#showcontainer:hover #show #izq img{ transform:translate(0,-4%);}







#show h2{ font-family:black;

text-align:center;

font-size:80px;

text-transform:uppercase;}





.showbloque{ width:100%!important;

text-align:center;}





#bloque1 h2{ font-family:black !important;

color:#333 !important;

text-transform:uppercase;

font-size:30px;

line-height:30px;

margin:0 20px;

display:inline-block;}







@media only screen and (max-width:516px) {



#bloque1 h2{ 

font-size:20px;

margin:0 5px;

}





}



.navi{ cursor:pointer;}



.navi:before{ font-family:iconos;

font-size:30px;}



.navi:hover{ color:#000;}



.prev{ color:#e32027;}



.prev:before{content: "\f137";}

.next:before{content: "\f138";}







@media only screen and (max-width:500px) {



.navi{ display: block;

text-align:center;

margin:10px 0;}





}







.showbloque .desc{ margin-top:20px;

font-size:25px;

text-align:left;

}



.showbloque .desc p{ margin-bottom:25px;

line-height:1.3em;}





@media only screen and (max-width:500px) {



.showbloque .desc { font-size:20px;

}





}



.showbloque .desc p:last-child{ margin-bottom:0;}







#show #bloque2,

#show #bloque3{display:none;}



/*cerro  el show **********************************/



















/* modalidades  *************************************/





#modalidadescontainer{ background-image:url(SVimagenes/fondo-azul.jpg);



color:fff;}





#modalidades{ max-width:1100px;}



#modalidades h2{ color:#fff;

font-size:80px;}



#modalidades h2:after{ color:#fff;}



#listaplanes{ text-align:center;}



#listaplanes a{ display:inline-block;

width:18%;

margin-right:10px;

color:#000;

text-align:center;

background-repeat:no-repeat;

background-position:center top;

min-height:370px;

box-sizing: border-box;

padding: 8% 38px 0 38px;

font-family:script;

font-size:1.25vw;

transition:all 0.3s linear;

vertical-align:top;}







@media only screen and (max-width:1100px) {



#listaplanes a{ 

font-size:60px;

background-size:100% auto;

}





}





@media only screen and (max-width:944px) {



#listaplanes a{ 

font-size:60px;



padding-top:50px;



}



}



@media only screen and (max-width:886px) {



#listaplanes a{ 

font-size:40px;

padding-top:50px;



}

}



@media only screen and (max-width:680px) {



#listaplanes a{ 



padding-top:20px;



}

}





@media only screen and (max-width:650px) {



#listaplanes a{ display:block;

width:100%;

max-width:300px;

margin:0 auto!important;

padding-top:30%;

}





}





#listaplanes a:hover{ transform:translate(0,-4%)}





#listaplanes a:last-child{ margin-right:0;}



#listaplanes a:nth-of-type(1){ background-image:url(SVimagenes/bblanco.png); background-size: 100%;}

#listaplanes a:nth-of-type(2){ background-image:url(SVimagenes/brojo.png); background-size: 100%;}

#listaplanes a:nth-of-type(3){ background-image:url(SVimagenes/bamarillo.png); background-size: 100%;}

#listaplanes a:nth-of-type(4){ background-image:url(SVimagenes/globo_naranja.png); background-size: 100%;}

#listaplanes a:nth-of-type(5){ background-image:url(SVimagenes/bblanco.png); background-size: 100%;}

#listaplanes a:nth-of-type(6){ background-image:url(SVimagenes/blila1.png); background-size: 100%;}

#listaplanes a:nth-of-type(7){ background-image:url(SVimagenes/brosa1.png); background-size: 100%;}

#listaplanes a:nth-of-type(8){ background-image:url(SVimagenes/bverde1.png); background-size: 100%;}

#listaplanes a:nth-of-type(9){ background-image:url(SVimagenes/brojo.png); background-size: 100%;}

#listaplanes a:nth-of-type(10){ background-image:url(SVimagenes/bamarillo.png); background-size: 100%;}








#modalidadescontainer #gato{ position:absolute;

right:5%;

bottom:-30px;

max-width:160px;

}





@media only screen and (max-width:600px) {



#modalidadescontainer #gato{ 

max-width:100px;

}





}

/*cerro modalidades **********************************/



















/* servicioscontainer  *************************************/



#servicioscontainer{ background-color:fff;

padding-bottom:290px;}



#servicios,

.listados{ max-width:1000px;

margin:0 auto;

overflow:hidden;}









.listados a{ display:block;

margin:0 1% 1% 0;

width:40%;

padding-top:20%;

float:left;

position:relative;

overflow:hidden;}





.listados a:nth-of-type(3n){ margin-right:0;}





.listados a:nth-of-type(2){ width:29%;}

.listados a:nth-of-type(3){ width:29%;}

.listados a:nth-of-type(4){ width:29%;}

.listados a:nth-of-type(5){ }

.listados a:nth-of-type(6){ width:29%;}

.listados a:nth-of-type(7){ }

.listados a:nth-of-type(8){ width:29%;}

.listados a:nth-of-type(9){ width:29%;}



.listados a:nth-of-type(10){ }
.listados a:nth-of-type(11){width:29%; }
.listados a:nth-of-type(12){width:29%; }
.listados a:nth-of-type(13){width:29%; }
.listados a:nth-of-type(14){ }
.listados a:nth-of-type(15){ width:29%;}
.listados a:nth-of-type(16){ }
.listados a:nth-of-type(17){width:29%; }
.listados a:nth-of-type(18){width:29%; }



@media only screen and (max-width:464px) {



.listados a{ 

margin:0 0 1% 0;

width:100%!important;

float:none;

padding-top:35%;

}





}







.listados a:after{top:0;

left:0;

width:100%;

height:100%;

position:absolute;

display:block;

content:"";

background-color:#30bee2;

transition:all 0.3s ease-out 0s;

opacity:0.8;

z-index:2;

transition:all 0.3s linear;

}





.listados a:nth-of-type(2n):after{background-color:#e32027;}



.listados a:hover:after{ opacity:0.2;

background-color:#131a22;}







.listados a img{ position:absolute;

left:50%;

top:50%;

transform:translate(-50%,-50%);

width:122%;

z-index:1;

transition:all 0.3s linear;}







.listados a:hover img{ 

width:150%;

}





.listados a #info{position:absolute;

left:50%;

top:50%;

transform:translate(-50%,-50%);

z-index:3;

text-align:center;

transition:all 0.3s linear;}



.listados a:hover #info{ top:45%;}



.listados a #info #titulo{ font-family:black;

color:#fff;

font-size:25px;

text-transform:uppercase;

transition:all 0.3s linear;}







@media only screen and (max-width:686px) {



.listados a #info #titulo{ 

font-size:18px;

}





}





.listados a:hover #info #titulo{ font-size:23px;}





#servicioscontainer #gato{ bottom:80px;

position:absolute;

left:50%;

transform:translate(-35%,0);

max-width:180px;}





/*cerro servicioscontainer **********************************/















/* cotizacioncontainer  *************************************/



#cotizacioncontainer{ background-image:url(SVimagenes/fondo-rojo.jpg);

color:fff;

position:relative;

z-index:3;

padding-bottom:100px;}



#cotizacion{ max-width:1000px;}



#cotizacion h2{ font-size:60px;}



#cotizacion .resumen,

#cotizacion h2,

#cotizacion h2:after{ color:#fff;}



#cotizacioncontainer #gato{ position:absolute;

right:70px;

bottom:-30px;

transform:rotate(45deg);

transition:all 0.5s linear 0.5s;

max-width:170px;}









/*cerro cotizacioncontainer **********************************/

























/* formulario  *************************************/







#formulario {

	transform: translateZ(0)





}



















#formulario label {

	margin-bottom:30px;

	position:relative;

	-webkit-column-break-inside: avoid;

break-inside:avoid-column;

page-break-inside: avoid;

display:block;

color:#fff;



   			



}





#formulario label:focus {

    background: rgba(255,255,255,1);

}



#formulario label span.moq {

    display: block;

    font-size: 19px;

    text-transform: uppercase;

				margin-bottom:5px;

}



#formulario input, #formulario textarea, #formulario select {

    border: dashed 2px #fff;

				background-color: transparent;

    width: 100%;

    padding: 15px;

    font-size: 14px;

    color: #fff;

box-sizing: border-box;

transition:all 0.3s linear;

}



#formulario input:focus,

#formulario textarea:focus, 

#formulario select:focus {

    border-color:#000;

				color:#000;



}









a#recargar {

    font-size: 20px;

    line-height: 50px;

    display: inline-block;

    margin: 0 0 0 20px;

    vertical-align: top;

    color: #333;

    cursor: pointer;

transition: all 0.3s ease-out 0s;



}



a#recargar:hover {

    color: #009ccc;

transform: rotate(30deg);

}



a#recargar:before {

    font-family: iconos;

    content: "\f021";

}



.LV_validation_message {

    font-weight: bold;

    margin: 0 0 0 5px;

			

}



.LV_valid {

    color: #00CC00!important;

    font-size: 12px!important;

    font-weight: bold!important;

    text-transform: lowercase!important;

}



.LV_invalid {

    color: #CC0000!important;

    font-size: 11px!important;

    font-weight: bold;

    text-transform: lowercase!important;

}



.LV_valid_field,



input.LV_valid_field:hover, 



input.LV_valid_field:active,



textarea.LV_valid_field:hover, 



textarea.LV_valid_field:active {

    border: 2px solid #00CC00!important;

								background-color:transparent!important;

}



.LV_invalid_field, 



input.LV_invalid_field:hover, 



input.LV_invalid_field:active,



textarea.LV_invalid_field:hover, 



textarea.LV_invalid_field:active {

    border: 2px solid #CC0000!important;

				background-color:transparent!important;

}



























/*cerro formulario **********************************/





















/* trabajocontainer  *************************************/



#trabajocontainer{ background-color:#FFF;

margin-bottom:-50px;

z-index:2;}



#trabajo{ max-width:1000px;}



#trabajo h2{ font-size:60px;}

#trabajo #formulario label {

	margin-bottom:30px;

	position:relative;

	-webkit-column-break-inside: avoid;

break-inside:avoid-column;

page-break-inside: avoid;

display:block;

color:#000;



   			



}



#trabajo #formulario input, 

#trabajo #formulario textarea, 

#trabajo #formulario select {

    border: dashed 2px #30bee2;

				background-color: transparent;

    width: 100%;

    padding: 15px;

    font-size: 14px;

    color: #30bee2;

box-sizing: border-box;

transition:all 0.3s linear;

}



#trabajo #formulario input:focus,

#trabajo #formulario textarea:focus, 

#trabajo #formulario select:focus {

    border-color:#000;

				color:#000;



}





#trabajo .boton{

	background-color:#e32027;

	color:#fff;}

	

	#trabajocontainer #gato{ position:absolute;

	left:20px;

	bottom:10px;

	max-width:120px;

	transition:all 0.5s ease-in-out 0.5s;}

	



/*cerro trabajocontainer **********************************/





























/*ESTILOS DE TEXTO DEL CENTRO******************************************************************************/





.titulote,

body.bodylistados .listados h1{ text-align:center;

font-family:script;

font-size:80px;

margin-bottom:15px;

color:#e32027;

letter-spacing:-2px;

line-height:1.3em;}





@media only screen and (max-width:600px) {



.titulote,

body.bodylistados .listados h1{ 

font-size:60px;

margin-bottom:10px;

}





}





.resumensote,

body.bodylistados .listados p{ font-size:25px;

line-height:1.3em;

text-align:center;

max-width:900px;

margin:0 auto 40px auto;

border-bottom:dashed 3px #30bee2;

padding-bottom:40px;

color:#333;}





#wrapper .resumensote{ max-width:100%;}







#centro #articulo {

	color:#000;

	margin:0;

	background:#fff;

	padding:20px;

	margin:20px auto;

	overflow:hidden;

	font-family:normal;





	}

	

	









#articulo h1, #articulo h2, #articulo h3, #articulo h4{ 

	color:#30bee2;

	line-height:1em;

	font-family:script;

	font-weight:normal;

		margin: 20px 0 10px 0;



		}



#articulo h1 {

	font-size:40px;

	line-height:1em;

	padding:0 0 10px 0 ;

	margin:0 0 10px 0;

	letter-spacing:-1px;

	border-bottom:dotted 2px #30bee2;



	

	}

	

	

	







#articulo h2 {

	font-size: 32px;



	}



#centro h3{

	font-size: 25px;

	}



#articulo h4{

	font-size: 20px;

	font-weight: normal;

	text-shadow:none;

	}

	

	

	

#articulo p, #articulo ul, #articulo ol{

		font-size:25px;

}

			

		

#articulo b, #articulo strong{ font-weight:bold;}





#articulo p {

	line-height: 1.35em;

	margin:0 0 25px 0;





	}

	

#articulo p:last-child {

	margin-bottom:0;





	}

	

	

#articulo p.conimagen {

		text-align:center;



	}

	



	

	

	

		

	

	

#articulo p img{

		display:inline-block;

		margin:0 auto;

		padding:10px;

		background:rgba(0,0,0,0.05);

		width:65%;

		-webkit-box-sizing: border-box; 

-moz-box-sizing: border-box;    

box-sizing: border-box;

-ms-box-sizing: border-box;    



	}

	

	@media only screen and (max-width:500px) {



#articulo p img{

	

		width:100%;

		

	}





#articulo p, #articulo ul, #articulo ol{

		font-size:20px;

}



}

	

		



#articulo  ul, #articulo  ol  {

	padding: 0px;

	display: block;

		padding:15px;

	border:dashed 2px rgba(0,0,0,0.1)



	}



#articulo li {

	list-style: circle inside;

	margin: 0 0 20px 0;

	line-height:1.3em;



	}

	

#articulo ol li {

	list-style: decimal  inside;

	}







#codigohtml{

	margin:10px 0;}









#breadcrums {

	font-size:12px;

	color:#999;

	margin:15px 0 10px 0;

	padding: 0px;

	}

	

#breadcrums a{}



#breadcrums a:hover {

	color:#000;

	text-decoration:underline;

	}













.cosas{ margin:40px 0;

background-color:#f9f9f9;

padding:20px;

text-align:center;}



.cosas .boton{ margin:0 15px 15px 0;}







.doscols{ column-count:2;

-webkit-column-count:2;

-moz-column-count:2;

column-gap:40px;}



.ub{-webkit-column-break-inside: avoid;

break-inside:avoid-column;

page-break-inside: avoid;}





@media only screen and (max-width:800px) {



.doscols{ column-count:1;}





}





























#galeria{ overflow:hidden;

}



#galeria a{ display:block;

float:left;

width:25%;

box-sizing: border-box;

transition:all 0.3s linear;}



#galeria a:hover{ border:solid 10px #30bee2;}







#galeria a img{ width:100%;}















/*Papa - hijo **************************/



.papa{ cursor:pointer;}

.papa:before{ font-family:iconos;

content:"\f054";

letter-spacing:15px;

font-size:18px;}



.activo:before{ content:"\f078";}





.papa:hover{ color:#900!important;}



.hijo{display:none;

padding:15px;

border:dashed 2px rgba(0,0,0,0.2);

background-color:rgba(255,255,255,0.8);

}

















































/*caja de fotos***********/





#caja { 

height:400px; 

position:relative;

background-size:100% auto;

background-position:center center;

background-attachment:fixed;



	}

	

	

	@media only screen and (max-width:600px) {



#caja { 

height:300px; 

background-size:auto 100%;

background-attachment:local;





	}





}

		

	#caja:after{

		content:"";

		display:block;

		position:absolute;

		height:100%;

		width:100%;

		z-index:2;

		background:rgba(0,0,0,0.3);

		top:0;

		left:0;}

		

		



		

		

#caja #precio{ color:#FFF;

position:absolute;

top:10px;

right:10px;

font-size:30px;

z-index:4;}







/*botones de la  caja*/



#caja #botones{position:absolute;

left: 50%;

bottom: 5px;

transform: translate(-50%, 0);

text-align:center;

z-index:3;

width:100%;

}



#botones a, #botones .boton{ display:inline-block;

background-color: transparent;

color:#fff;

text-transform:uppercase;

font-size:17px;

padding:15px;

border:solid 2px #fff;

margin:0 15px 15px 0;

transition:all 0.3s linear;

}







@media only screen and (max-width:600px) {



#botones a, #botones .boton{ 

font-size:15px;

padding:8px;

border:solid 1px #fff;

margin:0 8px 8px 0;



}





}







#botones  a:hover{ background-color:rgba(0,0,0,0.6)}





/*cerró caja*/











#fechaactualizacion{

	text-align:right; 

	font-size:13px; 

	color: #999;

	padding:5px;

	text-transform:uppercase;

	}



































#compartidor { width:80%; float:left;}

#compartidor a{ margin:0 10px 0 0;

float:left;}































	

































	

	

	

	

	

	

	

	







































































































/* footer  *************************************/



#footercontainer{ padding:150px 20px 90px 20px;

background-color:rgba(19,26,34,1);

color:#fff;

text-align:center;

position:relative;}



#footercontainer #footerlogo{}

#footercontainer #footerlogo img{ margin:25px;

max-width:90px}



#footerlogo #redessociales a:hover{ color:#30bee2;

border-color:#30bee2;}



#footercontainer #footerinfo p{ margin-bottom:10px; font-size:20px;}

#footercontainer #footerinfo p:last-child{ margin-bottom:0;}





/*cerro footer **********************************/



























































/* iconos  *************************************/





/*Boton **************************************************/

.boton  {

cursor: pointer;

background: #30bee2; /* Old browsers */

padding: 20px;

display: inline-block;

box-sizing: border-box;

font-size: 20px;

letter-spacing:1px;

color:#fff;

text-transform:uppercase;

border:none;

font-family:normal;

border:solid 1px transparent;

transition:all 0.3s linear;

border-radius:4px;





	}

	



	.enviar{ background-color:#fff;

	color:#e32027;}

	

	

	@media only screen and (max-width:600px) {



.boton  {

padding: 14px;

font-size: 13px;





	}





}



.boton:hover,

.enviar:hover {

	color:#fff!important;

	background-color:#000!important;

}

	



	.boton:before{ letter-spacing:10px;}





/* //Boton **************************************************/







.icono{ cursor:pointer;}

.icono:before, 

.boton:before, 

#usuario a.item:after{ font-family:iconos;}







a.nombre:after{ content:"\f007";}

a.pedido:after{ content:"\f07a";}

a.perfil:after{ content:"\f040";}

a.cuentas:after{ content:"\f016";}

a.pago:after{ content:"\f0d6";}

a.envios:after{ content:"\f0d1";}

a.docs:after{ content:"\f02d";}

a.soporte:after{ content:"\f0e9";}





.facebook:before{ content:"\f09a";}

.twitter:before{ content:"\f099";}

.email:before{ content: "\f0e0";}

.instagram:before{ content: "\f16d";}

.gplus:before{content: "\f0d5";}

.youtube:before{content: "\f16a";}

.borrar:before,

.salir:after{content: "\f00d"; color:red;}







#buscare form button:before{ font-family:iconos;

content: "\f002";

position:absolute;

left: 50%;

top: 50%;

transform: translate(-50%, -50%);



}



	

	

.enviar:before{content: "\f135";}

	

#trigger:after{ font-family:gato;

content: "\e606";

}



#subir:before{

	content: "\f106";

}





#menucontainer #cerrarmenu:before{

	font-family:iconos;

content: "\f05c";

}

#login form button:before{ 

content:"\f00c";

font-family:iconos;

letter-spacing:10px;}



#login #acciones a.olvido:before{ content:"\f084";}

#login #acciones a.registrate:before{content:"\f004";}



.pagar{ padding:15px;}



.pagar:after{ content:"pagar ahora";}

.pagar:before{content:"\f0d6"; }





.modificardatos:after{ content:"Modificar mis datos de registro";}

.modificardatos:before{content: "\f040";}



.reportarpago:after{ content:"Reportar pago";}

.reportarpago:before{ content: "\f0d6";}



.pedidouserhome:before{content: "\f19d";}



.cosas .boton:before{content: "\f0c1";}

.enviar:after{ content:"enviar solicitud";}





/*cerro iconos **********************************/





















































.tarjetas{ text-align:center;}