{"darken":"509737","lighten":"83c96b","complementary":"9d46bb","gradient":"background-color: #64BB46;filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#64BB46', endColorstr='#509737');background-image: -webkit-linear-gradient(top, #64BB46, #509737);background-image: linear-gradient(to bottom, #64BB46, #509737);","isLight":true,"isDark":false}
@import url('http://fonts.googleapis.com/css?family=Poiret+One|Lato|Open+Sans:400,300,600'); 
@import url(http://fonts.googleapis.com/css?family=Open+Sans:300italic,400italic,700italic,300,400,700);

/* MOVE ME */

.mc-field-group, #mce-responses {
color:black;
}

img.photo
{
max-width:100%;
box-shadow: 2px 2px 5px #888888;
}

.fb-page{position:relative;top:50px;}

body#construction
{
background:white;
}

img#aboutphoto {
margin:auto !important;
padding:0;
float:none;
width:100%;
text-align:center;
}

img.point {
height:1em;
}

.bx-wrapper {
padding:0 !important;
}

.bx-viewport {
position:static !important;
}

.bx-controls {
position:relative !important;
top:10px !important;
}

/***************************
****************************
Setup
****************************
***************************/

/* Page Setup & Wrapper */ body {
font-family: Andada, serif;
font-weight:100;
margin:0;
padding:0;
height:100%;
width:100%;
box-sizing:border-box;
min-width:300px;
font-size:100%; 
font-size:;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  background:#333333;


color: #333333;
}

/* General Usage */
.center {text-align:center;}
.clear {clear:both;}

/* Highlight Color */
::-moz-selection { background: #83c96b; }
::selection { background: #83c96b; }

/*************************
******** Typography ******
**************************/


/*** H1+ Tags ***/ h1, h2, h3, h4, header, footer {

color: black;
}

header, #copyright, #credit {
font-size:.7em;
}


#bodywrap {
width:100%;
margin:auto;
}

/*** Links ***/ a:link, a:visited {
color: #64BB46;
}

/*** Hover Links ***/ a:hover, a:focus, a:active {
color: #83c96b; 

}

/*** Transitions ***/ a:link, a:visited a:hover, a:focus, a:active, input.button, a.button, #nav:target, #nonav:target, footer img.social, footer img.social:hover, ul.beforeafter li.after, ul.beforeafter:hover li.before {
transition: ease;
  -webkit-transition: all 0.5s ease;
          transition: all 0.5s ease;
}

ul {
list-style-type:circle;
}

/***************************
****************************
Header Section
****************************
***************************/

/*** The very top bar that contains social info etc ***/ #top-bar {
color:white;
background:#64BB46;
box-sizing:border-box;
font-size:1.3em;
height:60px;
padding:15px;
border-top: 3px #64BB46 solid;

}

/*** Space out the info in top bar by adding margin to the icons ***/ #top-bar img.icon {
margin: 0 5px 0 30px; 
height:1em;
margin-right:3px;}

img.icon {
vertical-align:middle;
}

/*** Make sure the links are visible in the top bar ***/ #top-bar a {color:white;}

.headwrap {
background: white;
}

header {

box-sizing:border-box;
padding:0;
min-height:100px;
position:relative;
z-index:5;
}

/*** Size & position the social icons in top bar */
#top-bar img.social {
width:30px;
margin:0 5px 10px 5px;
top:0;
}

#top-bar .social {
float:right;
padding-bottom:50px;
}

img#logo {
width:100%;
position:relative;
max-width:700px;
display:block;
margin:auto;
}

img#logo {
top:5px;
}



/* Pad the main section of header */
header .main-head {
padding: 0 75px;
}


#top-right {
min-width:320px;
box-sizing:border-box;
padding:10px 75px 0 0;
color:white;
top:0;
position:absolute;
right:0;
font-size:1em;
text-align:right;
width:40%
}

#top-right a:hover {color: black;}



/* Slideshow */
img.slide {

width:100%;
/*height:100%;*/
margin:0;
padding:0;
border:0;
z-index:2;
}

/* Content Sections */

.dark, .color, .light, .photobg {
width:100%;
margin:0;
min-height:300px;
box-sizing:border-box;
padding:25px;
text-align:center;
/* height:100vh; */

}

.color h2, .dark h1, .dark h2, .dark h3 {
color:white;
}

.dark {
background:#aeabab;

}

.color {
background: #64BB46;
}


.bubble {
background:rgba(255, 255, 255, .8);
padding:15px 6px;
border-radius:25px;
}

#testimonials p {

box-sizing:border-box;

max-height:4em;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
}

.bubble .bx-wrapper{
padding:0 !important;
margin:0 !important;
max-height:7.5em !important;
}

#testimonials span {
color: #FFAB02;
font-size:1.1em;
font-weight:bold;
display:block;
margin:1em 0;
}
.light {
background:radial-gradient(#ffffff, #f5f5f5);

}

.photobg {
padding:0;
}


/**************************************
*********** Navigation ***************
**************************************/

/* Hide Mobile Menu Button */ .mob-only { display:none;}

#nav
{
width:100%;
height:auto;
font-size:.68em;
font-weight:bold;
text-decoration:none;
background: black;
position:relative;
bottom:200px;
background-image: url('images/navbar_bg.png');
background-repeat: repeat-x;


background-color:transparent;
z-index:10;
}

#nav {
position:static;
}

/* Navigation Links */ nav a:link, nav a:visited {
color:white;
text-decoration:none;
text-transform: capitalize;
}

/* Set height for all navigation buttons */ #nav, ul.nav li, li.button a, li.cur_button a, li:hover ul.dropdown li a, li.drop-button {
height:42px;
}

ul.nav {
    list-style-type: none;
    padding: 0;
  max-width:1280px;
margin: auto;
    box-sizing:border-box;
z-index:3;
}

/*** Style navigation buttons */ ul.nav li {
    float: left;
    display:table-cell;
    border-left: 0 #343434 solid;
    z-index:5;
    width:20%;
     box-sizing: border-box;
text-align:center;
     font-size:2.1em;
}

/* Button Links */ li.button a, li.cur_button a, li.button a:visited {
border: 1px transparent solid;
display:block;
width:100%;
box-sizing:border-box;
    padding:13px 2px;
         box-sizing: border-box;
  color:white;
text-decoration:none;
}

/* Hover Decoration */ li.button a:hover, li:hover ul.dropdown li a:hover {
color: #3D2B21 ;
background:white;
background:#64BB46;
border: 1px #3D2B21 solid;
}


/* NAV BACKGROUND Hover Decoration */ li.button a:hover, li:hover ul.dropdown li a:hover {
background: transparent;
border-color:transparent;
color:#83c96b;
}

#nav
{
height:57px;
height:50px;
position:relative;
bottom:190px !important;

}

ul.nav a{
position:relative;
top:5px;
}





/* Highlight The Current Page */ /* .nav li.cur_button {
      background: -webkit-linear-gradient(to bottom, #000000 0%, #232323 9%, #121212 35%, #323232 80%, #000000 100%); /* For Safari 5.1 to 6.0 */
    background: linear-gradient(to bottom, #000000 0%, #232323 9%, #121212 35%, #323232 80%, #000000 100%); /* Standard syntax */
     box-sizing: border-box;
} */

/* Hide Dropdown */ ul.dropdown {
display:none;
visibility:hidden;
  left: 0;
  padding:0;
}

/* Show Dropdown */ li:hover ul.dropdown {
    list-style-type: none;
position:relative;
display:block;
background: #3D2B21 ;
height:100%;
 padding:0;
 margin:0;
 width:100%;
}

/* Style Dropdown Buttons */ li:hover ul.dropdown li  {
width:100%;
margin:0;
padding:0;
}


li:hover ul.dropdown li a {
height:100%;
visibility:visible;
position:absolute;
padding:10px;
    z-index:5;
width:100%;
margin:0;
border:0;
box-sizing:border-box;
z-index:20;
background: #3D2B21 ;
text-align:left;
     font-size:.8em;
     color:white;
}



.drop-button {
display:table-cell;
}


/***************************
****************************
Content Section
****************************
***************************/

img.fullwidth {
width:100%;
margin:0;
padding:0;
border:0;
}

#bodywrap {
max-width:1350px;
overflow:hidden;
}

.content-area {
width:100%;
margin:auto;
box-sizing:border-box;
padding:40px 140px 100px 140px;
padding:40px 5% 100px 5%;
background: radial-gradient(#ffffff, #f5f5f5);
overflow:hidden;
float:left;
}



.column.left, .column.right {
float:left;
width:50%;
margin:0;
padding:20px;
box-sizing:border-box;
}

.right {
float:right;
text-align:center;
margin:0;
width:400px;
overflow:hidden;
padding:0 20px;
box-sizing:border-box;
}

#fb-column {
padding-left:150px;
}

.fb-root {
width:100%;
padding:0;
}
.right p {
padding:25px;
margin:0;
}

.right img {
width:60px;
display:block;
margin:auto;
}

ul.columns li.column img {
width:55px;
}

/*
ul.columns {
  float: left;
  margin: 0;
  padding: 0;
  list-style: none;

}



ul.columns li {
  float: left;
  margin: 0;
  padding: 0;

}
*/

ul.columns {
display:table;
width:100%;
margin:0;
padding:0;
border-collapse: separate;
  border-spacing: 20px;
table-layout: fixed;
position:relative;
overflow:hidden;
}

ul.columns li {
display:table-cell;
/* background:white; */
/* min-width:400px;
width:400px; */

}

.captioned {
position:relative;
padding:0;
margin:0;
}

ul.columns li .captioned {
height:auto;
width:100%;
}

ul.beforeafter {
list-style-type:none;
padding:0;
}
ul.beforeafter li.before img {
opacity:.9;
}
ul.beforeafter li.after, ul.beforeafter:hover li.before {
display:none;

}

ul.beforeafter:hover li.after {
display:block;
}

.captioned img {
height:auto;
width:100%;
border:0;
padding:0;
margin:0;
position:absolute;
position:relative;
bottom:0;
}

.captioned h3, .captioned h2, .captioned span {
background:black;
background: rgba(0, 0, 0, 0.5); 
padding:10px;
margin:0;
width:100%;
box-sizing:border-box;
display:block;
color:white;
position:absolute;
bottom:4px;
}

ul.columns li p, ul.columns li a {
margin:25px;
}

/*
ul.columns li p {
line-height:1em;
height:3em;
overflow: hidden;
}
*/


 img#aboutlogo {width:100%; max-width:350px; display:block; margin:auto; text-align:center;} 

img.map {
height:17em;
width:auto;
float:right;
margin: 35px 0;
}

#testimonials {
background:white;
background:url('images/photo.jpg');
background-size:100%;
background-repeat:no-repeat;
}

/*
#testimonials .column.right, #testimonials .column.left {
background:white;
 background: rgba(255, 255, 255, 0.6);
height:auto;

margin:0;
margin: 10px;
box-sizing:border-box !important;
width:500px;

}*/



.overlay {
background: white;
 background: rgba(255, 255, 255, 0.6);  
height:100%;
min-height:300px;
}

/***************************
****************************
Full-screen content boxes
****************************
***************************/

.full-screen
{
width:100%;
height:100%;

}


/***************************
****************************
Contact & Signup Forms
****************************
***************************/

form#santoroform, table#santoroform {
width:100%;
}

.textfield, #message {
border-radius:4px;
padding:10px;
margin: 10px 0;
width:100%;
background:#fff;
border: 1px solid #dfdfef;
box-sizing:border-box;
}


input.button, a.button {
border:none;
outline:none; /* ^ remove default browser styles */
background:#64BB46;
border:1px #509737 solid !important;
text-transform:uppercase;
min-width:120px;
box-sizing:border-box;
padding:7px 25px;
color:white;
font-size:1em;
font-weight:bold;
border-radius:3px;
cursor:pointer;
text-decoration:none;
display:inline-block;
}






label {
color:black;
}

.signup {
background:#ededed; 
clear:left;
border-radius:10px;
padding:25px;
}

/*
input.button, a.button action {
background:#64BB46 !important;
border:1px #509737 solid !important;
text-transform:uppercase;
min-width:120px;
box-sizing:border-box;
padding:7px 25px;
color:white;
font-size:1em;
font-weight:bold;
border-radius:3px;
cursor:pointer;
text-decoration:none;
}

a.button, a.button:hover {
background:transparent;
color:#64BB46;
}

*/

input.button:hover, a.button:hover {
background:#83c96b;
}





p.mission {
font-size:1.2em;
font-weight:bold;
text-align:center;
}


/***************************
****************************
Footer Section
****************************
***************************/

footer {
background: #24272a;
width:100%;
box-sizing:border-box;
display:table;
overflow:hidden;
}

footer, footer h1, footer h2, footer h3, footer h4 {
color: #bcbcbc;
}

footer a, footer a.current, footer .column a {
color: #686b6F;
text-decoration:none;
}

footer a:hover {
color: #83c96b;
}

footer .bar {
color: white;
}

footer .column {
float:left;
line-height:190%;
box-sizing:border-box;
width:33%;
margin:50px 0;
padding: 0 75px;
}


.column#foot-r { padding-left:0; }
.column#foot-l {padding-right:0;}
footer {font-size: .9em;}
.column#foot-m {padding-right:5px;}

/* footer h4 {text-align:center;} */
*/

footer #social {
background:radial-gradient(#ffffff, #e0e9ef);
margin: auto;
border-radius:20px;
position:relative;
padding: 10px 0;
text-align:center;
box-sizing:border-box;
}


footer img.social {
padding:5px;
          box-sizing:border-box;
          width:25%;
          min-width:50px;
          margin:auto;
}

footer img.social:hover {
                                    -webkit-filter: brightness(120%)  contrast(115%);
          text-decoration:none;
            -webkit-transform: rotate(360deg);
      -ms-transform: rotate(360deg);
          transform: rotate(360deg);
}

footer .bar a:link, .bar a:visited {
color:white;
}

footer .bar a:hover {
color: #3D2B21 ;
}

footer .bar {
background: #64BB46;
position:relative;
padding:1em 60px 1em 60px;
box-sizing:border-box;
margin:0;
height:3em;
font-size:1.1em;
}

.clear {
clear:both;
}

footer span {
position:relative;
box-sizing:border-box;
margin:0;
}

span#copyright {
float:left;
}


span#credit {
float:right;
}

.calltoaction {
width:100%;
max-width:500px;
margin:auto;
padding:25px;
box-sizing:border-box;
}

.calltoaction a.button {
background:#FFAB02;
border: 1px solid black; /* Not without important */
}

.calltoaction a:hover {
background:black;
}


.banner img.slide {
/* max-height:475px; */
}

/***************************
****************************
Construction Page
****************************
***************************/

body#construction {
width:100%;
text-align:center;
color:#555555;

font-size:1.2em;
}

/* Remove Padding */
body#construction, body#construction #bodywrap, body#construction .content-area {
padding:0;
margin:0 auto;
width:100%;

background:white;
}

body#construction #bodywrap {
min-height:100%;
background:white;
max-width: 800px;
}


body#construction .content-area {
padding: 160px 0 0 0;
/* max-width:500px; */
margin:auto;
}

body#construction img#logo {
min-width:240px;
width:50%;
margin:auto;
max-width:100%;
}

body#construction img#photo {
min-width:0;
}

ul.services {
list-style-type:none;
padding:0;
margin:0;
}



ul.services li .captioned {
width:50%;
/*height:200px; */
float:left;
margin: 0 15px 15px 0;
}

ul.services li p {
}

ul.services li ul {
position:relative;
left:15px;
}

footer .icon {
height:15px;
height:1em;
}

.mob-only {
display:none;
}

.desk-only {
display:block;
}
/* Stop Facebook widget going off the page */ .fb-page{ margin-bottom:50px; }

/* Mobile / Media Queries */

@media screen and (max-width:985px) {
img.checkatrade {
display:none;
}
}

@media screen and (max-width:900px) {
#nav {font-size:.5em;}



#nav ul#nav li.button a {padding:0;}
}




@media screen and (max-width:768px) {
.content-area {
padding-right:20px;
padding-left:20px;
padding: initial 100px;
box-sizing:border-box;
margin:0 auto;
}

.right {
width:100%;
margin:auto;
display:none !important;
}

.right#fb-column {
display:block !important;
padding:0;
margin:0;
}

#fb-root {
margin:auto !important;
margin-bottom:20px;
}

ul.services li .captioned {
width:40%;
} 
img.map {
width:100%;
height:auto;
}

footer .bar{
text-align:center;
min-height:4em;
padding: 1em 5px 1em 5px;
font-size: .78em;
}

footer span#credit, footer span#copyright {
display:block;
margin:auto;
text-align:center;
float:none;

}

body#construction .content-area {
padding:20px;
width:100%;
}



#testimonials {
background:white;
background:url('images/photo.jpg');
background-height:100%;
background-repeat:no-repeat;
}




/*
header .bar, #nav, .nav {
display:none;
}
*/

header .bar {
display:none;
}

.desk-only {
display:none;
}

.mob-only {
display:block;
}

#nav {
width:100%;
position:relative;
}

#nav ul.nav li.button{
float:none;
display:block;
position:relative;
width:100%;
background:white;
}

#nav {
display:none;
}

img#nav-b, img#nonav-b {
display:block;
position:absolute;
top:5px;
right:5px;
}

img#nonav-b {
z-index:99;
}

#nav li {
  background: #3D2B21;
}

#nav:target {
display:inline;
}
		
#nonav:target {
display:none;
}

#nav {
height:auto;
position:absolute;
top:0;
vertical-align:middle;
}

ul.nav li.button:hover li.drop-button {
display:none;
}

img#logo, #logo {
position:relative;
margin:auto;
width:100%;
}



body {
-webkit-text-size-adjust: none;
}


ul.columns li, .right, .left {
display:block;
}

.column {
width:100% !important;

}

#testimonials .column.right {
background:white;
}

footer .column#foot-r {
width:100%;
padding:70px;
margin:0;
}

footer .column#foot-m {
vertical-align:middle;
}

footer .column {
margin-bottom:0;
}

footer .column#foot-l a
{
display:block;
margin-top: .5em;
}

.photo {
margin-left:auto;
margin-right:auto;
width:100%;
height:auto;
}



/* Mobile PHP */

ul.nav li.button a{
background:#333333;
}
ul.nav li.button a:hover {
background:#444444;
}



img#logo {
position:relative;
width:100%;
}



/* COMMENTED OUT ****************************************
img#logo, #search {
margin:auto;
width:100%;
max-width:100%;
min-width:0;
}

header {
padding:40px;
margin:0;
box-sizing:border-box;
}

#top-right span {
display:none;
}

#top-right, #search {
width:100%;
padding-top:10px;
}

img#logo {
margin:auto;
}


#search {
margin:auto;
padding:10px 0 0 0;
width:100%;
position:relative;
top:0;
}

#top-right {
position:relative;
padding:0;
margin:0;
}

ul.nav li.button {
    float: none;
    position:relative;
    display:block;
    z-index:5;
    width:100%;
}

#nav {
display:none;
position:absolute;
top:0;
}

img#nav-b, img#nonav-b {
display:block;
position:absolute;
top:5px;
right:5px;
}

#nav li {
  background: #3D2B21;
}

#nav:target {
display:inline;

}
		
#nonav:target {
display:none;
}

#nav {
height:auto;
}

ul.nav li.button:hover li.drop-button {
display:none;
}


span#copyright, span#credit {
text-align:center;
float:none;
font-size:.8em;
position:relative;
margin:auto;
display:block;
}



*/
}

/*
@media screen and (max-width:500px) {



footer .column
{
width:100%;
padding:70px;
margin:0;
}

footer .column a
{
display:block;
margin: 5px 0 0 0;
}
}
*/


/**
 * BxSlider v4.1.2 - Fully loaded, responsive content slider
 * http://bxslider.com
 *
 * Written by: Steven Wanderski, 2014
 * http://stevenwanderski.com
 * (while drinking Belgian ales and listening to jazz)
 *
 * CEO and founder of bxCreative, LTD
 * http://bxcreative.com
 */


/** RESET AND LAYOUT
===================================*/

.bx-wrapper {
	position: relative;
	margin: 0 auto 60px;
	padding: 0;
	*zoom: 1;
z-index:0;

}

.bx-wrapper img {
	max-width: 100%;
	display: block;
}

/** THEME
===================================*/

.bx-wrapper .bx-viewport {

	left: -5px;
/*	background: #fff; */
	
	/*fix other elements on the page moving (on Chrome)*/
	-webkit-transform: translatez(0);
	-moz-transform: translatez(0);
    	-ms-transform: translatez(0);
    	-o-transform: translatez(0);
    	transform: translatez(0);
}

.bx-wrapper .bx-pager,
.bx-wrapper .bx-controls-auto {
	position: absolute;
	/* bottom: -30px; */
	width: 100%;

}

/* LOADER */

/*
.bx-wrapper .bx-loading {
	min-height: 50px;
	height: 100%;
	width: 100%;
	position: absolute;
	top: 0;
	left: 0;
	z-index: 5;
}*/

/* PAGER */

.bx-wrapper .bx-pager {
	text-align: center;
	font-size: .85em;
	font-family: Arial;
	font-weight: bold;
	color: #666;


}

.bx-wrapper .bx-pager .bx-pager-item,
.bx-wrapper .bx-controls-auto .bx-controls-auto-item {
	display: inline-block;
	*zoom: 1;
	*display: inline;
}

.bx-wrapper .bx-pager.bx-default-pager a {
	background: #666;
	text-indent: -9999px;
	display: block;
	width: 10px;
	height: 10px;
	margin: 0 5px;
	outline: 0;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	border-radius: 5px;
}

.bx-wrapper .bx-pager.bx-default-pager a:hover,
.bx-wrapper .bx-pager.bx-default-pager a.active {
	background: #000;
}

/* DIRECTION CONTROLS (NEXT / PREV) */

.bx-wrapper .bx-prev {
	left: 10px;
	background: url(images/controls.png) no-repeat 0 -32px;
}

.bx-wrapper .bx-next {
	right: 10px;
	background: url(images/controls.png) no-repeat -43px -32px;
}

.bx-wrapper .bx-prev:hover {
	background-position: 0 0;
}

.bx-wrapper .bx-next:hover {
	background-position: -43px 0;
}

.bx-wrapper .bx-controls-direction a {
	position: absolute;
	top: 50%;
	margin-top: -16px;
	outline: 0;
	width: 32px;
	height: 32px;
	text-indent: -9999px;
	z-index: 6;
}

.bx-wrapper .bx-controls-direction a.disabled {
	display: none;
}

/* AUTO CONTROLS (START / STOP) */

.bx-wrapper .bx-controls-auto {
	text-align: center;
}

.bx-wrapper .bx-controls-auto .bx-start {
	display: block;
	text-indent: -9999px;
	width: 10px;
	height: 11px;
	outline: 0;
	background: url(images/controls.png) -86px -11px no-repeat;
	margin: 0 3px;
}

.bx-wrapper .bx-controls-auto .bx-start:hover,
.bx-wrapper .bx-controls-auto .bx-start.active {
	background-position: -86px 0;
}

.bx-wrapper .bx-controls-auto .bx-stop {
	display: block;
	text-indent: -9999px;
	width: 9px;
	height: 11px;
	outline: 0;
	background: url(images/controls.png) -86px -44px no-repeat;
	margin: 0 3px;
}

.bx-wrapper .bx-controls-auto .bx-stop:hover,
.bx-wrapper .bx-controls-auto .bx-stop.active {
	background-position: -86px -33px;
}

/* PAGER WITH AUTO-CONTROLS HYBRID LAYOUT */

.bx-wrapper .bx-controls.bx-has-controls-auto.bx-has-pager .bx-pager {
	text-align: left;
	width: 80%;
}

.bx-wrapper .bx-controls.bx-has-controls-auto.bx-has-pager .bx-controls-auto {
	right: 0;
	width: 35px;
}

/* IMAGE CAPTIONS */

.bx-wrapper .bx-caption {
	position: absolute;
	bottom: 0;
	left: 0;
	background: #666\9;
	background: rgba(80, 80, 80, 0.75);

	width: 100%;
}

.bx-wrapper .bx-caption span {
	color: #fff;
	font-family: Arial;
	display: block;
	font-size: .85em;
	padding: 10px;
}

ul.bxslider
{
margin:0;}


img.checkatrade {
height:3.3em;
position:relative;
bottom:15px;
margin-right:5px;
}


/* Bring content up due to logo */
.content-area, .banner {
position:relative;
top:-200px; /* Brings content area up */
margin-bottom:-200px; /* removes 200px of space before footer */
}

#nav {
position:relative;
bottom:200px;

}

body#construction .content-area {
position:relative;
top:0;
margin-bottom:0;
}

@media screen and (max-width:750px) {

.content-area, .banner
{
position:initial;
top:0;
margin-bottom:0;
}

}



.dark

{
    background: #333333;
color: #ffffff;
}


#top-bar
{
background:grey;
border-color:grey;
font-size:1.5em;
}

ul.beforeafter li.before img {
transition: ease;
  -webkit-transition: all 0.5s ease;
          transition: all 0.5s ease;
} 


.bar {
    
}
.mob-only{
    width:5% !important;
}