:root {
    --color-lightgrey: #6c7b91;
    --color-grey: #455367;
    --color-darkgrey: #404854;
    --color-green: #57af5d;
    --color-text: #323945;
    --color-primary:#5AAE60;
    --color-primary-dark:#2C6330;
    --color-gray-900: #5C5F63;
    --color-gray-800: #787D81;
    --color-gray-700: #949A9F;
    --color-gray-600: #B0B7BD;
    --color-gray-500: #CCD4DB;
    --color-gray-400: #E7EBEF;
    --color-gray-300: #DCE2E6;
    --color-gray-200: #E4E8EC;
    --color-gray-100: #ECEFF2;
    --color-gray-50: #F4F6F8;
    --color-gray-25: #FCFDFD;

    --font-bebas: bebas-neue-pro, sans-serif;
    --gutter-x: 0.75rem;
    --gutter-y: 0;
    
	--animate-duration: 1s;
	--animate-delay: 1s;
	--animate-repeat: 1;
}

*,
*::before,
*::after {
	  box-sizing: border-box;
}

@media (prefers-reduced-motion: no-preference) {
	:root {
		scroll-behavior: smooth;
	}
}

body {
    margin: 0px;
    padding: 0px;
    font-family: var(--font-bebas);
    color: var(--color-grey);
    max-width: 100%;
    min-height:3000px;
    overflow-x: hidden;
}
h1 {
    color: var(--color-green);
    font-size:40px;
    font-weight:300;
    text-transform:uppercase;
    margin:0;
}
div {
    border: 0px solid;
}
a {
    text-decoration: none;
    color: inherit;
}

.fullwidth {
    width:100%;
}

#header_back{
    background: #E7EBEF;
    background: radial-gradient(circle at 35% 70%, #E7EBEF 0%, #8D9FB3 100%);
    min-height:600px;
    max-height:1000px;
}
#header {
    position:relative;
    max-width:1400px;
    min-height:600px;
    max-height:1000px;
    margin:auto;
}
#header_logo {
    position:absolute;
    left: 40px;
    top:30px;
    width:280px;
    z-index:1000;
}
#header_logo_shine {
    position:absolute;
    width:600px;
    height:600px;
    left: -160px;
    top:-300px;
    background: rgb(255,255,255);
    background: radial-gradient(circle, rgba(255,255,255,1) 0%, rgba(255,255,255,0) 70%);
    z-index:999;

}
#header_menu {
    position:absolute;
    display:flex;
    align-items:center ;
    right:0;
    top:60px;
    font-size: 26px;
    font-weight:500;
    text-transform: uppercase;
    z-index:998;
}
#header_menu .menu_but{
    color:var(--color-lightgrey);
    margin:2px;
    padding: 5px 15px;
    border-radius:25px;
    transition: all 0.3s;
    border: 1px solid #FFFFFF00;

}
#header_menu .menu_but:hover {
    color:var(--color-darkgrey);
    //background-color:#FFFFFF;
    border: 1px solid var(--color-darkgrey);
    box-shadow: 0 0 10px 3px rgba(0, 0, 0, 0.1);

}
#header_menu .menu_but:hover {
    cursor:pointer;
}

#header_menu .menu_important{
    padding: 8px 25px;
    margin:2px;
    cursor: pointer;
    user-select: none;
    color:#FFFFFF;
    border-radius:30px;
    background-color:var(--color-primary-dark);
    transition: all 0.6s;
}
#header_menu .menu_important:hover {
    background-color:var(--color-grey);
    transform: scale(0.9);
    box-shadow: 0 0 20px 10px rgba(255, 255, 255, 1);
}
#header_menu .menu_price {
	padding: 8px 25px;
	margin:2px;
	cursor: pointer;
	user-select: none;
	color:#FFFFFF;
	border-radius:30px;
	background-color:var(--color-grey);
	transition: all 0.6s;
}
#header_menu .menu_price:hover {
	background-color:var(--color-darkgrey);
	transform: scale(0.9);
	box-shadow: 0 0 20px 10px rgba(255, 255, 255, 1);
}
#slider {
    overflow: hidden;
}
#slider .frame {
    position:absolute;
    transform: translate(0%, -50%);
}
#slider  .geometry {
    position:absolute;
    transform: translate(-50%, -50%);
    overflow: hidden;
}
#slider .line1 {
    position:absolute;
    font-size:72px;
    font-weight:200;
    color:var(--color-lightgrey);
    width:auto;
    white-space: nowrap;
    transform: translate(-50%, -50%);
}
#slider .line2 {
    position:absolute;
    font-size:72px;
    font-weight:600;
    color:var(--color-grey);
    width:auto;
    white-space: nowrap;
    transform: translate(-50%, -50%);
}
#slider .line3 {
    position:absolute;
    font-size:72px;
    font-weight:900;
    color:var(--color-darkgrey);
    width:auto;
    white-space: nowrap;
    transform: translate(-50%, -50%);
}
#slider .line4 {
    position:absolute;
    font-size:36px;
    font-weight:300;
    color:var(--color-darkgrey);
    width:auto;
    white-space: nowrap;
    transform: translate(-50%, -50%);
}
#slider .line5 {
    position:absolute;
    font-size:36px;
    font-weight:300;
    color:var(--color-darkgrey);
    width:auto;
    white-space: nowrap;
    transform: translate(-50%, -50%);
}
#slider .button {
    position:absolute;
    font-size:30px;
    font-weight:500;
    padding: 8px 25px;
    cursor: pointer;
    user-select: none;
    color:#FFFFFF;
    border-radius:30px;
    background-color:var(--color-green);
    transition: box-shadow, background-color 0.6s;

}
#slider .button:hover {
    background-color:var(--color-grey);
    transform: scale(0.9);
    box-shadow: 0 0 40px 20px rgba(255, 255, 255, 1);
}
#header .arrow {
    position:absolute;
    top:50%;
    width:50px;
    height:50px;
    transform: translate(-50%, -50%);
    background-color:var(--color-grey);
    fill:var(--color-gray-25);
    padding:10px;
    border-radius:50px;
    z-index:10000;
    transition: background-color 0.6s;
    transform: translateZ(10000px);
    cursor: pointer;
}

#header .arrow:hover {
    background-color:var(--color-green);
    fill:#FFFFFF;
    box-shadow: 0 0 40px 20px rgba(255, 255, 255, 1);
}
#header #next {
    right:20px;
}
#header #prev {
    left:60px;
}
#header_video {
    display:none;
    position:absolute;
    top:0;
    left:0;
    width:100%;
}
#cosmos {
    position:absolute;
    top:0;
    left:0;
    width:100%;
    height:100%;
    border:1px solid;
    transition: opacity 10s;
}
#cosmos .star {
    position:absolute;
    z-index:10;
    transform: translate(-50%, -50%);
}
.module {
    min-height:600px;
    border:1px solid;
    margin:20px;
    font-size:200px;

}

.rounded {
	border-radius: 10px;
}
.w-100 {
	max-width: 100%;
}
.h-100 {
	height: 100%;
}
.position-static {
	position: static !important;
}
.position-relative {
	position: relative !important;
}
.position-absolute {
	position: absolute !important;
}
.position-fixed {
 	position: fixed !important;
}
.position-sticky {
 	position: -webkit-sticky !important;
 	position: sticky !important;
}
.z-index-1 {
	z-index:1;
}
.text-upper {
	text-transform: uppercase;
}
.fw-100 {
	font-weight: 100;
}
.fw-200 {
	font-weight: 200;
}
.fw-300 {
	font-weight: 300;
}
.fw-600 {
	font-weight: 600;
}

/* BLOCK */
.d-none {
	display: none !important;
}
@media (min-width: 768px) {
	.d-md-block {
		display: block !important;
	}
}
@media (min-width: 992px) {
	.d-lg-block {
		display: block !important;
	}
	.d-lg-none {
		display: none !important;
	}
}


/* CONTAINER */

.container,
.container-fluid,
.container-xxl,
.container-xl,
.container-lg,
.container-md,
.container-sm {
	width: 100%;
	padding-right: var(--gutter-x, 0.75rem);
	padding-left: var(--gutter-x, 0.75rem);
	margin-right: auto;
	margin-left: auto;
}

@media (min-width: 576px) {
	.container-sm, .container {
		max-width: 540px;
	}
}
@media (min-width: 768px) {
	.container-md, .container-sm, .container {
		max-width: 720px;
	}
}
@media (min-width: 992px) {
	.container-lg, .container-md, .container-sm, .container {
		max-width: 960px;
	}
}
@media (min-width: 1200px) {
	.container-xl, .container-lg, .container-md, .container-sm, .container {
		max-width: 1140px;
	}
}
@media (min-width: 1400px) {
	.container-xxl, .container-xl, .container-lg, .container-md, .container-sm, .container {
		max-width: 1320px;
	}
}

/* TYPOHRAPHY */
.text-start {
	text-align: left !important;
}

.text-end {
	text-align: right !important;
}

.text-center {
	text-align: center !important;
}

@media (min-width: 768px) {
.text-md-start {
    text-align: left !important;
  }

  .text-md-end {
    text-align: right !important;
  }

  .text-md-center {
    text-align: center !important;
  }
}

.fs-x2 {
	font-size:2rem;
}
.fs-x2-25 {
	font-size:2.25rem;
}
.fs-x2-5 {
	font-size:2.5rem;
}
.fw-300 {
	font-weight: 300;
}

/* MARGIN, SPACING */
.m-0 {
	margin: 0 !important;
}
.me-0 {
	margin-right: 0 !important;
}
.me-1 {
	margin-right: 0.25rem !important;
}
.me-2 {
	margin-right: 0.5rem !important;
}
.me-3 {
	margin-right: 1rem !important;
}
.me-4 {
	margin-right: 1.5rem !important;
}
.me-5 {
	margin-right: 3rem !important;
}
.ms-2 {
	margin-left: 0.5rem !important;
}
.ms-3 {
	margin-left: 1rem !important;
}
.ms-4 {
	margin-left: 1.5rem !important;
}
.my-0 {
 	margin-top: 0 !important;
 	margin-bottom: 0 !important;
}
.my-1 {
	margin-top: 0.25rem !important;
	margin-bottom: 0.25rem !important;
}
.my-2 {
	margin-top: 0.5rem !important;
	margin-bottom: 0.5rem !important;
}
.my-3 {
	margin-top: 1rem !important;
	margin-bottom: 1rem !important;
}
.my-4 {
	margin-top: 1.5rem !important;
	margin-bottom: 1.5rem !important;
}
.my-5 {
	margin-top: 3rem !important;
	margin-bottom: 3rem !important;
}
.my-auto {
 	margin-top: auto !important;
 	margin-bottom: auto !important;
}
.mx-0 {
	margin-right: 0 !important;
	margin-left: 0 !important;
}
.mx-1 {
	margin-right: 0.25rem !important;
	margin-left: 0.25rem !important;
}
.mx-2 {
	margin-right: 0.5rem !important;
	margin-left: 0.5rem !important;
}
.mx-3 {
	margin-right: 1rem !important;
	margin-left: 1rem !important;
}
.mx-4 {
	margin-right: 1.5rem !important;
	margin-left: 1.5rem !important;
}
.mx-5 {
	margin-right: 3rem !important;
	margin-left: 3rem !important;
}
.mt-0 {
	margin-top: 0 !important;
}
.mt-1 {
	margin-top: 0.25rem !important;
}
.mt-2 {
	margin-top: 0.5rem !important;
}
.mt-3 {
	margin-top: 1rem !important;
}
.mt-4 {
	margin-top: 1.5rem !important;
}
.mt-5 {
	margin-top: 3rem !important;
}
.me-lg-0 {
    margin-right: 0 !important;
  }

  .me-lg-1 {
    margin-right: 0.25rem !important;
  }

  .me-lg-2 {
    margin-right: 0.5rem !important;
  }

  .me-lg-3 {
    margin-right: 1rem !important;
  }

  .me-lg-4 {
    margin-right: 1.5rem !important;
  }

  .me-lg-5 {
    margin-right: 3rem !important;
  }

  .me-lg-auto {
    margin-right: auto !important;
  }

/* ROWS */

.g-0, .gx-0 {
	--gutter-x: 0;
}

.g-0, .gy-0 {
	--gutter-y: 0;
}

.g-1, .gx-1 {
	--gutter-x: 0.25rem;
}

.g-1, .gy-1 {
	--gutter-y: 0.25rem;
}

.g-2, .gx-2 {
	--gutter-x: 0.5rem;
}

.g-2, .gy-2 {
	--gutter-y: 0.5rem;
}

.g-3, .gx-3 {
	--gutter-x: 1rem;
}

.g-3, .gy-3 {
	--gutter-y: 1rem;
}

.g-4, .gx-4 {
	--gutter-x: 1.5rem;
}

.g-4, .gy-4 {
	--gutter-y: 1.5rem;
}

.g-5, .gx-5 {
 	--gutter-x: 3rem;
}

.g-5, .gy-5 {
	--gutter-y: 3rem;
}

.row {
	--bs-gutter-x: 1.5rem;
	--bs-gutter-y: 0;
	display: flex;
	flex-wrap: wrap;
	margin-top: calc(var(--gutter-y) * -1);
	margin-right: calc(var(--gutter-x) * -.5);
	margin-left: calc(var(--gutter-x) * -.5);
}
.row > * {
	flex-shrink: 0;
	width: 100%;
	max-width: 100%;
	padding-right: calc(var(--gutter-x) * .5);
	padding-left: calc(var(--gutter-x) * .5);
	margin-top: var(--gutter-y);
}

/* COLUMNS */

.col {
	flex: 1 0 0%;
}

.col-3 {
	flex: 0 0 auto;
	width: 25%;
}
.col-4 {
	flex: 0 0 auto;
	width: 33.33333333%;
}
.col-5 {
	flex: 0 0 auto;
	width: 41.66666667%;
}
.col-6 {
	flex: 0 0 auto;
	width: 50%;
}
.col-7 {
	flex: 0 0 auto;
	width: 58.33333333%;
}
.col-8 {
	flex: 0 0 auto;
	width: 66.66666667%;
}
.col-9 {
	flex: 0 0 auto;
	width: 75%;
}
.col-12 {
	flex: 0 0 auto;
	width: 100%;
}

@media (min-width: 576px) {
	.col-sm-3 {
		flex: 0 0 auto;
		width: 25%;
	}
	.col-sm-4 {
		flex: 0 0 auto;
		width: 33.33333333%;
	}
	.col-sm-5 {
		flex: 0 0 auto;
		width: 41.66666667%;
	}
	.col-sm-6 {
		flex: 0 0 auto;
		width: 50%;
	}
	.col-sm-7 {
		flex: 0 0 auto;
		width: 58.33333333%;
	}
	.col-sm-8 {
		flex: 0 0 auto;
		width: 66.66666667%;
	}
	.col-sm-9 {
		flex: 0 0 auto;
		width: 75%;
	}
	.col-sm-12 {
		flex: 0 0 auto;
		width:100%;
	}
}

@media (min-width: 768px) {
	.col-md-3 {
		flex: 0 0 auto;
		width: 25%;
	}
	.col-md-4 {
		flex: 0 0 auto;
		width: 33.33333333%;
	}
	.col-md-5 {
		flex: 0 0 auto;
		width: 41.66666667%;
	}
	.col-md-6 {
		flex: 0 0 auto;
		width: 50%;
	}
	.col-md-7 {
		flex: 0 0 auto;
		width: 58.33333333%;
	}
	.col-md-8 {
		flex: 0 0 auto;
		width: 66.66666667%;
	}
	.col-md-9 {
		flex: 0 0 auto;
		width: 75%;
	}
	.col-md-12 {
		flex: 0 0 auto;
		width:100%;
	}
}

@media (min-width: 992px) {
	.col-lg-3 {
		flex: 0 0 auto;
		width: 25%;
	}
	.col-lg-4 {
		flex: 0 0 auto;
		width: 33.33333333%;
	}
	.col-lg-5 {
		flex: 0 0 auto;
		width: 41.66666667%;
	}
	.col-lg-6 {
		flex: 0 0 auto;
		width: 50%;
	}
	.col-lg-7 {
		flex: 0 0 auto;
		width: 58.33333333%;
	}
	.col-lg-8 {
		flex: 0 0 auto;
		width: 66.66666667%;
	}
	.col-lg-9 {
		flex: 0 0 auto;
		width: 75%;
	}
	.col-lg-12 {
		flex: 0 0 auto;
		width:100%;
	}
}

@media (min-width: 1200px) {
	.col-xl-3 {
		flex: 0 0 auto;
		width: 25%;
	}
	.col-xl-4 {
		flex: 0 0 auto;
		width: 33.33333333%;
	}
	.col-xl-5 {
		flex: 0 0 auto;
		width: 41.66666667%;
	}
	.col-xl-6 {
		flex: 0 0 auto;
		width: 50%;
	}
	.col-xl-7 {
		flex: 0 0 auto;
		width: 58.33333333%;
	}
	.col-xl-8 {
		flex: 0 0 auto;
		width: 66.66666667%;
	}
	.col-xl-9 {
		flex: 0 0 auto;
		width: 75%;
	}
	.col-xl-12 {
		flex: 0 0 auto;
		width:100%;
	}
}
@media (min-width: 1400px) {
	.col-xxl-3 {
		flex: 0 0 auto;
		width: 25%;
	}
	.col-xxl-4 {
		flex: 0 0 auto;
		width: 33.33333333%;
	}
	.col-xxl-5 {
		flex: 0 0 auto;
		width: 41.66666667%;
	}
	.col-xxl-6 {
		flex: 0 0 auto;
		width: 50%;
	}
	.col-sxxl-7 {
		flex: 0 0 auto;
		width: 58.33333333%;
	}
	.col-xxl-8 {
		flex: 0 0 auto;
		width: 66.66666667%;
	}
	.col-xxl-9 {
		flex: 0 0 auto;
		width: 75%;
	}
	.col-xxl-12 {
		flex: 0 0 auto;
		width:100%;
	}
}

/* FLEX */
.flex {
	display: flex !important;
}
.justify-content-start {
  justify-content: flex-start !important;
}

.justify-content-end {
  justify-content: flex-end !important;
}

.justify-content-center {
  justify-content: center !important;
}

.justify-content-between {
  justify-content: space-between !important;
}

.justify-content-around {
  justify-content: space-around !important;
}

.justify-content-evenly {
  justify-content: space-evenly !important;
}

.align-items-start {
  align-items: flex-start !important;
}

.align-items-end {
  align-items: flex-end !important;
}

.align-items-center {
  align-items: center !important;
}

.align-items-baseline {
  align-items: baseline !important;
}

.align-items-stretch {
  align-items: stretch !important;
}

.align-content-start {
  align-content: flex-start !important;
}

.align-content-end {
  align-content: flex-end !important;
}

.align-content-center {
  align-content: center !important;
}

.align-content-between {
  align-content: space-between !important;
}

.align-content-around {
  align-content: space-around !important;
}

.align-content-stretch {
  align-content: stretch !important;
}

.align-self-auto {
  align-self: auto !important;
}

.align-self-start {
  align-self: flex-start !important;
}

.align-self-end {
  align-self: flex-end !important;
}

.align-self-center {
  align-self: center !important;
}

.align-self-baseline {
  align-self: baseline !important;
}

.align-self-stretch {
  align-self: stretch !important;
}
.flex-row {
  flex-direction: row !important;
}


.flex-column {
  flex-direction: column !important;
}

@media (min-width: 768px) {
  .flex-md-column {
    flex-direction: column !important;
  }
   .flex-md-row {
    flex-direction: row !important;
  }
  .justify-content-md-start {
    justify-content: flex-start !important;
  }

  .justify-content-md-end {
    justify-content: flex-end !important;
  }

  .justify-content-md-center {
    justify-content: center !important;
  }

  .justify-content-md-between {
    justify-content: space-between !important;
  }

  .justify-content-md-around {
    justify-content: space-around !important;
  }

  .justify-content-md-evenly {
    justify-content: space-evenly !important;
  }
 }
 
 .align-items-end {
 	align-items: flex-end !important;
}

/* BUTTONS */
.btn {
	display: inline-block;
	padding:.5rem 1.5rem;
	font-size: 1.115rem;
	border-radius:32px;
	font-weight: 400;
	letter-spacing: -.5px;
	transition: all .6s ease;
	border-width: 1px;
	border-style: solid;
	color:var(--color-text);
	font-family: var(--font-bebas)
}
.btn-light {
	background:#fff;
	border-color:#fff;
}
.btn-dark {
	background:#455367;
	border-color:#455367;
	color:#fff;
}
.btn-medium {
	background:var(--color-gray-300);
	border-color:var(--color-gray-300);
}
.btn-primary {
	background: var(--color-primary);
	color:#fff;
}
.btn-primary-dark {
	background: var(--color-primary-dark);
	color:#fff;
}
.btn-primary-dark:hover,
.btn-primary:hover {
	background: var(--color-text);
}
.btn-medium:hover {
	background: #fff;
}
.btn:hover {
	border:1px solid var(--color-text);
	box-shadow: 0 0 25px 2px rgba(0,0,0, .3);
	transform: scale(.9);
}
.btn-md {
	padding:.5rem 1.75rem;
	font-size:1.5rem;
}
.btn-lg {
	padding:.75rem 2.25rem;
	font-size:2rem;
}
.animate {
	-webkit-animation-duration: .5s;
	animation-duration: .5s;
	-webkit-animation-duration: var(--animate-duration);
	animation-duration: var(--animate-duration);
	-webkit-animation-fill-mode: both;
	animation-fill-mode: both;
	animation-timing-function: ease;
}
.animate-small {
	-webkit-animation-duration: .3s;
	animation-duration: .3s;
	-webkit-animation-duration: var(--animate-duration);
	animation-duration: var(--animate-duration);
	-webkit-animation-fill-mode: both;
	animation-fill-mode: both;
	animation-timing-function: ease;
}
.animate-fadeInRight {
	-webkit-animation-name: fadeInRight;
	animation-name: fadeInRight;
}
.animate-fadeOutLeft {
	-webkit-animation-name: fadeOutLeft;
	animation-name: fadeOutLeft;
}
.animate-fadeOut {
	-webkit-animation-name: fadeOut;
	animation-name: fadeOut;
}
.animate-fadeIn {
	-webkit-animation-name: fadeIn;
	animation-name: fadeIn;
}
.block {
	display: block !important;
}

@-webkit-keyframes fadeInRight {
	from {
		opacity: 0;
		-webkit-transform: translate3d(100px, 0, 0);
		transform: translate3d(100px, 0, 0);
	}
	to {
		opacity: 1;
		-webkit-transform: translate3d(0, 0, 0);
		transform: translate3d(0, 0, 0);
	}
}

@keyframes fadeInRight {
	from {
		opacity: 0;
		-webkit-transform: translate3d(100px, 0, 0);
		transform: translate3d(100px, 0, 0);
	}
	to {
		opacity: 1;
		-webkit-transform: translate3d(0, 0, 0);
		transform: translate3d(0, 0, 0);
	}
}

@-webkit-keyframes fadeOutLeft {
	from {
		opacity: 1;
		-webkit-transform: translate3d(0, 0, 0);
		transform: translate3d(0, 0, 0);
	}
	to {
		opacity: 0;
		-webkit-transform: translate3d(-100px, 0, 0);
		transform: translate3d(-100px, 0, 0);
	}
}

@keyframes fadeOutLeft {
	from {
		opacity: 1;
		-webkit-transform: translate3d(0, 0, 0);
		transform: translate3d(0, 0, 0);
	}
	to {
		opacity: 0;
		-webkit-transform: translate3d(-100px, 0, 0);
		transform: translate3d(-100px, 0, 0);
	}
}
@-webkit-keyframes fadeOut {
	from {
		opacity: 1;
		transform:scale(1);
		filter: blur(0);
	}
	to {
		opacity: 0;
		transform:scale(1.2);
		filter: blur(1.5rem);
	}
}

@keyframes fadeOut {
	from {
		opacity: 1;
		transform:scale(1);
		filter: blur(0);
	}
	to {
		opacity: 0;
		transform:scale(1.2);
		filter: blur(1.5rem);
	}
}
@-webkit-keyframes fadeIn {
	from {
		opacity: 0;
	}
	to {
		opacity: 1;
	}
}

@keyframes fadeIn {
	from {
		opacity: 0;
	}
	to {
		opacity: 1;
	}
}

@media (max-width: 768px) {
	body {
		overflow-x: none;
		width:100vw;
	}
}