@charset "utf-8";
/* CSS Document */
/* Eartic Solutions */
/* Version 1.0 */
/* Design By Ashan Eranga */

/****************************COMMON STYLE***************************/
body{
  overflow-x: hidden;
  overflow-y: scroll;
}

h1, h2, h3{	
	font-family: 'Poppins', sans-serif;
}

p, a, h5, li, div, span, h4{
	font-family: 'Merriweather Sans', sans-serif;
}

.top_wrapper{
	background-color:#2A2A2A;
	height:100vh;
	margin-bottom:0px;
}

.bot_wrapper{
	background-color:#e2f0f4;
	min-height:940px;
	margin-bottom:0px;
	margin-top:0px;
}

a:hover{
	text-decoration:none;
}

/************************************TOP TASK BAR****************************/
.top_task_bar{
	background-color:transparent;
	border-bottom:solid 1px rgba(0,0,0,0.1);
	min-height:30px;
	padding-top:1%;
}

.top_top_nav{
	padding-top:1.5%;
}

.top_menu{
	text-align:right;
	float:right;
	padding-left:2%;
	padding-right:2%;
}

.top_active{
	color:#4873b8 !important;
}

.special_line{
	color:#333;
	letter-spacing:2px;
}

.top_link{
	color:#333;
	font-size:11px;
}


/************************************MENU**********************************/
.eartic_navbar{
	background-color:#FFF;
	padding-bottom:2%;
	margin-bottom:1px;
	border-radius:0;
	border:none;
	transition:all 0.4s;
	margin-top:0%;
	height:80px;
	z-index:999 !important;
}

.logo{
	margin-left:2%;
	margin-top:1.4%;
	position:absolute;
	z-index:999 !important;
}

@media (max-width: 1130px){
	.logo{
		margin-left:2%;
		position:relative;
		z-index:999 !important;
	}
}

@media (max-width: 768px){
	.logo{
		margin-top:-4%;
	}
}

.nav_ul{
	margin-top:2%;
}

.menu_li a{
	color:#000 !important;
	transition:all 0.4s;
	background-color:transparent;
	text-align:right;
	font-size:13px;
	font-family: 'Poppins', sans-serif;
}

.menu_li a:hover{
	color:#4873b8 !important;
	transition:all 0.4s;
}

.li_active a{
	color:#4873b8 !important;
}

.main_nav_ul{
	background-color:#FFF;
	border-radius:0px;
}

/******************SLIDER*********************/
.carousel-fade .item {
	-webkit-transition: opacity 3s;
	-moz-transition: opacity 3s;
	-ms-transition: opacity 3s;
	-o-transition: opacity 3s;
	transition: opacity 3s;
}

.slider{
	margin-top:2% !important;
	z-index:-1;
}
	
.carousel-fade .active.left {
	left:0;opacity:0;z-index:2;
}

.carousel-fade .active.right {
	left:0;opacity:0;z-index:2;
} 

.bullet_main{
	margin-top:-1%;
	z-index:999 !important;
}

.bullet_main li{
	border:solid 1px #039;
}

.slider_text_holder{
	background-image:url(../images/beal-faucets-hp.jpg);
	background-position:center;
	background-repeat:no-repeat;
	background-size:cover;
	min-height:470px;
}

.slide_box{
	background-color:rgba(236,235,239,0.9);
	padding:2% 5%;
	border:solid 13px rgba(219,216,209,0.8);
	margin-top:4%;
}

.slider_tit{
	color:#333;
	text-align:center;
}

.slider_para{
	text-align:center;
}

.slider_link{
	text-align:center;
	color:#FFF;
}

.slider_link a{
	color:#FFF;
	transition:all 0.4s;
	background-color:#4873b8;
	padding:2%;
}

.slider_link a:hover{
	color:#e6e8ed;
	transition:all 0.4s;
	background-color:#27418b;
}

/*****************TWO CAT************************/
.two_cat{
	margin-top:2%;
	border-bottom:solid 1px rgba(0,0,0,0.1);
	padding-bottom:2%;
}

.two_tab{	
	padding-bottom:0%;
}

.nav.nav-justified > li{
	border-right:solid 1px rgba(0,0,0,0.1);
	border-bottom:solid 1px rgba(0,0,0,0);
	padding-bottom:2%;
}

.nav.nav-justified > li:last-child{
	border-right:none;
}

.nav.nav-justified > li > a > img{
	transition:all 0.4s;
	background-color:transparent;
	text-align:center;
	margin-left:auto;
	margin-right:auto;
}

.nav.nav-justified > li:hover{
	transition:all 0.4s;
	background-color:transparent;
}

.nav.nav-justified > li.active{
	background-color:transparent;
	background-image:url(../images/arrow.jpg);
	background-position:bottom center;
	background-repeat:no-repeat;
	background-origin:border-box;
}

.nav.nav-justified > li > a { position: relative; }
.tab-pane .tab-inner { padding: 20px 0 20px; }

.cat_icon{
	margin-left:auto;
	margin-right:auto;	
}

.cat_box{
	border-right:solid 1px rgba(0,0,0,0.2);
	background-color:#666;
	padding:2%;
	min-height:100px;
	box-shadow:2px 5px 10px #333;
	transition:all 0.4s;
}

.cat_box:hover{
	border-right:solid 1px rgba(0,0,0,0.2);
	background-color:#B7B7B7;
	box-shadow:2px 5px 10px #333;
	transition:all 0.4s;
	border-bottom-left-radius:5px;
	border-bottom-right-radius:5px;
}
	
.cat_box_det{
	
}

.cat_box_det > a > p{
	font-size:13px;
	color:#FFF;
	padding:2%;
	margin-top:12%;
	outline:none;
}

.nav.nav-justified > li > a:hover{
	background-color:transparent !important;
	outline:none;
}

.nav.nav-justified > li > a:active{
	background-color:transparent !important;
	outline:none;
}

.nav.nav-justified > li > a:focus{
	background-color:transparent !important;
	outline:none;
}


/******************TWO SLIDE*****************/
.two_slide{
	margin-top:2%;
	margin-bottom:2%;
	border-bottom:solid 1px rgba(0,0,0,0.1);
	padding-bottom:2%;
}

.slide_bath{
	background-image:url(../images/bathroom_new.jpg);
	background-position:center;
	background-repeat:no-repeat;
	background-size:cover;
	min-height:350px;
	transition:all 0.4s;
	background-color:rgba(102,102,102,1);
}

.slide_kitchen{
	background-image:url(../images/shower_new.jpg);
	background-position:center;
	background-repeat:no-repeat;
	background-size:cover;
	min-height:350px;
	transition:all 0.4s;
	background-color:rgba(102,102,102,1);
}

.midd_text_holder{
	background-image:url(../images/new_taps.jpg);
	background-position:center;
	background-repeat:no-repeat;
	background-size:cover;
	min-height:450px;
}

.flip_box{
	visibility:hidden;
	display:none;
	background-color:rgba(236,235,239,0.9);
	padding:2% 5%;
	border:solid 13px rgba(219,216,209,0.8);
	margin-top:7%;
	transition:all 0.4s;
}

.slide_bath:hover > .flip_box{
	visibility:visible;
	display:block;
	transition:all 0.4s;
}

.slide_kitchen:hover > .flip_box{
	visibility:visible;
	display:block;
	transition:all 0.4s;
}

.testimonial_sec{
	margin-top:2%;
	border-top:solid 1px rgba(0,0,0,0.1);
	padding-top:2%;
	marin-bottom:0%;
	background-color:#CDCDCD;
}

.testi_img{
	margin-left:auto;
	margin-right:auto;
	border:solid 5px #FFF;
	border-radius:50%;
	width:100px;
	height:100px;	
}

.testi_box_tit{
	text-align:center;
}

.testi_box_det{
	text-align:center;
}

.bullet li{
	margin-top:35px !important;
}
	

/**********************FOTER*******************/
.footer{
	min-height:160px;
	background-color:#171717;
	margin-bottom:-2% !important;
	margin-top:2%;
}

.footerlogo{
	margin-top:5%;
}

.f_menu{
	list-style:none;
	float:left;
	padding-right:2%;
	margin-top:2%;
}

.f_menu a{
	color:#FFF !important;
	transition:all 0.4s;
}

.f_menu a:hover{
	color:#9b9772 !important;
	transition:all 0.4s;
}

.footer_tag a{
	color:#FFF !important;
	transition:all 0.4s;
	font-size:14px;
}

.footer_tag a:hover{
	color:#9b9772 !important;
	transition:all 0.4s;
}

.f_box{
	margin-top:3%;
	border-left:solid 1px rgba(255,255,255,0.5);
	margin-bottom:0px;
}

.footer_tag_p{
	color:#FFF;
}

.cus_modal{
	border-radius:0;
	background-color:rgba(0,0,0,0.6);
	background-image:url(../images/box_img_bg5.jpg);
	background-position:center;
	background-size:cover;
	background-repeat:no-repeat;
}

.my_modal{
	border-radius:0;
	margin-top:0%;
	background-color:rgba(0,0,0,0.2);
	
}

.my_md_cont{
	border-radius:0;
	background-color:rgba(0,0,0,0.4);
	padding:4%;
}

.modal_special{
	color:#FFF;
	text-align:center;
	font-size:30px;
	font-weight:bolder;
	font-family: 'Cinzel', serif;
}

.modal_semi_spec{
	color:#F5F5F5;
	text-align:center;
	font-size:16px;
	font-weight:700;
	font-family: 'Cinzel', serif;
}

.skip{
	color:#333;
	background-color:#E0E4F8;
	padding:2%;
	text-align:center;
	margin-top:3%;
	display:block;
	margin-left:auto;
	margin-right:auto;
	width:150px;
	border-radius:10px;
	transition:all 0.4s;
	box-shadow:2px 2px 5px #666;
	-webkit-box-shadow:2px 2px 5px #666;
}

.skip:hover{
	color:#FFF;
	background-color:#ff0024;
	transition:all 0.4s;
}

.my_modal .my_md_cont .close {
	color: #fff;
	background-color: #25398f;
	border-color: #25398f;
	border-radius:50%;
	opacity: 1;
	padding: 12px 15px;
	font-size: 17px;
	transition:all 0.4s;
}

.my_modal .my_md_cont .close:hover {
	color: #fff;
	background-color: #ff0024;
	border-color: #ff0024;
	transition:all 0.4s;
}

.pop_banner{
	border-radius:2px;
	opacity:0.85;
	transition:all 0.4s;
}

.pop_banner:hover{
	opacity:1;
	transition:all 0.4s;
}

/***********************************CONTACT PAGE*************************/
.contact{
	border-top:solid 1px rgba(0,0,0,0.1);
	padding-top:5%;
	margin-top:2%;
}

.gen_titt{
	font-size:26px;
	font-weight:bolder;
	color:#25398f;
	background-image:url(../images/titt.jpg);
	background-position:bottom left;
	background-repeat:no-repeat;
	padding-bottom:2%;
}

.contact_left{
	border-right:solid 1px rgba(0,0,0,0.1);
	min-height:600px;
}

.sub_top{
	font-size:15px;
	font-weight:700;
}

.addr{
	font-size:13px;
	color:#333;
}

.sep_line{
	border-top:solid 1px rgba(0,0,0,0.1);
	margin-top:3%;
	padding-top:5%;
}

.eartic_btn{
	border-radius:0px;
	background-color:#25398f;
	color:#FFF;
	transition:all 0.4s;
}

.eartic_btn:hover{
	background-color:#333;
	color:#FFF;
	transition:all 0.4s;
}

/************************ABOUT US**************************/
.det_sec_inn{
	border:solid 1px rgba(0,0,0,0.1);
	border-radius:5px;
}

.second_sub{
	margin-top:2%;
}

/*********************SHOWROOMS******************************/
.showr_box_in{
	border:solid 1px rgba(0,0,0,0.1);
	margin-top:5%;
	padding:4%;
	box-shadow:0px 10px 10px rgba(0,0,0,0.3);
	-webkit-box-shadow:0px 10px 10px rgba(0,0,0,0.3);
	-moz-box-shadow:0px 10px 10px rgba(0,0,0,0.3);
}

.store_img{
	margin-left:auto;
	margin-right:auto;
}


/********************************PROJECTS************************/
.pro_box_in{
	margin-top:3%;
	padding:4%;
	min-height:450px;
}

.pro_bor{
	border-right:solid 1px rgba(0,0,0,0.1);
}

.frame_web{
	margin-top:-80px;
	overflow:visible;
	min-height:1400px;
	width:100%;
	border:none;
	z-index:-1;
	overflow-x:hidden;
}

.frame_web2{
	margin-top:-120px;
	overflow:visible;
	min-height:1400px;
	width:100%;
	border:none;
	z-index:-1;
	overflow-x:hidden;
}

.web_page_holder{
	margin-top:1%;
	position:relative;
	overflow-x:hidden;
}



/******************************GAL***********************/
.gal_bx{
	margin:0px;
	padding:0px;
}

.gal_box_ins{
	padding:0px;
	margin:0px;
	border:solid 1px rgba(255,255,255,1);
}

.gal_box_ins a img{
	opacity:1;
	transition:all 0.4s;
}

.gal_box_ins a img:hover{
	opacity:0.7;
	transition:all 0.4s;
}