/* index CSS 
=============

01. Variables de color
02. Matriz de contenido
03. Header 
04. BreadCrumbs
05. logoAsistencia
06. Comparativa de precios
07. aside 

07. Slide
05. Que es un hosting
09. Todos nuestros planes incluyen
*/


/* 01. Variables de color */
body {
	--verde: #87C100;
	--verde2: #6F9D00;
	--gris: #959788;
	--grisTxt: #333;
	--grisFondo: #595957;
	--blanco1: #FFF;
	--blanco2: #F0F0E1;
}
/* accion colores */
.verdeBg { background: var(--verde); }
.verdeTxt { color: var(--verde); }

.grisBG { background: var(--gris); }
.grisTxt { color: var(--gris); }

.blanco1Bg { background: var(--blanco1); }
.blanco1Txt { color: var(--blanco1); }
/*./accion colores */

/* 02. Matriz de contenido */
body {
	font-size: 15px;
	color: var(--grisTxt);
}
p {
	line-height: 1.8rem;
	font-size: .9rem;
}

/* 03.Header */
header nav {
	height: 3.58em;
	background: var(--verde);
}
header nav ul.menu {
	margin:0 auto;
}

header nav ul.menu li.nav-item {
	padding: .7rem;
}

header nav ul.menu li.nav-item:hover {
	background: var(--verde2);
}

header nav ul.menu li.nav-itemClientes {
	background: var(--gris);
}

header nav ul.menu li.nav-item a.nav-link {
	font-size: .98rem;
	color: var(--blanco1);
}

/* 04. BreadCrumbs */
nav#migas {
	background: var(--verde);
	width: 100%;
}

nav#migas .breadcrumb {
	background: var(--verde);
	color: var(--blanco2);
	padding: .4rem 1rem;
}

nav#migas .breadcrumb li {
	padding-left: .3rem;
	padding-right: .3rem;
}
nav#migas .breadcrumb li a {
	color: var(--blanco2);
}

nav#migas li.migasActive {
	color: var(--blanco1);
}

/* 05. logoAsistencia */
section#logoAsistencia {
	padding: 1rem 0;
}

section#logoAsistencia h1#laLogo span {
	display: none;
}

section#logoAsistencia div.laButton {
	padding-right: 0rem;
	padding-top: 1rem;
	vertical-align: middle;
}

section#logoAsistencia div.laButton button {
	background: var(--verde);
	border:0;
}
section#logoAsistencia div.laButton button:hover {
	background: var(--verde2);
}

section#logoAsistencia div.laButton a {
	background: var(--verde);
	border:0;
}
section#logoAsistencia div.laButton a:hover {
	background: var(--verde2);
}

/* 06. Comparativa de precios */
.unoTxt { 
	font-size: 1.5rem; 
}

.hr {
	width: 100px;
	background: var(--blanco2);
	height: 2px;
	display: inline-block;
}

.hrIcon {
	font-size: 1.6rem;
	color: var(--verde);
	padding: 1rem;
	vertical-align: middle;
}

.tcTitulo {
	background: var(--verde);
	color: var(--blanco1);
	font-size: 1.05rem;
	padding: .5rem .8rem;
	cursor: pointer;
	border-bottom: 4px solid var(--blanco1);
}
.tcTituloPlan div.col {
	background: var(--gris);
	color: var(--blanco1);
	padding: .7rem;
	margin: .5rem;
	font-weight: bold;
}

.fila1, .fila2 {
	padding: .83rem 0;
	font
}
.fila1 {
	background: var(--blanco1);
}
.fila2 {
	background: var(--blanco2);
}
.tcPrecios {
	border-top: 1px solid var(--verde);
	margin-top: 1rem;
}
.tcDescuento {
	color: var(--verde);
	display: block;
}
.tcBotonVerMas, .tcBotonComprar {
	background: var(--gris);
	padding: .5rem 1rem;
	display: block;
	margin: 0.1rem;
	color: var(--blanco1) !important;
	width: 8rem;
}
.tcBotonVerMas:hover {
	color: var(--blanco2) !important;
}

.tcBotonComprar {
	background: var(--verde);
}

.tcBotonAyuda {
	background: var(--verde);
	padding: .5rem 1rem;
	display: block;
	margin: 0.1rem;
	color: var(--blanco1) !important;
	
}

.detalleInterior {
	margin-top: 1rem;
}

/* 07. aside */
aside#detalle {}

aside#detalle h3 {
	font-size: 1.25rem;
}

aside#detalle ul img {
	cursor: pointer;
}

aside#detalle ul {
	padding: 0;
	list-style: none;
}

aside#detalle ul li {
	margin-bottom: 1.5rem;
}

aside#detalle ul li ul {
	padding-left: 1.5rem;
	list-style: circle;
}
/* 07. Slide */
section#slideDesktop {
	padding-bottom: 1rem;
}

/* 08. Que es un hosting */
section#detalle p {
	line-height: 1.8rem;
	font-size: 0.9rem;
}

section#detalle ol {
	padding-left: 1.8rem;
}

section#detalle ol li {
	font-size: 0.9rem;
	list-style: none;
	margin-bottom: .4rem;
	line-height: 1.8rem;
}

section#detalle ol li .detalleLista {
	margin-right: 1rem;
	color: var(--verde);
}

section#faq h2 {
	font-size: 1.2rem;
	color: var(--verde);
}
section#faq h2 button {
	font-size: 1rem;
	color: var(--verde);
}
section#faq h2 button i {
	color: var(--grisTxt);
}


section#faq p {
	line-height: 1.8rem;
	font-size: .9rem;
}

section#faq p#faqHosting { background: url(../images/server.png) no-repeat bottom right; }
section#faq p#faqDns { background: url(../images/globe.png) no-repeat bottom right; }
section#faq p#faqPpdns { background: url(../images/sitremap.png) no-repeat bottom right; }
section#faq p#faqDemora { background: url(../images/clock.png) no-repeat bottom right; }
section#faq p#faqTipos { background: url(../images/shop.png) no-repeat bottom right; }
section#faq p#faqDominio { background: url(../images/atlas.png) no-repeat bottom right; }
section#faq p#faqExcede { background: url(../images/hdd.png) no-repeat bottom right; }
section#faq p#faqSoporte { background: url(../images/headset.png) no-repeat bottom right; }
section#faq p#faqReseller { background: url(../images/reseller.png) no-repeat bottom right; }
section#faq p#faqDnsPersonalizadas { background: url(../images/globeSolid.png) no-repeat bottom right; }

/* 09. Todos nuestros planes incluyen */
section#nuestrosPlanes {
	margin: 2rem 0;
}
section#nuestrosPlanes h2 {
	font-size: 1.4rem;
	margin-top: 2rem;
}

section#nuestrosPlanes h2 i {
	margin-right: 1rem;
}

section#nuestrosPlanes ul {
	padding: 0;
	margin-top: 1rem;
}

section#nuestrosPlanes ul li {
	list-style: none;
	font-size: .9rem;
	margin-bottom: .4rem;
	text-align: justify;
}




footer {
	background: var(--grisFondo);
	border-top:.35rem solid var(--gris);
	color: var(--blanco1);
}

footer div.container {
	padding: 1rem 0;
}

footer div.container section#menuFooter ul li {
	border-bottom: 1px solid var(--gris);
	margin-bottom: 2px;
	padding: .5rem;
	cursor: pointer;
	list-style: none;	
}

footer div.container section#menuFooter ul li a {
	color: var(--verde);
}

footer div.container section#menuFooter ul li:hover {
	background: var(--verde);
}

footer div.container section#menuFooter ul li:hover a {
	color: var(--blanco1);
	text-decoration: none;
}

footer section div#fPlanes {
	/*margin: 2rem 0;*/
}

footer section#fRedesSociales ul li {
	display: inline-block;
	margin-right: .5rem;
}
footer section#fRedesSociales ul li a {
	display: inline-block;
	width: 3rem;
	height: 3rem;
	padding-top: 12px;
	border-radius: 1.5rem;
	background: var(--verde);
}

footer section#fRedesSociales ul li a i {
	font-size: 1.5rem;
	color: var(--blanco1);
}

footer section#fRedesSociales ul li:hover a {
	background: var(--blanco1);
}

footer section#fRedesSociales ul li:hover a i {
	color: var(--verde);
}
footer h1 {
	font-size: 1.8rem;
}

/* carrusel */
.menuCarrusel {
	margin: 2.5rem 0 2rem;
	box-shadow: 0 0px 20px #959788;
	padding: 1rem 1rem;
}

.nav-pills .nav-link.active {
	background: var(--verde);
}

.plan {
	margin-top: 1.6rem;
}
.plan .card {
	box-shadow: 0 10px 20px #959788;
	border: 0;
	transition: .4s ease;
}

.contador {
	background:var(--gris);
	color:var(--blanco1);
	cursor: pointer;
	box-shadow: 0 10px 20px #959788;
	border: 0;
	transition: .4s ease;
	margin-bottom: 2rem;
}





.pland {
	margin-top: 0;
}

.plan h1 {
	font-weight: bold;
	font-size:3rem;
	margin-bottom: 0rem;
}

.plan h6 {
	margin-bottom: 1.6rem;
}

.plan .title, .plan .destacado {
	background: var(--gris);
	color: var(--blanco1);
	font-weight: 600;
	margin-bottom: 0;
}

.plan .destacado {
	background: var(--verde);
	margin-bottom: 0;
	font-weight: normal;
}

.plan h4 {
	font-size: 1rem;
	margin-bottom: 0.7rem;
	font-weight: normal;
}

.plan h2 {
	font-weight: bold;
	margin-top: 1.7rem;
	margin-bottom: 0;
}

.plan h5.precioCarruseltachado {
	text-decoration: line-through;
	color: var(--verde);
	font-weight: bold;
}

.plan h5.precioCarruselDesc {
	margin-bottom: 1.7rem;
}

.plan:hover .card {
	background:var(--gris);
	color:var(--blanco1);
	cursor: pointer;
}

.plan:hover h5.precioCarruseltachado {
	color: var(--grisTxt);
}
.plan:hover .tcBotonVerMas {
	background: var(--verde);
}
#dominio .row {
	box-shadow: 0 0px 15px #959788;
	margin-bottom: 25px;
	border: 0;
	cursor: pointer;
	transition: .4s ease;
}
#dominio .row:hover {
	box-shadow: 0 0px 15px #959788;
	margin-bottom: 25px;
	border: 0;
	cursor: pointer;
	background: var(--gris);
	color: var(--blanco1);
}
.dom {
	background:var(--verde);
	color:var(--blanco1);
	font-size: 1.75rem;
	font-weight: bold;
	text-align: center;
	padding: 15px 0;
}
.domDestacado {
	background-color: var(--verde);
	color: var(--blanco1);
}
.domDestacado .tcBotonComprar {
	background-color: var(--gris);
}
#dominio .row:hover .domDestacado {
	background-color: var(--gris);
}
#dominio .row:hover .domDestacado .tcBotonComprar {
	background-color: var(--verde);
}

.domPrecio {
	font-size: 1.3rem;
	font-weight: bold;
	text-align: center;
	border: 0;
	padding-top: 15px;
}
.domPrecio small {
	display: block;
	font-size: .8rem;
}
.domDetalle {
	padding: 5px 0 5px 20px;
}
.domComprar {
	text-align: center;
	margin: 0 auto;
	padding-top:15px;
}

.tcBotonmenu{
	background-color: var(--verde);
	padding: .5rem 1rem;
	display: block;
	margin: 0.1rem;
	color: var(--blanco1) !important;
	
}

	 header nav .navbar .has-megamenu{position:static;!important;}
  	


  	header nav .megamenu{
  		margin-top: 5px;

  		padding: 15px;
  		background: var(--gris);
  		color: #ffffff;
  		box-shadow: 0 10px 20px #959788;
  	}
  	header nav .megamenu a{
  		color: #ffffff;
  	}
 	
 	@media screen and (
 		min-width: 800px) {
            header nav .megamenu{
            	width: 700px; 
            	overflow-y: auto;
            }
        }




        header nav .navbar .has-megamenu{position:static;!important;}
  	


  	header nav .megamenu2{
  		margin-top: 5px;  
  		padding: 15px;
  		background: var(--gris);
  		color: #ffffff;
  		
  	}
  	header nav .megamenu2 a{
  		color: #ffffff;
  	}
 	
 	@media screen and (
 		min-width: 800px) {
            header nav .megamenu2{
            	width: 700px; 
            	overflow-y: auto;
            	margin-left: -530px;
            }
        }

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