.card-red-curricular {
    font-family: 'Roboto','Arial';
    border-top: 2.5px solid;
    border-left: 2.5px solid;
    border-right: 2.5px solid;
    border-bottom: 2.5px solid;
}

.header-red-title {
    text-align: right;
    font-size: 20px;
    line-height: 1em;
    padding-right: 5px;
}

.header-red-title > small {
    font-weight: 600;
}

.header-red-divider {
    height: 0;
    margin: 0.5rem 0;
    overflow: hidden;
    border-top: 3px solid #b8babd;
    position: relative;
    z-index: 5;
    padding-left: 0px;
}

.body-red-curricular {
    padding-left: 5px;
    padding-right: 5px;
}

.body-red-prerrequisito {
    padding: 0;
    text-align: center;
    line-height: 1em;
    border-right: 1px solid;
    border-top: 1px solid;
    border-bottom: 1px solid;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.body-red-prerrequisito-item {
    padding: 0px !important;
}

.body-red-prerrequisito-item > small {
    font-size: 75%;
}

.body-red-diplomado {
    padding: 0;
    text-align: center;
    line-height: 1em;
    border-right: 1px solid;
    border-top: 1px solid;
    border-bottom: 1px solid;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.body-red-diplomado > small {
    font-size: 60%;
    font-weight: bold;
}

.body-red-descripcion {
    padding: 0;
    text-align: center;
    line-height: 1em;
    border-top: 1px solid;
    border-bottom: 1px solid;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

/*
Descomentar en caso los nombres sean en mayusculas
.body-red-descripcion > small {
    font-size: 75%;
}
*/
.body-red-codigo {
    padding: 0;
    text-align: center;
    border-left: 1px solid;
    border-right: 1px solid;
    border-top: 1px solid;
    border-bottom: 1px solid;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.body-red-codigo-item {
    padding: 0px !important;
    flex: 1;
}

.body-red-codigo-item2 {
    padding: 0px !important;
    flex: 1;
}

.body-red-codigo-item2 > div > small{
    font-size: 75%;
}

.body-red-codigo-division {
    border-bottom: 1px solid;
}

.body-red-codigo-division > small{
    font-size: 75%;
}

.body-red-area {
    padding: 0;
    text-align: right;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.body-red-area-item {
    text-align: center;
    border: 1px solid #bababa;
}

.diagonal {
    float: left;
    padding-left: 0px;
}

/*
Todos los .diagonal::before tenian
border-top: 81px;
border-right: 81px;
*/
.diagonal::before {
    content: '';
    position: absolute;
    top: -1px;
    left: 0px;
    border-top: 82px solid #212529;
    border-right: 82px solid transparent;
    width: 0;
    z-index: 1;
}

.diagonal.red::before {
    content: '';
    position: absolute;
    top: -1px;
    left: 0px;
    border-top: 82px solid rgb(255,39,43);
    border-right: 82px solid transparent;
    width: 0;
    z-index: 1;
}

.diagonal.purple::before {
    content: '';
    position: absolute;
    top: -1px;
    left: 0px;
    border-top: 82px solid rgb(112, 48, 160);
    border-right: 82px solid transparent;
    width: 0;
    z-index: 1;
}

.diagonal.green::before {
    content: '';
    position: absolute;
    top: -1px;
    left: 0px;
    border-top: 82px solid rgb(118, 147, 60);
    border-right: 82px solid transparent;
    width: 0;
    z-index: 1;
}

.diagonal.lightblue::before {
    content: '';
    position: absolute;
    top: -1px;
    left: 0px;
    border-top: 82px solid rgb(0, 163, 210);
    border-right: 82px solid transparent;
    width: 0;
    z-index: 1;
}

.diagonal.lightgreen::before {
    content: '';
    position: absolute;
    top: -1px;
    left: 0px;
    border-top: 82px solid rgb(84, 158, 68);
    border-right: 82px solid transparent;
    width: 0;
    z-index: 1;
}

.diagonal.blue::before {
    content: '';
    position: absolute;
    top: -1px;
    left: 0px;
    border-top: 82px solid rgb(78, 129, 189);
    border-right: 82px solid transparent;
    width: 0;
    z-index: 1;
}

.diagonal.aqua::before {
    content: '';
    position: absolute;
    top: -1px;
    left: 0px;
    border-top: 82px solid rgb(2, 129, 119);
    border-right: 82px solid transparent;
    width: 0;
    z-index: 1;
}

.diagonal.skyblue::before {
    content: '';
    position: absolute;
    top: -1px;
    left: 0px;
    border-top: 82px solid rgb(77, 193, 237);
    border-right: 82px solid transparent;
    width: 0;
    z-index: 1;
}

.diagonal.orange::before {
    content: '';
    position: absolute;
    top: -1px;
    left: 0px;
    border-top: 82px solid rgb(247, 150, 69);
    border-right: 82px solid transparent;
    width: 0;
    z-index: 1;
}

.diagonal.pink::before {
    content: '';
    position: absolute;
    top: -1px;
    left: 0px;
    border-top: 82px solid rgb(211, 128, 120);
    border-right: 82px solid transparent;
    width: 0;
    z-index: 1;
}

.inside::before {
    content: '';
    position: absolute;
    top: -8px;
    left: -8px;
    border-top: 92px solid #fff; /*tenia 93*/
    border-right: 93px solid transparent;
    width: 0;
    z-index: 2;
}

.inside::after {
    content: '';
    position: absolute;
    top: 0px;
    left: 0px;
    border-top: 80px solid #fff;
    border-right: 80px solid transparent;
    z-index: 3;
    transform: rotate(180deg);
}

.semestre {
    content: '';
    position: relative;
    z-index: 3;
    display: flex;
}

.semestre::before {
    content: '';
    position: absolute;
    top: -2px;
    left: 0px;
    border-top: 79px solid #212529;
    border-right: 79px solid transparent;
    z-index: 3;
    transform: rotate(180deg);
}

.semestre.red::before {
    content: '';
    position: absolute;
    top: -2px;
    left: 0px;
    border-top: 79px solid rgb(255,39,43);
    border-right: 79px solid transparent;
    z-index: 3;
    transform: rotate(180deg);
}

.semestre.purple::before {
    content: '';
    position: absolute;
    top: -2px;
    left: 0px;
    border-top: 79px solid rgb(112, 48, 160);
    border-right: 79px solid transparent;
    z-index: 3;
    transform: rotate(180deg);
}

.semestre.green::before {
    content: '';
    position: absolute;
    top: -2px;
    left: 0px;
    border-top: 79px solid rgb(118, 147, 60);
    border-right: 79px solid transparent;
    z-index: 3;
    transform: rotate(180deg);
}

.semestre.lightblue::before {
    content: '';
    position: absolute;
    top: -2px;
    left: 0px;
    border-top: 79px solid rgb(0, 163, 210);
    border-right: 79px solid transparent;
    z-index: 3;
    transform: rotate(180deg);
}

.semestre.lightgreen::before {
    content: '';
    position: absolute;
    top: -2px;
    left: 0px;
    border-top: 79px solid rgb(84, 158, 68);
    border-right: 79px solid transparent;
    z-index: 3;
    transform: rotate(180deg);
}

.semestre.blue::before {
    content: '';
    position: absolute;
    top: -2px;
    left: 0px;
    border-top: 79px solid rgb(78, 129, 189);
    border-right: 79px solid transparent;
    z-index: 3;
    transform: rotate(180deg);
}

.semestre.aqua::before {
    content: '';
    position: absolute;
    top: -2px;
    left: 0px;
    border-top: 79px solid rgb(2, 129, 119);
    border-right: 79px solid transparent;
    z-index: 3;
    transform: rotate(180deg);
}

.semestre.skyblue::before {
    content: '';
    position: absolute;
    top: -2px;
    left: 0px;
    border-top: 79px solid rgb(77, 193, 237);
    border-right: 79px solid transparent;
    z-index: 3;
    transform: rotate(180deg);
}

.semestre.orange::before {
    content: '';
    position: absolute;
    top: -2px;
    left: 0px;
    border-top: 79px solid rgb(247, 150, 69);
    border-right: 79px solid transparent;
    z-index: 3;
    transform: rotate(180deg);
}

.semestre.pink::before {
    content: '';
    position: absolute;
    top: -2px;
    left: 0px;
    border-top: 79px solid rgb(211, 128, 120);
    border-right: 79px solid transparent;
    z-index: 3;
    transform: rotate(180deg);
}

.body-loading {
    text-align: center;
    display: flex;
    flex-direction: column;
    justify-content: center;
    position: absolute;
    top: 50%;
}

.redes-background {
    margin: 0px; 
    padding: 6px; 
    background-size: cover;
    background-position: center;
    min-height: 100vh;
}

.redes-glassefect {
    background-color: rgba(0, 0, 0, 0.33);
    backdrop-filter: blur(4px);
    -webkit-backdrop-filter: blur(4px);
    margin: -6px;
    margin-bottom: -14px;
    min-height: 100vh;
}

.redes-pensum {
    display:flex; 
    flex-direction: column; 
    justify-content: center;
}

.red-header-background {
    background-size: cover;
    background-position: center;
    position:relative;
    overflow:hidden;
    padding:0px 0px 0px 0px;
    /*height:200px;*/
    border:0px solid RGBA(62,62,62,1);
    border-radius:0px;
    background-clip:padding-box;
    background-repeat:repeat;
    background-position:50% 50%;
    background-size:cover;
    background-attachment:scroll;
    z-index:1;

    display: flex;
    justify-content: center;
    flex-direction: column;
    min-height: 100%;
}

.red-header-shape {
    top:0; 
    position: absolute; 
    width: 100%; 
    pointer-events:none; 
}

.red-header-shape-bottom {
    bottom:0; 
    position: absolute; 
    width: 100%; 
    pointer-events:none; 
}

.red-header-shape-divider {
    width: 100%; 
    margin-left:0%; 
    height: 100%;
}

.red-header-shape-divider svg {
    display: block;
    height: 100%;
    width: 100%;
}

.red-description-title {
    display: flex;
    justify-content: center;
    flex-direction: column;
    min-height: 100%;
}

.red-title {
    font-size:125%;
}

.red-description-text {
    font-size: 93.5%;
    line-height: 1.5;
    text-align: justify;
}

.red-description-text > li > p {
    margin-bottom: 0.25rem;
}

.red-areas-images {
    display: inline-block;
    max-width: 100%;
    width: 100px;
    height: auto;
}

.red-diplomados {
    border-radius: 0.25rem;
    border: 1px solid #dee2e6;
    font-weight: 600;
}

/* VALIDAR SI NO SE DESCONFIGURA LAS REDES POR ESTE CAMBIO */

@media (min-width: 1540px){
    .red-header-background {
        height:346px;
    }

    .red-header-shape {
        height: 170px;
    }

    .red-header-shape-bottom {
        height: 7px;
    }

    .red-title{
        text-align: left;
    }
}

@media (min-width: 1100px) and (max-width: 1539.98px){
    .red-header-background {
        height:276px;
    }

    .red-header-shape {
        height: 170px;
    }

    .red-header-shape-bottom {
        height: 5px;
    }

    .red-title{
        text-align: left;
    }
}

@media (min-width: 768px) and (max-width: 1099.98px){
    .red-header-background {
        height:206px;
    }

    .red-header-shape {
        height: 110px;
    }

    .red-header-shape-bottom {
        height: 5px;
    }

    .red-title{
        text-align: left;
    }
}

@media (max-width: 767.98px){
    .red-header-background {
        height:103px;
    }

    .red-header-shape {
        height: 47px;
    }

    .red-header-shape-bottom {
        height: 3px;
    }

    .red-title{
        text-align: center;
    }
}