/* VARIABLES */
/* BASE */
@import url('https://fonts.googleapis.com/css?family=Roboto+Condensed:400,700|Roboto:400,500,700,900');
@import url('https://fonts.googleapis.com/css?family=Open+Sans:400,600,700,800');
@import url('https://fonts.googleapis.com/css?family=Montserrat:400,500,600,700,800,900&display=swap');

html,body {font-family:Segoe, "Segoe UI","Roboto", sans-serif;font-size: 1.06em; height: 100%; margin: 0; padding: 0; color:#474c53}
a { text-decoration: none; outline:none; color:#474c53}
p, li { color:#26262a; list-style-type:none; margin:0 0 8px }
*:focus {outline: none;}img, img a{ border:none}
ul{ margin:0; padding:0}
h1,h2, h3, h4{ font: 600 140% 'Open Sans', sans-serif; color:#111}
.site-content { padding-top:6px;}
.container { overflow: hidden; margin: 0 3%; text-align:center; position:relative}
.rosa { color: #a80077}

/* HEADER */
.header { padding-top:24px; height: 53px; color: #313131; background-color:#fff; margin:0 0 0 3%; position:relative}
.header h1,.header div { width:200px;display:inline-block; padding:0; line-height:0; font-size:0}
.header_logo img a{ border-style: none}
.tel { display:none}

/* MENU */
.menu { font-size:100%; display:inline-block; vertical-align:top; width:69%; margin-left:30px}
.menu p,#nav span {display: none}
#nav, #nav ul {list-style:none outside none}
#nav li {position: relative;display:inline-block;font:700 85% "Open Sans",Segoe, "Segoe UI", "sans-serif"; letter-spacing:-0.03em; margin-top:5px}
#nav li a {color:#000;border-bottom:4px solid #fff;padding: 0px 0 24px; margin-right:30px}
#nav li:first-child { display: none}
#nav li:last-child { margin-right:1%; position:absolute; right:0%; top:25px}
#nav li:last-child span{ text-transform:uppercase; font-size:62%; display:none; color:#111; margin-top:-8px}
#nav li:last-child a{ background-color:#f451d9; border-radius: 5px; padding:7px; border-bottom: none!important; color: #fff!important}
#nav li:last-child a:hover{ background-color: #000; border-bottom: none}
#nav li:hover a{ border-bottom: 4px solid #f451d9; color: #222}
#nav li.active a { background-color: #f451d9; color: #FFFFFF}

#nav li a .mas { background: url(../img/ico-mas.png) left 0 no-repeat; height:15px; width:15px; margin-right:5px; display:inline-block; vertical-align:middle; padding-bottom:0px}
#nav li.mov { display:none}

/*---------DESTACADO HOME-------------*/
.destacados { width:95%; max-width: 1300px; margin: 40px auto 80px; text-align:center; display:block}
.destacados h2,.trabajos h2 { text-align: center;font-weight: 700; color: #111; font-size: 180%; margin-bottom:8px}
p.tit{ font-size: 140%; font-weight: 500;  margin:0 0 80px; display:block}
.destacados h3 { text-align: center; font-weight:400}
.destacados h3 strong{ display: block; margin:35px 0 20px}
.destacados h3 img{ display: inline-block; vertical-align: middle; margin:0 5px 0 25px}
.destacados_lista {text-align: center; margin-bottom: 40px; display:flex;display:-webkit-flex;flex-direction: row; -webkit-flex-direction: row;justify-content: space-around}
.destacados_lista li{  width: 25%; padding: 0 2%; line-height: 145%; font-size:90%; color: #1b1b1f; text-align:left}
.destacados_lista li h3{ margin: 10px 0 15px; font-weight: 600;font-size:120%; text-align:left} 
.destacados_lista img { width: 60%; display: block;margin: 0 auto}

/*Galeria*/
.trabajos { text-align: center; margin: 0; display: block; border-bottom:1px solid #ccc}
.trabajos h2{border-top:1px solid #eee}
.trabajos h2 span{ display:block; width:100px; height:5px; margin: 0 auto 40px; background-color:#a80077}
#g1,#g2,#g3,#g4,#g5,#g6,#g7,#g8,#g9,#g10,#g11,#g12{ display: inline-block; vertical-align: top; width: 24.5%;position:relative}
#g1,#g5,#g8,#g11 { width:49.2%!important}
#g2,#g6,#g9,#g12{ border-right: 4px solid #fff; border-left: 4px solid #fff}
div.imagen img{ width:100%}
div.info{ position:absolute;overflow:hidden;width: 100%;height:100%; background-color: rgba(31, 31, 31, 0.9);opacity:0;transition: opacity 0.3s;  z-index:9999; left:0; top:0}
div.infoA{ position:absolute;overflow:hidden;width: 100%;height:50%;background-color: rgba(31, 31, 31, 0.9); opacity:0; transition: opacity 0.3s;
  z-index:9999; left:0; top:0}
div.infoB{ position:absolute; overflow:hidden; width: 100%; height:49%; background-color: rgba(31, 31, 31, 0.9); opacity:0; transition: opacity 0.3s; z-index:9999; left:0; bottom:6px; }
div.imagen:hover div.info,div.imagen:hover div.infoA, div.imagen:hover div.infoB { opacity:1}
p.headline {position: absolute;font-size:100%;left:0px!important; width:90%; bottom:20px; transition: 0.3s; color:#fff; text-align:left}
p.headline strong{ font:700 180% Montserrat, Segoe, sans-serif; display:block}
p.headline a{ font:400 80% Segoe, sans-serif; display:block; margin-top:15px; color:#dd34ac}
div.imagen:hover p.headline { margin-left: 3%}
	
.enlace a{ display:block; margin:30px auto; width:300px; padding:10px 0; border-radius:3px; 
    border:none;
    text-align:center; 
    background-color:#f451d9;
    color:#fff; font-weight: 600;
    font-size: 1rem;
}
.enlace a:hover{ background-color:#222;color:#fff;}
/*-- Cumplimos 10 años --*/
.cumple { margin: 20px 0 20px}
.cumple em { font-family:Cambria, "Hoefler Text", "Liberation Serif", Times, "Times New Roman", serif}
.cumple img, .cumple div { display: inline-block; width: 60%; vertical-align: middle}
.cumple img {width:30%; max-width:400px}
.cumple div { text-align: left; margin-left: 5%}
.cumple div a{ background-color:#f451d9; border-radius:5px; color:#fff; display:block; padding:8px 15px; width:180px; text-align:center }
.cumple div a:hover{ background-color:#a80077}

/*----------- BSXLIDER  ------------*/
.bx-wrapper {position: relative;	margin: 0 auto;padding: 0;	*zoom: 1; background-color: #a80077}
.bx-wrapper img {width: 100%;display: block;}

/** THEME
===================================*/
.bx-wrapper .bx-viewport {-webkit-transform: translatez(0);-moz-transform: translatez(0);	-ms-transform: translatez(0);-o-transform: translatez(0);transform: translatez(0)}
.bx-wrapper .bx-pager,.bx-wrapper .bx-controls-auto {	position: absolute;bottom: 20px;width: 150px; right:1%}
/* LOADER */
.bx-wrapper .bx-loading {min-height: 50px;background: url(../img/bx_loader.gif) center center no-repeat #fff;height: 100%;	width: 100%;position: absolute;top: 0;	left: 0;	z-index: 100}

/* PAGER */
.bx-wrapper .bx-pager {	text-align: center;font-size: .85em;padding-bottom:10px}
.bx-wrapper .bx-pager .bx-pager-item,.bx-wrapper .bx-controls-auto .bx-controls-auto-item {display: inline-block;	*zoom: 1;*display: inline; vertical-align:middle}
.bx-wrapper .bx-pager.bx-default-pager a {background-color:#fff;text-indent: -9999px;	display: block;width: 10px;height: 10px;margin: 0 3px;outline: 0;	-moz-border-radius: 8px;-webkit-border-radius: 8px;border-radius: 8px; border:2px solid #fff}
.bx-wrapper .bx-pager.bx-default-pager a:hover{background: #f451d9 }
.bx-wrapper .bx-pager.bx-default-pager a.active {background: #f451d9;width: 22px;height: 22px;-moz-border-radius: 13px;-webkit-border-radius: 13px;border-radius: 13px; }


/* DIRECTION CONTROLS (NEXT / PREV) */
.bx-wrapper .bx-prev {left: 20px;background: url(../img/controls.png) no-repeat 0 -4px}
.bx-wrapper .bx-next {right: 20px;background: url(../img/controls.png) no-repeat -43px -4px}
.bx-wrapper .bx-prev:hover {background-position: 0 -74px}
.bx-wrapper .bx-next:hover {background-position: -43px -74px}
.bx-wrapper .bx-controls-direction a {	position: absolute;top: 45%;margin-top: -16px;outline: 0;width: 32px;height: 69px;text-indent: -9999px;z-index: 100}
.bx-wrapper .bx-controls-direction a.disabled {	display: block}

/* IMAGE CAPTIONS */
.bx-wrapper .bx-caption {position: absolute;bottom: 0;left: 0;background: #666\9;background: rgba(80, 80, 80, 0.75);width: 100%;}
.bx-wrapper li span { position:absolute;text-align: left; width:35%; right:10%; top:20%; color:#500240;font:600 120% "Source Sans Pro",Segoe, "Segoe UI", sans-serif}
.bx-wrapper li span strong { color:#fff;  font-size:190%; text-transform:none;line-height:100%; margin:20px 0; display: block}
.bx-wrapper li span b { color:#fff; font-weight: 400}
.bx-wrapper li span a {color:#fff;font-weight:600; margin:25px 0 0; padding:8px 0; background-color:#500240; border-radius: 8px; display: block; width: 290px; text-align: center; font-size:90%}
.bx-wrapper li span a:hover { background-color:#000;}
.bx-wrapper li.slide-03 span { color:#1ed3ba}
.bx-wrapper li.slide-03 span a {background-color:#0a453e}
.bx-wrapper li.slide-02 span { color:#82a5f0}
.bx-wrapper li.slide-02 span a{ background-color:#1c3b5e}

.bx-wrapper li.slide-tic span { color:#fff}
.bx-wrapper li.slide-tic span strong { color:#f6c056}
.bx-wrapper li.slide-tic span a{ background-color:#fff;color:#5d0170}
.bx-wrapper li.slide-tic span a:hover{ background-color:#000;color:#fff}


.bx-wrapper li.navidad span { width:35%; right:10%; top:25%; color:#d6424b}
.bx-wrapper li.navidad span b,.bx-wrapper li.navidad span strong  { color:#505760}
.bx-wrapper li.navidad span a {color:#fff;font-weight:600; margin:25px 0 0; padding:8px 0; background-color:#d6424b; width: 290px; font-size:90%}

/*------------ INTERIOR -----------------*/
.cabecera { width:100%}
.margenes {  width:90%; max-width: 1300px; text-align: left; margin:30px auto 0px; display:block; font-size:90%}
.margenes p,.margenes li { color:#444; line-height:145%}
.margenes h3 {font-size:140%; font-weight:500;color:#a40083;margin-bottom:20px}
.titular { position:relative; /*background-color:#a80077;*/ min-height: 78px}
.titular h2,.titular h1,.h1 {position:absolute; z-index:999; left:20px; bottom:20px; color:#fff; font-size:180%; font-weight:700; text-align:left}
.titular h1 strong{ display:block; font-size:180%; font-weight:300; margin-top:0}
.titular .h1.quienes strong{ display:block; font-size:100%; font-weight:300; margin-top:0}

.box { display: inline-block; vertical-align: top; width: 28%; margin: 0 2% 20px}
.box img { width: 85%; max-width: 150px; margin: 0 auto!important; display: block;}

.cont { text-align:left; display: block; margin:30px 2%}
.cont.conoce > h2{ text-transform:none;  margin:2rem auto 4rem; text-align:center}
.cont h2{ font-size:220%; text-transform:uppercase; margin-top:-5px}
.cont h2 span{ display:block; width:50px; height:2px; margin: 20px 0 40px; background-color:#a80077}
.a_gen { margin:30px 0; border-bottom:1px solid #ccc; padding-bottom:30px}
.a_gen.fin { margin:30px 0 0; border-bottom:none; padding-bottom:0px}
.cont .article { width:30%; display:inline-block; vertical-align:top; text-align:left}
.cont .article p,.article li{ font-size:90%; line-height:145%}
.article.a3 { width:68% }
.article.a2 { margin-right:5%; margin-left:1% }
.article li { display:inline-block; vertical-align:top; width:28%; margin-right:3%; margin-bottom:40px}
.img1,.img2,.img3,.img4,.img5,.img6 { background:url(../img/paso-1.png) left top no-repeat; width:105px; height:100px; display:block; margin:0 auto 10px}
.img2 { background:url(../img/paso-2.png)}
.img3 { background:url(../img/paso-3.png)}
.img4 { background:url(../img/paso-4.png)}
.img5 { background:url(../img/paso-5.png)}
.img6 { background:url(../img/paso-6.png)}

.mTop { padding-top:60px}

.hosting { text-align: center; margin: 20px 0 0; display: block; font-size:90%}
.hosting h2,.hosting h1,.formulario h1{ color:#a80077; font-weight:400 }
.hosting h2 strong, .hosting h1 strong,.formulario h1 strong{ display:block; color:#111; font-size:150%; margin-bottom:10px}
.hosting h2 span, .hosting h1 span,.formulario h1 span,.margenes h2 span{ display:block; width:100px; height:3px; margin:25px auto 40px; background-color:#a80077}
.hosting .intro { width:70%; margin:0 auto 30px; display:block}
.hosting h3 {color:#111}
.hosting p, .hosting li{ line-height:145%}
.hosting li { text-align:left; margin-left:20px}
.ok li { background:url(../img/accept.png) left 3px no-repeat; padding-left:25px; background-size:20px }
.c_hosting img, .texto { width:45%; display:inline-block; vertical-align: middle; text-align:left }
.c_hosting img { max-width:450px; margin-right:3%}
.c_hosting.centro { margin:40px auto 0; border-top:1px solid #ddd; padding-top:30px; width:70%}
.hosting .enlace a{ margin:30px 0}
.hosting .enlace.centro a{ margin:30px auto}
.borderTop { border-top:1px solid #ddd; padding-top:30px}
.bTop { border-top:1px solid #ddd; padding-top:20px; margin-top:0}
.texto.mangen-bot h2 { margin-bottom:20px; display:block} 
.texto.mangen-bot ul { margin-bottom:20px} 
.enlace.ayudasTic a { margin:60px auto!important; background-color:#f451d9;color:#fff; font-size:110%}
.enlace.ayudasTic a:hover{ background-color:#a40083; border-color:#a40083;}
table.ayudasTic { text-align:left; margin:30px auto; font-size:85%; width:80%; background-color:#eee }
table.ayudasTic th { background-color:#222; color:#fff; font-weight:500;padding:8px }
table.ayudasTic td{ border-bottom:1px solid #fff; color:#222; padding:8px}

.txt-ancho { margin:20px auto; max-width:1000px}
.txt-peq a{ font-size:90%; text-decoration:underline}
.txt-peq a:hover{ color:#000}

.packs li { display:inline-block; padding:0 0 20px; vertical-align:top; width:250px; margin:30px 10px; text-align:center; border-radius:10px;
background: rgba(242,245,248,1); border-bottom:2px solid #ddd;background: -moz-linear-gradient(left, rgba(242,245,248,1) 0%, rgba(252,253,253,1) 21%, rgba(255,255,255,1) 53%, rgba(252,253,253,1) 81%, rgba(242,245,248,1) 100%);background: -webkit-gradient(left top, right top, color-stop(0%, rgba(242,245,248,1)), color-stop(21%, rgba(252,253,253,1)), color-stop(53%, rgba(255,255,255,1)), color-stop(81%, rgba(252,253,253,1)), color-stop(100%, rgba(242,245,248,1)));background: -webkit-linear-gradient(left, rgba(242,245,248,1) 0%, rgba(252,253,253,1) 21%, rgba(255,255,255,1) 53%, rgba(252,253,253,1) 81%, rgba(242,245,248,1) 100%);background: -o-linear-gradient(left, rgba(242,245,248,1) 0%, rgba(252,253,253,1) 21%, rgba(255,255,255,1) 53%, rgba(252,253,253,1) 81%, rgba(242,245,248,1) 100%);background: -ms-linear-gradient(left, rgba(242,245,248,1) 0%, rgba(252,253,253,1) 21%, rgba(255,255,255,1) 53%, rgba(252,253,253,1) 81%, rgba(242,245,248,1) 100%);background: linear-gradient(to right, rgba(242,245,248,1) 0%, rgba(252,253,253,1) 21%, rgba(255,255,255,1) 53%, rgba(252,253,253,1) 81%, rgba(242,245,248,1) 100%);filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f2f5f8', endColorstr='#f2f5f8', GradientType=1 );}
.packs li.packs_ancho{ display:block; width:70%; margin:0 auto 50px; }
.packs li .precio { display:block; font-size:180%; margin:30px auto; border-bottom:3px solid #d7dbdc; padding-bottom:30px; font-weight:600; width:75%; color:#636466; text-align:center }
.packs li strong { display:block; font-size:140%; background-color:#c00087; color:#fff; padding:30px 0; border-radius:10px 10px 0 0; text-align:center }
.packs li.packs_ancho strong { padding:30px 0; margin-bottom:20px }


.ico { background:url(../img/accept.png) left 3px no-repeat;  background-size:15px; padding-left:20px; display:block; text-align:left; font-size:80%; color:#666; width:70%; margin:0 auto}
.packs li a { display:block; margin:20px auto; border-radius:30px; text-align:center; padding:10px; width:70%; color:#fff; background: rgba(192,0,134,1);
background: -moz-linear-gradient(left, rgba(192,0,134,1) 0%, rgba(168,0,119,1) 0%, rgba(23,112,146,1) 100%);background: -webkit-gradient(left top, right top, color-stop(0%, rgba(192,0,134,1)), color-stop(0%, rgba(168,0,119,1)), color-stop(100%, rgba(23,112,146,1)));background: -webkit-linear-gradient(left, rgba(192,0,134,1) 0%, rgba(168,0,119,1) 0%, rgba(23,112,146,1) 100%);background: -o-linear-gradient(left, rgba(192,0,134,1) 0%, rgba(168,0,119,1) 0%, rgba(23,112,146,1) 100%);background: -ms-linear-gradient(left, rgba(192,0,134,1) 0%, rgba(168,0,119,1) 0%, rgba(23,112,146,1) 100%);background: linear-gradient(to right, rgba(192,0,134,1) 0%, rgba(168,0,119,1) 0%, rgba(23,112,146,1) 100%);filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#c00086', endColorstr='#177092', GradientType=1 );}

.c_hosting.serv_alojam{ border-top:1px solid #ddd; margin-top:30px; padding-top:30px;}
.serv_alojam li{ display:inline-block; vertical-align:top; width:28%; margin: 0 2% 10px}
p.s1, ul.s1 li { display:inline-block; width:45%; margin:20px 1%; vertical-align:top}
p.s1 img, ul.s1 li img { width:25%; max-width:100px; display:inline-block; vertical-align: middle; margin-right:3%}
p.s1 span, ul.s1 li span { width:70%; display:inline-block; vertical-align:middle; text-align:left}
 ul.s1 li { display:inline-block; width:30%; margin:20px 1%; vertical-align:top}

/*-- Carousel --*/

.mTop {
  align-items: center;
  display: flex;
  justify-content: center;
}

@-webkit-keyframes scroll {
  0% {-webkit-transform: translateX(0); transform: translateX(0)}
  100% {-webkit-transform: translateX(calc(-200px * 7));transform: translateX(calc(-200px * 7))}
}
@keyframes scroll {
	0% { -webkit-transform: translateX(0);transform: translateX(0)}
  100% {-webkit-transform: translateX(calc(-200px * 7));transform: translateX(calc(-200px * 7))}
}
.slider { background: transparent;height: 100px;margin: auto;overflow: hidden;position: relative;width:99%}
.slider::before, .slider::after {content: "";height: 80px;position: absolute;width: 180px;z-index: 2}
.slider::after {right: 0;top: 0;-webkit-transform: rotateZ(180deg);transform: rotateZ(180deg)}
.slider::before {left: 0;top: 0}
.slider .slide-track {-webkit-animation: scroll 40s linear infinite;animation: scroll 40s linear infinite;display: flex;width: calc(200px * 14)}
.slider .slide {  height: 100px;width: 200px}

/* Navidad */
.hosting h2 { color:#111; font-size:100%; font-weight:600; margin-bottom:0}
ul.navidad{ margin-top:40px; margin-bottom:40px; border-bottom:1px dotted #ddd; padding-bottom:40px}
ul.navidad li { display:inline-block; vertical-align:middle; width:30%; margin:0 1% 10px; text-align:center; font-size:100%; font-weight:700}
ul.navidad li img { width:100%; display:block}
ul.navidad li span{ display:block; width:80px; height:5px; background-color:#F0494C; margin:0 auto}

/* -- ACORDEON --*/
.accordion {background-color: #eee;color: #444;font-weight:bold; cursor: pointer;padding: 18px;width: 100%;border: none;text-align: left; outline: none;font-size: 15px;transition: 0.4s}
.active, .accordion:hover {background-color: #ccc}
.accordion:after {content: '\002B';color: #777;font-weight: bold;float: right;margin-left: 5px}
.active:after {content: "\2212"}
.panel {padding:0 18px;background-color: white; max-height: 0; overflow: hidden;transition: max-height 0.2s ease-out; border:1px solid #eee; margin-bottom:1px}
.panel h4{ margin-top:15px}

/* --  PIE  -- */
#pie{ width:100%; margin: 30px auto 20px}
.pie-1{ text-align: center; background-color: #a80077; padding:20px 0; margin-bottom: 20px; background: rgba(255,93,177,1);
background: -moz-linear-gradient(left, rgba(255,93,177,1) 0%, rgba(164,0,131,1) 100%);
background: -webkit-gradient(left top, right top, color-stop(0%, rgba(255,93,177,1)), color-stop(100%, rgba(164,0,131,1)));
background: -webkit-linear-gradient(left, rgba(255,93,177,1) 0%, rgba(164,0,131,1) 100%);
background: -o-linear-gradient(left, rgba(255,93,177,1) 0%, rgba(164,0,131,1) 100%);
background: -ms-linear-gradient(left, rgba(255,93,177,1) 0%, rgba(164,0,131,1) 100%);
background: linear-gradient(to right, rgba(255,93,177,1) 0%, rgba(164,0,131,1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ff5db1', endColorstr='#a80077', GradientType=1 )}
.pie-1 h2{ font: 400 140% 'Roboto Condensed', sans-serif; color: #fff}
.pie-1 h2 strong{ font-weight: 600; text-transform: uppercase}
.pie-1 ul {width: 70%; margin: 0 auto; text-align: center}
.pie-1 li { display: inline-block; vertical-align: top; width: 45%; color: #fff}
.pie-1 li a,.pie-1 p{ color: #fff }
.pie-1 li a strong{ font-size: 120%; font-weight: 600 }
.pie-1 li img{ display: block; margin:0 auto; width: 100px}

.pieInf { width:100%; text-align:center; clear:both; color:#343434; font-size:75%; padding-bottom:20px}
.pieInf a { padding:0 5px; color:#343434}
.pieInf a:hover { text-decoration:underline}

.pie-1 .redes li{ color:#fff; font-weight:500; width:auto; margin:40px 3%; font-size:90%}
.pie-1 .redes li img{ display:inline-block; vertical-align:middle; margin-right:5px; width:28px}
.pie-1 .redes li a{ color:#fff}

/* formulario */

hr{ border:none; height:1px; background-color:#ccc; z-index:9999}

.formulario { text-align: center; margin:0; display: block; border-top:1px solid #ddd; padding-top:20px; font-size:90%}
/*.formulario h1{ color:#a80077; font-weight:400; font-size:100%; margin:0}
.formulario h1 strong { display:block; color:#111; font-size:190%; font-weight:700; margin:0 0 20px}
.formulario h2 span{ display:block; width:100px; height:3px; margin:25px auto 40px; background-color:#a80077}*/
.formulario .intro { width:70%; margin:0 auto 20px; display:block; text-align:left}
.bloqueContact { width:25%; display:inline-block; vertical-align:top; text-align:left; margin:20px 2%}

#formulario { text-align:center; width:70%; margin:0 auto}
#formulario .intro{ border-top:1px dotted #ddd; padding-top:20px; text-align:center; width:100%; font-size:90%}
.mb{margin-bottom:50px}
.t2{font:bold 120% Arial, Helvetica, sans-serif;color:#666;margin-bottom:0px}
.f1{ display: inline-block; width:45%; text-align:left; vertical-align:top; margin-left:2%}
#formulario label{display:block;line-height:150%; color:#222}
#formulario input, #formulario textarea{
	font:400 100% Segoe, "Segoe UI", Verdana, sans-serif;
	border:1px solid #444;
	padding:8px;
	color:#000;
	width:90%;
	background-color:#fff;
	border-radius:3px;
	margin:0 0 3px;	
	list-style-type:none;
}
#formulario textarea{height:199px}
#formulario .boton{border-style:none;font-size:100%;width:225px;text-align:center;color:#fff;background-color:#222;display:block;margin:40px auto 20px;cursor:pointer;padding:15px 0 15px}
#formulario .boton:hover{ background-color:#000}
#formulario a{	color:#333; font-weight:bold;	border-bottom:1px dotted #666}
#formulario a:hover{	border-bottom:1px solid #666; text-decoration:none}

.rgpd,#formulario label.checklabel { width:90%; margin:20px auto; display: block;text-align:left; font-size:85%;}
#formulario input.check{margin:0px 3px 0 0; padding:0; width:18px; height:18px;border:1px solid #000;color:#ccc; display:inline-block; vertical-align:middle}
p.rgpd{ line-height:145%; font-size:85%; color:#555}

.recaptcha { margin:40px auto 0; width:305px}

.gracias{ width:90%; max-width:900px; margin:0 auto}

.gracias h3{ font-size:120%; width:80%; margin:20px auto}
.gracias h3 span{ display:block; width:64px; height:64px; background:url(../img/checked-symbol.png) center no-repeat;margin-bottom:20px; margin:0 auto 20px}
.gracias p{line-height:150%}
.gracias a{text-decoration:underline}
.gracias a:hover{color:#cc0000}


/*--- Cookies ----*/
.cookies{width:100%;background-color:#eee;margin:8px auto 0;padding:25px 0 20px;display:none; position:fixed; bottom:0; z-index:99999}
.cookiesCaja { margin:0 auto;color:#fff;width:950px;font-size:85%;}
p.cookiesTxt{ float:left; width:800px;color: #111; font: 400 90% "Open Sans", Segoe, "Segoe UI", "sans-serif"}
p.cookiesTxt a{ color: #111; text-decoration: underline}
p.cookiesBot{background-color:#111; display:block; float:right; width:120px; margin-top:6px; text-align:center;padding:5px 0;color:#ddd!important;  text-decoration:none!important;-webkit-border-radius: 3px;-moz-border-radius: 3px;border-radius:3px}
p.cookiesBot a{color:#fff; text-decoration:none; text-transform:uppercase; cursor:pointer; font:600 95% Montserrat, Segoe, sans-serif}
p.cookiesBot a:hover{color:#ddd}

.cookiesTabla th{ text-align:left; padding:12px 5px; background-color:#ccc}
.cookiesTabla td{ text-align:left; padding:12px 5px; background-color:#eee}

/*------- PAGINAS INTERIORES -------*/
.container .cabecera{ width:100%; margin:0}
.container .cabecera img{ width:100%; border-top:1px solid #fff}


/* RESPONSIVE */
@media only screen and (min-width: 1600px) {
.header { margin:0 auto; position:relative; max-width:1390px }
.container { margin: 0 auto; max-width:1390px}

}
@media only screen and (min-width: 991px) and (max-width: 1250px) {
.container { margin: 0 auto; max-width:1390px; width:100%}
/* HEADER */
.header {margin-left:2%}
.menu { margin-left:20px}
#nav li a { margin-right:18px}
#nav > li:last-child { right:0%}
#nav > li:last-child a:hover{ background-color: #000; border-bottom: none}

/*----------- BSXLIDER  ------------*/
.bx-wrapper li span {font-size:110% }
.bx-wrapper li span strong {font-size:180%}
}

@media only screen and (max-width: 990px) {
.with-sidebar .site-pusher {-webkit-transform: translateX(250px);transform: translateX(250px)}
.with-sidebar .site-cache {position: absolute;top: 0;left: 0;right: 0;bottom: 0;background-color: rgba(0, 0, 0, 0.6)}  
.site-pusher, .site-container {height: 100%}
.site-pusher { -webkit-transition-duration: 0.3s;transition-duration: 0.3s;-webkit-transform: translateX(0px);transform: translateX(0px)}

header.header {position: static;height:45px; margin:0}
.header_icon {position: absolute;display: block;width:50px;height:50px;cursor: pointer; top:9px; left:5px; z-index:20; border-radius:30px;}
.header_icon:after {content: ''; position: absolute;display: block;width: 1rem;height: 0;top: 7px;left:16px;box-shadow: 0 11px 0 1px #333, 0 18px 0 1px #333, 0 25px 0 1px #333}
.header_icon:hover {background-color:#e6e7ee}
.header_logo {display:block; position:absolute; z-index:10; top:19px; left:55px}
.header_logo img{ width:auto}

.menu{position: absolute;left: 0;top: 0;bottom: 0;background: #f451d9 none;width: 250px;-webkit-transform: translateX(-250px);transform: translateX(-250px); margin:0}
.menu p { margin: 20px 0 0 20px; display: block}
.menu p a { color: #fff!important; margin-bottom:10px }
.menu p a:hover { color: #000!important}
#nav { margin:0 auto; width: 100%;display: block; text-align: left;padding-top: 20px!important}
#nav li {display:block;margin-right:0}
#nav li a {color:#000;display: block;border-bottom:none;line-height: 180%!important; padding: 0 0 0 20px;}
#nav li:first-child,.menu p { display: block; }
#nav li:hover a, #nav a:hover { color: #fff; line-height: normal;border-bottom:none}
#nav li.active a { background-color: transparent; color: #5a67ac}
#nav li:last-child { margin:0; position:inherit;}
#nav li:last-child span{ display:block}
#nav li:last-child a{ background-color: #fff; width:200px; padding:3px 0; margin:20px 0 0 20px; color: #f451d9!important; font-size: 120%; text-align: center; border:2px solid #fff!important;}
#nav li:last-child a:hover,#nav li:last-child a span:hover{ background-color:#fff}
#nav li:last-child a:hover{ border:2px solid #000!important}
#nav li a .mas { background: url(../img/ico-mas-ne.png) left 0 no-repeat;}
#nav li a:hover .mas { background: url(../img/ico-mas-bl.png) left 0 no-repeat;}
#nav li.occ { display:none}
#nav li.mov { display:block}

.tel { position:absolute; right:3%; top:22px; font-size:90%; display:block; width:40%; text-align:right}
.tel strong { font-weight:500}
.tel_ico{ background: url(../img/phone-top.png) left 2px no-repeat; font-size:80%; font-weight:500; margin-right:2%; display:inline-block; vertical-align:top; width:16px; height:16px; padding-bottom:5px}
.tel img { display:inline-block; margin-left:10px}
/*----------- BSXLIDER  ------------*/
.container { width:100%; margin:0 auto}
.bx-wrapper li span {width:38%; right:8%; top:17%; color:#500240; font-size:100%}
.bx-wrapper li span a { margin:25px 0 0; border-radius:5px;}
.bx-wrapper li span strong {font-size:140%}

.destacados_lista { font-size:90%}
.trabajos p.tit{ font-size: 130%; margin:0 0 50px}

/*-- Cumplimos 10 años --*/
.cumple { margin: 20px 0 20px; font-size:90%}
.cumple h2 { font-weight:500}
.cumple img, .cumple div { display: inline-block; width: 70%; vertical-align: middle}
.cumple img {width: 15%; max-width: 200px}

table.ayudasTic { width:90%}
.txt-ancho { margin:20px auto; max-width: inherit; width:90%; text-align:left!important}

/*--Pie --*/
#pie{ width:100%; margin: 30px auto 20px}
.pie-1 h2{ font: 400 120% 'Roboto Condensed', sans-serif; color: #fff}
.pie-1 li a { font-size:90%}
.pie-1 li a strong{ font-size: 110%; font-weight: 600 }
.pie-1 li img{ display: block; margin:0 auto; width:80px}

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

/* IMAGE CAPTIONS */
.bx-wrapper { background-color: #fff}
.bx-wrapper .bx-prev,.bx-wrapper .bx-next { display:none}

.bx-wrapper .bx-pager.bx-default-pager a {background-color:#ccc;display: block;width: 10px;height: 10px;margin: 10px 3px 0;	-moz-border-radius: 8px;-webkit-border-radius: 8px;border-radius: 8px; border:0}
.bx-wrapper .bx-pager.bx-default-pager a:hover{background: #f451d9}
.bx-wrapper .bx-pager.bx-default-pager a.active {width:18px;height: 18px}


.bx-wrapper .bx-pager,.bx-wrapper .bx-controls-auto {	position: static;bottom:20px;width: 100%; right: auto}
.bx-wrapper li {background:#a80077; padding:15px 0 25px; min-height:420px}
.bx-wrapper li.slide-02 { background-color:#2e65a4}
.bx-wrapper li.slide-03 { background-color:#089484}
.bx-wrapper li.slide-tic { background-color:#6d0073}

.bx-wrapper li img { margin-bottom:20px}
.bx-wrapper li span { position: static;font-size:130% }
.bx-wrapper li span strong {font-size:140%; font-weight:600; text-align:center; margin:8px 1% }
.bx-wrapper li span b{ font-size:80% }
.bx-wrapper li span a { margin:20px auto 0; width:280px; font-size:80%; padding:10px 0}

.bx-wrapper li.navidad {background: url(../img/fondo-navidad.jpg) center bottom repeat; padding:0 0 25px}
.bx-wrapper li.navidad span { position: static;font-size:130%}
.bx-wrapper li.navidad span a { margin:20px auto 0; width:280px; font-size:80%; padding:10px 0}


.destacados { margin: 0px auto 0px}
.destacados h2,.trabajos h2 {font-weight:500; font-size: 140%}
p.tit{ font-size: 120%; margin:0 0 30px}
.destacados_lista {text-align: center; margin-bottom: 40px; display:block; width:100%}
.destacados_lista li{ display:inline-block; vertical-align:top;  width:40%!important; padding: 0 4%; line-height: 140%; font-size:95%; }
.destacados_lista li h3{ margin: 10px 0 8px; font-weight: 600;font-size:120%;} 
.destacados_lista img { width: 60%; display: block;margin: 0 auto}

.trabajos p.tit{ font-size: 100%; margin:0 0 40px}


/*-- Cumplimos 10 años --*/
.cumple { margin: 20px 0 20px; font-size:85%}
.cumple h2 { font-weight:500; font-size:140%}

/*------------- INTERIOR ---------------*/

.titular h1 { left:20px; width:90%; margin:0 auto 0; font-size:120%; text-align:left}
.margenes { margin:15px auto 0px}
.margenes h3 { font-size:120%}

.cont .article { width:100%; display:block; margin:0 auto}
.cont .article p,.article li{ font-size:90%; line-height:145%}
.article h2{ font-size:150%}
.article.a3 { width:95%; }
.article.a2 { margin: 10px auto }
.article li { display:inline-block; vertical-align:top; width:30%; margin:0 1%; margin-bottom:20px}
.mTop { padding-top:0px; width:100%}

.box { display: inline-block; vertical-align: top; width:47%; margin: 0 2% 20px 0}
.box img { width:120px; max-width: inherit}

.hosting { text-align: center; margin: 20px 0 0; display: block; font-size:90%}
.hosting h2{ color:#a80077; font-weight:400; font-size:120%; line-height: normal}
.hosting h2 strong{ display:block; color:#111; font-size:130%; margin-bottom:5px}
.hosting h2 span{ display:block; width:100px; height:3px; margin:25px auto 40px; background-color:#a80077}
.hosting .intro { width:90%; margin:0 auto}
.hosting p, .hosting li{ line-height:145%}
.hosting li { text-align:left; margin-left:20px}
.ok li { background:url(../img/accept.png) left 3px no-repeat; padding-left:25px; background-size:20px }
.c_hosting img, .texto { width:90%; display:block; margin:0 auto }
.c_hosting img { max-width:450px; margin:0 auto}
.c_hosting.centro { margin:40px auto 0; border-top:1px solid #ddd; padding-top:30px; width:90%}

.hosting .enlace a{ margin:30px auto}

.c_hosting.serv_alojam{ border-top:1px solid #ddd; margin-top:30px; padding-top:30px;}
.serv_alojam li{ display:block; width:90%; margin: 0 auto 10px}
p.s1, ul.s1 li { display:block; width:90%; margin:20px auto; text-align:left }
p.s1 img, ul.s1 li img { width:25%; max-width:100px; display:inline-block; vertical-align: middle; margin-right:3%}
p.s1 span, ul.s1 li span { width:70%; display:inline-block; vertical-align:middle}
ul.s1 li { display:block; width:90%; margin:20px auto}


 /* Formulario */
.formulario .intro { width:90%}
.bloqueContact { width:43%; display:inline-block; vertical-align:top; text-align:left; margin:20px 2%}
#formulario { width:90%}
 .f1{ display: inline-block; width:49%; text-align:left; vertical-align:top; margin-left:0%}
.rgpd,#formulario label.checklabel { width:100%}

/*Galeria*/
p.headline {font-size:80%; width:90%; bottom:10px}
p.headline strong{ font:700 150% Segoe, sans-serif; display:block}
p.headline a{ font:400 90% Segoe, sans-serif; display:block; margin-top:15px; color:#dd34ac}


/*COOKIES*/
.cookiesCaja { width:98%; padding:10px 0}
p.cookiesTxt{ width:100%; display:block; float:none}
p.cookiesBot{width:25%; float:none; margin:15px auto 10px}
.pie-1 ul {width:80%}
.pie-1 li { width: 47%}
.pie-1 li:first-child{ margin-right:3% }

}

@media only screen and (max-width: 560px) {
.occ { display:none}
header.header {height:30px;}
/*.header div { width:100%;display: block; position:fixed!important; top:0; height:52px; border:1px solid #000}
*/

.header_icon {top:7px; left:4px;width:40px;height:40px;}
.header_icon:after {top: 2px;left:12px}
.header_logo {top:13px; left:53px; width:180px}
.header_logo img {width:100%}

.tel strong { display:none!important}
.tel { top:20px; width:80px}
.tel_ico{ background: url(../img/telephone.png) left 0px no-repeat; padding-left:0px; font-size:80%; font-weight:500; width:16px; height:16px}
.tel img { margin-left:6px}

.bx-wrapper li span strong {font-size:130%; font-weight:600; text-align:center; margin:8px 1% }
.bx-wrapper li span b{ margin:8px auto; text-align:center; display:block; width:90%}
.bx-wrapper li span a { margin:20px auto 0; width:280px; font-size:80%; padding:10px 0}

/*-- Cumplimos 10 años --*/
.cumple { padding-top:0px}
.cumple h2 { text-align:center}
.cumple img, .cumple div { display: block; width: 90%; margin:0 auto; vertical-align: middle}
.cumple img {width: 15%; max-width: 200px}
.cumple div { margin:0 auto; width:90%}
.cumple div a{ margin:0 auto 30px}

/*Galeria*/
#g1,#g2,#g3{ display: inline-block; vertical-align: top; width: 48%;position:relative}
#g1 { width:97%!important; display:block; margin:0 0 4px 7px}
#g2 { margin-left:0; border-left:none}
#g3{ margin:0; border-right:4px solid #fff}

/*--- interiores ---*/

.article li { display:block;  width:100%; margin:0 auto; margin-bottom:20px}

.box { display: inline-block; vertical-align: top; width:100%; margin: 0 auto 10px;  border-bottom:1px solid #ddd; padding-bottom:20px;}
.box img { width:120px; max-width: inherit; display: block;}

.titular { min-height: inherit; background-color:transparent}
.titular .cabecera { display:none}

.hosting h2,.hosting h1,.formulario h1,.margenes h2 { font-size:110%; margin:0 3%; color:#111; font-weight:700; width:inherit; text-align:center}
.hosting h1 strong,.formulario h1 strong,.titular h1,h1.quienes  {font-size:110%; display:block; color:#fff; margin:0 2% 8px; padding:10px 0; background-color:#a80077; border-radius:25px; text-transform:none; font-weight:600}
h1.quienes strong { display:none}
.titular h1 {position: static;left:0px; bottom:0; text-align:center; width:96%!important; margin:0 2%}
.c_hosting.centro { margin:30px auto 0; padding-top:0px;}
.c_hosting img { max-width:350px}
.hosting h2 span,.hosting h1 span,.margenes h2 span  { margin:20px auto}
.intro { font-size:85%!important; text-align:left; font-style:italic}
.a_gen { margin:20px 0; padding-bottom:20px}
.cont h2{ font-size:120%}
.cont h2 span{ margin: 20px 0}


.c_hosting.serv_alojam{ margin-top:20px; padding-top:10px;}
.serv_alojam li{ display:block;  width:100%; margin: 0 auto 10px}
p.s1, ul.s1 li { display:block; width:100%; margin:20px auto; vertical-align:top}
p.s1 img, ul.s1 li img { width:90%; max-width:100px; display:block; vertical-align: middle; margin: 0 auto}
p.s1 span, ul.s1 li span { width:90%; display:block; margin:0 auto}
ul.s1 li { display:block; width:100%; margin:20px auto; vertical-align:top}
.bloque { display:block; margin-top:8px}
.block { display:block; text-align:center}
.borderTop { padding-top:20px}
.bTop { border:none; padding-top:0}



.formulario { text-align: center; margin:10px 1%; display: block; border-top:none; padding-top:0px}
.formulario .intro { width:90%; margin:8px auto 20px;}
#formulario{ width:90%; margin:0 auto}
#formulario .intro{ padding-top:20px; margin:20px auto; width:100%; font-style:normal; text-align:left}
#formulario input, #formulario textarea{width:96%; padding:8px 2%}
.bloqueContact { width:90%; display:block; margin:20px auto}
.bloqueContact strong { font-size:110%}
.mb{margin-bottom:50px}
.t2{font:bold 120% Arial, Helvetica, sans-serif;color:#666;margin-bottom:0px}
.f1{ display: block; width:100%; margin-left:0}

.rgpd,#formulario label.checklabel { width:100%; margin:10px auto}
#formulario label.checklabel {margin:20px auto}
#formulario .boton{font-size:120%;width:225px;margin:25px auto 0}

/*-- pIE  ---*/
#pie{ width:100%; margin:20px auto 10px}
.pie-1 { padding:8px 0; margin-bottom:10px}
.pie-1 h2{ font: 400 100% 'Roboto Condensed', sans-serif; color: #fff; margin-bottom:20px}
.pie-1 ul {width: 90%}
.pie-1 li { width: 100%; display:block; margin:20px 0; color:#fff}
.pie-1 li:first-child{ margin:0 auto}
.pie-1 li img{ width:50px}
.pieInf span { display:block; text-align:center}
.pieInf a { padding:0; margin-top:3px}

.pie-1 .redes li{ color:#fff; font-weight:500; width:auto; margin:20px 0; font-size:90%; width:40%; display:inline-block}
.pie-1 .redes li img{ width:32px; display:inline-block; vertical-align:middle; margin-right:5px; width:28px}
.pie-1 .redes li a{ color:#fff}

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

.bx-wrapper li img { margin-bottom:0}
.bx-wrapper li span { color:#f9bbf2; font-size:90%}
.bx-wrapper li span strong {font-size:150%; font-weight:600; text-align:center; margin:8px 1% }
.bx-wrapper li span b{ margin:8px auto; text-align:center; display:block; width:88%; font-size:100%}
.bx-wrapper li span a { margin:20px auto 0; font-size:100%; width:250px}

.bx-wrapper li.navidad {background: url(../img/fondo-navidad.jpg) center bottom repeat; padding:0 0 25px}
.bx-wrapper li.navidad span { font-size:90%}
.bx-wrapper li.navidad span strong {font-size:130%}
.bx-wrapper li.navidad span a { margin:20px auto 0; width:250px; font-size:90%}


.destacados h2,.trabajos h2 {font-weight:400; font-size: 120%}
p.tit{ font-size: 110%}
.destacados_lista li{ display:block; vertical-align:top;  width:90%!important; padding:0  0 30px; line-height: 140%; font-size:90%; border-bottom:1px dashed #e1bcda; margin:0 auto 10px }
.destacados_lista li:last-child{ border-bottom:none; margin:0 auto}
.destacados_lista li h3{ margin: 0px 0 8px; font-weight: 600;font-size:120%;} 
.destacados_lista img { width: 40%; display: block;margin: 0 auto}

p.headline {bottom:5px}

.titular h2,.titular h1 {left:15px; bottom:15px; font-size:100%; width:60%}
.titular h1 strong{ font-size:100%}

.packs li { width:90%}
.hosting { margin-top:10px}
.hosting h2{ font-size:100%}
.hosting h2 strong{  font-size:140%; line-height:130%}
.hosting h2 span{ margin:15px auto}
.c_hosting img { margin-top:15px}
}