.transition-alt{transition: all 1s}
.mask{background: linear-gradient(0deg, rgba(0, 0, 0, 0.6), rgba(0, 0, 0, 0.6));}
.mask-banner{background: rgba(0,0,0,.54)}

.shadow-header{box-shadow: 18px -2px 23px 0px rgba(0, 0, 0, 0.46);}
.shadow{box-shadow: 0px 4px 21px 4px rgba(0, 0, 0, 0.25);}
.shadow-white{box-shadow: 0px 0px 1px 1px rgba(255, 255, 255, .5);}
.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: rgb(45, 100, 50); mix-blend-mode: hard-light;}
.gradient-section{background: linear-gradient(360deg, #E52528 0%, #B30040 82.87%);}
.gradient-section-alt{background: linear-gradient(360deg, #B30040 0%, #E52528 82.87%);}
.gradient-live{background: linear-gradient(-92.43deg, #E52528 16.62%, #FF9900 78.39%);}

.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}

h2.special, h1.special, h2.special-alt, h1.special-alt{min-height: 5.625vw; border-left: var(--6px) var(--success-color) solid}
h2.special-alt, h1.special-alt{border-left-color: var(--warning-color)}
a.special, button.special{border-bottom: var(--6px) var(--warning-color-alt) solid; transition: all .5s}
a.special:hover{border-bottom-color: var(--warning-color); background-color: var(--warning-color-alt); color: white}
a.special-alt{border-bottom-width: var(--6px); transition: all .5s}
a.special-alt:hover{border-bottom-color: var(--gray-color); background-color: #fff; color: #000}

.xright-half-alt{transform: translateX(-50%);}
.xleft-half-alt{transform: translateX(50%);}
.ytop-half-alt{transform: translateY(50%);}
.ybottom-half-alt{transform: translateY(-50%);}

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

#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(--9px);
    background: var(--warning-color);
    transition: all .5s;
}
li.menu.active::before{width: 100%}
li.menu.active > span, li.menu.active > a{font-weight: bold}
li.menu:hover::before{width: 100%}
li.menu > ul, li.menu > div{
    display: none;
    min-width: 22vw;
}
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{font-weight: bold; border-bottom-color: var(--successs-color);}

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

@media(min-width:769px){
    .formation{height: 25.78125vw; min-height: 25.78125vw}
    .speaker figure{width: 18.75vw; height: 18.75vw; min-height: 18.75vw}
    .news figure, #homeArticles > i.absolute{height: 18.229166667vw; min-height: 18.229166667vw}
    .video figure{height: 14.84375vw}
    .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}
    .speaker figure{width: 47vw; height: 47vw; min-height: 47vw}
}

.value .title{
    background-size: cover;
    -webkit-text-fill-color: transparent;
    text-fill-color: transparent;
    -webkit-background-clip: text;
    background-clip: text;
}

.os-tab-head.active *{font-weight: 900}
.os-tab-head, .gradient-banner-alt{
    color: var(--white-color);
    background: linear-gradient(92.43deg, rgba(178, 0, 64, 1) 0%, rgba(2, 36, 78, 1) 100%);
}
.os-tab-head.active{
    color: var(--success-color);
    background: #fff;
}

.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}
}