@font-face{
	font-family: bold;
	src:url("../fonts/Montserrat-Bold.ttf");}
@font-face{
	font-family: medium;
	src: url("../fonts/Montserrat-Medium.ttf");}
@font-face{
	font-family: semi-bold;
	src: url("../fonts/Montserrat-SemiBold.ttf");}
	
html {
  scroll-behavior: smooth;
}
body {
    overflow-x: hidden;
    font-feature-settings: "lnum";
    font-family: medium;
	scroll-behavior: smooth;
}
.container{width: 1000px;}
.banner{background-image: url("../img/banner.jpg");background-size: cover;height: 450px;background-position: bottom;}
.banner-content{padding-top: 90px;}
.banner-content h1{padding-top: 40px;font-family: semi-bold;
font-size: 42px;line-height: 1.3;}
#fututre{margin: 60px 0px;}
#fututre h3{font-size: 30px; font-family: semi-bold;margin-bottom: 30px;}
p{font-size: 14px;line-height: 1.5;}

#headless{background:url("../img/bg.jpg");padding:40px 0px;}
#headless h3{font-size: 30px; font-family: semi-bold;margin-bottom: 30px;text-align: center;margin-top: 0px;}
#headless .panel-content{border: 1px solid #8347ad;padding: 0px 30px 10px;margin-top: 60px;}
#headless .panel-content img{margin-top: -40px;margin-bottom: 20px;}
#headless .panel1 .panel-content{min-height:210px; }
#headless .panel2 .panel-content{min-height:190px; }


#acknowledge{margin: 60px 0px;}
#acknowledge h3{font-size: 30px; font-family: semi-bold;margin-bottom: 30px;text-align: center;margin-top: 0px;}
#acknowledge h4{color: #fff;text-align: center;padding-top: 40px;}
.bg-image{height: 145px;background-size: contain !important;}
.box1 .bg-image{background: url("../img/complexity.png") no-repeat;}
.border{padding: 10px 20px;border-top: 0px !important;border-radius: 3px;border-bottom-left-radius: 10px;border-bottom-right-radius: 10px;text-align: center;min-height: 160px;}
.box1 .border{border: 3px solid #9C6CBD;}
.box2 .bg-image{background: url("../img/integration.png") no-repeat;}
.box2 .border{border: 3px solid #5DC5C3;}
.box3 .bg-image{background: url("../img/intial.png") no-repeat;}
.box3 .border{border: 3px solid #ED6381;}
.box4 .bg-image{background: url("../img/development.png") no-repeat;}
.box4 .border{border: 3px solid #F9C147;}
.box5 .bg-image{background: url("../img/vendor.png") no-repeat;}
.box5 .border{border: 3px solid #5869AB;}
.box-grid{margin-top:30px;display: flex;justify-content: center;}
.box-grid .border{min-height: 140px;}
.mt-30{margin-top: 30px;}



#transition{background:url("../img/bg.jpg");padding:40px 0px;}
#transition h3{font-size: 30px; font-family: semi-bold;margin-bottom: 30px;text-align: center;margin-top: 0px;}
#transition h4{font-size: 24px;color:#8347ad;font-family: medium;margin-bottom: 30px;}

#benefits{margin:60px 0px;}
#benefits h3{font-size: 30px; font-family: semi-bold;margin-bottom: 30px;text-align: center;margin-top: 0px;}
#benefits .grid-content{text-align: center;background-color:#f4edfc;padding:20px;min-height: 392px;border-radius: 15px;}
#benefits .grid-content img{margin: 0 auto;}
#benefits h4{font-size: 18px;font-family: semi-bold;margin: 20px 0px;}
#benefits .grid-2{margin-top:30px;display: flex;justify-content: center;}
#benefits .grid-2 .grid-content{min-height: 350px;}

#summary{background-color: #EDF0F7;padding:30px 0px;}

.footer {
background: #1e1e1e;
color: #fff !important;
padding: 21px 0px 12px;
}
.footer a,
.footer p {
color: #fff;
font-size: 0.97em;
}
.footer .credits {
float: right;
}
.footer .credits a {
border-right: 1px solid #444;
padding: 25px 15px 21px 15px;
cursor: pointer;
}
.footer .credits a:hover {
background-color: #333;
text-decoration: none!important;
}
.footer .twitter 
{
border-left: 1px solid #444;
}
@-moz-document url-prefix()
{
.footer .credits a {
border-right: 1px solid #444;
padding: 25px 15px 20px 15px;
} 
}

@media(min-width:320px) and (max-width:767px)
{
	.container{width: 310px;}
	.banner-content{padding-top:40px;}
	.banner{background-position: left;}
	.banner-content h1{font-size: 36px;}
	.bg-image {height: 135px;}
	.box2 .border,#headless .panel2 .panel-content,#headless .panel1 .panel-content,#benefits .grid-content,#benefits .grid-2 .grid-content{min-height: auto;}
	.box-grid,#benefits .grid-2{display: block;margin-top:0px;}
	#acknowledge .col-md-4,#benefits .col-md-4{margin-top:20px;}
	.footer {text-align: center;}
	.footer .credits{float: initial;}
	.footer .footer-content-inline {padding-bottom:20px;}
}

@media(min-width:768px) and (max-width:991px)
{
	.container{width: 750px;}
	.banner-content h1{font-size: 38px;}
	.banner-content{padding-top:40px;}
	#fututre h3{margin-top: 0px;}
	#headless .panel1 .panel-content {min-height: 251px;}
	#headless .panel2 .panel-content {min-height: 230px;}
	.bg-image {height: 110px;}
	.border{min-height: 225px;}
	.box-grid .border {min-height: 180px;}
	#benefits .grid-content{min-height: 500px;}
	#benefits .grid-2 .grid-content {min-height: 455px;}
	.footer {text-align: center;}
	.footer .credits{float: initial;}
	.footer .footer-content-inline {padding-bottom:20px;}
}

@media(min-width:992px) and (max-width:1199px)
{
	.container{width: 970px;}
	.banner-content{padding-top:40px;}
	#benefits .grid-content{min-height: 412px;}
}