﻿.el-container{
	display: none;
}
@keyframes point-rotate{
	0%{transform: rotate(0);}
	100%{transform: rotate(360deg);}
}
@media screen and (min-width: 600px) {
	@font-face {
		font-family: 'Calibri2';
		src: url('/AEETHER/Calibri.woff2') format('woff2');
		font-display: optional;
	}
	@font-face {
		font-family: 'Calibri2';
		src: url('/AEETHER/Calibri-Bold.woff2') format('woff2');
		font-display: optional;
		font-weight: bold;
	}
	header{
		display: flex;
		width: 100vw;
		justify-content: space-around;
		z-index: 100;
		position: relative;
		background-color: white;
		height: 3.5vw;
	}
	header::after{
		content: "";
		position: absolute;
		width: 10%;
		height: 8vw;
		left: 50%;
		top: 0;
		transform: translate(-50%, 0vw);
		background: linear-gradient(white 0%, white 80%, transparent 100%);
	}
	#nav-btn{
		display: none;
	}
	.click-event{
		cursor: pointer;
	}
	.click-event > img, .click-event > p{
		pointer-events: none;
	}
	.reference{
		background-color: #eee;
		height: 2.2vw;
		padding: 0 2.2vw 0 .8vw;
		border-radius: 2.2vw;
		position: relative;
		display: inline-block;
		border: solid .2vw #fff;
	}
	.reference::after{
		content: "?";
		width: 1.8vw;
		height: 1.8vw;
		background-color: #fff;
		font-size: 1vw;
		font-weight: bold;
		line-height: 1.8vw;
		text-align: center;
		position: absolute;
		right: .2vw;
		top: .2vw;
		border-radius: 1.8vw;
		color: #999;
	}
	html,body{
		padding: 0;
		margin: 0;
		font-family: Calibri, Calibri2;
	}
	input, textarea{
    	outline: none;
    	font-family: Calibri, Calibri2;
	}
	ul{
		list-style-type: none;
		padding: 0;
		margin: 0;
	}
	h1, h2, h3, p{
		margin: 0;
	}
	a{
		text-decoration: none;
		color: #333333;
	}
	label{
		cursor: pointer;
	}
	::-webkit-scrollbar{
		background: transparent;
		width: .8vw;
	}
	::-webkit-scrollbar-corner{
		background: transparent;
	}
	::-webkit-scrollbar-track{
		background: linear-gradient(180deg, #32558e 4.5vw, #eee 0, #eee 10%);
	}
	::-webkit-scrollbar-thumb{
		background: #aaa;
	}
	::-webkit-scrollbar-thumb:hover{
		background: linear-gradient(105deg, #8653ea 0%, #7053ea 20%, #535aea 40%, #5385ea 60%, #4fabde 80%, #50aadc 100%);
	}
	.header-content:nth-child(1){
		background: linear-gradient(105deg, transparent 2vw, #8d7f62 0, #8d7f62 90%, transparent 2vw);
	}
	.header-content:nth-child(2){
		background: linear-gradient(105deg, transparent 2vw, #936b51 0, #936b51 90%, transparent 2vw);
	}
	.header-content:nth-child(4){
		background: linear-gradient(105deg, transparent 2vw, #736c6d 0, #736c6d 90%, transparent 2vw);
	}
	.header-content:nth-child(5){
		background: linear-gradient(105deg, transparent 2vw, #7c7f74 0, #7c7f74 90%, transparent 2vw);
	}
	.down-word{
		font-size: 1vw;
		vertical-align: sub;
	}
	.up-word{
		font-size: 1vw;
		vertical-align: super;
	}
	.button{
		box-shadow: .3vw .3vw .8vw #a1a1a1, 
		            -.3vw -.3vw .8vw #fefefe;
		transition: all .1s;
		cursor: pointer;
	}
	.button:active{
		box-shadow: .15vw .15vw .4vw #a1a1a1, 
		            -.15vw -.15vw .4vw #fefefe;
	}
	::selection{
		background-color: rgba(50, 85, 142, 0.8);
		color: white;
	}
	.header-content{
		width: 25vw;
		height: 2.5vw;
		margin: 1vw 0 0 0;
		opacity: 0.9;
	}
	.header-content a{
		text-align: center;
		font-size: 1.5vw;
		color: #fff;
		line-height: 2.3vw;
		font-weight: bold;
		display: block;
		width: 100%;
		height: 100%;
	}
	#header-content{
		width: 12%;
		z-index: 101;
	}
	#header-content a{
		text-decoration: none;
	}
	#header-content h1{
		margin: 0;
		text-align: center;
		font-size: 1.8vw;
		color: #333333;
		font-weight: bold;
		transform: translate(0.2vw, 5.3vw);
	}
	#header-content img{
		margin: 0;
		position: absolute;
		left: 50%;
		width: 5vw;
		transform: translate(-50%, 0.8vw);
		z-index: 1;
	}
	nav{
		display: flex;
		width: 100vw;
		justify-content: space-around;
		height: 4.5vw;
		position: sticky;
		top: 0vw;
		background-color: white;
		z-index: 99;
		box-shadow: 0 -1vw 3vw 1vw #666;
	}
	.nav-content{
		width: 15vw;
	}
	.nav-content > a{
		height: 100%;
		width: 100%;
		display: block;
		text-align: center;
		font-size: 1.5vw;
		line-height: 2.2vw;
		color: #333333;
		text-decoration: none;
		font-weight: bold;
		transition: all 0.3s;
		background-color: white;
	}
	.nav-title{
		background: linear-gradient(105deg, #fff 2vw, #fff 0, #fff 90%, #fff 2vw);
	}
	.nav-content:hover .nav-title{
		background: linear-gradient(105deg, #fff 2vw, #eee 0, #eee 90%, #fff 2vw);
		color: #333333!important;
	}
	.nav-content:hover .nav-arrow{
		background-color: #eeeeee;
		color: #333333!important;
		transform: rotate(0deg) scale(0.7, 1);
	}
	.nav-content p{
		position: relative;
		display: block;
		margin: 0;
		top: 1.1vw;
	}
	.nav-content-2{
		width: 15vw;
	}
	.nav-content-2 > a{
		height: 100%;
		width: 15vw;
		display: block;
		text-align: center;
		font-size: 1.5vw;
		line-height: 2.2vw;
		color: #fff!important;
		text-decoration: none;
		font-weight: bold;
		transition: background 0.3s;
		overflow: hidden;
		background: linear-gradient(105deg, #fff 2vw, #32558e 0);
	}
	.nav-content-2:hover .nav-title{
		background: linear-gradient(105deg, #fff 2vw, #333 0);
	}
	.nav-content-2 p{
		position: relative;
		display: block;
		margin: 0;
		top: 1.1vw;
		transform: translate(.5vw, 0);
		color: #fff!important;
	}
	#nav-content{
		width: 10vw;
		background-color: white;
	}
	#nav-content > a{
		width: 10vw;
	}
	#nav-content img{
		width: 3.6vw;
		position: relative;
		position: fixed;
		top: 0.7vw;
		left: 48.2vw;
	}


	.nav-arrow{
		width: 0vw;
		height: 0vw;
		border-style: solid;
		border-color: transparent transparent #333333;
		border-width: 0 0.3vw 0.3vw;
		position: relative;
		left: 7.1vw;
		top: -1.2vw;
		transform: rotate(180deg) scale(0.7, 1);
		transition: transform 0.3s;
		pointer-events: none;
	}
	#about-us-nav{
		position: absolute;
		top: 4.5vw;
		background-color: #eeeeee;
		width: 98vw;
		padding: 1vw;
		transform: translate(0, -1vw);
		z-index: -1;
		transition: transform 0.5s;
		opacity: 0.8;
		box-shadow: 0 -0.8vw 30px 10px #666;
	}
	#about-us-nav ul{
		position: relative;
		left: 2.5vw;
		line-height: 2vw;
		font-weight: bold;
		list-style: none;
		margin: 1vw;
		padding: 0;
	}
	#about-us-nav a{
		text-decoration: none;
		color: #333333;
		font-size: 1vw;
		line-height: 0vw;
	}
	#about-us-nav a::after{
		content: "";
		height: 0.1vw;
		width: 3vw;
		background-color: #333333;
		display: block;
		transform: translate(0, -0.5vw) scale(0, 1);
		transition: transform 0.3s;
		transform-origin: 0 0;
	}
	#about-us-nav a:hover::after{
		transform: translate(0, -0.5vw) scale(1, 1);
	}
	.nav-content:hover #about-us-nav{
		transform: translate(0, 0vw);
		opacity: 1;
	}
	#products-nav{
		position: absolute;
		left: 0;
		top: 4vw;
		width: 98vw;
		padding: 1vw 1vw 0 1vw;
		z-index: -1;
		display: flex;
		justify-content: center;
		pointer-events: none;
	}
	#products-nav > div::before{
		content: "";
		position: absolute;
		left: 0;
		bottom: -2vw;
		width: 100%;
		height: 3vw;
		border-radius: 0 0 1vw 1vw;
		pointer-events: none;
		background-color: #fff;
	}
	#products-nav > div::after{
		content: "";
		width: 0;
		height: 0;
		border: solid .8vw transparent;
		border-bottom: solid .8vw #32558e;
		margin: 0;
		position: absolute;
		left: calc(50% - .8vw); 
		transform: scale(0.7, 1);
		bottom: -.8vw;
		pointer-events: none;
	}
	#products-nav > div{
		background-color: white;
		width: 18vw;
		margin: .5vw .5vw 0 .5vw;
		padding: 1vw 0 0 0;
		border-radius: 1vw;
		box-shadow: 0vw 2vw 1vw #666;
		position: relative;
		transform: translate(0, -30vw);
		opacity: 0;
		transition: transform 0.5s, opacity 0.5s;
	}
	#products-nav > div:nth-of-type(1){
		transition-delay: .03s;
	}
	#products-nav > div:nth-of-type(2){
		transition-delay: .06s;
	}
	#products-nav > div:nth-of-type(3){
		transition-delay: .09s;
	}
	#products-nav > div:nth-of-type(4){
		transition-delay: .12s;
	}
	#products-nav > div:nth-of-type(5){
		transition-delay: .15s;
	}
	#products-nav h1{
		display: block;
		position: relative;
		width: 50vw;
		margin-bottom: 5vh;
		padding: 0;
		color: #333333;
		left: 25vw;
		font-size: 4vw;
		text-align: center;
	}
	#products-nav h1::after{
		content: "";
		height: 0.2vw;
		width: 42vw;
		position: relative;
		left: 4vw;
		background-color: #333333;
		display: block;
		transform: translate(0, 0vw) scale(0, 1);
		transition: transform 0.3s;
	}
	#products-nav h1:hover::after{
		transform: translate(0, 0vw) scale(1, 1);
	}
	#products-nav ul{
		position: relative;
		left: 2.5vw;
		line-height: 2vw;
		font-weight: bold;
		list-style: none;
		margin: 1vw;
		padding: 0;
	}
	.nav-content:hover #products-nav{
		pointer-events: inherit;
	}
	.nav-content:hover #products-nav > div{
		transform: translate(0, 0vw);
		opacity: 1;
	}
	.nav-productslogo{
		width: 2vw;
		height: 2vw;
		transform: translate(-0.6vw, 0.7vw);
	}
	.products-p{
		display: block;
		width: 18vw;
		font-size: 1.3vw;
		font-weight: bold;
		text-align: center;
		padding-bottom: 1vw;
	}
	#products-p::after{
		content: "";
		height: 0.1vw;
		width: 18vw;
		background-color: #333333;
		display: block;
		transform: translate(0, 0vw) scale(1, 1);
		transition: transform 0.3s;
	}
	#products-p:hover::after{
		transform: translate(0, 0vw) scale(1, 1);
	}
	.products-li{
		font-size: 0.9vw;
	}
	.products-a{
		text-decoration: none;
		color: #333333;
		font-size: 1vw;
		line-height: 0vw;
	}
	.products-a::after{
		content: "";
		height: 0.1vw;
		width: 3vw;
		background-color: #333333;
		display: block;
		transform: translate(2vw, -0.4vw) scale(0, 1);
		transition: transform 0.3s;
		transform-origin: 0 0;
	}
	.products-a:hover::after{
		transform: translate(2vw, -0.4vw) scale(1, 1);
	}
	#grades-nav{
		position: absolute;
		left: 0;
		top: 4vw;
		width: 98vw;
		padding: 1vw 1vw 0 1vw;
		z-index: -1;
		display: flex;
		justify-content: center;
		pointer-events: none;
	}
	#grades-nav > div::before{
		content: "";
		position: absolute;
		left: 0;
		bottom: -2vw;
		width: 100%;
		height: 3vw;
		border-radius: 0 0 1vw 1vw;
		pointer-events: none;
		background-color: #fff;
	}
	#grades-nav > div::after{
		content: "";
		width: 0;
		height: 0;
		border: solid .8vw transparent;
		border-bottom: solid .8vw #32558e;
		margin: 0;
		position: absolute;
		left: calc(50% - .8vw); 
		transform: scale(0.7, 1);
		bottom: -.8vw;
		pointer-events: none;
	}
	#grades-nav > div{
		background-color: white;
		width: 18vw;
		margin: .5vw .5vw 0 .5vw;
		padding: 1vw 0 0 0;
		border-radius: 1vw;
		box-shadow: 0vw 2vw 1vw #666;
		position: relative;
		transform: translate(0, -30vw);
		opacity: 0;
		transition: transform 0.5s, opacity 0.5s;
	}
	#grades-nav > div:nth-of-type(1){
		transition-delay: .03s;
	}
	#grades-nav > div:nth-of-type(2){
		transition-delay: .06s;
	}
	#grades-nav > div:nth-of-type(3){
		transition-delay: .09s;
	}
	#grades-nav > div:nth-of-type(4){
		transition-delay: .12s;
	}
	#grades-nav > div:nth-of-type(5){
		transition-delay: .15s;
	}
	.nav-content:hover #grades-nav{
		pointer-events: inherit;
	}
	.nav-content:hover #grades-nav > div{
		transform: translate(0, 0vw);
		opacity: 1;
	}
	#grades-nav h1{
		display: block;
		position: relative;
		width: 30vw;
		margin-bottom: 5vh;
		padding: 0;
		color: #333333;
		left: 35vw;
		font-size: 4vw;
		text-align: center;
	}
	#grades-nav h1::after{
		content: "";
		height: 0.2vw;
		width: 22vw;
		position: relative;
		left: 4vw;
		background-color: #333333;
		display: block;
		transform: translate(0, 0vw) scale(0, 1);
		transition: transform 0.3s;
	}
	#grades-nav h1:hover::after{
		transform: translate(0, 0vw) scale(1, 1);
	}
	#grades-nav ul{
		position: relative;
		line-height: 2vw;
		font-weight: bold;
		list-style: none;
		margin: 1vw;
		padding: 0;
		display: flex;
		flex-wrap: wrap;
		justify-content: center;
	}
	.grades-p{
		display: block;
		width: 18vw;
		font-size: 1.8vw;
		font-weight: bold;
		text-align: center;
		padding-bottom: 1vw;
	}
	#grades-p::after{
		content: "";
		height: 0.1vw;
		width: 18vw;
		background-color: #333333;
		display: block;
		transform: translate(0, 0vw) scale(1, 1);
		transition: transform 0.3s;
	}
	#grades-p:hover::after{
		transform: translate(0, 0vw) scale(1, 1);
	}
	.grades-li{
		font-size: 1.2vw;
		display: block;
		width: 6vw;
		text-align: center;
	}
	.grades-a{
		text-decoration: none;
		color: #333333;
		font-size: 1.2vw;
		line-height: 0vw;
	}
	.grades-a::after{
		content: "";
		height: 0.1vw;
		width: 3vw;
		position: relative;
		left: 50%;
		background-color: #333333;
		display: block;
		transform: translate(-50%, -0.2vw) scale(0, 1);
		transition: transform 0.3s;
		transform-origin: 50%, 50%;
	}
	.grades-a:hover::after{
		transform: translate(-50%, -0.2vw) scale(1, 1);
	}
	#nav-monel{
		width: 9vw!important;
	}
	#nav-monel .grades-p{
		width: 9vw!important;
	}
	#nav-monel .grades-a{
		width: 9vw!important;
	}
	#nav-monel ul{
		width: 7vw!important;
	}
	#nav-others{
		width: 12vw!important;
	}
	#nav-others .grades-p{
		width: 12vw!important;
	}
	#nav-others .grades-a{
		width: 12vw!important;
	}
	#nav-others ul{
		width: 10vw!important;
	}
	#nav-incoloy{
		width: 27vw!important;
	}
	#nav-incoloy .grades-p{
		width: 27vw!important;
	}
	#nav-incoloy .grades-a{
		width: 9vw!important;
	}
	#nav-incoloy ul{
		width: 25vw!important;
	}
	#nav-inconel{
		width: 23vw!important;
	}
	#nav-inconel .grades-p{
		width: 23vw!important;
	}
	#nav-inconel .grades-a{
		width: 9vw!important;
	}
	#nav-inconel ul{
		width: 21vw!important;
	}
	#nav-hastelloy{
		width: 16vw!important;
	}
	#nav-hastelloy .grades-p{
		width: 16vw!important;
	}
	#nav-hastelloy .grades-a{
		width: 8vw!important;
	}
	#nav-hastelloy ul{
		width: 14vw!important;
	}


	#solutions-nav{
		position: absolute;
		left: 0;
		top: 4vw;
		width: 98vw;
		padding: 1vw 1vw 0 1vw;
		z-index: -1;
		display: flex;
		justify-content: center;
		pointer-events: none;
	}
	#solutions-nav > div::before{
		content: "";
		position: absolute;
		left: 0;
		bottom: -2vw;
		width: 100%;
		height: 3vw;
		border-radius: 0 0 1vw 1vw;
		pointer-events: none;
		background-color: #fff;
	}
	#solutions-nav > div::after{
		content: "";
		width: 0;
		height: 0;
		border: solid .8vw transparent;
		border-bottom: solid .8vw #32558e;
		margin: 0;
		position: absolute;
		left: calc(50% - .8vw); 
		transform: scale(0.7, 1);
		bottom: -.8vw;
		pointer-events: none;
	}
	#solutions-nav > div{
		background-color: white;
		width: 72vw;
		margin: .5vw .5vw 0 .5vw;
		padding: 2vw 9vw 1vw 9vw;
		border-radius: 1vw;
		box-shadow: 0vw 2vw 1vw #666;
		position: relative;
		transform: translate(0, -30vw);
		opacity: 0;
		transition: transform 0.5s, opacity 0.5s;
		display: flex;
		flex-wrap: wrap;
	}
	#solutions-nav > div:nth-of-type(1){
		transition-delay: .03s;
	}
	#solutions-nav h1{
		display: block;
		position: relative;
		width: 50vw;
		margin-bottom: 5vh;
		padding: 0;
		color: #333333;
		left: 25vw;
		font-size: 4vw;
		text-align: center;
	}
	#solutions-nav h1::after{
		content: "";
		height: 0.2vw;
		width: 42vw;
		position: relative;
		left: 4vw;
		background-color: #333333;
		display: block;
		transform: translate(0, 0vw) scale(0, 1);
		transition: transform 0.3s;
	}
	#solutions-nav h1:hover::after{
		transform: translate(0, 0vw) scale(1, 1);
	}
	#solutions-nav ul{
		position: relative;
		line-height: 2vw;
		font-weight: bold;
		list-style: none;
		margin: 1vw 2vw;
		padding: 0;
		width: 14vw;
	}
	.nav-content:hover #solutions-nav{
		pointer-events: inherit;
	}
	.nav-content:hover #solutions-nav > div{
		transform: translate(0, 0vw);
		opacity: 1;
	}
	.nav-solutionslogo{
		width: 2vw;
		height: 2vw;
		transform: translate(-0.6vw, 0.7vw);
	}
	.solutions-li{
		font-size: 0.9vw;
	}
	.solutions-a{
		text-decoration: none;
		color: #333333;
		font-size: 1.2vw;
		line-height: 0vw;
	}
	.solutions-a::after{
		content: "";
		height: 0.1vw;
		width: 3vw;
		background-color: #333333;
		display: block;
		transform: translate(2vw, -0.4vw) scale(0, 1);
		transition: transform 0.3s;
		transform-origin: 0 0;
	}
	.solutions-a:hover::after{
		transform: translate(2vw, -0.4vw) scale(1, 1);
	}


	#media-nav{
		position: absolute;
		left: 0;
		top: 4vw;
		width: 98vw;
		padding: 1vw 1vw 0 1vw;
		z-index: -1;
		display: flex;
		flex-wrap: wrap;
		justify-content: center;
		pointer-events: none;
	}
	#media-nav > div:nth-of-type(3){
		transition-delay: .03s;
	}
	#media-nav > div:nth-of-type(2){
		transition-delay: .06s;
	}
	#media-nav > div:nth-of-type(1){
		transition-delay: .09s;
	}
	.nav-content:hover #media-nav{
		pointer-events: inherit;
	}
	.nav-content:hover #media-nav > div{
		transform: translate(0, 0vw);
		opacity: 1;
	}
	.nav-content:hover #media-nav{
		transform: translate(0, 0vw);
		opacity: 1;
	}
	#media-nav > div::before{
		content: "";
		position: absolute;
		left: 0;
		bottom: -2vw;
		width: 100%;
		height: 3vw;
		border-radius: 0 0 1vw 1vw;
		pointer-events: none;
		background-color: #fff;
	}
	#media-nav > div::after{
		content: "";
		width: 0;
		height: 0;
		border: solid .8vw transparent;
		border-bottom: solid .8vw #32558e;
		margin: 0;
		position: absolute;
		left: calc(50% - .8vw); 
		transform: scale(0.7, 1);
		bottom: -.8vw;
		pointer-events: none;
	}
	#media-nav > div{
		background-color: white;
		width: 24vw;
		margin: .5vw .5vw 0 .5vw;
		padding: 1vw 3vw 0 3vw;
		border-radius: 1vw;
		box-shadow: 0vw 2vw 1vw #666;
		position: relative;
		transform: translate(0, -30vw);
		opacity: 0;
		transition: transform 0.5s, opacity 0.5s;
	}
	.media-nav-p{
		display: block;
		width: 24vw;
		font-size: 1.8vw;
		font-weight: bold;
		text-align: center;
		padding-bottom: 1vw;
	}
	#media-nav-p::after{
		content: "";
		height: 0.1vw;
		width: 24vw;
		background-color: #333333;
		display: block;
		transform: translate(0, 0vw) scale(1, 1);
		transition: transform 0.3s;
	}
	#media-nav-p:hover::after{
		transform: translate(0, 0vw) scale(1, 1);
	}
	#blog-ul > li{
		font-size: 1.2vw;
		display: block;
		width: 12vw;
		text-align: center;
	}
	#gallery-ul > li{
		font-size: 1.2vw;
		display: block;
		width: 8vw;
		text-align: center;
	}
	#tools-ul > li{
		font-size: 1.2vw;
		display: block;
		width: 12vw;
		text-align: center;
	}
	#tools-ul, #gallery-ul, #blog-ul{
		position: relative;
		line-height: 2vw;
		font-weight: bold;
		list-style: none;
		margin: 1vw 0;
		padding: 0;
		display: flex;
		flex-wrap: wrap;
		justify-content: flex-start;
	}
	#tools-ul > li > a, #gallery-ul > li > a, #blog-ul > li > a{
		text-decoration: none;
		color: #333333;
		font-size: 1.2vw;
		line-height: 0vw;
	}
	#tools-ul > li > a::after, #gallery-ul > li > a::after, #blog-ul > li > a::after{
		content: "";
		height: 0.1vw;
		width: 3vw;
		position: relative;
		left: 50%;
		background-color: #333333;
		display: block;
		transform: translate(-50%, -0.2vw) scale(0, 1);
		transition: transform 0.3s;
		transform-origin: 50%, 50%;
	}
	#tools-ul > li > a:hover::after, #gallery-ul > li > a:hover::after, #blog-ul > li > a:hover::after{
		transform: translate(-50%, -0.2vw) scale(1, 1);
	}

	.nav-cross{
		width: 100vw;
		height: 5vw;
		cursor: pointer;
		position: absolute;
		bottom: 0;
		transform: translate(0, 0);
		transition: transform 0.3s;
		padding-bottom: -10vh;
	}
	.nav-cross > img{
		width: 15vw;
		padding-left: 42.5vw;
	}
	.nav-cross:hover{	
		transform: translate(0, -1vh);
	}
	








	footer{
		overflow: hidden;
		position: relative;
		display: flex;
		flex-direction: column-reverse;
		z-index: 2;
		padding-bottom: 3.5vw;
	}
	#footer-contact{
		display: flex;
		flex-wrap: wrap;
		position: relative;
	    background-color: #333333;
	    justify-content: center;
	    align-items: center;
		padding: 6vw 0 4vw 0;
		overflow: hidden;
		height: 30vw;
	}
	#footer-contact::before{
		content: "";
		background-color: #555;
		width: 15vw;
		height: 100%;
		transform: translate(-9.7vw, 0) skew(-15deg);
		position: absolute;
		top: 0;
		left: 0vw;
	}
	#footer-contact::after{
		content: "";
		background-color: #555;
		width: 35vw;
		height: 100%;
		transform: translate(93.5vw, 0) skew(-15deg);
		position: absolute;
		top: 0;
		left: 0;
	}
	#footer-contact > h2{
		width: 100%;
		text-align: left;
		color: white;
		font-size: 3vw; 
		margin: 0;
		padding: 2vw 0;
		position: absolute;
		left: 19vw;
		top: 6vw;
	}
	#footer-contact > h2::before{
		content: "";
		display: block;
		width: .8vw;
		height: 3vw;
		background-color: #fff;
		transform: skew(-15deg);
		position: absolute;
		top: 2.3vw;
		left: -2vw;
	}
	#footer-contact-1{
		font-size: 2.2vw;
		font-weight: bold;
		color: #dddddd;
		width: 25vw;
		position: absolute;
		top: 16vw;
		left: 18vw;
		display: flex;
		flex-wrap: wrap;
		align-items: center;
	}
	#footer-contact-1 > .copy-button{
		margin: 0;
	}
	#footer-contact-1 > .copy-text{
		color: #fff;
	}
	#footer-contact-2{
		font-size: 2.2vw;
		font-weight: bold;
		color: #dddddd;
		width: 25vw;
		position: absolute;
		top: 24vw;
		left: 18vw;
	}
	#footer-contact-3{
		font-size: 2.2vw;
		font-weight: bold;
		color: #dddddd;
		width: 25vw;
		position: absolute;
		top: 29vw;
		left: 18vw;
	}
	#footer-contact-4{
		font-size: 2.2vw;
		font-weight: bold;
		color: #dddddd;
		width: 35vw;
		position: absolute;
		top: 8vw;
		left: 49vw;
	}
	#footer-contact p{
		text-align: left;
		margin: 0;
		color: #dddddd;
		width: 25vw;
	}
	.footer-label{
		display: block;
		font-size: 1.5vw;
	}
	.footer-form-1{
		margin-bottom: 2vw;
	}
	.footer-form-2{
		margin-bottom: 1vw;
	}
	.footer-form-1 input{
		display: block;
		width: 30vw;
		background-color: #333333;
		border: none;
		border-bottom: solid 0.15vw #dddddd;
		font-size: 1.2vw;
		color: white;
		margin: 0.5vw 0;
		border-radius: 0;
	}
	.footer-form-1 input:focus{
		border-bottom: solid 0.15vw white;
	}
	.footer-form-2 textarea{
		display: block;
		width: 30vw;
		background-color: #333333;
		border: none;
		border-bottom: solid 0.15vw #dddddd;
		font-size: 1.2vw;
		color: white;
		margin: 0.5vw 0;
		height: 8vw;
		border-radius: 0;
	}
	.footer-form-2 textarea:focus{
		border-bottom: solid 0.15vw white;
	}
	#footer-form{
		padding-left: 2vw;
	} 
	#footer-submit{
		width: 10vw;
		height: 2.5vw;
		border: none;
		background-color: #dddddd;
		border-radius: 2vw;
		cursor: pointer;
		font-weight: bold;
		color: #333333;
		font-size: 1.5vw;
		transition: background-color 0.3s;
	} 
	#footer-submit:hover{	
		background-color: white;
	}
	#footer-submit-form{
		display: flex;
	}
	#errorMessage3{
		display: block;
		padding-left: 2vw;
		font-size: 1.2vw;
		line-height: 2.5vw;
		color: #eee;
		width: 20vw;
	}
	
	
	
	
	#footer-footer{
		width: 100%;
		height: calc(100vh - 6vw);
		display: flex;
		flex-direction: column;
		justify-content: center;
		align-items: center;
		position: relative;
		top: 0;
		overflow: hidden;
	}	
	#footer-footer::before{
		content: "";
		background-color: #eee;
		width: 35vw;
		height: 100vh;
		transform: translate(-20.1vw, 0) skew(-15deg);
		position: absolute;
		top: 0;
		left: 6vw;
		z-index: -1;
	}
	#footer-footer::after{
		content: "";
		background-color: #eee;
		width: 35vw;
		height: 100vh;
		transform: translate(-20.2vw, 0) skew(-15deg);
		position: absolute;
		top: 0;
		left: 100vw;
		z-index: -1;
	}
	#footer-main{
		display: flex;
		flex-direction: column;
		justify-content: center;
		align-items: center;
	}
	#footer-logo{
		width: 14vw;
		transform: translate(-.5vw, 0);
	}
	#footer-title{
		width: 25vw;
		text-align: center;
		color: #333333;
		font-size: 5vw;
		line-height: 6vw;
	}
	#footer-slogan{
		width: 50vw;
		text-align: center;
		color: #333333;
		font-weight: bold;
		font-size: 3vw;
		margin: 0;
		position: relative;
		top: -.5vw;
	}
	#blacklogo{
		display: flex;
	}
	#blacklogo > a{
		width: 3.8vw;
		height: 3.8vw;
		margin: 1vw;
		transition: transform .2s;
		transform-origin: center;
		transform: scale(1);
	}
	#blacklogo > a > img{
		width: 3.8vw;
		height: 3.8vw;
	}
	#blacklogo > a:hover::before, #blacklogo > a:hover::after{
		opacity: 1;
	}
	#blacklogo > a::before{
		content: attr(data-name);
		position: absolute;
		text-align: center;
		color: #333;
		font-size: 1.5vw;
		line-height: 3vw;
		font-weight: bold;
		width: 6vw;
		height: 3vw;
		background-color: #eee;
		left: -1.1vw;
		top: 5.5vw;
		border-radius: 1vw;
		opacity: 0;
		transition: opacity .2s;
	}
	#blacklogo > a::after{
		content: "";
		position: absolute;
		width: 0vw;
		height: 0vw;
		border-bottom: solid 1vw #eee!important;
		border: solid 1vw transparent;
		left: 0.9vw;
		top: 4vw;
		opacity: 0;
		transition: opacity .2s;
	}
	
	
	
	#blacklogo img{
		width: 3.5vw;
	}
	
	
	#footer-social{
		position: absolute;
		left: 2vw;
		bottom: 3vh;
		display: flex;
		flex-direction: column-reverse;
		align-items: center;
		width: 5vw;
	}
	#facebooklogo{
		width: 2vw;
		margin: 1vw;
	}
	#twitterlogo{
		width: 2.2vw;
		margin: 1vw;
		padding-top: 0.1vw;
	}
	#youtubelogo{
		width: 2.4vw;
		margin: 1vw;
		padding-top: 0.2vw;
	}
	#redditlogo{
		width: 2.1vw;
		margin: 1vw;
		padding-top: -0.05vw;
	}
	#linkedinlogo{
		width: 2vw;
		margin: 1vw;
	}
	#footer-disclaimer{
		position: absolute;
		left: 25vw;
		bottom: calc(2vh + 2vw);	
		width: 50vw;
		display: flex;
		justify-content: center;
	}
	.disf{
		margin: 0 1vw;
		color: #333333;
		font-weight: bold;
		font-size: 1.3vw;
	}
	#footer-copyright{
		position: absolute;
		left: 25vw;
		bottom: 2vh;	
		width: 50vw;
		font-size: 1.2vw;
		text-align: center;
	}
	#footer-copyright p{
		width: 50vw;
		font-size: 1.2vw;
		text-align: center;
	}
	#arrowup::after{
		content: "";
		display: block;
		width: 0;
		height: 0;
		border: solid 1vw transparent;
		border-bottom: solid 1vw white;
		margin: 0;
		position: absolute;
		left: 0.75vw; 
		transform: scale(0.7, 1);
		top: 0.1vw;
	}
	#arrowup{
		width: 3.5vw;
		height: 3.5vw;
		background-color: #333333;
		position: absolute;
		right: 2.25vw;
		bottom: 3vw;
		border-radius: 5vw;
		cursor: pointer;
		box-shadow: 0.6vw 0.6vw 1.8vw #333333;
		transition: transform 0.3s ease-out, box-shadow 0.3s ease-out;
	}
	#arrowup:hover{
		transform: scale(1.1, 1.1);
		box-shadow: 0.6vw 0.6vw 2.4vw #333333;
	}
	
	#calc-logo{
		width: 3.5vw;
		height: 3.5vw;
		background-color: #333333;
		background-image: url(../image/calc.svg);
		position: absolute;
		right: 6.7vw;
		bottom: 3vh;
		border-radius: 5vw;
		cursor: pointer;
		box-shadow: 0.6vw 0.6vw 1.8vw #333333;
		transition: transform 0.3s ease-out, box-shadow 0.3s ease-out;
		background-size: 60%;
		background-repeat: no-repeat;
		background-position: center;
	}
	#calc-logo:hover{
		transform: scale(1.1, 1.1);
		box-shadow: 0.6vw 0.6vw 2.4vw #333333;
	}
	
	
	
	
	.link{
		font-weight: bold;
		color: #32558e;
		text-decoration: underline;
		opacity: .8;
		transition: opacity .2s;
	}
	.link:hover{
		opacity: 1;
		text-decoration: none;
	}
	
	
	
	
	
	
	
	.dot{
		width: 0.5vw;
		height: 0.5vw;
		border-radius: 1vw;
		background-color: #333333;
		transform: translate(0, 0.55vw);
	}





	#floatbutton{
		width: 3.5vw;
		height: 3.5vw;
		background: linear-gradient(105deg, #8653ea 0%, #7053ea 20%, #535aea 40%, #5385ea 60%, #4fabde 80%, #50aadc 100%);
		position: fixed;
		right: 2.2vw;
		bottom: 2.2vw;
		border-radius: 5vw;
		cursor: pointer;
		box-shadow: 0.6vw 0.6vw 1.8vw #333333;
		transition: transform 0.3s ease-out, box-shadow 0.3s ease-out;
		z-index: 50;
	}
	#floatbutton:hover{
		transform: scale(1.1, 1.1);
		box-shadow: 0.6vw 0.6vw 2.4vw #333333;
	}
	#floatlogo{
		position: absolute;
		left: 0.25vw;
		top: 0.25vw;
		width: 3vw;
		height: auto;
		cursor: pointer;
	}
	#floatcontact{
		flex-direction: column-reverse;
		display: flex;
		justify-content: center;
		position: fixed;
		left: 0;
		bottom: 0;
		width: 60vw;
		height: 100vh;
		transition: transform 0.6s, opacity 0.6s;
		background-color: white;
		transform-origin: 95vw 85vh;
		z-index: 201;
	}
	#floatcontact::before{
		content: "";
		height: 100vh;
		width: 60vw;
		background-color: #fff;
		position: absolute;
		top: 0;
		left: 0vw;
		transform: skew(-15deg);
		z-index: -1;
	}
	#floatcontact::after{
		content: "GET A QUOTE NOW";
		background-color: rgba(25, 25, 25, 0.9);
		padding: 6vh 0;
		padding-right: 30vw;
		height: 100vh;
		font-size: 20vh;
		line-height: 22vh;
		font-weight: bold;
		width: 30vh;
		position: absolute;
		color: #fff;
		top: 0;
		left: 59vw;
		transform: skew(-15deg);
		z-index: -1;
	}
	.floatcontact1{
		transform: translate(-110%, 0);
		opacity: 0;
		pointer-events: none;
	}
	.floatcontact2{
		transform: translate(0, 0);
		opacity: 1;
		pointer-events: inherit;
	}
	#floatcross{
		position: absolute;
		right: -36.75vw;
		bottom: 2.5vw;
		border-radius: 3vw;
		width: 3vw;
		height: 3vw;
		cursor: pointer;
		display: block;
		background: linear-gradient(105deg, #8653ea 0%, #7053ea 20%, #535aea 40%, #5385ea 60%, #4fabde 80%, #50aadc 100%);
	    transform: rotate(45deg);
	}
	#floatcross::before{
		content: "";
		width: 2vw;
		height: .5vw;
		background-color: #fff;
		position: absolute;
		left: .5vw;
		top: 1.25vw;
	}
	#floatcross::after{
		content: "";
		height: 2vw;
		width: .5vw;
		background-color: #fff;
		position: absolute;
		top: .5vw;
		left: 1.25vw;
	}
	.contactslogo{
		width: 2.3vw;
	}
	.contact-div{
		margin-left: 1vw;
	}
	#floatinformation{
		font-weight: bold;
		color: #333333;
		font-size: 2vw;
		justify-content: center;
		margin-bottom: 3vh;
		padding-left: 8vw;
	}
	#floatinformation li{
		margin-top: 3vh!important;
		margin-bottom: 3vh!important;
		line-height: 0px!important;
		margin: 0;
		display: flex;
		align-items: center;
	}
	.copy-button{
		width: 8vw;
		height: 2.3vw;
		border-radius: 2.3vw;
		margin-left: 1vw;
		display: flex;
		justify-content: center;
		align-items: center;
		cursor: pointer;
		transition: transform .2s;
	    background: linear-gradient(105deg, #535aea 0%, #5385ea 50%, #4fabde 100%);
	}
	.copy-button:hover{
		transform: scale(1.1);
	}
	.copy-button:active{
		transform: scale(1);
	}
	.copy-button::before{
		content: "";
		width: .5vw;
		height: .8vw;
		border-radius: .2vw;
		border: solid .2vw #fff;
		box-shadow: .25vw .25vw 0 0 #fff;
		transform: translate(0, -.125vw);
	}
	.copy-button::after{
		content: "COPY";
		font-size: 1.35vw;
		font-weight: bold;
		color: #fff;
		margin-left: .8vw;
	}
	.copy-text{
		color: #32558e;
		font-size: 1.3vw;
		line-height: 3.5vw;
		padding-left: 1vw;
		opacity: 0;
		font-weight: bold;
		pointer-events: none;
		transition: all .2s;
	}
	#input-copy{
		position: fixed;
		top: 0;
		left: 0;
		opacity: 0;
		pointer-events: none;
	}
	#floatform{
		width: 45vw;
		padding-left: 7vw;
		display: flex;
		flex-wrap: wrap;
	}
	.short-input{
		width: 20vw;
		margin: 1.5vw 1vw;
	}
	.long-input{
		width: 42vw;
		margin: 1.5vw 1vw;
	}
	.form1{
	    border-color: #666666;
	    outline: none;
	    border-style: solid;
	    border-bottom-width: 0.15vw;
	    border-top-width: 0vw;
	    border-left-width: 0vw;
	    border-right-width: 0vw;
	    font-size: 1.1vw;
		line-height: 0;
		padding: 0.2vh 0;
		margin: 0;
		width: 20vw;
		margin-top: 1.5vw;
		display: block;
		border-radius: 0;
	}
	.form1:focus{
	    border-color: #32558e;
	    color: #32558e;
	}
	.form2:focus{
	    border-color: #32558e;
	    color: #32558e;
	}
	.form2{
		border-bottom: solid 0.15vw #666666;
		border-top: none;
		border-left: none;
		border-right: none;
	    outline: none;
	    width: 42vw;
	    font-size: 1.1vw;
	    height: 15vh;
		background-color: transparent;
		z-index: 1;
	    margin-top: 2.5vh;
	    font: 0; 
		display: block;
		border-radius: 0;
	}
	.label{
		font-size: 2vw;
		line-height: 0;
		text-align: left;
		display: block;
		position: relative;
		color: #666666;
		font-weight: bold;
	}
	#submit2{
	    font-weight: bold;
		font-size: 1.8vw;
	    text-align: center;
	    background: linear-gradient(105deg, #535aea 0%, #5385ea 50%, #4fabde 100%);
	    color: white;
	    box-shadow: 0.5vw 0.5vw 1vw #666666;
	    border-radius: 10vw;
	    cursor: pointer;
	    width: 15vw;
	    height: 3.5vw;
	    border-style: none;
		line-height: 3.5vw;
	}
	#aside-submit{
		display: flex;
		margin: 1vw;
	}
	#errorMessage2{
		color: #e83719;
		font-size: 1.3vw;
		line-height: 3.5vw;
		padding-left: 2vw;
	}

	#calc-page{
		width: 100vw;
		height: 100vh;
		display: flex;
		justify-content: center;
		position: fixed;
		top: 0vw;
		left: 0vw;
		z-index: 150;
		background-color: rgba(230, 230, 230, .9);
		transform: translate(0, 100vh);
		pointer-events: none;
		transition: transform .5s;
		background-image: url(../image/calc.jpg);
		background-size: cover;
	    box-shadow: 0 1vw 3vw #666;
	}
	#calc-page > iframe{
		width: 158vh;
		height: 100vh;
		margin: 0;
		border: none;
		box-shadow: none;
		opacity: 1;
		pointer-events: inherit;
		transition: opacity .3s
	}
	#calc-page > iframe::-webkit-scrollbar{
		background-color: transparent;
	}
	#close{
		position: absolute;
		right: 3.5vw;
		bottom: 3.5vh;
		border-radius: 3vw;
		width: 3vw;
		height: 3vw;
		cursor: pointer;
		display: block;
		background: linear-gradient(105deg, #8653ea 0%, #7053ea 20%, #535aea 40%, #5385ea 60%, #4fabde 80%, #50aadc 100%);
	    transform: rotate(45deg);
	}
	#close::before{
		content: "";
		width: 2vw;
		height: .5vw;
		background-color: #fff;
		position: absolute;
		left: .5vw;
		top: 1.25vw;
	}
	#close::after{
		content: "";
		height: 2vw;
		width: .5vw;
		background-color: #fff;
		position: absolute;
		top: .5vw;
		left: 1.25vw;
	}

	#wind{
		width: 100vw;
		height: 100vh;
		position: absolute;
		left: 0;
		top: 0;
		display: flex;
		justify-content: center;
		align-items: center;
		opacity: 0;
		pointer-events: none;
		transition: opacity .3s;
		z-index: 2;
	}

	#quote, #advise, #close-close{
		width: 20vw;
		height: 3vw;
		border-radius: 4vw;
		margin: 1vw;
		font-size: 1.5vw;
		text-align: center;
		position: relative;
		line-height: 3vw;
		font-weight: bold;
		user-select: none;
		background: linear-gradient(105deg, #8653ea 0%, #7053ea 20%, #535aea 40%, #5385ea 60%, #4fabde 80%, #50aadc 100%);
	}
	#quote{
		color: #fff;
	}
	#close-close{
		color: #fff;
		background: #666;
	}
	#advise::before{
		content: "Give Us Some Advices";		
		width: 19.6vw;
		height: 2.6vw;
		position: absolute;
		font-size: 1.5vw;
		text-align: center;
		line-height: 2.6vw;
		left: .2vw;
		top: .2vw;
		background-color: #eee;
		border-radius: 4vw;
		z-index: 0;
	}

	#loading-circle{
		width: 100vw;
		height: 100vh;
		background-color: #eee;
		position: absolute;
		left: 0;
		top: 0;
		z-index: 5;
		pointer-events: none;
		opacity: 0;
		transition: opacity .2s;
	}
	#loading-circle > div{
		width: 6vw;
		height: 6vw;
		border-radius: 8vw;
		position: absolute;
		left: 47vw;
		top: calc(50vh - 3vw);
		animation: ro 1s infinite linear;
		background: linear-gradient(105deg, #8653ea 0%, #7053ea 20%, #535aea 40%, #5385ea 60%, #4fabde 80%, #50aadc 100%);
	}
	#loading-circle > div::after{
		content: "";
		width: 4vw;
		height: 4vw;
		border-radius: 8vw;
		position: absolute;
		left: 1vw;
		top: 1vw;
		background: #eee;
	}
	#loading-circle::before{
		content: "";
		background-color: #fff;
		width: 35vw;
		height: 100vh;
		transform: translate(-20.1vw, 0) skew(-15deg);
		position: absolute;
		top: 0;
		left: 6vw;
		z-index: -1;
	}
	#loading-circle::after{
		content: "";
		background-color: #fff;
		width: 35vw;
		height: 100vh;
		transform: translate(-20.2vw, 0) skew(-15deg);
		position: absolute;
		top: 0;
		left: 100vw;
		z-index: -1;
	}
	@keyframes ro{
		0%{transform: rotate(0deg);}
		100%{transform: rotate(360deg);}
	}
	@keyframes send-data{
		0%{transform: scale(1); opacity: 0;}
		20%{transform: scale(1); opacity: 0;}
		25%{transform: scale(.95); opacity: 1;}
		30%{transform: scale(1.1); opacity: 1;}
		50%{transform: scale(1); opacity: 1;}
		70%{transform: scale(1); opacity: 1;}
		75%{transform: scale(.95); opacity: 1;}
		80%{transform: scale(1.1); opacity: 1;}
		100%{transform: scale(1); opacity: 1;}
	}

	#send-data{
		width: 25vw;
		height: 9vw;
		background: linear-gradient(105deg, #8653ea 0%, #7053ea 20%, #535aea 40%, #5385ea 60%, #4fabde 80%, #50aadc 100%);
		box-shadow: 0.5vw 0.5vw 2vw #666;
		position: absolute;
		left: 0;
		top: 5vw;
		display: flex;
		justify-content: center;
		align-items: center;
		border-radius: 1.5vw;
		animation: send-data 5s backwards;
		animation-delay: 2s;
		transition: all .5s;
	}
	.send-data{
		display: none;
	}
	#send-data::after{
		content: "";
		width: 24vw;
		height: 8vw;
		background-color: #fff;
		position: absolute;
		left: .5vw;
		top: .5vw;
		border-radius: 1vw;
	}
	#send-data > div{
		width: 20vw;
		font-weight: bold;
		font-size: 1.3vw;
		line-height: 1.8vw;
		text-align: center;
		color: #666;
		position: relative;
		z-index: 1;	
	}
	.blue{
		color: #32558e;
		font-size: 1.5vw;
	}

	#tariff{
		width: 100vw;
		height: 3.5vw;
		display: flex;
		align-items: center;
		position: fixed;
		left: 0;
		bottom: 0;
		z-index: 49;
		background: linear-gradient(105deg, #8653ea 0%, #7053ea 20%, #535aea 40%, #5385ea 60%, #4fabde 80%, #50aadc 100%);
	}
	#tariff-head{
		width: 18.5vw;
		display: flex;
		align-items: center;
		padding: 0 .8vw;
	}
	#tariff-head > img{
		width: 3.8vw;
		border-radius: .5vw;
		margin-right: .8vw;
	}
	#tariff-head > p{
		font-size: 1.5vw;
		color: #fff;
		font-weight: bold;
	}
	#tariff-body{
		width: 79vw;
		overflow: hidden;
	}
	@keyframes tariff{
		0% {transform: translate(100%, 0);}
		100% {transform: translate(-150%, 0);}
	}
	#tariff-body > p{
		white-space: nowrap;
		font-size: 1.2vw;
		color: #fff;
		animation: tariff backwards infinite linear 20s;
	}
}





















@media screen and (max-width: 600px) {
	@font-face {
		font-family: 'Calibri2';
		src: url('/AEETHER/Calibri.woff2') format('woff2');
		font-display: optional;
	}
	@font-face {
		font-family: 'Calibri2';
		src: url('/AEETHER/Calibri-Bold.woff2') format('woff2');
		font-display: optional;
		font-weight: bold;
	}
	.click-event > img, .click-event > p{
		pointer-events: none;
	}
	.reference{
		background-color: #eee;
		height: 2vw;
		padding: 0 2.2vw 0 .8vw;
		border-radius: 2vw;
		position: relative;
		display: inline-block;
		border: solid .2vw #fff;
	}
	.reference::after{
		content: "?";
		width: 1.6vw;
		height: 1.6vw;
		background-color: #fff;
		font-size: 1vw;
		font-weight: bold;
		line-height: 1.6vw;
		text-align: center;
		position: absolute;
		right: .2vw;
		top: .2vw;
		border-radius: 1.6vw;
		color: #999;
	}
	body{
		width: 100vw;
		overflow-x: hidden;
	}
	html,body{
		padding: 0;
		margin: 0;
		font-family: Calibri, Calibri2, Arial;
	}
	input, textarea{
    	outline: none;
    	font-family: Calibri, Calibri2, Arial;
    	-webkit-appearance: none;
    	padding: 0;
    }
	ul{
		list-style-type:none;
		padding: 0;
		margin: 0;
	}
	h1, h2, h3, p{
		margin: 0;
	}
	a{
		text-decoration: none;
		color: #333333;
	}
	label{
		cursor: pointer;
	}
	::selection{
		background-color: rgba(50, 85, 142, 0.8);
		color: white;
	}
	header{
		width: 100vw;
		height: 12vw;
		background-color: #fff;
		box-shadow: 0 -5vw 15vw 0vw #333333;
		position: fixed;
		z-index: 100;
	}
	
	.down-word{
		font-size: 1vw;
		vertical-align: sub;
	}
	.up-word{
		font-size: 1vw;
		vertical-align: super;
	}
	#nav-btn{
		width: 12vw;
		height: 12vw;
		position: absolute;
		top: 0;
		right: 2vw;
	}
	#nav-btn::before{
		content: "";
		position: absolute;
		left: 2vw;
		top: 4vw;
		width: 8vw;
		height: 1.5vw;
		background-color: #333;
		border-radius: 2vw;
		box-shadow: 0 2.5vw 0 0 #333;
	}
	.header-content{
		display: none;
	}
	#header-content{
		position: absolute;
		left: 0;
		top: 0;
		padding: 1vw 3vw;
	}
	#header-content > a{		
		display: flex;
		align-items: center;
		width: 10vw;
		height: 10vw;
	}
	#header-content > a > img{
		width: 10vw;
		height: 10vw;
	}
	#header-content > a > h1{
		font-size: 7vw;
		padding-left: 2vw;
	}
	nav{
		display: flex;
		flex-direction: column;
		justify-content: center;
		align-items: center;
		align-content: center;
		position: fixed;
		top: 0;
		left: 0;
		width: 100vw;
		height: 100vh;
		background-color: #fff;
		z-index: 80;
		transition: all .3s;
	}
	.nav-1{
		opacity: 0;
		pointer-events: none;		
	}
	.nav-2{
		opacity: .95;
		pointer-events: inherit;		
	}
	.nav-content{
		width: 100vw;
	}
	.nav-content > a{
		height: 15vw;
		width: 100vw;
		display: block;
		text-align: center;
		font-size: 6vw;
		line-height: 15vw;
		color: #333333;
		text-decoration: none;
		font-weight: bold;
		transition: all 0.3s;
		background-color: white;
	}
	.nav-title{
		background: linear-gradient(105deg, #fff 2vw, #fff 0, #fff 90%, #fff 2vw);
	}
	.nav-content p{
		position: relative;
		display: block;
		margin: 0;
		top: 1.1vw;
	}
	.nav-content-2{
		width: 100vw;
	}
	.nav-content-2 > a{
		height: 15vw;
		width: 100vw;
		display: block;
		text-align: center;
		font-size: 6vw;
		line-height: 15vw;
		color: #333333;
		text-decoration: none;
		font-weight: bold;
		transition: all 0.3s;
		background-color: white;
	}
	.nav-content-2 p{
		position: relative;
		display: block;
		margin: 0;
		top: 1.1vw;
	}
	#nav-content{
		width: 10%;
		background-color: white;
	}
	#nav-content img{
		width: 3.6vw;
		position: relative;
		left: 50%;
		transform: translate(-55%, 0);
		position: fixed;
		top: 0.7vw;
	}


	.nav-arrow, #products-nav, #grades-nav, #solutions-nav, #media-nav{
		display: none;
	}
	








	footer{
		transition: all 0.3s;
		overflow: hidden;
		position: relative;
		display: flex;
		flex-direction: column-reverse;
		z-index: 0;
	}
	#footer-contact{
		position: relative;
	    background-color: #333333;
		padding: 10vw 0 0 0;
		width: 100vw;
		overflow: hidden;
	}
	#footer-contact::before{
		content: "";
		background-color: #555;
		width: 40vw;
		height: 100%;
		transform: translate(-9.7vw, 0) skew(-15deg);
		position: absolute;
		top: 0;
		left: -20vw;
	}
	#footer-contact::after{
		content: "";
		background-color: #555;
		width: 35vw;
		height: 100%;
		transform: translate(93.5vw, 0) skew(-15deg);
		position: absolute;
		top: 0;
		left: 0;
	}
	#footer-contact > h2{
		width: 100vw;
		text-align: left;
		color: white;
		font-size: 9vw; 
		margin: 0;
		padding: 9vw 0 6vw 0;
		left: 16vw;
		position: relative;
	}
	#footer-contact > h2::before{
		content: "";
		display: block;
		width: 2.4vw;
		height: 9vw;
		background-color: #fff;
		transform: skew(-15deg);
		position: absolute;
		top: 9.9vw;
		left: -6vw;
	}
	#footer-contact-1{
		font-size: 6vw;
		font-weight: bold;
		color: #dddddd;
		width: 80vw;
		position: relative;
		padding: 2vw 10vw;
	}
	#footer-contact-2{
		font-size: 6vw;
		font-weight: bold;
		color: #dddddd;
		width: 80vw;
		position: relative;
		padding: 2vw 10vw;
	}
	#footer-contact-3{
		font-size: 6vw;
		font-weight: bold;
		color: #dddddd;
		width: 80vw;
		position: relative;
		padding: 2vw 10vw;
	}
	#footer-contact-4{
		font-size: 2.2vw;
		font-weight: bold;
		position: relative;
		color: #dddddd;
		width: 80vw;
		padding: 10vw;
		z-index: 1;
	}
	#footer-contact p{
		color: #dddddd;
	}
	.footer-label{
		display: block;
		font-size: 4.5vw;
	}
	.footer-form-1{
		margin-bottom: 2vw;
	}
	.footer-form-2{
		margin-bottom: 1vw;
	}
	.footer-form-1 input{
		display: block;
		width: 80vw;
		border-radius: 0;
		background-color: transparent;
		border: none;
		border-bottom: solid 0.45vw #dddddd;
		font-size: 4.5vw;
		color: white;
		margin: 1.5vw 0;
	}
	.footer-form-1 input:focus{
		border-bottom: solid 0.45vw white;
	}
	.footer-form-2 textarea{
		display: block;
		width: 80vw;
		background-color: transparent;
		border: none;
		border-bottom: solid 0.45vw #dddddd;
		font-size: 4.5vw;
		color: white;
		margin: 1.5vw 0;
		height: 35vw;
		border-radius: 0;
	}
	.footer-form-2 textarea:focus{
		border-bottom: solid 0.45vw white;
	}
	#footer-submit{
		width: 50vw;
		height: 10vw;
		border: none;
		background-color: #dddddd;
		cursor: pointer;
		font-weight: bold;
		color: #333333;
		font-size: 5vw;
		transition: all 0.3s;
		border-radius: 10vw;
		margin: 5vw 0;
	} 
	#footer-submit:hover{	
		background-color: white;
	}
	#errorMessage3{
		display: block;
		padding-left: 1vw;
		font-size: 3.6vw;
		line-height: 7.5vw;
		color: #eee;
		width: 60vw;
	}
	
	
	
	
	#footer-footer{
		width: 100vw;
		height: calc(100vh + 12vw);
		display: flex;
		flex-direction: column;
		justify-content: center;
		align-items: center;
		position: relative;
		top: 0;
		overflow: hidden;
		background-color: #fff;
	}	
	#footer-footer::before{
		content: "";
		background-color: #eee;
		width: 35vw;
		height: 100vh;
		transform: translate(-20.1vw, 0) skew(-15deg);
		position: absolute;
		top: 0;
		left: -20vw;
	}
	#footer-footer::after{
		content: "";
		background-color: #eee;
		width: 35vw;
		height: 100vh;
		transform: translate(-20.2vw, 0) skew(-15deg);
		position: absolute;
		top: 0;
		left: 120vw;
	}
	#footer-main{
		display: flex;
		flex-direction: column;
		justify-content: center;
		align-items: center;
	}
	#footer-logo{
		width: 35vw;
		transform: translate(-1.25vw, 0);
	}
	#footer-title{
		width: 80vw;
		text-align: center;
		color: #333333;
		font-size: 12.5vw;
		line-height: 15vw;
	}
	#footer-slogan{
		width: 80vw;
		text-align: center;
		color: #333333;
		font-weight: bold;
		font-size: 7.5vw;
		margin: 0;
		position: relative;
		top: -1.5vw;
	}
	#blacklogo{
		display: flex;
		flex-wrap: wrap;
		justify-content: center;
		width: 80vw;
		padding-top: 2vw;
		z-index: 1;
	}
	#blacklogo > a{
		margin: 2vw;
		width: 12vw;
		height: 12vw;
	}
	
	
	
	#blacklogo img{
		width: 12vw;
		height: 12vw;
		margin: 0;
	}
	
	
	#footer-social{
		position: absolute;
		top: 10vw;
		display: flex;
		justify-content: center;
		align-items: center;
		width: 100vw;
		z-index: 1;
	}
	#facebooklogo{
		width: 7.2vw;
		margin: 4.5vw;
	}
	#twitterlogo{
		width: 7.92vw;
		margin: 4.5vw;
		padding-top: 0.3vw;
	}
	#youtubelogo{
		width: 8.64vw;
		margin: 4.5vw;
		padding-top: 0.6vw;
	}
	#redditlogo{
		width: 7.56vw;
		margin: 4.5vw;
		padding-top: -0.15vw;
	}
	#linkedinlogo{
		width: 7.2vw;
		margin: 4.5vw;
	}
	#footer-disclaimer{
		position: absolute;
		left: 10vw;
		top: 6vw;	
		width: 80vw;
		display: flex;
		justify-content: center;
	}
	.disf{
		margin: 0 3vw;
		color: #333333;
		font-weight: bold;
		font-size: 3.6vw;
	}	
	.dot{
		width: 1.5vw;
		height: 1.5vw;
		border-radius: 1.5vw;
		background-color: #333333;
		transform: translate(0, 1.65vw);
	}
	#footer-copyright{
		position: absolute;
		left: 20vw;
		bottom: 2vh;	
		width: 60vw;
		font-size: 3.6vw;
		text-align: center;
		z-index: 1;
	}
	#footer-copyright p{
		width: 60vw;
		font-size: 3.6vw;
		text-align: center;
	}
	#arrowup::after{
		content: "";
		display: block;
		width: 0;
		height: 0;
		border: solid 3vw transparent;
		border-bottom: solid 3vw white;
		margin: 0;
		position: absolute;
		left: 2.25vw; 
		transform: scale(0.7, 1);
		top: 0.3vw;
	}
	#arrowup{
		width: 10.5vw;
		height: 10.5vw;
		background-color: #333333;
		position: absolute;
		right: 5vw;
		bottom: calc(2.5vh + 13vw);
		border-radius: 15vw;
		cursor: pointer;
		box-shadow: 1.8vw 1.8vw 5.4vw #333333;
		-moz-box-shadow: 1.8vw 1.8vw 5.4vw #333333;
		transition: all 0.3s ease-out;
		-webkit-transition: all 0.3s ease-out;
		-o-transition: all 0.3s ease-out;
		-moz-transition: all 0.3s ease-out;
		z-index: 1;
	}
	
	
	
	
	.link{
		font-weight: bold;
		color: #32558e;
		text-decoration: underline;
	}
	.link:hover{
		opacity: 1!important;
		text-decoration: none;
	}






	#floatbutton{
		width: 10.5vw;
		height: 10.5vw;
		background: linear-gradient(105deg, #8653ea 0%, #7053ea 20%, #535aea 40%, #5385ea 60%, #4fabde 80%, #50aadc 100%);
		position: fixed;
		right: 5vw;
		bottom: 2.5vh;
		border-radius: 15vw;
		cursor: pointer;
		box-shadow: 1.8vw 1.8vw 5.4vw #333333;
		-moz-box-shadow: 1.8vw 1.8vw 5.4vw #333333;
		transition: all 0.3s ease-out;
		-webkit-transition: all 0.3s ease-out;
		-o-transition: all 0.3s ease-out;
		-moz-transition: all 0.3s ease-out;
		z-index: 50;
	}
	#floatlogo{
		position: absolute;
		left: 0.75vw;
		top: 0.75vw;
		width: 9vw;
		height: auto;
		cursor: pointer;
	}
	#floatcontact{
		flex-direction: column-reverse;
		display: flex;
		justify-content: center;
		position: fixed;
		left: 0;
		bottom: 0;
		width: 100vw;
		height: 100vh;
		transition: all 0.6s;
		background-color: #fff;
		transform-origin: 95vw 85vh;
		z-index: 201;
	}
	.floatcontact1{
		transform: translate(-100vw, 0);
		pointer-events: none;
		opacity: 0;
	}
	.floatcontact2{
		transform: translate(0, 0);
		pointer-events: inherit;
		opacity: 1;
	}
	#floatcross{
		position: absolute;
		left: 85vw;
		bottom: 6.5vw;
		border-radius: 9vw;
		width: 9vw;
		height: 9vw;
		cursor: pointer;
		display: block;
		background: linear-gradient(105deg, #8653ea 0%, #7053ea 20%, #535aea 40%, #5385ea 60%, #4fabde 80%, #50aadc 100%);
	    transform: rotate(45deg);
	}
	#floatcross::before{
		content: "";
		width: 6vw;
		height: 1.5vw;
		background-color: #fff;
		position: absolute;
		left: 1.5vw;
		top: 3.75vw;
	}
	#floatcross::after{
		content: "";
		height: 6vw;
		width: 1.5vw;
		background-color: #fff;
		position: absolute;
		top: 1.5vw;
		left: 3.75vw;
	}
	.contactslogo{
		width: 6.9vw;
	}
	.contact-div{
		margin-left: 3vw;
		width: 80vw;
		height: 6vw;
		line-height: 6vw;
	}
	#floatinformation{
		font-weight: bold;
		color: #333333;
		font-size: 6vw;
		justify-content: center;
		margin: 10vh 0 3vh 0;
		padding-left: 10vw;
	}
	#floatinformation li{
		margin-top: 1.5vh!important;
		margin-bottom: 1.5vh!important;
		line-height: 0px!important;
		margin: 0;
		width: 100vw;
		display: flex;
		align-items: center;
		flex-wrap: wrap;
	}
	#footer-contact-1{
		display: flex;
		flex-wrap: wrap;
		align-items: center;
	}
	.copy-button{
		width: 24vw;
		height: 6.9vw;
		border-radius: 6.9vw;
		margin: 3vw 0;
		display: flex;
		justify-content: center;
		align-items: center;
		cursor: pointer;
		transition: transform .2s;
	    background: linear-gradient(105deg, #535aea 0%, #5385ea 50%, #4fabde 100%);
		display: none;
	}
	.copy-button:active{
		transform: scale(.9);
	}
	.copy-button::before{
		content: "";
		width: 1.5vw;
		height: 2.4vw;
		border-radius: .6vw;
		border: solid .6vw #fff;
		box-shadow: .75vw .75vw 0 0 #fff;
		transform: translate(0, -.375vw);
	}
	.copy-button::after{
		content: "COPY";
		font-size: 4.05vw;
		font-weight: bold;
		color: #fff;
		margin-left: 2.4vw;
	}
	.copy-text{
		display: none;
		color: #32558e;
		font-size: 4.5vw;
		padding-left: 3vw;
		opacity: 0;
		font-weight: bold;
		pointer-events: none;
		transition: all .2s;
	}
	#footer-contact-1 > .copy-text{
		color: #fff;
		font-size: 4.5vw;
	}
	#input-copy{
		position: fixed;
		top: 0;
		left: 0;
		opacity: 0;
		pointer-events: none;
	}
	#floatform{
		width: 80vw;
		padding-left: 10vw;
	}
	#floatform div{
		margin: 5vh 0 0 0;
		padding: 0;
		width: 80vw;
	}
	.form1{
	    border-color: #666666;
	    outline: none;
	    border-style: solid;
	    border-bottom-width: 0.6vw;
	    border-top-width: 0vw;
	    border-left-width: 0vw;
	    border-right-width: 0vw;
	    font-size: 4.5vw;
		line-height: 0;
		padding: 0.2vh 0;
		margin: 0;
		width: 80vw;
		margin-top: 4.5vw;
		display: block;
		border-radius: 0;
	}
	.form1:focus{
	    border-color: #32558e;
	}
	.form2:focus{
	    border-color: #32558e;	
	}
	.form2{
		border-bottom: solid 0.6vw #666666;
		border-top: none;
		border-left: none;
		border-right: none;
	    outline: none;
	    width: 80vw;
	    font-size: 4.5vw;
	    height: 10vh;
		background-color: transparent;
		z-index: 1;
	    margin-top: 2.5vh;
	    font: 0; 
		display: block;
		border-radius: 0;
	}
	.label{
		font-size: 6vw;
		line-height: 0;
		text-align: left;
		display: block;
		position: relative;
		color: #666666;
		font-weight: bold;
	}
	#submit2{
	    font-weight: bold;
		font-size: 6vw;
		padding: 1.5vw;
	    text-align: center;
	    background: linear-gradient(105deg, #535aea 0%, #5385ea 50%, #4fabde 100%);
	    color: white;
	    box-shadow: 1.5vw 1.5vw 3vw #666666;
	    border-radius: 10vw;
	    cursor: pointer;
	    width: 45vw;
	    border-style: none;
	}
	#errorMessage2{
		color: #e83719;
		font-size: 3.9vw;
		line-height: 13.5vw;
		padding-left: 1vw;
	}



	#calc-page{
		display: none;
	}
	.reference{
		background-color: #eee;
		height: 8vw;
		padding: 0 8.8vw 0 2.4vw;
		border-radius: 8vw;
		position: relative;
		display: inline-block;
		border: solid .6vw #fff;
	}
	.reference::after{
		content: "?";
		width: 6.8vw;
		height: 6.8vw;
		background-color: #fff;
		font-size: 3vw;
		font-weight: bold;
		line-height: 6.8vw;
		text-align: center;
		position: absolute;
		right: .6vw;
		top: .6vw;
		border-radius: 6.8vw;
		color: #999;
	}


	#send-data{
		display: none;
	}

	#tariff{
		display: none;		
	}

}




