@import url('https://fonts.googleapis.com/css?family=Montserrat:300,400,500,600,700,800,900&display=swap');
html { scroll-behavior: smooth;}
/*.midd-area .main {max-width: 1170px;}*/
p {font-size: 18px;line-height: 26px;padding-bottom: 30px;color: #000;font-weight: 400;}

.banner-section {padding: 40px 0 80px;}
.banner-section h1 {margin-bottom: 20px;}
.banner-section .banner-img-wrap {float: right;width: 100%;text-align: center;}
.banner-section p {font-size: 16px;font-weight: 400;}
.banner-section .btn a {border-color: #ffda30;padding: 13px 40px;}
.banner-section .btn a:hover {border-color: #000;}
.banner-section .btn a span {background: #ffda30;}

.whatis-accordion {background: #ffffff;width: 100%;padding: 100px 0;text-align: center;}
.whatis-accordion p:last-child {padding-bottom: 0;}

.compatibility-experience {padding: 100px 0;}
.compatibility-experience .compatibility-experience-main {display: table; width: 100%;}
.compatibility-experience .compatibility-experience-main .compatibility-left {display: table-cell;vertical-align: middle;width: 50%;padding: 0 20px;}
.compatibility-experience .compatibility-left p {font-weight: 500;}
.compatibility-experience .compatibility-experience-main .experience-right {display: table-cell;vertical-align: middle;width: 50%;padding: 0 20px;text-align: center;}
.compatibility-experience h3 {font-size: 24px;font-weight: bold;color: #000;line-height: 1.3;margin-bottom: 20px;text-transform: uppercase;font-family: 'Montserrat', sans-serif;}
.compatibility-experience .experience-right .experience-img {display: table-cell;width: 25%;}
.compatibility-experience .experience-right .experience-content {display: table-cell;width: 75%;vertical-align: middle;text-align: left;padding: 0 30px 0 40px;}
.compatibility-experience .experience-right .experience-content a {width: 100%;}

.applications-sec {background: #ffffff;padding: 60px 0 80px;}
.applications-sec h2 {text-align: center;}
ul.application-nav { padding: 0; margin: 0; list-style-type: none;}
.applications-sec ul li {font-size: 18px;line-height: 26px;color: #000;font-weight: 500;margin: 8px 0 18px; padding: 0 15px; position: relative;}
.applications-sec ul li::before {content: '\f26d';font-family: 'Material-Design-Iconic-Font';font-size: 7px;display: inline-block;vertical-align: middle;position: absolute;left: 0;top: 7px;line-height: 11px;}

.interactive-elements {padding: 100px 0 90px;width: 100%;}
.interactive-elements .main {padding: 0;}
.interactive-elements h2 {text-align: center;margin-bottom: 50px;}
.interactive-elements ul.elements-nav {display: -webkit-flex;display: -moz-flex;display: -ms-flex;display: -o-flex;display: flex;margin: 0;padding: 0;flex-wrap: wrap;}
.interactive-elements ul.elements-nav li {list-style-type: none;width: calc(100% / 4);margin: 8px 0 23px;}
.interactive-elements ul.elements-nav li a {font-size: 16px;font-weight: 400;color: #000;line-height: 1.2;font-family: 'Montserrat', sans-serif;padding: 8px 10px;border-radius: 15px;transition: all 0.5s;text-transform: uppercase;}
.interactive-elements ul.elements-nav li a:hover {background: #FFDA30;}

.get-in-touch-section {background: #ffffff;}
.get-in-touch-section .sbToggle {background: #ffffff !important;z-index: 99;}
.get-in-touch-section span.error {background: #ffffff;}

/* #Media Queries
================================================== */
@media all and (max-width:1440px) {
	.interactive-elements .main { padding: 0 20px;}
}
@media all and (min-width:1261px) {
	.applications-sec h2 {text-align: center;font-size: 24px;font-weight: bold;color: #000;line-height: 1.2;margin-bottom: 20px;text-transform: uppercase;font-family: 'Montserrat', sans-serif;}
}
@media all and (min-width:1201px) {
	h1 {font-size: 50px;}	
}
@media all and (max-width:1200px) {
	.banner-section {padding: 30px 0 70px;}
	.compatibility-experience .experience-right .experience-content {padding: 0 15px;}
	.interactive-elements ul.elements-nav li {width: calc(100% / 3); margin: 8px 0 15px;}
	.interactive-elements ul.elements-nav li:last-child {margin-bottom: 0;}
	/*.interactive-elements ul.elements-nav li a {font-size: 16px;}*/
}
@media all and (max-width:992px) {
	.banner-section {padding: 30px 0 50px;}
	.whatis-accordion,.compatibility-experience,.applications-sec,.interactive-elements {padding: 50px 0;}
	p {font-size: 15px;line-height: 1.5;padding-bottom: 15px;}
	.interactive-elements .main {padding: 0 20px;}
	.compatibility-experience h3 {font-size: 20px;margin-bottom: 15px;}
	.whatis-accordion h2 {margin-bottom: 20px;}
	.applications-sec h3 {margin-bottom: 15px;}
	.applications-sec ul li {font-size: 15px;line-height: 1.5;margin: 0 0 15px 0;}
	.compatibility-experience .experience-right .experience-img {width: 35%;}
	.compatibility-experience .experience-right .experience-content {width: 65%;}
	.interactive-elements h2 {margin-bottom: 15px;}	
}
@media all and (max-width:960px) {
	.interactive-elements ul.elements-nav li {width: calc(100% / 2);}
}
@media all and (max-width:767px) {
	.banner-section,.get-in-touch-section {padding: 30px 0;}
	.banner-section .banner-img-wrap {max-width: 100%;float: left;}	
	.banner-section .row-50 {flex-wrap: nowrap;margin: 0 auto; display: table;}
	.banner-section .row-50 > div {width: 100%;padding: 0;}
	.banner-section .banner-img-wrap {float: none;}
	.compatibility-experience .compatibility-experience-main .compatibility-left,
	.compatibility-experience .compatibility-experience-main .experience-right {width: 100%;display: block;padding: 0;}
	.compatibility-experience .experience-right .experience-img {text-align: left;}
	.applications-sec h3 {font-size: 22px;}
	.applications-sec ul li:last-child, .interactive-elements ul.elements-nav li:last-child {margin-bottom: 0;padding-bottom: 0;}
	.compatibility-experience .experience-right .experience-img {width: 100%;text-align: center;display: block;	padding-bottom: 10px;}
	.compatibility-experience .experience-right .experience-content { width: 100%;text-align: center;display: block;padding: 0;}
	.compatibility-experience h3 {margin: 0 auto 10px;}
	.compatibility-experience .experience-right .experience-content p{margin-bottom: 0px;padding-bottom: 15px;}
	.compatibility-experience .experience-right .experience-content .btn {display: inline-block;}
	.interactive-elements ul.elements-nav li a {font-size: 15px;}
	.applications-sec ul {width: 100%;margin: 0;}
	.applications-sec ul li {text-align: center;margin: 0 0 20px 0;}
	.applications-sec ul li::before {left: 0;top: inherit;margin: 0 auto; right: 0;bottom: -15px;}
	.compatibility-experience .compatibility-experience-main {text-align: center;}
}
@media all and (max-width:640px) {	
	.whatis-accordion, .compatibility-experience, .applications-sec {padding: 30px 0;}
	.interactive-elements {padding: 30px 0 22px;}
	.interactive-elements ul.elements-nav li {width: 100%; text-align: center;padding-bottom: 0;}
	p { font-size: 14px;}	
	.compatibility-experience h3 {font-size: 18px;}
	.compatibility-experience .experience-right .experience-content a {width: inherit;}	
	.interactive-elements ul.elements-nav li {padding: 0;margin: 0;}
	.interactive-elements ul.elements-nav li a {display: block;	padding: 8px 20px;display: inline-block;}
}
@media all and (max-width:480px) {
	h2 {font-size: 24px;}
	.banner-section h1 {margin-bottom: 10px;}
	.banner-section p {padding-bottom: 10px;}
	
	.banner-section .banner-img-wrap img {max-width: 200px;}
	
}