.main-bg{ background: #d8d8d8 !important; color: #000 !important}
	.top-bar.main-bg a, .top-bar.main-bg .social-list a{ color: #000 !important; }

	.header-1:not(.sticky-nav) .top-nav > ul > li:hover > a > span:before, .skew-nav > ul > li:hover > a > span:before, .skew-nav > ul > li.selected > a > span:before, .header-1:not(.sticky-nav) .top-nav > ul > li.selected > a > span:before, .header-1:not(.sticky-nav) .top-search:after, .header-1:not(.sticky-nav) .top-cart:after, .main-gradient {
    background: -webkit-linear-gradient(top, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 86%, rgba(0, 0, 0, 0.27) 100%);
    background: linear-gradient(to bottom, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 86%, rgba(0, 0, 0, 0.27) 100%);
    background-color: #ea1414 !important;
}
.videos-sec{}
.videos-sec iframe{border:1px solid #ccc; padding: 20px; border-radius: 10px; background: #e7e7e7;}

.portf-sec{width: 33.33%; float: left; padding: 10px; }
.portf {
  position: relative;
  width: 100%;

}
.f-share{}
.whatsapp{z-index: 99999; right: 0; top: 60%; position: fixed;}
.whatsapp img{max-width:100%;}



.image-portf {
  display: block;
  width: 100%;
  height: auto;
}

.overlay {
  position: absolute;
  bottom: 100%;
  left: 0;
  right: 0;
  background-color: #008CBA;
  overflow: hidden;
  width: 100%;
  height:0;
  transition: .5s ease;
}

.portf:hover .overlay {
  bottom: 0;
  height: 100%;
}

.text {
  color: white;
  font-size: 20px;
  position: absolute;
  top: 30%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  text-align: center;
}

.about-container{max-width: 980px; margin:0 auto; }

.browse{ text-align: center; margin:0 auto; clear: both; width: 100%; float: left; margin-top: 130px; }
.browse a{ border: 2px solid #fff; color: #fff; transition: all ease 0.5s; text-align: center; font-size: 24px;  background: none; padding: 15px 20px; border-radius:4px; }
.browse a:hover{color: #000; background-color: #fff;  transition: all ease 0.5s; }


.partner-image{ text-align: center; border-bottom: 1px solid #d2d2d2; padding-bottom: 30px; }
.partner-image img{ max-width:100% !important; }

.qr-code{margin:10px 0; clear: both; margin-top: 20px; width: 100%; float: left;}
.qr-code a{float: left; padding:6px 6px; color: #fff; background-color: #f00; border-radius: 10px; font-size: 20px;}
.qr-code a:hover{float: left; padding:4px 4px; color: #fff; background-color: #f00; border-radius: 10px; font-size: 20px;}

.about-home-text{width: 100%; float:left; margin-top: 40px;}
.about-home-text p{text-align: center;}
.about-home-text h2{text-align: center;}
.clr{ clear:both; }

.header-1.skew .top-nav > ul > li:hover > a:before, .skew-nav > ul > li:hover > a:before, .header-1.skew .top-nav > ul > li.selected > a:before, .skew-nav > ul > li.selected > a:before, .header-1.skew .top-search > a:before, .header-1.skew .top-cart:before {
    border-color: #790000 transparent transparent transparent !important;
}
.header-1.skew .top-search:before, .header-1.skew .top-cart > a:before, .footer-top .skew-btn:after, .skew-nav > ul > li:hover > a:after, .skew-nav > ul > li.selected > a:after {
    border-color: transparent transparent #4e4545 transparent !important;
}

.content p{margin:0px; padding:0px; line-height:20px; font-size:15px;}

.web-design{width:100%; margin-top: 30px; margin-bottom: 30px; position: relative;     box-shadow: 0px 1px 20px #000; -webkit-box-shadow: 0px 1px 20px #000; -moz-box-shadow: 0px 1px 20px #000; min-height:397px;  padding:10px; background:#fff; overflow:hidden; color:#fff; text-align:center; float:left;}

.web-design:hover{background:#fff; color:#333; transition: all ease 0.4s; }

.web-design p{ color: #333; }

.web-design i{margin:10px 0; padding:0px; font-size:3em; color: #ED0707;}

.web-design:hover i{color:#26abff; transition: all ease 0.6s;}
 
.web-design h3{margin:0px; padding:0px; font-size: 20px;
padding-bottom: 20px;}

.web-design li{margin: 15px auto 10px;
padding: 6px 20px;
border: 1px solid #ccc;
list-style: none;

border-radius: 0.2em;
display: block;

bottom: 10%;
position: absolute;
left: 27%;}

.web-design li a{margin:0px; padding:0px 0px; color:#333; list-style:none; text-decoration:none; display:block;}

.web-design:hover li{border:none; background:#ea1414; color: #fff !important; list-style:none; display:block; transition: all ease 0.6s;}

.web-design:hover li a{ color: #fff; transition: all ease 0.6s; }
.web-design-right{float:right;}

.web-design-second{margin:30px 0px;}

.know-more{ text-align: center; margin:0 auto; margin-top:30px; margin-bottom: 30px; clear: both; width: 100%; float: left; }
.know-more a{ border: 2px solid #f00; color: #f00; transition: all ease 0.5s; text-align: center; font-size: 24px;  background: none; padding: 15px 20px; border-radius:4px; }
.know-more a:hover{color: #fff; background-color: #f00;  transition: all ease 0.5s; }

.know-more1{ text-align: center; margin:0 auto; margin-top:30px; margin-bottom: 30px; clear: both; width: 100%; float: left; }
.know-more1 a{ border: 2px solid green; color: green; transition: all ease 0.5s; text-align: center; font-size: 24px;  background: none; padding: 15px 20px; border-radius:4px; }
.know-more1 a:hover{color: #fff; background-color: green;  transition: all ease 0.5s; }

.common-banner{ width: 100%; float: left; }
.common-banner img{ width: 100%; float: left; }

.common-pages-container{ width: 100%; float: left; padding: 0px 0; }
.common-pages-container h1{ font-size: 36px; padding: 15px 0; font-weight: normal; margin:0px; color: #e10000; }
.common-pages-container-left1{ width: 65%; float: left; }
.common-pages-container-left1 p{ color:#333; line-height: 1.6; font-size: 15px; margin:0px; padding: 10px 0; text-align: justify; }
.common-pages-container-left1 h3{ color: green; padding: 10px 0; margin:0px; font-size: 18px; }
.common-pages-container-right1{ width: 30%; float: right; }

.common-pages-container-left1-list{ width: 100%; float: left; margin-bottom: 10px 0; }
.common-pages-container-left1-list ul{ margin:0px; padding: 0px; list-style: none; }
.common-pages-container-left1-list ul li{ margin-bottom: 5px 0; color: #0067cc; padding: 0px; text-decoration: none; font-size: 16px; line-height: 2; }
.common-pages-container-left1-list ul li i{ font-family: "FontAwesome"; color: #337ab7; padding-right: 10px; }

.common-pages-container-left2{ width: 30%; float: left; }
.common-pages-container-right2{ width: 65%; float: right; }
.common-pages-container-right2 p{ color:#333; line-height: 1.6; font-size: 15px; margin:0px; padding: 10px 0; text-align: justify; }


.breadcrumb {
	/*centering*/
	display: inline-block;
	box-shadow: 0 0 15px 1px rgba(0, 0, 0, 0.35);
	overflow: hidden;
	border-radius: 5px;
	/*Lets add the numbers for each link using CSS counters. flag is the name of the counter. to be defined using counter-reset in the parent element of the links*/
	counter-reset: flag; 
}

.breadcrumb a {
	text-decoration: none;
	outline: none;
	display: block;
	float: left;
	font-size: 12px;
	line-height: 36px;
	color: white;
	/*need more margin on the left of links to accomodate the numbers*/
	padding: 0 10px 0 60px;
	background: #666;
	background: linear-gradient(#666, #333);
	position: relative;
}
/*since the first link does not have a triangle before it we can reduce the left padding to make it look consistent with other links*/
.breadcrumb a:first-child {
	padding-left: 46px;
	border-radius: 5px 0 0 5px; /*to match with the parent's radius*/
}
.breadcrumb a:first-child:before {
	left: 14px;
}
.breadcrumb a:last-child {
	border-radius: 0 5px 5px 0; /*this was to prevent glitches on hover*/
	padding-right: 20px;
}

/*hover/active styles*/
.breadcrumb a.active, .breadcrumb a:hover{
	background: #333;
	background: linear-gradient(#333, #000);
}
.breadcrumb a.active:after, .breadcrumb a:hover:after {
	background: #333;
	background: linear-gradient(135deg, #333, #000);
}

/*adding the arrows for the breadcrumbs using rotated pseudo elements*/
.breadcrumb a:after {
	content: '';
	position: absolute;
	top: 0; 
	right: -18px; /*half of square's length*/
	/*same dimension as the line-height of .breadcrumb a */
	width: 36px; 
	height: 36px;
	/*as you see the rotated square takes a larger height. which makes it tough to position it properly. So we are going to scale it down so that the diagonals become equal to the line-height of the link. We scale it to 70.7% because if square's: 
	length = 1; diagonal = (1^2 + 1^2)^0.5 = 1.414 (pythagoras theorem)
	if diagonal required = 1; length = 1/1.414 = 0.707*/
	transform: scale(0.707) rotate(45deg);
	/*we need to prevent the arrows from getting buried under the next link*/
	z-index: 1;
	/*background same as links but the gradient will be rotated to compensate with the transform applied*/
	background: #666;
	background: linear-gradient(135deg, #666, #333);
	/*stylish arrow design using box shadow*/
	box-shadow: 
		2px -2px 0 2px rgba(0, 0, 0, 0.4), 
		3px -3px 0 2px rgba(255, 255, 255, 0.1);
	/*
		5px - for rounded arrows and 
		50px - to prevent hover glitches on the border created using shadows*/
	border-radius: 0 5px 0 50px;
}
/*we dont need an arrow after the last link*/
.breadcrumb a:last-child:after {
	content: none;
}
/*we will use the :before element to show numbers*/
.breadcrumb a:before {
	content: counter(flag);
	counter-increment: flag;
	/*some styles now*/
	border-radius: 100%;
	width: 20px;
	height: 20px;
	line-height: 20px;
	margin: 8px 0;
	position: absolute;
	top: 0;
	left: 30px;
	background: #444;
	background: linear-gradient(#444, #222);
	font-weight: bold;
	text-align: center;
}

.portfolio{ width: 100%; float: left; margin-bottom: 40px; }



.flat a, .flat a:after {
	background: white;
	color: black;
	transition: all 0.5s;
}
.flat a:before {
	background: white;
	box-shadow: 0 0 0 1px #ccc;
}
.flat a:hover, .flat a.active, 
.flat a:hover:after, .flat a.active:after{
	background: #9EEB62;
}


.portfolio h2{ text-align: center; font-size: 28px;
	color: #212121;
	font-weight: 900;
	text-transform: uppercase;
	margin-bottom: 45px;
	letter-spacing: -0.4px; }


.about-text{color:#7a7a7a;padding:30px 40px 0 40px !important;text-align:justify;}
/* 3702 */ 
/* 3703 */ .about-text1 .col-sm-6{padding-left:0px!important;padding-right:0px!important;}
/* 3704 */ 
/* 3705 */ #home-advanced-search .property-gallery .col-sm-3{padding-left:0px!important;padding-right:0px!important;}
/* 3706 */ 
/* 3707 */ .blue{color:#3276b1;}
/* 3708 */ 
/* 3709 */ .current-sr-slide-visible{height:106%!important;}
/* 3710 */ 
/* 3711 */ .intro{font-size:14px;position:relative}
/* 3712 */ 
/* 3713 */ #sH6 .intro:before{background:#f5f5f5;content:'';position:absolute;left:0;top:-45px;overflow:visible;width:100%;height:67px;z-index:999;-webkit-transform:skewY(2deg);-moz-transform:skewY(2deg);-ms-transform:skewY(2deg);-o-transform:skewY(2deg);transform:skewY(2deg)}
/* 3714 */ 
/* 3715 */ #home-advanced-search .intro:before{background:#fff;content:'';position:absolute;left:0;top:-45px;overflow:visible;width:100%;height:69px;z-index:999;-webkit-transform:skewY(2deg);-moz-transform:skewY(2deg);-ms-transform:skewY(2deg);-o-transform:skewY(2deg);transform:skewY(2deg)}
/* 3716 */ 
/* 3717 */ #home-advanced-search .intro:after{background:none repeat scroll 0 0 #fff;bottom:-57px;content:"";height:70px;left:0;overflow:visible;position:absolute;transform:skewY(-3deg);width:100%;z-index:999;}
/* 3718 */ 
/* 3719 */ .float11{animation:2s ease-out 0s normal none infinite running floatBubble;position:relative;}
/* 3720 */ 
/* 3721 */ .arrow11{background:url("/wp-content/themes/ws-centre/images/down-arrow.png") no-repeat scroll 0 0/30px auto rgba(0, 0, 0, 0);display:block;height:30px;margin:auto;opacity:0.4;width:30px;}
/* 3722 */ 
/* 3723 */ .p_text{ margin:10px 0;
	color: #212121;
	font-weight: 900;
	text-transform: uppercase;
	margin-bottom: 45px;
	letter-spacing: -0.4px;}
/* 3724 */ 
/* 3725 */ .p_text1{color:#191818;font-family:"Dosis", sans-serif;font-size:40px;font-weight:300;padding:0;text-transform:capitalize!important;}
/* 3726 */ 
/* 3727 */ #index_services .intro:before{background:#fdfdff;content:'';position:absolute;left:0;top:-74px;overflow:visible;width:100%;height:45px;z-index:999;-webkit-transform:skewY(1deg);-moz-transform:skewY(1deg);-ms-transform:skewY(1deg);-o-transform:skewY(1deg);transform:skewY(1deg)}
/* 3728 */ 
/* 3729 */ #index-about .intro:after{background:none repeat scroll 0 0 #fff;bottom:-67px;content:"";height:35px;left:0;overflow:visible;position:absolute;transform:skewY(-1deg);width:100%;z-index:999;}
/* 3730 */ 
/* 3731 */ #index_services{background:url("/wp-content/themes/ws-centre/images/bg-process.jpg") no-repeat center top;color:#666666;clear:both;font-family:'Open Sans', sans-serif;margin-top:0;min-height:450px;padding-top:50px;display:inline-block;width:100%;font-size:12px;}
/* 3732 */ 
/* 3733 */ .call-to-action-achr{background:none repeat scroll 0 0 rgba(0, 0, 0, 0.25);color:inherit;display:block;height:100%;margin:0;padding:0;position:relative;transition:all 0.2s ease-out 0s;width:100%;}
/* 3734 */ 
/* 3735 */ .holder-bg{background:url(/wp-content/themes/ws-centre/images/bg_grid.png);height:100%;left:0;position:absolute;width:100%;}
/* 3736 */ 
/* 3737 */ .pattern-bg-branding{background-image:url("https://www.websolutioncentre.com/wp-content/uploads/2015/03/brand-bg-banner.jpg");background-position:left top;background-repeat:repeat;height:200%;position:relative;width:100%;padding-bottom:0px;}
/* 3738 */ 
/* 3739 */ .pattern-bg-branding p{text-align:left;color:#fff;}
/* 3740 */ 
/* 3741 */ .nav .open > a, .nav .open > a:hover, .nav .open > a:focus, .nav > li > a:hover, .nav > li > a:focus, .navbar-nav > li > a.active{background-color:transparent;color:#3276b1!important;}
/* 3742 */ 
/* 3743 */ .active-tab{text-decoration:none;color:#3276b1!important;}
/* 3744 */ 
/* 3745 */ #top-buttons1 li:hover{background:none !important;color:#3276b1!important;}
/* 3746 */ 
/* 3747 */ #top-buttons1 .active a, #top-buttons1 li a:hover, #top-buttons1 li a:focus{background:#416a82 !important; color:#fff !important;}
/* 3748 */ 
/* 3749 */ .bbrn h1{font-size:49px;font-weight:600;margin-bottom:8px;}
/* 3750 */ .center {
    float: none;
    text-align: center;
    margin: 0 auto;
}

.text-center {
    text-align: center;
}

.parallax {
    position: relative;
    text-align: center;
    padding: 0px 0 50px 0;
    background-position: center center;
}

.google-partner{position:absolute; z-index:9999; position: fixed;  right:0px; width:16%; top:-4px;}
.google-partner img{ max-width:100%; }

.client-login{position:absolute; z-index:9999; position: fixed;  right:0px; width:10%; top:95px;}
.client-login img{ max-width:100%; }

.android{position:absolute; z-index:9999; position: fixed;  left:0px; width:15%; top:80%;}
.android img{ max-width:100%; }

.main-services{ width:100%; margin: 30px 0; float: left; background: url("images/service_bg.jpg") no-repeat fixed; background-size: cover; padding: 40px 0; }

.social-list{ margin-right:7%; float: left; }
.advertise805x90-banner{width: 805px; height: 90px; margin:0 auto;}
.topPagepusherAdSec {
    width: 1000px;
    position: relative;
    z-index: 9999;
    margin: 3px auto 0;
}
.ds-none{
    display:none!important;
}
.our-quality {
	padding-top: 0px;
}
.quality-container {
	max-width: 1487px;
	margin: 0 auto;
}
.point-block h3 {
	font-size: 28px;
	color: #212121;
	font-weight: 900;
	text-transform: uppercase;
	margin-bottom: 45px;
	letter-spacing: -0.4px;
}
.pic {
	float: left;
	width: 33%;
	padding-left: 27px;
}
.point {
	float: left;
	width: 49%;
	padding:0 10px;
}
.quality {
	width: 67%;
	float: left;
	padding-left: 60px;
	padding-top: 46px;
}
.quality-container h2 {
	font-weight: 900;
}
.point-block {
	margin-top: 43px;
	margin-bottom:20px;
}
.point-block p {
	font-weight: 500;
	letter-spacing: 0.6px;
	padding-right: 46px;
	line-height: 1.5;
}
.point{
	width:100%;
	float:none;
}
.point .point-block{
	float:left;
	width:50%;
	padding:0 0 0 10px;
}

.badge-main{position:absolute; z-index:9999;  right:5px; width:16%; top:-4px;}
.pb-image{width:176px; height:64px !important;}

.newsletter-main{ width:100%; float: left; background: #006992; padding: 10px 0; }
.news-left{ float: left; }
.news-left h3{ font-size: 24px; color: #fff; padding: 10px 0; margin: 0px; }
.news-right{ float: right; width:75%; margin-left: 20px; margin-top: 8px; }
.news-right input{ width:35%; background: #fff; border: 0;  padding: 10px 5px; margin-right:10px; border-radius: 6px; }
.submit-newsletter{ width: 25% !important; background: #0095cf  !important; float: right !important; font-size: 20px;  padding: 6px 5px !important; color: #fff !important; }

.google-partner-badges{ }

.pageWrapper, .relative {
   /* position: fixed;*/
    padding: 0px;
    margin: 0px;
    z-index: 999999;
    left: 0;
    right: 0;
}

.pageContent{ position: relative; /*top: 140px; */}




@media screen and (max-width:1100px){

	.top-head .responsive-nav { margin-right:2%; }
}







@media screen and (max-width:768px){
	.f-share{display: none;}
	.whatsapp{z-index: 99999; right: 0; top: 80%; position: fixed; width: 170px;}
.about-container{max-width: 95%; margin:0 auto;}

.pageWrapper, .relative {
    position: static;
    padding: 0px;
    margin: 0px;
    z-index: 999999;
    left: 0;
    right: 0;
}

.pageContent{ position: static; top: 0px; }




	.navigation-menu{ display: none; }

.google-partner-badges{  display: none;}

.partner-image{ text-align: center; border-bottom: 1px solid #d2d2d2; padding-bottom: 30px; }
.partner-image img{ max-width:100% !important; }

.quality-container {
	width: 100%;
	margin: 0 auto;
}
.point-block h3 {
	font-size: 18px;
	color: #212121;
	font-weight: 900;
	text-transform: uppercase;
	margin-bottom: 45px;
	letter-spacing: -0.4px;
}
.pic {
	float: none;
	width: 100%;
	padding-left: 0px;
}

.pic img{ max-width:100%; }
.point {
	float: left;
	width: 100%;
	padding:0 10px;
}
.quality {
	width: 100%;
	float: left;
	padding-left: 0px;
	padding-top: 46px;
}

.point .point-block{
	float:none;
	width:100%;
	padding:0 0 0 0px;
	
}

.point-block p {
	font-weight: 500;
	letter-spacing: 0.6px;
	padding-right: 46px;
	line-height: 1.5;
	margin-bottom: 10px;
}

.google-partner{position:absolute; z-index:9999; position: fixed;  right:0px; width:30%; top:27%;}
.google-partner img{ max-width:100%; }

.client-login{position:absolute; z-index:9999; position: fixed;  right:0px; width:30%; top:39%;}
.client-login img{ max-width:100%; }



.web-design li{margin: 15px auto 10px;
padding: 6px 20px;
border: 1px solid #ccc;
list-style: none;

border-radius: 0.2em;
display: block;

bottom: 10%;
position: absolute;
left: 41%;}


.news-left{ float: none; }
.news-left h3{ font-size: 24px; color: #fff; padding: 10px 0; margin: 0px; }
.news-right{ float: none; width:100%; margin-left: 0px; margin-top: 10px; }
.news-right input{ width:100%; background: #fff; border: 0;  padding: 10px 5px; margin-right:0px; margin-top:5px; margin-bottom: 5px;}
.submit-newsletter{ width: 100% !important; background: #00b98b !important; float: none !important; font-size: 20px;  padding: 6px 5px !important; color: #fff !important; }
.portf-sec{width: 100%; float: left; padding: 10px; }

}





@media screen and (max-width:650px){

	.about-home-text{width: 90%; float:none; margin-top: 40px; margin:0 auto;}
.web-design li{margin: 15px auto 10px;
padding: 6px 20px;
border: 1px solid #ccc;
list-style: none;

border-radius: 0.2em;
display: block;

bottom: 10%;
position: absolute;
left: 36%;}

.portf-sec{width: 100%; float: left; padding: 10px; }



}



@media screen and (max-width:480px){
.about-home-text{width: 90%; float:none; margin-top: 40px; margin: 0 auto;}
	
.web-design li{margin: 15px auto 10px;
padding: 6px 20px;
border: 1px solid #ccc;
list-style: none;

border-radius: 0.2em;
display: block;

bottom: 10%;
position: absolute;
left: 36%;}

.portf-sec{width: 100%; float: left; padding: 10px; }



}

@media screen and (max-width:320px){
.about-home-text{width: 90%; float:none; margin-top: 40px; margin:0 auto;}
	
.web-design li{margin: 15px auto 10px;
padding: 6px 20px;
border: 1px solid #ccc;
list-style: none;

border-radius: 0.2em;
display: block;

bottom: 10%;
position: absolute;
left: 36%;}
.portf-sec{width: 100%; float: left; padding: 10px; }



}