:root{
	--main_color: #3f2666;
}
.heading_title{
	font-size: 44px;
	font-weight: 600;
	color: var(--main_color);
	font-family: "Comfortaa", sans-serif;
}
p{
	font-family: "Lato", sans-serif;
}
a{
	text-decoration: none;
	font-family: "Lato", sans-serif;
}
.container{
	max-width: 1100px;
}
header .top{
	background: var(--main_color);
	padding: 15px;
}
/*header .top .container{
	max-width: 1100px;
}*/
header .top ul{
	list-style: none;
	padding: 0px;
	display: flex;
	gap: 20px;
	margin: 0px;
}
header .top .row{
	align-items: center;
}
header .top ul li a{
	color: #fff;
	text-decoration: none;
	font-size: 18px;
}
header .top .account{
	display: flex;
	gap: 20px;
	align-items: center;
	justify-content: end;
}
header .top .account a{
	text-decoration: none;
	color: #fff;
}
header .top .account a.btn{
	background: #fff;
	color: var(--main_color);
	padding: 5px 15px;
	border-radius: 10px;
}
header #navbarNav{
	justify-content: end;
}
header .menu li a{
	font-size: 18px;
	color: var(--main_color);
}
header .navbar-nav{
	gap: 15px;
}

header .mobile_logo{
	display: none;
}
.content{
	background-image: url(img/bg.png)!important;
	background-size: cover!important;
	background-position: top center !important;
}
/*banner*/

.hero{
	background-image: url(img/banner.png);
	min-height: 600px;
	background-size: cover;
	background-position: bottom left;
	position: relative;
	padding-top: 70px;
}
.hero_mobile{
	display: none;
}
.hero_mobile .detail{
	background-color: #fffffff2;
	padding: 20px;
	max-width: 800px;
}
.hero_mobile .detail h2{
	color: var(--main_color);
	font-size: 24px;
	margin-bottom: 30px;
	font-weight: 600;
	font-family: "Comfortaa", sans-serif;
}
.hero_mobile .detail p{
	font-size: 18px;
}
.hero_mobile .detail a.btn{
	background: var(--main_color);
	color: #fff;
	border-radius: 30px;
	padding: 10px 35px;
	margin-top: 20px;
}
.hero .detail{
	background-color: #eeecec;
	padding: 50px;
	max-width: 800px;
	border-radius: 0px 20px 20px 0px;
	position: absolute;
	
}
.hero .detail h2{
	color: var(--main_color);
	font-size: 40px;
	font-weight: 600;
	margin-bottom: 30px;
	font-family: "Comfortaa", sans-serif;
}
.hero .detail p{
	font-size: 20px;
}
.hero .detail a.btn{
	background: var(--main_color);
	color: #fff;
	border-radius: 30px;
	padding: 7px 25px;
	margin-top: 10px;
	font-size: 20px;
}

/*why_us*/

.why_us{
	padding-top: 70px;
}
.why_us h3{
	color: var(--main_color);
	font-size: 26px;
	margin-top: 10px;
	font-family: "Comfortaa", sans-serif;
	font-weight: 600;
}
.why_us p{
	font-size: 20px	;
}
.why_us{
	padding-left: 30px;
	padding-right: 30px;
}
.why_us .consultan_box .img .img{
	position: absolute; 
	width:200px; 
	top: -10px;
	z-index: 99;
}
.why_us .consultan_box .img .img.last{
	position: absolute;
	  width: 225px;
	  top: -6px;
	  left: -21px;
}
.why_us .consultan_box .img .img.right{
	position: absolute;
  width: 260px;
  top: -5px;
  z-index: 99;
  right: 0;
}
.why_us .consultan_box .img .before_img{
	position: absolute;
	  bottom: 71%;
	  left: 0;
	  height: 147px;
	  z-index: 1;
}
.why_us .consultan_box{
	margin-bottom: 80px!important;
}
.why_us .consultan_box .content{
	padding-left: 150px;
	  border-radius: 20px;
	  min-height: 150px;
	  justify-content: center;
	  display: flex;
	  flex-direction: column;
	  box-shadow: 0px 10px 8px 0px #0000003b;
}
.why_us .consultan_box .content.right{
	padding-left: 30px!important;
	padding-top: 30px;
	padding-bottom: 30px;
	padding-right: 200px;
	  border-radius: 20px;
	  min-height: 150px;
	  justify-content: center;
	  display: flex;
	  flex-direction: column;
	  box-shadow: 0px 10px 8px 0px #0000003b;
}

/*approach*/
.approach{
	padding-bottom: 70px;
}
.approach p{
	font-size: 20px	;
}
.approach .item{
	padding: 20px;
	border-radius: 20px;
	background-image: linear-gradient(to bottom right, #e2c7f1, #fbfcfe);
	margin-top: 20px;
	box-shadow: 0px 10px 8px 0px #0000003b;
}
.approach .item h3{
	color: var(--main_color);
	font-family: "Comfortaa", sans-serif;
	font-weight: 600;
	margin-top: 15px;
}
.approach .item p{
	font-size: 20px;
}
.approach .item img{
	height: 150px;
}
.approach a.btn{
	background: var(--main_color);
	color: #fff;
	border-radius: 30px;
	padding: 10px 35px;
	margin-top: 20px;
	width: auto;
	margin: auto;
	margin-top: 40px;
	font-size: 20px;
}

/*assessment*/

.assessment p.sub_t{
	max-width: 700px;
	margin-top: 40px;
}
.assessment p{
	font-size: 20px;
}
.assessment img{
	margin-top: -100px;
}
.assessment a.btn{
	background: var(--main_color);
	color: #fff;
	border-radius: 30px;
	padding: 10px 35px;
	margin-top: 20px;
	width: auto;
	font-size: 20px;
}
.assessment ul{
	list-style: none;
	padding: 0px;
}
.assessment ul li{
	display: flex;
	align-items: center;
	margin-top: 30px;
}
.assessment ul li span{
	background: #2a0848;
	border-radius: 50% 50% 50% 50% / 60% 60% 40% 40%;
	height: 80px;
	width: 80px;
	display: flex;
	justify-content: center;
	align-items: center;
	font-size: 30px;
	color: #fff;
	z-index: 9;
}
.assessment ul li p{
	background-image: linear-gradient(to top right, #e4cbf2, #fcfdfa) !important;
	  display: flex;
	  padding-left: 60px;
	  align-items: center;
	  padding-top: 10px;
	  padding-right: 30px;
	  padding-bottom: 10px;
	  margin-left: -36px;
	  margin-bottom: 0px;
	  font-size: 28px;
	  border-radius: 0px 40px 40px 0px;
	  box-shadow: 4px 6px 0px 0px #3d1764;
	  margin-top: -4px;
}
.assessment ul li:nth-last-child(2) span{
  background: #68245a;
}
.assessment ul li:nth-last-child(3) span{
  background: #996c0b;
}
.assessment ul li:last-child span{
  background: #006962;
}
.assessment ul li:nth-last-child(2) p{
  background-image: linear-gradient(to top right, #e1b8b8, #fcfdfa) !important;
  box-shadow: 4px 6px 0px 0px #68245a!important;
}
.assessment ul li:nth-last-child(3) p{
  background-image: linear-gradient(to top right, #f6dfae, #fcfdfa) !important;
  box-shadow: 4px 6px 0px 0px #996c0b!important;
}
.assessment ul li:last-child p{
  background-image: linear-gradient(to top right, #c3e4e5, #fcfdfa) !important;
  box-shadow: 4px 6px 0px 0px #006962!important;
}

/*support*/
.support{
	padding-top: 70px;

}
.support .box{
	display: flex;
	align-items: center;
	gap: 20px;
	margin-top: 20px;
	margin-bottom: 30px;
}
.support .box p{
	font-size: 28px;
	margin-bottom: 0px;
}
.support p{
	font-size: 20px;
}
.support .box img{
	width: 100%;
}
.support .item{
	text-align:center;
	margin-bottom:30px;
}
.support .item img{
	height: 140px;
	margin-bottom: 20px;
}
.support .why h3{
	color: var(--main_color);
	margin-top: 40px;
	margin-bottom: 40px;
	font-size: 30px;
}
.support a.btn{
	background: var(--main_color);
	color: #fff;
	border-radius: 30px;
	padding: 10px 35px;
	margin-top: 20px;
	width: auto;
	margin: auto;
	margin-top: 40px;
	font-size: 20px;
}

 /*get_touch*/

.get_touch {
	padding-bottom: 100px;
}
.get_touch p{
	font-size: 24px;
	margin-top: 30px;
}
.get_touch .button{
	display: flex;
	justify-content: center;
}
.get_touch a.btn{
	background: var(--main_color);
	color: #fff;
	padding: 10px 30px;
	border-radius: 40px;
	font-size: 20px;
}
footer{
	background: var(--main_color);
	padding-top: 50px;
}
footer .socail ul{
	list-style: none;
	display: flex;
	padding: 0px;
	gap: 20px;
	margin-top: 20px;
}
footer .socail ul a{
	color: #fff;
	font-size: 36px;

}
footer .links{
	margin-bottom: 20px;
}
footer .links ul{
	list-style: none;
	padding: 0px;
}
footer .links ul li{
	margin-bottom: 10px;
}
footer .links ul li a{
	color: #fff;
	font-size: 20px;
}
footer .links p{
	font-size: 24px ;
	color: #fff;

}
footer .newsletter{
	align-items: end;
	margin-bottom: 20px;
	margin-top: 20px;
}
footer .newsletter form{
	position: relative;
	margin-bottom: 20px;
}
footer .newsletter p{
	font-size: 24px;
	color: #fff;
}
footer .newsletter input{
	width: 100%;
	height: 45px;
	padding-left: 10px;
	outline: none;
}
footer .newsletter button{
	background-color: #10776f;
  padding: 6px 15px;
  position: absolute;
  border-radius: 0px;
  right: 3px;
  color: #fff;
  top: 56px;

}
footer .newsletter button:hover{
	background-color: #10776f;
	color: #fff;

}
footer .copright p{
	margin-bottom: 0px;
	color: #fff;
	font-size: 18px;
	margin-bottom: 10px;
}
footer .copright .button{
	display: flex;
	justify-content: end;
	gap: 10px;
}
footer .copright .button .join{
	background: #d7b25d;
	color: var(--main_color);
	border-radius: 40px;
	padding: 5px 15px;
}
footer .copright .button .help	{
	background: #fff;
	color: var(--main_color);
	border-radius: 40px;
	padding: 5px 15px;
}
.organisation{
	padding-top: 130px;
	padding-bottom: 70px;
}
.organisation .button{
	display: flex;
	justify-content: center;
	margin-top: 20px;
}
.organisation a.btn{
	background: var(--main_color);
	color: #fff;
	padding: 10px 30px;
	border-radius: 40px;
	font-size: 20px;
}
.owl-carousel .owl-nav button.owl-prev,
.owl-carousel .owl-nav button.owl-next {
	z-index: 1;
	width: 40px;
	height: 40px;
	background-color: var(--main_color);
	position: absolute;
	color: #fff;
	top: calc(50% - 10px);
	transform: translatey(-50%);
}
.owl-carousel .owl-nav button.owl-prev:hover,
.owl-carousel .owl-nav button.owl-next:hover {
	
	background-color: var(--main_color);
	position: absolute;
}
.owl-nav button {
	display: flex;
	justify-content: center;
	align-items: center;
}
.owl-nav button span {
	font-size: 30px;
	height: 100%;
	display: block;
	width: 100%;
	margin-top: -15px;
}
.owl-carousel .owl-nav button.owl-prev {
	left: -10px;
}
.owl-carousel .owl-nav button.owl-next {
	right: -10px;
}
.mobile_logos{
	display: none;
}
@media screen and (max-width: 992px) {
	.mobile_hide{
		display: none;
	}

}
@media screen and (max-width: 767px) {
	.top{
		display: none;
	}
	.mobile_hide{
		display: none;
	}
	.heading_title{
		font-size: 32px;
		color: var(--main_color);
	}
	.get_touch p {
	  font-size: 18px;
	  margin-top: 30px;
	}
	 .why_us p {
	  font-size: 18px;
	}
	.why_us h3 {
	  color: var(--main_color);
	  font-size: 26px;
	  margin-top: 10px;
	}
	.owl-carousel .owl-nav button.owl-prev,
	.owl-carousel .owl-nav button.owl-next {
		display: none;
	}
	.why_us{
		padding-top: 50px;
		padding-bottom: 0px;
	}
	.why_us .mobile{
		display: flex;
		gap: 20px;
		align-items: center;
	}
	.why_us .mobile h3{
		display: block;
	}
	.hero_mobile{
		display: block;
	}
	.hero{
		display: none;
	}
	.organisation {
	  padding-top: 50px;
	  padding-bottom: 0px;
	}
	.content section{
		padding-left: 10px;
		padding-right: 10px;
	}
	.training {
	  padding-top: 50px;
	  padding-bottom: 0px;
	  padding-left: 20px!important;
	  padding-right: 20px!important;
	}
	.content section.hero_mobile{
		padding-left: 0px!important;
		padding-right: 0px!important;
	}
	.owl-carousel{
		display: none!important;
	}
	.mobile_logos{
		
		  display: block;
	}
	.mobile_logos .logo{
		display: grid;
		  flex-wrap: wrap;
		  grid-column: 30% 30% 30%;
		  grid-template-columns: 33% 33% 33%;s
	}
	.hero_mobile .detail a.btn {
	  background: var(--main_color);
	  color: #fff;
	  border-radius: 30px;
	  padding: 10px 35px;
	  margin-top: 10px;
	  width: 100%;
	}
	a.btn {
	  width: 100%;
	}
	header .desktop_logo{
		display: none;
	}
	header .mobile_logo{
		display: block;
		max-width: 210px;
	}
	header .mobile_logo img{
		max-width: 210px;
	}
	.why_us .consultan_box .content{
		padding-top: 160px!important;
		padding: 20px;
	}
	.why_us .consultan_box .img .img{
		right: 0;
	    width: 280px !important;
	    top: -90px;
	}
	.why_us .consultan_box .content{
		z-index: 9;
		margin-bottom: 30px !important;
	}
	.why_us .consultan_box .content.right{
		padding-top: 30px!important;
		padding-bottom: 180px!important;
		padding: 20px;
	}
	.why_us .consultan_box.first{
		margin-top: 130px!important;
	}
	.why_us .consultan_box .img .before_img {
	    bottom: 97%;
	    left: 37%;
	    height: 146px;
	    z-index: 1;
	}

	.why_us .consultan_box .img .img.last {
	  position: absolute;
	  right: 0!important;
	    width: 315px !important;
	    top: -90px;
	    left: auto;
	}
	.why_us .consultan_box .img .img.right {
	  position: absolute;
	  right: 0%!important;
	    width: 280px !important;
	    top: auto!important;
	    bottom: -110px!important;
	    left: auto;
	}
	.support .item{
		display: flex;
		text-align: unset;
		align-items: center;
		gap: 20px;
	}
	.support .item img{
		height: 100px;
	}
	.support .box{
		flex-direction: column;
		gap: 10px;
	}
	.assessment ul li span{
		width: 110px;
		height: 110px;
	}
	.assessment ul li p{
		font-size: 24px;
		width: 80%;
	}
	.assessment img{
		margin-top: 20px;
	}
	.assessment .btn{
		width: 100%!important;
	}
	.approach{
		padding-bottom: 70px;
		padding-top: 60px;
	}
	.approach .item{
		position: relative;
		padding-top: 100px;
		margin-top: 40px;
	}
	.approach .item img{
		position: absolute;
		top: -50px;
		right: 0px;
	}
	.approach .btn{
		width: 100%!important;
	}
	.assessment ul li p{
		font-size: 18px;
	}
}
@media screen and (min-width: 767px) {
	.approach .item{
		height: 100%;
		padding-bottom: 0px!important;
	}
	.approach a.btn{
		margin-top: 60px;
	}
}