html {
  scroll-behavior: smooth;
}

/* NAVBAR START*/

body {
  margin: 0;
 }

.topnav {
  overflow: hidden;
  background-color: #390036;
}

.topnav a {
	float: left;
	display: block;   
	padding: 20px 0px 15px 0px;
	text-decoration: none;
	text-align: center;
	color: #ffffff;
	font-size:15px;
	font-weight: bold;
	margin-left: 80px;
	
}

.topnav a:hover {
   color:  #ecbc5c;
}

.topnav a.active {
   color:  #ecbc5c;
}

.topnav .icon {
  display: none;
}

@media screen and (max-width: 600px) {
  .topnav a:not(:first-child) {display: none;}
  .topnav a.icon {
    float: right;
    display: block;
  }
}

@media screen and (max-width: 800px) {
  .topnav.responsive {position: relative;}
  .topnav.responsive .icon {
    position: absolute;
    right: 0;
    top: 0;
  }
  .topnav.responsive a {
    float: none;
    display: block;
    text-align: left;
  }
}


.border{
	margin: 0px;
	padding: 0px;
	background-color: #390036;
	width: 100%;
}

/* NAVBAR END*/

/* WELCOME SECTION START */

#about{
	margin: 5%;
	color: #390036;
}

/* WELCOME SECTION END */

/* DIVIDER */

.view {
	margin-top:1px;
	text-align:center;
}
.view-more {
	display:block;
	padding-top:50px;
	padding-bottom:37px;
	font-family: 'Poppins',Arial,Helvetica,sans-serif;
	font-size:16px;
	line-height:18px;
	font-weight:normal;
	transition: all .3s ease 0s;
}

/* DIVIDER */

/* WE DO SECTION START*/

.idea-check{
	margin: 1%;
}

.idea{
	display: flex;
	width: 100%;
	justify-content: center;
	flex-wrap:  wrap;
	
}

.first{
	max-width: 500px;
	height: 150px;
	margin: 30px;
	margin-bottom: 50px;
	background: #ffffff;
	line-height: 25px;
	color: #390036;
	width: 100%;
	box-shadow: 1px 2px 4px 3px #cccccc;
}

.first:hover {
  box-shadow: 3px 3px 8px 6px #cccccc;
}

.first h3{
	text-align: center;
	padding: 15px;	
	font-family: 'mandala',Arial;
}

.role{
	text-indent: 15px;
	padding: 10px;
	text-align: center;
	font-size: 15px;

}

/* WE DO SECTION START*/

/* FEATURED SERVICES SECTION START */

.service-check{
	margin: 1%;
}

.service{
	display: flex;
	width: 100%;
	justify-content: center;
	flex-wrap:  wrap;

	}

.second{
	max-width: 270px;
	max-height: 250px;
	margin: 70px;
	margin-bottom: 10px;
	background: #ffffff;
	width: 100%;
	box-shadow: 1px 2px 4px 3px #cccccc;


}

.second:hover {
  box-shadow: 3px 3px 8px 6px #cccccc;
}

.second h3{
	text-align: center;
	padding: 15px;
	font-size:14px;
	color: #ffffff;
	background-color: #390036;
	font-family: 'mandala',Arial;
}

/* FEATURED SERVICES SECTION END */

/* CONTACT SECTION START */

.contact {
	display: flex;
	width: 100%;
	flex-wrap:  wrap;
	margin: 40px 0px 10px 0px;

}


.container{
	max-width:	600px;
	max-height: 550px;
	background: #ffffff;
	width: 100%;
	overflow: hidden;
}


.sec1{
	width: 100%;
	height: auto;
		color: white;

}


.sec2 {
	margin: 20px 30px 30px 30px;
	width: 100%;
	height: auto;

}

.headimg{
	padding-left: 120px;
}

.icon-cont{
	margin: 0px 10px 10px 50px;
	display: block;
	color: #390036;
}

.icon-cont p{
	display: inline;
	vertical-align: bottom;
	font-family: 'mandala',Arial;
	font-weight: bold;
	padding-left: 15px;
	font-size: 18px;
	 color: #ecbc5c;
}

.icon-text{
	padding-left: 120px;
	color: #390036;
	font-size: 14px;
	line-height: 1.6em;
}

.icon-soc{
	float:right;
	padding: 0px 20px 20px 0px;
}

.icon-soc img:hover {
  box-shadow: 1px 1px 3px 3px #cccccc;
}

/* CONTACT SECTION END */

/* FOOTER SECTION START */


.footer {
	left: 0;
	bottom: 0;
	width: 100%;
	background-color: #390036;
	height: auto;

}

.footer .footer-content{
	height: 100%;
	display: flex;
	width: 100%;
	justify-content: center;
	flex-wrap:  wrap;

}

.footer .footer-content .footer-section{
	flex: 1;
	color: #ffffff;
	margin: 50px 50px 40px 175px;
	font-family: 'Poppins',Arial, Helvetica, sans-serif;
	font-size:14px;
	font-weight:normal;
	line-height: 1.2em;

}

.footer .footer-content .footer-section h3{
	text-decoration: none;
	color: #ecbc5c;
	font-size: 20px;
	font-family: 'mandala',Arial,Helvetica,sans-serif;
}

.footer .footer-content .footer-section a{
	text-decoration: none;
	color: #ffffff;
	list-style: none;
	margin: 0;
	padding:0;
}

.footer .footer-content .footer-section li{
	padding-bottom:7px;
	list-style: none;
}

.footer .footer-bottom{
	background-color: #390036;
	color: #ffffff;
	height: 60px;
	width: 100%;
	position: relative;
	padding-top: 20px;
	padding-left:30px;
	font-size: 12px;
	border-top: 1px dashed #ecbc5c;
}

.footer-down{
	padding: 0px 35px 0px 0px;
	display: inline-block;
	float: right;
}

.footer-down a{
	padding: 3px;
}


/* FOOTER SECTION END */

/* FONT */

@font-face {
    font-family: 'mandala';
    src: url('mandala-webfont.woff2') format('woff2'),
         url('mandala-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;

}

/* FONT */

/* IMAGE SLIDER START 1*/

* {box-sizing: border-box}
body {font-family: Verdana, sans-serif; margin:0}
.mySlides {display: none}
img {vertical-align: middle;}

/* Slideshow container */
.slideshow-container {
  max-width: auto;
   margin: auto;
}


/* Fading animation */
.fade {
  -webkit-animation-name: fade;
  -webkit-animation-duration: 1.5s;
  animation-name: fade;
  animation-duration: 1.5s;
}

@-webkit-keyframes fade {
  from {opacity: .4}
  to {opacity: 1}
}

@keyframes fade {
  from {opacity: .4}
  to {opacity: 1}
}

/* IMAGE SLIDER  END 1*/

/* IMAGE SLIDER START 2*/

* {box-sizing: border-box}
body {font-family: Verdana, sans-serif; margin:0}
.mySlides {display: none}
img {vertical-align: middle;}

/* Slideshow container */
.slideshow-container2 {
  max-width: 700px;
   margin: auto;
}


/* Fading animation */
.fade {
  -webkit-animation-name: fade;
  -webkit-animation-duration: 1.5s;
  animation-name: fade;
  animation-duration: 1.5s;
}

@-webkit-keyframes fade {
  from {opacity: .4}
  to {opacity: 1}
}

@keyframes fade {
  from {opacity: .4}
  to {opacity: 1}
}

/* IMAGE SLIDER END 2*/

/* ABOUT PAGE */

/* QUOTE */

.quote {
	margin-top:1px;
	text-align:center;
}
.quote-more {
	display:block;
	padding-top:35px;
	padding-bottom:35px;
	font-family: 'mandala',Arial,Helvetica,sans-serif;
	line-height:1.2em;
	font-weight:normal;
	transition: all .3s ease 0s;
	background-color: #390036;
	font-size: 26px;
	color: #fff;

}.quote-more span{
	font-family: 'mandala',Arial,Helvetica,sans-serif;
	background-color: #390036;
	font-size: 34px;
	color: #ecbc5c;
	line-height:1.2em;
}

/* QUOTE */

/* OUR STORY */

* {
  box-sizing: border-box;
}

.ourstory{
	padding: 1% 5% 1% 5%;
}

/* Create two equal columns that floats next to each other */
.ourstory-col {
  float: left;
  width: 50%;
  padding-left: 30px;

}

/* Clear floats after the columns */
.ourstory:after {
  content: "";
  display: table;
  clear: both;
}

/* Responsive layout - makes the two columns stack on top of each other instead of next to each other */
@media screen and (max-width: 600px) {
  .ourstory-col {
    width: 100%;
  }
}

.ourstory-head-main img {
  display: block;
  margin-left: auto;
  margin-right: auto;
  padding-top: 45px;
  padding-bottom: 45px;

}

.ourstory-head img {
  display: block;
  margin-left: auto;
  margin-right: auto;
  padding-top: 15px;
}

.ourstory-head-text p{
  display: block;
  text-align: center;
  padding: 2px;
  font-family: 'mandala',Arial,Helvetica,sans-serif;
  font-size: 34px;
  color: #ecbc5c;
}
.ourstory-head span{
  display: block;
   margin-right: auto;
  padding : 20px 30px 10px 10px;
  font-size: 15px;
  color: #390036;
  text-align: center;
  text-indent: 30px;
  line-height: 1.6em;
}
/*OUR STORY*/

/* WHY CHOOSE US START */

.choose-check{
	margin: 1%;
}

.choose{
	display: flex;
	width: 100%;
	justify-content: center;
	flex-wrap:  wrap;

	}

.choose-cont{
	max-width: 250px;
	max-height: 700px;
	margin: 30px;
	margin-bottom: 10px;
	width: 100%;
	box-shadow: 1px 2px 4px 3px #cccccc;

}

.choose-cont:hover {
  box-shadow: 3px 3px 8px 6px #cccccc;
}

.choose-cont h3{
	text-align: center;
	padding: 15px;
	font-size:18px;
	color: #ecbc5c;
	font-family: 'mandala',Arial;
}

.choose-cont p{
	text-align: center;
	padding: 0px 15px 15px 15px;
	font-size:14px;
	color: #390036;
	font-family:'Arial';
	line-height: 1.6em;

}

/* WHY CHOOSE US END */

/*CUSTOMER START*/

* {box-sizing: border-box}
.mySlides1, .mySlides2 {display: none}
img {vertical-align: middle;
}

/* Slideshow container */
.slideshow-container1 {
  max-width: 500px;
   margin-left: 50px;
}


/* Next & previous buttons */
.prev, .next {
  cursor: pointer;
  position: relative;
  top: 50%;
  width: auto;
  padding: 10px;
  margin-top: -22px;
  color: #390036;
  font-weight: bold;
  font-size: 18px;
  transition: 0.6s ease;
  border-radius: 0 3px 3px 0;
  user-select: none;
  left: 180px;
}

/* Position the "next button" to the right */
.next {
  right: 0;
  border-radius: 3px 0 0 3px;
}

/* On hover, add a grey background color */
.prev:hover, .next:hover {
   color: #ecbc5c;

}


/* CUSTOMER END */

.about-img {
  max-width: 100%;

 }

/* ABOUT OVER */

/* SERVICES START */

.serv-cont {

     text-align: center;
  color: red;
 }

.serv-text{
	 top: 8px;
  right: 16px;
}

.service-head{
	margin: 3% 5% 2% 5%;
	padding-left: 2%;
	color: #390036;
		

}

/* DIVIDER */

.view-serv{
	margin-top:0px;
	
}
.view-more-serv{
	display:block;
	padding-top:60px;
	padding-bottom:60px;
	line-height:18px;
	font-weight:normal;
	transition: all .3s ease 0s;
	padding-left: 90px;
}

/* DIVIDER */

/* SERVICES TYPE START */

.serv-check{
	margin: 1%;
}

.service{
	display: flex;
	width: 100%;
	justify-content: center;
	flex-wrap:  wrap;
}

.serv-cont{
	max-width: 550px;
	max-height: auto;
	margin: 30px;
	margin-bottom: 10px;
	width: 100%;
	box-shadow: 3px 3px 3px 6px #cccccc;
	background-color: #390036;
	

}

.serv-cont:hover {
  box-shadow: 6px 6px 7px 7px #cccccc;
}

.serv-cont h3{
	text-align: center;
	padding: 20px;
	font-size:24px;
	color: #ecbc5c;
	font-family: 'mandala',Arial;
}

.serv-cont p{
	margin: 10px 20px 20px 20px;
	padding: 10px 30px 30px 30px;
	font-size:14px;
	color: white;
	font-family:'Arial';
	line-height: 1.6em;
	border-bottom: 2px solid white;
	border-left: 2px solid white;
	border-right: 2px solid white;
	text-align: justify;
	text-indent: 40px;
}



/* SERVICES TYPE END */

/* PRODUCT GALLERY START*/

* {
  box-sizing: border-box;
}


/* Center website */
.main {
  max-width: 1200px;
  margin: auto;
}

h1 {
  font-size: 50px;
  word-break: break-all;
}

.row {
  margin: 10px;
}

/* Add padding BETWEEN each column */
.row,
.row > .column {
  padding: 10px;
}

/* Create three equal columns that floats next to each other */
.column {
  float: left;
  width: 100%;
  display: none; /* Hide all elements by default */
  max-width: 250px;
  height: auto;
  margin: 15px;
  box-shadow: 1px 2px 4px 3px #cccccc;
  }

.column:hover {
  box-shadow: 3px 3px 8px 6px #cccccc;
}


/* Clear floats after rows */ 
.row:after {
  content: "";
  display: table;
  clear: both;
}

/* Content */
.content {
  background-color: white;
}

/* The "show" class is added to the filtered elements */
.show {
  display: block;
}

/* Style the buttons */
.btn {
  border: none;
  outline: none;
  padding: 12px 16px;
  background-color: white;
  cursor: pointer;
  
}

.btn:hover {
  background-color: #ddd;
}

.btn.active {
  background-color: #390036;
  color: white;
}

/* PRODUCT GALLERY END*/

/* CONTACT FORM */

/* Style inputs */
input[type=text], select, textarea {
  max-width: 300px;
  width: 100%;  
  padding: 12px;
  border: 1px solid #ccc;
  margin-top: 6px;
  margin-bottom: 16px;
  resize: vertical;
  color: #390036;
}

input[type=number], select, textarea {
  max-width: 300px;
  width: 100%;
  padding: 12px;
  border: 1px solid #ccc;
  margin-top: 6px;
  margin-bottom: 16px;
  resize: vertical;
  color: #390036;
}

input[type=email], select, textarea {
	color: #390036;
	max-width: 300px;
  width: 100%;
  padding: 12px;
  border: 1px solid #ccc;
  margin-top: 6px;
  margin-bottom: 16px;
  resize: vertical;
}

textarea{
	max-width: 400px;
	width: 100%;
	color: #390036;
} 

input[type=submit] {
  background-color: #390036;
  color: white;
  padding: 12px 20px;
  border: none;
  cursor: pointer;
   max-width: 150px;
}

input[type=reset] {
  background-color: #390036;
  color: white;
  padding: 12px 20px;
  border: none;
  cursor: pointer;
  margin-left: 10px;
  max-width: 150px;
  
}

input[type=submit]:hover {
  color: #ecbc5c;
}

input[type=reset]:hover {
  color: #ecbc5c;
}

/* Style the container/contact section */
.contact-cont {
  border-radius: 5px;
  background-color: #d7ccd7;
  padding: 20px;
}

/* Create two columns that float next to eachother */
.cont-column {
  float: left;
  width: 50%;
  margin-top: 6px;
  padding: 20px;
  color: #390036;
  
}

/* Clear floats after the columns */
.cont-row:after {
  content: "";
  display: table;
  clear: both;
}

/* Responsive layout - when the screen is less than 600px wide, make the two columns stack on top of each other instead of next to each other */
@media screen and (max-width: 600px) {
  .cont-column, input[type=submit] {
    width: 100%;
    margin-top: 0;
  }
}
/* CONTACT END */

/* WHATSAPP START */

.icon-bar {
  position: fixed;
  top: 90%;
  z-index: 98;
  -webkit-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  transform: translateY(-50%);
  right:0px;
 }

.icon-bar a {
  display: block;
  text-align: center;
 color: #390036;
  transition: all 0.3s ease;
   font-size: 12px;
   border-radius: 10px;
   text-decoration: none;
   padding-right: 8px;
   background-color: #cccccc;
}

.icon-bar a:hover {
    cursor: pointer;
}

/* WHATSAPP END */

/* GO TO TOP */

#myBtn {
  display: none;
  position: fixed;
  bottom: 20px;
  left: 20px;
  z-index: 99;
   border: none;
  outline: none;
  background-color: #390036;
  cursor: pointer;
  padding: 10px;
  border-radius: 50%;
}

/* GO TO TOP */

/* TERMS */

.term{
	margin: 20px 50px 30px 50px;
	padding-top: 30px;
	color: #390036;
	}
	
.term h1{
	text-align: center;
	font-size:36px;
	color: #ecbc5c;
	font-family: 'mandala',Arial;
}
	
.term h2{
	text-align: left;
	font-size:24px;
	color: #ecbc5c;
	font-family: 'mandala',Arial;
	padding: 10px
}	

.term p{
	text-align: left;
	font-size: 15px;
	color: #390036;
	text-align: justify;
	text-indent: 30px;
	line-height: 1.6em;
	list-style: none;
}	
.term ol{
	padding-left:50px;
	text-align: left;
	font-size: 15px;
	color: #390036;
	text-align: justify;
	line-height: 1.6em;
}	

	
/* TERMS */	

/* RENTAL */

.rental{
	margin: 20px 50px 30px 50px;
	padding-top: 30px;
	color: #390036;
	}
	
.rental h1{
	text-align: center;
	font-size:36px;
	color: #ecbc5c;
	font-family: 'mandala',Arial;
}
	
.rental h2{
	text-align: left;
	font-size:24px;
	color: #ecbc5c;
	font-family: 'mandala',Arial;
	padding: 10px
}	

.rental p{
	text-align: left;
	font-size: 15px;
	color: #390036;
	text-align: justify;
	line-height: 1.6em;
	
}	
.rental ol{
	padding-left:50px;
}	

	
/* TERMS */	

/* HOW IT WORKS */

.rental-check{
	margin: 3%;
	box-shadow: 3px 3px 8px 6px #cccccc;
}

.rental-box{
	display: flex;
	width: 100%;
	justify-content: center;
	flex-wrap:  wrap;

	}

.rental-cont{
	max-width: 250px;
	max-height: 700px;
	margin: 30px;
	margin-bottom: 10px;
	width: 100%;
}

.rental-cont-img img{
	 display: block;
  margin-left: auto;
  margin-right: auto;
}


.rental-cont h3{
	text-align: center;
	padding: 15px;
	font-size:18px;
	color: #390036;
	font-family: 'mandala',Arial;
}

.rental-cont h2{
	text-align: center;
	padding: 15px;
	font-size:18px;
	color: #390036;
	font-family: 'mandala',Arial;
}

.rental-cont p{
	text-align: center;
	padding: 0px 15px 15px 15px;
	font-size:14px;
	color: #390036;
	font-family:'Arial';
	line-height: 1.6em;

}

.approach-check{
	margin: 1%;
	
}

/* HOW IT WORKS */

/* SOME RENTAL */

.rentalsome-check{
	margin: 1%;
	
}

.rentalsome-box{
	display: flex;
	width: 100%;
	justify-content: center;
	flex-wrap:  wrap;

	}

.rentalsome-cont{
	max-width: 250px;
	max-height: 700px;
	margin: 30px;
	margin-bottom: 10px;
	width: 100%;
	box-shadow: 3px 3px 7px 5px #cccccc;
	
	
}


.rentalsome-cont h3{
	text-align: center;
	padding: 15px;
	font-size:18px;
	color: #ffffff;
	background-color: #390036;
	font-family: 'mandala',Arial;
}

/* SOME RENTAL */


.show {
    display: block;
}

.hide {
    display: none
}