:root {
	--colorNaranja: #b35000;
}

.paragraph h2.ttl, 
.field--name-field-solo-texto h2 {
	font-size: clamp(2.6rem, 6vw, 3.8rem);
	color: #3d3d3d!important;
}

p {
    font-size: 1.7rem !important;
    line-height: 2.6rem !important;
	@media screen and (max-width: 920px){
		& {
			font-size: 1.7rem !important;
			line-height: 2.6rem !important;
		}
	}
}

.path-frontpage main {
    margin-top: -80px;
}

#barra-sup {
    background-color: #1e1e1e;
	&:before{
		background-color: #1e1e1e;
	}
}

@media (max-width: 1170px){
    .menu-icon-unizar span, .menu-icon-unizar span::before, .menu-icon-unizar span::after{
        background: #f9f9f9;
    }
    .icon-unizar-nombre:before {
        color: white;
    }
}

.rwd-menu-controls.rwd-active .menu-icon-unizar {
	background-color: #1e1e1e;
}

.path-frontpage [data-drupal-messages] {
    margin-top: 0; 
}

.path-frontpage .messages--status {
	position: absolute;
}

.path-frontpage .header-mini{
    & .wrapper-cabecera-sup{
        border-bottom: 0;
    }
    & .wrapper-cabecera-med{
        z-index: 5;
        background: linear-gradient(180deg, rgb(0 0 0 / 66%) 0%, rgb(139 0 0 / 0%) 100%);
        & .inner {
            justify-content: center;
            margin: 0 auto;
            & .region-menu-principal {
                justify-content: center;
            }
        }
    }
}

/* menu home */

.path-frontpage.page-node-type-pagina-modular{
    & .stickynav-active {
        & .wrapper-cabecera-med{
            background: #ffffffdb;
            padding-top: 0;
            padding-bottom: 0;
        }
        & .nav{
            & .region-menu-principal{
                & ul.sf-menu{
                    height: auto;
                    & > li{
                        height: 10rem;
                        &:hover{
                            & > a, > span{
                                color: var(--colorGray6)!important;
                            }
                        }
                        & > a, > span{
                             color: var(--colorGray6)!important;
                        }
                    } 
                }
            }
        }
    }  
    & .nav{
        & .region-menu-principal{
            & ul.sf-menu{
            	height: auto;
                & > li{
                    height: 8rem;
                    border-bottom: 5px solid transparent;
                    &:hover{
                        border-bottom: 5px solid #af3307;
                        & > a, > span{
                            color: white;
                        }
                    }
                    & > a, > span{
                        text-transform: uppercase;
                        color: white;
                        font-size: 1.8rem;
                    }
                }
            }
        }
    }
}    

/* eol menu home */

/* paragraph hero */

#contenido-wrapper{
    & .field__item{
        & > .paragraph.fullsize.hero {
            width: 100%;
            height: 100%;
            margin: 0 auto!important;
            padding: 0;
            & .prgph{
                width: 100%
            }
            & .hero_content{
                position: relative;
                height: 700px;
                &:before{
                    content:'';
                    position: absolute;
                    width: 100%;
                    height: 100%;
                    background: black;
                    opacity: 0.3;
                    top: 0;
                    left: 0;
                    z-index: 1;
                }
                @media (max-width: 960px) {
                    & {
                        height: 600px;
                    }
                }
                @media (max-width: 860px) {
                    & {
                        height: 540px;
                    }
                }
                @media (max-width: 620px) {
                    & {
                        height: 440px;
                    }
                }
            }
            & .hero_txt{
                position: absolute;
                z-index: 1;
                top: 30rem;
                text-align: center;
                left: 50%;
                transform: translateX(-50%);
                width: 1200px;
                @media (max-width: 1220px) {
                    & {
                        width: 100%;
                        padding: var(--padding-general);
                    }
                }
                @media (max-width: 860px) {
                    & {
                        top: 15rem;
                    }
                }
                @media (max-width: 620px) {
                    & {
                        top: 10rem;
                    }
                }
                & span{
                    display: block;
                    font-size: clamp(3rem, 4vw, 5rem);
                    line-height: clamp(4rem, 4.5vw, 6rem);
                    color: white;
                    &.catedras{
                        font-weight: 600;
                    }
                    &.uz{
                        font-weight: 300;
                        font-size: clamp(1.8rem, 1.8vw, 2.5rem);
                        line-height: clamp(2.2rem, 2vw, 3.5rem);
                        margin-top: 1rem;
                        margin-bottom: 2rem;
                        text-transform: uppercase;
                        letter-spacing: 2px;
                    }	
                }	
                & a.botonwhite{
                    color: white;
                    border: 1px solid #ffffff9e;
                    font-weight: 600;
                    &:before {
                        background: #a84b2957;
                    }
                }
            }
            & .sello{
                width: 70px;
                height: 70px;
                display: block;
                position: relative;
                margin: 0 auto;
                margin-top: 2rem;
                &:before,&:after{
                    content: '';
                    position: absolute;
                    height: 1px;
                    width: 100%;
                    max-width: 125px;
                    background: white;
                    top: 50%;
                    transform: translateY(-50%);
                }
                &:after{
                    left: -90px;
                }
                &:before{
                    right: -90px;
                }
                & img{
                    width: 100%;
                    height: auto;
                    object-fit: cover;
                    @media (max-width: 860px) {
                        & {
                            width: 65%;
                        }
                    }
                }
            }
            & .colaboracion{
                & img{
                    display: block;
                    position: absolute;
                    width: 100%;
                    height: 100%;
                    object-fit: cover;
                }
            }
            & .hexagon{
                animation: latidos 12s 10;
                transform-origin: center;
                display: inline;
                & img{
                    object-fit: contain;
                    object-position: center -5rem;
                    position: absolute;
                    width: 100%;
                    height: 100%;
                    @media (max-width: 860px) {
                        & {
                            object-position: center 6rem;
                        }
                    }
                }
            }
        }    
    }
}


/* latido */

/* Animación con keyframe llamada "latidos" */
@keyframes latidos {
    from { transform: none; }
    50% { transform: scale(1.05); }
    to { transform: none; }
}
/* En la clase corazon vamos a llamar latidos en la animación  */

/* eol latido */

@media screen and (max-width: 1200px){
	.hero .hero_txt{
		width: 100%;
	}
}

@media screen and (max-width: 820px){
	.hero .hero_txt{
		font-size: 9rem;
		line-height: 9rem;
		top: 15rem;
	}
	
	.hero .hero_txt span {
        font-size: 2.7rem;
        line-height: 6rem;
	}
	
	.paragraph.hero .hero_content {
        height: 550px;
	}
}


@media screen and (max-width: 520px){
	.hero .hero_txt{
		font-size: 6rem;
		line-height: 6rem;
		top: 15rem;
	}
	
	.hero .hero_txt span {
        font-size: 1.8rem;
        line-height: 3rem;
	}
	
	.paragraph.hero .hero_content {
        height: 350px;
	}
	
	.paragraph.hero .sello {
        width: 40px;
        height: 40px;
        margin-top: 1rem;
	}
	
	.paragraph.hero .sello:before, 
	.paragraph.hero .sello:after {
         width: 70px;
	}
}


/* circles */

.hero .circles{
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    overflow: hidden;
}

.hero .circles li{
    position: absolute;
    display: block;
    list-style: none;
    width: 20px;
    height: 20px;
    background: rgba(255, 255, 255, 0.2);
    animation: animate 25s linear infinite;
    bottom: -150px;
	mask-image: url(/sites/catedras/files/archivos/imagenes/hexagon2-01.svg);
	-webkit-mask-image: url(/sites/catedras/files/archivos/imagenes/hexagon2-01.svg);
}

.hero .circles li:nth-child(1){
    left: 25%;
    width: 80px;
    height: 80px;
    animation-delay: 0s;
}


.hero .circles li:nth-child(2){
    left: 10%;
    width: 20px;
    height: 20px;
    animation-delay: 2s;
    animation-duration: 12s;
}

.hero .circles li:nth-child(3){
    left: 70%;
    width: 20px;
    height: 20px;
    animation-delay: 4s;
}

.hero .circles li:nth-child(4){
    left: 40%;
    width: 60px;
    height: 60px;
    animation-delay: 0s;
    animation-duration: 18s;
}

.hero .circles li:nth-child(5){
    left: 65%;
    width: 20px;
    height: 20px;
    animation-delay: 0s;
}

.hero .circles li:nth-child(6){
    left: 75%;
    width: 110px;
    height: 110px;
    animation-delay: 3s;
}

.hero .circles li:nth-child(7){
    left: 35%;
    width: 150px;
    height: 150px;
    animation-delay: 7s;
}

.hero .circles li:nth-child(8){
    left: 50%;
    width: 25px;
    height: 25px;
    animation-delay: 15s;
    animation-duration: 45s;
}

.hero .circles li:nth-child(9){
    left: 20%;
    width: 15px;
    height: 15px;
    animation-delay: 2s;
    animation-duration: 35s;
}

.hero .circles li:nth-child(10){
    left: 85%;
    width: 150px;
    height: 150px;
    animation-delay: 0s;
    animation-duration: 11s;
}

@keyframes animate {

    0%{
        transform: translateY(0) rotate(0deg);
        opacity: 1;
        border-radius: 0;
    }

    100%{
        transform: translateY(-1000px) rotate(720deg);
        opacity: 0;
        border-radius: 50%;
    }

}

/* eol circles */

/* eol paragraph hero */

/* paragraph texto-800 */

#contenido-wrapper .paragraph.fullsize.txt-800 .prgph{
    width: 920px;
    & p{
        font-size: 1.9rem;
        line-height: 2.7rem;
        text-align: justify;
    }
}

@media screen and (max-width: 820px){
	#contenido-wrapper .paragraph.fullsize.txt-800 .prgph{
	    width: 100%;
	}
}

/* eol paragrpah texto-800 */

/* paragraph empresas */

.paragraph.bg-grey.empresas{
	background-color: #f3f1f0 !important;
	position: relative;
	&:before{
		content: '';
		position: absolute;
		width: 100%;
		height: 10%;
		background-color: white;
		bottom: 0;
		left: 0;
	}
	&:after{
		content: '';
		position: absolute;
		width: 100%;
		height: 20%;
		z-index: 555;
		top: 0;
		left: 0px;
		background: rgb(243 241 240);
		background: linear-gradient(180deg, rgba(231,231,231,1) 0%, rgba(255,255,255,0) 100%);
	}
	& .prgph{
		position: relative;
		z-index: 5;
		& > h2.ttl {
			padding-left: 5rem;
			margin-bottom: 4rem;
			font-weight: 600 !important;
			@media (max-width: 820px) {
	      & {
					padding-left: 0;
	      }
  		}
		}
		.custom-cubo h3{
			font-weight: 600;
			span{
				font-weight: 700 !important;
				font-size: 3rem;
				margin-left: 3px;
			}
		}
	}
	& .field--name-field-cubos-texto > .field__item{
		position: relative;
		&:before{
			content:"";
			position: absolute;
			bottom: -3px;
			left: 21rem;
			height: 5px;
			width: 35%;
			border-radius: 5px;
			background-color: var(--colorNaranja);
			z-index: 2;
		}
        @media (max-width: 520px) {
            &:before {
                background-color: verde;
                left: 2rem;
            }
        }	
		& .imag-cubo img{
			@media (max-width: 520px) {
				& {
					 max-height: 20rem;
				}
			}	
		}
	}
}	


.paragraph.masinfo{	
	& .botonwhite{
		border: 1px solid #b0b0b0;
		font-weight: 600 !important;
	}
}

/* eol paragraph empresas */

/* invest */

.paragraph.invest{	
	& .prgph{
		position: relative;
		z-index: 5;
		& h2 {
			margin-bottom: 4rem;
			font-weight: 600 !important;
		}
		& .invest_text_imagen{
			display: flex;
			gap: 7rem;
            @media (max-width: 880px) {
                & {
                    flex-wrap: wrap;
                    gap: 2rem;
                }
            }
		}	
		& .invest_text{
			padding-left: 5rem;
			margin: 2rem 0;
			width: 45%;
            @media (max-width: 880px) {
                & {
                    width: 100%;
                    padding-left: 0;
                }
            }
		}
		& .invest_image{
			flex: 1;
		}
		& .invest_call{
			background: var(--colorNaranja);
			padding: 5rem;
			margin-top: -30px;
            @media (max-width: 520px) {
				& {
                    padding: 3rem;
                    margin-top: -5px;
				}
			}	
			& h3 {
				color: white!important;
				text-align: center;
				font-size: 2.2rem;
                margin: 0;
			}
		}
	}
}	

/* eol invest */

/* banda logos */

.paragraph.logos {
	& .view-content{
		ul{
			margin: 0;
		}
		& li{
			margin: 0 2rem;
			display: flex;
			align-items: center;
			justify-content: center;
			& img{
				max-height: 6rem;
				height: auto;
				width: 100%;
				mix-blend-mode: multiply;
				filter: grayscale(1);
			}
		}
	}
}

/* eol banda logos */

/* banda formacion */

.paragraph.forma{
	background-color: #f3f1f0 !important;
    position: relative;
	background: center / cover  no-repeat url(/sites/catedras/files/archivos/imagenes/background2.png);
	/*
	&:before{
        content: '';
        position: absolute;
        width: 100%;
        height: 20px;
        background-color: white;
        top: 0;
        left: 0;
	}*/
	& .prgph{
		position: relative;
		z-index: 5;
		& h2 {
			margin-bottom: 6rem;
			font-weight: 600 !important;
		}
		& .forma{
			display: flex;
			flex-wrap: wrap;
			gap: 7rem;
		}
		& .forma_imagen{
			flex:1;
			position: relative;
			&:before{
				content: '';
                content: '';
                position: absolute;
                width: 70%;
                height: 194px;
                background-color: #ffffffbd;
                bottom: -15px;
                right: -20px;
                z-index: -1;
			}
		}	
		& .forma_text{
			width: 55%;
			@media screen and (max-width: 800px){
				& {
					width: 100%;
                    margin-top: 0;
				}
			}
		}
		& .botonwhite{
			background-color: var(--colorNaranja);
			font-weight: 600;
			color: white;
			margin-top: 5rem;
			border:0;
		}
	}
}

/* eol banda logos */

/* Logos footer */

.block.logos-footer{
	& .block-content{
		ul{
			display: flex;
			gap: 4rem;
			margin: 2rem 0 1rem;
			justify-content: center;
			align-items: center;
			list-style: none;
			li{
				height: 8rem;
				&:before{
					content: none;
				}
				& img{
					height: 100%;
                    width: 100%;
                    object-fit: contain;
				}
			}
		}
	}
}
/* eol logos footer */

/* bloque noticias */

.paragraph li.new-item .titulo-noticia {
    font-size: 1.9rem;
}

/* eol bloque noticias */

/* banda formacion */

.field--name-field-modular > .field__item > .paragraph.mapa{
    width: 100%;
	padding: 0;
}

/* eol banda formacion */










