@import url("https://fonts.googleapis.com/css2?family=Mulish:wght@300;400;700&display=swap");
@import url("https://fonts.googleapis.com/css?family=Mukta:700");
* {
  margin: 0;
  padding: 0;
  outline: none;
  list-style: none;
  text-decoration: none;
  box-sizing: border-box; }
  *::before, *::after {
    box-sizing: border-box; }

/*90px*/
/*64px*/
/*45px*/
/*35px*/
/*22px*/
/*18px*/
/*16px*/
/*22px*/
/*18px*/
/*16px*/
/*14px*/
/* ----- Tools ----- */
::-webkit-selection {
  background: #00346F;
  color: #FFF; }

::-moz-selection {
  background: #00346F;
  color: #FFF; }

::-ms-selection {
  background: #00346F;
  color: #FFF; }

::-o-selection {
  background: #00346F;
  color: #FFF; }

::-webkit-scrollbar {
  display: none; }

::-moz-scrollbar {
  display: none; }

::-ms-scrollbar {
  display: none; }

::-o-scrollbar {
  display: none; }

.wrapper {
  overflow-x: hidden; }

body {
  -webkit-font-smoothing: antialiased;
  -moz-font-smoothing: antialiased;
  -ms-font-smoothing: antialiased;
  -o-font-smoothing: antialiased;
  font-smoothing: antialiased;
  font-size: 1em;
  position: relative;
  font-family: "Mulish", sans-serif;
  background-color: #FFFFFF;
  cursor: default;
  animation: flash 1.5s ease-out; }

#head {
  position: relative;
  display: block;
  height: 100vh; }

.header__background {
  background-image: url(../pictures/bitrade-header-background.png);
  background-repeat: no-repeat;
  background-size: cover; }

.header__background2 {
  background-image: url(../pictures/axiome-header-background.png);
  background-repeat: no-repeat;
  background-size: cover; }

.header__background3 {
  background-image: url(../pictures/music-header-background.png);
  background-repeat: no-repeat;
  background-size: cover; }

.shorten__head {
  height: 70vh !important;
  background-image: url(../pictures/draw.png);
  background-repeat: no-repeat;
  background-size: cover; }

.writings__head {
  background-image: url(../pictures/writings.png) !important; }

.art__head {
  background-image: url(../pictures/art.png) !important; }

/* ------ MOLECULES ------ */
.container {
  max-width: 75em;
  display: block;
  margin: 0 auto;
  position: relative; }

p {
  display: block;
  line-height: 140%;
  font-weight: 400;
  font-size: 1.125em;
  position: relative;
  z-index: 10;
  color: #323232; }

.contact__text {
  padding-top: 1em;
  padding-bottom: 2em;
  width: 65%; }
  .contact__text a {
    color: blue; }

.different {
  background: #304E8A !important;
  padding: 0.7em !important; }

.limited-space {
  width: 65% !important; }
  .limited-space a {
    color: blue; }

.scroll-process {
  display: none; }

.mini-margin {
  margin-bottom: 1.25em; }

.last-section {
  padding-bottom: 10em !important; }

.last-section2 {
  padding-bottom: 5em !important; }

.footer__div {
  box-shadow: rgba(79, 89, 106, 0.075) 0px 20px 40px;
  z-index: 100;
  position: relative; }

.mail {
  margin-top: 0.7777777778em;
  font-size: 1.125em;
  font-weight: 700;
  border-bottom: 0.0555555556em solid #E7E7E7;
  margin-left: 3.3333333333em;
  cursor: pointer;
  color: #323232;
  font-family: 'Mukta', sans-serif;
  padding: 0.2777777778em 0.2777777778em 0.2777777778em 0;
  position: relative; }

.blocked {
  display: block;
  width: 11em;
  margin: 0 auto;
  margin-bottom: 10em;
  white-space: nowrap; }

.shadowed {
  box-shadow: rgba(79, 89, 106, 0.075) 0px 20px 40px;
  padding: 3em 3em !important;
  transform: translateY(-4em);
  z-index: 200;
  background: #ffffff;
  border-radius: 1.875em;
  width: 100% !important; }

.line-height {
  line-height: 1.8 !important; }

.bitrade-color {
  background: #68D8D3 !important; }

.checkout__link {
  font-size: 1.125em;
  padding: 1.1111111111em 2.2222222222em;
  width: 13.555555556em;
  font-weight: 700;
  color: #FFFFFF;
  border-radius: 3.125em;
  display: block;
  position: relative;
  font-family: 'Mukta', sans-serif;
  margin-top: 3.3333333333em;
  background: linear-gradient(180deg, #15b8ac 0%, #1d9390 100%);
  -webkit-transition: .3s ease;
  -moz-transition: .3s ease;
  -ms-transition: .3s ease;
  -o-transition: .3s ease;
  transition: .3s ease;
  box-shadow: 0px 5px 16px 0px rgba(0, 0, 0, 0.1);
  overflow: hidden;
  text-align: center; }
  .checkout__link:before {
    content: "";
    width: 150%;
    height: 200%;
    position: absolute;
    background: rgba(252, 252, 252, 0.5);
    -webkit-transform: rotate(45deg) translate(-20%, -100%);
    -moz-transform: rotate(45deg) translate(-20%, -100%);
    transform: rotate(45deg) translate(-20%, -100%);
    -webkit-transition: .4s ease;
    -moz-transition: .4s ease;
    transition: .4s ease;
    opacity: 0; }

.checkout__axiome__color {
  background: linear-gradient(160deg, #98fcc8 0%, #794ae8 100%) !important;
  width: 14.555555556em; }

.checkout__musicplz__color {
  background: #DF157A;
  width: 14.555555556em; }

.linked {
  height: 13px;
  width: 13px;
  background: url(../icons/link-white.png) no-repeat;
  background-size: cover;
  display: inline-block;
  margin-left: 0.2em; }

.linked__black {
  height: 13px;
  width: 13px;
  background: url(../icons/link.png) no-repeat;
  background-size: cover;
  display: inline-block;
  margin-left: 0.2em; }

.learn-more {
  position: relative;
  display: block;
  cursor: pointer;
  outline: none;
  border: 0;
  z-index: 2000;
  vertical-align: middle;
  text-decoration: none;
  background: transparent;
  padding: 0;
  font-size: inherit;
  font-family: 'Mukta', sans-serif;
  margin: 3.125em 0em;
  width: 11rem;
  height: auto; }
  .learn-more .circle {
    transition: all 0.45s cubic-bezier(0.65, 0, 0.076, 1);
    position: relative;
    display: block;
    margin: 0;
    width: 3rem;
    height: 3rem;
    background: #304E8A;
    border-radius: 1.625rem; }
    .learn-more .circle .icon {
      transition: all 0.45s cubic-bezier(0.65, 0, 0.076, 1);
      position: absolute;
      top: 0;
      bottom: 0;
      margin: auto;
      background: #fff; }
      .learn-more .circle .icon.arrow {
        transition: all 0.45s cubic-bezier(0.65, 0, 0.076, 1);
        left: 0.625rem;
        width: 1.125rem;
        height: 0.125rem;
        background: none; }
        .learn-more .circle .icon.arrow::before {
          position: absolute;
          content: '';
          top: -0.25rem;
          right: 0.0625rem;
          width: 0.625rem;
          height: 0.625rem;
          border-top: 0.125rem solid #fff;
          border-right: 0.125rem solid #fff;
          transform: rotate(45deg); }
  .learn-more .button-text {
    transition: all 0.45s cubic-bezier(0.65, 0, 0.076, 1);
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    padding: 0.70rem 0;
    margin: 0 1.5rem 0 3rem;
    width: 6.5rem;
    color: #323232;
    font-weight: 700;
    line-height: 1.6;
    text-align: right;
    text-transform: uppercase; }

.clearfix:after {
  content: "";
  clear: both;
  display: block; }

.underline {
  text-decoration: underline; }

.no-padding-top {
  padding-top: 0 !important; }

.no-padding-bottom {
  padding-bottom: 0 !important; }

.no-margin-bot {
  margin-bottom: 0 !important; }

.uppercase {
  text-transform: uppercase !important; }

.header__mobile {
  display: none; }

.text__box {
  position: relative; }
  .text__box .text__overlay {
    float: left;
    width: 47.5%;
    margin-right: 5%; }
    .text__box .text__overlay p {
      margin-bottom: 1.1111111111em; }
  .text__box .text__overlay:nth-child(2) {
    margin-right: 0em; }

.center {
  text-align: center; }

.color {
  color: #304E8A; }

.active {
  font-weight: 700 !important;
  color: #304E8A !important; }

.checkout {
  padding: 5em 0em;
  width: 90%;
  margin: auto; }

.active__img {
  font-weight: 700 !important; }

.active__mobile {
  font-weight: 700 !important;
  color: #304E8A !important; }

.text {
  color: #323232; }

.title__white {
  color: #ffffff !important; }

.text__img {
  color: #fff; }

.white_background .text__img {
  color: #323232 !important; }

.title {
  font-weight: 400;
  position: relative;
  color: #323232; }

.auto {
  margin: 0 auto; }

.invicible {
  display: none; }

.no-white {
  background: none !important; }

.social__list {
  position: absolute;
  bottom: 1.875em;
  z-index: 2000; }
  .social__list .social__el {
    float: left;
    margin-right: 1.25em; }
    .social__list .social__el a .img__social {
      width: 1.875em;
      height: 1.875em;
      cursor: pointer; }
  .social__list .social__el:nth-child(5) {
    margin-right: 0; }

/* ------ TITLES WITH CLASS ------ */
.main__title {
  padding: 5.5555555556em 0em 0.4444444444em 0em;
  font-size: 2.827em;
  font-weight: 400; }

.sub__title {
  padding: 2.8571428571em 0em 0.8571428571em 0em;
  font-size: 2.1875em;
  margin: auto; }

.sub__title__smaller {
  font-size: 1.414em;
  margin: auto; }

.third__title {
  font-size: 2.1875em;
  padding-bottom: 0.2857142857em; }

/* ------ TEXT WITH CLASS ------ */
.main__title__text {
  font-size: 1.125em; }

.under__title {
  font-size: 1.125em;
  width: 28em;
  margin: auto; }

.full_height {
  height: 100%; }

.navbar {
  position: relative;
  display: block;
  width: 100%;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  transition: all 500ms ease-in-out;
  z-index: 1000000000; }
  .navbar .logo__container {
    float: left;
    padding: 1.875em 0em 1.875em 0em; }
    .navbar .logo__container .logo_title {
      font-weight: 400; }
  .navbar .header__nav {
    float: right;
    padding: 1.875em 0em 1.875em 0em; }
    .navbar .header__nav .header__el {
      display: inline-block;
      margin: 0px 10px; }
      .navbar .header__nav .header__el a {
        font-weight: 400;
        z-index: 100;
        position: relative;
        display: block;
        cursor: pointer;
        border-radius: 5px;
        -webkit-transition: .5s ease;
        -moz-transition: .5s ease;
        -ms-transition: .5s ease;
        -o-transition: .5s ease;
        transition: .5s ease; }
    .navbar .header__nav .header__el:nth-child(5) {
      margin-right: 0 !important; }

.scroll-indicator {
  position: absolute;
  left: 50%;
  bottom: 0px;
  z-index: 2000; }
  .scroll-indicator .scroll {
    width: 2px;
    height: 80px;
    background-color: #ccc;
    position: relative;
    overflow: hidden; }
    .scroll-indicator .scroll .scroll-line {
      width: 100%;
      height: 100%;
      display: block;
      background: linear-gradient(to bottom, #040f30 50%, rgba(4, 15, 48, 0) 50%);
      background-position: 0 -80px;
      background-size: 100% 200%;
      animation: scrolldown 2s cubic-bezier(0.76, 0, 0.3, 1) forwards infinite; }
  .scroll-indicator span {
    position: absolute;
    right: -55px;
    top: 0;
    letter-spacing: 1px; }

.outline2 {
  left: 55% !important;
  top: 60% !important;
  transform: translate(-50%, -50%) scale(0.5) rotate(15deg) !important; }

.outline3 {
  left: 55% !important;
  top: 30% !important;
  transform: translate(-50%, -50%) scale(0.2) rotate(-10deg) !important; }

.outline {
  height: 650px;
  width: 650px;
  position: absolute;
  display: -webkit-box;
  display: flex;
  -webkit-box-align: center;
  align-items: center;
  -webkit-box-pack: center;
  justify-content: center;
  text-align: center;
  left: 80%;
  top: 50%;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%); }

.asteroid {
  width: 200px;
  height: 200px;
  position: relative;
  z-index: 0;
  top: 50px;
  left: 50px;
  -webkit-animation: force 2s linear infinite;
  animation: force 2s linear infinite; }

.asteroid2 {
  -webkit-animation: force 3s linear infinite !important;
  animation: force 3s linear infinite !important; }

.asteroid3 {
  -webkit-animation: force 5s linear infinite !important;
  animation: force 5s linear infinite !important; }

.asteroid .circle {
  width: 120px;
  height: 120px;
  background: #17B2E6;
  position: absolute;
  border-radius: 100%;
  border: 15px solid #304E8A;
  -webkit-transform: rotate(-45deg);
  transform: rotate(-45deg);
  z-index: 1;
  overflow: hidden; }

.asteroid .circle .shadow {
  height: 200px;
  width: 180px;
  background: #19C6FF;
  position: absolute;
  border-radius: 100%;
  top: -105px;
  left: -35px; }

.asteroid .circle .reflection {
  width: 60px;
  position: absolute;
  height: 35px;
  background: #73E7FF;
  border-radius: 100%;
  z-index: 2;
  top: 10px;
  left: 40px; }

.asteroid .circle .reflection:before {
  content: "";
  left: -25%;
  top: 35%;
  position: absolute;
  width: 13px;
  height: 13px;
  background: #73E7FF;
  border-radius: 100%; }

.asteroid .circle .pattern {
  width: 420px;
  height: 120px;
  z-index: 5;
  position: absolute;
  left: 0;
  -webkit-animation: flow 2s linear infinite;
  animation: flow 2s linear infinite; }

.asteroid .circle .pattern .dot > div {
  width: 20px;
  height: 20px;
  background: #0080BF;
  position: absolute;
  border-radius: 100%; }

.asteroid .circle .pattern .dot > div.small {
  width: 15px;
  height: 15px; }

.asteroid .circle .pattern .dot > div.special {
  width: 20px;
  height: 20px;
  border-radius: 100%;
  border: 15px solid #0080BF;
  background: transparent; }

.asteroid .circle .pattern .dot > div.d1 {
  left: 10px;
  top: 40px; }

.asteroid .circle .pattern .dot > div.d2 {
  left: 40px;
  top: 90px; }

.asteroid .circle .pattern .dot > div.d3 {
  left: 60px;
  top: -10px; }

.asteroid .circle .pattern .dot > div.d4 {
  left: 60px;
  top: 60px; }

.asteroid .circle .pattern .dot > div.d5 {
  left: 142px;
  top: 90px; }

.asteroid .circle .pattern .dot > div.d6 {
  left: 152px;
  top: 10px; }

.asteroid .circle .pattern .dot > div.d7 {
  left: 192px;
  top: 50px; }

.asteroid .circle .pattern .dot > div.d8 {
  left: 242px;
  top: 10px; }

.asteroid .circle .pattern .dot > div.d9 {
  left: 292px;
  top: 40px; }

.asteroid .circle .pattern .dot > div.d10 {
  left: 322px;
  top: 90px; }

.asteroid .circle .pattern .dot > div.d11 {
  left: 342px;
  top: -10px; }

.asteroid .circle .pattern .dot > div.d12 {
  left: 342px;
  top: 60px; }

.tail > div {
  height: 200px;
  width: 15px;
  overflow: hidden;
  border-radius: 150px;
  -webkit-transform: rotate(-45deg);
  transform: rotate(-45deg);
  position: absolute;
  z-index: 1;
  background: #304E8A; }

.tail > div.t1 {
  top: -71px;
  left: -53px;
  width: 15px;
  background: transparent; }

.tail > div.t1 .dash {
  height: 170px;
  width: 15px;
  position: absolute;
  background: #304E8A;
  border-radius: 150px;
  -webkit-animation: tail1 1s linear infinite;
  animation: tail1 1s linear infinite; }

.tail > div.t1 .dash:after {
  content: "";
  display: block;
  width: 15px;
  height: 170px;
  left: 0;
  border-radius: 150px;
  background: #304E8A;
  position: absolute;
  margin-top: 190px; }

.tail > div.t2 {
  left: -66px;
  top: -124px;
  width: 12px;
  background: transparent; }

.tail > div.t2 .dash2 {
  height: 170px;
  width: 12px;
  position: absolute;
  background: #304E8A;
  border-radius: 150px;
  -webkit-animation: tail1 0.8s linear infinite;
  animation: tail1 0.8s linear infinite; }

.tail > div.t2 .dash2:after {
  content: "";
  display: block;
  width: 12px;
  height: 170px;
  left: 0;
  border-radius: 150px;
  background: #304E8A;
  position: absolute;
  margin-top: 190px; }

.tail > div.t3 {
  left: -25px;
  top: -125px;
  height: 80%;
  width: 12px;
  background: transparent; }

.tail > div.t3 .dash3 {
  height: 150px;
  width: 12px;
  position: absolute;
  background: #304E8A;
  border-radius: 150px;
  -webkit-animation: tail2 1.2s linear infinite;
  animation: tail2 1.2s linear infinite; }

.tail > div.t3 .dash3:before, .tail > div.t3 .dash3:after {
  content: "";
  display: block;
  left: 0;
  background: #304E8A;
  position: absolute;
  width: 12px; }

.tail > div.t3 .dash3:before {
  height: 12px;
  border-radius: 100%;
  margin-top: 160px; }

.tail > div.t3 .dash3:after {
  height: 150px;
  border-radius: 150px;
  margin-top: 180px; }

.tail > div.t4 {
  left: 48px;
  top: -89px;
  height: 70%;
  background: transparent; }

.tail > div.t4 .dash4 {
  height: 100px;
  width: 15px;
  position: absolute;
  top: 0;
  background: #304E8A;
  border-radius: 150px;
  -webkit-animation: tail3 1s linear infinite;
  animation: tail3 1s linear infinite; }

.tail > div.t4 .dash4:after {
  content: "";
  width: 15px;
  height: 100px;
  left: 0px;
  border-radius: 150px;
  background: #304E8A;
  position: absolute;
  margin-top: 120px; }

.pulse > div {
  height: 25px;
  width: 25px;
  background: #1DC7FF;
  position: relative;
  border-radius: 100%;
  opacity: 0;
  -webkit-transform: scale(0);
  transform: scale(0); }

.pulse > div.p1 {
  left: -350px;
  top: -80px;
  -webkit-animation: pulse 3s linear infinite;
  animation: pulse 3s linear infinite; }

.pulse > div.p2 {
  left: 10px;
  top: -120px;
  -webkit-animation: pulse 3s 1s linear infinite;
  animation: pulse 3s 1s linear infinite; }

.pulse > div.p3 {
  top: 100px;
  left: -250px;
  -webkit-animation: pulse 3s 2s linear infinite;
  animation: pulse 3s 2s linear infinite; }

@-webkit-keyframes flow {
  0% {
    left: 0px; }
  100% {
    left: -282px; } }
@keyframes flow {
  0% {
    left: 0px; }
  100% {
    left: -282px; } }
@-webkit-keyframes tail1 {
  0% {
    top: 0; }
  100% {
    top: -190px; } }
@keyframes tail1 {
  0% {
    top: 0; }
  100% {
    top: -190px; } }
@-webkit-keyframes tail2 {
  0% {
    top: 0; }
  100% {
    top: -180px; } }
@keyframes tail2 {
  0% {
    top: 0; }
  100% {
    top: -180px; } }
@-webkit-keyframes tail3 {
  0% {
    top: 0; }
  100% {
    top: -120px; } }
@keyframes tail3 {
  0% {
    top: 0; }
  100% {
    top: -120px; } }
@-webkit-keyframes pulse {
  0% {
    -webkit-transform: scale(0);
    transform: scale(0);
    opacity: 0; }
  5% {
    opacity: 1; }
  20%,25% {
    -webkit-transform: scale(1);
    transform: scale(1);
    opacity: 1; }
  33.33%, 100% {
    -webkit-transform: scale(0);
    transform: scale(0);
    opacity: 0; } }
@keyframes pulse {
  0% {
    -webkit-transform: scale(0);
    transform: scale(0);
    opacity: 0; }
  5% {
    opacity: 1; }
  20%,25% {
    -webkit-transform: scale(1);
    transform: scale(1);
    opacity: 1; }
  33.33%, 100% {
    -webkit-transform: scale(0);
    transform: scale(0);
    opacity: 0; } }
@-webkit-keyframes force {
  0% {
    top: 50px;
    left: 50px; }
  50%,55% {
    top: 80px;
    left: 80px; }
  100% {
    top: 50px;
    left: 50px; } }
@keyframes force {
  0% {
    top: 50px;
    left: 50px; }
  50%,55% {
    top: 80px;
    left: 80px; }
  100% {
    top: 50px;
    left: 50px; } }
#main {
  position: relative;
  background: white;
  background: -webkit-linear-gradient(white 0%, #eeeeee 100%);
  background: -o-linear-gradient(white 0%, #eeeeee 100%);
  background: linear-gradient(white 0%, #eeeeee 100%); }

.main__white {
  background: #ffffff !important; }

.projects {
  position: relative; }

.project__list {
  position: relative;
  padding: 5em 0em 9.375em 0em; }

.project__el {
  position: relative;
  width: 90%;
  margin: auto;
  margin-bottom: 3.75em;
  border-radius: 1.875em;
  box-shadow: rgba(79, 89, 106, 0.075) 0px 20px 40px; }
  .project__el .img__bloc {
    position: relative;
    display: block;
    border-radius: 1.875em;
    overflow: hidden; }
    .project__el .img__bloc.bloc__animate {
      transition: transform .3s, box-shadow .4s; }
    .project__el .img__bloc img {
      width: 100%;
      height: 100%;
      display: block;
      transition: transform .3s; }
    .project__el .img__bloc .project__info {
      position: absolute;
      bottom: 0;
      width: 25em;
      left: 0;
      margin: 3.75em; }

.project__next {
  position: relative;
  background: white;
  background: -webkit-linear-gradient(white 0%, #eeeeee 100%);
  background: -o-linear-gradient(white 0%, #eeeeee 100%);
  background: linear-gradient(white 0%, #eeeeee 100%); }
  .project__next .project__next__list {
    position: relative;
    padding: 3em 0em 0em 0em; }
    .project__next .project__next__list .project__el__next {
      position: relative;
      width: 47.5%;
      margin: auto;
      margin-right: 5%;
      float: left;
      border-radius: 1.875em;
      box-shadow: rgba(79, 89, 106, 0.075) 0px 20px 40px; }
      .project__next .project__next__list .project__el__next .img__bloc {
        position: relative;
        display: block;
        border-radius: 1.875em;
        overflow: hidden; }
        .project__next .project__next__list .project__el__next .img__bloc.bloc__animate {
          transition: transform .3s, box-shadow .4s; }
        .project__next .project__next__list .project__el__next .img__bloc img {
          width: 100%;
          height: 100%;
          display: block;
          transition: transform .3s; }
        .project__next .project__next__list .project__el__next .img__bloc .project__info__next {
          position: relative;
          bottom: 0;
          left: 0;
          padding: 1.875em;
          background: #ffffff; }
          .project__next .project__next__list .project__el__next .img__bloc .project__info__next .third__title__next {
            font-size: 1.414em;
            padding-bottom: 0.4545454545em; }
    .project__next .project__next__list .project__el__next:nth-child(2) {
      margin-right: 0; }

.about__me {
  position: relative; }
  .about__me .about__container {
    width: 90%;
    display: block;
    margin: auto;
    padding-bottom: 6.25em; }
    .about__me .about__container .profile__box {
      width: 30%;
      display: block;
      float: left;
      margin-right: 10%; }
      .about__me .about__container .profile__box img {
        height: 100%;
        width: 100%;
        border-radius: 100%;
        box-shadow: rgba(79, 89, 106, 0.075) 0px 20px 40px; }
    .about__me .about__container .profile__info {
      display: block;
      float: left;
      width: 60%;
      position: relative; }
      .about__me .about__container .profile__info span {
        display: block;
        font-size: 0.5em;
        font-weight: 400; }
      .about__me .about__container .profile__info h2 {
        padding: 0;
        font-weight: 400;
        margin-bottom: 0.5714285714em; }
      .about__me .about__container .profile__info p {
        margin-bottom: 1.1111111111em; }
      .about__me .about__container .profile__info ul {
        position: relative;
        bottom: 0;
        margin-top: 3.75em; }
      .about__me .about__container .profile__info svg {
        position: absolute;
        bottom: -35em;
        left: 25em;
        transform: translate(-50%, -50%) scale(0.4); }

.project__explanation {
  display: block;
  position: relative; }

.picture {
  display: block;
  position: relative; }
  .picture .project__landing {
    display: block;
    width: 100%; }

.picture__low {
  width: 90%;
  margin: auto; }

.team__list {
  position: relative; }
  .team__list .team__member {
    margin-bottom: 1.875em;
    font-size: 1.125em; }
    .team__list .team__member a {
      color: blue; }

.writings .article__list {
  position: relative;
  width: 100%;
  /*1010px/1200px*/
  margin: 0 auto;
  display: block;
  padding: 5%;
  transform: translateY(-4em);
  background: #ffffff;
  border-radius: 1.875em; }
  .writings .article__list .article__el {
    display: inline-block;
    width: 30%;
    float: left;
    margin-right: 5%;
    margin-bottom: 3.75em;
    background: #FFFFFF;
    box-shadow: rgba(79, 89, 106, 0.075) 0px 20px 40px;
    -webkit-transition: .3s ease;
    -moz-transition: .3s ease;
    -ms-transition: .3s ease;
    -o-transition: .3s ease;
    transition: .3s ease;
    border-radius: 0em 0em 1em 1em; }
    .writings .article__list .article__el .img__box {
      width: 100%; }
      .writings .article__list .article__el .img__box .article__img {
        width: 100%;
        border-radius: 1em 1em 0em 0em; }
    .writings .article__list .article__el .article__info {
      padding: 1.875em; }
      .writings .article__list .article__el .article__info .article__title {
        font-size: 1.414em; }
      .writings .article__list .article__el .article__info p {
        font-size: 1.125em;
        line-height: 140%;
        margin-top: 1.1111111111em;
        height: 8em; }
      .writings .article__list .article__el .article__info .article__link {
        font-size: 1em;
        padding: 0.625em 0em;
        background: #00AB6B;
        width: 10.555555556em;
        font-weight: 700;
        color: #FFFFFF;
        overflow: hidden;
        border-radius: 3.125em;
        display: block;
        position: relative;
        text-align: center;
        font-family: 'Mukta', sans-serif;
        z-index: 30; }
        .writings .article__list .article__el .article__info .article__link:before {
          content: "";
          width: 150%;
          height: 200%;
          position: absolute;
          background: rgba(252, 252, 252, 0.5);
          -webkit-transform: rotate(45deg) translate(-20%, -100%);
          -moz-transform: rotate(45deg) translate(-20%, -100%);
          transform: rotate(45deg) translate(-20%, -100%);
          -webkit-transition: .4s ease;
          -moz-transition: .4s ease;
          transition: .4s ease;
          opacity: 0; }
  .writings .article__list .article__el:nth-child(3) {
    margin-right: 0; }
  .writings .article__list .article__el:nth-child(6) {
    margin-right: 0; }

.footer {
  position: relative;
  width: 100%;
  display: block; }
  .footer .footer__list {
    position: relative; }
    .footer .footer__list .footer__el {
      float: left;
      padding: 1.875em 0em; }
      .footer .footer__list .footer__el a {
        color: #323232;
        transition: all .3s;
        font-size: 1em; }
      .footer .footer__list .footer__el span {
        font-size: 1em; }
    .footer .footer__list .footer__el:nth-child(2) {
      position: absolute;
      left: 50%;
      transform: translateX(-50%); }
    .footer .footer__list .footer__el:nth-child(3) {
      float: right; }

.white_background {
  background: #FFF;
  box-shadow: 0 2px 14px rgba(0, 0, 0, 0.05); }

.up {
  transform: translateY(-6.25em);
  opacity: 1; }

/* ------ MEDIA QUERIES -------- */
@media screen and (min-width: 1445px) {
  .container {
    max-width: 90%; } }
@media screen and (min-width: 3000px) {
  body {
    font-size: 2em !important; }

  .scroll-indicator {
    display: none; }

  .about__me .about__container .profile__info svg {
    bottom: -17em !important; }

  .outline {
    transform: translate(-50%, -50%) scale(1.3) !important; }

  .linked {
    height: 30px !important;
    width: 30px !important;
    vertical-align: -2px; } }
@media screen and (min-width: 2000px) {
  body {
    font-size: 1.5em; }

  .scroll-indicator span {
    right: -80px; }

  .navbar .header__nav .header__el {
    margin: 0px 30px; }

  .linked {
    width: 20px;
    height: 20px; }

  .linked__black {
    width: 16px;
    height: 16px; }

  .learn-more {
    display: none; }

  .about__me .about__container .profile__info svg {
    bottom: -25em; } }
@media screen and (min-width: 1700px) {
  .writings .article__list .article__el .article__info .article__title {
    font-size: 1.7em; } }
@media screen and (min-width: 1600px) {
  .project__info {
    width: 39em !important; }

  .project__info__next {
    padding: 6.5% 15% 6.5% 6.5% !important; }

  .project__info .third__title {
    font-size: 2.827em; }

  .project__info p {
    font-size: 1.414em; }

  .navbar .header__nav .header__el a {
    font-size: 1.414em; }

  .navbar .logo__container .logo_title {
    font-size: 1.414em; }

  .main__title {
    font-size: 3.998em;
    padding: 3.5555555556em 0em 0.4444444444em 0em; }

  .main__title__text {
    font-size: 1.414em; }

  .under__title {
    font-size: 1.414em; }

  .projects .sub__title {
    font-size: 2.8em; }

  .profile__info p {
    font-size: 1.414em; }

  .footer .footer__list .footer__el a {
    font-size: 1.414em; }

  .footer .footer__list .footer__el span {
    font-size: 1.414em; }

  .social__list .social__el a .img__social {
    width: 2.75em;
    height: 2.75em; }

  .about__me .about__container .profile__info h2 {
    font-size: 2.8em; } }
@media screen and (max-width: 1200px) {
  .responsive__container {
    margin: auto;
    width: 90%; }

  .writings .article__list {
    width: 90%;
    padding: 2.5%; }

  .writings .article__list .article__el .article__info p {
    height: 10em; }

  .writings .article__list .article__el .article__info {
    padding: 1.4em; }

  .responsive {
    margin: auto;
    width: 90%; }

  .footer__list {
    margin: auto;
    width: 90%; }

  .shadowed {
    width: 90% !important; } }
@media screen and (max-width: 1115px) {
  .writings .article__list .article__el {
    float: none !important;
    display: block;
    position: relative;
    margin: auto;
    width: 100%;
    margin-bottom: 3.75em; }

  .fix {
    margin-right: auto !important; }

  .writings .article__list .article__el .article__info p {
    height: 5em; } }
@media screen and (min-width: 1115px) {
  .article__el:hover {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1); }

  .article__el:nth-child(4) {
    margin-bottom: 0 !important; }

  .article__el:nth-child(5) {
    margin-bottom: 0 !important; }

  .article__el:nth-child(6) {
    margin-bottom: 0 !important; } }
@media screen and (min-width: 1024px) {
  .navbar .header__nav .header__el a:after {
    content: "";
    bottom: 4px;
    left: 0;
    bottom: -5px;
    width: 0%;
    border-radius: 100%;
    height: 1px;
    opacity: 0;
    position: absolute;
    background: #303030;
    -webkit-transition: .2s ease-out;
    -moz-transition: .2s ease-out;
    -ms-transition: .2s ease-out;
    -o-transition: .2s ease-out;
    transition: .2s ease-out; }

  .article__list {
    animation: slideUpDiv 2s cubic-bezier(0.2, 1, 0.25, 1) 0.2s both; }

  .animated {
    animation: slideUp2 2s cubic-bezier(0.2, 1, 0.25, 1) 0.2s both; }

  #head {
    animation: fade 2.4s cubic-bezier(0.2, 1, 0.25, 1) both; }

  .shadowed {
    animation: slideUpDiv 2s cubic-bezier(0.2, 1, 0.25, 1) 0.2s both; }

  .main__title {
    animation: slideLeft 1.6s cubic-bezier(0.2, 1, 0.25, 1) 0.3s both; }

  .logo_title {
    animation: slideLeft 1.6s cubic-bezier(0.2, 1, 0.25, 1) 0.3s both; }

  .different {
    animation: opacity 1.3s ease 1.3s both !important; }

  .outline {
    animation: opacity 1s ease .7s both; }

  .main__title__text {
    animation: opacity 1.3s ease 1s both; }

  .contact__text {
    animation: opacity 1.3s ease 1s both; }

  .learn-more {
    animation: opacity 1.3s ease 1.5s both; }

  .header__el {
    animation: slideUp 1s cubic-bezier(0.2, 1, 0.25, 1) 0.7s both; }

  #head .social__list {
    animation: SlideUpVertical 1.6s cubic-bezier(0.2, 1, 0.25, 1) 2.5s both; }

  .js_reveal-on-scroll {
    -webkit-transform: translate(0, 0);
    -moz-transform: translate(0, 0);
    -ms-transform: translate(0, 0);
    -o-transform: translate(0, 0);
    transform: translate(0, 0);
    -webkit-transition: all 1.3s cubic-bezier(0.2, 1, 0.25, 1);
    -moz-transition: all 1.3s cubic-bezier(0.2, 1, 0.25, 1);
    -ms-transition: all 1.3s cubic-bezier(0.2, 1, 0.25, 1);
    -o-transition: all 1.3s cubic-bezier(0.2, 1, 0.25, 1);
    transition: all 1.3s cubic-bezier(0.2, 1, 0.25, 1);
    -webkit-opacity: 0;
    -moz-opacity: 0;
    -ms-opacity: 0;
    -o-opacity: 0;
    opacity: 1; }

  .js_unrevealed {
    -webkit-transform: translate(0, 20%);
    -moz-transform: translate(0, 20%);
    -ms-transform: translate(0, 20%);
    -o-transform: translate(0, 20%);
    transform: translate(0, 20%);
    -webkit-transition: all 1.3s cubic-bezier(0.2, 1, 0.25, 1);
    -moz-transition: all 1.3s cubic-bezier(0.2, 1, 0.25, 1);
    -ms-transition: all 1.3s cubic-bezier(0.2, 1, 0.25, 1);
    -o-transition: all 1.3s cubic-bezier(0.2, 1, 0.25, 1);
    transition: all 1.3s cubic-bezier(0.2, 1, 0.25, 1);
    -webkit-opacity: 0;
    -moz-opacity: 0;
    -ms-opacity: 0;
    -o-opacity: 0;
    opacity: 0; }

  .article__link:hover:before, .article__link:focus:before {
    transform: rotate(45deg) translate(-50%, 200%) !important;
    opacity: 1 !important; }

  .checkout__link:hover {
    -webkit-transform: scale(0.95);
    -moz-transform: scale(0.95);
    -ms-transform: scale(0.95);
    -o-transform: scale(0.95);
    transform: scale(0.95); }

  .checkout__link:hover:before, .checkout__link:focus:before {
    transform: rotate(45deg) translate(-50%, 200%);
    opacity: 1; }

  .navbar .header__nav .header__el a:hover:after {
    opacity: 1;
    width: 100%; }

  .navbar .header__nav .header__el .text__img:after {
    content: "";
    bottom: 4px;
    left: 0;
    bottom: -5px;
    width: 0%;
    border-radius: 100%;
    height: 1px;
    opacity: 0;
    position: absolute;
    background: #ffffff;
    -webkit-transition: .2s ease-out;
    -moz-transition: .2s ease-out;
    -ms-transition: .2s ease-out;
    -o-transition: .2s ease-out;
    transition: .2s ease-out; }

  .white_background .header__nav .header__el .text__img:after {
    content: "";
    bottom: 4px;
    left: 0;
    bottom: -5px;
    width: 0%;
    border-radius: 100%;
    height: 1px;
    opacity: 0;
    position: absolute;
    background: #323232 !important;
    -webkit-transition: .2s ease-out;
    -moz-transition: .2s ease-out;
    -ms-transition: .2s ease-out;
    -o-transition: .2s ease-out;
    transition: .2s ease-out; }

  .btn:hover {
    -webkit-transform: scale(0.9);
    -moz-transform: scale(0.9);
    -ms-transform: scale(0.9);
    -o-transform: scale(0.9);
    transform: scale(0.9); }
    .btn:hover:hover:before, .btn:hover:focus:before {
      transform: rotate(45deg) translate(-50%, 200%);
      opacity: 1; }

  .project__el .img__bloc.bloc__animate:hover {
    transform: perspective(1px) scale(1.048);
    box-shadow: 0 24px 48px 0 rgba(73, 73, 73, 0.2); }
    .project__el .img__bloc.bloc__animate:hover .label {
      transform: perspective(1px) translateZ(0); }
    .project__el .img__bloc.bloc__animate:hover img {
      transform: perspective(1px) scale(1.1); }

  .project__el__next .img__bloc.bloc__animate:hover {
    transform: perspective(1px) scale(1.048);
    box-shadow: 0 24px 48px 0 rgba(73, 73, 73, 0.2); }
    .project__el__next .img__bloc.bloc__animate:hover .label {
      transform: perspective(1px) translateZ(0); }
    .project__el__next .img__bloc.bloc__animate:hover img {
      transform: perspective(1px) scale(1.1); }

  .learn-more:hover .circle {
    width: 100%; }
    .learn-more:hover .circle .icon.arrow {
      background: #fff;
      transform: translate(1rem, 0); }
  .learn-more:hover .button-text {
    color: #fff; } }
@media screen and (max-width: 1024px) {
  .navbar {
    display: none; }

  .project__info {
    padding: 3.125em;
    position: relative !important;
    width: 100% !important;
    background: #ffffff;
    margin: 0 !important; }

  .learn-more .circle {
    width: 100% !important; }

  .header__background {
    background-image: url(../pictures/bitrade-header-background2.png) !important;
    background-repeat: no-repeat !important;
    background-size: cover !important; }

  .header__background2 {
    background-image: url(../pictures/axiome-header-background2.png) !important;
    background-repeat: no-repeat !important;
    background-size: cover !important; }

  .header__background3 {
    background-image: url(../pictures/music-header-background2.png) !important;
    background-repeat: no-repeat !important;
    background-size: cover !important; }

  .arrow {
    background: #fff !important;
    transform: translate(1rem, 0) !important; }

  .button-text {
    color: #fff !important; }

  .header__mobile {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    z-index: 50000;
    display: block;
    transition: all 500ms ease-in-out; }

  #burger-menu {
    cursor: pointer;
    height: 27px;
    width: 27px;
    margin: 30px;
    z-index: 5000000;
    overflow: visible;
    position: relative;
    position: relative; }

  #burger-menu .burger__white {
    background: #ffffff; }

  #burger-menu .burger__white,
  #burger-menu .burger__white:before,
  #burger-menu .burger__white:after {
    background: #ffffff;
    display: block;
    height: 4px;
    opacity: 1;
    position: absolute;
    transition: 0.3s ease-in-out; }

  #burger-menu.close .burger__white:before {
    top: 0px;
    transform: rotate(90deg);
    width: 27px;
    background: #323232; }

  #burger-menu.close .burger__white {
    transform: rotate(-45deg);
    top: 13px;
    width: 27px;
    background: #323232; }

  .white_background #burger-menu .burger__white {
    background: #323232; }

  .white_background #burger-menu .burger__white,
  .white_background #burger-menu .burger__white:before,
  .white_background #burger-menu .burger__white:after {
    background: #323232;
    display: block;
    height: 4px;
    opacity: 1;
    position: absolute;
    transition: 0.3s ease-in-out; }

  #burger-menu span,
  #burger-menu span:before,
  #burger-menu span:after {
    background: #323232;
    display: block;
    height: 4px;
    opacity: 1;
    position: absolute;
    transition: 0.3s ease-in-out; }

  #burger-menu span:before,
  #burger-menu span:after {
    content: ""; }

  #burger-menu span {
    right: 0px;
    top: 13px;
    width: 27px; }

  #burger-menu span:before {
    left: 0px;
    top: -10px;
    width: 16px; }

  #burger-menu span:after {
    left: 0px;
    top: 10px;
    width: 20px; }

  #burger-menu.close span {
    transform: rotate(-45deg);
    top: 13px;
    width: 27px; }

  #burger-menu.close span:before {
    top: 0px;
    transform: rotate(90deg);
    width: 27px; }

  #burger-menu.close span:after {
    top: 0px;
    left: 0;
    transform: rotate(90deg);
    opacity: 0;
    width: 0; }

  #menu {
    z-index: 1;
    min-width: 100%;
    min-height: 100%;
    position: fixed;
    top: 0;
    height: 0;
    visibility: hidden;
    opacity: 0;
    text-align: center;
    padding-top: 20px;
    transition: all 0.3s ease-in-out; }

  #menu.overlay {
    visibility: visible;
    opacity: 1;
    padding-top: 100px;
    background: #ffffff;
    z-index: 300000; }

  #menu li {
    list-style: none; }

  #menu a {
    color: #323232;
    display: block;
    width: 60%;
    margin: auto;
    font-size: 1.414em;
    padding: 1em;
    text-decoration: none; }

  .overlay ul li a {
    animation: tab 0.5s ease-in-out; }

  @keyframes tab {
    0% {
      transform: translateY(-50%); }
    50% {
      transform: translateY(50%); }
    100% {
      transform: translateY(0%); } } }
@media screen and (max-width: 990px) {
  .project__info__next {
    padding: 6.5% 8% 6.5% 6.5% !important; } }
@media screen and (max-width: 900px) {
  .outline2, .outline3 {
    display: none; }

  .shorten__head {
    background: none;
    background-color: #F1F1F1; }

  .outline {
    transform: translate(-50%, -50%) scale(0.8); }

  .main__title__text {
    width: 25em; }

  .project__info .third__title {
    font-size: 1.414em; }

  .project__el .img__bloc .project__info {
    margin: 1.875em; } }
@media screen and (max-width: 800px) {
  .about__me .about__container .profile__box {
    display: block;
    float: none;
    margin: auto;
    width: 40%;
    margin-bottom: 3.75em; }

  .about__me .about__container .profile__info {
    width: 100%; }

  .project__list {
    padding: 5em 0em 6.25em 0em; }

  .project__info p {
    width: 80%; }

  .text__overlay {
    float: none !important;
    position: relative;
    width: 100% !important;
    margin-right: 0 !important; } }
@media screen and (max-width: 700px) {
  .outline {
    display: none; }

  .projects .sub__title {
    width: 90%;
    margin: auto; }

  .limited-space {
    width: 100% !important; }

  .contact__text {
    width: 100% !important; }

  .project__next .project__next__list .project__el__next {
    float: none !important;
    width: 80%;
    margin: auto;
    margin-bottom: 5em; }

  .project__next .project__next__list .project__el__next:nth-child(2) {
    margin: auto; }

  .writings .article__list .article__el .article__info p {
    height: 100%; }

  .writings .article__list .article__el .article__info .article__link {
    margin-top: 1.875em; } }
@media screen and (max-width: 600px) {
  #head .social__list {
    display: none; }

  .about__me .about__container .profile__box {
    width: 50%; }

  .project__info p {
    width: 100%; }

  .writings .article__list .article__el:nth-child(6) {
    margin-bottom: 0; } }
@media screen and (max-width: 500px) {
  .footer .footer__list .footer__el {
    float: none;
    display: block;
    position: relative !important;
    transform: none !important;
    left: 0 !important;
    padding: 0.9375em 0em; }

  .footer .footer__list .footer__el:nth-child(3) {
    float: left !important; }

  .about__me .about__container .profile__info svg {
    transform: translate(-50%, -50%) scale(0.3);
    left: 20em; }

  .projects .under__title {
    margin: auto;
    width: 90%; }

  .project__info {
    padding: 1.875em; } }
@media screen and (max-width: 450px) {
  .main__title {
    font-size: 2.1875em; }

  .shorten__head {
    height: 100vh !important; }

  .topped {
    padding-top: 3em; }

  .mail {
    margin-bottom: 5em;
    margin-top: 3em; }

  .shadowed {
    box-shadow: none !important;
    padding: 5em 0em 0em 0em !important;
    transform: none !important; }

  .writings .article__list {
    transform: none !important;
    padding: 5em 0em 2em 0em; }

  .scroll-process {
    display: block; }
    .scroll-process span {
      color: #323232 !important; }

  .main__title__text {
    width: 100%; }

  .about__me .about__container .profile__box {
    width: 60%; }

  #menu a {
    font-size: 1.125em; }

  .project__next .project__next__list .project__el__next {
    width: 100%; } }
@media screen and (max-width: 400px) {
  .about__me .about__container .profile__info svg {
    transform: translate(-50%, -50%) scale(0.2);
    left: 18em; } }
@media screen and (max-width: 375px) {
  .about__me .about__container .profile__box {
    width: 80%; }

  .project__info {
    padding: 1.25em; }

  .team__list .team__member a {
    display: block;
    margin-top: 1.25em; } }
@media screen and (max-width: 350px) {
  .about__me .about__container .profile__info svg {
    display: none; } }
@media screen and (max-width: 340px) {
  .scroll-indicator {
    display: none; }

  .checkout__link {
    width: 100%; }

  .writings .article__list .article__el .article__info .article__link {
    width: 100% !important; } }
@media screen and (max-width: 290px) {
  .checkout__link {
    font-size: 1em;
    padding: 1em; }

  .checkout__link .linked {
    vertical-align: -1px; }

  #menu a {
    width: 100%; } }
@media screen and (max-width: 250px) {
  .footer {
    display: none; } }
@media screen and (max-width: 225px) {
  .writings .article__list .article__el .article__info .article__link .linked {
    height: 12px;
    width: 12px;
    vertical-align: -1px; }

  .mail {
    font-size: 1em; }

  .writings .article__list .article__el .article__info {
    padding: 0.5em; }

  .writings .article__list .article__el .article__info .article__link {
    font-size: 0.8em; }

  .checkout__link {
    font-size: 0.8em; }

  .checkout__link .linked {
    width: 11px;
    height: 11px;
    vertical-align: -1px; } }
@media screen and (max-width: 185px) {
  .main__title {
    padding-top: 0.5em !important; }

  .writings .article__list .article__el .article__info p {
    font-size: 1em; }

  .different {
    margin-bottom: 3em; }

  .contact__text span {
    display: block; }

  .mail {
    font-size: 0.8em;
    margin-top: 0em; }

  .footer {
    display: none; }

  .shadowed {
    padding: 3em 0em 0em 0em !important; }

  .checkout__musicplz__color {
    font-size: 1em; }

  .team__list .team__member {
    font-size: 1em; }

  .team__list .team__member a {
    font-size: 0.9em; }

  .linked__black {
    height: 11px;
    width: 11px;
    vertical-align: -1px; }

  #burger-menu {
    display: none; }

  .checkout .sub__title {
    font-size: 1.414em; }

  .text__box .text__overlay p {
    font-size: 1em; }

  .checkout {
    padding: 3em 0em; }

  .checkout__link {
    padding: 0.5em; }

  .project__next .project__next__list .project__el__next .img__bloc .project__info__next {
    padding: 0.8em;
    width: 100%; }

  .project__info__next p {
    font-size: 1em; }

  .projects .sub__title {
    font-size: 1.414em; }

  .projects .under__title {
    font-size: 1em; }

  .project__info .third__title {
    font-size: 1.125em; }

  .project__info p {
    font-size: 1em; }

  .project__info {
    padding: 0.8em; }

  .project__el {
    border-radius: 1em; }

  .project__list {
    padding: 3em 0em 1.25em 0em; }

  .about__me .about__container .profile__info h2 {
    font-size: 1.414em; }

  .about__me .about__container .profile__info p {
    font-size: 1em; }

  .about__me .social__el {
    margin-bottom: 1em; }

  .about__me .about__container {
    padding-bottom: 3em; }

  .footer .footer__list .footer__el a {
    display: none; } }
@media screen and (max-width: 150px) {
  .checkout__link {
    font-size: 0.625em; }

  .writings .article__list .article__el .article__info .article__link {
    font-size: 0.625em; }
    .writings .article__list .article__el .article__info .article__link .linked {
      width: 9px;
      height: 9px; }

  .contact__text {
    font-size: 0.8em; }

  .writings .article__list .article__el .article__info .article__title {
    font-size: 1.125em; }

  .writings .article__list {
    padding: 3em 0em 3em 0em !important; }

  .mail {
    font-size: 0.625em; }
    .mail .linked__black {
      width: 9px;
      height: 9px; } }
@media screen and (max-width: 180px) {
  .main__title {
    font-size: 1.6em; }

  .linked {
    height: 10px;
    width: 10px;
    vertical-align: -1px; }

  .very-small {
    font-size: 0.8em; } }
@media screen and (max-height: 650px) {
  .main__title {
    padding-top: 3em; } }
@media screen and (max-height: 500px) {
  .main__title {
    padding-top: 2.5em; }

  .different {
    margin-bottom: 3em; }

  .mail {
    margin-bottom: 5em; }

  .writings .article__list {
    transform: none !important;
    padding: 5em 0em 5em 0em; }

  .shadowed {
    box-shadow: none !important;
    padding: 5em 0em 0em 0em !important;
    transform: none !important; }

  #menu.overlay {
    overflow: scroll; } }
@media screen and (max-height: 400px) {
  .main__title {
    padding-top: 2.2em; }

  #head .social__list {
    display: none; }

  .shorten__head {
    height: 100vh !important; } }
@media screen and (max-height: 350px) {
  .learn-more {
    display: none; }

  .scroll-indicator {
    display: none; } }
@media screen and (max-height: 300px) {
  .header__mobile {
    display: none; } }
@media screen and (min-height: 1024px) {
  #head {
    height: 70vh; }

  .outline {
    transform: translate(-50%, -50%) scale(0.6); } }
/* ------ ANIMATION -------- */
@keyframes scrolldown {
  0% {
    background-position: 0 -80px; }
  75% {
    background-position: 0 0; }
  100% {
    background-position: 0 80px; } }
@keyframes flash {
  0% {
    opacity: 0; }
  100% {
    opacity: 1; } }
@keyframes translationY {
  0% {
    transform: translateY(10em); }
  100% {
    transform: translateY(-4em); } }
@keyframes translationX {
  0% {
    transform: translateX(-3em); }
  100% {
    transform: translateX(0em); } }
@keyframes slideLeft {
  0% {
    transform: translateX(-64px);
    letter-spacing: 0;
    opacity: 0; }
  100% {
    transform: translateX(0);
    letter-spacing: 3px;
    opacity: 1; } }
@keyframes slideUpDiv {
  0% {
    transform: translateY(10em); }
  100% {
    transform: translateY(-4em); } }
@keyframes opacity {
  0% {
    opacity: 0; }
  100% {
    opacity: 1; } }
@keyframes fade {
  0% {
    opacity: 0;
    transform: translateY(128px); }
  100% {
    opacity: 1;
    transform: translateY(0); } }
@keyframes slideUp {
  0% {
    transform: translateY(32px);
    opacity: 0; }
  100% {
    transform: translateY(0);
    opacity: 1; } }
@keyframes slideUp2 {
  0% {
    transform: translateY(10em);
    opacity: 0; }
  100% {
    transform: translateY(0);
    opacity: 1; } }
@keyframes SlideUpVertical {
  0% {
    transform: translateY(64px); }
  100% {
    transform: translateY(0); } }