@import url(https://fonts.googleapis.com/css?family=Lato:300,400,700);

/* ----- GLOBAL STYLES (TAGS) ----- */
body { background-color: #fff; font-family: 'Lato' !important;}
a { color: inherit; cursor: pointer;}
p { hyphens: none; font-size: 17px; line-height: 1.5;}
h1,h2,h3,h4,h5,h6 { font-family: 'Lato' !important;}


/* ----- GLOBAL STYLES (INPUTS) ----- */
input[type='text'],
input[type='tel'],
input[type='email'],
input[type='url'],
input[type='password'],
input[type='search'] {
	font-family: 'Lato';
	font-weight: 300;
}
input[type='text']:focus,
input[type='tel']:focus,
input[type='email']:focus,
input[type='url']:focus,
input[type='password']:focus,
input[type='search']:focus {
	border-color: #ed499b;
}

input[type="button"],
input[type="reset"],
input[type="submit"] {
	font-weight: 300;
	font-family: 'Lato';
	color: #fff;
	background-color: #777;
	border: 0px;
	padding: 10px 30px;
}
input[type="button"]:hover,
input[type="reset"]:hover,
input[type="submit"]:hover {
	background-color: #ed499b; color: #fff;
}


/* ----- COLOURS ----- */
.oliveText {color: #394829; }
.oliveBg {background-color: #394829;}
.pinkText {color: #ed499b; }
.pinkBg {background-color: #ed499b;}


/* ----- GLOBAL STYLES (CLASSES) ----- */
#page {width: 94%;max-width: 1100px;padding: 130px 0px 0px;}
.site-main { margin-right: 0px !important; }
.pageTitle { margin-top: 0px; margin-bottom: 45px !important; font-size: 35px; font-weight: 300;}

/* ----- GRIDS ----- */
.row { width: 100%; vertical-align: top; height: auto; overflow: hidden;}
.row > div {
	float: left;
	background-color: transparent;
	display: inline-block;
	padding: 0px 10px;
	vertical-align: top;
	min-height: 1px;
}
.row .grid100 { width: 100%; }
.row .grid90 {width: 90%;}
.row .grid80 {width: 80%;}
.row .grid75 {width: 75%;}
.row .grid70 {width: 70%;}
.row .grid60 {width: 60%;}
.row .grid50 {width: 50%;}
.row .grid40 {width: 40%;}
.row .grid33 {width: 33%;}
.row .grid30 {width: 30%;}
.row .grid25 {width: 25%;}
.row .grid20 {width: 20%;}
.row .grid15 {width: 15%;}
.row .grid10 {width: 10%;}


/* ----- SITE MENU ----- */
#masthead {
	border: 0px;
	padding: 50px 0px 0px;
	position: fixed;
	background-color: #fff;
	width: 100%;
	top: 0px;
	left: 0px;
	z-index: 50;
}
#masthead .container {
	width: 94%;max-width: 1100px;padding: 0px; margin: 0 auto; border-bottom: 1px solid #eee;
	padding-bottom: 15px;
}
#masthead .site-branding {float: left; margin: 0px; max-width: 300px;}
#site-navigation { border: 0px; padding: 0px 0px; margin: 0px; overflow: hidden;}
#site-navigation .menu-primary-container { width: auto; overflow: hidden; }
#site-navigation #primary-menu { float: right; width: auto; }


/* ----- MAIN MENU ----- */
.main-navigation a, .main-navigation a:visited {
	font-weight: 300;
	font-size: 15px;
	padding: 11px 15px 0px !important;
	text-transform: lowercase;
	color: #425031;
}
.main-navigation li:last-child a {padding-right: 0px !important; }
.main-navigation li:hover a {color: #ed499b; }
.main-navigation .current-menu-item a {color: #ed499b !important; }


/* ----- FOOTER ----- */
#footer { width: 100%; margin-bottom: 30px; overflow: hidden;}
#footer .danielharrison { display: inline-block; margin-top: 5px;}
#footer .danielharrison span { margin: 0px 10px; display: inline-block;}
#footer .social { float: right; }
#footer .social .icon {
	height: 40px;
	width: 40px;
	background-color: #777;
	border-radius: 50%;
	display: inline-block;
	margin-left: 6px;
}
#footer .social .icon:hover { background-color: #ed499b;}
#footer .social .icon .fa {
	width: 40px;
	margin-top:11px;
	text-align: center;
	font-size: 20px;
	color: #fff;
}


/* ----- PAGE CLASSES ----- */
.contactDetails .fa { font-size: 30px; vertical-align: top; width: 50px; }
.contactDetails .address { display: inline-block; }
.page-id-19 input[type='text'],
.page-id-19 input[type='email'],
.page-id-19 input[type='tel'] { width: 100%; }


/* ----- HOME PAGE SLIDER FIX ----- */
.sp-buttons {
	position: absolute;
	left: 0px;
	bottom: 0px;
}
.sp-button {
	width: 12px !important;
	height: 12px !important;
	border: 0px;
	background-color: rgba(255,255,255,0.5);
}
.sp-button:hover {background-color: rgba(255,255,255,1);}
.sp-selected-button {background-color: #ed499b !important;}
.wprls_slider_effect1 { box-shadow: none; }
img.sp-image { margin-left: 0px !important; margin-right: 0px !important; }


/* about page */
.aboutPage { display: table; width: 100%; }
.aboutPage p { hyphens: none; text-align: justify; }
.aboutPage .columnLeft { display: table-cell; width: 200px; text-align: left;}
.aboutPage .columnLeft img { width: 100%; max-width: 195px; height: auto; }
.aboutPage .columnRight { display: table-cell; padding: 7px 0px 0px 30px; vertical-align: top;}
.aboutPage .button {
	margin: 10px 0px 0px;
	padding: 13px 5px;
	font-size: 16px;
	background-color: #777;
	color: #fff;
	border-radius: 3px;
	display: block;
	text-align: center;
	width: 100%;
	line-height: 1;
	display: none;
}
.aboutPage .button:hover {background-color: #ed499b; }
.aboutPage .HIA {
	text-align: center;
}
.aboutPage .HIA img { margin: 0px; height: 230px; width: auto;  margin: 0px 20px;}


/* about page */
.testimonialsPage { display: table; width: 100%; margin-bottom: 30px;}
.testimonialsPage p { hyphens: none; text-align: justify; font-size: 17px; line-height: 1.5;}
.testimonialsPage .columnLeft { display: table-cell; text-align: left; hyphens: none; white-space: nowrap; width: 250px;}
.testimonialsPage .columnRight { display: table-cell; padding: 0px 0px 0px 20px; vertical-align: top;}
.testimonialsPage .button {
	margin: 20px 0px 0px;
	padding: 10px 16px;
	font-size: 14px;
	background-color: #777;
	color: #fff;
	border-radius: 3px;
	display: block;
	text-align: center;
	line-height: 1;
	width: auto;
	float: left;
}
.testimonialsPage .button:hover {background-color: #ed499b; }

#primary.projects { display: table; margin-bottom: 30px;}
#primary.projects #projectsLeft {
	width: 160px;
	display: table-cell;
	padding-right: 30px;
	border-right: 1px solid #ccc;
	padding-top: 0px;
	vertical-align: top;
}
#primary.projects #projectsLeft h1 { display: none;}
#primary.projects #projectsLeft h2 { margin: 0px 0px 15px; text-align: left; font-weight: 200; font-size: 18px;}
#primary.projects #projectsLeft #nav_menu-2 { padding: 0px; margin: 0px; border: 0px; }
#primary.projects #projectsLeft #menu-projects-menu li { padding: 0px; border: 0px;}
#primary.projects #projectsLeft #menu-projects-menu li a {
	width: 100%;
	padding: 5px 0px;
	font-size: 14px;
	color: #425031;
}
#primary.projects #projectsLeft #menu-projects-menu li a:hover { color: #ed499b; }
#primary.projects #projectsLeft #menu-projects-menu li.current-menu-item a { color: #ed499b; }
#primary.projects #main { display: table-cell; padding-left: 30px; vertical-align: top;}
#primary.projects #main h1 {
	font-size: 22px;
	margin-top: 0px;
	margin-bottom: 8px;
}
#primary.projects #main p { padding: 0px; margin: 0px; }
#primary.projects #main p:first-child {
	font-size: 16px;
	line-height: 1.5;
	text-align: justify;
	padding-bottom: 15px;
	margin-bottom: 15px;
	border-bottom: 1px solid #eee;
}
#primary.projects #main #projectGallery img {
	width: 25%;
	padding: 2px;
	margin: 0px;
	cursor: pointer;
	border: 3px solid #fff;
}
#primary.projects #main #projectGallery img:hover { background-color: #ed499b;}


#colorbox, #cboxOverlay, #cboxWrapper{ position:absolute; top:0; left:0; z-index:9999; overflow:hidden;}
#cboxWrapper {max-width:none;}
#cboxOverlay{position:fixed; width:100%; height:100%;}
#cboxMiddleLeft, #cboxBottomLeft{clear:left;}
#cboxContent{position:relative;}
#cboxLoadedContent{overflow:auto; -webkit-overflow-scrolling: touch;}
#cboxTitle{margin:0;}
#cboxLoadingOverlay, #cboxLoadingGraphic{position:absolute; top:0; left:0; width:100%; height:100%;}
#cboxPrevious, #cboxNext, #cboxClose, #cboxSlideshow{cursor:pointer;}
.cboxPhoto{float:left; margin:auto; border:0; display:block; max-width:none; -ms-interpolation-mode:bicubic;}
.cboxIframe{width:100%; height:100%; display:block; border:0; padding:0; margin:0;}
#colorbox, #cboxContent, #cboxLoadedContent{box-sizing:content-box; -moz-box-sizing:content-box; -webkit-box-sizing:content-box;}

/*
    User Style:
    Change the following styles to modify the appearance of Colorbox.  They are
    ordered & tabbed in a way that represents the nesting of the generated HTML.
*/
#cboxOverlay{background:#000; opacity: 0.05; filter: alpha(opacity = 5);}
#colorbox{outline:0;}
#cboxContent{margin-top:32px; overflow:visible; background:transparent;}
.cboxIframe{background:#fff;}
#cboxError{padding:50px; border:1px solid #ccc;}
#cboxLoadedContent{background:transparent; padding:1px;}
#cboxLoadingGraphic{background:url(images/loading.gif) no-repeat center center;}
#cboxLoadingOverlay{background:transparent;}
#cboxTitle{position:absolute; top:-22px; left:0; color:#000;}
#cboxCurrent{position:absolute; top:-22px; right:205px; text-indent:-9999px;}

/* these elements are buttons, and may need to have additional styles reset to avoid unwanted base styles */
#cboxPrevious, #cboxNext, #cboxSlideshow, #cboxClose {border:0; padding:0; margin:0; overflow:visible; text-indent:-9999px; width:20px; height:20px; position:absolute; top:-20px; background:url(images/controls.png) no-repeat 0 0;}

/* avoid outlines on :active (mouseclick), but preserve outlines on :focus (tabbed navigating) */
#cboxPrevious:active, #cboxNext:active, #cboxSlideshow:active, #cboxClose:active {outline:0;}

#cboxPrevious{
	background: none;
	color: rgb(255, 255, 255);
	font-size: 50px;
	text-indent: 0px !important;
	width: auto;
	height: auto;
	left: 0px;
	top: 45%;
	text-shadow: 1px 1px #000;
}
#cboxNext{
	background: none;
	color: rgb(255, 255, 255);
	font-size: 50px;
	text-indent: 0px !important;
	width: auto;
	height: auto;
	right: 0px;
	top: 45%;
	text-shadow: 1px 1px #000;
}
#cboxClose{background-position:-50px 0px; right:0;}
#cboxClose:hover{background-position:-50px -25px;}
.cboxSlideshow_on #cboxPrevious, .cboxSlideshow_off #cboxPrevious{right:66px;}
.cboxSlideshow_on #cboxSlideshow{background-position:-75px -25px; right:44px;}
.cboxSlideshow_on #cboxSlideshow:hover{background-position:-100px -25px;}
.cboxSlideshow_off #cboxSlideshow{background-position:-100px 0px; right:44px;}
.cboxSlideshow_off #cboxSlideshow:hover{background-position:-75px -25px;}