:root {
    --fuenteHeading: 'PT Sans', sans-serif;
    --fuenteParrafos: 'Open Sans', sans-serif;

    --primario: #9b07f16c;
    --gris: #e1e1e1;
    --blanco: #ffffff;
    --negro: #000000;
}
html {
    box-sizing: border-box;
    font-size: 62.5%; /* 1 rem = 10px */    
}
*, *:before, *:after {
    box-sizing: inherit;
}
body {
    font-family: var(--fuenteParrafos);
    font-size: 1.6rem;
    line-height: 2;
}




/** Globales **/
.contenedor {
    width: min(90%, 120rem);
    margin: 0 auto;
}
a {
    text-decoration: none;
}
h1, h2, h3, h4 {
    font-family: var(--fuenteHeading);
    line-height: 1.2;

}
h1 {
    font-size: 3.8rem;
    
}
h2 {
    font-size: 3.1rem;
    text-align: middle;
}
h3 {
    font-size: 2.8rem;
    
}
h4 {
    font-size: 2.2rem;
}
img {
    max-width: 100%;
}
/** Utilidades **/
.no-margin {
    margin: 0;
}
.no-padding {
    padding: 0;
}
.centrar-texto {
    text-align: left;
}

/** Header **/
.header {
    
}
hero {
   /* background-image: url(../img/hero.jpg);
    background-repeat: no-repeat;*/
    background-size: cover;
    height: 40rem;
    position: relative;
    margin-bottom: 2rem;
}
.contenido-hero {
    position: absolute;
    background-color: rgba( 0,0,0, .7 ); /** Anterior **/
    background-color: rgb( 0 0 0 / 70% );
    width: 100%;
    height: 100%;

    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;

}
.contenido-hero h2, 
.contenido-hero p {
    display: flex;
    flex-direction: column;
    text-align:left;
    /*justify-content: center;*/

    color: var(--blanco);
}



/**.header {
    height: 4rem;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center center;
   
}
.header__texto {
   text-align: right;
   color: var(--blanco);
   margin-top: 1rem;
}
@media (min-width: 768px) {
    .header__texto {
        margin-top: 15rem;
    }
}**/
.header{
/*background-color:rgb(238, 10, 10);
text-align:right;*/
}

/*#ninesixty
{
    height:900px;
    width:960px;
    margin-top:40px;
    background-color:white;
    margin: 0 auto;
    text-align:center;
    border-radius:8px;
}
#ninesixty h1 {
    display: inline-block;
}*/
.barra {
    padding-top: 1rem;
}
    @media (min-width: 768px) {
    .barra {
        display: flex;
        justify-content: space-between;
        align-items: left;
    }
}

.propiedades{
  /*  margin-top:4rem;*/
    width: 100%;
   border-spacing:2rem;
}
   thead{
       background-color:#aeff59;
   
}
th{
    color:#fff;
    padding:2rem;
}

.banner{
    
    width: 100%;
    height: 40rem;
    border: 3px solid rgb(80, 80, 80);
    margin top:auto;
   /* background-image: url(../images/headers.jpg) ;*/
    background-size: 100% 100%;
    
    animation: banner 10s infinite;
    
}

@keyframes banner {
        0%, 30%{
            margin:auto;
   background-image: url(../images23/653.jpg)

        }
    35%, 70%{
            margin:auto;
   background-image: url(../images23/7339.jpg)

        }
        75%, 100%{
            margin:auto;
   background-image: url(../images23/8110.jpg)

        }
}


.logo {
    color: var(--blanco);
    
}
.logo__nombre {
    font-weight: 400;
}
.logo__bold {
   
    font-size: 2rem;
}
@media (min-width: 768px) {
    .navegacion {
        display: flex;
        gap: 2rem;
    }
}
    
.navigation{
    width: 15em;
    right: -15em;
    position: absolute;
    overflow: hidden;
    display: block;
    height: 10000%;
    background-color: #000;
   }
   
   
.nav-bg {
    background-color:rgba(245, 239, 239, 0.966);
    padding-top: 0%;
    padding-bottom: 4rem;
    justify-content: space-between;
}
.navegacion__enlace {
    display: block;
    text-align: center;
    font-size: 1.8rem;
    color: var(--blanco);
}


ul, ol {
				list-style:none;
			}
			
			.nav > li {
				float:left;
				margin-top:1rem;
				margin-left: 10rem;
				font-family: 'Krub', sans-serif;
                background-image: #fffff;
                min-height: 100%; 
                font-weight: 600;
                font-size:1.3rem;
			
			}
			
			.nav li a {
				background-color:rgb(243, 235, 235);
				color:#000;
				text-decoration:none;
				padding:.2rem .5rem;
				display:block;
			}
			
			.nav li a:hover {
				background-color:#9b07f16c;
			}
			
			.nav li ul {
				display:none;
				position:absolute;
				min-width:140px;
			}
			
			.nav li:hover > ul {
				display:block;
			}
			
			.nav li ul li {
				position:relative;
			}
			
			.nav li ul li ul {
				right:-.7rem;
				top:0px;
			}

@media (min-width: 768px) {
    .contenido-principal {
        display: grid;
        grid-template-columns: 2fr 1fr;
        column-gap: 4rem;
    }
}
    

  .demo-text{
    /*clear: middle;*/
    text-align: right;
    
    vertical-align: right;
    margin-left: 20rem;
    padding-left: 10rem;
    font-weight: 700;
    font-size:  2rem;
    line-height:2rem;
  }
  
  span.glyphicon
  {
    display:inline-block;
    vertical-align:top;
  }
.entrada {
    border-bottom: 1px solid var(--blanco);
    margin-bottom: 2rem;
}
.entrada:last-of-type {
    border: none;
    margin-bottom: 0;
}
.boton {
    display: block;
    font-family: var(--fuenteHeading);
    color: var(--blanco);
    text-align: center;
    padding: 1rem 3rem;
    font-size: 1.2rem;
    text-transform: uppercase;
    font-weight: 700;
    margin-bottom: 2rem;
    border: none;
}

@media (min-width: 768px) {
    .boton {
        display: inline-block;

    }
}
.boton:hover {
    cursor: pointer;
}
.boton--primario {
    background-color: var(--negro);
}
.boton--secundario {
    background-color:#FA177A;
    font-size:1.4rem;
    /*var(--primario);*/
}

.cursos {
    list-style: none;
}

.widget-curso {
    border-bottom: 1px solid var(--blanco);
    margin-bottom: 2rem;
}
.widget-curso:last-of-type {
    border: none;
    margin-bottom: 0;
}
.widget-curso__label {
    font-family: var(--fuenteHeading);
    font-weight: bold;
}
.widget-curso__info {
    font-weight: normal;
}
.widget-curso__label,
.widget-curso__info {
    font-size: 2rem;
}


.servicios {
    display: grid;
    grid-template-columns: 75% 25%;
    column-gap: 1rem;
}
}
.servicio {
text-align:justify;
}
.servicio {
display: flex;
flex-direction: column;
text-align: justify;
align-items: left;
}
.sidebar {
	/* Sidebar*/
	
	padding-left: 2%;
	padding-right: 2%;
	float: left;
	background-color: rgba(246,246,246,1.00);
	margin-top: 9rem;
	padding-top: 2rem;
}

.footer {
    background-color: var(--negro);
    padding-bottom: 3rem;
    margin-top: 4rem;
}

.p{
    font-size: 1.5rem;
    color:#ffffff;
    line-height: 1rem;
   

}

/** Sobre Nosotros **/
@media (min-width: 768px) {
    .sobre-nosotros {
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        column-gap: 2rem;
    }
}

/** Cursos **/
.curso {
    padding: 3rem 0;
    border-bottom: 1px solid var(--gris);
}
@media (min-width: 768px) {
    .curso {
        display: grid;
        grid-template-columns: 1fr 2fr;
        column-gap: 2rem;
    }
}
.curso:last-of-type {
   border: none;
}
.curso__label {
    font-family: var(--fuenteHeading);
    font-weight: bold;
}
.curso__info {
    font-weight: normal;
}
.curso__label,
.curso__info {
    font-size: 2rem;
}

/**tabla**/
.customers {
    font-family: Arial, Helvetica, sans-serif;
    border-collapse: collapse;
    width: 100%;
  }
  
  .customers td, #customers th {
    border: 1px solid #ddd;
    padding: 3rem;
  }
  
  .customers tr:nth-child(even){background-color: #f2f2f2;}
  
  customers tr:hover {background-color: #ddd;}
  
  #customers th {
    padding-top: 12px;
    padding-bottom: 12px;
    text-align: left;
    background-color: #a504aab2;
    color: white;
  }


  /**otra galeria**/
 .imagen{
    width: 100%;
}
.imagen img{
    width: 100%;
}
.galeria{
    width: 100%;
    margin: auto;
    display: grid;
    grid-template-columns: repeat(3,1fr);
    column-gap: 2rem;
    row-gap: 2rem;
}
@media (min-width:100px){
    .galeria{
        grid-template-columns: repeat(1, 1fr);
    }
}
@media (min-width:520px){
    .galeria{
        grid-template-columns: repeat(2, 1fr);
    }
}
@media (min-width:728px){
    .galeria{
        grid-template-columns: repeat(3, 1fr);
    }
}
@media (min-width:1024px){
    .galeria{
        grid-template-columns: repeat(4, 1fr);
    }
}
  
 

.video-gallery {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 10px;
}

.video-gallery > li {
  flex-basis: 350px; /* width: 350px; 
}

.video-gallery li img {
  object-fit: cover;
  max-width: 100%;
  height: auto;
  vertical-align: middle;
  border-radius: 5px;
}*/
.youtube-video-container {
  margin-left:1rem;
  position: relative;
  overflow: hidden;
  width: 100%;
}

/*.youtube-video-container::after {
  display: block;
  content: "";
  padding-top: 56.25%;
}*/

.youtube-video-container iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}