html{
	font-size: 62.5%;
	scroll-behavior: smooth;
}
body{
	margin:0px;
	padding:0px;
}
*{
	box-sizing: border-box;
}
:root{
	--primary:#7d01d5;
	--secondary:#011ad9;
	--white_gray:#a1aed4;
	--hero_height:65rem;
	--heading_family:'Josefin Slab', serif;
	--text_family:'Open Sans', sans-serif;
}

h1,h2,h3,h4,h5,h6{
	font-family:var(--heading_family);
	margin:0;padding:0;
}
p{
	font-family:var(--text_family);
	margin:0;padding:0;
}

/*navbar */
.logo_image{
	max-width: 12rem;
}
.navbar{
	background: white;
	webkit-shadow:rgba(0,0,0,.25) 0 3px 11px 0!important
	height: 8.4rem;
	-webkit-box-shadow: rgba(0,0,0,.25) 0 3px 11px 0!important;
	z-index: 2!important;
	margin-top:0;
}
.nav-item{

    margin:.5rem 1rem;
    padding:0rem!important;
}
.nav-link{
	color: var(--white_text);
    line-height: 2.6rem;
    font-size: 1.5rem;
    position: relative;
    text-transform: capitalize;
    -webkit-transition: all linear 0.3s;
    transition: all linear 0.3s;
    font-family:var(--text_family);
  transition: color 0.3s ease;
}

.nav-link:before {
  content: "";
  position: absolute;
  bottom: 0px;
  left: 0;
  width:100%;
  height: 1px;
  background-color: var(--primary);
  visibility: hidden;
  transform: scaleX(0);
  margin:0 auto;
  transition: all 0.3s ease-in-out 0s;
}
.nav-link:hover:before {
  visibility: visible;
  transform: scaleX(.9);
}


.nav-link:hover{
	color:var(--primary);
}

.cta-btn{
	background:var(--primary);
	color:white!important;
	border-radius: .6rem;
	margin:0rem!important;
}
.cta-btn .nav-link{
	color:white;
	font-weight: 800;
	padding:1rem 2rem!important;
	font-family: var(--text_family);
	letter-spacing: .1rem;
	margin-top:0;

}

.cta-btn:hover{
	background:var(--secondary);
}
.cta-btn:hover .nav-link{
	color:white;
}
.navbar.sticky_navigation {
/*	padding:1.5rem 0rem;*/
	box-sizing: border-box;
	background: white;
}
.sticky_navigation {
	margin-top:0rem!important;  
	width: 100%;
	z-index: 999;
	-webkit-box-shadow: 0 2px 28px 0 rgba(0, 0, 0, 0.09);
	box-shadow: 0 2px 8px 0 rgba(0, 0, 0, 0.09);
	-webkit-animation: 500ms ease-in-out 0s normal none 1 running fadeInDown;
	animation: 500ms ease-in-out 0s normal none 1 running fadeInDown;
}
.sticky_navigation .navbar {
	margin-top: 0px!important;
/*	padding:auto 1rem!important;*/
}
.mto0{
	margin-top:0px!important;
}

@-webkit-keyframes fadeInDown {
  0%{
    opacity: 0;
    -webkit-transform: translateY(-20px);
   }
    100% {
    opacity: 1;
    -webkit-transform: translateY(0);
    }
}    
 
      
.fadeInDown {
  -webkit-animation-name: fadeInDown;
  animation-name: fadeInDown;
}
.close_icon{display: none;}
.navbar-toggler{
	color:var(--primary);
	font-size: 2.5rem;
	text-shadow: none;
}
.navbar-toggler:focus {
    text-decoration: none;
    outline: 0;
    box-shadow:none;
}
.nav-link.active{

  color:var(--primary);
}
.cta-btn .nav-link.active{
	color: white!important;
}
.nav-link.active:before {
  content: "";
  position: absolute;
  bottom: 1px;
  left: 0;
  width:100%;
  height: 1px;
  background-color: var(--primary);
  visibility: hidden;
  transform: scaleX(0);
  margin:0 auto;
  transition: all 0.3s ease-in-out 0s;
}
.nav-link.active:before {
  visibility: visible;
  transform: scaleX(.8);
}
/*navbar end*/

.margintop_space{
	margin-top: 7.8rem;
}
.hero_section{
	width:100%;
	height: var(--hero_height);
/*	background:url(../images/Clear_view_drafting_hero.png);*/
background:linear-gradient(rgba(0, 0, 0, .8),rgba(0, 0, 0, .8)), url(../images/hero_image.png);
	background-size: cover;
	background-position: center top;
	position: relative;
}
.hero_area{
	height: var(--hero_height) ;
	position: relative;
	display: flex;
	align-items: center;
}
.py_8{
	padding:8rem 0;
}

.hero_heading{
	font-size:9rem;
	font-weight:1000;
	color:white;
	line-height: 5rem;
}
.hero_desc{

	font-size:3rem;
	font-weight:400;
	color:white;
	opacity: .9;
	margin:2rem 0;
}
.hero_btn{
	padding:1.5rem 3rem;
	background: var(--primary);
	color:white;
	text-decoration: none;
	font-size:2rem;
	font-weight:600;
	letter-spacing: .1rem;
	border-radius: .6rem;
}
.hero_btn:hover{
	background: var(--secondary);
	color:white;
}
.blue_banner{
	background: var(--primary);
	padding:2rem;
	}
.blue_banner h2{
	color:white;
	text-align: center;
	font-size: 3rem;
	letter-spacing: .1rem;
	font-weight: 800;

}
.section_space{
	width:100%;
	height: auto;
	padding:5rem 0rem;
	display: flex;
	align-items: center;
}
.sec_hr{
	width:20%;
	background: var(--primary);
	margin:0 auto;
	opacity: 1;
	border:.2rem solid var(--primary);
}


.home_service_left{
	min-height:78rem;
	background: url(../images/service_left.jpg);
	background-size: cover;
	background-position: center;
}
.forflex{
	display: flex;
	align-items: center;
}

.service_desc_box{
	background: white;
	padding:4rem 2rem;
	box-sizing: border-box;
	-webkit-box-shadow: rgba(0,0,0,.25) 0 3px 11px 0!important;
	margin-left:-3rem;
}

.sec_sub_heading{
	font-size: 2.5rem;
	color:balck;
	font-weight: 1000;
}

.gen_p{
	font-size: 1.6rem;
	color:black;
}
.heading_hr{
	width:30%;
	background: var(--primary);
	opacity: 1;
	border:.2rem solid var(--primary);
	margin:1rem 0;

}
.servic_list li{
	display:block;
	list-style: none;
	margin-bottom: 1rem;
}
.servic_list li a{
	width:20rem;
	height: 5rem;
	border:.2rem solid var(--primary);
	display: inline-block;
	text-align: center;
	text-decoration: none;
	font-size: 1.7rem;
	font-weight: 600;
	line-height: 4.5rem;
	color:black;
	text-transform: capitalize;
}

.servic_list li a:hover{
	background: var(--secondary);
	color:white;
	border:.2rem solid var(--secondary);
}

.testimonial_section{
	width:100%;
	background:url(../images/testimonial_bg.jpg);
	background-position: center;
	background-attachment: fixed;
	padding:8rem 0;
}

.testi_box{
	background:white;
	-webkit-box-shadow: rgba(0,0,0,.25) 0 3px 11px 0!important;
	max-width: 90rem;
	margin:0 auto;
	padding:4rem;
}
.testi_desc{
	font-size:2.2rem;
	text-align: center;
	color:black;
	opacity: .7;
}

.testi_name{
	font-size: 2.4rem;
	text-align: center;
	font-weight: 1000;
	margin-top:1.5rem;
}
.quote_icon{
	width:6rem;
	height: 6rem;
	background: var(--primary);
	border-radius: .7rem;
	color:white;
	margin:0 auto;
	margin-top:-7rem;

}
.quote_icon i{
	font-size: 4rem;
	color:white;
	text-align: center;
	line-height:6rem;
	display:block;
}
.py_6{
	padding:7rem 0;
}
.sub_heading{
	font-size: 3.5rem;
	font-weight: 1000;
}

.offer_card{
	background:#efefef;
	-webkit-box-shadow: rgba(0,0,0,.25) 0 3px 11px 0!important;
	padding:2rem;
	height: 18rem;
	border-radius: .8rem;
}
.offer_cd_title{
	font-size: 2.4rem;
	color:black;
	font-weight: bolder;
	margin-bottom: .5rem;

}

.external_logo{
	max-width: 14rem;
	display: block;
	margin:0 auto;
}
.cdP{
	font-size: 2rem;
	margin-bottom: 1rem;
}

.offer_big_card{
	background:white;
	-webkit-box-shadow: rgba(0,0,0,.25) 0 3px 11px 0!important;
	padding:6rem; 
	border-radius: .8rem;
}

.customized_section{
	width:100%;
	height: 41rem;
/*	background:linear-gradient(rgba(0, 0, 0, .5),rgba(0, 0, 0, .5)),url(../images/closing.jpg);*/
background:url(../images/closing.jpg);
	background-size: 100% 100%;
	display: flex;
	align-items: center;
	justify-content: center;
}
.text_black{
	color:black;
	font-weight: 1000;
	margin-top:5rem;
}

footer{
	background:#efefef;

}

.footer_heading{
	font-size: 2.5rem;
/*	border-bottom: .2rem solid var(--primary);*/
	margin-bottom: 1rem;
	font-weight: bolder;
}
.forlinks a{
	display: block;
	font-size:1.8rem;
	color:black;
	padding-bottom: .5rem;
}
.forlinks a:hover{
	color:var(--secondary);
}


.dropdownlinks ul{
	padding:0;
}
.dropdownlinks ul li .dropdown-item{
	font-size:1.6rem;
	border-bottom: .1rem solid #efefef;
	line-height: 4rem;
	text-transform: uppercase;
}

.dropdownlinks ul li a:hover{
	color:var(--primary);
	background: white;
}


/*about page start*/
.about_hero{
	height:40rem;
	background: url(../images/about_hero_bg.jpg) ;
	background-size: cover;
}
.about_hero_area{
	height: 40rem;
}
.about_hero_bg{
}
.hero_heading_sub{
	font-size:5rem;
	font-weight:1000;
	color:var(--primary);
	line-height: 4rem;
}
.hero_desc_sub{
	font-size:2rem;
	font-weight:400;
	color:black;
	opacity: .9;
	margin:2rem 0;
}
.text-bold{
	font-weight: bolder;
}
.about_desc_left img{
	height: cover;

}
.team_card{
	padding-bottom: 2rem;
	background: #f2f2f2;
	border-radius: .5rem;
}
.team_card img{

width:100%;	;
}

.team_m_name{
	font-size: 2.5rem;
	font-weight: 1000;
	margin:2rem 0;
	margin-bottom: 0;
	text-align: center;
}
.team_m_post{
		font-size: 1.8rem;
	text-align: center;
}

.details_p{
	font-size: 2rem;
}

.common_bg{
	background: #f2f2f2;
	padding:2rem;
	box-sizing: border-box;
	margin:2rem 0;
}
.purple_text{
	color:var(--primary);
}
.store_examples_list li a{
	font-size: 1.8rem;
	text-decoration: none;
	color:var(--secondary);
}
.store_examples_list li a:hover{
	color:var(--primary);
}
.py_8{
	padding:8rem 0;
}

.icon_div{
	width:5rem;
	height: 5rem;
	background: var(--primary);
	margin:0 auto;
	border-radius: 100%;
}
.icon_div i{
	font-size: 2rem;
	line-height: 5rem;
	color:white;
}

.cont_cd_title{
	font-size: 2.5rem;
	font-weight: 1000;
	color:black;
	margin-top:1.5rem;
}

.cont_card{
	padding:3rem 2rem;
	background: #f2f2f2;
	border-radius: 1rem;
	margin: 2rem 0;
	height: 23rem;
}
.cont_card a{
	display: block;
	font-size: 1.8rem;
	color:black;
}
.cont_card a:hover{
	color:var(--primary);
}

.form_box{

	background:white;
	-webkit-box-shadow: rgba(0,0,0,.25) 0 3px 11px 0!important;
	width:100%
	margin:0 auto;
	padding:4rem;
}

.form_box form label{
	font-size: 1.8rem;
	margin-bottom: .3rem;
}
.form_box form input{
	display: block;
	width:100%;
	height: 4.5rem;
	margin-bottom: 2rem;
	border:.1rem solid #dadbdd;
	font-size: 1.7rem;
}
.form_box form textarea{
	display: block;
	width:100%;
	height:10rem;
	margin-bottom: 2rem;
	border:.1rem solid #dadbdd;
	font-size: 1.7rem;
}

.subm_div input{
	width:20rem!important;
	height: 4.5rem;
	background: var(--primary);
	color:white;
	font-size: 2rem;
	font-weight: 700;
	font-family: var(--heading_family);
	letter-spacing: .1rem;
	text-transform: capitalize;
	font-size: 1.7rem;
	margin-top: 0rem;

}
.subm_div input:hover{
	background: var(--secondary);
}

.form_box form input:focus, .form_box form textarea:focus{
	outline: .1rem solid #f2f2f2;
}