@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@400;500&display=swap');
:root {
  --primary: #FFF;
  --secondary: #0b0b0b;
  --tertiary: #6a6c6e;
  --quaternary:#f7f5f5;
  --fifth:#68b33d;
  --sixth:#09273b;
}


body {
  font-family: Poppins;
  color: var(--secondary);
  font-weight: 400!important;
  background-color: var(--primary)!important;
}


.small-icons{
  width:50px;
  height:50px;
  margin-bottom: 15px;
}

.margin-no{
  margin:0px!important;
}
/* Prebuilt menu components*/

/*Light Navigation*/

.nav-link{
  margin-left:15px;
  margin-right:15px;
}

.nav-light{
  background: var(--primary);
  color:var(--secondary);
}

.nav-light .nav-link{
  color:var(--secondary);
  margin-left:30px;
  margin-right:30px;
  border-bottom: 3px solid transparent;
  margin-top:5px;
  transition: 0.3s;
  font-size:20px;
}

.nav-light .nav-link:hover{
  border-bottom: 3px solid var(--fifth);
  transition: 0.3s;
}

.nav-light .navbar-brand{
  margin-top:5px;
  padding:0px;
  margin:0px;
  font-weight: bold;
  margin-right: 30px;
}

.nav-light span.navbar-toggler-icon{
  background-image: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='var(--fifth)' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 8h24M4 16h24M4 24h24'/%3E%3C/svg%3E");
}

/*Dark Navigation*/
 .navbar-dark{
  background: var(--secondary);
  color:var(--primary);
}

.navbar-dark .nav-link{
  color:var(--primary);
  margin-left:20px;
  margin-right:20px;
  border-bottom: 3px solid transparent;
  margin-top:5px;
  transition: 0.3s;
}

.navbar-dark .nav-link:hover{
  border-bottom: 3px solid var(--fifth);
  transition: 0.3s;
}

.navbar-dark .navbar-brand{
  margin-top:5px;
  padding:0px;
  margin:0px;
  font-weight: bold;
  margin-right: 30px;
}

.navbar-dark span.navbar-toggler-icon{
  background-image: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='rgba(255,255,255, 0.9)' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 8h24M4 16h24M4 24h24'/%3E%3C/svg%3E");
}


/*Prebuilt Mainers */

hr{
}

.icon-all{
  height: 30px;
  width:30px;
  margin-left:5px;
  float:left;
}

.none{
  margin:0px;
  padding:0px;
  float:left;
}

.right{
  float:right;
}

.left{
  float:left;
}

.centered{
  margin-left:auto;
  margin-right:auto;
}

.centerer{
  margin-left:5px;
  margin-right:5px;
}


.spacer{
  margin-top: 35px;
  color:transparent;
}


.push-1{
  margin-left:50px!important;
}

.push-2{
  margin-left:100px!important;
}

.push-3{
  margin-left:150px!important;
}

.branded{
  color: var(--fifth);
}

.pad-left{
  padding-left:20px;
}

.pad-top{
  padding-top:20px;
}

.margin-top{
  margin-top:20px;
}

.margin-top-5{
  margin-top:50px;
}

.width-80{
  width:80%;
}

.width-60{
  width:70%;
}

.width-40{
  width:40%;
}

.padding{
  padding-left:20px;
  padding-right:20px;
}

.hyper-giant{
  font-size:100px;
}

.giant{
  font-size:80px;
}

.semi-giant{
  font-size:55px;
}

.link{
  text-decoration: none;
  margin-right:20px;
}

.img-50{
  width:30px;
  height:30px;
}

.primary{
  color:var(--primary)!important;
}

.tertiary{
  color:var(--tertiary)!important;
}

.quaternary{
  color:var(--quaternary)!important;
}

.text-left{
  margin-left:100px;
}

.header-btn{
  margin-left:100px;
}

.light{
  font-weight: lighter;
}

.img-full{
  width:100%;
  height: 100%;
  object-fit: cover;
}

.social-link{
  text-decoration: none;
}

.social-icons{
  text-decoration: none;
  height:100px;
  width:100px;
}

#rounded{
  border-radius: 30px!important;
}

.branded-border{
  width:60px;
  height:10px;
  background: var(--fifth);
  font-size:0px;
  color:var(--transparent);
}

.paddingless{
  padding-left:0px!important;
  padding-right:0px!important;
}


/*Prebuilt button components*/

.comp-btn-1{
  border-bottom:10px;
  margin-right:20px;
  color:var(--tertiary);
  text-decoration: none;
  border-bottom: 2px solid var(--tertiary);
  transition:0.3s;
  padding-bottom: 5px;
}

.comp-btn-1:hover{
  color:var(--tertiary);
  border-bottom: 2px solid var(--fifth);
  text-decoration: none;
  margin-top:-5px;
}

.comp-btn-2{
  border-bottom:10px;
  margin-left:10px;
  color:var(--primary);
  text-decoration: none;
  border: 2px solid var(--fifth);
  padding:10px;
  padding-left:30px;
  padding-right:30px;
  transition: 0.2s;
}

.comp-btn-2:hover{
  color:var(--secondary) !important;
  text-decoration: none;
  background: var(--fifth);
  border: 2px solid var(--fifth);
}

.comp-btn-2-dark{
  border-bottom:10px;
  margin-left:50px;
  color:var(--primary);
  background: var(--tertiary);
  text-decoration: none;
  border: 2px solid var(--tertiary);
  padding:10px;
  padding-left:30px;
  padding-right:30px;
  transition: 0.2s;
}

.comp-btn-2-dark:hover{
  color:var(--secondary) !important;
  text-decoration: none;
  background: var(--quaternary);
  border: 2px solid var(--quaternary);
}

.comp-btn-3{
  color:var(--secondary);
  text-decoration: none;
  transition: 0.2s;
}

.comp-btn-3:hover{
  color:var(--secondary) !important;
  text-decoration: none;
}

.comp-btn-4{
  color:var(--primary);
  background: var(--secondary);
  text-decoration: none;
  transition: 0.2s;
  padding:20px;
  padding-left:40px;
  padding-right: 40px;
  border-radius: 2px;
}

.comp-btn-4:hover{
  color:var(--secondary) !important;
  background: var(--fifth);
  text-decoration: none;
}

.comp-btn-round{
  color: var(--primary);
  background: var(--fifth);
  padding:10px;
  padding-left: 30px;
  padding-right: 30px;
  border-radius: 30px;
  margin-top:20px;
  text-decoration: none;
  border:2px solid var(--fifth);
  transition: 0.3s;
  font-size:18px;
}

.comp-btn-round:hover{
  color:var(--fifth);
  background: transparent;
  border:2px solid var(--fifth);
  transition: 0.3s;
}


.comp-btn-square{
  color: var(--primary);
  background: var(--fifth);
  padding:10px;
  padding-left: 30px;
  padding-right: 30px;
  margin-top:20px;
  text-decoration: none;
  border:2px solid var(--fifth);
  transition: 0.3s;
  font-size:18px;
}

.comp-btn-square:hover{
  color:var(--fifth);
  background: transparent;
  border:2px solid var(--fifth);
  transition: 0.3s;
}

.comp-btn-square-xl{
  color: var(--fifth);
  background: transparent;
  padding:10px;
  padding-left: 100px;
  padding-right: 100px;
  margin-top:20px;
  text-decoration: none;
  border:2px solid var(--fifth);
  transition: 0.3s;
  font-size:18px;
}

.comp-btn-square-xl:hover{
  color:var(--primary);
  background: var(--fifth);
  border:2px solid var(--fifth);
  transition: 0.3s;
  padding-left:110px;
  padding-right:110px;
}

.comp-btn-k-xl{
  color: var(--fifth);
  background: transparent;
  padding:10px;
  padding-left: 70px;
  padding-right: 70px;
  margin-top:20px;
  text-decoration: none;
  border:2px solid var(--fifth);
  transition: 0.3s;
  font-size:18px;
}

.comp-btn-k-xl:hover{
  color:var(--primary);
  background: var(--fifth);
  border:2px solid var(--fifth);
  transition: 0.3s;
  padding-left:80px;
  padding-right:80px;
}

.seshat-fb{
  text-decoration: none;
  color: black;
  transition: 0.2s;
  font-size:25px;
  margin-left:5px;
}

.seshat-fb:hover{
  margin-top:-10px!important;
  color:#4064ac;
  transition: 0.2s;
}

.seshat-tw{
  text-decoration: none;
  color: black;
  transition: 0.2s;
  font-size:25px;
  margin-left:5px;
}

.seshat-tw:hover{
  margin-top:-10px!important;
  color:#1da1f2;
  transition: 0.2s;
}

.seshat-ln{
  text-decoration: none;
  color: black;
  transition: 0.2s;
  font-size:25px;
  margin-left:5px;
}

.seshat-ln:hover{
  margin-top:-10px!important;
  color:#0077b5;
  transition: 0.2s;
}


.comp-btn-square-large{
  color: var(--primary);
  background: var(--fifth);
  padding:10px;
  padding-left: 100px;
  padding-right: 100px;
  margin-top:20px;
  text-decoration: none;
  border:2px solid var(--fifth);
  transition: 0.3s;
  font-size:18px;
}

.comp-btn-square-large:hover{
  color:var(--fifth);
  background: transparent;
  border:2px solid var(--fifth);
  transition: 0.3s;
}


.comp-btn-square-dark{
  color: var(--sixth);
  background: transparent;
  padding:10px;
  padding-left: 30px;
  padding-right: 30px;
  margin-top:20px;
  text-decoration: none;
  border:2px solid var(--sixth);
  transition: 0.3s;
  margin-left:20px;
  font-size:18px;
}

.comp-btn-square-dark:hover{
  color:var(--secondary);
  border:2px solid var(--fifth);
  transition: 0.3s;
}

.comp-btn-square-dark:hover img{
  margin-left:20px;
  transition: 0.4s;
}

.comp-btn-square-dark img{
  margin-left:10px;
  transition: 0.4s;
}

#form{
  margin-top:100px;
  padding:0px;
}

.form-group{
  margin-bottom: 50px;
}

.form-group input{
  border-radius: 0px;
  padding:20px;
  margin-top:10px;
  transition: 0.4s;
}

.form-group input:focus{
  border:1px solid var(--fifth);
  transition: 0.4s;
}

.form-group textarea{
  border-radius: 0px;
  padding:20px;
  margin-top:10px;
  transition: 0.4s;
}

.form-group textarea:focus{
  border:1px solid var(--fifth);
  transition: 0.4s;
}

.comp-btn-square-rev{
  color: var(--secondary);
  background: transparent;
  padding:10px;
  padding-left: 30px;
  padding-right: 30px;
  margin-top:20px;
  text-decoration: none;
  border:2px solid var(--fifth);
  transition: 0.3s;
  font-size:18px;
}

.comp-btn-square-rev:hover{
  color:var(--primary);
  background: var(--fifth);
  border:2px solid var(--fifth);
  transition: 0.3s;
}

.comp-btn-round-dark{
  color: var(--sixth);
  background: transparent;
  padding:10px;
  padding-left: 30px;
  padding-right: 30px;
  border-radius: 30px;
  margin-top:20px;
  text-decoration: none;
  border:2px solid var(--sixth);
  transition: 0.3s;
  margin-left:20px;
  font-size:18px;
}

.comp-btn-round-dark:hover{
  color:var(--primary);
  background: var(--sixth);
  border:2px solid var(--sixth);
  transition: 0.3s;
}

.comp-btn-round-rev{
  color: var(--secondary);
  background: var(--primary);
  padding:10px;
  padding-left: 30px;
  padding-right: 30px;
  border-radius: 30px;
  margin-top:20px;
  text-decoration: none;
  border:2px solid var(--fifth);
  transition: 0.3s;
}

.comp-btn-round-rev:hover{
  color:var(--primary);
  background: var(--fifth);
  border:2px solid var(--fifth);
  transition: 0.3s;
}

.comp-btn-5{
  text-decoration: none;
  color:var(--primary);
  margin-right:5px;
  transition: 0.3s;
}

.comp-btn-5:hover{
  text-decoration: none;
  color:var(--fifth);
  margin-right:10px;
  transition: 0.3s;
}


/*This is the style for the components home section*/

#headline{
  padding-bottom: 30px;
  margin-bottom: 0px;
}

/*Background Header Left*/

.bg-header {
  display: inline-block;
  overflow: hidden;
  position: relative;
  width: 100%;
  background: rgba(0, 0, 0,0.2);
  padding-bottom: 100px;
}

.bg-header-x{
  display: inline-block;
  overflow: hidden;
  position: relative;
  width: 100%;
  height:100%;
  padding-bottom: 10px;
}


.bg-header-s{
  display: inline-block;
  overflow: hidden;
  position: relative;
  padding-bottom: 100px;
  margin-left: 30px;
  margin-right:30px;
  height:400px;
  background: var(--seven);
}

.zoom{
	overflow: hidden;
}

.zoom img{
	top: 0%;
	left: 50%;
	max-width: 200%;
	width: 100%;
	transform: translateX(-50%);
}

.header-background-rounded {
  pointer-events: none;
  position: absolute;
  width: 100%;
  height: 100%;
  border-bottom-left-radius: 120px;
  border-bottom-right-radius: 120px;
  z-index: -1;
}

.header-background {
  pointer-events: none;
  position: absolute;
  width: 100%;
  height: 100%;
  object-fit: cover;
  z-index: -1;
}

.bg-header-left .header-text{
  color:var(--secondary);
  font-weight: 800;
  margin-left:100px;
  margin-top:150px;
  width:60%;
}

.bg-header-left .header-btn{
  margin-left:100px;
}

.bg-header-left .master-sub{
  color: var(--secondary);
  margin-top:30px;
  margin-bottom: 50px;
  margin-left:100px;
  width:30%;
}
/*Background Header Center*/

.bg-header-center{

  background-image:radial-gradient(circle farthest-corner at 0% 100%, #d26e5b, #e6b999 29%, #b2a3ac 63%, #72747f);
}

.bg-header-center .header-text{
  color:var(--secondary);
  font-weight: 800;
  margin-left:0px;

  margin:0px;
  letter-spacing: -5px;
  margin-top:100px;
  width:60%;
}

.bg-header-center .header-left-btn{
  margin-left:0px;
}

.bg-header-center .master-sub{
  color: var(--secondary);
  margin-top:30px;
  margin-left:0px;
  width:600px;
  margin-bottom: 50px;
}

/*Background Header Right*/

.bg-header-right .header-text{
  color:var(--secondary);
  font-weight: 800;
  margin-top:150px;
  width:100%;

}

.bg-header-right .header-right-btn{
}

.bg-header-right{
  height:99vh;
}

.bg-header-right .master-sub{
  color: var(--secondary);
  margin-top:30px;
  width:600px;
  margin-bottom: 50px;
}

/*Headline Left to Right (2)*/

.breaker{
  margin-top:100px;
}

.breaker-small{
  margin-top:50px;
}

.breaker-large{
  margin-top:200px;
}



.headline-one{
  padding:20px;
  padding-top:70px;
  padding-bottom: 100px;
  background: var(--primary);
  margin-top:0px;
  margin-bottom: 70px;
}

.header-margin{
  padding-left: 60px;
  padding-right: 30px;
  margin-top:50px;
}

.headline-one .headline-img{
  width:100%;
  height: 500px;
  display: block;
  margin-left: auto;
  margin-right: auto;
  margin-bottom: 0px;
  object-fit: cover;
}

.headline-one .headline-text{
  font-size:60px;

}

.headline-one .headline-sub{
  width:80%;
  margin-top:30px;
  color: var(--secondary);
}

.headline-one .branded-small{
  color: var(--fifth);
  font-weight: bold;
  letter-spacing: 2px;
  margin-top:40px;
}

.headline-two{
  padding:20px;
  padding-top:70px;
  padding-bottom: 50px;
  background: var(--primary);
  margin-top:0px;
}

.header-margin{
  padding-left: 60px;
  padding-right: 30px;
}

.headline-two .headline-img{
  width:100%;
  height: 500px;
  display: block;
  margin-left: auto;
  margin-right: auto;
  margin-top: 30px;
  object-fit: cover;
  border-radius: 20px;
}

.headline-two .headline-text{
  font-weight: bold;
}

.headline-two .headline-sub{
  margin-top:30px;
  color: var(--secondary);
}


/*Headline three*/

.headline-three{
  padding:70px;
  padding-bottom: 100px;
  background: var(--primary);
  margin-bottom: 70px;
}

.headline-three .headline-text{
  margin-top:70px;
  margin-bottom: 70px;
  width:100%;
  margin-left:0px;
  padding-left:0px;
}

/*Headline four*/

.headline-four{
  padding:70px;
  padding-bottom: 100px;
  background: var(--primary);
  margin-bottom: 70px;
}

.headline-four .headline-text{
  font-size:150px;
  margin-top:50px;
  margin-bottom: 20px;
  width:100%;
}


/*Headline five*/

.headline-five{
  padding:70px;
  padding-top:150px;
  padding-bottom: 100px;
  background: var(--primary);
  margin-bottom: 70px;
}

.headline-five .headline-text{
  font-size:100px;
  margin-top:0px;
  margin-bottom: 0px;
  width:100%;
  font-weight: bold;
}

.headline-five .headline-sub{
  font-size:20px;
  margin-top:30px;
  margin-bottom: 30px;
  width:100%;
}

.headline-five .comp-btn-2{
  background: var(--fifth);
  margin-left:30px;
  margin-right:30px;
}

.headline-five .comp-btn-2-dark{
  margin-left:30px;
  margin-right:30px;
}


/*Headline six*/

.headline-six{
  padding:100px;
  padding-bottom: 100px;
  background: var(--primary);
  margin-bottom: 70px;
}

.headline-six .headline-text{
  font-size:130px;
  margin-top:0px;
  margin-bottom: 0px;
  width:100%;
  font-weight: bold;
}

.headline-six .headline-sub{
  font-size:20px;
  margin-bottom: 30px;
  width:100%;
  color:var(--tertiary);
  margin-top:
}

/*This is the style for the components of people section*/

#people{
  padding:0px;
  background: var(--primary);
  margin-top: 70px;
}

.people-main-text{
  margin-bottom: 70px;
}

.people-subber{
  margin-top:25px;
  font-size: 15px;
}


/*people rounded (1)*/


#people .people-round .people-img{
  width:200px;
  height:200px;
  display: block;
  margin-left: auto;
  margin-right: auto;
  border-radius: 100%;
  margin-bottom: 30px;
  object-fit: cover;
}

#people .people-squron .people-img{
  width:300px;
  height:300px;
  display: block;
  border-radius: 10%;
  margin-bottom: 30px;
  object-fit: cover;
  transition: transform 0.3s ease;
}


#people .people-squron .people-img:hover{
  transition: transform 0.3s ease;
  transform: scale(1.1);
}

#people .people-squron .people-sub{
  color:var(--tertiary);
}


/*people square col-3 (2)*/


#people .people-two .people-img{
  width:100%;
  height:400px;
  display: block;
  margin-left: auto;
  margin-right: auto;
  margin-bottom: 30px;
  object-fit: cover;
}


/*people square col-4 (3)*/

.people-main-text{
  margin-bottom: 70px;
}

#people .people-three .people-container{
  padding:0px;
}

#people .people-three .people-img{
  width:100%;
  height:450px;
  display: block;
  margin-left: auto;
  margin-right: auto;
  margin-bottom: 30px;
  object-fit: cover;
  padding:10px;
}

/* People Four */

#people .people-four .people-container{
  margin-top:100px;
  margin-bottom:20px;
  padding:30px;
}

.people-color{
  background: var(--sixth);
  transition: 0.3s;
  color:var(--primary);
}


#people .people-four .people-img{
  width:200px;
  height:200px;
  display: block;
  margin-left: auto;
  margin-right: auto;
  margin-top: -120px;
  margin-bottom: 30px;
  object-fit: cover;
  border-radius: 100%;
   transition: transform 0.4s ease;
}

#people .people-four .people-img:hover{
  transition: transform 0.4s ease;
  transform: scale(1.1);
}

.people-four .people-subber{
  color:var(--quaternary);
}



#people #social-icon{
  margin-top:40px;
}

/*This is the style for the components of list section*/



#list{
  padding:0px;
  background: var(--primary);
  margin-top: 100px;
  margin-bottom: 30px;
}

.main-logo{
  width:50px;
  height:50px;
  margin-right:50px;
  margin-left:30px;
  border-radius: 100px;
}


.transp{
  color:transparent!important;
}

.main-padd{
  margin-top: 250px;
}

#list .list-main-text{
  margin-bottom: 50px;
  width:60%;
  margin-left:auto;
  margin-right:auto;
  color:var(--secondary);
}

.list-half{
  width:50%!important;
  float:left;
}

.border-bot{
  border-bottom: 1px solid var(--secondary);
  margin-bottom: 30px;
}

/*List*/

.list-container{
  margin-bottom: 30px;
}

.list-container .list-main-text{
  margin-bottom: 70px;
  color:var(--secondary);
}

.list-container .list-img{
  width:100%;
  height:400px;
  object-fit: cover;
}

.list-container .list-header{
  margin-top:30px;
  margin-bottom: 15px;
  color:var(--secondary);
}

.list-container .list-sub{
  color:var(--secondary);
}

.list-container .container-background{
  background: var(--sixth);
  color:var(--primary);
}


/* List Container Opp */

.list-container-opp{
  padding:0px;
  margin-bottom: 30px;
  background: var(--sixth);
  padding-bottom: 30px;
}

.list-container-opp .list-main-text{
  margin-bottom: 70px;
  color:var(--primary);
  margin-left:20px;
}

.list-container-opp .list-header{
  margin-top:30px;
  margin-bottom: 15px;
  color:var(--primary);
  margin-left:20px;
}

.list-container-opp .list-sub{
  color:var(--primary);
  margin-left:20px;
}

.list-container-opp .list-image-two{
  height:300px;
  width:100%;
  object-fit: cover;
}

.marginer{
  margin-left:20px;
  margin-right: 20px;
}
/* List (8) Image + Discription */


.list .list-container .list-image-two{
  height:350px;
}

/* List (8) Image + Discription */
.list .list-container .list-image-two{
  height:300px;
  width:100%;
}

/* List (8) Image + Discription */

.list .list-container .list-three{
  height:350px;
}

/* List (8) Image + Discription */
.list-container-2{
  padding:0px;
  margin-bottom: 30px;
  min-height:200px;
  margin-left:20px;
  margin-right: 20px;
  background: var(--sixth);

}

.list .list-container-2 .list-img{
  height:300px;
  width:100%;
  object-fit: cover;
}

.list .list-container-2 .list-header{
  margin-left:20px;
  color:var(--primary);
}

.list .list-container-2 .list-sub{
  margin-left:20px;
  margin-top:30px;
  margin-bottom: 60px;
  color:var(--primary);
}

/* List (9) Image + Discription */
.list-container-3{
  padding:10px;
  margin-bottom: 30px;
  min-height:50px;
  margin-left:20px;
  margin-right: 20px;
  background: var(--primary);
  color:var(--secondary);
  border:2px solid var(--sixth);
  transition: 0.3s;
}

.list-container-3:hover{
}

.list .list-container-3 .list-img{
  height:300px;
  width:100%;
  object-fit: cover;
}


.list .list-container-3 .list-header{
  margin-left:20px;
}

.list .list-container-3 .list-sub{
  margin-left:20px;
  margin-top:20px;
  margin-bottom: 10px;
}

/* List (9) Image + Discription */
.list-container-4{
  padding:0px;
  margin-top:25px;
  margin-bottom: 25px;
  margin-left:20px;
  margin-right: 20px;
  background: var(--primary);
  color:var(--secondary);
  border-top:2px solid var(--secondary);
  transition: 0.3s;

}

.list .list-container-4 .list-img{
  height:300px;
  width:100%;
  object-fit: cover;
}


.list .list-container-4 .list-header{
  margin-top:25px;
  margin-bottom: 25px;
}

.list .list-container-4 .list-sub{
}

/* List (9) Image + Discription */
.list-container-5{
  padding:20px;
  padding-top: 30px;
  padding-bottom: 30px;
  margin-bottom: 30px;
  background: var(--sixth);
  color:var(--primary);
  border-radius: 20px;

}

.list .list-container-5 .list-img{
  height:300px;
  width:100%;
  object-fit: cover;
  display: block;
}


.list .list-container-5 .list-header{
  color:var(--primary);
}

.list .list-container-5 .list-sub{
  margin-top:15px;
  margin-bottom: 20px;
  color:var(--primary);
}

.list .list-container-5 .list-image{
  display: block;
  margin-left: auto;
  margin-right: auto;
  width:80px;
  height:80px;
  border:2px solid var(--fifth);
  border-radius: 30px;
  margin-bottom: 20px;
}

/* List (9) Image + Discription */
.list-container-6{
  padding:20px;
  padding-top: 30px;
  padding-bottom: 30px;
  margin-bottom: 30px;
  min-height:200px;
  margin-left:20px;
  margin-right: 20px;
  background: var(--sixth);
  color:var(--secondary);
  border-radius: 20px;

}

.list .list-container-6 .list-header{
  color:var(--primary);
}

.list .list-container-6 .list-sub{
  margin-top:25px;
  color:var(--primary);
}

.list .list-container-6 .list-image{
  display: block;
  width:60px;
  height:60px;
  margin-bottom: 20px;
}

/* List (10) Image + Discription */
.list-container-7{
  padding:20px;
  padding-top: 30px;
  padding-bottom: 30px;
  margin-bottom: 30px;
  min-height:200px;
  background: var(--sixth);
  color:var(--primary);

}

.list .list-container-7 .list-img{
  height:300px;
  width:100%;
  object-fit: cover;
  display: block;
  margin-bottom: 15px;
}


.list .list-container-7 .list-header{
  color:var(--primary);
}

.list .list-container-7 .list-sub{
  margin-top:25px;
  margin-bottom: 20px;
  color:var(--primary);
}

.list .list-container-7 .list-image{
  display: block;
  width:80px;
  height:80px;
  margin-bottom: 15px;
}


/* List (10) Image + Discription */

/* List (11) Image + Discription */

.list .list-container-9{
  margin-left:30px;
  background: var(--sixth);
  color: var(--primary);
  border-top-left-radius: 20px;
  border-bottom-right-radius: 20px;
  padding:20px;
  margin-bottom: 20px;
}

.list .list-container-9 .list-image{
    max-width:60px;
    height:50px;
    margin-top:10px;
}

.list .list-container-9 .list-header{
    color: var(--quaternary);
    margin-top:15px;
}


.list .list-container-9 .list-sub{
    color: var(--primary);
    margin-top:50px;
}

.list .list-container-9 .comp-btn-5{
  margin-top:30px;
  margin-left:50px;
  margin-bottom: 30px;
}

.list .list-container-9 i{
  margin-top:30px;
}

.list .list-container-10{
  color:var(--secondary);
  margin-bottom: 30px;
}

.list .list-container-10 .list-image{
  width:80%;
  height:300px;
  object-fit: cover;
  margin-left:auto;
  margin-right:auto;
  display: block;
}

.list .list-container-10 .list-sub{
  color:var(--secondary);
}

.list .list-container-10 h1{
  font-weight: bold;
}

.list .list-container-10 .list-header-2{
  margin-bottom:20px;
  color:var(--secondary);
}

.list-container-11{
  margin-bottom: 30px;
}

.list-container-11 .list-image{
  width:80px;
  height:80px;
  margin-left: auto;
  margin-right: auto;
  display: block;
  margin-bottom:30px;
}

.list-container-11 .list-image-left{
  width:50px;
  height:50px;
  display: block;

  margin-bottom:30px;

}

.list-container-11 .list-header{
  color: var(--secondary);
}

.list-container-11 .list-sub{
  color:var(--secondary);
  margin-top:15px;
}

.list .list-container-11 .comp-btn-1{
  color:var(--fifth);
  border-bottom: 1px solid var(--secondary);
  padding-top:0px;
}

.list-container-12{
  margin-bottom: 70px;
}

.list-container-12 .list-image-left{
  width:50px;
  height:50px;
  margin-left: auto;
  margin-right: auto;
  display: block;
  margin-bottom:30px;
}

.list-container-12 .list-header{
  width:100%;
  margin-bottom: 10px;
}

.list-container-12 .list-sub{
  width:100%;
  color:var(--tertiary);
}


.list-container-13{
  margin-bottom: 30px;
  border-radius: 20px;
  background: var(--quaternary);
  margin-left:15px;
  margin-right:15px;
  padding:20px;
}

.list-container-13 .list-image{
  width:50px;
  height:50px;
  margin-left: auto;
  margin-right: auto;
  display: block;
  margin-bottom:30px;
}

.list-container-13 .list-image-left{
  width:50px;
  height:50px;
  display: block;
  margin-top:-30px;
  margin-bottom:30px;
  color: #FFF;
}

.list-container-13 .list-header{
  color: var(--secondary);
}

.list-container-13 .list-sub{
  color:var(--secondary);
  margin-top:15px;
}


/* List (10) Image + Discription */
.list-bg{
  background: var(--sixth);
  color:var(--primary);
  min-height: 100px;
  padding:70px;

}

.list-bg .main-image{
  margin-left:auto;
  margin-right:auto;
  display: block;
  margin-bottom: 20px;
  height:80px;
  width:80px;
  object-fit: cover;
}

.list-bg p{
  margin-top:30px;
  color:var(--quaternary);
}

.list-bg h3{
  color:var(--primary);
}

.list-bg .list-main-text{
  color:var(--primary)!important;
}

.list-bg .box{
  padding:10px;
  padding-top:0px;
  padding-bottom:0px;
}

.list-bg-2{
  background: var(--sixth);
  color:var(--primary);
  min-height: 200px;
  padding:30px;
  width:100%;
  border-radius: 30px;
}

.list-bg-2 .main-image{
  display: block;
  margin-top:10px;
  margin-bottom:30px;
  height:70px;
  max-width:70px;
  margin-left: 20px;
}

.list-bg-2 h3{
  margin-top:25px;
  width:60%;
  margin-bottom: 5px;
  margin-right:10px;
  color:var(--primary);
}

.list-bg-2 p{
  width:60%;
  margin-top:10px;
  margin-right:10px;
  color:var(--quaternary);
}

.list-bg-2 .box{
  padding:3px;
  padding-top:30px;
  padding-bottom: 30px;
}

/*This is the style for the components of work section*/

#work{
  padding:0px;
  margin-top: 100px;
}


.work-main-text{
  margin-bottom: 50px;
  color:var(--secondary);
}

.work-container{
  padding:10px;
  margin-bottom: 30px;
}

.work-img-long{
  height:550px;
  width:100%;
  object-fit: cover;
  padding:10px;
  padding-top:0px;
}

.work-img-medium{
  height:400px;
  width:100%;
  object-fit: cover;
  padding:0px;
  padding-top:0px;
  margin-bottom:10px;
}

.work-two .work-sub{
  color:var(--tertiary)!important;
}

.work .work-container .work-one{
  height:400px;
}

.work-two .work-header{
  margin-top: 10px!important;
  color:var(--secondary);
  font-weight:bold;
}

.work-sub{
  color:var(--tertiary);
  font-weight: lighter;
}

.work .work-container .work-img{
  width:100%;
  height:450px;
  object-fit: cover;
}


.work .work-container .work-two{
  height:400px;
}

.work-two .work-header{
  margin-bottom: 10px;
  color:var(--secondary);
}

.work-two .work-sub{
  color:var(--tertiary);
  margin-top:0px;
}


.work-three .work-header {
  display: inline-block;
  overflow: hidden;
  position: relative;
  padding-bottom: 200px;
  height:600px;
  margin-bottom: 40px;
}

.work-three .work-background {
  pointer-events: none;
  position: absolute;
  width: 100%;
  height: 100%;
  object-fit: cover;
  z-index: -1;
}

.work-three .work-main{
  padding-top: 30px;
  padding-left:20px;
}

.work-three .main-bottom{
  margin-top:0px;
  padding-left: 20px;
}

.work-three .sub-bottom{
  margin-top:450px;
  margin-bottom: 0px;
  padding-left: 20px;
}

.work-four .work-header {
  display: inline-block;
  overflow: hidden;
  position: relative;
  padding-bottom: 200px;
  height:400px;
  margin-bottom: 40px;
  color:var(--primary);
  transition: 0.5s;
}

.work-four .work-header:hover{
  color:var(--primary);
  transition: 0.5s;
}

.work-four .work-background {
  pointer-events: none;
  position: absolute;
  width: 100%;
  height: 100%;
  object-fit: cover;
  z-index: -1;

}

.work-four .work-main{
  padding-top: 30px;
  padding-left:20px;
}

.work-four .main-bottom{
  padding-left: 20px;
  margin-top:150px;
  margin-bottom: 0px;
  color:var(--primary);
}

.work-four .sub-bottom{
  padding-left: 20px;
  color:var(--primary);
}


.work-five .work-header {
  display: inline-block;
  overflow: hidden;
  position: relative;
  padding-bottom: 200px;
  height:400px;
  margin-bottom: 40px;
  color:transparent;
  transition: 0.5s;
  color:var(--primary);
}

.work-five .work-background {
  pointer-events: none;
  position: absolute;
  width: 100%;
  height: 100%;
  object-fit: cover;
  z-index: -1;

}

.work-five .work-main{
  padding-top: 30px;
  padding-left:20px;
}

.work-five .main-bottom{
  padding-left: 20px;
  margin-top:300px;
  margin-bottom: 0px;
}

.work-five .sub-bottom{
    margin-top:-0px;
  padding-left: 20px;
  color:var(--primary);
}


.work-six .work-header {
  display: inline-block;
  overflow: hidden;
  position: relative;
  padding-bottom: 200px;
  height:600px;
  margin-bottom: 40px;
  color:transparent;
  transition: 0.5s;
  padding:0px;
  color:var(--primary);
}

.work-six .work-background {
  pointer-events: none;
  position: absolute;
  width: 100%;
  height: 100%;
  object-fit: cover;
  z-index: -1;

}

.work-six .work-main{
  padding-top: 30px;
  padding-left:20px;
}

.work-six .main-bottom{
  padding-left: 20px;
  margin-top:70px;
  margin-bottom: 0px;
}

.work-six .sub-bottom{
  margin-top:25px;
  width:60%;
  margin-left: auto;
  margin-right:auto;
}
/*work one*/

/*This is the style for the components of FAQs section*/

#faq{
  padding:30px;
  background: var(--primary);
  margin-top:70px;
}

/*FAQs one*/

.faq-header{
  color:var(--secondary);
  margin-bottom: 50px;
  margin-top:40px;
}

.faq-main{
  margin-top:40px;
  margin-bottom:20px;
  color: var(--secondary);
}

.faq-discription{
  color:var(--tertiary);
}

/*FAQs two*/

.accordion-item{
  background: var(--primary);
}

.accordion-header{
  margin:0px;
  padding:0px;
}
.accordion-text{
  color:var(--secondary);
  padding:20px;
}

/*This is the style for the components of Quote section*/

#quote{
  padding:30px;
  background: var(--primary);
  margin-top:70px;
}

.quotes-head{
  margin-bottom: 80px;
}

/*Qoutes one*/

.quote-header{
  color:var(--secondary);
  margin-bottom: 30px;
  margin-top:20px;
}

.quote-sub{
  margin-bottom:20px;
  color: var(--tertiary);
  margin-top:20px;
}

/*Qoutes two*/

#quote-logo{
  font-size:100px;
  color:var(--fifth);
}

.quote-two{
  padding:20px;
}

.quote-two .qoutes-header{
  margin-bottom: 25px;
  color:var(--secondary);
}

.quote-two .qoutes-main{
  margin-bottom:10px;
  color: var(--secondary);
  margin-top:10px;
  display: block;
  width:80%;
}

.quote-two .qoutes-profile{
  width:80px;
  height:80px;
  border-radius: 100%;
  object-fit: cover;
  margin-top:5px;
  margin-bottom: 20px;
}

.quote-two .qoutes-header{
  margin-bottom: 25px;
  color:var(--secondary);
}

/* Quotes 3*/

.quote-three{
  padding:30px;
  border-radius: 20px;
  margin-bottom: 30px;
}


.quote-three .qoutes-profile{
  width:80px;
  height:80px;
  border-radius: 100%;
  object-fit: cover;
}


.quote-three .qoutes-header{
  margin-bottom: 50px;
  color:var(--secondary);
}

.quote-three .qoutes-main{
  color: var(--secondary);
  display: block;
  width:60%;
  margin-left:30px;
  margin-top:3px;
}

/* Quotes 4*/

.quote-four{
  padding:30px;
  margin-left:30px;
  margin-right:30px;
  border:2px solid var(--quaternary);
  margin-bottom: 30px;
  border-radius: 30px;
}


.quote-four .qoutes-profile{
  width:80px;
  height:80px;
  border-radius: 100%;
  object-fit: cover;
}

.quote-four .qoutes-header{
  margin-bottom: 10px;
  color:var(--secondary);
  width:70%;
  margin-left:30px;
}

.quote-four .qoutes-main{
  color: var(--secondary);
  display: block;
  width:60%;
  margin-left:110px;
  margin-top:3px;
}


/* Quotes 5*/

.quote-five{
  padding:30px;
  margin-left:30px;
  margin-right:30px;
  border:1px solid var(--quaternary);
  border-radius: 30px;
  background: var(--sixth);
  color:var(--secondary);
  margin-bottom: 40px;
}


.quote-five .qoutes-profile{
  width:80px;
  height:80px;
  border-radius: 100%;
  object-fit: cover;
}

.quote-five .qoutes-header{
  margin-bottom: 20px;
  color:var(--primary);
  width:70%;
  margin-left:30px;
}

.quote-five .qoutes-main{
  color: var(--primary);
  display: block;
  width:60%;
  margin-left:110px;
  margin-top:3px;
}



/* Quotes 6*/

.quote-six{
  padding:30px;
  margin-left:30px;
  margin-right:30px;
  border:1px solid var(--quaternary);
  background: var(--sixth);
  color:var(--secondary);
  margin-bottom: 40px;
  border-radius: 10px;
}


.quote-six .qoutes-profile{
  width:80px;
  height:80px;
  border-radius: 100%;
  object-fit: cover;
}


.quote-six .qoutes-profile-r{
  width:100px;
  height:100px;
  border-radius: 100%;
  object-fit: cover;
  margin-top:-80px;
}

.quote-six .qoutes-header-r{
  margin-bottom: 10px;
  color:var(--primary);
  width:100%;
  margin-left:10px;
  margin-top:5px;
}

.quote-six .qoutes-header{
  margin-bottom: 10px;
  color:var(--primary);
  width:100%;
  margin-left:10px;
  margin-top:30px;
}

.quote-six .qoutes-main{
  color: var(--primary);
  display: block;
  width:70%;
  margin-left:10px;
  margin-top:3px;
}

.quote-six .qoutes-main-r{
  color: var(--primary);
  display: block;
  width:70%;
  margin-left:10px;
  margin-top:25px;
}

/*This is the style for the components of Logowall section*/


#stats{
  padding:30px;
  margin-top:70px;
  background: var(--sixth);
  color:var(--primary);
}

#stats-two{
  padding:30px;
  margin-top:70px;
  background: var(--sixth);
  color:var(--primary);
}

/*stats one*/

.stats-one{
  padding:20px;
}

.stats-one .text-container{
  margin-bottom: 100px;
  padding-left:70px;
  padding-right:70px;
}

.stats-one .header-text{
  margin-bottom:50px;
}

.stats-one h1{
  margin-top:20px;
}

.stats-container{
  padding:30px;
}

.stats-one .stats-container{

}

/*This is the style for the components of Logowall section*/

#logowall{
  margin-top:100px;
}

/*Logowall one*/
.logo-header{
  width:100%;
  margin-bottom: 20px;
}

.logo-sub{
  margin-left:10px;
}

.logo-container{
  margin-bottom: 20px;
}

.logowall-three .logo-header{
  width:90%;
}

.logowall-one .logowall-logo{
  max-width:80%;
  height: 70px;
  display: block;
  padding-left:20px;
  padding-right:20px;
  margin-left: auto;
  margin-right: auto;
  margin-bottom: 10px;
}

.logowall-two .logowall-logo{
  max-width:80%;
  height: 100px !important;
  display: block;
  margin-left: auto;
  margin-right: auto;
  margin-bottom: 30px;
}

.logowall-three .logowall-logo{
  max-width:80%;
  height: 70px;
  display: block;
  margin-bottom: 30px;
  margin-left: auto;
  margin-right: auto;
}

.logowall-four .logo-header{
  padding:10px;
}

.logowall-four .logo-sub{
  width:70%;
  margin-bottom: 50px;
}

.logowall-four .logowall-logo{
  max-width:90%;
  padding:10px;
  height: 70px;
  display: block;
  margin-left: auto;
  margin-right: auto;
}


.logowall-four .box{
  padding:10px;
  margin-left:20px;
  margin-bottom: 20px;
  background-color: var(--fifth);
}

.logowall-five .logowall-logo{
  max-width:90%;
  padding:10px;
  height: 70px;
  display: block;
  margin-left: auto;
  margin-right: auto;
}

.logowall-five .box{
  padding:20px;
  margin-left:0px;
  margin-bottom: 20px;
  background-color: var(--fifth);
}

.logowall-five .box-rounded{
  padding:20px;
  margin-left:20px;
  margin-bottom: 20px;
  background-color: var(--fifth);
  border-radius: 25px;
}

.logowall-six .logowall-logo{
  width:100%;
  height: 70px;
  display: block;
  margin-left: auto;
  margin-right: auto;
}

.logowall-six .box{
  padding:20px;
  background-color: var(--fifth);
  border-radius: 70px;
}

.logowall-six .boxed{
  background-color: var(--fifth);
  margin-left:10px;
  margin-right:10px;
}


/*This is the style for the components of Contact section*/
.contact-logo{
  max-width:60%;
  max-height: 100px;
}

.contact-logo-s{
  max-width:30%;
  max-height: 80px;
  border-radius: 100%;
  margin-bottom: 20px;
}

/*Contact one*/

#contact-one{
  background: var(--secondary);
  color:var(--primary);

    padding:30px;
    margin-top:70px;
}

.contact .contact-img{
  border-radius: 40px;
  width:100%;
  height:500px;
  object-fit: cover;
}

.contact .contact-header{
  color:var(--primary);
  margin-bottom: 50px;
  margin-top: 120px;
  margin-left:50px;
}

.contact .contact-sub{
  margin-bottom:5px;
  color: var(--quaternary);
  margin-top:5px;
  margin-left:50px;
}

.contact .breaker{
  margin-top:30px;
  margin-bottom:30px;
}

.contact .comp-btn-1{
  color:var(--quaternary);
  border-color: var(--quaternary);
}

.contact .comp-btn-1:hover{
  color:var(--quaternary);
  border-color: var(--fifth);
}


/* Contact two */

#contact-two{
  color:var(--primary);
  padding-top:50px;
  padding-bottom: 50px;
  margin-top:100px;
  background: var(--sixth);
  border-top:1px solid var(--quaternary);
}


.contact-two .contact-discription{
  color: var(--primary);
  margin-top:20px;
  width:100%;
}


.contact-two .contact-discription-2{
  color: var(--primary);
  margin-top:20px;
  width:40%;

}

.contact-two .contact-header{
  color:var(--quaternary);
  margin-bottom: 20px;
}

.contact-two .contact-footer{
  border-top:1px solid var(--quaternary);
  margin-top: 100px;
  padding:10px;
}

#social-icon{
  color: var(--tertiary);
  font-size: 20px;
  margin-right:10px;
  transition: 0.3s;
}

 #social-icon:hover{
  color: var(--fifth);
  transition: 0.3s;
}

#social-icon-2{
  color: var(--primary);
  font-size: 20px;
  margin-top:10px;
  margin-right:20px;
  transition: 0.3s;
}

 #social-icon-2:hover{
  color: var(--fifth);
  transition: 0.3s;
}

.normal-contact-text{
  color:var(--secondary);
}
/* Contact three */
.contact-icon{
  font-size:30px;
  float:left;
  margin-bottom:20px;
  margin-top:-4px;
  margin-right:20px;
}


/* Contact three */
#contact-three{
 margin-top:100px;
 padding:0px;
}

.contact-three{
}

/* Contact four */

#contact-four{
  color:var(--secondary);
  padding-top:100px;
  padding-bottom: 10px;
  margin-top:70px;
  width:100%;
}

#contact-four .contact-header{
  margin-top:100px;
  margin-bottom: 30px;
  font-weight: bold;
}

#contact-four .contact-sub{
  margin-bottom: 30px;
}

#contact-four #social-icon{
  color:var(--secondary);
}

#contact-four .contact-icon{
  float:none;
  font-size: 50px;
}

/* Contact Five */

#contact-five{
  padding-bottom: 10px;
  margin-top:70px;
  color:var(--primary);
}

#contact-five #contact-box{
  background:var(--sixth);
  padding:10px;
  padding-top:25px;

  padding-bottom: 25px;
  border-radius: 10px;
}

#contact-five .contact-boxed{
  margin-left:30px;
  margin-right:30px;
}

#contact-five .radius-text{
  padding:5px;
  padding-left:15px;
  padding-right:15px;
  background: var(--fifth);
  width:auto;
  border-radius: 30px;
}

#contact-five .contact-header{
  margin-top:2px;
  display: block;
  width:50%;
  color:var(--tertiary);
}

#contact-five .contact-sub{
  color: var(--tertiary);
}

#contact-five .main-img{
  width:100%;
  padding:0px;
  border-radius: 20px;
}

#contact-five .contact-main{
  width:100%;
  margin-top:20px;
  margin-bottom: 15px;
}

#contact-five small{
  width:100%;
  margin-top:3px;
  margin-bottom: 3px;
}

#contact-five .comp-btn-5{
  margin-top:10px;
}


#contact-five i{
  margin-top:12px;
}


/*This is the style for the components of Gallery section*/
#gallery{
  margin-top: 100px;
  padding:0px;
}

/*Gallery one*/

#gallery .gallery-image-one{
  width:100%;
  height:700px;
  object-fit: cover;
}


/*Gallery two*/

#gallery .gallery-image-two{
  width:100%;
  height:600px;
  object-fit: cover;
}

/*Gallery three*/

#gallery .gallery-image-three{
  width:100%;
  height:500px;
  margin-bottom: 40px;
  object-fit: cover;
}

/*Gallery four*/
#gallery .gallery-image-four{
  width:100%;
  height:250px;
  margin-bottom: 40px;
  object-fit: cover;
  border-radius: 30px;
}

/*Gallery five*/

#gallery .light-box-bg{
  background: var(--primary);
}

#gallery .gallery-image-five{
  width:100%;
  height:600px;
  margin-bottom: 40px;
  object-fit: cover;
  border-radius: 30px;
}

#gallery .gallery-title{
  margin-bottom: 30px;
  color:var(--secondary);
}

#gallery .gallery-discription{

}

/*Gallery six*/

#gallery .gallery-image-six{
  width:100%;
  height:300px;
  margin-bottom: 15px;
  object-fit: cover;
}

#gallery .gallery-title{
  margin-top:5px;
  margin-bottom: 20px;
}

#gallery .gallery-discription{
  width:90%;
}

#gallery .light-box-bg .comp-btn-1{
  color:var(--fifth);
}


#gallery .light-box-bg .spaced{
  width:100%;
  margin-top:20px;
  letter-spacing: 2px;
}

#gallery .image-small{
  height:300px;
  width:100%;
  padding:0px;
  object-fit: cover;
}

#gallery .image-medium{
  height:400px;
  width:100%;
  padding:0px;
  object-fit: cover;
}

#gallery .image-large{
  height:600px;
  width:100%;
  padding:0px;
  object-fit: cover;
}

#gallery .box{
  margin-bottom: 30px;
}

#gallery .gallery-header{
  margin-top:20px;
}



/*Gallery Carousel*/
#gallery #gallery-carousel .carousel-image{
  height:500px;
}

#gallery-carousel{
  width:100%;
}

.carousel-item .carousel-image{
  width:100%;
  height:500px;
  object-fit: cover;
  border-radius: 20px;
}


/*This is the style for the components of Text section*/
#text{
  margin-top: 100px;
}

.text-header{

}

.text-sub{
  color: var(--tertiary);
  margin-top: 20px;
}

#text-paddingless{
  margin-bottom:-50px;
  margin-top:100px;
}

#text-paddingless .text-1 .text-header{
  width:70%;
  margin-left:auto;
  margin-right:auto;
  display: block;
}

#text-paddingless .text-1 .text-sub{
  width:80%;
  margin-left:auto;
  margin-right:auto;
  display: block;
  color:var(--tertiary);
}

#text-paddingless .text-2 .text-header{
  width:100%;
  margin-left:30px;
  font-weight: bold;
}

#text-paddingless .text-2 .text-small{
  width:100%;
  margin-bottom:5px;
  margin-left:30px;
  padding:0px;
}

#text-paddingless .text-2 .text-header-c{
  width:100%;
  margin-left:0px;
  font-weight: bold;
}

#text-paddingless .text-2 .text-small-c{
  width:100%;
  margin-bottom:5px;
  margin-left:0px;
  padding:0px;
}


#text-paddingless .comp-btn-square{
}


#text-paddingless .text-2 .text-sub{
    width:60%;
    margin-left:30px;
}

#text-paddingless .text-hr{
    width:100%;
    margin-left:10px;
    border-bottom: 7px solid var(--fifth);
    color:transparent;
    margin-top:30px;
}

/*Text one*/


#text .text-one .text-header{
  width:100%;
  padding-right:30px;
}

/*Text two*/

#text .text-two .text-header{
  color: var(--secondary);
  width:80%;
}

#text .text-two .text-sub{
  color: var(--tertiary);
  margin-bottom: 20px;
}

/*Text three*/

#text .text-three .text-header{
  color: var(--secondary);
  width:80%;
}

#text .text-three .text-sub{
  color: var(--tertiary);
}

/*Text three*/

#text .text-ten .text-header{
  width:100%;
}


/*Text four*/

#text .text-four .text-header{
  width:100%;
}

/*Text four*/


#text .text-four .text-header{
  width:100%;
}


#text-paddingless .backgrounded{
  background: var(--tertiary);
  color:var(--primary);
  width: min-content;
  padding:5px;
  padding-left: 20px;
  padding-right:20px;
  margin-left:30px;
  border-radius: 30px;
}

#text-paddingless .backgrounded-center{
  background: var(--fifth);
  color:var(--primary);
  width: min-content;
  padding:5px;
  padding-left: 20px;
  padding-right:20px;
  margin-left:30px;
  border-radius: 30px;
  margin-left:auto;
  margin-right:auto;
}

/*This is the style for the components Menu section*/

#menu{
  padding:0px;
  margin-top:100px;
}

#menu .menu-one{
  min-height:380px;
  border-radius: 10px;
  background: var(--quaternary);
  margin-left:20px;
  margin-right: 20px;
  margin-bottom: 40px;
  padding:0px;
}

#menu .menu-one-img{
  width:100%;
  object-fit: cover;
  height:200px;
  border-top-left-radius: 10px;
  border-top-right-radius: 10px;
}

#menu .menu-two-img{
  width:100%;
  object-fit: cover;
  height:300px;
  border-top-left-radius: 10px;
  border-top-right-radius: 10px;
}

#menu .menu-one .menu-header{
  margin-left:20px;
  margin-top:20px;
}

#menu .menu-one .menu-sub{
  margin-left:20px;
  margin-top:10px;
}

#menu .menu-one .menu-price{
  margin-right:20px;
  margin-bottom: 20px;
}

#menu .menu-two{
  margin-bottom: 40px;
  padding:0px;
  border-bottom: 2px solid var(--quaternary);
  padding-bottom: 20px;
}

#menu .menu-two .menu-header{
  margin-top:10px;
}


#menu .menu-two .menu-sub{
  margin-left:00px;
  margin-top:00px;
}

#menu .menu-two .menu-price{
  margin-top:-20px;
  padding:10px;
  border-left:2px solid var(--tertiary);
  border-right:2px solid var(--tertiary);
}

#menu .menu-two .menu-three{
  width:100px;
  height:100px;
  margin-right:40px;
  object-fit: cover;
  border-radius: 10px;
}


/*This is the style for the components Product section*/

#product{
  padding:0px;
  margin-top:100px;
}


.product-one{
  padding-left:30px;
  padding-right:30px;
  margin-bottom: 30px;
}

#product .product-one img{
  width:100%;
  border-radius: 20px;
  object-fit: cover;
  height:250px;
}

#product .product-one .product-title{
  margin-top:10px;
}

#product .image-small{
  height:300px;
  width:100%;
  padding:0px;
  object-fit: cover;
}

#product .image-medium{
  height:350px;
  width:100%;
  padding:0px;
  object-fit: cover;
}

#product .image-large{
  height:500px;
  width:100%;
  padding:0px;
  object-fit: cover;
}

#product .image-xl{
  height:650px;
  width:100%;
  padding:0px;
  object-fit: cover;
}

#product .text-container{
  margin-top:auto;
  margin-bottom: auto;
  padding:50px;
}

#product .bottom-tertiary{
  border-bottom: 2px solid var(--tertiary);
  padding-bottom: 20px;
}

#product .text-sub-border{
  border-top:1px solid var(--secondary);
  margin-top:20px;
  padding-top:10px;
}


#product .color-icon{
  width:30px;
  height:30px;
  margin-right:10px;
  border-radius: 100%;
  margin-top:5px;
  border:3px solid var(--secondary);
}

#product .branded{
  margin-top:5px;
}

#product p{
  margin:0px;
}

#product .product-box{
  background: var(--sixth);
  padding:25px;
  margin-left:25px;
  margin-right:25px;
  margin-bottom: 30px;
}

#product .product-box-border{
  border:1px solid var(--secondary);
  padding:25px;
  margin-bottom: 30px;
}

#product .product-box h5{
  color:var(--primary);
}

#product .product-box h6{
  color:var(--primary);
}

#product .border-top{
  border-top:2px solid var(--secondary);
  padding-top: 20px;
}

/*This is the style for the components Container section*/

#container{
  padding:0px;
  margin-top:70px;
  background: #e0facf;
  padding:50px;
}

#container-2{
  padding:0px;
  margin-top:100px;
}

.container-one{
  width:80%;
  background: var(--sixth);
  color:var(--primary);
  min-height:500px;
  border-radius: 30px;
}

.holder{
  height:inherit;
  padding:0px;
}

/*Container two*/

.container-two{
  width:80%;
  background: var(--sixth);
  padding:50px;
  color:var(--primary);
}

.container-two .image-one{
  width:95%;
  height:500px;
  margin-top:70px;
  object-fit: cover;
  padding:30px;
}

.container-two .header-text{
  padding:30px;
  margin-top:50px;
  margin-bottom: 30px;
  padding-right: 0px;
  padding-top:0px;
  width:100%;
}

.container-two #contain-box{
  margin-bottom:5px;
  padding:10px;
}

.container-two .ease-left{
  margin-top:9px;
  margin-bottom: 15px;
  width:100%;
  color:var(--primary);
}

.container-two .integer{
  padding:12px;
  background: var(--fifth);
  color:var(--primary);
  margin-bottom: 20px;
  width:50px;
  height:50px;
  border-radius: 100%;
  margin-left: auto;
  margin-right: auto;
  font-weight: bold;
}


.container-two .integer-l{
  padding:12px;
  background: var(--fifth);
  color:var(--primary);
  margin-bottom: 20px;
  width:50px;
  height:50px;
  border-radius: 100%;
  font-weight: bold;
}

/*Container three*/


#container .container-three{
  min-height:300px;
  color:var(--secondary);
}

.container-three .image-body{
  margin-top:auto;
  margin-bottom: auto;
  display: block;
  height:100%;
}

#contact-three #social-icon-2{
  color: var(--secondary);
  font-size: 20px;
  margin-top:10px;
  margin-right:20px;
  transition: 0.3s;
}

.container-three .text-body h1,h2,h3,h4,h5,p{
  color:var(--secondary);
}


.container-three .text-body h6{
  color:var(--fifth);
  width:70%;
  margin-bottom: 10px;
  margin-top:10px;
}


.container-three .container-header{
  margin-top:30px;
  margin-bottom: 30px;
  font-weight: bold;
  color:var(--secondary);
  width:100%!important;
}

.container-three .text-body h6{
  color:var(--fifth);
  width:70%;
}

.container-three .text-body .container-description{
  color:var(--tertiary);
  width:100%!important;
  margin:0px;
}

.container-three .integer{
  padding:12px;
  background: var(--fifth);
  color:var(--primary)!important;
  margin-bottom: 20px;
  width:50px;
  height:50px;
  border-radius: 100%;
  font-weight: bold;
}

.container-three .integer-discription{
  width:85%;
  margin-bottom: 30px;
  padding: 10px;
  padding-left:20px;
}

.container-three .comp-btn-round{
  float:left;
}

.container-three .comp-btn-square{
  float:left;
}

#container .container-three .container-image{
  width:100%;
  height: 550px;
  object-fit: cover;
}

#container .container-three .container-image-r{
  width:80%;
  height: 400px;
  object-fit: cover;
  margin-left:auto;
  margin-right: auto;
  display: block;
  border-radius: 20px;
}


/*Container four*/

.container-four{
  background: var(--primary);
  margin-top: 0px;
  padding-top:0px;
  padding:20px;
  color:var(--secondary);
}

.container-four .text-body{
  padding:30px;
  margin-top:0px;
  color:var(--secondary);
}

.container-four .body{
  margin-top:10px;
  padding:10px;
}

.container-four h1{
  margin-bottom: 30px;
  color:var(--secondary);
}

.container-four h5{
  color:var(--secondary);
  margin-bottom: 10px;
  font-weight: bold;
}

.container-four small{
  color:var(--secondary);
}

.container-four .main-image{
  height:50px;
  width:50px;
  margin-bottom: 20px;
}

.container-four .image-body{
  padding:0px;
  padding-left:30px;
  padding-right:30px;
  margin-top:auto;
  margin-bottom: auto;
}

.container-four .container-image{
  width:100%;
  height: 500px;
  object-fit: cover;
}

.img-padding{
  height:300px;
}

.text-holder{
  padding-left:50px;
}

.disc-holder{
  width:90%;
}

.container-five{
  margin-top:50px;
  height:200px;
  margin-bottom: 50px;
  width:100%;
}

#bg-holder{
  background: var(--quaternary);
  padding: 100px;
}

.container-five .rounded{
  border-radius: 30px!important;
}

.container-five .container-header{
  margin-left:100px;
  margin-top:100px;
  width:100%;
  margin-bottom: 30px;
}

.container-five .container-sub{
  margin-left:100px;
  width:70%;
  margin-bottom: 40px;
}

.container-five .comp-btn-round{
  margin-left:100px;
}

.container-five .comp-btn-square{
  margin-left:100px;
}


.container-five .main-image{
  max-width:90%;
  height:400px;
  margin-left:auto;
  margin-right: auto;
  margin-top:auto;
  margin-bottom: auto;
  display: block;
  margin-top:50px;
}

.container-five .container-icon{
  height:40px;
  width:40px;
  margin-left: 25px;
  margin-top:30px;
}

.container-five .container-head{
  margin-left:25px;
  margin-top:20px;
}

.container-five .container-subb{
  margin-left:25px;
  margin-top:150px;
  width:70%;
}

.container-six {
  height:300px;
}

.container-six .container-header{
  padding-top:70px;
  padding-bottom: 20px;
  width:70%;
}

.container-six .container-sub{
  width:70%;
}

.container-six .comp-btn-square{
}

/*Pricing Section*/

/*Pricing one*/

#pricing{
  padding:100px;
  margin-top:100px;
  background: var(--quaternary);
}

.pricing-main-text{
  margin-bottom: 50px;
  width:60%;
  margin-left:auto;
  margin-right:auto;
  color:var(--secondary);
}

#pricing .box-normal{
  padding:30px;
  background: ;
  border-radius: 20px;
  margin-bottom: 30px;
}

#pricing .pricing-branded{
  background: var(--sixth);
  padding:30px;
  color:var(--primary);
  border-radius: 20px;
  margin-bottom: 30px;
}

#pricing .small-branded{
  color: var(--fifth);
}

#pricing .price-discription-s{
  margin-bottom: 25px;
  margin-top:20px;
}


#pricing .price-discription-s{
  margin-bottom: 25px;
  margin-top:20px;
  color:var(--primary);
}

#pricing li{
  margin-top:10px;
  margin-left:15px;
}



@media (max-width: 992px) {

  .semi-giant{
      font-size:45px;
  }


  /*Faq Responsive Section*/

  /*Faq one */

  .headline-five{
    padding:10px;
  }

  .headline-five .headline-text{
    font-size:30px;
    margin-top:0px;
    margin-bottom: 0px;
    width:100%;
    font-weight: bold;
  }

  /*Faq Responsive Section*/

  /*Faq one */

  #faq{
    padding:0px;
  }
  /*Text Responsive Section*/

  /*Text one */


  #pricing{
    padding:10px;
  }

  .pricing-main-text{
    width:100%;
  }
  /*Text Responsive Section*/

  /*Text one */

  #text{
    padding:0px;
  }

  #text .text-one .text-header{
    width:100%;
    margin-bottom: 30px;
  }


  #text .text-two .text-header{
    width:100%;
    font-size: 40px;
  }

  /*Qoutes Responsive Section*/

  /*Qoutes one */

  .logowall-five .box-rounded{
    margin-left:0px;
  }

  .logowall-four .box{
    margin-left:0px;
  }


  /*Qoutes Responsive Section*/

  /*Qoutes one */

  #qoutes{
    padding:0px;
  }

  /*List Responsive Section*/

  /*List one */

  #list{
    padding:0px;
  }

  #list .list-main-text{
    margin-bottom: 50px;
    width:100%;
    margin-left:auto;
    margin-right:auto;
    color:var(--secondary);
  }

  .list .list-img{
    height:300px;
    width:100%;
  }

  .list-container{
    padding:10px;
  }


  /*Gallery Responsive Section*/

  /*Gallery one */

  #gallery{
    padding:0px;
  }

  /*People Responsive Section*/

  /*People one */

  #people{
    padding:0px;
  }

  .people-img{
    padding:0px;
  }

  #people .people-three .people-container{
    padding:20px;
  }


  /*Container Responsive Section*/
  .container-four{
  }


  .text-holder{
    margin-bottom: 30px;
  }

  .img-padding{
    margin-bottom: 30px;
  }

  #bg-holder{
    padding:10px;
  }

  .width-80{
    width:100%;
  }

  .width-60{
    width:100%;
  }

  .width-40{
    width:100%;
  }

  .container-four .container-image{
    height: 300px!important;
  }

  .container-three .container-image{
    height: 300px!important;
  }

  .container-three .comp-btn-round{
    margin-bottom: 20px;
  }

  .container-three .comp-btn-square{
    margin-bottom: 20px;
  }

  .container-five .rounded{
    border-radius: 30px!important;
    width: 95%;
    margin-left:10px;
  }

  .container-five .container-sub{
    margin-left: 20px;
  }

  .container-two{
    width:100%;
    padding:10px;
  }


  .container-two .image-one{
    width:100%;
    padding:10px;
    height:400px;
  }

  .container-five .container-header{
    margin-left: 20px;
  }

  .container-five .comp-btn-round{
    margin-left: 20px;
  }

  .container-five .comp-btn-square{
    margin-left: 20px;
  }

  .container-three .container-image-r{
    width:100%!important;
    height: 400px;
    margin-top:20px;
    margin-bottom: 20px;
  }


  /*Work Responsive Section*/
  #work{
    padding:0px;
  }

  #work .container{
    padding:0px;
  }



  /*Quotes Responsive Section*/

  /* Quotes 4*/
  .quote-four{
    padding:10px;
    margin-left:0px;
    margin-right:0px;
    margin-bottom: 30px;
  }

  .quote-four .qoutes-profile{
    width:80px;
    height:80px;
    border-radius: 100%;
    object-fit: cover;
    margin-bottom:30px;
  }

  .quote-four .qoutes-header{
    font-size:20px;
    margin-bottom: 5px;
    color:var(--tertiary);
    width:100%;
    margin-left:0px;
  }

  .quote-four .qoutes-main{
    color: var(--secondary);
    display: block;
    width:100%;
    margin-left:0px;
    margin-top:3px;
  }



  /*Work one */

  /*Contact Responsive Section*/

  /*Contact two */

  #contact-two{
    color:var(--secondary);
    padding:30px;
    margin-top:70px;
    background: var(--primary);
    border-top:1px solid var(--quaternary);
  }

  .contact-two .contact-discription{
    color: var(--tertiary);
    margin-top:20px;
    margin-bottom: 50px;
    width:100%;
  }

  .contact-header{
    margin-top:20px;
  }


  .container-five{
    min-height:550px;
  }

  .container-five h5{
    margin-top:25px;
    margin-bottom: 0px;
  }

  .text-left{
    margin-left:10px;
  }

  .hyper-giant{
    font-size:70px;
  }

  .master-sub{
    width:90%!important;
  }

  #container{
    padding:0px;
    padding-top: 50px;
    padding-bottom: 50px;
  }

  .bg-header-right{
    height:auto;
    padding-bottom: 30px;
  }

  .header-background {
    pointer-events: none;
    position: absolute;
    width: 100%;
    height: 100%;
    object-fit: cover;
    z-index: -1;
  }

}
