html, body {
	margin: 0;
	position: relative;
	overflow-x: clip;
	scroll-behavior: smooth;
}

.convert {
	visibility:visible;
	display: block;
}

.mobile {display: none;}
.hide {display:none !important;}

a {
	color:inherit !important;
	text-decoration: none !important;
}

.f1{font-family:Arial, Helvetica, sans-serif;}
.f2{font-family:"Arial Black", Gadget, sans-serif;}
.f3{font-family:Arial, Helvetica, sans-serif;}	
.f4{font-family:Arial, Helvetica, sans-serif;}	
.f5{font-family:iArial, Helvetica, sans-serif;}	
.f6{font-family:Arial, Helvetica, sans-serif;}
.f7{font-family:Arial, Helvetica, sans-serif;}

.s0{font-size:60px!important;}
.s1{font-size:50px!important;}
.s2{font-size:30px!important;}
.s3{font-size:20px!important;}
.s4{font-size:15px!important;}
.s5{font-size:10px!important;}

.c {display:flex; justify-content:center; align-items:center;}
.c2 {display:block !important;}

.container_100{
	width:100%;
	height:100vh;
	position:relative;
	float:left;
	}

.container_carousel {
	width: 100%;
	height: 100vh;
	position: absolute;
	margin: auto;
	z-index:0;
}

.carousel_overlay {
	width: 100%;
	height: 100vh;
	position: absolute;
	z-index: 10;
	background-color:#000;
	opacity:.5;
  /*background: #0B486B;
	background: -webkit-linear-gradient(to right, #F56217, #0B486B); 
	background: linear-gradient(to right, #F56217, #0B486B); 
	transform: translateZ(0);
	mix-blend-mode: overlay; */
}

.dot_filter {
	background: url(../images/dot.png);
	background-repeat: repeat;
	width: 100%;
	height: 100vh;
	position: absolute;
	top: 0;
	left: 0;
	z-index: 10;
}

#header {
	width: 100vw;
	height:10vh;
	position: fixed;
	top: 0;
	transition: 0.4s;
	transition-duration: 120ms;
	left: 50%;
	transform: translate(-50%);
	display: flex;
	z-index:9999;
	background-color: rgba(0, 0, 0, 0.5);
}

.changed {	background: rgb(0,0,0,0.3) !important;}

.header_logo{width:25%; position:relative; float:left; padding: 5px;}
.header_logo img {height:100%; max-height:10vh;}

.header_btnBox {
	width: 45%;
	position: relative;
	float: right;
	display: flex;
	align-items: center;
	left: 30%;
}

.header_btn{
	position:relative;
	float:left;
	color:#fff;
	padding: 0 15px;
	transition:all ease-in 300ms; 
	cursor:pointer;	
	font-size: 16px !important;
	}
.header_btn:hover{
	color:#F90;
	}
	
.m_header_logo {display:none;
}
.m_header_logo img {width:40%;}	

.index_header_logo {display:none;
}
.index_header_logo img {width:40%;}		

.footer {
	width: 100%;
	height: auto;
	position: relative;
	float: left;
	background-color: #000;
	padding: 3%;
	box-sizing: border-box;
}
	
.footer-a, .footer-b, .footer-c{
	width:33%;
	height:auto;
	position:relative;
	float:left;
	color:#eee;
	text-align:center;
	}
.footer-a img {
	width: 70%;
	margin: 0 auto;
	display: block;
}

.footer-b {
	display:flex;
	align-item:center;
	justify-content:center;
	}	

.footer-b-content{width:100%; height:auto; position:relative; float:left;}	
.footer-b-left {width:5%; height: 30px; float:left; margin-top: 10px;}
.footer-b-left img {
	width: 90%;
	filter: invert();
}
.footer-b-right {width:95%; height: 30px; float:none; text-align:left; padding-left:10px; margin-top: 10px; display: inline-table;}
.footer-c { padding:10px; box-sizing:border-box;}
	
/* make keyframes that tell the start state and the end state of our object */
@-webkit-keyframes logo { from { left:-100%; opacity:0; } to { left:0; opacity:1; } }
@-moz-keyframes logo { from { left:-100%; opacity:0; } to { left:0; opacity:1; } }
@keyframes logo { from { left:-100%; opacity:0; } to { left:0; opacity:1; } }

.logoAni {
	opacity:0;
	left:-100%;  /* make things invisible upon start */
	-webkit-animation:logo ease-in 1;  /* call our keyframe named fadeIn, use animattion ease-in and repeat it only 1 time */
	-moz-animation:logo ease-in 1;
	animation:logo ease-in 1;

	-webkit-animation-fill-mode:forwards;  /* this makes sure that after animation is done we remain at the last keyframe value (opacity: 1)*/
	-moz-animation-fill-mode:forwards;
	animation-fill-mode:forwards;
	
	-webkit-animation-duration:1s;
	-moz-animation-duration:1s;
	animation-duration:1s;
}

.logoAni.logo1 {
  -webkit-animation-delay: 1s;
  -moz-animation-delay: 1s;
  animation-delay: 1s;
}


.index_title {
	text-align: left;
	color: #ffb300;
	position: absolute;
	font-size: 8vw;
	/* top: 30%; */
	left: 0;
	transform: translate(15%,30%);
	z-index: 11;
	bottom: 17vh;
	width: 100%;
}

.index_subtitle {
	text-align: left;
	color: #fff;
	position: absolute;
	font-size: 5vw;
	/* top: 75%; */
	left: 35%;
	transform: translate(0,0);
	z-index: 11;
	bottom: 0;
}
	
.index_logo {
	width: 30%;
	height: auto;
	z-index: 10;
	position: absolute;
	bottom: 50%;
	left: 0;
	transform: translate(0,100%);
}
.index_logo img {width:100%; box-shadow: 0px 0px 15px rgba(0, 0, 0, 0.5);}	

.index_slogan {
	width: 65%;
	height: auto;
	z-index: 10;
	position: absolute;
	bottom: 25%;
	left: 2%;
	transform: translate(0,100%);
	color: #f4f4f4;
	line-height: 1.2em;
}
	
.index_btn {
	width: 50%;
	height: auto;
	position: absolute;
	z-index: 10;
	right: -10%;
	bottom: 45%;
	transform: translate(5%,100%);
}

#btn_profile, #btn_specialty, #btn_product, #btn_award, #btn_contact {
	width: 200px;
	height: 173px;
	position: absolute;
	background-image: url(../images/hexagon_1.png);
	background-size: contain;
	display: flex;
	justify-content: center;
	align-items: center;
	z-index:10;
	-moz-transition: all 0.5s ease;
	-webkit-transition: all 0.5s ease;
	-ms-transition: all 0.5s ease;
	-o-transition: all 0.5s ease;
	transition: all 0.5s ease;	
}
#btn_profile {top: 50%; right: 0; transform: translate(-250%,-5%); background-image: url(../images/hexagon_1.png); cursor:pointer;}
#btn_specialty {top: 50%; right: 0; transform: translate(-171%,47%); background-image: url(../images/hexagon_2.png); cursor:pointer;}
#btn_product {top: 50%; right: 0; transform: translate(-171%,-57%);background-image: url(../images/hexagon_3.png); cursor:pointer;}
#btn_award {top: 50%; right: 0; transform: translate(-93%,-5%); background-image: url(../images/hexagon_4.png); cursor:pointer;}
#btn_contact {top: 50%; right: 0; transform: translate(-93%,-111%); background-image: url(../images/hexagon_5.png); cursor:pointer;}

#btn_profile:hover, #btn_specialty:hover, #btn_product:hover, #btn_award:hover, #btn_contact:hover {
	-webkit-filter: brightness(1.5); 
	filter: brightness(1.5); 
	color:#fff;
	}

.container_profile_a {
	width: 100%;
	height: auto;
	position: absolute;
	float: left;
	background-image: none;
	background-repeat: no-repeat;
	background-size: cover;
	background-position-y: center;
	z-index: 100;
}
	
.profile_title {
	width: 100%;
	text-align: center;
	color: #fff;
	position: absolute;
	font-size: 5vw;
	z-index: 11;
	bottom: -15px;
}

.container_profile_b {
	width: 100%;
	height: auto;
	position: relative;
	float: left;
	padding: 5%;
	color: #333;
	line-height: 30px;	
}
	
.profile_title2{
	width:60%;
	height:auto;
	position:relative;
	float:left;
	padding: 10px;
	color: #333;
	line-height: 30px;		
	}
.profile_ukas{
	width:20%;
	height:auto;
	position:relative;
	float:left;
	padding:10px;
	box-sizing:border-box;
	}
.profile_ukas img {width:100%;}	

.profile_lrqa{
	width:20%;
	height:auto;
	position:relative;
	float:left;
	padding:10px;
	box-sizing:border-box;	
	}
.profile_lrqa img {width:70%;}	
	
.container_profile_in_a {
	width: 50%;
	position: relative;
	float: left;
	z-index:30;
}
.container_profile_in_a img {
	width: 100%;
	height: 40vh;	
	object-fit: cover;
}

.container_profile_in_b {
	width: 50%;
	height:40vh;
	position: relative;
	float: left;
	padding: 2%;
	box-sizing: border-box;
	line-height: 30px;
}
	
.specialty-1 {
	width:100%;
	height:60vh;
	position:relative;
	float:left;
	}	
.sp-text-1, .sp-text-2 {
	width: 100%;
	height: auto;
	position: absolute;
	float: left;
	color: #fff;
	text-align: center;
	bottom: 25%;
}
.sp-text-2 {
	width: 60% !important;
	bottom: 10% !important;
	margin-left: auto;
	margin-right: auto;
	left: 0;
	right: 0;
	text-align: center;
}

.specialty-2, .specialty-3, .specialty-4, .specialty-5 {
	width: 100%;
	height: 80vh;
	position: relative;
	float: left;
	background-image: url(../images/specialty-1.jpg);
	background-size: 90%;
	background-position: 50% 50%;
	background-repeat: no-repeat;
	margin: 0 0 5% 0;
}
.specialty-3 {	background-image:url(../images/specialty-2.jpg) !important;}
.specialty-4 {	background-image:url(../images/specialty-3.jpg) !important;}
.specialty-5 {	background-image:url(../images/specialty-4.jpg) !important;}

.specialty-textbox{
	width:100%; 
	height:auto; 
	float:left; 
	color:#fff;
	}

.specialty-2_textbox {
	width: 60%;
	height: auto;
	position: absolute;
	background: rgb(255,255,255);
	background: -moz-linear-gradient(270deg, rgba(255,255,255,0) 0%, rgba(0,0,0,1) 100%);
	background: -webkit-linear-gradient(270deg, rgba(255,255,255,0) 0%, rgba(0,0,0,1) 100%);
	background: linear-gradient(270deg, rgba(255,255,255,0) 0%, rgba(0,0,0,1) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#ffffff",endColorstr="#000000",GradientType=1);
	bottom: 0;
	left: 10%;
	padding: 3%;
}

.product-header {
	width: 100%;
	height: 60vh;
	position: relative;
	float: left;
	background-image: url(../images/product-bg.png);
	background-size: cover;
	background-position: bottom;
}
.product-header-title {
	width: 100%;
	height: auto;
	position: absolute;
	bottom: -15px;
	color: #d0d0d0;
	text-align: center;
	font-size: 5vw;
}

.product-container {
	width: 100%;
	height: auto;
	position: relative;
	float: left;
	padding: 5%;
}
	
.product-box {
	width: 23%;
	height: auto;
	display: inline-block;
	border: 1px solid #e3e3e3;
	padding: 5px;
	box-sizing: border-box;
	margin: 10px;
}
.product-box img {
	width: 100%;
	height: 250px;
	object-fit: cover;
}	
.product-box span {
	width: 100%;
	padding: 5px;
	box-sizing: border-box;
	color: #e3e3e3;
	text-align: center;
	display: inline-block;
}

.award-header {
	width: 100%;
	height: 60vh;
	position: relative;
	float: left;
	background-image:url(../images/award-bg.png);
	background-size: cover;
	background-position: bottom;
}
.award-header-title {
	width: 100%;
	height: auto;
	position: absolute;
	bottom: -15px;
	color: #fff;
	text-align: center;
	font-size: 5vw;
}

.award-container {
	width: 100%;
	height: auto;
	position: relative;
	float: left;
	padding: 5%;
}

.bull{
	width:100%;
	}

.award-a {
	width: 50%;
	height: auto;
	position: relative;
	float: left;
}

.award-b {
	width: 50%;
	height: auto;
	position: relative;
	float: left;
}
.award-b img {
	width: 85%;
	padding: 50px 50px 20px 50px;
	box-sizing: border-box;
	margin: 0 auto;
	display: block;
}
	
.awardText-1{
	width:100%;
	text-align:center;
	padding:10px;
	box-sizing:border-box;
	color:#FC3;
	}
.awardText-2{
	width:100%;
	text-align:center;
	color:#FFF;
	}
	
.contact-title {
	width: 100%;
	height: auto;
	position: relative;
	float: left;
	margin: 7% 0 3% 0;
	color: #666;
	text-align: center;
	font-size: 5vw;
}

.map{
	width:50%;
	height:auto;
	position:relative;
	float:left;
	}
.contact_container {
	width: 50%;
	height: auto;
	position: relative;
	float: left;
	padding: 5%;
}
.contact_container img{
	width:90%;
	}

.con-footer-a, .con-footer-b, .con-footer-c{
	width:33%;
	height:auto;
	position:relative;
	float:left;
	color:#eee;
	text-align:center;
	}
.con-footer-a img {
	width: 70%;
	margin: 0 auto;
	display: block;
}

.con-footer-b-content{width:100%; height:auto; position:relative; float:left;}	

.con-footer-b-left {
	width: 10%;
	height:50px;
	float: left;
    display: flex;
    align-items: center;
    justify-content: center;	
}
.con-footer-b-left img {
	width: 60%;
}

.con-footer-b-right {
	width:90%; 
	height:50px;	
	float:left; 
	text-align:left; 
    display: flex;
    align-items: center;
    justify-content: left;	
	}
	
.con-footer-c { 
	padding:10px; 
	box-sizing:border-box;
	}				










@media screen and (max-width: 800px) { 
html, body {
	margin: 0;
	position: relative;
	overflow-x: clip;
	scroll-behavior: smooth;
}

.convert {
	visibility:hidden;
	display: none;
}

.mobile {display: block;}
.hide {display:block !important;}

a {
	color:inherit !important;
	text-decoration: none !important;
}

.f1{font-family:Arial, Helvetica, sans-serif;}
.f2{font-family:"Arial Black", Gadget, sans-serif;}
.f3{font-family:impact;}	
.f4{font-family:Arial, Helvetica, sans-serif;}	
.f5{font-family:Arial, Helvetica, sans-serif;}	
.f6{font-family:Arial, Helvetica, sans-serif;}
.f7{font-family:Arial, Helvetica, sans-serif;}

.s0{font-size:60px!important;}
.s1{font-size:30px!important;}
.s2{font-size:20px!important;}
.s3{font-size:16px!important;}
.s4{font-size:13px!important;}
.s5{font-size:12px!important;}

.c {display:flex; justify-content:center; align-items:center;}
.c2 {display:block !important;}

.container_100{
	width:100%;
	height:100vh;
	position:relative;
	float:left;
	}

.container_carousel {
	width: 100%;
	height: 100vh;
	position: absolute;
	margin: auto;
	z-index:0;
}

.carousel_overlay {
	width: 100%;
	height: 100vh;
	position: absolute;
	z-index: 10;
	background-color:#000;
	opacity:.5;
  /*background: #0B486B;
	background: -webkit-linear-gradient(to right, #F56217, #0B486B); 
	background: linear-gradient(to right, #F56217, #0B486B); 
	transform: translateZ(0);
	mix-blend-mode: overlay; */
}

.dot_filter {
	background: url(../images/dot.png);
	background-repeat: repeat;
	width: 100%;
	height: 100vh;
	position: absolute;
	top: 0;
	left: 0;
	z-index: 10;
}

#header {
	width: 100vw;
	height:10vh;
	position: fixed;
	top: 0;
	transition: 0.4s;
	transition-duration: 120ms;
	left: 50%;
	transform: translate(-50%);
	display: flex;
	z-index:9999;
	background-color: rgba(0, 0, 0, 0.5);
}

.m_header_logo {
	width: 100%;
	height: auto;
	position: absolute;
	z-index: 100;
	text-align: center;
	padding: 10px;
	box-sizing: border-box;
	display: block;
}
.m_header_logo img {width:40%;}	

.index_header_logo {
	width: 100%;
	height: 100vh;
	position: relative;
	z-index: 100;
	display: flex;
	justify-content: center;
	align-items: center;
}
	
.index_header_logo img {
	width: 60%;
	box-shadow: 0 0 20px #fff;
}
.index_slogan {
	width: 95%;
	height: auto;
	position: absolute;
	color: #fff;
	z-index: 200;
	transform: translate(-50%,50%);
	top: 50%;
	left: 50%;
	font-size: calc(100vw - 80vw);
	text-align: center;
	line-height: calc(100vh - 96vh);
}

.changed {	background: rgb(0,0,0,0.3) !important;}

.header_logo{width:25%; position:relative; float:left; padding: 5px;}
.header_logo img {height:100%; max-height:10vh;}

.header_btnBox {
	width: 40%;
	position: relative;
	float: left;
	display: flex;
	align-items: center;
	right: -30%;
}

.header_btn{
	position:relative;
	float:left;
	color:#fff;
	padding: 0 15px;
	transition:all ease-in 300ms; 
	cursor:pointer;	
	}
.header_btn:hover{
	color:#F90;
	}	

.footer {
	width: 100%;
	height: auto;
	position: relative;
	float: left;
	background-color: #000;
	padding: 0;
	box-sizing: border-box;
}
	
.footer-a, .footer-b, .footer-c {
	width: 100%;
	height: auto;
	position: relative;
	float: left;
	color: #eee;
	text-align: center;
}
.footer-a img {
	width: 90%;
	margin: 0 auto;
	display: block;
}

.footer-a, .footer-b{
	padding:20px;
	}


.footer-b-content{width:100%; height:auto; position:relative; float:left;}	
.footer-b-left {width:5%; height:auto; float:left; margin-top: 0;}
.footer-b-left img {
	width: 90%;
	filter: invert();
}
.footer-b-right {width:95%; height:auto; float:left; text-align:left; padding-left:10px; margin-top: 0;}
.footer-c {
	padding: 20px;
	box-sizing: border-box;
}
	
/* make keyframes that tell the start state and the end state of our object */
@-webkit-keyframes logo { from { left:-100%; opacity:0; } to { left:0; opacity:1; } }
@-moz-keyframes logo { from { left:-100%; opacity:0; } to { left:0; opacity:1; } }
@keyframes logo { from { left:-100%; opacity:0; } to { left:0; opacity:1; } }

.logoAni {
	opacity:0;
	left:-100%;  /* make things invisible upon start */
	-webkit-animation:logo ease-in 1;  /* call our keyframe named fadeIn, use animattion ease-in and repeat it only 1 time */
	-moz-animation:logo ease-in 1;
	animation:logo ease-in 1;

	-webkit-animation-fill-mode:forwards;  /* this makes sure that after animation is done we remain at the last keyframe value (opacity: 1)*/
	-moz-animation-fill-mode:forwards;
	animation-fill-mode:forwards;
	
	-webkit-animation-duration:1s;
	-moz-animation-duration:1s;
	animation-duration:1s;
}

.logoAni.logo1 {
  -webkit-animation-delay: 1s;
  -moz-animation-delay: 1s;
  animation-delay: 1s;
}	

.index_title {
	text-align: left;
	color: #ffb300;
	position: absolute;
	font-size: 8vw;
	/* top: 30%; */
	left: 0;
	transform: translate(15%,30%);
	z-index: 11;
	bottom: 17vh;
	width: 100%;
}

.index_subtitle {
	text-align: left;
	color: #fff;
	position: absolute;
	font-size: 5vw;
	/* top: 75%; */
	left: 35%;
	transform: translate(0,0);
	z-index: 11;
	bottom: 0;
}
	
.index_logo {
	width: 30%;
	height: auto;
	z-index: 10;
	position: absolute;
	bottom: 50%;
	left: 0;
	transform: translate(0,100%);
}
.index_logo img {width:100%; box-shadow: 0px 0px 15px rgba(0, 0, 0, 0.5);}		
	
.index_btn {
	width: 50%;
	height: auto;
	position: absolute;
	z-index: 10;
	right: -10%;
	bottom: 45%;
	transform: translate(5%,100%);
}

#btn_profile, #btn_specialty, #btn_product, #btn_award, #btn_contact {
	width: 200px;
	height: 173px;
	position: absolute;
	background-image: url(../images/hexagon_1.png);
	background-size: contain;
	display: flex;
	justify-content: center;
	align-items: center;
	z-index:10;
	-moz-transition: all 0.5s ease;
	-webkit-transition: all 0.5s ease;
	-ms-transition: all 0.5s ease;
	-o-transition: all 0.5s ease;
	transition: all 0.5s ease;	
}
#btn_profile {top: 50%; right: 0; transform: translate(-250%,-5%); background-image: url(../images/hexagon_1.png); cursor:pointer;}
#btn_specialty {top: 50%; right: 0; transform: translate(-171%,47%); background-image: url(../images/hexagon_2.png); cursor:pointer;}
#btn_product {top: 50%; right: 0; transform: translate(-171%,-57%);background-image: url(../images/hexagon_3.png); cursor:pointer;}
#btn_award {top: 50%; right: 0; transform: translate(-93%,-5%); background-image: url(../images/hexagon_4.png); cursor:pointer;}
#btn_contact {top: 50%; right: 0; transform: translate(-93%,-111%); background-image: url(../images/hexagon_5.png); cursor:pointer;}

#btn_profile:hover, #btn_specialty:hover, #btn_product:hover, #btn_award:hover, #btn_contact:hover {
	-webkit-filter: brightness(1.5); 
	filter: brightness(1.5); 
	color:#fff;
	}

.container_profile_a {
	width: 100%;
	height: auto;
	position: relative;
	float: left;
	background-image: none;
	background-repeat: inherit;
	background-size: auto;
	background-position-y: center;
	text-shadow: 0 0 10px #080042;
}
	
.profile_title {
	width: 100%;
	text-align: center;
	color: #fff;
	position: absolute;
	font-size: 10vw;
	z-index: 11;
	bottom: 0px;
	line-height: 35px;
}

.container_profile_b {
	width: 100%;
	height: auto;
	position: relative;
	float: left;
	padding: 5%;
	color: #333;
	line-height: 30px;	
}
	
.profile_title2 {
	width: 100%;
	height: auto;
	position: relative;
	float: left;
	padding: 10px;
	color: #333;
	line-height: 30px;
}
.profile_ukas {
	width: 100%;
	height: auto;
	position: relative;
	float: left;
	text-align: center;
}
.profile_ukas img {
	width: 90%;
	padding: 10px 0;
}

.profile_lrqa{
	width: 100%;
	height: auto;
	position: relative;
	float: left;
	text-align: center;	
	}
.profile_lrqa img {
	width: 60%;
	padding: 10px 0;
	}	
	
.container_profile_in_a {
	width: 100%;
	position: relative;
	float: left;
	z-index: 30;
}
.container_profile_in_a img {
	width: 100%;
	height: 40vh;	
	object-fit: cover;
}

.container_profile_in_b {
	width: 100%;
	height: auto;
	position: relative;
	float: left;
	padding: 2%;
	box-sizing: border-box;
	line-height: 30px;
}	
.specialty-1 {
	width: 100%;
	height: calc(100vh - 75vh);
	position: relative;
	float: left;
	margin-top: 15vh;
}	
.sp-text-1, .sp-text-2 {
	width: 100%;
	height: auto;
	position: relative;
	float: left;
	color: #fff;
	text-align: center;
	top: 0;
}
.sp-text-2 {
	width: 100% !important;
	bottom: 20% !important;
	margin-left: auto;
	margin-right: auto;
	left: 0;
	right: 0;
	text-align: center;
	padding: 5px;
	line-height: calc(100vh - 97vh);
}

.specialty-2, .specialty-3, .specialty-4, .specialty-5 {
	width: 100%;
	height: 80vh;
	position: relative;
	float: left;
	background-image: url(../images/specialty-1.jpg);
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	margin: 0 0 5% 0;
}
.specialty-3 {	background-image:url(../images/specialty-2.jpg) !important;}
.specialty-4 {	background-image:url(../images/specialty-3.jpg) !important;}
.specialty-5 {	background-image:url(../images/specialty-4.jpg) !important;}

.specialty-textbox{
	width:100%; 
	height:auto; 
	float:left; 
	color:#fff;
	}

.specialty-2_textbox {
	width: 90%;
	height: auto;
	position: absolute;
	background: rgb(255,255,255);
	background: -moz-linear-gradient(270deg, rgba(255,255,255,0) 0%, rgba(0,0,0,1) 100%);
	background: -webkit-linear-gradient(270deg, rgba(255,255,255,0) 0%, rgba(0,0,0,1) 100%);
	background: linear-gradient(270deg, rgba(255,255,255,0) 0%, rgba(0,0,0,1) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#ffffff",endColorstr="#000000",GradientType=1);
	bottom: 0;
	left: 0;
	padding: 3%;
}

.product-header {
	width: 100%;
	height: 40vh;
	position: relative;
	float: left;
	background-image: url(../images/product-bg.png);
	background-size: cover;
	background-position: bottom;
}
.product-header-title {
	width: 100%;
	height: auto;
	position: absolute;
	bottom: 0px;
	color: #d0d0d0;
	text-align: center;
	font-size: 10vw;
}

.product-container {
	width: 100%;
	height: auto;
	position: relative;
	float: left;
	padding: 5%;
}
	
.product-box {
	width: 42%;
	height: auto;
	display: inline-block;
	border: 1px solid #e3e3e3;
	padding: 5px;
	box-sizing: border-box;
	margin: 10px;
}
.product-box img {
	width: 100%;
	height: 140px;
	object-fit: cover;
}	
.product-box span {
	width: 100%;
	padding: 5px;
	box-sizing: border-box;
	color: #e3e3e3;
	text-align: center;
	display: inline-block;
}

.award-header {
	width: 100%;
	height: 40vh;
	position: relative;
	float: left;
	background-image: url(../images/award-bg.png);
	background-size: cover;
	background-position: bottom;
}
.award-header-title {
	width: 100%;
	height: auto;
	position: absolute;
	bottom: -15px;
	color: #fff;
	text-align: center;
	font-size: 10vw;
}

.award-container {
	width: 100%;
	height: auto;
	position: relative;
	float: left;
	padding: 5%;
}

.bull {
	width: 130%;
	position: relative;
	left: 50%;
	top: 50%;
	transform: translate(-50%,0%);
}

.award-a {
	width: 100%;
	height: auto;
	position: relative;
	float: left;
}

.award-b {
	width: 100%;
	height: auto;
	position: relative;
	float: left;
	margin-top: 20%;
}
.award-b img {
	width: 100%;
	padding: 50px 50px 20px 50px;
	box-sizing: border-box;
	margin: 0 auto;
	display: block;
}
	
.awardText-1 {
	width: 100%;
	text-align: center;
	padding: 5px;
	box-sizing: border-box;
	color: #FC3;
}
.awardText-2{
	width:100%;
	text-align:center;
	color:#FFF;
	}
	
.contact-title {
	width: 100%;
	height: auto;
	position: relative;
	float: left;
	margin: 25% 0 5% 0;
	color: #666;
	text-align: center;
	font-size: 10vw;
}

.map {
	width: 100%;
	height: auto;
	position: relative;
	float: left;
}
.contact_container {
	width: 100%;
	height: auto;
	position: relative;
	float: left;
	padding: 5%;
}
.contact_container img{
	width:90%;
	}

.con-footer-a, .con-footer-b, .con-footer-c{
	width:33%;
	height:auto;
	position:relative;
	float:left;
	color:#eee;
	text-align:center;
	}
.con-footer-a img {
	width: 70%;
	margin: 0 auto;
	display: block;
}

.con-footer-b-content{width:100%; height:auto; position:relative; float:left;}	
.con-footer-b-left {
	width: 5%;
	height:auto;
	float: left;
	margin-top: 9px;
}
.con-footer-b-left img {
	width: 90%;
	margin-top: 15%;
}
.con-footer-b-right {width:95%; height:auto; float:left; text-align:left; padding-left:10px; margin-top: 10px;}
.con-footer-c { padding:10px; box-sizing:border-box;}


.sidepanel {
	width: 0;
	position: fixed;
	z-index: 500;
	height: 100vh;
	top: 0;
	left: 0;
	background-color: #111;
	overflow-x: hidden;
	transition: 0.5s;
	padding-top: 60px;
	color: #5F9EA0;
}

.sidepanel a {
	padding: 15px 8px 15px 32px;
	text-decoration: none;
	font-size: 25px;
	color: #818181;
	display: block;
	transition: 0.3s;
}

.sidepanel a:hover {
  color: #f1f1f1;
}

.sidepanel .closebtn {
  position: absolute;
  top: 0;
  right: 25px;
  font-size: 36px;
}

.closebtn img {
	width: 15%;
	filter: invert();
	float: right;
}

.openbtn {
	font-size: 20px;
	cursor: pointer;
	background-color: unset;
	color: white;
	padding: 10px 15px;
	border: none;
	z-index: 300;
	position: absolute;
	width: 20%;
}
.carousel-inner > .item > a > img, .carousel-inner > .item > img, .img-responsive, .thumbnail a > img, .thumbnail > img {
	display: block;
	max-width: unset !important;
	height: 100vh !important;
}

.logo-hamburger{
	width:100%;
	position:relative;
	}
	
	
.container_flickity {
	width: 100%;
	height: calc(100vh - 10vh);
	position: relative;
	background-color: #fff;
}
.gallery-cell {
	width: 100%;
	height: 100%;
}
.gallery-cell img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.gallery-cell div {
	width: 100%;
	height: auto;
	color: #333;
	text-align: center;
}	
			
}