/* ----------------------------------------------------------------
	Custom CSS

	Add all your Custom Styled CSS here for New Styles or
	Overwriting Default Theme Styles for Better Handling Updates
-----------------------------------------------------------------*/
#logo img {
    height: 100px!important;
}
.menu-link{
	font-family: 'Montserrat'!important;
	font-weight: 500;
	color: #00A0A0;
	text-transform: none;
}
.menu-item a:hover{
	color: #AC7E48!important;
	font-weight: 700;
}
@media (min-width: 992px){
	.menu-link{
		padding: 39px 9px;
		font-size: 0.9vw;
	}
}
.current{
	color: #AC7E48;
	font-weight: 700;
}

.slider-font{
	font-size: 18px;
	text-transform: initial;
	letter-spacing: 1;
	color: #00A0A0;
	font-weight: lighter;
	font-size: 35px;
}
.montserrat{
   font-family: 'Montserrat', sans-serif !important;
}
.source-pro{
	font-family: 'Source Sans Pro', sans-serif !important;
}
.heading-block::after {
    content: '';
    display: block;
    margin-top: 30px;
    width: 40px;
    border-top: 2px solid #e7b977;
}
.floating-cloud{
	position: absolute;
	/*top: 0;*/
	bottom: -5%;
	left: -60px;
	width: 65%;
	z-index: 20;
}
.custom-button{
	border-radius: 50px;
	color: #00A0A0;
	border: 1px solid #00A0A0;
	background-color: transparent!important;
	text-shadow: none!important;
	font-weight: normal;
	font-family: montserrat;
}
.custom-button:hover{
	background-color: #00A0A0!important;
}
div.vertical-line {
    width: 0.5px;
    background-color: #e7b977;
    height: 100%;
    float: none;
    margin: auto;
    margin-top: 10px;
}
.icon-div{
	margin-top: 20px;
	padding: 20px;
}
.icon-div span{
	color: #00A0A0;
	font-size: 20px;
}
.section-how{
	/*background: url(../images/how-to-take-title.png);
	background-size: 35%; 
	background-repeat: no-repeat; 
	background-position: top; */
	background-color: #fff;
}
.how-to-take-div{
	margin-top: 80px;
	padding-top: 80px;
}
.htt span{
	color: #00A0A0;
	font-size: 20px;
}
.htt img{
	width: 20%;
}
.achievement-heading::after{
	border-top: 2px solid #E8BA77;
}
.testimonial-heading::after{
	border-top: 2px solid #fff;
}
.section-testimonial{
	/*background: url(../images/testimonial-bg.png);
	background-size: 100%; 
	background-repeat: no-repeat; 
	background-position: top; */
	background-color: #063938;
}
.section-contact{
	/*background: url(../images/contact-home-bg.png);
	background-size: 100%; 
	background-repeat: no-repeat; 
	background-position: top; */
	background-color: #006362;
}
.section-comparison{
	border-radius: 50% 50% 0 0;
}
.contact-heading::after{
	border-top: 2px solid #AC7E48;
}
#footer{
	background-color: #00A0A0;
}
.copyright-links a{
	color: white;
	font-size: 18px;
	font-weight: lighter;
}
.about-text{
	text-align: justify;
}
.text-center .custom-heading::after{
	margin: 30px 0!important;
}

/* .twentytwenty-horizontal */
.twentytwenty-horizontal .twentytwenty-handle::before,
.twentytwenty-horizontal .twentytwenty-handle::after {
	content: " ";
	display: block;
	background: white;
	position: absolute;
	z-index: 30;
	-webkit-box-shadow: 0px 0px 12px rgba(51, 51, 51, 0.5);
	-moz-box-shadow: 0px 0px 12px rgba(51, 51, 51, 0.5);
	box-shadow: 0px 0px 12px rgba(51, 51, 51, 0.5);
}

.twentytwenty-horizontal .twentytwenty-handle::before,
.twentytwenty-horizontal .twentytwenty-handle::after {
	width: 3px;
	height: 9999px;
	left: 50%;
	margin-left: -1.5px;
}

.twentytwenty-before-label,
.twentytwenty-after-label,
.twentytwenty-overlay {
	position: absolute;
	top: 0;
	width: 100%;
	height: 100%;
}

.twentytwenty-before-label,
.twentytwenty-after-label,
.twentytwenty-overlay {
	-webkit-transition-duration: 0.5s;
	-moz-transition-duration: 0.5s;
	transition-duration: 0.5s;
}

.twentytwenty-before-label,
.twentytwenty-after-label {
	-webkit-transition-property: opacity;
	-moz-transition-property: opacity;
	transition-property: opacity;
}

.twentytwenty-before-label::before,
.twentytwenty-after-label::before {
	color: white;
	font-size: 13px;
	letter-spacing: 0.1em;
}

.twentytwenty-before-label::before,
.twentytwenty-after-label::before {
	position: absolute;
	background: rgba(255, 255, 255, 0.2);
	line-height: 38px;
	padding: 0 20px;
	-webkit-border-radius: 2px;
	-moz-border-radius: 2px;
	border-radius: 2px;
}

.twentytwenty-horizontal .twentytwenty-before-label::before,
.twentytwenty-horizontal .twentytwenty-after-label::before {
	top: 50%;
	margin-top: -19px;
}

.twentytwenty-left-arrow,
.twentytwenty-right-arrow {
	width: 0;
	height: 0;
	border: 6px inset transparent;
	position: absolute;
}

.twentytwenty-left-arrow,
.twentytwenty-right-arrow {
	top: 50%;
	margin-top: -6px;
}

.twentytwenty-container {
	-webkit-box-sizing: content-box;
	-moz-box-sizing: content-box;
	box-sizing: content-box;
	z-index: 0;
	overflow: hidden;
	position: relative;
	-webkit-user-select: none;
	-moz-user-select: none;
	border: 5px solid white;
	border-radius: 100px;
}
.twentytwenty-container img {
	width: 100%;
	position: absolute;
	top: 0;
	display: block;
}
.twentytwenty-container.active .twentytwenty-overlay,
.twentytwenty-container.active:hover.twentytwenty-overlay { background: rgba(0, 0, 0, 0); }

.twentytwenty-container.active .twentytwenty-overlay .twentytwenty-before-label,
.twentytwenty-container.active .twentytwenty-overlay .twentytwenty-after-label,
.twentytwenty-container.active:hover.twentytwenty-overlay .twentytwenty-before-label,
.twentytwenty-container.active:hover.twentytwenty-overlay .twentytwenty-after-label { opacity: 0; }

.twentytwenty-container * {
	-webkit-box-sizing: content-box;
	-moz-box-sizing: content-box;
	box-sizing: content-box;
}

.twentytwenty-before-label { opacity: 0; }
.twentytwenty-before-label::before { content: "Before"; }

.twentytwenty-after-label { opacity: 0; }
.twentytwenty-after-label::before { content: "After"; }

.twentytwenty-horizontal .twentytwenty-before-label::before { left: 10px; }
.twentytwenty-horizontal .twentytwenty-after-label::before { right: 10px; }

.twentytwenty-overlay {
	-webkit-transition-property: background;
	-moz-transition-property: background;
	transition-property: background;
	background: rgba(0, 0, 0, 0);
	z-index: 25;
}

.twentytwenty-overlay:hover .twentytwenty-after-label { opacity: 1; }
.twentytwenty-overlay:hover .twentytwenty-before-label { opacity: 1; }

.twentytwenty-before { z-index: 20; }
.twentytwenty-after { z-index: 10; }

.twentytwenty-handle {
	height: 38px;
	width: 38px;
	position: absolute;
	left: 50%;
	top: 50%;
	margin-left: -22px;
	margin-top: -22px;
	border: 3px solid white;
	-webkit-border-radius: 1000px;
	-moz-border-radius: 1000px;
	border-radius: 1000px;
	background-color: #FFF;
	-webkit-box-shadow: 0px 0px 12px rgba(51, 51, 51, 0.5);
	-moz-box-shadow: 0px 0px 12px rgba(51, 51, 51, 0.5);
	box-shadow: 0px 0px 12px rgba(51, 51, 51, 0.5);
	z-index: 40;
	cursor: pointer;
}

.twentytwenty-horizontal .twentytwenty-handle::before {
	bottom: 50%;
	margin-bottom: 22px;
	-webkit-box-shadow: 0 3px 0 white, 0px 0px 12px rgba(51, 51, 51, 0.5);
	-moz-box-shadow: 0 3px 0 white, 0px 0px 12px rgba(51, 51, 51, 0.5);
	box-shadow: 0 3px 0 white, 0px 0px 12px rgba(51, 51, 51, 0.5);
}

.twentytwenty-horizontal .twentytwenty-handle::after {
	top: 50%;
	margin-top: 22px;
	-webkit-box-shadow: 0 -3px 0 white, 0px 0px 12px rgba(51, 51, 51, 0.5);
	-moz-box-shadow: 0 -3px 0 white, 0px 0px 12px rgba(51, 51, 51, 0.5);
	box-shadow: 0 -3px 0 white, 0px 0px 12px rgba(51, 51, 51, 0.5);
}

.twentytwenty-left-arrow {
	border-right: 6px solid #e6b877;
	left: 50%;
	margin-left: -17px;
}

.twentytwenty-right-arrow {
	border-left: 6px solid #e6b877;
	right: 50%;
	margin-right: -17px;
}
/* twentytwenty-horizontal End */

.bg-pattern-left{
	position: absolute;
	width: 30%;
	top: 30%;
	left: -15%;
}

.bg-pattern-right{
	position: absolute;
	width: 30%;
	bottom: 5%;
	right: -15%;
}

.bird-bg{
	position: absolute;
	/*z-index: 1000;*/
	top: 0;
	width: 100%;
	opacity: 0.5;
}

.vm-1{
	border-right: 3px solid #009e9e;
}
.vm-block{
	padding: 0px 80px;
}
.year-font{
	font-size: 48px;
	color: #009e9e;
	margin-top: 30px;
}
.about-banner-bg{
	background-image: url('../images/about-us-top-banner.jpg'); 
	background-size: cover;
	background-position: center;
}
.product-banner-bg{
	background-image: url('../images/products-banner-1.png'); 
	background-size: cover;
	background-position: center;
}
.gallery-banner-bg{
	background-image: url('../images/gallery-banner.jpg'); 
	background-size: cover;
	background-position: center;
}
.shop-button{
	background-image: linear-gradient(to right, #FFDB9C, #ECBE81, #CE9345);
	color: #22365B;
	border-radius: 50px;
	text-transform: uppercase;
	font-weight: bold;
	border: 5px solid white;
	font-size: 18px;
	padding: 10px 20px 10px 20px;
}
#gotoTop:hover{
	background-color: black!important;
}
@media (max-width: 767px){
	#logo img{
		height: 80px!important;
	}
	.slider-bg{
		background-image: url(../images/slider-bg-mobile.png)!important;
		min-height: 500px!important;
	}
	.product-banner-bg{
		background-image: url(../images/products-banner-1-mobile.png)!important;
		min-height: 500px!important;
	}
	.copyright-links a{
		text-align: center;
		display: block;
		line-height: 2;
	}
	.logo-footer, .mobile-social{
		text-align: center;
	}
	.section-about{
		background-attachment: fixed!important;
		background-size: 200%!important;
	}
	.section-how{
		/*background-size: 150%;*/
	}
	.section-features{
		padding-top: 50px!important;
	}
	.section-testimonial{
		background: #063938;
	}
	.about-text{
		text-align: center;
	}
	.section-comparison{
		border-radius: 200px 200px 0 0;
	}
	.mobile-box{
		display:block!important;
	}
	.mobile-center{
		margin: auto;
		text-align: center;
	}
	.bg-pattern-left, .bg-pattern-right, .bird-bg{
		display: none;
	}
	.vm-1{
		border: none;
	}
	.vm-block{
		margin-bottom: 50px;
		padding: 0px 10px;
	}
	.about-banner-bg{
		background-image: url(../images/about-us-top-banner-mobile.png)!important;
		min-height: 600px!important;
	}
	.mobile-birdnest{
		width: 100%!important;
	}
}

@media(min-width: 320px) and (max-width: 400px){
	.slider-bg{
		background-image: url(../images/slider-bg-mobile.png)!important;
		min-height: 500px!important;
	}
}
@media (min-width: 768px) and (max-width: 1024px){
	.slider-bg{
		background-image: url(../images/slider-bg-mobile.png)!important;
		/*min-height: 600px!important;*/
	}
	.how-to-take-div{
		padding-top: 0px;
		margin-top: 0px;
	}
	.htt-img{
		width: 100%!important;
	}
	.about-img{
		width: 60%!important;
	}
	.vm-1{
		border: none;
	}
	.vm-block{
		margin-bottom: 50px;
		padding: 0px 10px;
	}
}
@media (min-width: 991px){
.font-position{
	position: relative; 
	top: -50px;
}
}