@font-face {
	font-family: 'Urban Grotesk';
	/*src: url('../fonts/UrbanGroteskLiSe-Regular.ttf') format('truetype');*/
  src: url('../fonts/UrbanGroteskLiSe-Bold.ttf') format('truetype');
	font-weight: 400;
	font-style: normal;
	font-display: swap;
}

@font-face {
	font-family: 'Urban Grotesk Bold';
	src: url('../fonts/UrbanGroteskReBo-Bold.ttf') format('truetype');
	font-weight: 700;
	font-style: normal;
	font-display: swap;
}

@import url('https://fonts.googleapis.com/css2?family=Google+Sans+Flex:opsz,wght@6..144,1..1000&display=swap');

:root {
  --color-blue: #041c34;
}

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

body{
  position: relative;
  font-family: 'Urban Grotesk';
  background-image: url('../images/bg.jpg');
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  &::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 40%;
    background: linear-gradient(to bottom, rgba(255, 255, 255, 0.8), rgba(255, 255, 255, 0));
    z-index: -1;
  }
  &::after {
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 40%;
    background: linear-gradient(to top, rgba(4, 28, 52, 0.8), rgba(255, 255, 255, 0));
    z-index: -1;
  }
}

main {
  
  ul {
    list-style-type: disc;
    padding-left: 2rem;
    margin: 1rem 0;
    p { margin-bottom: 0; }
  }
  ol {
    list-style-type: decimal;
    padding-left: 2rem;
    margin: 1rem 0;
    p { margin-bottom: 0; }
  }
}


h1, .h1 {
  font-size: 3rem;
  font-weight: 700;
  line-height: 120%;
}

h3 {
  font-size: 2rem;
  font-weight: 700;
}

h4 {
  font-size: 1rem;
  font-weight: 800;
  text-align: center;
  text-transform: uppercase;
  line-height: 120%;
}

p { margin-bottom: 1rem; }

a {
  text-decoration: underline;
  font-weight: 800;
}

b, strong { font-family: 'Urban Grotesk Bold'; }

@keyframes shrink {
  0% { transform: scale(1); }
  100% { transform: scale(1.1); }
}

@keyframes zoom_out {
  100% {transform:  scale(1);}
}

@keyframes zoom_in {
  100% {transform:  scale(1.1);}
}

@keyframes pulse {
  0% { transform: translate(-50%,-50%) scale(1); }
  100% { transform: translate(-50%,-50%) scale(1.1); opacity: 0;}
}

@keyframes big_pulse {
  0% { transform: translate(-50%,-50%) scale(1); }
  100% { transform: translate(-50%,-50%) scale(1.4); opacity: 0;}
}


.io-hidden{
	opacity: 0;
	transform: translateY(100px);
  transition-duration: 1s;
  transition-timing-function: ease-out;
  &.io-left{transform: translateX(-80%);}
  &.io-right{transform: translateX(80%);}
}

.io-show{
	opacity: 1 !important;
	transform: translate(0, 0) !important;
}



@media (min-width: 1536px){
  .container { max-width: 1280px; }
  .container.tight { max-width: 1024px; }
}

@media (min-width: 1280px){
  .container.tight { max-width: 1024px; }
}

@media (min-width: 1024px) {
  
}

/********* MAX-WIDTH *********/

@media (max-width: 1600px){
  
}

@media (max-width: 1440px){
  
}

@media (max-width: 1280px){

}