@charset "utf-8";
/*-- MAIN LAYOUT --*/
html{font-family: Arial, sans-serif; font-size:18px!important; color: #666; background-color:#fefefe;background-image:url(../img/watertest4-5.png); background-repeat:no-repeat;}

#footer {border-radius: 10px; background-color: #5bd622; color: #fff; padding: 10px 0;}
#footer p {margin: 0; padding: 10px 0;}
#footer a {color:#0FF!important;}

/* Page Containers */
.wrapper{max-width:1080px;margin:0 auto;padding:1.5em 1em;}
.wrapper1{max-width:1080px;margin:0 auto;padding:.5em 1em;}
/*-- In Use on GALLERY PAGE Only --*/
.wrapper2{max-width:1080px;margin:0 auto 0 15%;padding:.5em 1em;}

/* Grids */
.grids{max-width:1120px;clear:both;margin:0 0 0 -2.679%;list-style:none;}
/* Ensure any grid item's FIRST class is a grid- class. e.g.
VALID: class="grid-4 text-centre"
INVALID: class="left grid-4" */
[class^="grid-"]{float:left;margin:0 2% 0 0;}
.grids [class^="grid-"]{margin:0 0 0 2%;}

.grid-1{ width:3.571% }
.grid-2{ width:9.821% }
.grid-3{ width:16.071% }
.grid-4{ width:22% }
.grid-5{ width:28.571% }
.grid-6{ width:34.821% }
.grid-7{ width:41.071% }
.grid-8{ width:47.321% }
.grid-9{ width:53.571% }
.grid-10{ width:59.821% }
.grid-11{ width:66.071% }
.grid-12{ width:72.321% }
.grid-13{ width:78.571% }
.grid-14{ width:84.821% }
.grid-15{ width:91.071% }
.grid-16{ width:97.321%; margin:0; }


/* --BEGIN SITE-WIDE STYLES--*/
/*--Active Link Color--*/
a{color: #07c0f9 /*#4acff8*/;text-decoration:none;}
/*--Horizontal Rule (Black Line)--*/
hr {display:block; height:1px; border:0; border-top:1px solid #000; margin:1em 0; padding:0; }
/*--- Headers ---*/
h1, h2, h3, h4, h5, h6 {font-family: Arial, sans-serif;font-style: normal;font-weight: 500;color: #5bd622;text-shadow: 1px 1px 0px #F9F9F9;}
h2{font-size:2.3em;	margin-bottom:1em; line-height:1.4em;text-shadow: 1px 1px 0px #fff;}
h3{font-size:2em; margin-bottom:1em; line-height:1.3;}
h4{font-size:1.25em; margin-bottom:0.8em; line-height:auto; text-shadow: none; font-weight:bold;}
h5{font-size:1.1em; margin-bottom:0.6em; text-shadow: none; line-height:auto;}
h6{color: #666;font-size:1em; margin-bottom:0.6em; text-shadow: none; line-height:auto;}
/*--LOGO, Page Header Styles --*/
#logo, #logo img{display:block;width:91px; height:150px;}
#logo{float: left; background:url(../img/logo.png); background-repeat:no-repeat!important; position: relative; margin: 0 .5em; z-index: 120; display: inline; /* fixes IE6 margin bug */}
#logo img{position:absolute; left:-99999px;}
.mast {border-bottom:1px solid #000;}
.header {position: relative; display:block; margin:0.75em 0.75em 0 0.75em;}
/*--Main Headline and Tag-line--*/
h1{position:relative; font-size:2.5em; margin-bottom:0; color:#0e7080!important;}
.tag {position:relative; margin-top:0; font-size:1.5em; color:#0e7080!important;} 
 /*--Backgrounds and Deco--*/
.trans {background-color:#0e7080; padding:1em; overflow:auto;}
.trans-lt {background-color:#aedee6; padding:1em;}
.shopping {background-color:#e6f6f9; margin:5px;}
.white-trans {background-color:#f9f9f9;padding:1em;}
.lt-text {color:#f9f9f9;}
 
/*--classes to do odd jobs--*/
.no-show {display:block!important;}
.pointer {cursor:pointer; text-decoration:none;}
.left	{ float:left!important; }
.right	{ float:right!important; }
.none {list-style:none;}

/*--Control whitespace--*/
.top {margin-top: 30px!important;}
.less-top {position:relative; margin-top:-10px;}
.bottom {margin-bottom: 30px!important;}

/*--Images---*/
img{margin-bottom: 10px;}
img.left	{ margin:0 20px 10px 0; }
img.right	{ margin:0 0 10px 20px; }
img.expand { width: 24em; margin: 0; }

/*-- anti-theft --*/
.ghost {position:absolute; display:block; z-index:100; width:500px; height:376px; background-image:url(../img/ghost.png);}
.gal-ghost {display:none!important;}
.bc-ghost {position:absolute; width:40%; display:none!important;}

/*--TOP NAVIGATION--*/
.nav {list-style:none; margin:1em 0 1.5em 0;}
#nav.main{float: right; text-align:center; margin: 0.5em 0 0 0; padding: 0.4em 0; font-family:Arial, Helvetica, sans-serif;}
#nav.main li {display:inline; float:none;}
#nav.main a{display:inline-block;padding: 0.5em 1em;background-color: #dedede;border-radius: 6px;border-right: 2px solid #fff;border-bottom: 3px solid #fff;color: #07c0f9/*#89b6c2*/;text-decoration:none;text-transform:uppercase;text-shadow: 1px 1px 1px #fff;font-size: 1.1em;margin: 0 0 0.6em 0;}
#nav.main a:hover{color: #000; /*text-shadow: 1px 1px 0px #000;*/ background-color: #6cf82c /*#b7e930 #8cf25c;*/ }
#nav.main a.active{color: #fff; text-shadow: 1px 1px 0px #000; font-weight:bold; background-color: #5bd622 /*#a1d416*/; letter-spacing: 1px;}
#nav li span {display: block; font-size: 10px; color: #666; text-shadow: none; line-height: 8px;}

/*--BEGIN PAGE-SPECIFIC STYLES--*/
/*--INDEX PAGE--*/
/*--Slider - This is pretty tricky stuff. Go carefully when making changes to slider --*/
.flex-container a:active,
.flexslider a:active {outline: none; overflow:auto;}
.slides,
.flex-control-nav,
.flex-direction-nav {margin: 0; padding: 0; list-style: none;} 
.flexslider {width: 100%!important; height:100%!important;margin: 0 auto!important; padding: 0 0;}
.flexslider .slides > li {display: none;} /* Hide the slides before the JS is loaded. Avoids image jumping */
.flexslider .slides img {height:100%!important; width:100%!important; display: block; margin-left:auto; margin-right:auto!important; margin-top:auto!important; margin-bottom:auto!important;}
.flex-pauseplay span {text-transform: capitalize;}
/*--Clearfix for the .slides element--*/
.slides:after {content: "."; display: block; clear: both; visibility: hidden; line-height: 0; height: 0;} 
html[xmlns] .slides {display: block;} 
* html .slides {height: 1%;}
/*--No JavaScript Fallback--*/
.no-js .slides > li:first-child {display: block;}
/*--FlexSlider Default Theme--*/
.flexslider {position: relative; display: block; zoom: 1;}
.flexslider .slides {zoom: 1;}
.flexslider .slides > li {position: relative;}
.flex-container {zoom: 1; position: relative;}
.ol {outline: 1px solid #f9f9f9;}
/* Caption style */
.flex-caption {width: 100%; position: absolute; text-align:center; margin-left:auto!important; margin-right:auto!important; color:#f9f9f9; margin-top:.25em; font-weight:400; font-size:1.25em;}





/* Control Nav */
.flex-control-nav {width: 100%; position: absolute; bottom: -40px; text-align: center;}
.flex-control-nav li {margin: 0 0 0 5px; display: inline-block; zoom: 1; *display: inline;}
.flex-control-nav li:first-child {margin: 0;}
.flex-control-nav li a {width: 13px; height: 13px; display: block; cursor: pointer; text-indent: -9999px;}
.flex-control-nav li a:hover {background-position: 0 -13px;}
.flex-control-nav li a.active {background-position: 0 -26px; cursor: default;}

/*--"from Penny..."--*/
.intro {padding: 10px 0; color: #999;}
.intro h2 {font-size: 3em; line-height: 1em; letter-spacing: -1px; text-transform:uppercase; padding-right:15px; margin: 0 0 20px 0;}
.intro p {font-family: Arial, sans-serif; font-size: 1.9em; line-height: 1.2em; padding-right: 15px;}
.water-blue {color:#78edfa;}

/*--Grey Quote Box Area--*/
.grey {-webkit-border-radius: 15px; -moz-border-radius: 15px; -o-border-radius: 15px; border-radius: 15px; zoom: 1; border-top: 1px solid #fff; border-bottom: 1px solid #fff; margin-bottom: 15px!important;}
.grey {background-color: #eee;}
.grey p {padding:10px 30px 0;}
.grey h2, .grey h3, .grey h4 {border-bottom: 5px solid #fff; margin-bottom: 0; }
.grey h2, .grey h3, .grey h4, .grey h5, .grey h6 {padding: 0px 30px; line-height: 1.7em;}
.quote {font-family: Arial, sans-serif; font-size: 1.4em; font-style: italic; line-height: 1.3em; } /*a styled quote in addition to blockquote*/
.quote span {display: block; font-size: 0.7em; padding-top: 10px; font-style: normal;}

/*-- Bottom Columns --*/
.info { background-color:#fff; padding-left:.5em; padding-top:.5em;}
.info ul{position:relative; display:block; padding-left:0; }
.info li { margin-left:0;padding-left:.5em;}


/*--GALLERY Page Styles--*/
/* left gallery page fixed navigation */
.gal-nav {position:fixed;text-align:right; margin-left:5px; top:27%; z-index:1000; font-size:.9em;}
.gal-nav a {color:#63F!important;}
.gal-info {position:relative; display:block; text-align:right; font-size:1em; margin-top:5px; margin-bottom:0;}
.whiteedge img {outline:1px solid #f9f9f9;}
/*--For DARK Background Series--*/
.gal-head {margin-bottom:0;color:#aedee6; text-align:left!important;}
.gal-p {margin:0 auto .25em auto;color:#aedee6; font-size:1em;}
/*--For LIGHT Background Series--*/
.gal-head-dk {margin-bottom:0;color:#0e7080!important; text-align:left;text-shadow: 1px 1px 0px #fff!important;}
.gal-p-dk {margin:0 auto .25em auto;color:#80e7080; font-size:1em;}
/*--mouseover styles--*/
.sm-img {width:98%; margin-right:.25em;outline:1px solid #f9f9f9;}
.bigcell {position:absolute; display:block; z-index:2; margin-top:0;  margin-left:.1em;}
.lg-img {position:relative; display:block; max-width:96%; max-height:96%; margin-bottom:-10px;}

/* uncomment for local
.gal-nav a {color:#63F!important;}


.gal-info {position:relative; display:block; text-align:center; font-size:1rem; padding:0 0;}
.gal-info a {color:#cff;}
.gal-info a:hover {color:#0ff;}
.h {margin:0 0 6rem 0!important; }
.v {margin:0 0 3rem 0!important; }
.whiteedge img {outline:1px solid #f9f9f9;}


/*--For DARK Background Series--
.gal-head {margin-bottom:0;color:#FFF; text-align:left!important;}
.gal-p {margin:0 auto 2rem 0!important;color:#fff; font-size:1rem; padding:0 0!important;}

/*--For LIGHT Background Series--
.gal-head-dk {margin-bottom:0;color:#fff!important; text-align:left;text-shadow: 1px 1px 0px #006699!important;}
.gal-p-dk {margin:0 auto .25em auto;color:#80e7080; font-size:1em;}


/*--mouseover styles--
.sm-img {width:98%; margin-right:.25em;outline:1px solid #f9f9f9;}
.bigcell {position:absolute; display:block; z-index:2; margin-top:0;  margin-left:.1em;}
.lg-img {position:relative; display:block; max-width:96%; max-height:96%; margin-bottom:-10px;}

/*-- Contact Page Styles--*/
.response {font-size:1.25em; margin-bottom:0.8em; line-height:auto; text-shadow: none; font-weight:normal; color:#5bd622;}

/*-- Tearsheet Styles --*/
.form-pad img{padding-left: 5px;}
#artframe {background-image:url(../img/bigtrans.gif) repeat:none;}
option#palform {font-size:14px!important;}
.pad-rt {padding-right:20px;}
input#print {display:inline-block; background:#dedede; padding: 0.5em 1em;border-radius: 6px;border-right: 2px solid #fff;border-bottom: 3px solid #fff;color: #89b6c2;text-decoration:none;text-transform:uppercase;text-shadow: 1px 1px 1px #fff;font-size: .9em;margin: 0 0 0.6em 0; cursor:pointer;}
#print:hover{color: #fff; text-shadow: 1px 1px 0px #999; background-color: #8cf25c; }

/*---------CSS for NARROW  Media queries -- for tablets and narrower devices --*/

/*@media (max-width: 1280px){
.ghost {margin-left:45%;margin-top:17%!important;}
}*/
@media (max-width: 1024px){
.tear-ghost {width:340px; height:250px!important;}
}

@media (min-width: 769px) and (max-width: 1023px){
html {background-image:none!important;}
.grids{margin:0!important;
	width:auto!important;}
[class^="grid-"],.grids [class^="grid-"]{
	width:auto!important;
	float:none!important;
	margin:0!important;
}
.no-show {display:none!important;}
.gal-nav {margin-top:70px!important;}
#nav.main{float:none!important;margin: 0 auto!important; padding: 0.4em 0 0 0}
#logo, #logo img{display:block;width:60px; height:99px;}
#logo{float: left; background:url(../img/logo-sm.png); background-repeat:no-repeat!important; position: relative; margin: 0 .5em 0 0; z-index: 120; display: inline; /* fixes IE6 margin bug */}
h1 {font-size:2em!important;}
.tag {font-size:1em!important;}
.ghost {width:384px; height:289px!important;}
.bc-ghost {clear:both;-webkit-user-select: none;display:block!important;}
.intro h2 {font-size: 2.2em; line-height: 1em; letter-spacing: -1px; text-transform:uppercase; text-align:center!important; padding:0!important; margin: 0 0 20px 0;}
.intro p {font-size: 1.6em;padding:0; text-align:center!important;}
.flexBG {height:auto;min-height:650px!important; padding:1rem; overflow:auto!important;}

.flexslider {width: 98%; margin: 0 auto 10px auto!important; padding: 0;}
.flexslider .slides img {max-width: 100%; display: block; margin: 0 auto!important;}

.gal-nav {font-size:80%; top:22%;!important;}
.wrapper{width:auto!important; padding:15px!important;}
}

/*--MOBILE  Media queries -- CSS for mobile devices --*/
@media (min-width: 400px) and (max-width: 720px){
html {background-image:none!important;}
body{-webkit-text-size-adjust:none;}
.wrapper2 {margin:0 auto!important;}
.grids{margin:0!important;
	width:auto!important;}
[class^="grid-"],.grids [class^="grid-"]{
	width:auto!important;
	float:none!important;
	margin:0!important;
}
.no-show {display:none!important;}
.wrapper{line-height: 1.5em; width:auto!important; padding:10px!important;}
.wrapper p {font-size:0.9em;}
#logo, #logo img{display:block;width:60px; height:99px;}
#logo{float: left; background:url(../img/logo-sm.png); background-repeat:no-repeat!important; position: relative; margin: 0 .5em 0 0; z-index: 120; display: inline; /* fixes IE6 margin bug */}
.header {margin:0.75em!important;}
h1{font-size:1.5em;}
.tag{font-size:1em;}
#nav.main a{display:inline-block;padding: 0.3em 0.6em;font-size: 0.9em;letter-spacing: 2px;}
#nav.main{padding: 0.4em 0 0 0; float:right; margin: 0 auto; background-image: none; font-size: 100%;}
.ghost {width:384px; height:289px!important;}
.gal-ghost {position:absolute; display:block; z-index:100; width:80%!important; }
.intro p {font-size: .9em;}
.intro h2 {font-size: 1.25em;}
#bigcell {display:none!important;}
.bigcell{display:none!important;}
#footer p {margin: 0; padding: 0 10px;}
}

@media (min-width: 150px) and (max-width: 399px){
html {background-image:none!important;}
body{-webkit-text-size-adjust:none;}
.wrapper2 {margin:0 auto!important;}
.grids{margin:0!important;
	width:auto!important;}
[class^="grid-"],.grids [class^="grid-"]{
	width:auto!important;
	float:none!important;
	margin:0!important;
}
.no-show {display:none!important;}
.wrapper{line-height: 1.5em; width:auto!important; padding:10px!important;}
.wrapper p {font-size:0.9em;}
#logo, #logo img{display:none!important;}
.header {margin:0.75em!important;}
h1{font-size:1.5em;}
.tag{font-size:1em;}
#nav.main a{display:inline-block;padding: 0.3em 0.6em;font-size: 0.9em;letter-spacing: 2px;}
#nav.main{padding: 0.4em 0 0 0; float:right; margin: 0 auto; background-image: none; font-size: 100%;}
.ghost { margin-left:0; width:67%!important;}
.gal-ghost {position:absolute; display:block; z-index:100; width:67%!important;}
.flex-caption {font-size:.8em!important;}
.intro p {font-size: .9em;}
.intro h2 {font-size: 1.1em; letter-spacing:1px;}
#bigcell {display:none!important;}
.bigcell{display:none!important;}
#footer p {margin: 0; padding: 0 10px;}	
}








/*Included herein: Version: 1.0 MIT License (X11) http://www.opensource.org/licenses/MIT by Silvia Gamsjäger. Flexslider: http://flex.madebymufffin.com*/