.transition-alt{transition: all 1s}
.mask{background: rgba(49, 63, 65, .71); filter: blur(-50px)}
.mask-agenda{background: linear-gradient(241.36deg, #FFE2C0 44.48%, #152234 187.82%);}
.mask-banner{background: rgba(0,0,0,.54)}

.shadow{box-shadow: 0px 4px 40px 0px rgba(0, 0, 0, 0.2);}
.shadow-alt{box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, .2);}
.shadow-alt-2{box-shadow: 0 3px 1px -2px rgba(0,0,0,.14), 0 2px 2px 0 rgba(0,0,0,.098), 0 1px 5px 0 rgba(0,0,0,.084);}
.text-shadow{text-shadow: 0px 2px rgba(96, 71, 110, .5)}
.text-shadow-white{text-shadow: 0px 2px 2px rgba(8, 36, 73, .85);}

.gradient-banner{background: linear-gradient(180deg, rgba(8, 36, 73, 1) 23.82%, rgba(0,47,107,1) 100%);}
.gradient-banner-alt{background: linear-gradient(30.46deg, rgba(0, 0, 0, 0.69) 19.53%, rgba(0, 0, 0, 0) 72.51%);}
.gradient-link{background: linear-gradient(96.84deg, rgba(13, 110, 119, 1) 27.96%, #CBB19C 116.64%);}
.gradient-shortcut{background: linear-gradient(180deg, rgba(213, 35, 123, 0.62) 0%, rgba(96, 71, 110, 0.4402) 100%);}

.transparent{opacity: 0.27}
.transparent-alt{opacity: .12}
.transparent-alt-2{opacity: .78}

.text-vertical{position: relative; transform: rotate(-90deg);}
.text-vertical-right{position: relative; transform: rotate(90deg);}
.text-vertical.center,.text-vertical-right.center{transform: rotate(-90deg) translateY(0%); left: 50%; transform-origin: left;}
.banner-left-in{padding-left: 4.791666667vw}

a.special:hover{text-decoration: underline}
.lspacing{letter-spacing: 0.15em;}

.icon.document-alt{background-image: url('../icons/document-alt.svg')}
.icon.download-alt{background-image: url('../icons/download-alt.svg')}

.sunset svg *{
    stroke: #ccc;
    stroke-miterlimit: 1;
    stroke-width: 0.15px;
}
#banner .sunset{transform: translateX(70%);}
#banner h1{font-size: var(--title-size); line-height: var(--title-line-height)}
@media(min-width:768px){
    #banner h1{transform: translateX(-4.791666667vw);}
}
#banner h1 strong{font-weight: 700; color: var(--warning-color);}
#banner .sunset svg{width: 100%; height: 100%; opacity: .78}
.banner .sunset{right: -27.5%}
.banner .sunset svg *{stroke-width: .15px; stroke: #fff; opacity: .78}
#word .sunset{
    width: 140%;
    height: 140%;
    bottom: calc(5.8 * var(--60px));
    left: calc(-1 * var(--20px));
}
#footer .sunset{
    height: 42.394179894vw;
    width: 77.579365079vw;
    left: -20.03968254vw;
    top: 0;
}
#footer .sunset svg *{stroke: rgba(96, 71, 110, 1); opacity: 1}

#menu.opened{max-height: calc(100vh - var(--header-height))}
@media(max-width:768px){
    #menu{
        max-height: 0px;
        overflow: hidden;
        z-index: -1;
    }
    #menu.opened{overflow: auto}
	.logo {font-size: 20px; font-weight: 900}
}

li.menu::before{
    content:"";
    display: block;
    position: absolute;
    bottom: 0; left: 0; right: 0;
    margin-left: auto; margin-right: auto;
    width: 0%; height: var(--10px);
    background: var(--success-color-alt);
    transition: all .5s;
}
li.menu.active::before{width: 100%}
li.menu:hover::before{width: 100%}
li.menu > ul, li.menu > div{
    display: none;
    min-width: 30vw;
}
li.menu > div.special{
    min-width: 60vw;
    /* transform: translateX(-50%);
    left: 50%; */
}
li.menu:hover ul{display: block}
li.menu:hover > div{display: flex}
li.menu:hover li:not(.special) a, li.menu:hover li:not(.special) span{border-bottom: solid var(--3px) rgba(0, 0, 0, 0);}
li.menu:hover li:hover a, li.menu:hover li:hover span{border-bottom-color: var(--successs-color);}

#slider .slide-dot.active{background: var(--success-color)}

.news figure, #homeArticles > i.absolute{height: 21.164021164vw; min-height: 21.164021164vw}
.video figure{height: 13.28125vw}
.shortcut{height: 26.455026455vw}
@media(max-width:768px){
    .news figure, #homeArticles > i.absolute{height: 75vw; min-height: 75vw}
    .os-slider-child .news figure{width: 75vw; min-width: 75vw}
}

#thematicInput{display: none; max-height: 40vh; max-width: 85vw; overflow-y: auto;}
#thematicInput.opened{display: block;}

.os-tab-head.active *{font-weight: 900}
.os-tab-head::after{
    content: "";
    bottom: calc(-1 * var(--1px));
    left: 0; right: 0;
    margin: auto;
    width: 0%;
    height: var(--5px);
    position: absolute;
    background: var(--success-color);
    transition: all 1s
}
.os-tab-head.active::after{width: 100%;}

.link, .doc-pag{min-height: 5.621693122vw; height: 5.621693122vw}
.doc-pag.alt{min-height: 3.421693122vw; height: 3.421693122vw}
.link::before, .doc-pag::before{
    content: "";
    display: block;
    position: absolute;
    top : 0;
    right: 0;
    height: 100%;
    border-left: var(--40px) solid transparent;
    border-top: 0px solid transparent;
    border-bottom: 5.621693122vw solid white;
    box-sizing: border-box;
}
.doc-pag.alt::before{border-bottom: 3.421693122vw solid white}
.doc .triangle{
    content: "";
    display: block;
    position: absolute;
    top : 0;
    right: 0;
    height: 110%;
    width: var(--80px);
    transform: rotate(10deg) translateX(100%);
    transform-origin: top;
}
.doc-phase .circle{
    border: var(--4px) solid transparent;
    background: rgba(235, 207, 183, 1);
    width: var(--20px);
    min-width: var(--20px);
    height: var(--20px);
    transform: translateX(50%)
}

.doc-phase.active .circle{
    border-color: var(--warning-color);
    width: var(--25px);
    height: var(--25px);
}

@media(max-width:768px){
    .link, .doc-pag{min-height: 80px; height: 80px}
    .link::before, .doc-pag::before{border-bottom-width: 80px}
}



.yt-preview{width: 56.5625vw; height: 31.6145vw}
.flickr-frame, .youtube-frame, .map-frame, #article .slide-box{height: 32vw;}
textarea{height: 12vw}
@media(max-width:768px){
	.yt-preview, .map-frame{width: 80vw; height: 40vw}
	.flickr-frame, .youtube-frame, .map-frame, #article .slide-box{height: 220px;}
	textarea{height: 150px}
}

@media(min-width:768px){
#article .article h2{font-size: 2.34vw}
#article .article h3{font-size: 2vw}
}


.fidafform label{
    font-size: var(--h6-size);
    color: var(--success-color);
    text-transform: uppercase;
    display: block;
    margin-top: var(--15px);
}
.fidafform input,
.fidafform textarea,
.fidafform select{
    font-size: var(--h6-size);
    border: var(--1px) solid var(--warning-color-alt);
    width: 100%;
    background: none;
    border-radius: 0;
    padding: var(--15px) var(--20px);
    margin-top: var(--5px);
    margin-bottom: var(--20px);
}
.fidafform label + div{
    margin-top: var(--5px);
    margin-bottom: var(--40px);
}
.fidafform input + label,
.fidafform input + label + label{margin-top: 0px; color: var(--black-color)}

.fidafform label + ul{list-style-type: none; color: var(--error-color)}


@media(min-width:768px){
.article h2{font-size: 2.34vw}
.article h3{font-size: 2vw}
}