html { scroll-behavior: smooth; }
body {overflow-x: hidden;  }


/* Three Myths TEXT-Block ---------------------------------------------------------------- */

/* TEXT-BOX */
.myths-textbox { width: 100%; height: auto; margin: 100px auto 70px auto;
display: -webkit-box;
display: -ms-flexbox;
display: flex; 
 justify-content: center;
-webkit-box-align: center;
-ms-flex-align: center;
 align-items: center;
}

/* Textblock */
.myths-textblock { font-family: "Oswald", sans-serif; text-transform: uppercase; text-align: left; color: #000;
font-size: 5vw;
font-weight: bold;
margin: auto;
}

/* Lines */
.line { padding-left: 0.75em; line-height: 0.95; white-space: nowrap; opacity: 0;
-webkit-transform: translateY(110%);
 transform: translateY(110%);
-webkit-backface-visibility: hidden;
 backface-visibility: hidden;
will-change: transform, opacity;
}

/* ANIMATION */
.myths-textblock.animate .line {
-webkit-animation: reveal 1.4s cubic-bezier(.22,.7,.3,1) forwards;
 animation: reveal 1.4s cubic-bezier(.22,.7,.3,1) forwards;
}
.myths-textblock.animate .line:nth-child(1) { animation-delay: 0.25s; }
.myths-textblock.animate .line:nth-child(2) { animation-delay: 0.45s; }
.myths-textblock.animate .line:nth-child(3) { animation-delay: 0.60s; }
.myths-textblock.animate .line:nth-child(4) { animation-delay: 0.85s; }

/* Keyframes */
@-webkit-keyframes reveal {
0% { -webkit-transform: translateY(110%); opacity: 0; }
60% { -webkit-transform: translateY(-2%); opacity: 1; }
100% { -webkit-transform: translateY(0); opacity: 1; }
}
@keyframes reveal {
0% { transform: translateY(110%); opacity: 0; }
60% { transform: translateY(-2%); opacity: 1; }
100% { transform: translateY(0); opacity: 1; }
}

/* Block Layout */
.three { letter-spacing: .19em; }
.myths { letter-spacing: .8em; }
.for { letter-spacing: .45em; }
.athens { letter-spacing: .17em; }






/* OPEN CALL SECTION -------------------------------------------------------------------------- */

.oc-section { width: 100%; padding: 80px 0; background: #fff; }
.oc-section .container { width: 60%; max-width: 740px; margin: 0 auto; text-align: center; }
.oc-section h1 { font-size: 95px; letter-spacing:0; line-height: 1.3em; color: #000; margin: 100px 0 120px; } 
.oc-section h2 { font-size: 50px; line-height: 1.1em; margin: 60px 0 15px; }
.oc-section h3 { font-size: 40px; line-height: 1.1em; }
.oc-section h4 { font-size: 25px; margin: 60px 0 50px; text-align: center; line-height:1.3em; }
.oc-section p { width: 100%; padding: 15px 0 30px 0; font-size: 1.25em; text-align: justify; color: grey; }
.oc-section p > span { font-weight: 400; color: #5b5b5b; }
.oc-section p.subtitle { width: 100%; text-align: right; font-size: 0.9em; font-style: italic; color: #FFF;
  margin-top: -40px; 
  padding-right: 3%; 
  }





 /* M E D I A  Q U E R I E S --------------------------------------------------------- */

/* ≤ 1439px */
@media (max-width: 1439px) {
.myths-textblock { font-size: 6vw; }
}

/* ≤ 991px */
@media (max-width: 991px) {
.myths-textblock { font-size: 9vw; }
.oc-section .container { width: 85%; }
}

/* ≤ 767px */
@media (max-width: 767px) {
.myths-textblock { font-size: 11vw; }
.oc-section .container { width: 95%; }
}

/* ≤ 575px */
@media (max-width: 575px) {
.myths-textblock { font-size: 14vw; }
}

/* ≤ 479px */
@media (max-width: 479px) {
.myths-textblock { font-size: 17vw; }
.oc-section .container { width: 100%; }
}

/* ≤ 375px */
@media (max-width: 375px) {
.oc-section h1 { font-size: 85px; }
}