@import url('https://fonts.googleapis.com/css?family=BenchNine:300,400');
@font-face {font-family: Westmeath;   src: url('Westmeath.ttf') format('truetype'), url('Westmeath.otf') format('opentype');}
h1, h2, h3, h4, h5, h6{font-family: Westmeath, sans-serif; margin-bottom: 40px;}

html{background: #252a2c;}
body{font-family: 'BenchNine', sans-serif;}
/*#headerborder{border-bottom: 7px solid #508e91; margin: 0; padding: 0;}
#headercontainer{background: url(../images/slide1.jpg) no-repeat; background-size: 110%; filter: blur(2px) brightness(30%); height: 520px; position: relative; z-index: -2;}
#header-carousel{ position: relative; z-index: -1; margin-top: -520px;}*/

/* SLIDER */
#subpageheader{background:url(../images/slider/top.php) center; background-size: cover; height: 39vw; border-bottom: #558d8f 6px solid; display: flex;max-height: 400px;}
#subpageheader a{margin: auto; display:block}
#header-carousel{overflow:hidden;border-bottom:#558d8f 6px solid;}
.owl-item .item{position:relative;}
.owl-item .item .back{max-height:567px;margin-bottom:-21px}
.owl-item .item .back{position:relative;z-index:9998;background:#5ba1a6}
.owl-item .item .back img{position:relative;top:-20px;filter: brightness(25%);-webkit-filter: brightness(25%);-moz-filter: brightness(25%);-o-filter: brightness(25%);-ms-filter: brightness(25%);opacity:0.75;}
.owl-item .item .front{position:absolute;left:0;right:0;top:0;z-index:9999;}

nav{margin-top: -40px; z-index: 99; position: relative;}
nav .top-nav li a{font-size: 20px; letter-spacing: 1.5px;}
ul.social-icons li{display: inline-block; list-style-type: none;}
ul.social-icons li a {padding: 33px 14.5px;}
ul.social-icons li a:hover {padding: 33px 14.5px; opacity: 0.8;}
ul.social-icons span{display: none;}
#facebook {color: #ababab; background: url(facebook.png) center no-repeat; display: block;background-size: contain;}
#google-plus {color: #ababab; background: url(google-plus.png) center no-repeat; display: block; background-size: contain;}
#twitter {color: #ababab; background: url(twitter.png) center no-repeat; display: block; background-size: contain;}
#youtube {color: #ababab; background: url(youtube.png) center no-repeat; display: block; background-size: contain;}


#banners{width:100%; padding:50px 0; background:url(banner-background.png) #73babd no-repeat; background-size: cover;}
	#banners .margin div {padding:0 0.9em;}
	#banners .box {position:relative; height:255px; font-weight:300!important;background-size:cover!important; padding:0; border: 5px solid #fff;box-shadow: inset 0 -40px 28px rgba(0, 0, 0, 0.6);}
	#banners h2 {line-height:1.2em; font-size:1.25em; display:block; font-weight:normal; text-transform:uppercase;margin:0;position:relative;font-weight:300;font-family: 'BenchNine', sans-serif; font-size: 24px; letter-spacing: 1.5px;height:100%;overflow:hidden}
	#banners h2 a{position:absolute; padding:2px; margin: 8px; display:block;color:#fff;width:100%;right:0;text-align:right;bottom:0;padding-top:55%;padding-top:calc(55% + 10vh);}
	#banners h2 a::after{content:" >";}
	#banners .line div:nth-child(1) .box {background:url(../images/park-road-dental-team.jpg) center top no-repeat #fff}
	#banners .line div:nth-child(2) .box {background:url(../images/carterton-dental-services.jpg) center top no-repeat #fff}
	#banners .line div:nth-child(3) .box {background:url(../images/contact-park-road-dental.jpg) center top no-repeat #fff}

.main {text-align: center;}
	.homepage .main .box {margin:0; text-align:left;}
	.homepage .main article div:first-child {padding-right:2em}
	.homepage .main article div:last-child {margin-top:3em; padding-left:2em}
	.homepage .main .line {padding:40px 0 65px;}
	.main .line {padding:40px 0 65px;}
	.main p a,.main ul a{border-bottom: 1px solid #444; color: #444}
	.main h1{color: #485a5e; font-size: 50px;}
	.main h2{font-size: 44px;}
	.main h1 a, .main h2 a{text-decoration:none;}
	.main h1 a:hover, .main h2 a:hover{color:#000;}
	.main p{max-width: 1000px; margin: 0 auto 35px auto; font-size: 22px; letter-spacing: 1.5px;}
	.main ul{margin-bottom:16px; padding:0; list-style:none;list-style-position: inside;list-style-image:url(arrow-bg.png);}
	.main li{max-width: 1000px; margin: 0 auto; font-size: 22px; letter-spacing: 1.5px;padding-left:18px;}
	.main hr{margin:10px 0 21px}
	span.before{float: left; position: relative; max-width: 48%;}
	span.before::after{content: "Before"; position: absolute; bottom: 10px; z-index: 99; left: 10px; color: #fff;}
	span.after{float: right; position: relative; max-width: 48%;}
	span.after::after{content: "After"; position: absolute; bottom: 10px; z-index: 99; left: 10px; color: #fff;}
	.main .box{margin-top:15px}
	.team-subpage {float:right; max-width:35%; margin:0 0 20px 20px}
	#team-role{font-weight:bold; font-size:1.35em; color:#444}
	.team-profile h1{margin-bottom:8px!important; }
	.team-item {padding:0 0 10px 0; border-bottom:1px dotted #999; margin-top:10px}
	.team-item span{display:block;clear:both;font-size:0.65em}
	.team-item:last-of-type {padding:0 0 0 0; border-bottom:0}
	body.team h2{margin-top: 35px;}
	body.team h2 + img{margin:0 0 15px 0}
	body.team h2 a{border-bottom: 0;}
	.team h2 + img, .team img.team-subpage{width:25%; max-width:275px; border-radius:200px; min-width:245px; margin-top:-10px; margin-left:20px}
	
	.services .main .services-item.image span, .services .main .services-item p .button{display:none;}
	.services .main .services-item .button{margin:-20px auto 20px}
	
.strip{height:200px; background-attachment:fixed; background-repeat: no-repeat; background-color:#0b0b09; background-size:110% auto;}	
#strip1 .strip{background-position: center top; background-image:url(../images/slider/top.php); }
#strip2 .strip{background-position: center bottom; background-image:url(../images/slider/bottom.php); }
	
#footer {color:#ececec; font-weight:300; background:#252a2c; background-origin: border-box; background-size:100%;  background-attachment:fixed; } 
	#footer .line {padding:1.25em 0; background: #252a2c;}
	#footer a {color:#ececec; font-size: 20px;}
	#footer a:hover {color:#fff!important;}
	#footer ul {padding:0; text-align:right;}
	#footer li a {text-decoration:none; padding:0 9px; border-right:1px solid #ddd; line-height:1em }
	#footer li {list-style:none; display:inline-block; }
	#footer li:last-child a{border:none; padding-right:0}
	#wwd {padding-right:25px; background:url(wwd.png) right center no-repeat; display:block; float:right; margin-top:30px; text-transform: lowercase; color: #d3d3d3;}

/* FORMS */
#sck-form {padding:0.5em 0; }
#sck-form p{margin:0 auto; }
#sck-form label{display:block; padding:0 }
#sck-form input.field{width:200px; padding:0.45em; margin-bottom:5px;}
#sck-form textarea.field{max-width:700px;min-width:300px;height:150px;width:50%;}
#sck-form img {display:inline-block; margin-bottom:-0.225em; }
#sck-form .solve {display:inline-block; margin:0.45em 0; min-width:320px}
#sck-form .solve span {-webkit-transform:rotateY(180deg);  -moz-transform:rotateY(180deg);  -o-transform:rotateY(180deg); -ms-transform:rotateY(180deg);  unicode-bidi:bidi-override;  direction:rtl;}
#formCopy {width:auto!important; margin-top:15px;} 

/* TESTIMONIALS */
#testimonials{background:#fff;padding: 5em;}
#testimonials h3{color:#595959;text-align:center;font-size:2.2em}
#testimonial-ajax{padding-left:4em;background:url(66.png) left top no-repeat}
#testimonials article{padding-right:4em;background:url(99.png) right bottom no-repeat;}
#testimonials p{font-size:22px;color:#595959;letter-spacing: 1.5px;}

/* STYLES */
.clear {width:100%; height:0; margin:0; padding:0; clear:both; overflow:hidden;}
.back::after {content:""!important;}
.back::before {content:"< "!important;}
.big-button {display:inline-block; color:#6b6b6b!important; padding:10px 31px; border:0; border: 1px solid #6c6c6c; text-transform:uppercase; text-decoration:none!important; font-size:18px; font-weight:300 }
.big-button:hover {background: rgba(255,255,255,0.4); cursor:pointer; }
.big-button::after {content:" >"}
.floatleft{float:left; margin:0 10px 15px 0;}
.floatright{float:right; margin:0 0 10px 15px;}
.photoleft{float:left; margin:0 28px 22px 0; height:auto; max-width:50%;}
.photoright{float:right; margin:0 0 22px 28px; height:auto; max-width:50%;}
.thirds {float:left; width:calc(33.3% - 20px); margin:0 0 20px 0; }
.thirds:nth-of-type(3n+2){margin:0 20px;}

@media screen and (min-width:960px) and (max-width:1140px){
	.top-nav li {margin-left:0.6em}
	.top-nav li a {padding-left:0.35em; padding-right:0.35em; font-size:0.9em}
	.top-nav li a:hover {padding-left:0.35em; padding-right:0.35em;}	
}

@media screen and (max-width:960px) {
	.top-nav li {margin-left:0.7em}
	.top-nav li a {padding-left:0.25em; padding-right:0.25em;  font-size:0.7em}
	/*.top-nav li a:hover {padding:0 0.25em 0.7em 0.25em; }*/
}
@media screen and (min-width:769px) and (max-width:960px) {
	nav .top-nav li a{font-size: 18px; letter-spacing: 1.25px;}
	ul.social-icons li a{padding:29px 11px}
	ul.social-icons li a:hover{padding:29px 11px}
}

@media screen and (max-width: 768px) {
	#testimonials{padding: 5em 2em;}
	span.before,span.after{float:none;clear:both;margin:20px auto;}
	.main .line {padding:10px 0;}
	.main article {padding:0 20px;}
	#header {margin-left:0}
	.right {float:none;	}
	#banners .box {height: 355px; margin-bottom:20px}
	#nav {position:relative; bottom:auto; right:auto;}
	.top-nav ul {float:none; margin:0}
	.top-nav li {margin:0}
	.top-nav li a {padding:0.6em 0; text-align:center; font-size:1.2em}
	.top-nav li a:hover  {padding:0.6em 0!important; border-bottom:0}
	.thirds {width:100%; margin:0 0 10px 0}
	.thirds:nth-of-type(3n+2){margin:0;}
	#footer ul {text-align:center; margin-top:20px}
	#footer li:first-of-type a{padding-left:0}
	#wwd {left:0; right:0; margin:30px auto; display:block; float:none; width:145px; margin:20px auto}
	#footer p {text-align:center; margin-bottom:15px}
	.top-nav ul li:last-child{margin-bottom: 10px;}
	.team img.floatright, .team img.team-subpage{width:35%; max-width:400px; border-radius:200px; min-width:245px;float:none;margin:10px auto 20px;display:block;}
	#sck-form .button.floatright {float:none;margin:20px auto 35px auto;}
}
@media screen and (max-width: 480px) {
	#testimonials{padding: 5em 1em;}
	#banners .box {height: 255px; margin-bottom:20px}
}