@font-face {
    font-family: 'morgant';
    src: url('/fonts/Gotham/Morgant Regular.otf') format('opentype');
  }
@font-face {
    font-family: 'modius';
    src: url('/fonts/Gotham/Modius Bold.ttf') format('opentype');
  }
@font-face {
    font-family: 'gotham';
    src: url('/fonts/Gotham/GOTHAM BOOK.TTF') format('opentype');
    font-weight: normal;
  }
@font-face {
    font-family:'gothamt';
    src: url('/fonts/Gotham/Gotham-Light.otf') format('opentype');
    font-weight: lighter;
  }
  @font-face {
    font-family:'gotham';
    src: url('/fonts/Gotham/Gotham-Bold.otf') format('opentype');
    font-weight: bold;
  }
  @font-face {
    font-family:'gothamth';
    src: url('/fonts/Gotham/Gotham-Thin.otf') format('opentype');
    font-weight: thin;
  }
* {
    color: white;
    box-sizing: border-box;
    flex-wrap: wrap;
}
body {
    background: #090E38;
    background-size: cover;
    flex-wrap: wrap;
    font-family: 'gotham';
}
header {
    display: flex;
    justify-content: space-between;
}
header .navbar {
    width: 100%;
}
nav ul{
    width: 380px;
    max-width: 1000px;
    padding: 0;
    font-family: 'morgant';
    font-size: 30px;
}
.nav-link {
    color: white;
}
.nav-link:hover {
    background: linear-gradient(90deg, rgb(221, 187, 27), rgb(73, 202, 128));
    -webkit-background-clip: text;
    color: transparent; 
}
.nav-link:active {
    background: linear-gradient(90deg, rgb(221, 187, 27), rgb(73, 202, 128));
    -webkit-background-clip: text;
    color: transparent; 
}
.navbar-toggler:focus {
    box-shadow: none;
}
nav .border-start {
    height: 50px;
}
.navbar-collapse .btn.btn-danger {
    font-size: 12px;
    width: 250px;
    height: 50px;
}
#presentacion h1 {
    font-size: 50px;
}
#presentacion .yo-soy {
    display: flex;
    align-items: center;
    left: 50px;
    top: 50px;
}
.justify-content-start {
    margin: 15px 0;
}
.infobasica {
    font-family: 'morgant';
    font-size: 12px;
    padding: 0;
    width: 640px;
    height: 50px;
}
#tabmepresento :checked ~ nav label.tabmepresento {
    color: #E11E5E;
}
.infobasica ul {
    display: flex;
    justify-content: space-around;
    list-style: none;
    margin: 0;
    padding: 0;
}
.infobasica li {
    display: flex;
    align-items: center;
    cursor: pointer;
    transition: all 0.3s ease;
    margin: 0 5px;
}
.d-md-none.d-inline.row div {
    padding: 10px 0 0 0;
}
.d-md-none.d-inline.row .column {
    margin-top: 50px;
    padding: 10px 0;
}
.d-md-none.flex-column.d-flex {
    width: 350px;
    height: 300px;
}
.d-md-none.flex-column.d-flex .pr {
    font-family: 'morgant';
    font-size: 12px;
    border: 1px solid;
    border-image: linear-gradient(90deg, rgb(221, 187, 27), rgb(73, 202, 128)) 1;
    display: flex;
    justify-content: center;
    align-items: center;
    height: 70px;
    width: 200px;
    margin-top: 20px;
}
.d-md-none.flex-column.d-flex .sp {
    margin: 10px 0 0 0;
    font-family: 'morgant';
    font-size: 12px;
}
.infobasica li:hover {
    background: #171C44;
}
.infobasica a {
    text-decoration: none;
}
.pr {
    border: 2px solid;
    border-image: linear-gradient(90deg, rgb(221, 187, 27), rgb(73, 202, 128)) 1;
    justify-content: center;
    width: 150px;
}
.col-8.d-flex.align-items-center.justify-content-center {
    height: 230px;
    width: 400px;
}
.container-fluid .row.border-bottom.border-white.border-opacity-10 {
    height: 675px;
    background-image: url("../assets/png/Recurso4.png");
    background-repeat: no-repeat;
    background-size: 570px;
    background-position-x: 29vw;
}
.d-md-none.d-inline.row.d-flex h5 {
    font-family: 'morgant';
    font-size: xx-large;
    letter-spacing: 2px;
}
#sobre-mi {
    display: flex;
    align-items: center;
    justify-content: center;
}
.lee-sobre-mi {
    width: 400px;
    height: 327.19px;
    display: flex;
}
.titulo {
    max-width: 600px;
    padding: 30px 10px;
    display: flex;
    flex-direction: column;
}
button.nav-link {
    color: white;
}
button.nav-link:hover {
    color: #E11E5E;
}
.nav.border-bottom.border-white.border-opacity-10 {
    width: 400px;
}
.nav-underline .nav-link.active {
    color: #E11E5E;
}
.titulo .nav .nav-underline {
    font-family: 'morgant';
    font-size: 12px;
    color: white;
}
.tab-content {
    margin: 25px 0;
    font-family: 'gothamt';
    font-size: 12px;
    width: 400px;
}
.btn.btn-danger {
    font-family: 'morgant';
    width: 160px;
    height: 40px;
    font-size: 9px;
    border-radius: 0%;
    background-color: #E11E5E;
}
.btn.btn-danger:hover {
    background:#ae174a;
}
.btn.btn-outline-success a {
    text-decoration: none;
    color: white;
}
.btn.btn-outline-success {
    font-family: 'morgant';
    width: 160px;
    height: 40px;
    font-size: 9px;
    color: white;
    border: 1px solid;
    border-image: linear-gradient(90deg, rgb(221, 187, 27), rgb(73, 202, 128)) 1;
    background-color: #171C44;
}
.btn.btn-outline-success:active {
    background: #171C44;
}
.datos-de-contacto {
    font-family: 'morgant';
    font-size: 10px;
    list-style: none;
}
.datos-de-contacto li {
    width: 250px;
}
.datos-de-contacto p {
    margin: 0;
}
.ell {
    font-family: 'modius';
    font-size: 12px;
}
.d-flex.flex-column.flex-sm-row .d-flex.flex-column.flex-sm-row ul {
    font-family: 'modius';
    font-size: 10px;
    padding: 0;
    list-style: none;
}
#portafolio {
    display: flex;
    justify-content: space-around;
    flex-direction: column;
    align-items: center;
}
#portafolio .container-fluid {
    background: #161A42;
}
.porta {
    display: flex;
    flex-direction: column;
}
.d-flex.flex-column.flex-sm-row.justify-content-center.align-items-center .col-md-6 {
    width: 350px;
}
.d-flex h4 {
    font-family: 'morgant';
    font-size: 10px;
    color: white;
    margin: 0;
}
.d-flex h2 {
    background: linear-gradient(90deg, rgb(255, 107, 107), rgb(221, 187, 27), rgb(73, 202, 128));
    -webkit-text-fill-color: transparent;
    -webkit-background-clip: text;
    margin: 0;
    font-size: 30px;
    font-family: 'morgant';
    font-weight: lighter;
    width: fit-content;
}
.d-flex h1 {
    margin: 0;
    font-family: 'modius';
    font-size: 30px;
}
.img-fluid {
    height: fit-content;
}
.botone {
    background: #E11E5E;
    width: 150px;
    height: 40px;
    display: flex;
    justify-content: center;
    align-content: center;
    font-family: 'morgant';
    font-size: 10px;
    cursor: pointer;
    transition: all 0.3s ease;
    
}
.botone a {
    text-decoration: none;
    color: white;
}
.botone:hover {
    background:#ae174a;
}
.card .card-img {
    width: 350px;
    height: 477px;
}
.card-img-overlay.d-flex.row.align-content-end {
    padding-bottom: 0px;
}
.card-img-overlay.d-flex.row.align-content-end h4 {
    font-family:'gotham';
    font-weight: bold;
    font-size: 8px;
    display: flex;
    justify-content: center;

}
.card-img-overlay.d-flex.row.align-content-end p {
    font-size: 14px;
    display: flex;
    justify-content: center;
    margin-bottom: 4px;
    width: 350px;
    padding: 0px;
}
.card-img-overlay .text-color {
    color:#22264C
}
.carousel-control-prev-icon {
    background-image: url("/assets/png/Group12.png");
    transform: rotate(180deg);
}
.carousel-control-next-icon {
    background-image: url("/assets/png/Group12.png");
}
.proyect-galery {
    flex-wrap: nowrap;
    max-width: 100%;
    overflow-x: scroll;
}
.pro {
    display: flex;
}
.det {
    padding: 10px;
    margin: 5px;
    display: flex;
    flex-direction: column;
    justify-content: end;
    align-items: center;
    width: 210px;
    height: 210px;
    font-family: 'gotham';
    background: #171C44;
}
.det h4 {
    font-size: 7px;
    margin: 0;

}
.det p {
    margin: 0;
    font-size: 12px ;
}
#servicios {
    display: flex;
    justify-content: center;
    align-items: flex-end;
    margin: 50px 0;
}
.flex-column.flex-sm-row.d-flex .row.col-md-6.d-flex.align-items-center.justify-content-center .lista {
    font-family: 'gothamt';
    width: fit-content;
    font-size: smaller;
}
#servicios h4 {
    font-family: 'morgant';
    font-size: 10px;
    color: grey;
    margin: 0;
}
#servicios h1 {
    margin: 0;
    font-family: 'modius';
    font-size: 30px;
}
#servicios h2 {
    background: linear-gradient(90deg, rgb(255, 107, 107), rgb(221, 187, 27), rgb(73, 202, 128));
    -webkit-text-fill-color: transparent;
    -webkit-background-clip: text;
    margin: 0;
    font-family: 'morgant';
    font-weight: lighter;
    font-size: 30px;
    width: fit-content;
}
.row.col-sm-5 .lista ul {
    padding: 0px;
    width: 365px;
}
.row.col-sm-5 li {
    list-style: none;
    cursor: pointer;
    transition: all 0.3s ease;
    padding: 0px;
    align-items: end;
    
}
.row.col-sm-5 li a {
    font-family: 'gothamth';
    font-size: 12px;
    text-decoration: none;
    color: white;
    display: flex;
    align-items: end;
    height: 28px;
}
.row.col-sm-5 li a span {
    display: none;
}
.row.col-sm-5 li a:hover {
    font-family: 'gotham';
    font-size: 13px;
    font-weight: bold;
    margin-left: -70px;
    height: 28px;
    display: flex;
    align-items: baseline;
}
.row.col-sm-5 li a:hover span {
    display: inline;
}
#servicios .col-sm-7 .position-relative {
    width: 350px;
    height: 350px;
}
.img-20 {
    left: 15px;
    top: -15px
}
.img-21{
    top: 30px;
}
.img-22 {
    left: 114px;
    top:230px;
    width: 130px;
}
.redes-sociales {
    max-width: 700px;
    display: flex;
    list-style: none;
    padding: 0px;
    font-size: 12px;
}
.d-flex.justify-content-center .redes-sociales li {
    padding: 14px;
    font-family: 'gothamth';
    font-size: 11px;
    width: fit-content;
    letter-spacing: 0.5px;
}
.redes-sociales a {
    font-family: 'gothamth';
    text-decoration: none;
    color: white;
}
.certificaciones {
    margin: 50px 10px;
    padding: 0;
}
.certificaciones .container {
    height: 500px;
    background: #171C44;
}
.certificaciones h4 {
    font-family: 'morgant';
    font-size: 10px;
    color: grey;
    margin: 0;
}
.certificaciones h1 {
    margin: 0;
    font-family: 'modius';
    font-size: 30px;
}
.certificaciones h2 {
    background: linear-gradient(90deg, rgb(255, 107, 107), rgb(221, 187, 27), rgb(73, 202, 128));
    -webkit-text-fill-color: transparent;
    -webkit-background-clip: text;
    margin: 0;
    font-family: 'morgant';
    font-weight: lighter;
    font-size: 30px;
    width: fit-content;
}
.certificaciones .std {
    position: relative;
    display: flex;
    justify-content: center;
    width: 270px;
    height: 240px;
    padding: 10px;
    margin: 5px;
}
.carousel-control-prev.bg-transparent.w-aut {
    display: flex;
    justify-content: flex-start;
}
.carousel-control-next.bg-transparent.w-aut {
    display: flex;
    justify-content: flex-end;

}
.nombre-curso {
    width: 240px;
    position: absolute;
    top: 100px;
    left: 20px;
    font-family: 'modius';
    font-size: 14px;
    display: flex;
    justify-content: center;
}
.descripcion {
    width: 200px;
    height: 100px;
    position: absolute;
    bottom: 38px;
    left: 38px;
    font-family: 'gothamth';
    font-size: 10px;
    display: flex;
    text-align: center;
    align-items: center;
}
.fecha {
    width: 100px;
    position: absolute;
    bottom: 22px;
    left: 100px;
    font-family: 'gothamth';
    font-size: 10px;
    color: #818181;

}
.card .img-box {
    height: 200px;
}
.card .img-box img {
    width: 100%;
}
.clientes h4 {
    font-family: 'morgant';
    font-size: 12px;
    margin: 0;
    color: white;
}
.card {
    margin: 0;
    padding: 0;
    background: #090E38;
    box-sizing: border-box;
    width: 100%;
    flex-direction: row;
    flex-wrap: wrap;
}

.testimonios-de-clientes {
    background-color: #22264C;
    width: 360px;
    height: 450px;
    flex-wrap: wrap;
        @media (min-width: 576px) {
            width: 410px !important;
            height: 320px !important;
        }
    
}
.card-text {
    background-color: #22264C;
    font-family: 'gotham';
    font-size: 9px;
    text-align: left;
}
.card-text h6 {
    font-size: 12px;
}
.card-text p {
    font-family: 'gothamth';
    font-size: 12px;
}
.clientes .ct {
    font-family:'morgant';
    font-size: 8px;
    border: 1.5px solid;
    border-image: linear-gradient(90deg, rgb(221, 187, 27), rgb(73, 202, 128)) 1;
    text-align: center;
    width: 150px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: all 0.3s ease;
    text-decoration: none;
    color: white;
}
.ct:hover {
    background: #171C44;
}
.clientes h1 {
    margin: 0;
    font-family: 'modius';
    font-size: 30px;
}
.clientes h2 {
    margin: 0;
    background: linear-gradient(90deg, rgb(255, 107, 107), rgb(221, 187, 27), rgb(73, 202, 128));
    -webkit-text-fill-color: transparent;
    -webkit-background-clip: text;
    font-family: 'morgant';
    font-weight: lighter;
    font-size: 30px;
    width: fit-content;
}
.empresas {
    display: flex;
    flex-direction: row;
}
.loslogos {
    display: flex;
    justify-content: center;
}
.slog {
    max-width: 1027px;
}
.loslogos.d-flex.d-sm-none .colaboraciones {
    width: 390px;
    height: 180px;
}
.colaboraciones {
    display: flex;
    justify-content: center;
    width: 205px;
    height: 105px;
    border: 1px solid;
    border-color: #22274C;
    text-align: center;
    align-items: center;
}
#contacto {
    display: flex;
    flex-direction: column;
    align-items: center;
    background-color: #161A42;
}
#contacto h3 {
    font-family: 'modius';
    font-size: 19px;
    letter-spacing: 1px;
}
#contacto p {
    font-family: 'gothamth';
    font-size: 17px;
}
footer {
    display: flex;
    justify-content: space-around;
    flex-wrap: wrap;
    background:#090E38;
    height: 80px;
}
.logos-redes-foot.d-flex {
   justify-content: end;
}
.px-1 {
    height: 30px;
    width: 30px;
}
footer p {
    font-family: 'gothamth';
    font-size: 11px;
    letter-spacing: 0.4px;
}
.d-flex.justify-content-center .cro {
    font-family: 'modius';
    font-size: 25px;
    width: fit-content;
    background: linear-gradient(90deg, rgb(255, 107, 107), rgb(221, 187, 27), rgb(73, 202, 128));
    -webkit-text-fill-color: transparent;
    -webkit-background-clip: text;
}
.d-flex.align-items-center.justify-content-around.border-top.border-white.border-opacity-10 {
    height: 60px;
}
.font-responsive {
    font-size: 25px !important;
    @media (min-width: 576px) {
        font-size: 68px !important;
    }
}
.font-title-responsive {
    font-size: 30px !important;
    @media (min-width: 576px) {
        font-size: 45px !important;
    }
}
.font-subtitle-responsive {
    font-size: 11px !important;
    @media (min-width: 576px) {
        font-size: 16px !important;
    }
}
.font-buttom-responsive {
    font-size: 14px !important;
    @media (min-width: 576px) {
        font-size: 10px !important;
    }
}
.font-ul-responsive {
    font-size: 30px !important;
    @media (min-width: 576px) {
        font-size: 12px !important;
    }
}
.background-height {
    height: 675px !important;
    @media (min-width: 576px) {
        height: 750px !important;
    }
}
.background-size {
    background-size:  570px !important;
    @media (min-width: 576px) {
        background-size: 633px !important;
    }
}
.background-position {
    background-position-x: 29vw !important;
    @media (min-width: 576px) {
        background-position-x: 54vw !important;
    }
}
.width-img {
    width: 350px !important;
    height: 350px !important;
    @media (min-width: 576px) {
        width: 550px !important;
        height: 550px !important;
    }   
}
.position-img {
    top: 30px !important;
    @media (min-width: 576px) {
        left: 57px !important;
        top: 40px !important;
    } 
}
.position-logo {
    left: 114px !important;
    top: 230px !important;
    width: 130px !important;
    @media (min-width: 576px) {
        left: 231px !important;
        top: 318px !important;
        width: 110px !important;
    } 
}
.navbar-width {
    width: 380px !important;
    @media (min-width: 576px) {
        width: 780px !important;
    }
}