/* ==== Colors Used: #5c6b83, #9ba8b9, #e1dfd7 ==== */

/* ======== GENERAL RULES ======== */

html {height: 101%; margin-bottom: 1px;}

header, footer, nav, article, section, aside {display: block;}

body {

  background: #161616 url('../images/background.jpg') repeat-x; 

  font-family: 'Open Sans', Verdana, Helvetica, sans-serif;

  font-size: 100%;

  color: #000000;

  padding: 0;

  margin: 0;

  line-height: 1.5em;

  height: 100%;}

hr {

  background-color: #999999;

  color: #999999;

  border: none;

  height: 1px;}

ul {

  margin: 10px 0 20px 10px;

  padding: 0 0 0 10px;}

ul li a {

  color: #9ba8b9;

  text-decoration: none;

  font-weight: bold;

  padding: 0;}

ul li a:hover {

  color: #919191;

  text-decoration: underline;}

table {

	padding: 0;

	border-collapse: collapse;

	font-size: 100%;

	width: 100%;}

/* ============================ */

/* ======== TYPOGRAPHY ======== */

/* ============================ */

a {

	color: #9ba8b9;

	text-decoration: underline;

	outline: none;

	font-weight: bold;

}

a:hover {

	color: #919191;

	text-decoration: underline;

	font-weight: bold;

}

h1 {

	font: 40px 'Cinzel Decorative', Verdana, Helvetica, sans-serif;

	color: #5c6b83;

	margin: 0.4em 0;

}

h2 {

	font: 36px 'Raleway', Verdana, Helvetica, sans-serif;

	letter-spacing: -2px;

	color: #5c6b83;

	margin: 0.3em 0;

}

h3 {

	font: 32px 'Oswald', Verdana, Helvetica, sans-serif;

	color: #515151;

	margin: 0.4em 0;

	text-align: left;

}

h4 {

	font: 28px 'Oswald', Verdana, Helvetica, sans-serif;

	color: #515151;

	margin: 0.4em 0;

}

h5 {

	font: 24px 'Oswald', Verdana, Helvetica, sans-serif;

	color: #515151;

	margin: 0.4em 0;

}

h6 {

	font: 18px 'Oswald', Verdana, Helvetica, sans-serif;

  text-transform: uppercase; 

  color: #303030;

	margin: 0.4em 0;

	border-bottom: 1px #303030 solid;

}

.alternate1 {

	color: #000000;

	border-bottom: 1px #000000 solid;

	font: 32px 'Raleway', Verdana, Helvetica, sans-serif;

	font-weight: 200;

	letter-spacing: -2px;

	margin: 0.2em 0 0.5em 0;

	padding: 1px 6px;

	text-align: center;

}

.button {

	color: #fff;

	font: 16px 'Oswald', Verdana, Helvetica, sans-serif;

	text-transform: uppercase;

	text-shadow: 1px 1px 1px #000;

	padding: 5px 8px;

	text-decoration: none;

	background: #888;

	box-shadow: 0 0 15px #111 inset;

	border-radius: 5px;

}

.button:hover {

	color: #fff;

	font-size: 16px;

	font-weight: normal;

	text-decoration: none;

	background: #9ba8b9;

	box-shadow: 0 0 15px #5c6b83 inset;

}

p.dropcap {

	overflow: hidden;

}

p.dropcap:first-letter {

	color: #444;

	display: block;

	float: left;

	font: 60px/50px Georgia, Garamond, serif;

	padding: 6px 4px 0 0;

}

.bignumber {

  border-radius: 25px;

	background: #9ba8b9;

	box-shadow: 0 0 20px #5c6b83 inset;

  color: #ffffff;

  display: block;

  float: left;

  font: normal 28px/50px Garamond, Georgia, serif;

  height: 50px;

  margin: 0 10px 5px 0;

  text-align: center;

  text-transform: uppercase;

  width: 50px;

}

ul.list1 li {

	list-style-type: none;

	background: url(../images/bullet01.png) no-repeat 0 6px;

  margin: 0 0 0 -15px;

	padding: 1px 0 0 18px;

}

ul.list2 li {

	list-style-type: none;

	background: url(../images/bullet02.png) no-repeat 0 6px;

  margin: 0 0 0 -15px;

	padding: 1px 0 0 18px;

}

ul.list3 li {

	list-style-type: none;

	background: url(../images/bullet03.png) no-repeat 0 6px;

  margin: 0 0 0 -15px;

	padding: 1px 0 0 18px;

}

ol.leadingzero {

	background: none;

	list-style-position: outside;

	list-style-type: decimal-leading-zero;

}

blockquote {

	font-family: Georgia, Garamond, "Times New Roman", serif;

	font-size: 1.2em;

	color: #777;

	margin: 2px 40px;

	padding: 10px;

	text-align: left;

	border-top: 4px #777 solid;

	border-bottom: 4px #777 solid;

}

blockquote p {padding: 0; margin: 0;}

blockquote strong {

  color:#9ba8b9;

  font-size:1.7em;

  font-weight:normal;

  letter-spacing:-1px;

}

blockquote.leftside {

	float: left;

	display: block;

	width: 30%;

	margin: 1% 2% 1.5% 2%;

}

blockquote.rightside {

	float: right;

	display: block;

	width: 30%;

	margin: 1% 2% 1.5% 2%;

}

p.comment {

	background: transparent url('../images/comment.png') 0 3px no-repeat;

	padding: 0 0 5px 35px;}

p.home {

	background: transparent url('../images/home.png') 0 3px no-repeat;

	padding: 0 0 5px 35px;}

p.phone {

	background: transparent url('../images/phone.png') 0 1px no-repeat;

	padding: 0 0 5px 35px;}

p.email {

	background: transparent url('../images/email.png') 0 3px no-repeat;

	padding: 0 0 5px 35px;}

p.hours {

	background: transparent url('../images/clock.png') 0 3px no-repeat;

	padding: 0 0 5px 35px;}

p.breadcrumbs {color: #000; font-size: 0.95em; text-transform: uppercase; letter-spacing: 2px; margin: 0; padding: 0; text-align: center;}

p.authorDate {color: #555; font-size: 0.95em; text-transform: uppercase;

  border-bottom: 1px #888 solid; font-weight: lighter; letter-spacing: 2px;

  margin: 0; padding: 0;}

.center {text-align: center;}

.right {text-align: right;}

.left {text-align: left;}

.small {font-size: 0.85em;}



/* ============================== */

/* ======== LAYOUT RULES ======== */

/* ============================== */

.wrapper {

	width: 1200px;

	margin: 0 auto 20px auto;

	padding: 0;

	text-align: left;

	background-color: #ffffff;

	box-shadow: 0 0 20px rgba(0, 0, 0, 0.9);

}

.inside {

	width: 96%;

	padding: 0 2%;

}

.row1 {background-color: #e1dfd7; padding: 5px 0; margin: 0 0 15px 0;}

.row1 h1 {margin: 0.2em 0; text-align: center;}

header {

  padding-top: 15px;

  background: #000000;

  background-image: radial-gradient(center, circle, #666, #000000);

  background-image: -moz-radial-gradient(center, circle, #666, #000000);

  background-image: -webkit-radial-gradient(center center, circle, #666, #000000);

  background-image: -ms-radial-gradient(center center, circle, #666, #000000);

  background-image: -o-radial-gradient(center center, circle, #666, #000000);

  box-shadow: inset 0 0 200px rgba(0,0, 0, 1.0);

}

/* ======== LOGO/SITE NAME AREA ======== */

#logo {

	width: 100%;

	padding: 30px 0 30px 0;

	text-align: center;

}

#logo h1, #logo h1 a, #logo h1 a:hover  {

	font: 46px 'Cinzel Decorative', Verdana, Helvetica, sans-serif;

	color: #eee;

	letter-spacing: -1px;

	text-align: center;

	text-decoration: none;

	margin: 0; padding: 0;

	text-shadow: 2px 2px 2px rgba(0, 0, 0, 0.3);

}

#logo h2 {

	font: normal  1.5em Arial, Helvetica, sans-serif;

	font-weight: 200;

	color: #bbb;

	margin: 0; padding: 0;

	letter-spacing: 1px;

}

#logo img {display: block; margin: 0 auto; padding: 3px 0;}



/* ======== MAIN NAVIGATION AREA ======== */

#mainnav {

	color: #bbb;

	width: 100%;

	height: 40px;

	text-transform: uppercase;

	font-size: 0.90em;

}

#nav {

	margin: 0; padding: 0;

	list-style: none;

	text-align: center;

}

#nav li {

	display: inline-block;

	position: relative;

	z-index: 500;

	margin: 0 -2px 0 -3px;

	padding: 0;

	text-align: left;

	font-weight: normal;

}

/* this is the parent menu */

#nav li a {

	display: block;

	padding: 8px 14px 9px 14px;

	text-decoration: none;

	font-weight: normal;

	color: #bbb;

	text-align: left;

	border-top: 1px #bbb solid;

	border-bottom: 1px #bbb solid;

	transition: all 0.2s ease 0.0s;

	-webkit-transition: all 0.2s ease 0.0s;

}

#nav li a:hover {

	font-weight: normal;

	padding: 8px 14px 9px 14px;

	color: #fff;

	background: #9ba8b9;

	box-shadow: 0 0 20px #5c6b83 inset;

	border-top: 1px #9ba8b9 solid;

	border-bottom: 1px #9ba8b9 solid;

	transition: all 0.2s ease 0.0s;

	-webkit-transition: all 0.2s ease 0.0s;

}

/* submenu, it's hidden by default */

#nav ul {

	position: absolute;

	left: 0;

	display: none;

	margin: 0 0 0 0;

	padding: 0 0 0 0;

	list-style: none;

	box-shadow: 0 3px 8px rgba(0,0,0,0.5);

}

#nav ul li {

	width: 170px; /* you can increase or decrease width of submenu */

	float: left;

	padding: 0;

	margin: 0;

	border-radius: 0;

	font-size: 0.90em;

}

#nav ul a {

	display: block;

	height: 22px;

	font-weight: normal;

	text-transform: none;

	padding: 5px 3px 5px 15px;

	color: #ffffff;

	background: #444;

	border-top: none;

	border-bottom: none;

}

#nav ul a:hover {

	font-weight: normal;

	color: #ffffff;

	background: #9ba8b9;

	box-shadow: 0 0 20px #5c6b83 inset;

	padding: 5px 3px 5px 15px;

	text-transform: none;

	text-decoration: none;

	border-top: none;

	border-bottom: none;

}

.selectnav { display: none; }



/* ======== MAIN IMAGE AREA ======== */

#photoblock {

  width: 100%;

}

#slider {

  position: relative;

  z-index: 10;

  width: 100%;

	height: auto;

}

.nivoSlider {

	position: relative;

	z-index: 20;

	width: 100%;

	height: auto;

	overflow: hidden;

}

.nivoSlider img {

	position: absolute;

	max-width: 100%;

	top: 0;

	left: 0;

	max-width: none;

}

.nivo-caption {

	position: absolute;

  bottom: 0;

  left: 0;

  font-family: Georgia, Garamond, "Times New Roman", serif;

  text-shadow: 1px 1px 3px rgba(0, 0, 0, 0.8);

  color: #ffffff;

  font-size: 2.0em;

	text-align: center;

  width: 80%;

	z-index: 8;

	padding: 0 10% 80px;

	overflow: hidden;

	display: none;

}

.nivo-caption p {padding: 0; margin: 0;}



/* ======== SIDEBAR AREAS ======== */

#sidebarLeft {

	float: left;

	width: 23%;

	padding: 0;

	margin: 0 2% 0 0;

}

#sidebarRight {

	float: right;

	width: 23%;

	padding: 0;

	margin: 0 0 0 2%;

}

/* ======== CONTENT AREA ======== */

#contentRight {

	float: right;

	width: 73%;

	padding: 0;

	margin: 0 0 0 2%;	

}

#contentLeft {

	float: left;

	width: 73%;

	padding: 0;

	margin: 0 2% 0 0;

}

#contentMiddle {

	float: left;

	width: 46%;

	padding: 0;

	margin: 0 2%;

	overflow: hidden;

}



/* ======== SECTION BLOCKS ======== */

.contentBox2a {float: left; width: 48%; padding: 0; margin: 0 2% 0 0;}

.contentBox2b {float: left; width: 48%; padding: 0; margin: 0 0 0 2%;}



.contentBox3a {float: left; width: 31.33333%; padding: 0; margin: 0 2% 0 0;}

.contentBox3b {float: left; width: 31.33333%; padding: 0; margin: 0 1% 0 1%;}

.contentBox3c {float: left; width: 31.33333%; padding: 0; margin: 0 0 0 2%;}



.contentBox4a {float: left; width: 23%; padding: 0; margin: 0 2% 0 0;}

.contentBox4b {float: left; width: 23%; padding: 0; margin: 0 1% 0 1%;}

.contentBox4c {float: left; width: 23%; padding: 0; margin: 0 1% 0 1%;}

.contentBox4d {float: left; width: 23%; padding: 0; margin: 0 0 0 2%;}



.shadow {box-shadow: 0 0 6px rgba(0,0,0,0.3); margin-top: 20px; margin-bottom: 20px; border-radius: 5px;}



/* ======== FOOTER AREA ======== */

footer {

  background: #000000;

	clear: both;

	color: #eeeeee;

	width: 100%;

	font-size: 0.90em;

	line-height: 1.4em;

	padding: 10px 0 10px 0;

	margin-top: 30px;

}

footer ul {list-style-type: none; line-height: normal; margin: 0 0 10px 0; padding: 0;}

footer ul li {margin: 0 20px 0 0; background: url(../images/bullet01.png) no-repeat 0 9px; padding: 6px 0 2px 20px;}

footer ul li a {color: #eee; text-decoration: none; font-weight: normal; letter-spacing: 2px;}

footer ul li a:hover {color: #9ba8b9; text-decoration: none; font-weight: normal;}

footer a {color: #9ba8b9;}

footer a:hover {color: #eee;}

footer h4 {color: #aaa;}

.footerBoxa {float: left; width: 18%; padding: 0; margin: 0 1% 0 1%;}

.footerBoxb {float: left; width: 28%; padding: 0; margin: 0 1% 0 1%;}

.footerBoxc {float: left; width: 48%; padding: 0; margin: 0 1% 0 1%;}

.socialmedia {letter-spacing: 5px;}



.copyright {letter-spacing: 3px; text-align: center; color: #aaa; 	font-size: 0.85em;}

.designed {color: #aaa; text-align: center; letter-spacing: 1px; font-size: 10px; font-size: 0.75em;}

.designed a {color: #aaa; font-weight: normal; text-decoration: none;}

.designed a:hover {color: #aaa; font-weight: normal; text-decoration: underline;}



/* ======== CONTACT FORM ======== */

form.contactform {width: 99%; text-align: left;}

.contactform label {width: 99%; text-align: left; font-style: italic; display: block; margin-bottom: 4px;}

.contactform input {width: 99%; border: 1px #c0c0c0 solid; background-color: #efefef; padding: 5px; margin-bottom: 10px; color: #000000;}

.contactform textarea {width: 99%; border: 1px #c0c0c0 solid; background-color: #efefef; padding: 5px; resize:none; color: #000000;}

.contactform .submit {width: 100px; margin: 10px 0 0 0; cursor: pointer; color: #fff; font-size: 14px; font-weight: normal; 

  padding: 6px 10px; text-decoration: none; background: #202020; border-radius: 8px;}

.contactform .submit:hover {width: 100px; margin: 10px 0 0 0; cursor: pointer; color: #fff; font-size: 14px; font-weight: normal;

	text-decoration: none; background: #5c6b83;}



/* ======== CATALOG PAGE ======== */

.catalog {/* adds a border to the bottom of a div */

	max-width: 100%;

	border-bottom: 1px #c0c0c0 solid;

	padding-bottom: 10px;

	margin-bottom: 20px;

}

.catalog h6 {

	text-align: center;

	font: normal 20px Georgia, Garamond, serif;

}



/* ======= PHOTO GALLERY PAGE========= */

.photogallery {

  background-color: #efefef;

  border: 20px #ffffff solid;

  padding: 20px;

  margin: 20px 1% 30px 1%;

  text-align: center;

  box-shadow: 0 5px 15px -2px rgba(0, 0, 0, 0.8);

}

.photogallery img {

  background-color: #ffffff;

  padding: 8px;

  border: 1px #c0c0c0 solid;

  margin: 3px 3px 12px 3px;

  box-shadow: 0 10px 15px -9px rgba(0, 0, 0, 0.8);

}



/* ======= TICKER CONTENT ======== */

#ticker {list-style: none outside none; margin: 0; padding: 10px 0 0 0;}

#ticker li {margin: 0; background: none; padding: 0;}

#ticker p {margin-top: 0; padding-top: 0;}

.testimonial {

  background: url('../images/blockquote.png') 0 0 no-repeat;

  padding: 0 0 0 35px;}

.content {

  color: #444;

  padding-bottom: 10px;}

.author {

  font-weight: bold;

  color: #999;

  font-style: italic;}



/* ======= ACCORDION CONTENT ======== */

#acc dl {

  position: relative;

	width:100%; 

	color:#000; 

	padding: 0; 

	margin: 0 auto;}

#acc dt {

  margin: 0 0 1px 0;

	padding: 4px 4px 4px 20px;

	text-align: left; 

	font: 22px 'Oswald', Verdana, Helvetica, sans-serif;

	color: #000000; 

	cursor: pointer;

	background: #ffffff;

	border-radius: 4px;

	box-shadow: 0 0 20px rgba(0, 0, 0, 0.3) inset; 

	text-shadow: 2px 2px 3px rgba(0, 0, 0, 0.2);}

#acc dt:hover {

	color: #ffffff;

	background: #999;

	box-shadow: 0 0 15px #222 inset;

	text-shadow: 2px 2px 3px rgba(0, 0, 0, 0.6);

		transition: all 0.4s ease 0.0s;

	-webkit-transition: all 0.4s ease 0.0s;

}

#acc dd {

	width:94%; 

	padding:5px 2%; 

	margin: 0 auto; 

	border-top:none;}

/* ======== IMAGES ======== */

img {

	border: none;

}

#catalogimage { /* allows the large product image to scale with the size of the viewport */

  max-width: 60%;

  min-width: 30%;

  height: auto;

}

.catalogResize { /* allows the large product image to scale with the size of the viewport */

  width: 80%;

  max-width: 200px;

  height: auto;

}

.imageleft {

	margin: 5px 10px 0 0;

	float: left;

}

.imageright {

	margin: 5px 0 0 10px;

	float: right;

}

.image-border, .image-googlemap {

	background-color: #ffffff;

	margin: 2px 0;

	padding: 3px;

	border: 1px #c0c0c0 solid;

}

.imageleft-border {

	background-color: #ffffff;

	margin: 5px 10px 0 0;

	padding: 3px;

	float: left;

	border: 1px #c0c0c0 solid;

}

.imageright-border {

	background-color: #ffffff;

	margin: 5px 0 0 10px;

	padding: 3px;

	float: right;

	border: 1px #c0c0c0 solid;

}

.image-round {

	border-radius: 50%;

	border: 1px #ffffff solid;

	background-color: #ffffff;

	padding: 3px;

	border: 1px #c0c0c0 solid;

}

.image-catalog {

	border: 1px #c0c0c0 solid;

	background-color: #ffffff;

	padding: 5px;

	margin: 5px 10px;

	box-shadow: 0 5px 15px -8px rgba(0, 0, 0, 0.6);

}



/* ======== MISC. CLASSES ======== */

.clearsmall {height: 0; line-height: 0; margin: 0; padding: 0; clear: both;}

.clearfix::before, .clearfix::after {content: " "; display: block; height: 0; overflow: hidden;}

.clearfix::after {clear: both;}



/* ======================================= MEDIA QUERIES ==================================================== */



/* ========================================================== */

/* ================ CELL PHONE - PORTRAIT VIEW ============== */

/* ========================================================== */

@media screen and (max-width: 320px) {

	.wrapper {

  	width: 100%;

  	margin: 0;}

	#logo h1, #logo h1 a, #logo h1 a:hover {

    font-size: 24px; letter-spacing: normal;}

  #logo h2 {

    font-size: 0.80em;}

/* ===== navigation ===== */

	.js #nav {display: none;}

	#mainnav {

	  height: 25px;

	  border-top: 1px #bbb solid;

	  border-bottom: 1px #bbb solid;

	  padding: 5px 0;

	  width: 250px;

	  margin: 0 auto;}

	.js .selectnav {

    display: block;

    margin: 0;}

	 select#selectnav1 {

    color: #ffffff;

	  background: transparent;

    width: 230px; 

    margin: 0 auto 0 auto; 

    padding: 3px; 

    font-size: 1.0em; 

    letter-spacing: 1px;

    border: none;}

	select#selectnav1 option {

    background-color: #ffffff; 

    color: #000000; 

    font-size: 0.90em; 

    padding: 1px 10px;}

/* ===== main image area ===== */

	.nivo-caption {visibility: hidden; display: none;}

	.nivo-caption p {visibility: hidden; display: none;}

/* ===== footer ===== */

  .footerBoxa {width: 98%;}

  .footerBoxb {width: 98%;}

  .footerBoxc {width: 98%;}

/* ===== miscellaneous ===== */

	blockquote.leftside, blockquote.rightside {

    visibility: hidden; display: none;}

	.contentBox2a, .contentBox2b,

	.contentBox3a, .contentBox3b, .contentBox3c,

	.contentBox4a, .contentBox4b, .contentBox4c, .contentBox4d,

	#sidebarLeft, #sidebarRight, #contentRight, #contentLeft, #contentMiddle {

    width: 98%; margin: 1%; padding: 0;}

  .catalog {margin-bottom: 20px;}

}



/* ========================================================== */

/* =============== CELL PHONE - LANDSCAPE VIEW ============== */

/* ========================================================== */

@media screen and (max-width: 480px) and (min-width: 321px) {

	.wrapper {

  	width: 100%;

  	margin: 0;}

	#logo h1, #logo h1 a, #logo h1 a:hover {

    font-size: 26px; letter-spacing: normal; font-weight: 300;}

  #logo h2 {

    font-size: 0.80em;}

/* ===== navigation ===== */

	.js #nav {display: none;}

	#mainnav {

	  height: 25px;

	  border-top: 1px #bbb solid;

	  border-bottom: 1px #bbb solid;

	  padding: 5px 0;

	  width: 250px;

	  margin: 0 auto;}

	.js .selectnav {

    display: block;

    margin: 0;}

	 select#selectnav1 {

    color: #ffffff;

	  background: transparent;

    width: 230px; 

    margin: 0 auto 0 auto; 

    padding: 3px; 

    font-size: 1.0em; 

    letter-spacing: 1px;

    border: none;}

	select#selectnav1 option {

    background-color: #ffffff; 

    color: #000000; 

    font-size: 0.80em; 

    padding: 1px 10px;}

/* ===== main image area ===== */

	.nivo-caption {visibility: hidden; display: none;}

	.nivo-caption p {visibility: hidden; display: none;}

/* ===== footer ===== */

  .footerBoxa {width: 98%;}

  .footerBoxb {width: 98%;}

  .footerBoxc {width: 98%;}

/* ===== miscellaneous ===== */

	blockquote.leftside, blockquote.rightside {visibility: hidden; display: none;}

	.contentBox2a, .contentBox2b,

	.contentBox3a, .contentBox3b, .contentBox3c,

	.contentBox4a, .contentBox4b, .contentBox4c, .contentBox4d,

	#sidebarLeft, #sidebarRight, #contentRight, #contentLeft, #contentMiddle {width: 98%; margin: 1%; padding: 0;}

  .catalog {margin-bottom: 20px;}

}



/* ========================================================== */

/* ============== SMALL TABLET - PORTRAIT VIEW ============== */

/* ========================================================== */

@media screen and (max-width: 623px) and (min-width: 481px) {

	.wrapper {

  	width: 96%;

  	margin: 0 2% 0 2%;}

	#logo h1, #logo h1 a, #logo h1 a:hover {

    font-size: 38px;}

  #logo h2 {

    font-size: 0.80em;}

/* ===== navigation ===== */

	.js #nav {display: none;}

	#mainnav {

	  height: 25px;

	  border-top: 1px #bbb solid;

	  border-bottom: 1px #bbb solid;

	  padding: 5px 0;

	  width: 250px;

	  margin: 0 auto;}

	.js .selectnav {

    display: block;

    margin: 0;}

	 select#selectnav1 {

    color: #ffffff;

	  background: transparent;

    width: 230px; 

    margin: 0 auto 0 auto; 

    padding: 3px; 

    font-size: 1.0em; 

    letter-spacing: 1px;

    border: none;}

	select#selectnav1 option {

    background-color: #efefef; 

    color: #000000; 

    font-size: 0.90em; 

    padding: 1px 10px;}

/* ===== main image area ===== */

	.nivo-caption {font-size: 1.3em;}

/* ===== footer ===== */

  .footerBoxa {width: 48%;}

  .footerBoxb {width: 48%;}

  .footerBoxc {width: 98%;}

/* ===== miscellaneous ===== */

	blockquote.leftside, blockquote.rightside {visibility: hidden; display: none;}

	.contentBox3a, .contentBox3b, .contentBox3c,

	.contentBox4a, .contentBox4b, .contentBox4c, .contentBox4d,

	#sidebarLeft, #sidebarRight, #contentRight, #contentLeft, #contentMiddle {width: 98%; margin: 1%; padding: 0;}

}



/* ========================================================== */

/* ============= SMALL TABLET - LANDSCAPE VIEW ============== */

/* ========================================================== */

@media screen and (max-width: 800px) and (min-width: 769px) {

	.wrapper {

  	width: 94%;

  	margin: 0 3% 0 3%;}

	#logo h1, #logo h1 a, #logo h1 a:hover {

    font-size: 38px;}

  #logo h2 {

    font-size: 0.85em;}

/* ===== navigation ===== */

	.js #nav {display: none;}

	#mainnav {

	  height: 25px;

	  border-top: 1px #bbb solid;

	  border-bottom: 1px #bbb solid;

	  padding: 5px 0;

	  width: 250px;

	  margin: 0 auto;}

	.js .selectnav {

    display: block;

    margin: 0;}

	 select#selectnav1 {

    color: #ffffff;

	  background: transparent;

    width: 230px; 

    margin: 0 auto 0 auto; 

    padding: 3px; 

    font-size: 1.0em; 

    letter-spacing: 1px;

    border: none;}

	select#selectnav1 option {

    background-color: #ffffff; 

    color: #000000; 

    font-size: 0.90em; 

    padding: 1px 10px;}

/* ===== main image area ===== */

	.nivo-caption {font-size: 1.6em;}

/* ===== footer ===== */

  .footerBoxa {width: 48%;}

  .footerBoxb {width: 48%;}

  .footerBoxc {width: 98%;}

/* ===== miscellaneous ===== */

	blockquote.leftside, blockquote.rightside {visibility: hidden; display: none;}

	.image-googlemap {max-width: 90%;}

	.contentBox4a, .contentBox4b, .contentBox4c, .contentBox4d {width: 48%; margin: 0 1%; padding: 0;}

}



/* ========================================================== */

/* ============== LARGE TABLET - PORTRAIT VIEW ============== */

/* ========================================================== */

@media screen and (max-width: 768px) and (min-width: 624px) {

	.wrapper {

  	width: 94%;

  	margin: 0 3% 0 3%;}

	#logo h1, #logo h1 a, #logo h1 a:hover {

    font-size: 42px;}

  #logo h2 {

    font-size: 0.95em;}

/* ===== navigation ===== */

	.js #nav {display: none;}

	#mainnav {

	  height: 25px;

	  border-top: 1px #bbb solid;

	  border-bottom: 1px #bbb solid;

	  padding: 5px 0;

	  width: 250px;

	  margin: 0 auto;}

	.js .selectnav {

    display: block;

    margin: 0;}

	 select#selectnav1 {

    color: #ffffff;

	  background: transparent;

    width: 230px; 

    margin: 0 auto 0 auto; 

    padding: 3px; 

    font-size: 1.0em; 

    letter-spacing: 1px;

    border: none;}

	select#selectnav1 option {

    background-color: #ffffff; 

    color: #000000; 

    font-size: 0.90em; 

    padding: 1px 10px;}

/* ===== main image area ===== */

	.nivo-caption {font-size: 1.6em;}

/* ===== footer ===== */

  .footerBoxa {width: 48%;}

  .footerBoxb {width: 48%;}

  .footerBoxc {width: 98%;}

	/* ===== miscellaneous ===== */

	blockquote.leftside, blockquote.rightside {visibility: hidden; display: none;}

	.image-googlemap {max-width: 90%;}

	.contentBox4a, .contentBox4b, .contentBox4c, .contentBox4d {width: 48%; margin: 0 1%; padding: 0;}

}



/* ========================================================== */

/* ======== LARGE TABLET PORTRAIT/DESKTOP/LAPTOP VIEW ======= */

/* ========================================================== */

@media screen and (max-width: 1299px) and (min-width: 801px) {

	.wrapper {

  	width: 94%;

  	margin: 0 3% 0 3%;}

/* ===== main image area ===== */

	.nivo-caption {font-size: 1.9em;}

/* ===== footer ===== */

  .footerBoxa {width: 23%;}

  .footerBoxb {width: 28%;}

  .footerBoxc {width: 43%;}

}