body {
	font-family: 'Rubik', sans-serif;
	background: #efefef;
}
h1, h2, h3, h4 ,h5, span.title{
	font-family: 'Libre Baskerville', serif;
}

h1 {
	
	margin-top:10px;
}

h3 {
	color: #00a7ca;
	font-size: 1.3em;
}

span.darkblue {
	font-size: 1.2em;
	font-family: 'Libre Baskerville', serif;
	
}

span.blue {
	font-family: 'Libre Baskerville', serif;
	font-size: 1.2em;
	
	color: #00a7ca;
}

.blue.italic {
	font-style:italic;
	
}
a{
	
	color: #00a7ca;

}

h1 {
	font-size: 1.8em;
}

h2 {
	font-size: 1.6em;
}

span.title {
	font-size: 1.8em;
	display:block;
	margin-bottom: 15px;
}


span.ser {
	display:inline-block;
	width: 240px;
}
img {
	max-width:100%;
	height:auto;
}
.navbar {
	/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#010203+0,204170+100 */
	background: #010203; /* Old browsers */
	background: -moz-linear-gradient(left, #010203 0%, #204170 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(left, #010203 0%,#204170 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to right, #010203 0%,#204170 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#010203', endColorstr='#204170',GradientType=1 ); /* IE6-9 */
	border:0;
	border-radius: 0;
	margin-bottom: 0;
} 

header {
	background: #fff;
}

.dogmoon {
	position:absolute;
	width:296px;
	top:48px;
	right:0;
	z-index: 10
}


.contactbox {
	font-family: 'Libre Baskerville', serif;
	
	position:absolute;
	width:100%;
	top:5px;
	right:15px;
	text-align:right;
	z-index: 10;
	font-size: .9em;
}

.contactbox span {
	font-size: inherit !important
}

.navbar-default .navbar-nav>li>a {
    color: #fff;
	font-family: 'Libre Baskerville', serif;
	font-weight:400;
	
}

.navbar-nav>li span.active {
    color: #fff;
	font-family: 'Libre Baskerville', serif;
	font-weight:400;
	padding-top: 15px;
	    padding-bottom: 15px;
		line-height: 20px;
		display: block;
		padding: 15px;
		background: #00a7ca;
}

.navbar-default .navbar-nav>li>a:hover {
    color: #fff;
	background: #00a7ca;
	
}


.hero {
	height:342px;
	width:100%;
	background: #00a7ca;
}

.leadtext {
	font-family: 'Libre Baskerville', serif;
	
width:40%;
height:342px;
float: left;
color: #fff;
font-size: 2em;
padding-top:100px;
text-align: left;
padding-left: 4%;
}

.leadimage {
	
	width:60%;
background: url('../beach.jpg') center center;
height:342px;
float: right;
background-size: cover;

	
}

.serimage {
	
	width:60%;
background: url('../dogbear.png') center center;
height:342px;
float: right;
background-size: cover;

	
}


p.leadpara {
	color: #00a7ca;
	font-size: 1.2em;
}


.grid {
	margin-top:15px
}

.item {
	width:calc(25% - 15px);
	margin-right:15px;
	margin-bottom:15px;
	float:left;
	box-shadow: 0 0 10px rgba(0,0,0,.5);
	min-height: 270px;
	padding: 25px;
	
}

.item-width {
	width: 20%
}

.item.double {
	width:calc(50% - 15px);
}

.item.white {
	background: #fff;
	/*
	height:380px;
	*/
	padding:40px;
}

.item.double.white {
	min-height: 380px;
	
}

img.solo {
	margin-top: 3px;
}

p.social {
	font-size: 1.4em;
text-align:right;	
}

.white {
	background: #fff;
	margin-bottom: 15px;
	padding-top:20px;
}

.container.white {
	padding-bottom: 30px;
}

.white.box {
	background: #fff;
	height: auto;
	padding:25px;
	
}

.item.night {
	padding:40px;
	background: #050708 url('../why.png') center center;
	color: #fff;
	background-size: cover;
	min-height: 509px;
}

.night ul {
	margin-bottom: 30px;
}

.night li { 
	padding: 3px 0;
	font-size: 1.2em;
}

.item.blue {
	background:#242a3b;
	color: #fff
}

.item.services {
	padding:0;
}

.title.static {
	position:absolute;
}

.title.static.services {
	position:absolute;
	right:25px;
	top:25px;
}

.greybox {
	padding: 20px;
	background: #eee;
	margin-bottom: 20px;
}

.blackbox {
	padding: 20px;
	background: #000;
	color: #fff;
	margin-bottom: 20px;
	
}

footer h4 {
	color: #00a7ca
}

footer {
	font-size: .9em;
	padding: 20px 0;
	background: #fff;
}

.whitetext, a.whitetext {
	color: #fff;
}

footer ul {
	list-style:none;
	margin:0;
	padding:0;
}

.night ul {
	padding-left: 20px ;
	list-style: none;
}

blockquote {
	font-size: 22px;
}


.night li:before {    
font-family: 'FontAwesome';
content: '\f08a';
margin:0 5px 0 -15px;
}


@media screen and (max-width: 992px){
   
	.item, .item.double {
		width:100% !important
	}
   
	.dogmoon, .leadimage {
		display:none;
	}
   
   
	 .leadtext {
		
		width:100%;
		
	}
	
	.item.white {
		height:auto;
	min-height:380px;
}

span.ser {
	display:block;
    width: auto !important
}
   
.contactbox {
 
 position: relative;
 width:100%;
 text-align:center;  
   
}

header, .contactbox {
	text-align: center;
}
   
   
}