@charset "utf-8";
/* CSS Document */
html, body {
  height: 100%;
  margin: 0;scroll-behavior: smooth;
}
/*Home page Starts*/
.bg-light {background-color: #fcd5ce!important;}
.bg{background-color: transparent !important;}
.navbar-brand {font-family: 'Mulish', sans-serif; font-weight: 600; font-size: 25px; width:87%;}
.navbar-nav .active{text-decoration: underline;}
.navbar-light .navbar-nav .nav-link {color:#000000;font-size: 16px;}
.nav-contact{ background-color: #000000;}
.nav-contact a{color:#fff !important;}
.nav-link { padding-right: 0px !important; padding-left: 50px !important; padding-top: 10px; padding-bottom: 10px;font-family: 'Mulish', sans-serif;font-size: 15px;font-weight: 500;}
.title p{font-family: 'Mulish', sans-serif;  font-size: 21px; margin-bottom: 20px; line-height:32px; font-weight: 400;}
.explorebutton{text-align: center;}
.explorebutton a{color: #fff; background-color: #000; padding: 15px; border-radius: 10px;}
.title-img p{font-family: 'Mulish', sans-serif;  font-size: 18px; text-align: center; font-style: italic;}


/*about Page Starts*/
.bg-light-about{background-color:#e9ecd1;}
.about_section{background-color:#e9ecd1;padding: 80px;}
.about h2{font-family: 'Mulish', sans-serif; font-weight: 600; font-size: 35px;margin-bottom: 20px;}
.about p{font-family: 'Mulish', sans-serif;  font-size: 18px; margin-bottom: 20px; line-height:32px;}
.skills_section{background-color:#e6e2ff;padding: 50px 30px;}
.skills-heading h2{font-family: 'Mulish', sans-serif; font-weight: 600; font-size: 35px;margin-bottom: 30px; text-align: left;}
.skills h2{font-family: 'Mulish', sans-serif; font-weight: 600; font-size: 26px;margin-top: 20px;}
.skills img{width: 100%;}
.skills p{font-family: 'Mulish', sans-serif;  font-size: 18px;  line-height:32px; text-align: left;}
.client_section{background-color:#fff;padding: 80px;}
.clients-heading h2{font-family: 'Mulish', sans-serif; font-weight: 600; font-size: 35px;margin-bottom: 30px; text-align:left;}
.clients p{font-family: 'Mulish', sans-serif;  font-size: 26px;  line-height:36px; text-align: center;}
.chat_section{background-color:#000;padding: 50px 80px;}
.get-in-touch h2{font-family: 'Mulish', sans-serif; font-weight: 600; font-size: 35px;margin-bottom: 10px; text-align: left; color: #fff;}
.get-in-touch a{font-family: 'Mulish', sans-serif;  font-size: 16px; margin-bottom: 20px; line-height:36px; color: #fff;}
.get-in-touch a:hover{text-decoration: none;}
.get-in-touch ul {padding: 0px;margin: 0px;}
.get-in-touch ul li {list-style: none;width: max-content;float: left;margin-right: 25px;}
.get-in-touch ul li a{font-family: 'Mulish', sans-serif; font-weight: 600; font-size: 20px;margin-bottom: 20px; color:#fff;}
.get-in-touch ul li a:hover{text-decoration: none;}
.about a{font-family: 'Mulish', sans-serif;  font-size: 16px; margin-bottom: 20px; line-height:36px; color: #000000;font-weight:600;}
.about a:hover{text-decoration: none;}
.about-img{padding: 50px; padding-top:0px !important;}
.about-img img{width: 90%;}
.title-img{padding: 50px; padding-top: 0px;text-align: center;}
.title-img img{width: 90%;}

/*Project descriptions Starts*/
.title_section{background-color:#fcd5ce;display: flex;justify-content: center;align-items: center;height: 100vh;}
.heading{font-weight: bold; margin-bottom: 20px;color: #3845bb;font-size: 52px;}
.client-work{margin-bottom: 70px;}
.projects_section{padding-top:150px;background-color: #faf3dd;}
.project{margin-bottom: 10px;}
.project img{width: 100%;}
.title h2{font-family: 'Mulish', sans-serif;  font-size: 23px; text-align: left;line-height: 1.5;font-weight: 100;}
.project-description{padding-top: 10px; margin-bottom: 70px;}
.project-description a h1{font-family: 'Mulish', sans-serif; color: #000; font-size: 23px; font-weight: bold;}
.project-description a h2{font-family: 'Mulish', sans-serif; font-size: 16px; margin-bottom: 3px;line-height: 24px;color: #000;}
.project-description a p{font-family: 'Mulish', sans-serif; font-size: 18px; text-align: left;color: #000;}
.project-description a:hover{text-decoration: none;}
.project-title{padding-top: 50px; padding-bottom: 20px; text-align: center; }
.project-title h2{line-height: 45px;font-family: 'Mulish', sans-serif;font-size: 41px;font-weight: 100;}
.project-title p{line-height: 45px;font-family: 'Mulish', sans-serif;font-size:30px;font-weight: 100; margin-bottom: 0px;}
.project-title a{line-height: 45px;font-family: 'Mulish', sans-serif;font-size:30px;font-weight: 100; color: #000;text-decoration: underline;}
.project-title h3{line-height: 45px;font-family: 'Mulish', sans-serif;font-size: 30px;font-weight: 100;text-align: left;}

.role{ margin-bottom: 12px;}
.role p{font-family: 'Mulish', sans-serif;  font-size: 18px; text-align: left; margin-bottom: 10px; }
.role h6{font-family: 'Mulish', sans-serif;  font-size: 20px; text-align: left; margin-bottom: 10px; font-weight: 600;}
.role ul{margin: 0; padding-left: 15px;}
.role li{font-family: 'Mulish', sans-serif;  font-size: 18px; text-align: left; margin-bottom: 0px;}
.asa {background-color: #ffeed7;padding: 50px 0px;margin: 50px 0px;}
.design{margin-bottom: 15px;}
.design ul li img{width: 60px;height:60px; margin-bottom: 10px; margin-top: 10px;}
.design h6{font-family: 'Mulish', sans-serif;text-align: left;font-weight: 500;}
.design h5{font-family: 'Mulish', sans-serif;text-align: left;font-weight: 800;}
.design h4{font-family: 'Mulish', sans-serif;text-align: left;font-weight: 500;}
.design h2{font-family: 'Mulish', sans-serif;}
.design p{font-family: 'Mulish', sans-serif;  font-size: 18px; text-align: left; float: none; clear: both; margin-bottom: 10px;}
.design a{font-family: 'Mulish', sans-serif;  font-size: 18px; text-align: left; color: #830303;font-weight: 600;}
.design img{width: 100%;}
.design ul{margin: 0; padding: 0; padding-left: 20px;}
.design ul li{font-family: 'Mulish', sans-serif;  font-size: 18px; text-align: left;margin-right: 20px; list-style: disc;}
.design ul li span{font-family: 'Mulish', sans-serif;  font-size: 19px; text-align: left;font-weight: 600;}
.design1 ul{margin: 0; padding: 0; padding-left: 20px;}
.design1 ul li{font-family: 'Mulish', sans-serif;  font-size: 18px; text-align: left;margin-right: 20px; list-style: disc;}
.design1 ul li span{font-family: 'Mulish', sans-serif;  font-size: 19px; text-align: left;font-weight: 600;}
.design1 h6{font-family: 'Mulish', sans-serif;text-align: left;font-weight: 500;}
.asa2 {background-color: #b5c99a;padding: 50px 0px;margin: 50px 0px;}
.asa3 {background-color: #ddbea9;padding: 50px 0px;margin: 50px 0px;}
.asa4 {background-color: #b6d4d2;padding: 50px 0px;margin: 50px 0px;}
.design1 p{font-family: 'Mulish', sans-serif; font-size: 18px; text-align: left; float: none; clear: both; margin-bottom: 15px}
.design1 h4{font-family: 'Mulish', sans-serif;text-align: left;font-weight: 500; color: #000;}
.design1 img{width: 100%;}
.design2{margin-top: 20px;}
.design2 img{width: 100%;}
.weblink{padding: 20px 0px;}
.weblink h5{font-family: 'Mulish', sans-serif;text-align: center;font-weight: 500; color: #000;}
.weblink a{font-family: 'Mulish', sans-serif;text-align: center;font-weight: 500; color: #000;}
.broderie {background-color: #f3e0e3;padding: 50px 0px;margin-top: 50px; margin-bottom: 50px;}
.broderie2 {background-color: #ebf3e0;padding: 50px 0px;margin-top: 50px; margin-bottom: 50px;}
.class{background-color: #d8e2dc;padding: 50px 0px;margin-top: 50px; margin-bottom: 50px;}
.class2{background-color: #c2ceea;padding: 50px 0px;margin-top: 50px; margin-bottom: 50px;;}
.class3{background-color: #ead8c2;padding: 50px 0px;margin-top: 50px; margin-bottom: 50px;}
.layouts img{width: 100%;margin-bottom: 10px;}
.layout{text-align: center;}
.layout img{width: 70%; text-align: center;}
.layout p{margin-top: 10px;}
.layout a{font-family: 'Mulish', sans-serif;  font-size: 18px; text-align: left; color: #830303;font-weight: 600;}
.layout1 img{width: 100%; text-align: center; margin-bottom: 20px;}
.layout2 h6{font-family: 'Mulish', sans-serif;  font-size: 20px; text-align: left; margin-bottom: 10px; font-weight: 600;}
.layout2 img{width: 100%; text-align: center; margin-bottom: 20px;}
.layout2 a{font-family: 'Mulish', sans-serif;  font-size: 18px; text-align: left; color: #830303;font-weight: 600;}
.research{background-color: #dad8e2;padding: 50px 0px;margin-top: 50px; margin-bottom: 50px;}
.research2{background-color: #edd3d3;padding: 50px 0px;margin-top: 50px; margin-bottom: 50px;}
.list-items{margin-bottom: 20px;}
.list-items h4{font-family: 'Mulish', sans-serif;font-weight: 500;}
.list-items ul {padding: 0px;margin: 0px;}
.list-items ul li {list-style: none; font-size:18px;}
.layout3{text-align: center;}
.layout3 img{width: 94%; text-align: center; margin-bottom: 20px;}
.layout4{text-align: left;}
.layout4 img{width: 40%; text-align: center; margin-bottom: 20px;}
.images{margin-bottom: 30px;}
.dreamroot{background-color: #fff5ce;padding: 50px 0px;margin: 50px 0px;}
.dreamroot-designsystem img{width: 60%;margin-bottom: 30px;}
.metra1{margin-top: 20px;}
.metra1 h5{font-family: 'Mulish', sans-serif;text-align: left;font-weight: 800;}
.metra1 p{font-family: 'Mulish', sans-serif;  font-size: 18px; text-align: left; float: none; clear: both; margin-bottom: 10px;}
.metra1 ul{display: block;margin: 0; padding: 0; margin-top: 10px;}
.metra1 ul li{font-family: 'Mulish', sans-serif;  font-size: 18px; text-align: left;margin-right: 20px; list-style: disc; list-style-position: inside;}
.metra1 a {font-family: 'Mulish', sans-serif;font-size: 18px;text-align: left;color: #830303; font-weight: 600;}
.metra1 img{width: 100%; text-align: center;}
.acessibility-homeproducts{background-color: #cfe5e6;padding: 50px 0px;margin: 50px 0px;}
.acessibility-homeproducts1{background-color: #ffdcdc;padding: 50px 0px;margin: 50px 0px;}
.acessibility-homeproducts2{background-color: #f8eaff;padding: 50px 0px;margin: 50px 0px;}
.obs-img {width:40% !important;}
.comp-img {width:60% !important; margin-bottom: 15px;}
.side_section {padding-top: 150px; padding-bottom:150px; background-color: #aecdd8;}
.design-images {margin-bottom: 50px;}
.design-images img{width:100%;}

/*blog Page Starts*/
.bg-light-blog{background-color:#d5d0eb;}
.blog_section{background-color:#d5d0eb;padding: 40px 80px;}
.blog h2{font-family: 'Mulish', sans-serif; font-weight: 600; font-size: 35px;margin-bottom: 20px;}
.blog p{font-family: 'Mulish', sans-serif;  font-size: 18px; margin-bottom: 20px; line-height:32px;}
.blogtopic {margin-bottom: 40px;}
.topics_section{background-color:#fff;padding: 80px;}
.blogtopic img{width: 100%;}
.blogtopic h4 a{font-family: 'Mulish', sans-serif; margin-bottom: 30px; text-align:left; margin-top: 10px; font-size: 20px; line-height: 30px; color:#000;}

/*work Page Starts*/
.bg-light-work{background-color:#d0e3eb;}
.work_section{background-color:#d0e3eb;padding: 40px 80px;}
.work h2{font-family: 'Mulish', sans-serif; font-weight: 600; font-size: 35px;margin-bottom: 20px;}
.work p{font-family: 'Mulish', sans-serif;  font-size: 18px; margin-bottom: 20px; line-height:32px;}
.workprojects_section{margin-top: 50px;;}

/*Contact Page Starts*/
.bg-light-contact{background-color:#d1f5cc;}
.contact_section{background-color:#d1f5cc;padding: 40px 80px; padding-bottom: 0px;}
.schedulebutton{text-align: left; }
.schedulebutton a{color: #fff; background-color: #000; padding: 15px; border-radius: 10px;}
.contactwork_section{background-color:#ccd7f5;padding: 50px 80px; padding-bottom: 0px;;}

/*Article Page Starts*/
.article_description{padding: 50px 0px;}
.article-title {text-align: left; margin-bottom: 30px;}
.article-title h3{font-family: 'Mulish', sans-serif; font-weight: 700;}
.article-title p{font-family: 'Mulish', sans-serif; font-size: 18px; line-height: 32px;}
.article-content {margin-bottom: 20px;}
.article-content h5{font-family: 'Mulish', sans-serif; font-weight: 700;}
.article-content p{font-family: 'Mulish', sans-serif; font-size: 18px; line-height: 32px;}
.article-content ul li{font-family: 'Mulish', sans-serif;  font-size: 18px; line-height: 32px;}








@media screen and (max-width: 1169px){
.title {padding: 50px 0px;}
.navbar-brand {width:85%;}
.about-img img {width: 100%;}
.about-img{padding: 0px;}	
.about h2{font-size: 30px;}
.about p{font-size: 18px;}
.skills-heading h2{font-size: 30px;}
.skills p{font-size: 18px;}
.clients-heading h2{font-size: 30px;}
.get-in-touch h2{font-size: 30px;}	
.clients p{font-size: 25px;}	
.title h2{font-size: 36px;}
}
@media screen and (max-width: 1024px){
.navbar-brand {width:80%;}
.obs-img {width:50% !important;}
.comp-img {width:70% !important; margin-bottom: 15px;}

}
@media screen and (max-width: 991px){
.nav-link{padding-left: 0px !important;}
.about-img {text-align: center;margin-bottom: 20px;}
.about-img img {width: 45%;}
.about_section{padding: 50px 0px;}
.contact_section{padding: 50px 0px;}
.contactwork_section{padding: 50px 0px;}
.design{margin-bottom: 20px;}
.project {margin-bottom: 20px;}
.projects_section{padding-top: 100px; padding-bottom: 10px;}
.order{order:1;}
.client-work{margin-bottom: 80px;}
.project-description{padding-top: 0px;}
.heading{font-size: 55px;}
.design1 img{margin-top: 20px;}
.dreamroot-designsystem img{width: 100%;margin-bottom: 30px;}
.title-img{display: none;}
.explorebutton{text-align: left;}
.blog_section{padding: 50px 10px;}
.topics_section{padding: 50px 10px;}
.skills{margin-bottom: 50px;}
.work_section{padding: 50px 10px;}
.blogtopic{margin-bottom: 50px;}


@media screen and (max-width: 767px){
.about-img img {width: 60%;}
.skills_section{padding: 80px 0px;}
.client_section{padding: 80px 0px;}
.chat_section{padding: 50px 0px;}
.title h2{font-size: 26px;}
.project-description h1{font-size: 33px;}
.heading{font-size: 50px;}
.project-title h2{line-height: 48px;font-size: 29px;}
.role{margin-bottom: 20px;}
.obs-img {width:100% !important;}
.comp-img {width:100% !important; margin-bottom: 15px;}

}
@media screen and (max-width: 479px){
.clients-heading h2{text-align: left;}
.clients p{text-align: left;font-size: 22px;}
.blog h2{font-size: 30px; margin-bottom: 0px;}
.work h2{font-size: 30px; margin-bottom: 0px;}
}

@media screen and (max-width: 414px){
.about-img img {width: 70%;}
.get-in-touch ul li{float: none;}
.get-in-touch h2{margin-bottom: 20px;}
.heading {font-size: 43px;}
}

@media screen and (max-width: 414px){
.navbar-brand {width: 70%;}
}