/*
 d7ddff
 e7e3d8 nuevo
 e2dbd2 table
 274d32 green dark
 65ad91 green light
 efbac0 pink
 f3bec3 card title red
*/
/**** fonts ****/
@font-face {
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(../fonts/Poppins-Medium.ttf) format("truetype");
}
@font-face {
  font-family: 'Poppins';
  font-style: bold;
  font-weight: 800;
  font-display: swap;
  src: url(../fonts/Poppins-Bold.ttf) format("truetype");
}
/**** fonts ****/
html body {
    font-family: 'Poppins', Helvetica, sans-serif;
}
a,
body {
    color: #333;
    padding: 15px 0 0 0;
}
body {
    background: #fff;
}
.container {
    font-size: 120%;
}
.container .modal-dialog {
    font-size: 14px;
}
.content-container {
    padding-bottom: 200px;
    min-height: 100vh;
}
h1 {
    font-size: 220%;
    padding-bottom: 3%;
    line-height: 120%;
    display: inline;
}
h1 b {
    /* font-size: 125%; */
}
h2 {
    font-weight: bold;
    font-size: 115%;
}
a:active,
a:visited,
a {
    cursor: pointer;
    outline: none;
}
a:focus,
a:hover {
    text-decoration: none;
    outline: none;
    color: #666;
}
.header.cont {
    position: relative;
    background-repeat: no-repeat;
    background-image: url('../images/top-header-big.svg?1');
    background-size: 100% auto;
    background-color: #ffffff;
    padding: 14.5% 0 0% 14.5%;
    margin: 0;
    color: #000;
}
.header-sub-title {
    font-size: 120%;
    padding: 10px 0 15px 6.1%;
}
.header-sub-title .btn {
    font-size: 70%;
    font-weight: normal;
    padding: 2px 10px;
    position: relative;
    bottom: 3px;
}
.header .cont-mano {
    width: 15%;
    display: inline-block;
}
.header .cont-mano img {
    width: 100%;
}
.header .cont-no-mano {
    /* width: 80%; */
    display: inline-block;
    /* position: absolute; */
    bottom: 12%;
    margin-left: -1.5%;
}

.header .cont-no-mano h1 {
    font-size: 275%;
}
.header .cont-no-mano .header-link {
    background: transparent;
    /* background: rgba(155, 155, 155, 0.35); */
    border-radius: 30% 90% 40% 15%;
    display: block;
    width: 45%;
    margin-left: 5%;
    padding: 8% 0;
}
.header .cont-no-mano .header-link:hover {
    background: rgba(255, 255, 255, 0.25);
}
/* .header .header-link:hover {
    opacity: 0.75;
} */
.header .cont-no-mano .header-link img {
    width: 100%;
}
.header.header-small.cont {
    background-image: url('../images/top-header-small.jpg');
    height: 30%;
    padding: 5% 5% 13%;
    background-position-x: 0%;
    background-position-y: 100%;
    background-size: contain auto;
    background-size: 100%;    
    font-size: 86%;
}
.header .year {
    font-size: 5vw;
    color: #d7ddff;
    position: absolute;
    bottom: 43%;
    right: 18%;
    text-align: center;
}
.header .btn-ver-mas {
    position: relative;
    bottom: 8px;
}
.icon-round-back-cont {
    padding: 20px;
    border-radius: 100%;
    overflow: hidden;
    display: inline-block;
    background: #65ad91;
}
.icon-round-back-cont.icon-round-back-cont-1 {
    background: linear-gradient(90deg, rgba(255,66,48,1) 0%, rgba(255,57,62,1) 100%);
}
.icon-round-back-cont.icon-round-back-cont-2 {
    background: linear-gradient(90deg, rgba(186,42,149,1) 0%, rgba(160,46,169,1) 100%);
}
.icon-round-back-cont img {
    width: 60px;
}
footer {
    background-color: #d9d9d9;
    box-shadow: 2px 2px 4px -3px rgba(0, 0, 0, 0.35);
    margin-top: -145px;
    min-height: 145px;
    padding: 20px 40px;
    font-size: 60%;
    line-height: 180%;
}
footer:hover {
    box-shadow: 1px 1px 4px -3px rgba(0, 0, 0, 0.35);
}
footer .footer-part {
    padding-top: 25px;
    text-align: left;
}
footer .footer-part.text-part {
    text-align: right;
}

footer .logo {
    /* width: 50%; */
}
footer h3 {
    font-size: 120%;
    margin: 0 0 8px 0;
}
footer a {
    cursor: pointer;
}
footer .icons-part {
    font-size: 0;
}
footer a.footer-icon {
    width: 16.66667%;
    display: inline-block;
    padding: 0px 4px;
    vertical-align: middle;
    max-width: 50px;
    
}
footer a.footer-icon img {
    max-width: 40px;
}
footer a:hover {
    opacity: 0.8;
}
footer a.footer-icon img {
    width: 100%;
}
.cont {
    background: #d7ddff;
    padding: 30px;
    margin-bottom: 40px;
}
.cont:hover {
    /*box-shadow: 1px 1px 5px -2px rgba(0, 0, 0, 0.35);*/
}
.cont-title {
    padding: 25px 0 0 0;
    margin-bottom: 40px;
}
.cont-title .title {
    background: #d7ddff;
    padding: 30px;
    margin: 0;
    line-height: 10px;
    color: #6930d5;
}
.rounded-full {
    overflow: hidden;
    border-radius: 40px;
}
.rounded-top {
    overflow: hidden;
    border-radius: 40px 40px 0 0;
}
.rounded-bottom {
    overflow: hidden;
    border-radius: 0 0 40px 40px;
}
.shadow {
    box-shadow: 5px 5px 10px rgba(0, 0, 0, 0.5);
}
.shadow:hover {
    position: relative;
    top: 1px;
    left: 1px;
    box-shadow: 4px 4px 8px rgba(0, 0, 0, 0.5);
}
.btn.btn-sm {
    font-size: 80%;
    padding: 5px 20px;
}
.btn.last {
    margin-bottom: 0;
}
.btn {
    font-size: 100%;
    font-weight: bold;
    border-radius: 30px;
    padding: 5px 30px;
    border: 0;
    /* margin-bottom: 10px; */
}
.btn:hover {
    color: #eee;
}
.btn.btn-nm {
    margin-bottom: 0;
}
.modal-footer .btn {
    margin-bottom: 0;
}
.btn {
    font-weight: normal;
}
.btn.btn-light,
.btn.btn-primary,
.btn.btn-secondary {
    background: rgb(170,170,170);
    background: linear-gradient(0deg, rgba(170,170,170,1) 0%, rgba(141,141,141,1) 75%, rgba(255,255,255,1) 100%);
    color: #fff;
}
.btn.btn-light:hover,
.btn.btn-primary:hover,
.btn.btn-secondary:hover {
    background: linear-gradient(0deg, rgba(170,170,170,1) 0%, rgba(141,141,141,1) 80%, rgba(255,255,255,1) 100%);
    color: #e0e0e0;
}
.btn.btn-wide {
    min-width: 200px;
}
label {
    font-weight: normal;
    font-size: 90%;
}
.gradient {
    background: linear-gradient(90deg, rgba(92,56,221,1) 0%, rgba(255,32,97,1) 50%, rgba(92,56,221,1) 100%);
}
.solid-violet {
    background: #6930d5;
}
.solid-light-violet {
    background: #d7ddff;
}
.solid-grey {
    background: #d9d9d9;
}
.info-menu {
    padding: 0;
}
.info-content {
    margin: 20px 0 40px 0;
}
.info-menu .info img,
.info-content .info img {
    margin-right: 5px;
    display: inline-block;
    width: 20%;
    vertical-align: middle;
}
.info-menu .info,
.info-content .info {
    padding: 30px;
    background: transparent;
    background: #d9d9d9;
}
.info-content .report-stat {
    margin: 5px 0;
}
.info-content .report-data {
    text-align: left;
    display: inline-block;
    width: 60%;
    vertical-align: middle;
}
.info-content .report-data .report-number {
    font-size: 130%;
    color: #ff0000;
}
.info-content .report-data .report-text {
    color: #5c38dd;
}

.card-wide {
    padding: 30px 20%;
    position: relative;
    /* background-image: url('../images/card-wide-back.png'); */
    background-repeat: no-repeat;
    background-size: 100%;
    background-position-x: center;
}
.card-wide .card-wide-side {
    position: absolute;
    top: 0;
    bottom: 0;
    background-image: linear-gradient(90deg, rgba(255,32,97,1) 0%, rgba(92,56,221,1) 100%);
    background-image: url('../images/card-wide-side.svg'), linear-gradient(90deg, rgba(255,32,97,1) 0%, rgba(92,56,221,1) 100%);
    background-position: left;
    background-size: contain;
    background-repeat: no-repeat;
    /* background-size: 100% 100%; */
    width: 20%;
}
.card-wide .card-wide-side.right {
    right: 0;
}
.card-wide .card-wide-side.left {
    -webkit-transform: scaleX(-1);
    -moz-transform: scaleX(-1);
    -o-transform: scaleX(-1);
    transform: scaleX(-1);
    filter: FlipH;
    -ms-filter: "FlipH";
    left: 0;
    background-image: url('../images/card-wide-side.svg'), linear-gradient(90deg, rgba(255,32,97,1) 0%, rgba(255,91,12,1) 100%);
}

.card-wide .card-wide-info {
    min-height: 240px;
    padding-bottom: 20px;
}
.card-wide .btn-sm {
    min-width: 180px;
}
.card-full {
    background-repeat: no-repeat;
    background-image: url('../images/card-big.jpg');
    background-size: 100%;
    background-position-y: bottom;
}
.btn-blank-cont {
    overflow: hidden;
}
.btn-blank {
    background: transparent;
    color: transparent;
    position: relative;
    left: 1000%;
}
.cont.cont-link {
    padding: 0 30px 30px 30px;
    overflow: hidden;
}
.cont.cont-link a {
    display: block;
    margin: 0;
    padding: 15px 40px;
    text-align: center;
    font-weight: bold;
}
.card {
    text-align: center;
    font-size: 80%;
    padding: 0;
}
.card .card-info {
    background-repeat: no-repeat;
    background-size: 100% auto;
    background-position-x: center;
    background-position-y: center;
    /* background-image: url('../images/card-back.jpg'); */
    padding: 18% 8%;
}
.card .card-buttons {
    padding: 30px 30px;
    background-repeat: no-repeat;
    background-color: #65ad91;
    /* background-image: url('../images/card-buttons-top-arc.png'); */
    background-size: 104% auto;
    background-position-y: top;
    background-position-x: center;
}
.card .card-buttons.card-button-1 {
    background: linear-gradient(90deg, rgba(255,91,12,1) 0%, rgba(255,62,55,1) 100%);
}
.card .card-buttons.card-button-2 {
    background: linear-gradient(90deg, rgba(255,62,55,1) 0%, rgba(255,32,97,1) 100%);
}
.card .card-buttons.card-button-3 {
    background: linear-gradient(90deg, rgba(255,32,97,1) 0%, rgba(174,44,159,1) 100%);
}
.card .card-buttons.card-button-4 {
    background: linear-gradient(90deg, rgba(174,44,159,1) 0%, rgba(92,56,221,1) 100%);
}
.class-title {
    font-weight: bold;
    min-height: 120px;
    /* line-height: 20px; */
    overflow: hidden;
    text-overflow: ellipsis;
    font-size: 130%;
    margin: 0 0 25px;
}
.class-title.short {
    min-height: 0;
}
.class-title .class-title-part {
    /* background-color: #f3bec3;
    border-radius: 100px; */
    margin-bottom: 10px;
    /*display: block;*/
    display: inline-block;
    /* padding: 2px 15px; */
}

.card-wide .class-title .class-title-part {
    background-color: #5c38dd;
    border-radius: 100px;
    margin-bottom: 10px;
    display: inline-block;
    padding: 5px 15px;
    color: #ffffff;
    font-weight: normal;
    font-size: 120%;
    opacity: 0;
}
.class-title-part.visible,
.card-wide .class-title .class-title-part.visible {
    opacity: 1;
}
.card .class-edicion {
    font-size: 100%;
    font-weight: bold;
}
.class-info-wrappers-cont {
    margin-bottom: 10px;
    min-height: 171px;
}
.class-info-wrappers-cont .class-info-denominacion {
    min-height: 50px;
    color: #f70f81;
    font-size: 110%;
    font-weight: bold;
    margin-bottom: 10px;
}
.class-info-wrapper {
    margin-bottom: 5px;
}
.class-info-label {
    font-weight: bold;
}
.input-info {
    font-size: 80%;
}
.cont form hr {
    border-bottom: 1px solid #d0cbc0;
}
.cont form label.title {
    letter-spacing: .2rem;
    font-size: 110%;
    opacity: 0.8;
}
.button-cont {
    position: relative;
    display: block;
    margin-bottom: 20px;
    padding: 0 30px 10px 0;
    font-weight: bold;
    min-height: 140px;
}
.button-cont .button-shadow {
    position: absolute;
    top: 0;
    bottom: 15px;
    left: 30px;
    right: 0px;
    padding: 30px 30px;
    border-radius: 20px;
}   
.button-cont .button-shadow.button-shadow-1 {
    background: linear-gradient(90deg, rgba(255,91,12,1) 0%, rgba(255,52,68,1) 100%);
}
.button-cont .button-shadow.button-shadow-2 {
    background: linear-gradient(90deg, rgba(255,52,68,1) 0%, rgba(200,40,139,1) 100%);
}
.button-cont .button-shadow.button-shadow-3 {
    background: linear-gradient(90deg, rgba(200,40,139,1) 0%, rgba(92,56,221,1) 100%);
}
.button-cont .button-front {
    position: absolute;
    top: 10px;
    bottom: 0;
    left: 0px;
    right: 30px;
    padding: 30px 30px;
    border-radius: 20px;
    background-color: #d7ddff;
    /* background-image: url('../images/button-back.jpg'); */
    background-repeat: no-repeat;
    background-position: center center;
    background-size: 100%;
}
.navbar {
    border: none;
    padding: 30px 0 20px;
    margin-top: 20px;
}
.navbar-default .navbar-nav > li > a {
    padding: 5px 30px;
    line-height: 1.42857143;
    margin: 0 5px 10px;
    font-weight: normal;
    color: #ffffff;
}
.navbar-right {
    margin: 0;
}
.navbar-default .navbar-nav > li > a:focus, .navbar-default .navbar-nav > li > a:hover {
    background-color: #d7ddff;
    color: #e0e0e0;
}
.hidden-md {
    display: block;
    height: 10px;
}
table.table {
    margin: 0;
}

table.table-rounded {
    border-collapse: separate;
    border-spacing: 10px;
}
table.table-rounded tr th,
table.table-rounded tr td {
    text-align: center;
    padding: 20px;
    font-size: 70%;
    border: none;
    background: #dadada;
    border-radius: 20px;
    vertical-align: middle;
}
table.table-rounded tr th {
    background: #898989;
    color: #ffffff;
    padding: 5px 20px;
}
/*
tablaRespAdap: se crea este estilo por pedido de Tatiana, para que cuando se vea 
la pagina desde un movil los titulos de la tabla aparezcam al costado de cada renglon
Max width before this PARTICULAR table gets nasty. This query will take effect for any screen smaller than 760px and also iPads specifically.
*/
@media
only screen 
and (max-width: 760px), (min-device-width: 768px) 
and (max-device-width: 1024px)  {

    /* Force table to not be like tables anymore */
    table.tablaRespAdap,
    table.tablaRespAdap thead,
    table.tablaRespAdap tbody,
    table.tablaRespAdap th,
    table.tablaRespAdap td,
    table.tablaRespAdap tr {
        display: block;
    }

    /* Hide table headers (but not display: none;, for accessibility) */
    table.tablaRespAdap thead tr {
        position: absolute;
        top: -9999px;
        left: -9999px;
    }

    table.tablaRespAdap tr {
        margin: 0 0 4rem 0;
    }

    table.tablaRespAdap tr td[role="cell"] {
        /* Behave  like a "row" */
        border: none;
        position: relative;
        margin-bottom: 5px;
        text-align: inherit;
        padding: 10px;
    }
    table.tablaRespAdap tr td[role="cell"]:first-child {
        background: #efbac0;
    }

    table.tablaRespAdap td:before {
        /* Now like a table header */
        /*position: absolute;*/
        /* Top/left values mimic padding */
        top: 0;
        left: 6px;
        width: 45%;
        padding-right: 10px;
        white-space: nowrap;
    }

    /*
    Label the data
You could also use a data-* attribute and content for this. That way "bloats" the HTML, this way means you need to keep HTML and CSS in sync. Lea Verou has a clever way to handle with text-shadow.
    */
    table.tablaRespAdapTitulos td:nth-of-type(1):before { content: ""; }
    table.tablaRespAdapTitulos td:nth-of-type(2):before { content: "Curso: "; }
    table.tablaRespAdapTitulos td:nth-of-type(3):before { content: "Comisión: "; }
    table.tablaRespAdapTitulos td:nth-of-type(4):before { content: "Inicio de cursado: "; }
    table.tablaRespAdapTitulos td:nth-of-type(5):before { content: "Período de Inscripción: "; }
    table.tablaRespAdapTitulos td:nth-of-type(6):before { content: ""; }	
    
    table.tablaRespAdapHist td:nth-of-type(1):before { content: "Curso: "; }
    table.tablaRespAdapHist td:nth-of-type(2):before { content: "Comisión: "; }
    table.tablaRespAdapHist td:nth-of-type(3):before { content: "Fecha Inicio: "; }
    table.tablaRespAdapHist td:nth-of-type(4):before { content: "Fecha Fin: "; }
    table.tablaRespAdapHist td:nth-of-type(5):before { content: "Resultado: "; }
    table.tablaRespAdapHist td:nth-of-type(6):before { content: "Estado del Certificado: "; }
}

@media (max-width: 1200px) {
    .header-container {
        font-size: 70%;
    }
}   
@media (max-width: 992px) {
    .card-info {
        font-size: 18px;
    }
    .header-container {
        font-size: 60%;
    }
    footer .footer-part.text-part,
    footer .footer-part {
        text-align: center;
    }
}
@media (max-width: 768px) {
    .card-info {
        font-size: 26px;
    }
    .header .cont-no-mano h1 {
        font-size: 22px;
    }
    .header .header-link {
        padding: 10% 0 0 0;
    }
    .header .btn-ver-mas {
        font-size: 70%;
        bottom: 3px;
    }
    .header-sub-title {
        font-size: 80%;
    }
}
@media (min-width: 992px) {
    .hidden-md {
        display: none;
    }
    footer .row .col-md-4:nth-child(1) {
        text-align: left;
    }
    footer .row .col-md-4:nth-child(3) {
        text-align: right;
    }
    footer .footer-part {
        min-height: 100px;
    }
}

/* picked ff5b0c ff2061 5c38dd */
.full-gradient {
    background: rgb(255,91,12);
    background: linear-gradient(90deg, rgba(255,91,12,1) 0%, rgba(255,32,97,1) 50%, rgba(92,56,221,1) 100%);
}
.full-gradient.full-gradient-header {
    height: 40px;
}