/*CLASSES*/

.darker--background { background: #111111; }
.dark--background { background: #151515; }

.heading--color { color: #e0e0e0; }
.content--color { color: #5f5f5f; }

.heading--font { font-family: Montserrat, sans-serif; }
.content--font { font-family: Raleway, sans-serif; }

/*CLASSES*/

/*HEADER*/

.header { position: fixed; top: 0; width: 100%; left: 0; z-index: 1; background: transparent; transition: .3s;
    padding: 0 20px; }
.scroll.header { background: #151515cc; transition: .3s; }
.header__container { display: flex; justify-content: space-between; align-items: center; height: 120px; transition: .3s; }
.scroll .header__container { height: 100px; transition: .3s; }

.branding { height: 100%; padding: 10px 0; }
.branding__link { height: 100%; }
.branding__img { height: 100%; width: auto; }

.menu { color: #fff; padding: 0; margin: 0; font-family: Montserrat, sans-serif; display: flex; }
.menu__item { list-style: none; }
.menu__link { text-transform: uppercase; font-weight: 700; padding: 15px 10px; transition: .3s; }
.menu--active,
.menu__link:hover { color: #999; transition: .3s; }

@media (max-width: 1200px) {
    .menu__link { padding: 8px; }
}

@media (max-width: 992px) {
    .header__container { height: 100px; max-width: initial; }
}

@media (max-width: 900px) {
    #nav-icon { width: 40px; height: 25px; position: relative; cursor: pointer; display: block; transform: rotate(0deg);
        transition: .5s ease-in-out; z-index: 4; }
    #nav-icon span { display: block; position: absolute; height: 4px; width: 100%; background: #fff; opacity: 1;
        transform: rotate(0deg); transition: .25s ease-in-out; left: 0;}
    #nav-icon.open span { background: #fff; }
    #nav-icon span:nth-child(1) { top: 0; }
    #nav-icon span:nth-child(2),
    #nav-icon span:nth-child(3) { top: 10px; }
    #nav-icon span:nth-child(4) { top: 20px; }
    #nav-icon.open span:nth-child(1) { top: 18px; width: 0; left: 50%; }
    #nav-icon.open span:nth-child(2) { transform: rotate(45deg); }
    #nav-icon.open span:nth-child(3) { transform: rotate(-45deg); }
    #nav-icon.open span:nth-child(4) { top: 18px; width: 0; left: 50%; }

    #nav-icon.open ~ .menu { right: 0; visibility: visible; transition: .3s; }
    .menu { display: block; background: #151515cc; position: fixed; right: -250px; top: 0; height: 100vh; width: 250px;
        padding-top: 100px; visibility: hidden; transition: .3s; }
    .scroll .menu { top: 100px; height: calc(100vh - 100px); padding-top: 0; }
    .menu__link { padding: 5px 20px; display: inline-block; font-size: 20px; }
}

/*HEADER*/


/*VIDEO*/

.video__container { position: relative; display: flex; justify-content: center; align-items: center; }
.video__video { width: 100%; height: 100vh; object-fit: cover; filter: brightness(.7); display: block; }

.video__text { position: absolute; }
.video__heading { font-size: 64px; text-transform: uppercase; }

@media (max-width: 768px) {
    .video__container { width: 100%; padding-bottom: 56.25%; }
    .video__video { height: initial; position: absolute; top: 0; left: 0; }
    .video__text { top: 50%; width: 100%; left: 0; transform: translateY(-50%); text-align: center; }
}

@media (max-width: 640px) {
    .video__heading { font-size: 48px; }
}

@media (max-width: 450px) {
    .video__heading { font-size: 36px; }
}

@media (max-width: 350px) {
    .video__heading { font-size: 30px; }
}

/*VIDEO*/

/*MOTTO*/

.motto { overflow: hidden; }
.motto--video { position: absolute; }
.motto__container { padding: 50px 0; }
.motto__container p { font-size: 24px; text-align: center; font-style: italic; }

/*MOTTO*/

/*IWT*/

.iwt__container { display: flex; padding: 50px; overflow: hidden; }
.iwt__side { width: 50%; }
.iwt--image img { width: 100%; height: 100%; object-fit: cover; filter: brightness(.7); }
.iwt--even .iwt--text { order: 1; }

.iwt--text { display: flex; justify-content: center; align-items: center; font-size: 18px; padding: 0 50px;
    flex-direction: column; }

.iwt__heading { font-size: 48px; margin-bottom: 20px; }

@media (max-width: 1200px) {
    .iwt__container { padding: 50px 20px;  }
    .iwt__heading { font-size: 36px; margin-bottom: 15px; }
    .iwt--odd .iwt--text { padding-left: 0; padding-right: 20px; }
    .iwt--even .iwt--text { padding-right: 0; padding-left: 20px; }
}

@media (max-width: 1000px) {
    .iwt__container { flex-direction: column; align-items: center; }
    .iwt__side { width: 100%; }
    .iwt--even .iwt--text { order: initial; }
    .iwt--odd .iwt--text { padding-right: initial; }
    .iwt--even .iwt--text {  padding-left: initial; }
    .iwt--text { margin-bottom: 30px; }

    .iwt--image { max-width: 500px; }
}

/*IWT*/

/*WAVES*/

.image--waves { position: relative; }

.waves { position: absolute; width: 100%; height: 15vh; bottom: 0; left: 0; }
.waves .parallax { display: block; width: 100%; height: 100%; overflow: hidden; padding: 200px 0; }
.waves .parallax > use { animation: move-forever 25s cubic-bezier(.55,.5,.45,.5) infinite; }
.waves .parallax > use:first-child { fill: rgba(21, 21, 21, 0.7); animation-delay: -2s; animation-duration: 7s; }
.waves .parallax > use:nth-child(2) { fill: rgba(21, 21, 21, 0.5); animation-delay: -3s; animation-duration: 10s; }
.waves .parallax > use:nth-child(3) { fill: rgba(21, 21, 21, 0.3); animation-delay: -4s; animation-duration: 13s; }
.waves .parallax > use:nth-child(4) { fill: rgba(21, 21, 21); animation-delay: -5s; animation-duration: 20s; }

@keyframes move-forever {
    0% { transform: translate3d(-90px, 0, 0); }
    100% { transform: translate3d(85px, 0, 0); }
}

@media (max-width: 600px) {
    .waves { height: 10vh; }
}

@media (max-width: 400px) {
    .waves { display: none; }
}

/*WAVES*/

/*SIX*/

.six__image img { width: 100%; height: auto; }
.six__text { font-size: 20px; padding: 50px 15px; }

@media (max-width: 1200px) {
    .six__text { padding: 50px 20px; }
}

/*SIX*/

/*FIBA*/

.fiba__text { color: #151515; }

@media (max-width: 1200px) {
    .fiba__text { padding: 50px 20px; }
}

/*FIBA*/

/*VWT*/

.vwt__video figure { margin: 0; width: 100%; padding-top: 56.25%;  position: relative; overflow: hidden; }
.vwt__video iframe { display: block; width: 100%; height: 100%; border: 0; left: 0; top: 0; position: absolute; }
.vwt__text { font-size: 20px; padding: 50px 0; }

@media (max-width: 1200px) {
    .vwt__text { padding: 50px 20px; }
}

/*VWT*/

/*PARALLAX*/

/*.image--parallax-container { max-height: 500px; }*/

/*PARALLAX*/

/*BIWT*/

.biwt__image img { width: 100%; height: auto; }
.biwt__text { font-size: 20px; padding: 50px 0; }

@media (max-width: 1200px) {
    .biwt__text { padding: 50px 20px; }
}


/*BIWT*/

/*PARTNERS*/

.partners__container { padding: 50px; }
.partners__heading { font-size: 36px; text-align: center; margin-bottom: 50px; }
.partners__logos { display: flex; justify-content: center; align-items: center; }
.partners__logos img { width: calc(100% / 6); height: auto; padding: 20px; }

@media (max-width: 1200px) {
    .partners__container { padding: 50px 20px; }
    .partners__logos img { width: 25%; }
}

@media (max-width: 800px) {
    .partners__logos img { width: calc(100% / 3); }
}

@media (max-width: 650px) {
    .partners__logos img { width: 50%; }
}

@media (max-width: 450px) {
    .partners__logos img { width: 100%; }
}

/*PARTNERS*/

/*CONTACT*/

.contact__container { padding: 50px 15px; }
.contact__heading { font-size: 36px; text-align: center; margin-bottom: 50px; }
.contact__text { text-align: center; font-size: 20px; }

/*CONTACT*/

/*LOGIN FORM*/

#user-login-form .login-form { margin-top: 50px; padding: 0 30px; }
#user-login-form .logo { text-align: center; }
#user-login-form .logo img { width: 320px; height: auto; margin-bottom: 50px; }
#user-login-form .logo h2 { color: #666666; font-family: 'Montserrat', sans-serif; font-size: 16px;
    margin-bottom: 50px; }

#user-login-form #edit-name--description,
#user-login-form #edit-pass--description { display: none; }

#user-login-form .login-fields label { display: none; }
#user-login-form .login-fields .form-text { width: 500px; margin-bottom: 30px; height: 25px; border-radius: 5px;
    border: 2px solid #6666; background-color: #F3F4EE; padding-left: 5px; font-size: 14px; }
#user-login-form .login-fields .form-text:focus { border: 2px solid #0085D0; }
#user-login-form .login-fields .field { display: flex; margin: 0 auto; }
#user-login-form .login-fields { max-width: max-content; margin: 0 auto; }
#user-login-form .login-fields p { line-height: 20px; width: 150px; color: #666666;  font-size: 16px;
    font-family: 'Montserrat', sans-serif; font-weight: normal; }
#user-login-form .login-submit { max-width: max-content; margin: 0 0 0 auto; }
#user-login-form #edit-submit { padding: 10px 50px; border-radius: 5px; border: 0; background-color: #0085D0;
    color: white; font-family: 'Montserrat', sans-serif; font-size: 15px; font-weight: normal; }
#user-login-form #edit-submit:hover { opacity: 0.85; }


@media (max-width: 700px) {
    #user-login-form .login-fields .form-text { width: 100%; }
}

@media (max-width: 450px) {
    #user-login-form .login-fields .field { display: block; }
    #user-login-form .login-fields p { margin: 0; }
    #user-login-form .login-submit { margin: 0 auto; }

    #user-login-form .logo img { width: 100%; }
}

/*END LOGIN FORM*/