#banner-header{
display:none;
}
.col-md-8{
padding:0 !important;
}
.col-12{
padding:0 !important;
}
.card-form {
position: static !important;
top: auto !important;
transform: none !important;
width: 100% !important;
}
.col-md-4
{
flex: unset !important;
width: 25% !important;
max-width: 25% !important;
position: fixed !important;
left: 70% !important;
bottom: 10% !important;
}
.col-md-8
{
flex:unset !important;
width:100% !important;
max-width:100% !important;
}
.pb-0
{
padding:0;
}
.carousel
{
display:none;
}
@media screen and (max-width: 1337px){
.col-md-4
{
width:25% !important;
left: 70% !important;
}
}
@media screen and (max-width: 1100px){
.col-md-4
{
position:unset !important;
width:100% !important;
max-width:100% !important;
}
}
body {
margin: 0;
font-family: Arial, sans-serif;
}
.slider {
position: relative;
width: 100%;
height: 100vh;
overflow: hidden;
}
.slides {
display: flex;
width: 100%; /* Ajustado al número de slides */
height: 100%;
transition: transform 0.5s ease-in-out;
}
.slide {
flex: 0 0 100%; /* Cada slide ocupa el 100% del ancho del slider */
display: flex;
justify-content: center;
align-items: center;
font-size: 2rem;
font-weight: bold;
color: #004aad;
background-color: white;
flex-flow:wrap;
-webkit-mask-image: linear-gradient(360deg, transparent 5%, black 25%);
}
.slide h2{
color: #fff;
font-size: 20px;
font-weight: 700;
}
.slide p{
font-size: 13px;
font-weight: 500;
color: #fff;
margin: 0px 25px;
text-align: center;
font-family: 'Montserrat', sans-serif;
color: #fff;
text-shadow: 0px 2px 3px rgba(0, 0, 0, 100%);
line-height:1.6;
}
.slide .infooferslide
{
text-align:center;
background-color: rgba(0, 0, 0, 0.74);
padding:5px;
border-radius:15px;
width:40%;
margin:0 10px;
}
.slide ul{
display: flex;
flex-flow: wrap;
list-style: none;
margin:0;
justify-content:center;
padding:0;
}
.slide ul li{
font-size: 15px;
font-weight: 500;
font-family: 'Montserrat', sans-serif;
color: #fff;
width: 30%;
margin: 10px;
display: flex;
flex-flow: column;
justify-content: center;
align-items: center;
padding: 10px;
text-align:center;
border-radius:15px;
background-color: rgba(0, 0, 0, 0.74);
}
.slide ul li img{
width: 35px;
margin: 5px;
}
.principalh
{
font-family: 'Montserrat', sans-serif;
font-size: 40px;
position: absolute;
display: flex;
z-index: 1;
font-weight:600;
text-align:center;
color:#fff;
width:100%;
justify-content:center;
top:80px;
text-shadow: 0px 0px 8px rgba(0, 0, 0, 100%);
}
.buttons {
display: flex;
gap: 10px;
z-index:1;
bottom:20px;
justify-content:center;
}
.button {
border: none;
color: #242d55;
padding: 10px 20px;
cursor: pointer;
font-size: 1rem;
border-radius: 5px;
transition: background 0.3s;
width:90px;
text-align:center;
font-family:'Montserrat', sans-serif;
font-weight:500;
font-size:12px;
}
.button img {
width:100%;
margin:5px;
}
.button:hover {
background: #e8541e;
}
.button.active {
transform:scale(1.1);
transition: all 0.5s ease;
color:#e8541e;
background: #fff;
}
@media screen and (max-width: 1360px){
.principalh{
font-size:30px;
}
.slide p{
font-size:16px !important;
}
}
@media screen and (max-width: 1280px){
.slide{
-webkit-mask-image: linear-gradient(360deg, transparent 5%, black 15%);
}
.slide ul li
{
font-size:12px;
}
}
@media screen and (max-width: 1100px){
.slide p
{
font-size: 14px !important;
}
}
@media screen and (max-width: 800px)
{
.slide
{
background-position-x:-500px !important;
-webkit-mask-image: linear-gradient(360deg, transparent 5%, black 7%) !important;
}
.slider {
height: 150vh;
}
.slide .infooferslide{
margin: 0;
width: 100%;
border-radius: 0;
line-height: 2.2;
background-color: rgba(0, 0, 0, 0.5);
}
.slide h2
{
font-size:20px;
margin:0;
}
.slide p{
margin:5px 0;
padding: 0 10px;
}
.slide ul li
{
justify-content:start;
width:85%;
flex-flow:row;
margin: 5px 0;
}
.principalh{
font-size:18px;
top:30px;
font-weight:700;
}
.slide p
{
line-height:1.5;
}
}
/**slider-mapa_curricular**/
.planes {
position: relative;
width: 100%;
height: 50vh;
overflow: hidden;
}
.plan {
display: flex;
width: 100%; /* Ajustado al número de slides */
height: 100%;
transition: transform 0.5s ease-in-out;
}
.materias {
flex: 0 0 100%; /* Cada slide ocupa el 100% del ancho del slider */
display: flex;
justify-content: center;
align-items: center;
color: #004aad;
background-color: white;
flex-flow:row;
}
.semestres {
display: flex;
gap: 10px;
z-index:1;
flex-flow:wrap;
width:100%;
justify-content:center;
}
.semestre {
border: none;
color: #242d55;
padding: 10px 0px;
cursor: pointer;
border-radius: 5px;
transition: background 0.3s;
width:100px;
text-align:center;
font-family:'Montserrat', sans-serif;
font-weight:500;
font-size:12px;
}
.materias ul{
display: flex;
list-style: none;
margin:0;
padding:0;
justify-content:center;
flex-flow:wrap;
}
.materias ul li{
font-size: 15px;
font-weight: 500;
font-family: 'Montserrat', sans-serif;
color: #fff;
width: 25%;
margin: 10px;
display: flex;
justify-content: center;
align-items: center;
padding: 10px;
text-align:center;
border-radius:15px;
background-color: rgba(0, 0, 0, 0.4);
flex-flow:wrap;
}
.materias ul li p{
margin:0;
}
.semestre:hover {
background: #CECECE;
}
.semestre.active {
transform:scale(1.1);
transition: all 0.5s ease;
color:#e8541e;
font-weight:700;
}
@media screen and (max-width: 1280px)
{
.semestre{
width:90px;
}
}
@media screen and (max-width: 930px)
{
.planes
{
height: 80vh;
}
}
@media screen and (max-width: 750px)
{
.materias
{
width:100%;
}
.materias ul
{
margin:1px auto;
flex-flow:column;
align-items:center;
}
.materias ul li{
width:90%;
padding: 5px;
font-size: 14px;
margin: 1px 1px;
border-radius: 10px;
}
.buttons
{
gap:30px;
}
.button
{
padding: 5px 5px;
width:60px;
font-size:10px;
}
.planes
{
height:unset;
}
}
/**Puntos**/
.puntos
{
display:flex;
flex-flow:wrap;
flex-direction:row;
gap: 3em;
justify-content:center;
margin: 20px 0 40px;
}
.punto
{
width: 25%;
padding: 0.4rem;
position: relative;
background: linear-gradient(to right, #FF8B00, #EC5518);
border-radius:20px 0px 20px 20px;
box-shadow:8px 17px 5px rgba(0, 0, 0, 39%);
}
.textopu
{
background: #fff;
color: white;
padding: 0.4rem;
border-radius:15px 0px 15px 15px;
display:flex;
}
.text1
{
width:70%;
}
.text2
{
width:30%;
}
.text1 p
{
font-family:'Montserrat', sans-serif;
color:#242d55;
font-size:17px;
}
.text2 .circle
{
display: flex;
justify-content:center;
align-items:center;
position:absolute;
font: normal normal normal 25px/1 FontAwesome;
text-rendering: auto;
-webkit-font-smoothing: antialiased;
background-color:#FF8B00;
color:#fff;
border-radius:50px 10px 60px 50px;
text-align:center;
font-size:30px;
width:85px;
height:70px;
top:-10px;
left:-15px;
border-right: solid 10px;
}
.circle img
{
height:27px;
width:30px;
}
@media screen and (max-width: 950px)
{
.punto
{
width:90%;
}
}
/**Caja coordinador**/
.coordinadores
{
flex-direction: row;
flex-flow:wrap;
justify-content:center;
align-items:center;
display:flex;
background-color:#242D55;
padding:15px 0;
}
.cord
{
width:40%;
display:flex;
align-items:center;
justify-content:center;
flex-flow:wrap;
}
.cord img
{
height:25vh;
}
.cord p
{
font-family: 'Montserrat', sans-serif;
color:#fff;
font-weight:500;
margin:20px 0;
}
@media screen and (max-width: 750px){
.cord
{
width:100%;
text-align:center;
}
.cord img
{
height:20vh;
}
}
.bmth
{
margin: 0 15px;
font-size: 15px;
font-weight: 600;
}
.bmth p
{
margin: 5px 0;
}
@media screen and (max-width: 1100px)
{
.bmth
{
font-size:13px;
}
}
@media screen and (max-width: 950px)
{
.bmth
{
width:100%;
font-size:15px;
}
}