@charset "UTF-8";
@charset "UTF-8";


/* ------------------------- */
/* Core -------------------- */
/* ------------------------- */


:root {
--cubic: all 0.33s cubic-bezier(0,.82,.61,1);
--cubique: all 0.55s cubic-bezier(.66,0,.33,1);
}


* { margin:0px }

body { 
font-size: 1.25em;
background-color: #111111; 
transition: var(--cubic);
color:white; 
}

body:hover {
background-color: #000000; 	
}



@keyframes spin { 100% {transform: rotate(360deg);} }






/* h1, h2, h3, h4, h5, p -------------------------- */



h1 { 
font-family: 'athleticsblack';
text-transform: uppercase;
font-size: 3.0em;
line-height: 1.0em;
}

h2 { 
font-family: 'athleticsmedium';
font-size: 2.0em;
line-height: 1.0em;
margin-bottom: 15px;
}


h5 { 
font-family: 'athleticslight';
text-transform: uppercase;
font-size: 1.0em;
line-height: 1.0em;
margin-bottom: 20px;
position: relative;
display: inline-block;
}

h5::after {
content: '';
position: absolute;
left:0px;
bottom: -5px;
width: 100%;
height: 2px;
background-color: white;	
}

p {
font-family: 'athletics_regularregular';
font-size: 1.0em;
line-height: 1.25em;
margin-bottom: 20px;	
}


/* Navigation ---------------------------------------- */


nav {
position:relative;
width: calc(100vw - 50px);
max-width: 1600px;
display: flex;
padding: 25px 25px;
justify-content: space-between;
align-items: center;
transition: var(--cubic);
}





nav a {
font-family: 'athleticsextrabold';
color:white;
text-decoration: none;
}

nav a .nav-circle {
width:100px;
height: auto;
animation: spin 22s infinite ease;
}

nav .nav-left {
position: relative;
flex:1;
}

nav .nav-left a {
margin-right:25px;
position: relative;
}


nav .nav-left a::after {
content: '';
position: absolute;
left:0px;
bottom: -5px;
width: 0%;
height: 3px;
background-color: white;
transition: var(--cubic);
}

nav .nav-left a:hover::after {
width: 100%;
height: 3px;

}


nav .nav-right {
position: relative;
display: flex;
justify-content: flex-end;
flex:1;
}


nav .nav-right a {
margin-left:25px;
}

nav .nav-right a i {
font-size: 1.25em;
}






/* Forms ----------------------------------------- */




form {
font-family: 'athletics_regularregular';
font-size: 1.0em;
line-height: 1.25em;
margin-bottom: 20px;	
display: flex;
flex-direction: column;
align-items: stretch;
width: 100%;
}


form label {
display: block;
margin-bottom: 5px;
}

form input {
font-family: 'athleticsbold';
background-color: transparent;
font-size: 1.0em;
padding: 20px 10px;
border: 2px solid white;
margin-bottom: 30px;
outline-style: none;
box-shadow: none;
display: block;
color:white;
transition: var(--cubic);
}


form input.submit-button {
position: relative;
padding:20px;
color:black;
background-color: white;
transition: var(--cubic);
}

form input.submit-button.disabled {
position: relative;
padding:20px;
color:lightgrey;
background-color: white;
transition: var(--cubic);
}

form input.submit-button.disabled:hover  {
color:lightgrey;
background-color: white;
cursor: not-allowed;
}





form input.submit-button:hover {
color:white;
background-color:#222222;
}



form textarea {
font-family: 'athleticsbold';
background-color: transparent;
font-size: 1.0em;
padding: 20px;
border: 2px solid white;
margin-bottom: 20px;
white-space: pre-wrap;
min-height: 222px;
color:white;
transition: var(--cubic);
}




form select {
font-family: 'athleticsbold';
background-color: transparent;
font-size: 1.0em;
padding: 20px;
border: 2px solid white;
padding-right: 50px;
margin-bottom: 30px;
transition: var(--cubic);
outline-style: none;
box-shadow: none;
color:white;
}

form textarea:focus,
form select:focus,
form input:focus,
form input:hover {
background-color: white;
color:black;
cursor: pointer;
}

form .additionals {
display: flex;
justify-content: space-between;
align-content: center;
align-items: flex-start;
}


form.newsletter {
position: relative;
display: grid;
grid-template-columns: 1fr 1fr 1fr 1fr;
align-items: start;
justify-items: stretch;
text-align: left;
margin-top: 50px;
column-gap: 25px;
}


form.newsletter .grid-box{
display: flex;
flex-direction: column;
}


form.newsletter .grid-span.legal {
position: relative;
color: #666666;
grid-column: 1 / span 4;
}


form.newsletter .grid-span.complete {
display: none;
position: relative;
background-color: #4aff00;
color: #000000;
grid-column: 1 / span 4;
padding: 25px;
padding-bottom: 0px;
margin-bottom: 25px;
}




/* A-Z ------------------------------------------- */

.anchor {
position: absolute;
left: 0px;
top: 0px;
}

.bg {
display: flex;
flex-direction: column;
position: relative;
width: 100vw;
align-items: center;
}



section {
width: calc(100vw - 50px);
min-height: 100vh;
background-color: darkcyan;
}

.content {
position: relative;
width: calc(100vw - 50px);
max-width: 1600px;
display: flex;
align-items: stretch;
}

.content:nth-of-type(even) {
flex-direction: row-reverse;
}

.content .content-image {
position: relative;
flex:1;
}

.content .content-image {
position: relative;
flex:1;
}


.content .content-image img {
width: 100%;
height: auto;
object-fit: cover;
}


.content .content-image-map {
position: relative;
padding: 50px;
flex:2;
}

.content .content-image-map img {
width: 100%;
height: auto;
}



.content .content-content {
display: flex;
align-items: flex-start;
justify-content: center;
flex-direction: column;    
padding: 50px;
flex:1;
}



.content.promo.newsletter {
position: relative;
width: 100vw;
max-width: 100vw;
}


.content.promo {
position: relative;
min-height: 1px;
display: flex;
align-items: center;
justify-content: center;
}

.content.promo .content-wide {
position: relative;
width: calc(100vw - 50px);
max-width: 1600px;
padding:100px 0px;
margin-bottom: 50px;
min-height: 1px;
z-index: 1;
text-align: center;
border-bottom: 5px solid white;
}

.content.promo {
position: relative;
border-bottom: 0px solid white;
}

.content.promo .content-wide h1 {
position: relative;
padding:0px 100px;
}

.content .content-newsletter-case {
position: relative;
width: calc(100vw - 50px);
max-width: 1400px;
background-color: #111111;
border-bottom: 0px solid white;
z-index: 1;
margin:50px;
padding: 50px;
text-align: center;
}



.content.promo img {
position: absolute;
left:0px;
top:0px;
height: 100%;
width: 100%;
object-fit: cover;
}

.grecaptcha-badge {
visibility: hidden;
}

footer {
position: relative;
display: flex;
background-color: black;
color:#555555;
min-height: 1px;
padding: 25px;
justify-content: space-between;
align-items: center;
font-size: 0.8em;
}

hr {
position: relative;
width: calc(100vw - 50px);
max-width: 1600px;
height: 3px;
background-color: white;
margin: 50px 0px;
}
