/*------- Font Family Starts -------*/

@font-face { font-family: "Lato-Light"; src: url("../fonts/Lato-Light.ttf"); }
@font-face { font-family: "Lato-Italic"; src: url("../fonts/Lato-Italic.ttf"); }
@font-face { font-family: "Lato-Regular"; src: url("../fonts/Lato-Regular.ttf"); }
@font-face { font-family: "Lato-Bold"; src: url("../fonts/Lato-Bold.ttf"); }
@font-face { font-family: "Lato-Black"; src: url("../fonts/Lato-Black.ttf"); }

/*------- Font Family Ends -------*/

/*------- Reset CSS Starts -------*/

body { overflow-x: hidden; }
html { letter-spacing: 1px; -webkit-touch-callout: none; -webkit-user-select: none; -khtml-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; }
ul,
h1,
h2,
h3,
h4,
h5,
h6,
p,
address { margin: 0; padding: 0; }
li { list-style: none; }
a,
a:hover,
a:focus { outline: 0; text-decoration: none; -webkit-transition: 0.5s linear; -moz-transition: 0.5s linear; -ms-transition: 0.5s linear; -o-transition: 0.5s linear; transition: 0.5s linear; }

/*------- Reset CSS Ends -------*/

/*------- Common CSS Starts -------*/

.remove-margin-desktop { margin: 0; }
.remove-padding-desktop { padding: 0; }
.flex-align-top { -ms-align-items: flex-start; align-items: flex-start; display: -webkit-box; display: -webkit-flex; display: -moz-flex; display: -ms-flex; display: -o-flex; display: flex; }
.flex-align-center { -ms-align-items: center; align-items: center; display: -webkit-box; display: -webkit-flex; display: -moz-flex; display: -ms-flex; display: -o-flex; display: flex; }
.flex-align-end { -ms-align-items: flex-end; align-items: flex-end; display: -webkit-box; display: -webkit-flex; display: -moz-flex; display: -ms-flex; display: -o-flex; display: flex; }

/*------- Common CSS Ends -------*/

/*------- Preloader CSS Starts -------*/

.loader-wrapper { height: 100%; left: 0; position: fixed; top: 0; width: 100%; z-index: 1000; }
.loader-wrapper .loader {
	-webkit-animation: spin 1.5s infinite linear;
	-moz-animation: spin 1.5s infinite linear;
	-ms-animation: spin 1.5s infinite linear;
	-o-animation: spin 1.5s infinite linear;
	animation: spin 1.5s infinite linear;
	border: 3px solid transparent;
	border-top-color: #ccc;
	-webkit-border-radius: 50%;
	-moz-border-radius: 50%;
	-ms-border-radius: 50%;
	-o-border-radius: 50%;
	border-radius: 50%;
	display: block;
	height: 100px;
	left: 50%;
	margin-left: -50px;
	margin-top: -50px;
	position: relative;
	top: 50%;
	width: 100px;
	z-index: 1001;
}
.loader-wrapper .loader:before, 
.loader-wrapper .loader:after {
	-webkit-border-radius: 50%;
	-moz-border-radius: 50%;
	-ms-border-radius: 50%;
	-o-border-radius: 50%;
	border-radius: 50%;
  content: '';
  position: absolute;
}
.loader-wrapper .loader:before {
	-webkit-animation: spin 2s infinite linear;
	-moz-animation: spin 2s infinite linear;
	-ms-animation: spin 2s infinite linear;
	-o-animation: spin 2s infinite linear;
	animation: spin 2s infinite linear;
	border: 3px solid transparent;
  border-top-color:#ccc;
  bottom: 5px;
  left: 5px;
  right: 5px;
  top: 5px;
}
.loader-wrapper .loader:after {
	-webkit-animation: spin 1s infinite linear;
	-moz-animation: spin 1s infinite linear;
	-ms-animation: spin 1s infinite linear;
	-o-animation: spin 1s infinite linear;
	animation: spin 1s infinite linear;
	border: 3px solid transparent;
  border-top-color: #eee;
  bottom: 15px;
  left: 15px;
  right: 15px;
  top: 15px;
}
@-webkit-keyframes spin {
  0% { -webkit-transform: rotate(0); -moz-transform: rotate(0); -ms-transform: rotate(0); -o-transform: rotate(0); transform: rotate(0); }
  100% { -webkit-transform: rotate(360deg); -moz-transform: rotate(360deg); -ms-transform: rotate(360deg); -o-transform: rotate(360deg); transform: rotate(360deg); }
}
@-moz-keyframes spin {
  0% { -webkit-transform: rotate(0); -moz-transform: rotate(0); -ms-transform: rotate(0); -o-transform: rotate(0); transform: rotate(0); }
  100% { -webkit-transform: rotate(360deg); -moz-transform: rotate(360deg); -ms-transform: rotate(360deg); -o-transform: rotate(360deg); transform: rotate(360deg); }
}
@-ms-keyframes spin {
  0% { -webkit-transform: rotate(0); -moz-transform: rotate(0); -ms-transform: rotate(0); -o-transform: rotate(0); transform: rotate(0); }
  100% { -webkit-transform: rotate(360deg); -moz-transform: rotate(360deg); -ms-transform: rotate(360deg); -o-transform: rotate(360deg); transform: rotate(360deg); }
}
@-o-keyframes spin {
  0% { -webkit-transform: rotate(0); -moz-transform: rotate(0); -ms-transform: rotate(0); -o-transform: rotate(0); transform: rotate(0); }
  100% { -webkit-transform: rotate(360deg); -moz-transform: rotate(360deg); -ms-transform: rotate(360deg); -o-transform: rotate(360deg); transform: rotate(360deg); }
}
@keyframes spin {
  0% { -webkit-transform: rotate(0); -moz-transform: rotate(0); -ms-transform: rotate(0); -o-transform: rotate(0); transform: rotate(0); }
  100% { -webkit-transform: rotate(360deg); -moz-transform: rotate(360deg); -ms-transform: rotate(360deg); -o-transform: rotate(360deg); transform: rotate(360deg); }
}
.loader-section {
	background-color: #000;
	height: 100%;
  position: fixed;
  top: 0;
  width: 50%;
  z-index: 1000;
}
.loader-section.section-left { left: 0; }
.loader-section.section-right { right: 0; }
.loaded .section-left { -webkit-transform: translateX(-100%); -moz-transform: translateX(-100%); -ms-transform: translateX(-100%); -o-transform: translateX(-100%); transform: translateX(-100%); -webkit-transition: all 0.7s 0.3s cubic-bezier(0.645, 0.045, 0.355, 1); -moz-transition: all 0.7s 0.3s cubic-bezier(0.645, 0.045, 0.355, 1); -ms-transition: all 0.7s 0.3s cubic-bezier(0.645, 0.045, 0.355, 1); -o-transition: all 0.7s 0.3s cubic-bezier(0.645, 0.045, 0.355, 1); transition: all 0.7s 0.3s cubic-bezier(0.645, 0.045, 0.355, 1); }
.loaded .section-right { -webkit-transform: translateX(100%); -moz-transform: translateX(100%); -ms-transform: translateX(100%); -o-transform: translateX(100%); transform: translateX(100%); -webkit-transition: all 0.7s 0.3s cubic-bezier(0.645, 0.045, 0.355, 1); -moz-transition: all 0.7s 0.3s cubic-bezier(0.645, 0.045, 0.355, 1); -ms-transition: all 0.7s 0.3s cubic-bezier(0.645, 0.045, 0.355, 1); -o-transition: all 0.7s 0.3s cubic-bezier(0.645, 0.045, 0.355, 1); transition: all 0.7s 0.3s cubic-bezier(0.645, 0.045, 0.355, 1); }
.loaded .loader { opacity: 0; -webkit-transition: all 0.3s ease-out; -moz-transition: all 0.3s ease-out; -ms-transition: all 0.3s ease-out; -o-transition: all 0.3s ease-out; transition: all 0.3s ease-out; }
.loaded .loader-wrapper { -webkit-transform: translateY(-100%); -moz-transform: translateY(-100%); -ms-transform: translateY(-100%); -o-transform: translateY(-100%); transform: translateY(-100%); -webkit-transition: all 0.3s 1s ease-out; -moz-transition: all 0.3s 1s ease-out; -ms-transition: all 0.3s 1s ease-out; -o-transition: all 0.3s 1s ease-out; visibility: hidden; }

/*------- Preloader CSS Ends -------*/

/*------- Home Page Starts -------*/

	/*------- Sidebar Section Starts -------*/

.fixed-sidebar { display: none; }

	/*------- Sidebar Section Ends-------*/

	/*------- Mobile Navbar Menu Section Starts -------*/

.fixed-navbar-menu-mobile { display: none; }

	/*------- Mobile Navbar Menu Section Ends -------*/

	/*------- Desktop Navbar Menu Section Starts -------*/

.fixed-navbar-menu-desktop { background-color: #232323; left: 0; position: fixed; top: 0; width: 100%; z-index: 10; }

		/*------- Animation CSS Starts -------*/

	.menu-listing.active > li:first-child > a { opacity: 1; -webkit-transition: 0.5s linear 0s; -moz-transition: 0.5s linear 0s; -ms-transition: 0.5s linear 0s; -o-transition: 0.5s linear 0s; transition: 0.5s linear 0s; visibility: visible; }
	.menu-listing.active > li:nth-child(2) > a { opacity: 1; -webkit-transition: 0.5s linear 0.3s; -moz-transition: 0.5s linear 0.3s; -ms-transition: 0.5s linear 0.3s; -o-transition: 0.5s linear 0.3s; transition: 0.5s linear 0.3s; visibility: visible; }
	.menu-listing.active > li:nth-child(3) > a { opacity: 1; -webkit-transition: 0.5s linear 0.5s; -moz-transition: 0.5s linear 0.5s; -ms-transition: 0.5s linear 0.5s; -o-transition: 0.5s linear 0.5s; transition: 0.5s linear 0.5s; visibility: visible; }
	.menu-listing.active > li:nth-child(4) > a { opacity: 1; -webkit-transition: 0.5s linear 0.7s; -moz-transition: 0.5s linear 0.7s; -ms-transition: 0.5s linear 0.7s; -o-transition: 0.5s linear 0.7s; transition: 0.5s linear 0.7s; visibility: visible; }
	.menu-listing.active > li:nth-child(5) > a { opacity: 1; -webkit-transition: 0.5s linear 0.9s; -moz-transition: 0.5s linear 0.9s; -ms-transition: 0.5s linear 0.9s; -o-transition: 0.5s linear 0.9s; transition: 0.5s linear 0.9s; visibility: visible; }
	.menu-listing.active > li:nth-child(6) > a { opacity: 1; -webkit-transition: 0.5s linear 1.1s; -moz-transition: 0.5s linear 1.1s; -ms-transition: 0.5s linear 1.1s; -o-transition: 0.5s linear 1.1s; transition: 0.5s linear 1.1s; visibility: visible; }

		/*------- Animation CSS Ends -------*/

.menu-listing.active { padding: 15px; }
.menu-listing.active > li { display: inline-block; margin-right: 50px; }
.menu-listing.active > li:last-child { margin-right: 0; }
.menu-listing.active > li > a { color: #ffffff; display: block; font: 1.6rem/1.42857143 "Lato-Regular"; letter-spacing: 4px; opacity: 0; padding-bottom: 5px; position: relative; text-transform: uppercase; visibility: hidden; }
.menu-listing.active > li:first-child > a,
.menu-listing.active > li:nth-child(2) > a,
.menu-listing.active > li:nth-child(3) > a,
.menu-listing.active > li:nth-child(4) > a,
.menu-listing.active > li:nth-child(5) > a,
.menu-listing.active > li:last-child > a { -webkit-transition: 0.5s linear 0s; -moz-transition: 0.5s linear 0s; -ms-transition: 0.5s linear 0s; -o-transition: 0.5s linear 0s; transition: 0.5s linear 0s; }
.menu-listing.active > li > a::before { background-color: #b16f43; bottom: 0; content: ""; display: block; height: 1px; left: 0; position: absolute; -webkit-transition: 0.5s linear; -moz-transition: 0.5s linear; -ms-transition: 0.5s linear; -o-transition: 0.5s linear; transition: 0.5s linear; width: 0; z-index: 1; }
.menu-listing.active > li.active > a::before,
.menu-listing.active > li > a:hover::before { width: 30px; }
.menu-listing.active > li.active > a,
.menu-listing.active > li > a:hover { color: #b16f43; }

	/*------- Desktop Navbar Menu Section Ends -------*/

	/*------- Banner Section Starts -------*/

.bg-banner-home { background-color: #232323; height: 100vh; position: relative; }
.bg-banner-menu-overlay-home { background: rgb(255, 255, 255); height: 100%; left: 0; opacity: 0; position: absolute; top: 0; width: 100%; z-index: 8; }
.banner-logo-home { left: 50%; position: absolute; top: 50%; -webkit-transform: translate(-50%,-50%); -moz-transform: translate(-50%,-50%); -ms-transform: translate(-50%,-50%); -o-transform: translate(-50%,-50%); transform: translate(-50%,-50%); }
.banner-logo-home > img { width: 450px; }

		/*------- Mouse Scroll CSS Starts -------*/

.mouse-scroll { bottom: 30px; left: 50%; overflow: hidden; position: absolute; -webkit-transform: translateX(-50%); -moz-transform: translateX(-50%); -ms-transform: translateX(-50%); -o-transform: translateX(-50%); transform: translateX(-50%); z-index: 9; }
.mouse-scroll > a { display: block; }
.mouse-scroll > a > img { width: 30px; }
.mouse-move-center { left: 50%; overflow: hidden; position: absolute; top: 35%; -webkit-transform: translate(-50%,-50%); -moz-transform: translate(-50%,-50%); -ms-transform: translate(-50%,-50%); -o-transform: translate(-50%,-50%); transform: translate(-50%,-50%); }
.mouse-move { -webkit-animation: mouseMove 1.5s infinite; -moz-animation: mouseMove 1.5s infinite; -ms-animation: mouseMove 1.5s infinite; -o-animation: mouseMove 1.5s infinite; animation: mouseMove 1.5s infinite; background-color: #b16f43; -webkit-border-radius: 50%; -moz-border-radius: 50%; -ms-border-radius: 50%; -o-border-radius: 50%; border-radius: 50%; height: 5px; margin-top: 0; width: 4px; }
@-webkit-keyframes mouseMove {
	0% { margin-top: 0; opacity: 0; }
	50% { margin-top: 5px; opacity: 1; }
	100% { margin-top: 10px; opacity: 0; }
}
@-moz-keyframes mouseMove {
	0% { margin-top: 0; opacity: 0; }
	50% { margin-top: 5px; opacity: 1; }
	100% { margin-top: 10px; opacity: 0; }
}
@-ms-keyframes mouseMove {
	0% { margin-top: 0; opacity: 0; }
	50% { margin-top: 5px; opacity: 1; }
	100% { margin-top: 10px; opacity: 0; }
}
@-o-keyframes mouseMove {
	0% { margin-top: 0; opacity: 0; }
	50% { margin-top: 5px; opacity: 1; }
	100% { margin-top: 10px; opacity: 0; }
}
@keyframes mouseMove {
	0% { margin-top: 0; opacity: 0; }
	50% { margin-top: 5px; opacity: 1; }
	100% { margin-top: 10px; opacity: 0; }
}

		/*------- Mouse Scroll CSS Ends -------*/

	/*------- Banner Section Ends -------*/

	/*------- Women Kit Section Starts -------*/

		/*------- Women Services Section Starts-------*/

	.bg-women-services-home { padding: 150px 15px; }
	.women-heading-home { position: relative; }
	.women-heading-home > h1 { font: 27rem/1.1 "Lato-Bold"; margin-bottom: 100px; opacity: 0; text-align: center; -webkit-text-fill-color: #ffffff; -webkit-text-stroke-width: 2px; -webkit-text-stroke-color: rgb(177 111 67 / 50%); text-transform: uppercase; -webkit-transform: scaleY(0.5); -moz-transform: scaleY(0.5); -ms-transform: scaleY(0.5); -o-transform: scaleY(0.5); transform: scaleY(0.5); -webkit-transition: 0.5s linear; -moz-transition: 0.5s linear; -ms-transition: 0.5s linear; -o-transition: 0.5s linear; transition: 0.5s linear; visibility: hidden; }
	.women-heading-home > p { color: #232323; font: 10rem/1.42857143 "Lato-Bold"; left: 0; letter-spacing: 7px; position: absolute; text-transform: uppercase; top: 120px; z-index: 1; }

		/*------- Animation CSS Starts -------*/

	.women-heading-home.active > h1 { opacity: 1; -webkit-transform: scaleY(1); -moz-transform: scaleY(1); -ms-transform: scaleY(1); -o-transform: scaleY(1); transform: scaleY(1); visibility: visible; }

		/*------- Animation CSS Ends -------*/

		/*------- First Image with Animation CSS Starts -------*/

	.women-services-one { background: url("../images/women-services-1.jpg") no-repeat 50% 50%/cover; display: block; height: 175px; margin-bottom: 30px; position: relative; }
	.women-services-one:hover { background-position: 60% 100%; }
	.women-services-one::before { background-color: #fff; content: ""; height: 100%; left: 0; position: absolute; top: 0; -webkit-transition: 0.5s linear; -moz-transition: 0.5s linear; -ms-transition: 0.5s linear; -o-transition: 0.5s linear; transition: 0.5s linear; width: 100%; }
	.women-services-one:hover::before { width: 50px; }
	.women-services-text-one { color: #000; font: 1.4rem/1.42857143 "Lato-Light"; left: 0; position: absolute; text-transform: uppercase; top: 60px; transform-origin: left bottom; -webkit-transform: rotate(-90deg); -moz-transform: rotate(-90deg); -ms-transform: rotate(-90deg); -o-transform: rotate(-90deg); transform: rotate(-90deg); -webkit-transition: 0.5s linear; -moz-transition: 0.5s linear; -ms-transition: 0.5s linear; -o-transition: 0.5s linear; transition: 0.5s linear; }
	.women-services-arrow-one { bottom: 45px; left: 0; opacity: 0; position: absolute; -webkit-transition: 0.5s linear; -moz-transition: 0.5s linear; -ms-transition: 0.5s linear; -o-transition: 0.5s linear; transition: 0.5s linear; visibility: hidden; }
	.women-services-arrow-one > img { width: 60px; }
			
			/*------- Animation CSS Starts -------*/

	.women-services-one.active::before { width: 0; }
	.women-services-one.active:hover > .women-services-text-one { left: 15px; }
	.women-services-one.active:hover > .women-services-arrow-one { left: 0; opacity: 1; visibility: visible; }
	.women-services-one.active:hover::before { width: 30px; }

			/*------- Animation CSS Ends -------*/

		/*------- First Image with Animation CSS Ends -------*/

		/*------- Second Image with Animation CSS Starts -------*/

	.women-services-two { background: url("../images/women-services-2.jpg") no-repeat 50% 100%/cover; display: block; height: 560px; margin-bottom: 30px; position: relative; }
	.women-services-two:hover { background-position: 60% 100%; }
	.women-services-two::before { background-color: #fff; content: ""; height: 100%; position: absolute; right: 0; top: 0; -webkit-transition: 0.5s linear; -moz-transition: 0.5s linear; -ms-transition: 0.5s linear; -o-transition: 0.5s linear; transition: 0.5s linear; width: 100%; }
	.women-services-two:hover::before { width: 50px; }
	.women-services-text-two { color: #000; font: 1.4rem/1.42857143 "Lato-Light"; position: absolute; right: 0; text-transform: uppercase; top: 0; transform-origin: right top; -webkit-transform: rotate(-90deg); -moz-transform: rotate(-90deg); -ms-transform: rotate(-90deg); -o-transform: rotate(-90deg); transform: rotate(-90deg); -webkit-transition: 0.5s linear; -moz-transition: 0.5s linear; -ms-transition: 0.5s linear; -o-transition: 0.5s linear; transition: 0.5s linear; }
	.women-services-arrow-two { bottom: 45px; opacity: 0; position: absolute; right: 0; -webkit-transition: 0.5s linear; -moz-transition: 0.5s linear; -ms-transition: 0.5s linear; -o-transition: 0.5s linear; transition: 0.5s linear; visibility: hidden; }
	.women-services-arrow-two > img { width: 60px; }

			/*------- Animation CSS Starts -------*/

	.women-services-two.active::before { width: 0; }
	.women-services-two.active:hover > .women-services-text-two { right: 15px; }
	.women-services-two.active:hover > .women-services-arrow-two { right: 0; opacity: 1; visibility: visible; }
	.women-services-two.active:hover::before { width: 30px; }

			/*------- Animation CSS Ends -------*/

		/*------- Second Image with Animation CSS Ends -------*/

		/*------- Third Image with Animation CSS Starts -------*/

	.women-services-three { background: url("../images/women-services-3.jpg") no-repeat 50% 100%/cover; display: block; height: 235px; margin-bottom: 30px; position: relative; }
	.women-services-three:hover { background-position: 60% 100%; }
	.women-services-three::before { background-color: #fff; content: ""; height: 100%; left: 0; position: absolute; top: 0; -webkit-transition: 1s linear 1s; -moz-transition: 1s linear 1s; -ms-transition: 1s linear 1s; -o-transition: 1s linear 1s; transition: 1s linear 1s; width: 100%; }
	.women-services-text-three { bottom: 0; color: #000; font: 1.4rem/1.42857143 "Lato-Light"; left: 0; position: absolute; text-transform: uppercase; transform-origin: left bottom; -webkit-transform: rotate(-90deg); -moz-transform: rotate(-90deg); -ms-transform: rotate(-90deg); -o-transform: rotate(-90deg); transform: rotate(-90deg); -webkit-transition: 0.5s linear; -moz-transition: 0.5s linear; -ms-transition: 0.5s linear; -o-transition: 0.5s linear; transition: 0.5s linear; }
	.women-services-arrow-three { left: 0; opacity: 0; position: absolute; top: 45px; -webkit-transition: 0.5s linear; -moz-transition: 0.5s linear; -ms-transition: 0.5s linear; -o-transition: 0.5s linear; transition: 0.5s linear; visibility: hidden; }
	.women-services-arrow-three > img { width: 60px; }

			/*------- Animation CSS Starts -------*/

	.women-services-three.active::before { width: 0; }
	.women-services-three.active:hover > .women-services-text-three { left: 15px; }
	.women-services-three.active:hover > .women-services-arrow-three { left: 0; opacity: 1; visibility: visible; }
	.women-services-three.active:hover::before { -webkit-transition: 0.5s linear 0s; -moz-transition: 0.5s linear 0s; -ms-transition: 0.5s linear 0s; -o-transition: 0.5s linear 0s; transition: 0.5s linear 0s; width: 30px; }

			/*------- Animation CSS Ends -------*/

		/*------- Third Image with Animation CSS Ends -------*/

		/*------- Fourth Image with Animation CSS Starts -------*/

	.women-services-four { background: url("../images/women-services-4.jpg") no-repeat 50% 100%/cover; display: block; height: 440px; margin-bottom: 30px; position: relative; }
	.women-services-four:hover { background-position: 60% 100%; }
	.women-services-four::before { background-color: #fff; content: ""; height: 100%; left: 0; position: absolute; top: 0; -webkit-transition: 1s linear 1s; -moz-transition: 1s linear 1s; -ms-transition: 1s linear 1s; -o-transition: 1s linear 1s; transition: 1s linear 1s; width: 100%; }
	.women-services-text-four { bottom: 0; color: #000; font: 1.4rem/1.42857143 "Lato-Light"; left: 0; position: absolute; text-transform: uppercase; transform-origin: left bottom; -webkit-transform: rotate(-90deg); -moz-transform: rotate(-90deg); -ms-transform: rotate(-90deg); -o-transform: rotate(-90deg); transform: rotate(-90deg); -webkit-transition: 0.5s linear; -moz-transition: 0.5s linear; -ms-transition: 0.5s linear; -o-transition: 0.5s linear; transition: 0.5s linear; }
	.women-services-arrow-four { left: 0; opacity: 0; position: absolute; top: 45px; -webkit-transition: 0.5s linear; -moz-transition: 0.5s linear; -ms-transition: 0.5s linear; -o-transition: 0.5s linear; transition: 0.5s linear; visibility: hidden; }
	.women-services-arrow-four > img { width: 60px; }

			/*------- Animation CSS Starts -------*/

	.women-services-four.active::before { width: 0; }
	.women-services-four.active:hover > .women-services-text-four { left: 15px; }
	.women-services-four.active:hover > .women-services-arrow-four { left: 0; opacity: 1; visibility: visible; }
	.women-services-four.active:hover::before { -webkit-transition: 0.5s linear 0s; -moz-transition: 0.5s linear 0s; -ms-transition: 0.5s linear 0s; -o-transition: 0.5s linear 0s; transition: 0.5s linear 0s; width: 30px; }

			/*------- Animation CSS Ends -------*/

		/*------- Fourth Image with Animation CSS Ends -------*/

		/*------- Fifth Image with Animation CSS Starts -------*/

	.women-services-five { background: url("../images/women-services-5.jpg") no-repeat 50% 100%/cover; display: block; height: 300px; margin-bottom: 30px; position: relative; }
	.women-services-five:hover { background-position: 60% 100%; }
	.women-services-five::before { background-color: #fff; content: ""; height: 100%; position: absolute; right: 0; top: 0; -webkit-transition: 1s linear 1s; -moz-transition: 1s linear 1s; -ms-transition: 1s linear 1s; -o-transition: 1s linear 1s; transition: 1s linear 1s; width: 100%; }
	.women-services-text-five { color: #000; font: 1.4rem/1.42857143 "Lato-Light"; position: absolute; right: 0; text-transform: uppercase; top: 0; transform-origin: right top; -webkit-transform: rotate(-90deg); -moz-transform: rotate(-90deg); -ms-transform: rotate(-90deg); -o-transform: rotate(-90deg); transform: rotate(-90deg); -webkit-transition: 0.5s linear; -moz-transition: 0.5s linear; -ms-transition: 0.5s linear; -o-transition: 0.5s linear; transition: 0.5s linear; }
	.women-services-arrow-five { bottom: 45px; opacity: 0; position: absolute; right: 0; -webkit-transition: 0.5s linear; -moz-transition: 0.5s linear; -ms-transition: 0.5s linear; -o-transition: 0.5s linear; transition: 0.5s linear; visibility: hidden; }
	.women-services-arrow-five > img { width: 60px; }

			/*------- Animation CSS Starts -------*/

	.women-services-five.active::before { width: 0; }
	.women-services-five.active:hover > .women-services-text-five { right: 15px; }
	.women-services-five.active:hover > .women-services-arrow-five { right: 0; opacity: 1; visibility: visible; }
	.women-services-five.active:hover::before { -webkit-transition: 0.5s linear 0s; -moz-transition: 0.5s linear 0s; -ms-transition: 0.5s linear 0s; -o-transition: 0.5s linear 0s; transition: 0.5s linear 0s; width: 30px; }

			/*------- Animation CSS Ends -------*/

		/*------- Fifth Image with Animation CSS Ends -------*/

		/*------- Women Services Section Ends -------*/

	/*------- Women Kit Section Ends -------*/

	/*------- Our Studio Section Starts -------*/

	.bg-our-studio-home { padding: 0 15px 100px; }
	.our-studio-img-anchor-home { display: block; }
	.our-studio-img-home { position: relative; }
	.our-studio-img-home::after { background-color: #fff; content: ""; height: 100%; position: absolute; right: 0; top: 0; -webkit-transition: 0.5s linear; -moz-transition: 0.5s linear; -ms-transition: 0.5s linear; -o-transition: 0.5s linear; transition: 0.5s linear; width: 0; z-index: 1; }
	.our-studio-img-home > img { width: 100%; }
	.our-studio-img-arrow-home { bottom: 30px; position: absolute; right: 30px; -webkit-transition: 0.5s linear; -moz-transition: 0.5s linear; -ms-transition: 0.5s linear; -o-transition: 0.5s linear; transition: 0.5s linear; z-index: 2; }
	.our-studio-img-arrow-home > img { opacity: 0; -webkit-transition: 0.5s linear; -moz-transition: 0.5s linear; -ms-transition: 0.5s linear; -o-transition: 0.5s linear; transition: 0.5s linear; visibility: hidden; width: 100px; }
	.our-studio-img-anchor-home:hover .our-studio-img-home::after { width: 50px; }
	.our-studio-img-anchor-home:hover .our-studio-img-arrow-home { right: 0; }
	.our-studio-img-anchor-home:hover .our-studio-img-arrow-home > img { opacity: 1; visibility: visible; }
	.our-studio-name-home > h2 { border-bottom: 1px solid #000; border-top: 1px solid #000; color: #000; display: inline-block; font: 3rem/1.42857143 "Lato-Regular"; margin-bottom: 30px; padding: 30px 0; }
	.our-studio-name-home > p { color: #000; font: 1.8rem/1.42857143 "Lato-Light"; margin-bottom: 30px; }
	.slick-slider-our-studio-home .slick-slide,
	.products-slick-slider-home .slick-slide { padding: 0 15px; }
	.slick-slider-our-studio-home .slick-dots,
	.products-slick-slider-home .slick-dots { bottom: -50px; }
	.slick-slider-our-studio-home .slick-dots li,
	.products-slick-slider-home .slick-dots li { cursor: pointer; display: inline-block; height: auto; margin: 0 5px; padding: 0; position: relative; width: auto; }
	.slick-slider-our-studio-home .slick-dots li button,
	.products-slick-slider-home .slick-dots li button { background-color: #000; -webkit-border-radius: 50%; -moz-border-radius: 50%; -ms-border-radius: 50%; -o-border-radius: 50%; border-radius: 50%; height: 12px; line-height: 12px; margin: 0; opacity: 0.5; -webkit-transition: all 0.4s ease; -moz-transition: all 0.4s ease; -ms-transition: all 0.4s ease; -o-transition: all 0.4s ease; transition: all 0.4s ease; width: 12px; }
	.slick-slider-our-studio-home .slick-dots li.slick-active button,
	.products-slick-slider-home .slick-dots li.slick-active button { -webkit-border-radius: 27px; -moz-border-radius: 27px; -ms-border-radius: 27px; -o-border-radius: 27px; border-radius: 27px; opacity: 1; width: 12px; }
	.slick-slider-our-studio-home .slick-dots li button::before,
	.products-slick-slider-home .slick-dots li button::before { content: ''; }

	/*------- Our Studio Section Ends -------*/

	/*-------Men Kit Section Starts -------*/

		/*-------Men Services Section Starts-------*/

	.bg-men-services-home { background-color: #232323; padding: 100px 15px 200px; }
	.men-heading-home { position: relative; z-index: 1; }
	.men-heading-home > h2 { font: 27rem/1.1 "Lato-Bold"; letter-spacing: 40px; margin-bottom: 100px; opacity: 0; -webkit-text-fill-color: #232323; -webkit-text-stroke-width: 2px; -webkit-text-stroke-color: rgb(255 255 255 / 50%); text-align: center; text-transform: uppercase; -webkit-transform: scaleY(0.5); -moz-transform: scaleY(0.5); -ms-transform: scaleY(0.5); -o-transform: scaleY(0.5); transform: scaleY(0.5); -webkit-transition: 0.5s linear; -moz-transition: 0.5s linear; -ms-transition: 0.5s linear; -o-transition: 0.5s linear; transition: 0.5s linear; visibility: hidden; }
	.men-heading-home > p { color: #ffffff; font: 10rem/1.42857143 "Lato-Bold"; left: -370px; letter-spacing: 30px; margin-bottom: -180px; position: relative; text-align: center; text-transform: uppercase; top: -300px; }

		/*------- Animation CSS Starts -------*/

	.men-heading-home.active > h2 { opacity: 1; -webkit-transform: scaleY(1); -moz-transform: scaleY(1); -ms-transform: scaleY(1); -o-transform: scaleY(1); transform: scaleY(1); visibility: visible; }

		/*------- Animation CSS Ends -------*/

		/*------- First Image with Animation CSS Starts -------*/

	.men-services-one { background: url("../images/tatto-services-1.jpg") no-repeat 50% 100%/cover; display: block; height: 175px; margin-bottom: 30px; position: relative; }
	.men-services-one:hover { background-position: 60% 100%; }
	.men-services-one::before { background-color: #232323; content: ""; height: 100%; left: 0; position: absolute; top: 0; -webkit-transition: 0.5s linear; -moz-transition: 0.5s linear; -ms-transition: 0.5s linear; -o-transition: 0.5s linear; transition: 0.5s linear; width: 100%; }
	.men-services-one:hover::before { width: 50px; }
	.men-services-text-one { color: #fff; font: 1.4rem/1.42857143 "Lato-Light"; left: 0; position: absolute; text-transform: uppercase; top: 45px; transform-origin: left bottom; transform: rotate(-90deg); -webkit-transition: 0.5s linear; -moz-transition: 0.5s linear; -ms-transition: 0.5s linear; -o-transition: 0.5s linear; transition: 0.5s linear; }
	.men-services-arrow-one { bottom: 45px; left: 0; opacity: 0; position: absolute; -webkit-transition: 0.5s linear; -moz-transition: 0.5s linear; -ms-transition: 0.5s linear; -o-transition: 0.5s linear; transition: 0.5s linear; visibility: hidden; }
	.men-services-arrow-one > img { width: 60px; }
			
			/*------- Animation CSS Starts -------*/

	.men-services-one.active::before { -webkit-transition: 1s linear; -moz-transition: 1s linear; -ms-transition: 1s linear; -o-transition: 1s linear; transition: 1s linear; width: 0; }
	.men-services-one.active:hover > .men-services-text-one { left: 15px; }
	.men-services-one.active:hover > .men-services-arrow-one { left: 0; opacity: 1; visibility: visible; }
	.men-services-one.active:hover::before { width: 30px; }

			/*------- Animation CSS Ends -------*/

		/*------- First Image with Animation CSS Ends -------*/

		/*------- Second Image with Animation CSS Starts -------*/

	.men-services-two { background: url("../images/tatto-services-2.jpg") no-repeat 50% 100%/cover; display: block; height: 560px; margin-bottom: 30px; position: relative; }
	.men-services-two:hover { background-position: 60% 100%; }
	.men-services-two::before { background-color: #232323; content: ""; height: 100%; position: absolute; right: 0; top: 0; -webkit-transition: 0.5s linear; -moz-transition: 0.5s linear; -ms-transition: 0.5s linear; -o-transition: 0.5s linear; transition: 0.5s linear; width: 100%; }
	.men-services-two:hover::before { width: 50px; }
	.men-services-text-two { color: #fff; font: 1.4rem/1.42857143 "Lato-Light"; position: absolute; right: 0; text-transform: uppercase; top: 0; transform-origin: right top; -webkit-transform: rotate(-90deg); -moz-transform: rotate(-90deg); -ms-transform: rotate(-90deg); -o-transform: rotate(-90deg); transform: rotate(-90deg); -webkit-transition: 0.5s linear; -moz-transition: 0.5s linear; -ms-transition: 0.5s linear; -o-transition: 0.5s linear; transition: 0.5s linear; }
	.men-services-arrow-two { bottom: 45px; opacity: 0; position: absolute; right: 0; -webkit-transition: 0.5s linear; -moz-transition: 0.5s linear; -ms-transition: 0.5s linear; -o-transition: 0.5s linear; transition: 0.5s linear; visibility: hidden; }
	.men-services-arrow-two > img { width: 60px; }

			/*------- Animation CSS Starts -------*/

	.men-services-two.active::before { -webkit-transition: 1s linear; -moz-transition: 1s linear; -ms-transition: 1s linear; -o-transition: 1s linear; transition: 1s linear; width: 0; }
	.men-services-two.active:hover > .men-services-text-two { right: 15px; }
	.men-services-two.active:hover > .men-services-arrow-two { right: 0; opacity: 1; visibility: visible; }
	.men-services-two.active:hover::before { width: 30px; }

			/*------- Animation CSS Ends -------*/

		/*------- Second Image with Animation CSS Ends -------*/

		/*------- Third Image with Animation CSS Starts -------*/

	.men-services-three { background: url("../images/tatto-services-3.jpg") no-repeat 50% 100%/cover; display: block; height: 440px; margin-bottom: 30px; position: relative; }
	.men-services-three:hover { background-position: 60% 100%; }
	.men-services-three::before { background-color: #232323; content: ""; height: 100%; left: 0; position: absolute; top: 0; -webkit-transition: 1s linear 1s; -moz-transition: 1s linear 1s; -ms-transition: 1s linear 1s; -o-transition: 1s linear 1s; transition: 1s linear 1s; width: 100%; }
	.men-services-text-three { bottom: 0; color: #fff; font: 1.4rem/1.42857143 "Lato-Light"; left: 0; position: absolute; text-transform: uppercase; transform-origin: left bottom; -webkit-transform: rotate(-90deg); -moz-transform: rotate(-90deg); -ms-transform: rotate(-90deg); -o-transform: rotate(-90deg); transform: rotate(-90deg); -webkit-transition: 0.5s linear; -moz-transition: 0.5s linear; -ms-transition: 0.5s linear; -o-transition: 0.5s linear; transition: 0.5s linear; }
	.men-services-arrow-three { left: 0; opacity: 0; position: absolute; top: 45px; -webkit-transition: 0.5s linear; -moz-transition: 0.5s linear; -ms-transition: 0.5s linear; -o-transition: 0.5s linear; transition: 0.5s linear; visibility: hidden; }
	.men-services-arrow-three > img { width: 60px; }

			/*------- Animation CSS Starts -------*/

	.men-services-three.active::before { width: 0; }
	.men-services-three.active:hover > .men-services-text-three { left: 15px; }
	.men-services-three.active:hover > .men-services-arrow-three { left: 0; opacity: 1; visibility: visible; }
	.men-services-three.active:hover::before { -webkit-transition: 0.5s linear 0s; -moz-transition: 0.5s linear 0s; -ms-transition: 0.5s linear 0s; -o-transition: 0.5s linear 0s; transition: 0.5s linear 0s; width: 30px; }

			/*------- Animation CSS Ends -------*/

		/*------- Third Image with Animation CSS Ends -------*/

		/*------- Fourth Image with Animation CSS Starts -------*/

	.men-services-four { background: url("../images/tatto-services-4.jpg") no-repeat 50% 100%/cover; display: block; height: 300px; margin-bottom: 30px; position: relative; }
	.men-services-four:hover { background-position: 60% 100%; }
	.men-services-four::before { background-color: #232323; content: ""; height: 100%; position: absolute; right: 0; top: 0; -webkit-transition: 1s linear 1s; -moz-transition: 1s linear 1s; -ms-transition: 1s linear 1s; -o-transition: 1s linear 1s; transition: 1s linear 1s; width: 100%; }
	.men-services-text-four { color: #fff; font: 1.4rem/1.42857143 "Lato-Light"; position: absolute; right: 0; text-transform: uppercase; top: 0; transform-origin: right top; -webkit-transform: rotate(-90deg); -moz-transform: rotate(-90deg); -ms-transform: rotate(-90deg); -o-transform: rotate(-90deg); transform: rotate(-90deg); -webkit-transition: 0.5s linear; -moz-transition: 0.5s linear; -ms-transition: 0.5s linear; -o-transition: 0.5s linear; transition: 0.5s linear; }
	.men-services-arrow-four { bottom: 45px; opacity: 0; position: absolute; right: 0; -webkit-transition: 0.5s linear; -moz-transition: 0.5s linear; -ms-transition: 0.5s linear; -o-transition: 0.5s linear; transition: 0.5s linear; visibility: hidden; }
	.men-services-arrow-four > img { width: 60px; }

			/*------- Animation CSS Starts -------*/

	.men-services-four.active::before { width: 0; }
	.men-services-four.active:hover > .men-services-text-four { right: 15px; }
	.men-services-four.active:hover > .men-services-arrow-four { right: 0; opacity: 1; visibility: visible; }
	.men-services-four.active:hover::before { transition: 0.5s linear 0s; width: 30px; }

			/*------- Animation CSS Ends -------*/

		/*------- Fourth Image with Animation CSS Ends -------*/

		/*------- Men Services Section Ends -------*/

	/*------- Men Kit Section Ends -------*/

	/*------- Product Section Starts -------*/

.bg-product-home { padding: 100px 15px 0; }
.brand-logo-home > img { margin: 0 auto; width: 200px; }
.product-info-anchor-home-one { display: block; margin-top: 100px; opacity: 0; -webkit-transition: 0.5s linear; -moz-transition: 0.5s linear; -ms-transition: 0.5s linear; -o-transition: 0.5s linear; transition: 0.5s linear; visibility: hidden; }
.product-info-anchor-home-one.active { margin-top: -100px; opacity: 1; visibility: visible; }
.product-info-anchor-home-two { display: block; margin-top: 100px; opacity: 0; -webkit-transition: 0.5s linear 0.5s; -moz-transition: 0.5s linear 0.5s; -ms-transition: 0.5s linear 0.5s; -o-transition: 0.5s linear 0.5s; transition: 0.5s linear 0.5s; visibility: hidden; }
.product-info-anchor-home-two.active { margin-top: -100px; opacity: 1; visibility: visible; }
.product-info-home > img { margin: 0 auto 30px; }
.product-info-home > h3 { color: #000; font: 2.4rem/1.42857143 "Lato-Regular"; text-align: center; }

	/*------- Product Section Ends -------*/

	/*------- Extra Services Section Starts -------*/

	.bg-gift-card-home { padding: 100px 15px; }
	.products-slick-slider-home .slick-slide { padding: 0 15px; }
	.bg-gift-card-img-home { position: relative; }
	.bg-gift-card-img-home::before { background-color: #fff; content: ""; height: 100%; position: absolute; right: 0; top: 0; -webkit-transition: 1s linear; -moz-transition: 1s linear; -ms-transition: 1s linear; -o-transition: 1s linear; transition: 1s linear; width: 100%; }
	.bg-gift-card-img-home.active::before { width: 0; }
	.gift-card-info-home > h2 { left: 50%; opacity: 0; position: absolute; top: 45%; -webkit-transform: translate(-50%,-50%); -moz-transform: translate(-50%,-50%); -ms-transform: translate(-50%,-50%); -o-transform: translate(-50%,-50%); transform: translate(-50%,-50%); -webkit-transition: 0.5s linear 0.5s; -moz-transition: 0.5s linear 0.5s; -ms-transition: 0.5s linear 0.5s; -o-transition: 0.5s linear 0.5s; transition: 0.5s linear 0.5s; visibility: hidden; width: 90%; }
	.gift-card-info-home.active > h2 { opacity: 1; top: 50%; visibility: visible; }
	.gift-card-info-home > h2 { border-bottom: 1px solid #fff; border-top: 1px solid #fff; color: #fff; display: inline-block; font: 3rem/1.42857143 "Lato-Light"; margin-bottom: 30px; padding: 15px 0; text-align: center; }

	/*------- Extra Services Section Ends -------*/

	/*------- Contact Section Starts -------*/

	.bg-contact-home { margin-bottom: 100px; padding: 100px 15px; position: relative; }
	.contact-home-salon-text { left: 50px; position: absolute; top: 50px; }
	.contact-home-salon-text > p { color: #00000017; font: 27rem/1 "Lato-Bold"; letter-spacing: 27px; opacity: 0; position: relative; text-transform: uppercase; -webkit-transform: scaleY(0.5); -moz-transform: scaleY(0.5); -ms-transform: scaleY(0.5); -o-transform: scaleY(0.5); transform: scaleY(0.5); -webkit-transition: 0.5s linear; -moz-transition: 0.5s linear; -ms-transition: 0.5s linear; -o-transition: 0.5s linear; transition: 0.5s linear; visibility: hidden; z-index: 1; }
	.contact-home-salon-text.active > p { opacity: 1; -webkit-transform: scaleY(1); -moz-transform: scaleY(1); -ms-transform: scaleY(1); -o-transform: scaleY(1); transform: scaleY(1); visibility: visible; }
	.contact-home-map { position: absolute; right: 0; }
	.contact-home-map::before { background-color: #fff; content: ""; height: 100%; position: absolute; right: 0; top: 0; -webkit-transition: 1s linear; -moz-transition: 1s linear; -ms-transition: 1s linear; -o-transition: 1s linear; transition: 1s linear; width: 100%; }
	.contact-home-map.active::before { width: 0; }
	.display-map-home { border: 0; height: 800px; width: 550px; }
	.contact-info-home { opacity: 0; margin-top: 300px; -webkit-transition: 0.5s linear; -moz-transition: 0.5s linear; -ms-transition: 0.5s linear; -o-transition: 0.5s linear; transition: 0.5s linear; visibility: hidden; }
	.contact-info-home.active { opacity: 1; margin-top: 100px; visibility: visible; }
	.contact-info-home > h2 { color: #232323; font: 7rem/1.42857143 "Lato-Bold"; letter-spacing: 7px; margin-bottom: 50px; text-transform: uppercase; }
	.contact-info-home > p:nth-child(2) { border-bottom: 1px solid #e7e7e7; border-top: 1px solid #e7e7e7; color: #000000; font: 1.8rem/1.7 "Lato-Light"; margin-bottom: 50px; padding: 30px 0; }
	.contact-info-home > p:nth-child(2) > span { display: block; }
	.contact-info-home > p:nth-child(3) > a,
	.contact-info-home > p:nth-child(4) > a { color: #000000; display: block; font: 1.8rem/1.42857143 "Lato-Light"; margin-bottom: 15px; padding-left: 30px; position: relative; }
	.contact-info-home > p:nth-child(4) > a { margin-bottom: 100px; }
	.contact-info-home > p:nth-child(3) > a::before,
	.contact-info-home > p:nth-child(4) > a::before {
		content: "\f879";
		display: block;
		font-family: "Font Awesome 5 Free";
		font-weight: 900;
		left: 0;
		position: absolute;
		top: 0;
	}
	.contact-info-home > p:nth-child(4) > a::before {
		content: "\f0e0";
	}
	.btn-read-more,
	.btn-sign-up,
	.btn-make-appoint { background-color: #232323; -webkit-box-shadow: inset 0 0 0 0 #fff; -moz-box-shadow: inset 0 0 0 0 #fff; -ms-box-shadow: inset 0 0 0 0 #fff; -o-box-shadow: inset 0 0 0 0 #fff; box-shadow: inset 0 0 0 0 #fff; -webkit-border-radius: 0; -moz-border-radius: 0; -ms-border-radius: 0; -o-border-radius: 0; border-radius: 0; color: #fff; font: 1.6rem/1.42857143 "Lato-Regular"; letter-spacing: 1px; padding: 10px 80px; position: relative; text-transform: uppercase; -webkit-transition: 0.5s linear; -moz-transition: 0.5s linear; -ms-transition: 0.5s linear; -o-transition: 0.5s linear; transition: 0.5s linear; }
	.btn-read-more::after,
	.btn-sign-up::after,
	.btn-make-appoint::after {
		content: "\f30b";
		display: block;
		font-family: "Font Awesome 5 Free";
		font-size: 2.4rem;
		font-weight: 900;
		position: absolute;
		right: 15px;
		top: 50%;
		-webkit-transform: translateY(-50%);
		-moz-transform: translateY(-50%);
		-ms-transform: translateY(-50%);
		-o-transform: translateY(-50%);
		transform: translateY(-50%);
	}
	.btn-read-more:hover { -webkit-box-shadow: inset 265px 0 0 0 #b16f43; -moz-box-shadow: inset 265px 0 0 0 #b16f43; -ms-box-shadow: inset 265px 0 0 0 #b16f43; -o-box-shadow: inset 265px 0 0 0 #b16f43; box-shadow: inset 265px 0 0 0 #b16f43; color: #000; }
	.btn-sign-up:hover { -webkit-box-shadow: inset 265px 0 0 0 #b16f43; -moz-box-shadow: inset 265px 0 0 0 #b16f43; -ms-box-shadow: inset 265px 0 0 0 #b16f43; -o-box-shadow: inset 265px 0 0 0 #b16f43; box-shadow: inset 265px 0 0 0 #b16f43; color: #000; }
	.btn-make-appoint:hover { box-shadow: inset -375px 0 0 0 #b16f43; }
	.btn-read-more:focus,
	.btn-read-more:active:focus,
	.btn-sign-up:focus,
	.btn-sign-up:active:focus { background-color: #232323; -webkit-box-shadow: inset 0 0 0 0 #b16f43; -moz-box-shadow: inset 0 0 0 0 #b16f43; -ms-box-shadow: inset 0 0 0 0 #b16f43; -o-box-shadow: inset 0 0 0 0 #b16f43; box-shadow: inset 0 0 0 0 #b16f43; color: #fff; outline: 0; }

	/*------- Contact Section Ends -------*/

	/*------- Copyright Section Starts -------*/

	.bg-copyright-home { padding: 100px 15px 50px; }
	.bg-copyright-container-home { border-top: 1px solid #000; padding-top: 50px; }
	.copyright-info > p,
	.copyright-info > p > a { color: #000; font: 1.6rem/1.42857143 "Lato-Light"; }
	.social-icon-listing-home > li { display: inline-block; margin-right: 30px; }
	.social-icon-listing-home > li:last-child { margin-right: 0; }
	.social-icon-listing-home > li > a { color: #000; font-size: 1.8rem; }
	.designed-by-info { text-align: right; }
	.designed-by-info > p { color: #000; font: 1.6rem/1.42857143 "Lato-Light"; }

	/*------- Copyright Section Ends -------*/

/*------- Home Page Ends -------*/

/*------- About Us Page Starts -------*/

	/*------- First Section Starts -------*/

.bg-about-sec-one-ap { padding: 50px 15px; position: relative; }
.bg-first-sec-i-ap { position: relative; }
.bg-first-sec-i-b-ap { border: 1px solid #000; height: 100%; left: -25px; position: absolute; top: -25px; width: 100%; z-index: -1; }
.bg-first-sec-si-b-ap { border: 1px solid #000; height: 115%; left: 50%; position: absolute; top: 50%; -webkit-transform: translate(-50%,-50%); -moz-transform: translate(-50%,-50%); -ms-transform: translate(-50%,-50%); -o-transform: translate(-50%,-50%); transform: translate(-50%,-50%); width: 115%; z-index: 1; }
.bg-first-sec-si-ap { margin-top: -150px; }
.bg-first-sec-ti-ap { margin-top: -550px; z-index: -1; }
.bg-first-sec-foi-ap { margin-top: -300px; }
.bg-first-sec-i-ap > img { width: 100%; }
.bg-first-sec-infoa-ap > p { color: #000; font: 1.8rem/1.7 "Lato-Light"; margin: 0 0 100px; }

		/*------- Animation CSS Starts -------*/

.bg-first-sec-fi-ap::before,
.bg-first-sec-si-ap::before,
.bg-first-sec-ti-ap::before,
.bg-first-sec-foi-ap::before { background-color: #fff; content: ""; display: block; height: 100%; position: absolute; right: 0; top: 0; -webkit-transition: 1s linear; -moz-transition: 1s linear; -ms-transition: 1s linear; -o-transition: 1s linear; transition: 1s linear; width: 100%; }
.bg-first-sec-fi-ap.active::before,
.bg-first-sec-si-ap.active::before,
.bg-first-sec-ti-ap.active::before,
.bg-first-sec-foi-ap.active::before { width: 0; }

		/*------- Animation CSS Ends -------*/

	/*------- First Section Ends -------*/

	/*------- Second Section Starts -------*/

.bg-about-sec-two-ap { padding: 50px 15px; position: relative; }
.bg-about-sec-two-background-ap { background-color: #f1f1f1; height: 300px; left: 0; margin-top: 150px; position: absolute; top: 0; width: 75%; }
.about-heading-sec-two-ap > h1 { color: #000; font: 4rem/1.42857143 "Lato-Regular"; margin-bottom: 100px; }
.about-heading-sec-two-ap > h1 > span { color: #b16f43; }
.about-desc-sec-two-ap > p { color: #000; font: 1.8rem/1.7 "Lato-Light"; }
.about-desc-sec-two-image { position: relative; }
.about-desc-sec-two-image > img { width: 100%; }

		/*------- Animation CSS Starts -------*/

.about-desc-sec-two-image::before { background-color: #fff; content: ""; display: block; height: 100%; position: absolute; right: 0; top: 0; -webkit-transition: 1s linear; -moz-transition: 1s linear; -ms-transition: 1s linear; -o-transition: 1s linear; transition: 1s linear; width: 100%; }
.about-desc-sec-two-image.active::before { width: 0; }

		/*------- Animation CSS Ends -------*/

	/*------- Second Section Ends -------*/

	/*------- Third Section Starts -------*/

.bg-about-sec-third-ap { padding: 50px 15px; position: relative; }
.about-heading-sec-third-ap > h2 { color: #000; font: 3rem/1.42857143 "Lato-Regular"; margin-bottom: 100px; }
.about-heading-sec-third-ap > h2 > span { color: #b16f43; }
.about-sec-third-i-ap { position: relative; }
.about-sec-third-i-od-ap { left: 65%; position: absolute; top: 50%; -webkit-transform: translate(-50%,-50%); -moz-transform: translate(-50%,-50%); -ms-transform: translate(-50%,-50%); -o-transform: translate(-50%,-50%); transform: translate(-50%,-50%); }
.about-sec-third-i-od-ap > p { color: #fff; font: 2.4rem/1.7 "Lato-Light"; }
.about-sec-third-i-d-ap > p { color: #000; font: 1.8rem/1.7 "Lato-Light"; margin: 50px 0; }
.about-sec-third-i-d-line-ap { background-color: #000; bottom: 0; height: 1px; position: absolute; right: 0; width: 75%; }
.about-sec-third-i-e-ap { position: relative; }
.about-sec-third-i-e-ap > img { margin: 100px 0; width: 100%; }
.about-sec-third-i-e-bg-ap { background-color: #f1f1f1; height: 100%; left: 0; position: absolute; top: 0; transition: 0.5s linear; width: 0; }
.about-sec-third-i-dt-ap > p { color: #000; font: 1.8rem/1.7 "Lato-Light"; margin: 100px 0; }
.about-sec-third-od-ap > p { color: #ccc; font: 3rem/1.7 "Lato-Light"; text-align: justify; }

		/*------- Animation CSS Starts -------*/

.about-sec-third-i-ap::before { background-color: #fff; content: ""; display: block; height: 100%; position: absolute; right: 0; top: 0; -webkit-transition: 1s linear; -moz-transition: 1s linear; -ms-transition: 1s linear; -o-transition: 1s linear; transition: 1s linear; width: 100%; }
.about-sec-third-i-ap.active::before { width: 0; }
.about-sec-third-i-e-ap::before { background-color: #fff; content: ""; display: block; height: 100%; position: absolute; right: 0; top: 0; -webkit-transition: 1s linear 1s; -moz-transition: 1s linear 1s; -ms-transition: 1s linear 1s; -o-transition: 1s linear 1s; transition: 1s linear 1s; width: 100%; }
.about-sec-third-i-e-ap.active::before { width: 0; }

		/*------- Animation CSS Ends -------*/

	/*------- Third Section Ends -------*/

	/*------- Fourth Section Starts -------*/

.bg-about-sec-four-ap { padding: 50px 15px; position: relative; }
.bg-about-sec-four-background-ap { background-color: #f1f1f1; height: 300px; left: 0; margin-top: 150px; position: absolute; top: 0; width: 75%; }
.about-heading-sec-four-ap > h2 { color: #000; font: 4rem/1.42857143 "Lato-Regular"; margin-bottom: 100px; }
.about-heading-sec-four-ap > h2 > span { color: #b16f43; }
.about-desc-sec-four-ap > p { color: #000; font: 1.8rem/1.7 "Lato-Light"; }
.about-desc-sec-four-image { position: relative; }
.about-desc-sec-four-image > img { width: 100%; }
.about-desc-sec-four-image-i { position: absolute; right: -30px; top: -30px; }

		/*------- Animation CSS Starts -------*/

.about-desc-sec-four-image::before { background-color: #fff; content: ""; display: block; height: 100%; position: absolute; right: 0; top: 0; -webkit-transition: 1s linear; -moz-transition: 1s linear; -ms-transition: 1s linear; -o-transition: 1s linear; transition: 1s linear; width: 100%; }
.about-desc-sec-four-image.active::before { width: 0; }

		/*------- Animation CSS Ends -------*/

	/*------- Fourth Section Ends -------*/

	/*------- Fifth Section Starts -------*/

.bg-about-sec-five-ap { padding: 50px 15px; position: relative; }
.bg-five-sec-i-ap { position: relative; }
.bg-five-sec-i-ap > img { width: 100%; }
.bg-five-sec-i-b-ap { border: 1px solid #000; height: 115%; left: 50%; position: absolute; top: 50%; -webkit-transform: translate(-50%,-50%); -moz-transform: translate(-50%,-50%); -ms-transform: translate(-50%,-50%); -o-transform: translate(-50%,-50%); transform: translate(-50%,-50%); width: 115%; z-index: 1; }
.bg-five-sec-i-ap + p { color: #000; font: 1.8rem/1.42857143 "Lato-Light"; margin-top: 75px; }
.bg-five-sec-d-i-ap { margin: 0 -30px; }
.bg-five-sec-d-i-ap > p { color: #000; font: 1.8rem/1.42857143 "Lato-Light"; margin: 0 0 100px 100px; }
.bg-five-sec-ti-ap { margin-top: -300px; }

		/*------- Animation CSS Starts -------*/

.bg-five-sec-fi-ap::before,
.bg-five-sec-si-ap::before,
.bg-five-sec-ti-ap::before { background-color: #fff; content: ""; display: block; height: 100%; position: absolute; right: 0; top: 0; -webkit-transition: 1s linear; -moz-transition: 1s linear; -ms-transition: 1s linear; -o-transition: 1s linear; transition: 1s linear; width: 100%; }
.bg-five-sec-fi-ap.active::before,
.bg-five-sec-si-ap.active::before,
.bg-five-sec-ti-ap.active::before { width: 0; }

		/*------- Animation CSS Ends -------*/

	/*------- Fifth Section Ends -------*/

	/*------- Sixth Section Starts -------*/

.bg-about-sec-six-ap { padding: 50px 15px; position: relative; }
.about-six-heading-desc-ap > h2 { color: #000; font: 3rem/1.42857143 "Lato-Light"; margin-bottom: 30px; }
.about-six-heading-desc-ap > p { color: #000; font: 1.8rem/1.42857143 "Lato-Light"; margin-bottom: 200px; }
.bg-six-sec-i-ap { margin-left: -30px; position: relative; }
.bg-six-sec-i-ap > img { width: 100%; }
.bg-six-sec-i-ap + p { color: #000; font: 1.8rem/1.42857143 "Lato-Light"; margin-top: 50px; }
.bg-six-sec-i-b-ap { border: 1px solid #000; height: 115%; left: 50%; position: absolute; top: 50%; -webkit-transform: translate(-50%,-50%); -moz-transform: translate(-50%,-50%); -ms-transform: translate(-50%,-50%); -o-transform: translate(-50%,-50%); transform: translate(-50%,-50%); width: 115%; z-index: 1; }
.bg-six-sec-ti-ap { margin: -300px 0 0 -100px; position: relative; z-index: -1; }
.bg-six-sec-ei-ap > p { color: #000; font: 1.8rem/1.42857143 "Lato-Light"; margin: 100px 0; }

		/*------- Animation CSS Starts -------*/

.bg-six-sec-fi-ap::before,
.bg-six-sec-si-ap::before,
.bg-six-sec-ti-ap::before { background-color: #fff; content: ""; display: block; height: 100%; position: absolute; right: 0; top: 0; -webkit-transition: 1s linear; -moz-transition: 1s linear; -ms-transition: 1s linear; -o-transition: 1s linear; transition: 1s linear; width: 100%; }
.bg-six-sec-fi-ap.active::before,
.bg-six-sec-si-ap.active::before,
.bg-six-sec-ti-ap.active::before { width: 0; }

		/*------- Animation CSS Ends -------*/

.read-view-more-appoint { left: 50%; position: absolute; top: 50%; -webkit-transform: translate(-50%,-50%); -moz-transform: translate(-50%,-50%); -ms-transform: translate(-50%,-50%); -o-transform: translate(-50%,-50%); transform: translate(-50%,-50%); }

	/*------- Sixth Section Ends -------*/

/*------- About Us Page Ends -------*/

/*------- Tatto Studio Page Starts -------*/

	/*------- Logo and Navigationbar Menu Section Starts -------*/

.bg-logo-navbar-ip { background-color: #232323; padding: 5px 15px; }
.header-logo-ip-desktop > a { display: inline-block; }
.header-logo-ip-desktop > a > img { width: 140px; }
.menu-listing-ip { padding: 0; text-align: right; }

	/*------- Logo and Navigationbar Menu Section Ends -------*/

	/*------- Information Section Starts -------*/

.bg-men-women-services-info-ip { padding: 0 15px; }
.men-women-services-heading-ip { position: relative; }
.men-women-services-heading-ip > h1 { color: #999; font: 22rem/1.42857143 "Lato-Black"; letter-spacing: 7px; opacity: 0.1; position: relative; text-transform: uppercase; }
.men-women-services-heading-ip > p { color: #000; font: 4rem/1.42857143 "Lato-Bold"; left: 25%; letter-spacing: 7px; opacity: 1; position: absolute; text-transform: uppercase; top: 50%; -webkit-transform: translate(-50%,-50%); -moz-transform: translate(-50%,-50%); -ms-transform: translate(-50%,-50%); -o-transform: translate(-50%,-50%); transform: translate(-50%,-50%); }

	/*------- Information Section Ends -------*/

	/*------- First Services Section Starts -------*/

.bg-first-wm-services { padding: 100px 15px; }
.mw-services-ip { display: block; height: 100%; position: relative; }
.mw-services-background-image { position: relative; z-index: 1; }
.mw-services-arrow { bottom: 30px; opacity: 0; position: absolute; right: 30px; -webkit-transition: 0.5s linear; -moz-transition: 0.5s linear; -ms-transition: 0.5s linear; -o-transition: 0.5s linear; transition: 0.5s linear; visibility: hidden; z-index: 2; }
.mw-services-arrow > img { width: 50px; }
.mw-service-heading-desc-ip > h4 { color: #000000; font: 1.8rem/1.42857143 "Lato-Light"; margin-bottom: 5px; text-transform: uppercase; }
.mw-service-heading-desc-ip > p { color: #000000; font: 1.6rem/1.42857143 "Lato-Italic"; }
.about-extra-info > p { color: #000000; font: 1.6rem/1.42857143 "Lato-Light"; margin-bottom: 15px; }
.about-extra-info > h2 { color: #000000; font: 3rem/1.2 "Lato-Italic"; margin-bottom: 15px; }

		/*------- First Image CSS Starts -------*/

.mw-services-background-image-one::after { background-color: #fff; content: ""; height: 100%; position: absolute; right: 0; top: 0; -webkit-transition: 0.5s linear; -moz-transition: 0.5s linear; -ms-transition: 0.5s linear; -o-transition: 0.5s linear; transition: 0.5s linear; width: 100%; }
.men-service-img-one { background: url("../images/tatto-services-pg-1.jpg") no-repeat 50% 100%/cover; height: 320px; margin-bottom: 15px; }
.men-service-img-one1 { background: url("../images/tatto-services-pg-11.jpg") no-repeat 50% 100%/cover; height: 320px; margin-bottom: 15px; }
.men-service-img-one2 { background: url("../images/tatto-services-pg-12.jpg") no-repeat 50% 100%/cover; height: 320px; margin-bottom: 15px; }

			/*------- Hover and Active CSS Starts -------*/

.mw-services-background-image-one.active::after { width: 0; }
.mw-services-ip:hover .mw-services-background-image-one::after { width: 50px; }
.mw-services-ip:hover .mw-services-arrow { opacity: 1; right: 15px; visibility: visible; }

			/*------- Hover and Active CSS Ends -------*/

		/*------- First Image CSS Ends -------*/

		/*------- Second Image CSS Starts -------*/

.mw-services-minus-margin-ip { margin-top: -100px; }
.mw-services-background-image-two::after { background-color: #fff; content: ""; height: 100%; position: absolute; right: 0; top: 0; -webkit-transition: 0.5s linear; -moz-transition: 0.5s linear; -ms-transition: 0.5s linear; -o-transition: 0.5s linear; transition: 0.5s linear; width: 100%; }
.men-service-img-two { background: url("../images/tatto-services-pg-2.jpg") no-repeat 50% 100%/cover; height: 320px; margin-bottom: 30px; -webkit-transition: 0.5s linear; -moz-transition: 0.5s linear; -ms-transition: 0.5s linear; -o-transition: 0.5s linear; transition: 0.5s linear; width: 100%; }
.men-service-img-two1 { background: url("../images/tatto-services-pg-21.jpg") no-repeat 50% 100%/cover; height: 320px; margin-bottom: 30px; -webkit-transition: 0.5s linear; -moz-transition: 0.5s linear; -ms-transition: 0.5s linear; -o-transition: 0.5s linear; transition: 0.5s linear; width: 100%; }
.men-service-img-two2 { background: url("../images/tatto-services-pg-22.jpg") no-repeat 50% 100%/cover; height: 320px; margin-bottom: 30px; -webkit-transition: 0.5s linear; -moz-transition: 0.5s linear; -ms-transition: 0.5s linear; -o-transition: 0.5s linear; transition: 0.5s linear; width: 100%; }

			/*------- Hover and Active CSS Starts -------*/

.mw-services-background-image-two.active::after { width: 0; }
.mw-services-ip:hover .mw-services-background-image-two::after { width: 50px; }
.mw-services-ip:hover .mw-services-arrow { opacity: 1; right: 15px; visibility: visible; }
.mw-services-ip:hover .men-service-img-two { background-position: 70% 100%; }

		/*------- Hover and Active CSS Ends -------*/

		/*------- Second Image CSS Ends -------*/

		/*------- Third Image CSS Starts -------*/

.mw-services-background-image-three::after { background-color: #fff; content: ""; height: 100%; position: absolute; right: 0; top: 0; -webkit-transition: 0.5s linear; -moz-transition: 0.5s linear; -ms-transition: 0.5s linear; -o-transition: 0.5s linear; transition: 0.5s linear; width: 100%; }
.men-service-img-three {
	background: url("../images/tatto-services-pg-3.jpg") no-repeat 50% 100%/cover;
	height: 320px;
	margin-bottom: 30px;
	-webkit-transition: 0.5s linear;
	-moz-transition: 0.5s linear;
	-ms-transition: 0.5s linear;
	-o-transition: 0.5s linear;
	transition: 0.5s linear;
}
.men-service-img-three1 {
	background: url("../images/tatto-services-pg-31.jpg") no-repeat 50% 100%/cover;
	height: 320px;
	margin-bottom: 30px;
	-webkit-transition: 0.5s linear;
	-moz-transition: 0.5s linear;
	-ms-transition: 0.5s linear;
	-o-transition: 0.5s linear;
	transition: 0.5s linear;
}
.men-service-img-three2 {
	background: url("../images/tatto-services-pg-32.jpg") no-repeat 50% 100%/cover;
	height: 320px;
	margin-bottom: 30px;
	-webkit-transition: 0.5s linear;
	-moz-transition: 0.5s linear;
	-ms-transition: 0.5s linear;
	-o-transition: 0.5s linear;
	transition: 0.5s linear;
}

			/*------- Hover and Active CSS Starts -------*/

.mw-services-background-image-three.active::after { width: 0; }
.mw-services-ip:hover .mw-services-background-image-three::after { width: 50px; }
.mw-services-ip:hover .mw-services-arrow { opacity: 1; right: 15px; visibility: visible; }
.mw-services-ip:hover .men-service-img-three { background-position: 70% 100%; }

			/*------- Hover and Active CSS Ends -------*/

		/*------- Third Image CSS Ends -------*/

	/*------- First Services Section Ends -------*/

	/*------- Second Services Section Starts -------*/

.bg-second-wm-services { padding: 100px 15px; }

		/*------- Fourth Image CSS Starts -------*/

.mw-services-background-image-four::after { background-color: #fff; content: ""; height: 100%; position: absolute; right: 0; top: 0; -webkit-transition: 0.5s linear; -moz-transition: 0.5s linear; -ms-transition: 0.5s linear; -o-transition: 0.5s linear; transition: 0.5s linear; width: 100%; }
.men-service-img-four { background: url("../images/tatto-services-pg-4.jpg") no-repeat 50% 100%/cover; height: 400px; margin-bottom: 30px; -webkit-transition: 0.5s linear; -moz-transition: 0.5s linear; -ms-transition: 0.5s linear; -o-transition: 0.5s linear; transition: 0.5s linear; }

			/*------- Hover and Active CSS Starts -------*/

.mw-services-background-image-four.active::after { width: 0; }
.mw-services-ip:hover .mw-services-background-image-four::after { width: 50px; }
.mw-services-ip:hover .mw-services-arrow { opacity: 1; right: 15px; visibility: visible; }
.mw-services-ip:hover .men-service-img-four { background-position: 70% 100%; }

			/*------- Hover and Active CSS Ends -------*/

		/*------- Fourth Image CSS Ends -------*/

		/*------- Fifth Image CSS Starts -------*/

.mw-services-background-image-five::after { background-color: #fff; content: ""; height: 100%; position: absolute; right: 0; top: 0; -webkit-transition: 0.5s linear; -moz-transition: 0.5s linear; -ms-transition: 0.5s linear; -o-transition: 0.5s linear; transition: 0.5s linear; width: 100%; }
.men-service-img-five {
	background: url("../images/tatto-services-pg-5.jpg") no-repeat 50% 100%/cover;
	height: 319px;
	margin-bottom: 30px;
	-webkit-transition: 0.5s linear;
	-moz-transition: 0.5s linear;
	-ms-transition: 0.5s linear;
	-o-transition: 0.5s linear;
	transition: 0.5s linear;
}

			/*------- Hover and Active CSS Starts -------*/

.mw-services-background-image-five.active::after { width: 0; }
.mw-services-ip:hover .mw-services-background-image-five::after { width: 50px; }
.mw-services-ip:hover .mw-services-arrow { opacity: 1; right: 15px; visibility: visible; }
.mw-services-ip:hover .men-service-img-five { background-position: 70% 100%; }

			/*------- Hover and Active CSS Ends -------*/

		/*------- Fifth Image CSS Ends -------*/

.mw-extra-service-banner { position: absolute; right: 15px; top: 180px; width: 30%; }
.mw-es-img-desc > img { margin-bottom: 15px; width: 100%; }

	/*------- Second Services Section Ends -------*/

	/*------- Third Services Section Starts -------*/

.bg-third-wm-services { padding: 100px 15px 10px; }

		/*------- Seventh Image CSS Starts -------*/

.mw-services-background-image-seven::after { background-color: #fff; content: ""; height: 100%; position: absolute; right: 0; top: 0; -webkit-transition: 0.5s linear; -moz-transition: 0.5s linear; -ms-transition: 0.5s linear; -o-transition: 0.5s linear; transition: 0.5s linear; width: 100%; }
.men-service-img-seven { background: url("../images/tatto-services-pg-7.jpg") no-repeat 50% 100%/cover; height: 319px; margin-bottom: 30px; -webkit-transition: 0.5s linear; -moz-transition: 0.5s linear; -ms-transition: 0.5s linear; -o-transition: 0.5s linear; transition: 0.5s linear; }

			/*------- Hover and Active CSS Starts -------*/

.mw-services-background-image-seven.active::after { width: 0; }
.mw-services-ip:hover .mw-services-background-image-seven::after { width: 50px; }
.mw-services-ip:hover .mw-services-arrow { opacity: 1; right: 15px; visibility: visible; }
.mw-services-ip:hover .men-service-img-seven { background-position: 70% 100%; }

			/*------- Hover and Active CSS Ends -------*/

		/*------- Seventh Image CSS Ends -------*/

		/*------- Eighth Image CSS Starts -------*/

.mw-services-background-image-eight::after { background-color: #fff; content: ""; height: 100%; position: absolute; right: 0; top: 0; -webkit-transition: 0.5s linear; -moz-transition: 0.5s linear; -ms-transition: 0.5s linear; -o-transition: 0.5s linear; transition: 0.5s linear; width: 100%; }
.men-service-img-eight { background: url("../images/tatto-services-pg-8.jpg") no-repeat 50% 100%/cover; height: 319px; margin-bottom: 30px; -webkit-transition: 0.5s linear; -moz-transition: 0.5s linear; -ms-transition: 0.5s linear; -o-transition: 0.5s linear; transition: 0.5s linear; }

			/*------- Hover and Active CSS Starts -------*/

.mw-services-background-image-eight.active::after { width: 0; }
.mw-services-ip:hover .mw-services-background-image-eight::after { width: 50px; }
.mw-services-ip:hover .mw-services-arrow { opacity: 1; right: 15px; visibility: visible; }
.mw-services-ip:hover .men-service-img-eight { background-position: 70% 100%; }

			/*------- Hover and Active CSS Ends -------*/

		/*------- Eighth Image CSS Ends -------*/

	/*------- Third Services Section Ends -------*/

	/*------- Product Section Starts -------*/

.bg-product-mw { background-color: #f5f5f5; padding: 100px 15px; }
.product-info-anchor-wm-one { display: block; margin-top: 100px; opacity: 0; -webkit-transition: 0.5s linear; -moz-transition: 0.5s linear; -ms-transition: 0.5s linear; -o-transition: 0.5s linear; transition: 0.5s linear; visibility: hidden; }
	.product-info-anchor-wm-one.active { margin-top: -200px; opacity: 1; visibility: visible; }
	.product-info-anchor-wm-two { display: block; margin-top: 100px; opacity: 0; -webkit-transition: 0.5s linear 0.5s; -moz-transition: 0.5s linear 0.5s; -ms-transition: 0.5s linear 0.5s; -o-transition: 0.5s linear 0.5s; transition: 0.5s linear 0.5s; visibility: hidden; }
	.product-info-anchor-wm-two.active { margin-top: -200px; opacity: 1; visibility: visible; }

	/*------- Product Section Ends -------*/

/*------- Tatto Studio Page Ends -------*/

/*------- Women Services Page Starts -------*/

	/*------- First Services Section Starts -------*/

.women-service-img-one { background: url("../images/women-services-pg-1.jpg") no-repeat 100% 15%/cover; height: 519px; margin-bottom: 30px; -webkit-transition: 0.5s linear; -moz-transition: 0.5s linear; -ms-transition: 0.5s linear; -o-transition: 0.5s linear; transition: 0.5s linear; }
.women-service-img-two { background: url("../images/women-services-pg-2.jpg") no-repeat 100% 15%/cover; height: 319px; margin-bottom: 30px; -webkit-transition: 0.5s linear; -moz-transition: 0.5s linear; -ms-transition: 0.5s linear; -o-transition: 0.5s linear; transition: 0.5s linear; }
.women-service-img-three { background: url("../images/women-services-pg-3.jpg") no-repeat 100% 15%/cover; height: 319px; margin-bottom: 30px; -webkit-transition: 0.5s linear; -moz-transition: 0.5s linear; -ms-transition: 0.5s linear; -o-transition: 0.5s linear; transition: 0.5s linear; }
.women-service-img-four { background: url("../images/women-services-pg-4.jpg") no-repeat 50% 100%/cover; height: 400px; margin-bottom: 30px; -webkit-transition: 0.5s linear; -moz-transition: 0.5s linear; -ms-transition: 0.5s linear; -o-transition: 0.5s linear; transition: 0.5s linear; }
.women-service-img-five { background: url("../images/women-services-pg-6.jpg") no-repeat 50% 100%/cover; height: 319px; margin-bottom: 30px; -webkit-transition: 0.5s linear; -moz-transition: 0.5s linear; -ms-transition: 0.5s linear; -o-transition: 0.5s linear; transition: 0.5s linear; }
.women-service-img-seven { background: url("../images/women-services-pg-7.jpg") no-repeat 50% 100%/cover; height: 519px; margin-bottom: 30px; -webkit-transition: 0.5s linear; -moz-transition: 0.5s linear; -ms-transition: 0.5s linear; -o-transition: 0.5s linear; transition: 0.5s linear; }
.women-service-img-eight { background: url("../images/women-services-pg-8.jpg") no-repeat 100% 15%/cover; height: 319px; margin-bottom: 30px; -webkit-transition: 0.5s linear; -moz-transition: 0.5s linear; -ms-transition: 0.5s linear; -o-transition: 0.5s linear; transition: 0.5s linear; }

	/*------- First Services Section Ends -------*/

	/*------- Third Sevices Section Starts -------*/

		/*------- Nineth, Tenth, Eleven, Thirteen, Fourteen and Fifteen Image CSS Starts -------*/

.mw-services-background-image-nine::after,
.mw-services-background-image-ten::after,
.mw-services-background-image-eleven::after,
.mw-services-background-image-thirteen::after,
.mw-services-background-image-fourteen::after,
.mw-services-background-image-fifteen::after { background-color: #fff; content: ""; height: 100%; position: absolute; right: 0; top: 0; -webkit-transition: 0.5s linear; -moz-transition: 0.5s linear; -ms-transition: 0.5s linear; -o-transition: 0.5s linear; transition: 0.5s linear; width: 100%; }
.women-service-img-nine { background: url("../images/women-services-pg-9.jpg") no-repeat 100% 15%/cover; height: 400px; margin-bottom: 30px; -webkit-transition: 0.5s linear; -moz-transition: 0.5s linear; -ms-transition: 0.5s linear; -o-transition: 0.5s linear; transition: 0.5s linear; }
.women-service-img-ten { background: url("../images/women-services-pg-10.jpg") no-repeat 100% 35%/cover; height: 400px; margin-bottom: 30px; -webkit-transition: 0.5s linear; -moz-transition: 0.5s linear; -ms-transition: 0.5s linear; -o-transition: 0.5s linear; transition: 0.5s linear; }
.women-service-img-eleven { background: url("../images/women-services-pg-11.jpg") no-repeat 100% 15%/cover; height: 400px; margin-bottom: 30px; -webkit-transition: 0.5s linear; -moz-transition: 0.5s linear; -ms-transition: 0.5s linear; -o-transition: 0.5s linear; transition: 0.5s linear; }
.women-service-img-thirteen { background: url("../images/women-services-pg-15.jpg") no-repeat 65% 15%/cover; height: 400px; margin-bottom: 30px; -webkit-transition: 0.5s linear; -moz-transition: 0.5s linear; -ms-transition: 0.5s linear; -o-transition: 0.5s linear; transition: 0.5s linear; }
.women-service-img-fourteen { background: url("../images/women-services-pg-13.jpg") no-repeat 100% 15%/cover; height: 400px; margin-bottom: 30px; -webkit-transition: 0.5s linear; -moz-transition: 0.5s linear; -ms-transition: 0.5s linear; -o-transition: 0.5s linear; transition: 0.5s linear; }
.women-service-img-fifteen { background: url("../images/women-services-pg-14.jpg") no-repeat 100% 15%/cover; height: 400px; margin-bottom: 30px; -webkit-transition: 0.5s linear; -moz-transition: 0.5s linear; -ms-transition: 0.5s linear; -o-transition: 0.5s linear; transition: 0.5s linear; }

			/*------- Hover and Active CSS Starts -------*/

.mw-services-background-image-nine.active::after { width: 0; }
.mw-services-background-image-ten.active::after { width: 0; }
.mw-services-background-image-eleven.active::after { width: 0; }
.mw-services-background-image-thirteen.active::after { width: 0; }
.mw-services-background-image-fourteen.active::after { width: 0; }
.mw-services-background-image-fifteen.active::after { width: 0; }
.mw-services-ip:hover .mw-services-background-image-nine::after { width: 50px; }
.mw-services-ip:hover .mw-services-background-image-ten::after { width: 50px; }
.mw-services-ip:hover .mw-services-background-image-eleven::after { width: 50px; }
.mw-services-ip:hover .mw-services-background-image-thirteen::after { width: 50px; }
.mw-services-ip:hover .mw-services-background-image-fourteen::after { width: 50px; }
.mw-services-ip:hover .mw-services-background-image-fifteen::after { width: 50px; }
.mw-services-ip:hover .mw-services-arrow { opacity: 1; right: 15px; visibility: visible; }
.mw-services-ip:hover .women-service-img-one,
.mw-services-ip:hover .women-service-img-two,
.mw-services-ip:hover .women-service-img-three,
.mw-services-ip:hover .women-service-img-four,
.mw-services-ip:hover .women-service-img-five,
.mw-services-ip:hover .women-service-img-seven,
.mw-services-ip:hover .women-service-img-eight,
.mw-services-ip:hover .women-service-img-nine,
.mw-services-ip:hover .women-service-img-eleven,
.mw-services-ip:hover .women-service-img-thirteen,
.mw-services-ip:hover .women-service-img-fourteen,
.mw-services-ip:hover .women-service-img-fifteen { background-position: 100% 50%; }

			/*------- Hover and Active CSS Ends -------*/

		/*------- Nineth, Tenth, Eleven, Thirteen, Fourteen and Fifteen Image CSS Ends -------*/

	/*------- Third Sevices Section Ends -------*/

	/*------- Fourth Services Section Starts -------*/

.bg-fourth-wm-services { padding: 100px 15px 0; }

	/*------- Fourth Services Section Ends -------*/

	/*------- Fifth Section Starts -------*/

.bg-fifth-wm-services { padding: 100px 15px 0 0; }

	/*------- Fifth Section Ends -------*/

/*------- Women Services Page Ends -------*/

/*------- Contact Page Starts -------*/

	/*------- Logo and Navigationbar Menu Section Starts -------*/

.bg-logo-navbar-cp { left: 0; position: absolute; top: 0; width: 100%; z-index: 10; }

	/*------- Logo and Navigationbar Menu Section Ends -------*/

	/*------- Map and Contact Information Section Starts -------*/

.padding-zero-desktop { padding: 0; }
.display-map-cp { border: 0; height: 800px; width: 100%; }
.contact-info-cp { margin: 0 50px; }
.contact-info-cp > h1 { color: #000; font: 4rem/1.42857143 "Lato-Black"; letter-spacing: 4px; margin-bottom: 15px; text-transform: uppercase; }
.contact-info-cp > p:nth-child(2) { color: #000; font: 1.8rem/1.42857143 "Lato-Regular"; margin: 30px 0; }
.contact-info-cp > p:nth-child(3) { border-bottom: 1px solid #e7e7e7; border-top: 1px solid #e7e7e7; color: #000; font: 1.8rem/1.7 "Lato-Regular"; margin: 30px 0; padding: 30px 0; }
.contact-info-cp > p:nth-child(3) > span { display: block; }
.contact-info-cp > p:nth-child(4) > a,
.contact-info-cp > p:nth-child(5) > a { color: #000; display: block; font: 1.8rem/1.42857143 "Lato-Regular"; margin-bottom: 30px; padding-left: 30px; position: relative; }
/* .contact-info-cp > p:nth-child(4) > a { display: inline-block; margin-right: 30px; }
.contact-info-cp > p:nth-child(4) > a:last-child { margin-right: 0; } */
.contact-info-cp > p:nth-child(4) > a::before,
.contact-info-cp > p:nth-child(5) > a::before { content: "\f879"; display: block; font-family: "Font Awesome 5 Free"; font-weight: 900; left: 0; position: absolute; top: 0; }
.contact-info-cp > p:nth-child(5) > a::before { content: "\f0e0"; }
.social-listing-cp > li { display: inline-block; margin-right: 30px; }
.social-listing-cp > li:last-child { margin-right: 0; }
.social-listing-cp > li > a { color: #000; font-size: 1.8rem; }

	/*------- Map and Contact Information Section Ends -------*/

	/*------- Form Section Starts -------*/

.bg-form-cp { opacity: 0; padding: 200px 15px 0; -webkit-transform: translateY(100px); -moz-transform: translateY(100px); -ms-transform: translateY(100px); -o-transform: translateY(100px); transform: translateY(100px); -webkit-transition: 1s linear; -moz-transition: 1s linear; -ms-transition: 1s linear; -o-transition: 1s linear; transition: 1s linear; visibility: hidden; }
.bg-form-cp.active { opacity: 1; -webkit-transform: translateY(0); -moz-transform: translateY(0); -ms-transform: translateY(0); -o-transform: translateY(0); transform: translateY(0); visibility: visible; }
.contact-form-heading-cp > h2 { color: #000;
font: 4rem/1.42857143 "Lato-Black";
letter-spacing: 4px;
margin-bottom: 100px;
text-transform: uppercase;}

		/*------- Custom Form CSS Starts -------*/

.form-contact { margin-bottom: 50px; position: relative; }
.form-control-contact { border: 0; border-bottom: 1px solid #000; -webkit-border-radius: 0; -moz-border-radius: 0; -ms-border-radius: 0; -o-border-radius: 0; border-radius: 0; -webkit-box-shadow: none; -moz-box-shadow: none; -ms-box-shadow: none; -o-box-shadow: none; box-shadow: none; color: #000; height: 50px; font: 1.6rem/1.42857143 "Lato-Regular"; letter-spacing: 1px; padding: 10px 0; }
.form-label { margin-bottom: 0; left: 0; pointer-events: none; position: absolute; top: 50%; transform: translateY(-50%); -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); transition: 0.5s linear; -webkit-transition: 0.5s linear; -moz-transition: 0.5s linear; -ms-transition: 0.5s linear; -o-transition: 0.5s linear; }
.form-label > span { color: #000; font: 1.6rem/1.42857143 "Lato-Regular"; transition: 0.5s linear; -webkit-transition: 0.5s linear; -moz-transition: 0.5s linear; -ms-transition: 0.5s linear; -o-transition: 0.5s linear; }
.form-control-contact:focus { border-color: #000; box-shadow: none; -webkit-box-shadow: none; -moz-box-shadow: none; -ms-box-shadow: none; -o-box-shadow: none; }
.form-control-contact:focus + .form-label,
.form-control-contact:valid + .form-label { top: 0; }
.form-control-contact:focus + .form-label > span,
.form-control-contact:valid + .form-label > span { font-size: 1.8rem; }
textarea.form-control-contact { height: 150px; resize: none; }
textarea.form-control-contact + .form-label { top: 15%; }

  /*------- Custom Form CSS Ends -------*/

.button-submit-center { margin-top: 50px; text-align: center; }

	/*------- Form Section Ends -------*/

/*------- Contact Page Ends -------*/

/*------- Gallery Page Starts -------*/

	/*------- Gallery Section Starts -------*/

.bg-gallery-gp { padding: 100px 15px 0; }
.gallery-img-desc-anchor { display: block; margin-bottom: 30px; overflow: hidden; position: relative; }
.gallery-img-desc-center-anchor { margin: 30px 0 0 0; }
.gallery-img-desc-anchor img { -webkit-transition: 0.5s linear; -moz-transition: 0.5s linear; -ms-transition: 0.5s linear; -o-transition: 0.5s linear; transition: 0.5s linear; }
.gallery-img-desc-anchor:hover img { filter: brightness(0.4); -webkit-transform: rotate(7deg) scale(1.2); -moz-transform: rotate(7deg) scale(1.2); -ms-transform: rotate(7deg) scale(1.2); -o-transform: rotate(7deg) scale(1.2); transform: rotate(7deg) scale(1.2); }
.gallery-img-border { border: 1px solid #fff; height: 90%; left: 50%; opacity: 0; position: absolute; top: 50%; -webkit-transform: translate(-50%,-50%) scale(0.9); -moz-transform: translate(-50%,-50%) scale(0.9); -ms-transform: translate(-50%,-50%) scale(0.9); -o-transform: translate(-50%,-50%) scale(0.9); transform: translate(-50%,-50%) scale(0.9); -webkit-transition: 0.5s linear; -moz-transition: 0.5s linear; -ms-transition: 0.5s linear; -o-transition: 0.5s linear; transition: 0.5s linear; visibility: hidden; width: 90%; z-index: 1; }
.gallery-zoom-link { left: 50%; opacity: 0; position: absolute; top: 60%; -webkit-transform: translate(-50%,-50%); -moz-transform: translate(-50%,-50%); -ms-transform: translate(-50%,-50%); -o-transform: translate(-50%,-50%); transform: translate(-50%,-50%); -webkit-transition: 0.5s linear; -moz-transition: 0.5s linear; -ms-transition: 0.5s linear; -o-transition: 0.5s linear; transition: 0.5s linear; visibility: hidden; z-index: 1; }
.gallery-zoom-link > i { color: #fff; font-size: 4rem; }
.gallery-img-desc-anchor:hover .gallery-zoom-link { opacity: 1; top: 50%; visibility: visible; }
.gallery-img-desc-anchor:hover .gallery-img-border { -webkit-transform: translate(-50%,-50%) scale(1); -moz-transform: translate(-50%,-50%) scale(1); -ms-transform: translate(-50%,-50%) scale(1); -o-transform: translate(-50%,-50%) scale(1); transform: translate(-50%,-50%) scale(1); opacity: 1; visibility: visible; }
.gallery-bottom-text > p { color: #999; font: 24rem/1.42857143 "Lato-Black"; opacity: 0.1; text-align: center; text-transform: uppercase; }

	/*------- Gallery Section Ends -------*/

/*------- Gallery Page Ends -------*/