﻿/* ======== GENERAL RULES ======== */
html {
	height: 101%;
	margin-bottom: 1px;
}
body {   /* background: #1D3361 */
	background: #1D3361 url('../css/images/background_celebrity.jpg') repeat-x;	/*redesign: top header that extends above white side margins */
	color: #333348;
	font-size: 16px;
	padding: 0;
	margin: 0;
	height: 100%;
	font-style: normal;
	font-variant: normal;
	font-weight: normal;
	line-height: normal;
	font-family: Merriweather, Verdana, Helvetica, sans-serif;
}
.bodyRed {
	color: #C27830;
	font: normal 1.0em 'Merriweather', Verdana, Helvetica, sans-serif;
	font-size: 16px;
}
header, footer, nav, article, section, aside {
	display: block;
}
hr {
	background-color: #555;
	color: #1D3361;
	border: none;
	height: 1px;
}
ul {						/* keeps the Ships Stateroom summary <ul><li> list from overlaying the image float */
	Xdisplay: table;
}​
ul li > ul li {				/* 2nd level LI's primarily for detail page special offers */
	line-height:24px;
	font-size:16px;
}
ul li a {
	color: #C27830;
	text-decoration: none;
	font-weight: bold;
	padding: 0;
}
ul li a:hover {
	color: #919191;
	text-decoration: underline;
}
blockquote {
	font-family: Georgia, Garamond, "Times New Roman", serif;
	font-size: 1.2em;
	color: #777;
	margin: 2px 40px;
	padding: 10px;
	text-align: left;
	line-height: 1.3em;
	border-top: 4px #777 solid;
	border-bottom: 4px #777 solid;
}
blockquote p {padding: 0; margin: 0;}
blockquote strong {
  color:#3bdbff;
  font-size:1.7em;
  font-weight:normal;
  letter-spacing:-1px;
  line-height:1em;
}
.leftside {
	float: left;
	display: block;
	width: 30%;
	margin: 0 2% 1.5% 2%;
}
.rightside {
	float: right;
	display: block;
	width: 30%;
	margin: 0 2% 1.5% 2%;
}
fieldset {
	border: 1px #999 solid;
	margin: 20px 0;
	text-align: center;
	line-height: normal;
}
fieldset img {
	background-color: #ffffff;
	margin: 5px 10px;
	border: 1px #999 solid;
}
fieldset p {
	font-size: 0.85em;
	text-align: left;
	padding: 0 10px;
}
legend {
	background-color: transparent;
	padding: 0 10px;
	margin: 0 0 0 10px;
	color: #919191;
	letter-spacing: 1px;
	font: small-caps normal 20px Georgia, Garamond, serif;
}
table {
	padding: 0;
	border-collapse: collapse;
	font-size: 100%;
	width: 100%;
}
/* ======== TYPOGRAPHY ======== */
a {
	color: #C27830;
	text-decoration: none;  /* from underline to none */
	outline: none;
	font-weight: bold;
}
a:hover {
	color: #919191;
	text-decoration: underline;
	font-weight: bold;
}
div.clickable { 			/* home page, most popular itin list - Containing div must have a position value */
    position:relative;
    margin-bottom:20px; 	/* margin versus padding which includes the pad in the clickable area */
}
div.clickable a {
    position:absolute;
    width:100%;
    height:100%;
    top:0;
    left:0;
    text-decoration:none; 		/* Makes sure the link   doesn't get underlined */
    z-index:10; 				/* raises anchor tag above everything else in div */
    background-color:white; 	/*workaround to make clickable in IE */
    opacity: 0; 				/*workaround to make clickable in IE */
    filter: alpha(opacity=1); 	/*workaround to make clickable in IE */
}
div.clickable:hover {
	background-color: #fbfbfb;
    border-radius: 15px;
}
.clickableImage:hover{
	box-shadow: 0 5px 15px -4px rgba(0, 0, 0, 0.8);
}

h1 {
	font-family: Montserrat, Verdana, Helvetica, sans-serif;
	color: #1D3361;
	font-size: 42px;
	line-height: 46pt;
	font-weight:100;
}
h2 {
	font-family: 'Dancing Script'; /* Home: Featured Itineraries */
	color: #5489C6; /* #1D3361 on Regent */
	font-size: 46px;
	line-height: 46pt;
	font-weight:600;
}
h3 {
	font-family: 'Dancing Script'; /* Detail: Offer Subtitle & Itinerary Tab Title */
	color: #1D3361;
	font-size: 32px;
	line-height: 30pt;	
	font-weight:600;
	text-shadow: 2px 2px silver;	
}
h4 {
	font-family: Montserrat;
	color: #1D3361;
	font-size: 16px;
	line-height: 22pt;
	text-transform: uppercase;
}
h5 {
	font-family: Montserrat;
	color: #1D3361;
	font-size: 14px;
	line-height: 20pt;
	text-transform: uppercase;
}
h6 {
	font-family: Montserrat;
	font-size:16px;
	font-weight:400;
	color: #00607a;
	margin: 0.5em 0;
	border-bottom: 1px #00607a solid;
}
.alternate1 {
	color: #ffffff;
	font: normal 1.6em 'Oswald', Verdana, Helvetica, sans-serif;
	background: #808080;
	background-image: -webkit-linear-gradient(top, #303030, #808080, #303030); 
	background-image: -moz-linear-gradient(top, #303030, #808080, #303030);
	background-image: -ms-linear-gradient(top, #303030, #808080, #303030);
	background-image: -o-linear-gradient(top, #303030, #808080, #303030);
	border: solid 1px #303030;
	border-radius: 5px;
	box-shadow: 0 1px 2px rgba(0, 0, 0, 0.5);
	margin: 0.2em 0 0.5em 0;
	padding: 1px 6px;
	text-align: center;
	text-shadow: 0 1px 1px #202020;
}
.alternate2 {
	color: #ffffff;
	font: normal 1.3em 'Oswald', Verdana, Helvetica, sans-serif;
	background: #00607a;
	background-image: -webkit-linear-gradient(top, #3bdbff, #00607a); 
	background-image: -moz-linear-gradient(top, #3bdbff, #00607a);
	background-image: -ms-linear-gradient(top, #3bdbff, #00607a);
	background-image: -o-linear-gradient(top, #3bdbff, #00607a);
	border: solid 1px #00607a;
	margin: 0.2em -3px 0.5em -3px;
	padding: 3px 6px;
	text-align: center;
	border-radius: 5px;
	box-shadow: 0 1px 2px rgba(0, 0, 0, 0.6);
}
.alternate3 {
	font-size:14px;
	color:#fbfbfb;
	margin: 0.5em 0;
	text-align: center;
	border-bottom: 1px #919191 solid;
}
.button {
  -webkit-border-radius: 3;
  -webkit-box-shadow: 0px 1px 3px #666666;  
  -moz-border-radius: 3;
  -moz-box-shadow: 0px 1px 3px #666666;
  border-radius: 3px;
  box-shadow: 0px 1px 3px #666666;
  
  font-family: 'Montserrat';
  color: #fbfbfb;
  font-size: 14px;
  text-transform: uppercase;
  background: #C27830;
  padding: 5px 10px 5px 10px;  
  text-decoration: none;
}
  
.button:hover {
	background: #994941;
	color: #fbfbfb;  			/* to prevent standard <a tag color */
	text-decoration: none;}		/* and a tag underline */
}
.disclaimer {
	text-align: justify; 
	padding: 10px; 
	font-size: 11px; 
	line-height: 12px;  
}
.disclaimer p {
	text-align: justify; 
	padding: 10px; 
	font-size: 11px; 
	line-height: 12px;  
}
.disclaimer.dark {
	background-color:#5489C6;
	text-align: justify; 
	padding: 10px; 
	font-size: 11px; 
	line-height: 12px;  
}
.disclaimer.dark p {
	background-color:#5489C6;
	text-align: justify; 
	padding: 10px; 
	font-size: 11px; 
	line-height: 12px;  
}
p.dropcap {
	overflow: hidden;
}
p.dropcap:first-letter {
	color: #fff;
	display: block;
	float: left;
	font: 60px/50px Georgia, Garamond, serif;
	padding: 9px 10px;
	background-color: #00607a;
	box-shadow: 0 0 0 2px #00607a inset, 0 0 0 3px rgba(255, 255, 255, 0.5) inset;
	margin: 5px 10px 0 0;
	text-align: center;
	text-shadow: 1px 1px 3px rgba(0,0,0,0.8);
}
.bignumber {
  border-radius: 25px;
	background: #00607a;
	background-image: -webkit-linear-gradient(top, #3bdbff, #00607a); 
	background-image: -moz-linear-gradient(top, #3bdbff, #00607a);
	background-image: -ms-linear-gradient(top, #3bdbff, #00607a);
	background-image: -o-linear-gradient(top, #3bdbff, #00607a);
	text-shadow: 0 1px 1px #202020;
  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('../css/images/bullet01.png') no-repeat 0 3px;
	padding: 1px 0 0 15px;
}
ul.list2 li {
	list-style-type: none;
	background: url('../css/images/bullet02.png') no-repeat 0 3px;
	padding: 1px 0 0 15px;
}
ul.list3 li {
	list-style-type: none;
	background: url('../css/images/bullet03.png') no-repeat 0 5px;
	padding: 1px 0 0 18px;
}
ol.leadingzero {
	background: none;
	list-style-position: outside;
	list-style-type: decimal-leading-zero;
}
.textMont20{
	color:#333348;
	font-family: Montserrat;
	font-size: 20px;
	font-weight:normal;
}
.textMont14{
	font-family: Montserrat;
	color: #1D3361;	
	font-size: 14px;
	font-weight:normal;
	text-transform: uppercase;
}
.Mont16{
	font-family: Montserrat;
	color: #1D3361;	
	font-size: 16px;
	font-weight:normal;
	text-transform: uppercase;
}
.textMontred{
	font-family: Montserrat;
	font-size: 16px;
	color:#C27830;	
	padding-left:10px;
}
.h1HeadBlu{
	font-family: Montserrat, Verdana, Helvetica, sans-serif;
	color: #1D3361;	
	font-size: 40px;
	line-height: 46pt;
	font-weight:100;
}
.h1HeadRed{
	font-family: Montserrat, Verdana, Helvetica, sans-serif;
	color:#C27830;	
	font-size: 40px;
	line-height: 46pt;
	font-weight:100;
	text-transform: uppercase;		
}
.sitelinks {
	font-size:11px;
	line-height:18px;
	color:white;
	margin: 0.5em 0;
	text-align: center;
}
.sitelinks a {
	color:white;
	text-decoration:none;
}
/* ======== Boxes (Duration, Departure, etc across top of Detail page */
.detailbox {
	float:left;
	border:1px #1D3361 solid;
	text-align:center;	
	margin:-1px 0 0 -1px; /* eliminates double borders where boxes meet */
}
.detailline1 {			/* shaded top, Duration, Departure, Brochure Price, Our Price */
	color:#1D3361;
	background-color:#E3ECF4;
	font-size:12px;
	line-height:34px;
	text-transform:uppercase;
}
.detailline2 {			/* the data, 18, APR 02, $21,998, $7,999 */
	font-family: Montserrat;
	color: #1D3361;	
	font-size: 40px;
	line-height: 40px;
	font-weight:100;
	text-transform:uppercase;	
}
.detailline3 {			/* the lower line, Nights, 2015, Per Person, Per Peraon */
	font-family: Montserrat;
	color:#1D3361;
	font-size:15px;
	padding-bottom:10px;
	text-transform:uppercase;	
}
.quotebox {
	width:150px;
	float:right;
	text-align:center;
	padding:0 10px 10px 0;
}
.quotebox.pad {
	padding: 30px 20px 30px 30px;
}
.quoteline1 {
	font-size:12px;
	line-height:16px;
	text-align:center;
}
/* ======================== Itinerary Cell ================== */
.ItinTable {
	width:90%;
	margin-left:auto;
	margin-right:auto;
}
.ItinTableHead{
	font-family: Montserrat;
	color: #1D3361;	
	font-size: 14px;
	font-weight:normal;
	text-transform: uppercase;
	padding-top:20px;
}
.ItinTableCellw{					/* new alternating white table cell */
	background-color:white;
	line-height:25px;
	padding-left:20px	
}
.ItinTableCell{
	line-height:25px;
	padding-left:20px		
}
/* ======================== Dates/Pricing Cell ================== */
.PriceTable {
	width:100%;
	margin-left:auto;
	margin-right:auto;
}
.PriceTableHead {
	font-family: Montserrat;
	font-size: 14px;
	font-weight:normal;
	text-transform: uppercase;
	color: #1D3361;		
	padding-top:20px;
}
.PriceTableHeadTop {
	font-family: Montserrat;
	font-size: 14px;
	font-weight:normal;
	text-transform: uppercase;
	color: #1D3361;		
	padding:5px 30px 5px 30px;		
}
.PriceTableHeadBtm {
	font-family: Montserrat;
	font-size: 14px;
	font-weight:normal;
	text-transform: uppercase;
	color: #1D3361;		
}
.PriceTableHeadBtmSm {
	font-family: Montserrat;
	font-size: 14px;
	font-weight:normal;
	text-transform: uppercase;
	color: #1D3361;		
}
.PriceTableDate1 {
	background-color: white; 
	line-height: 28px;
	padding:5px 30px 5px 30px;
	border-top:1px #5489C6 solid;
}
.PriceTableDate2 {
	line-height: 28px;
	padding:5px 30px 5px 30px;
	border-top:1px #5489C6 solid;
}
.PriceTableCellBold {
	font-weight: bold;
	font-family: Montserrat; 
	font-size: 15px; 		
	text-transform: uppercase;
	padding:5px 30px 5px 30px;		
}
.PriceTableCell {
	font-family: Montserrat;
	font-size: 15px; 		
	text-transform: uppercase;	
	padding:5px 30px 5px 30px;	
}
.PriceCatHead {
	background-color:white;
	line-height:22px;
	font-family: Montserrat;
	font-size: 12px; 		
	text-transform: uppercase;	
	color:#1D3361;
	padding-right:10px;
	white-space:nowrap;
}
.PriceCatHeadLft {
	background-color:white;
	line-height:22px;
	font-family: Montserrat;
	font-size: 12px; 		
	text-transform: uppercase;	
	color:#1D3361;
	padding-left:30px;
	white-space:nowrap;
}
.PriceCatHeadRht {
	background-color:white;
	line-height:22px;
	font-family: Montserrat;
	font-size: 12px; 		
	text-transform: uppercase;	
	color:#1D3361;
	padding-right:30px;
	white-space:nowrap;
}
.PriceCatRow1{					/* new alternating table row */
	background-color:white;
	height:35px;
}
.PriceCatRow2{					/* new alternating table row */
	height:35px;
}
.PriceCatDescr {
	font-style:italic;
	font-size: 12px; 
	line-height:22px;		
	padding-left: 10px;
}
.PriceCatCategory {
	padding-left:30px;			/* to move in from left row */
}
.PriceCatRht {
	padding-right:28px;
}
/* ======================== Grid Offer Blocks (3 blocks wide) ================= */
.GridOffer {
	width:250px;
	Xborder:navy 1px solid;
	background: #E3ECF4;
	padding-bottom:20px;
	text-align:center;
	height:600px;
	margin-left: auto;
    margin-right: auto;
}
.GridOfferHeader {
	font-family: Montserrat;
	font-size: 16px;
	padding:15px 0px 15px 0px;
	color:#fbfbfb;
	background: #404041;
	text-align:center;
}
.GridOfferDescr {
	padding:10px;
	font-size:14px;
	height:190px;
	overflow:auto;
	margin-bottom:20px;
}
.GridOfferImage {
	max-width:250px;
}
/* ======================== List Table (category & results)  ================== */
.ListTable {
	width:100%;
	margin-left:auto;
	margin-right:auto;
	background-color: #E3ECF4;
}
.ListOuter {
	border: 1px solid #bbb;
	border-top: none;
	xclear: both;
	xfloat: left; 
	width: 100%;
	background-color: #E3ECF4;	/* Jemsu lightgray */
	margin-bottom: 20px;
}
.ListHeader {
	font-family: Montserrat;
	font-size: 14px;
	font-weight:normal;
	text-transform: uppercase;
	color: #fbfbfb;		
	background-color:#5489C6;
	padding-top:20px;
}
.ListHeader a {				/* added when colors of Ship & Date sort links don't work on top of ListHeader (such as Celebrity */
	color: black;
	text-decoration: none;  /* from underline to none */
	outline: none;
	font-weight: bold;
}
.ListHeader a:hover {
	color: silver;
	text-decoration: underline;  
	outline: none;
	font-weight: bold;
}
.ListHeader.left.pad  {
	padding-left:5px
}
.ListHeader.right.pad {
	text-align:right;padding-right:20px;
}
.ListHeader.center {
	text-align:center;
}
.ListHeader.right {
	text-align:right;
}
.ListRow1{					/* new alternating table row */
	background-color:white;
	height:35px;
}
.ListRow2{					/* new alternating table row */
	height:35px;
}
.ListCell{
	font-size:14px;
}
.ListCell.center {
	text-align:center;
}
.ListCell.right{
	text-align:right;
}
.ListCell.left.pad{
	padding-left:20px;
}
.ListCell.right.pad{
	padding-right:20px;
}

.balloonstyle {
	font-family: Merriweather;
	font-size: 12px; 		
	position:absolute;
	top: -500px;
	left: 0;
	padding: 5px;
	visibility: hidden;
	border:1px solid black;
	line-height: 18px;
	z-index: 100;
	background-color: #E3ECF4;
	color:black;
	text-align: left;
	width: 350px;
	text-transform: none;		
}

/* 		Pricing Grid: pricebtnA, pricebtnB, pricebtnG, pricebtnW (available, bookit, guarantee, waitlist) */
.pricebtn {
	color: #fff;
	text-shadow: 0 1px 1px #202020;
	font-family: Montserrat;
	text-transform: uppercase;	
	font-size: 11px;
	font-weight: normal;
	width:90px;
	padding: 3px 0px;
	text-decoration: none;
	border: solid 1px blacka;
	border-radius: 5px;
	box-shadow: 0 1px 2px rgba(0, 0, 0, 0.5);
}
.pricebtn.A {
	background: #C27830;	
}
.pricebtn.A:hover {
	background: #994941;
}
.pricebtn.B {
	background: #C27830;	
}
.pricebtn.B:hover {
	background: #994941;
}
.pricebtn.G {
	background: #1D3361;
}
.pricebtn.G:hover {
	background: #808080;
}
.pricebtn.W {
	background: #747698;
}
.pricebtn.W:hover {
	background: #808080;
}
/*		links for ShipBlock       */
.shiplinkbox {
	float:right;
	padding:10px 30px 30px 30px;
	text-align:center;
}
.shiplink {
	width: 220px;
	color: #C27830;
	background-repeat: no-repeat;
	background-position: 10px 0;
	background-color: #E3ECF4;
	padding-left: 10px;
	border: 1px #1D3361 solid;
	text-align: center;
	margin: -1px 0 -1px 0; /* eliminates double borders where boxes meet */
}
.shiplink a {
	color: #C27830;
	font-family: Montserrat;
	font-size: 16px;
	line-height: 34px;
	text-transform: uppercase;
	text-decoration:none;
	text-align:center;
}
.shiplink a:hover {
	color: #919191;
	text-decoration:underline;
}
.shiplink.deckplans {
	background-image: url("../images/icons/Deck1.png");
}
.shiplink.deckplans:hover {
	background-image: url("../images/icons/Deck2.png");
}
.shiplink.staterooms {
	background-image: url("../images/icons/StateRooms1.png");
}
.shiplink.staterooms:hover {
	background-image: url("../images/icons/StateRooms2.png");
}
.shiplink.publicspaces {
	background-image: url("../images/icons/PublicSpaces1.png");
}
.shiplink.publicspaces:hover {
	background-image: url("../images/icons/PublicSpaces2.png");
}
.shiplink.shipcalendar {
	background-image: url("../images/icons/ShipCalendar1.png");
}
.shiplink.shipcalendar:hover {
	background-image: url("../images/icons/ShipCalendar2.png");
}
.shiplink.shipreviews {
	background-image: url("../images/icons/ShipReviews1.png");
}
.shiplink.shipreviews:hover {
	background-image: url("../images/icons/ShipReviews2.png");
}
/* ======== LAYOUT RULES ======== */
#wrapper {
	color: #333348;
	max-width: 1300px;
	width: 85%;
	margin: 0 auto;
	padding: 0;
	text-align: left;
	box-shadow: 0 0 20px rgba(0,0,0,0.8);
}
/* ======== HEADER AREA ======== */
header {
	position: relative;
	background: white url('../css/images/header_celebrity.jpg') repeat-x;	/* redesign: the black header image with highlight for nav */
	width: 100%;
  	height: 190px;
	text-align: center;
	border-bottom: 1px #bbb solid;
	box-shadow: 0 15px 15px -15px rgba(0,0,0,0.8);
}
/* ======== LOGO/SITE NAME AREA ======== */
#logo {
	text-align: left;
	padding-left:40px;
	padding-top:10px;
	height: 100px;
	margin: 0 auto;
}
#logo h1 {
	font: normal 2.0em 'Playfair Display', Verdana, Helvetica, sans-serif;
	color: #ffffff;
	margin: 0;
	padding: 10px 0 0 0;
	text-shadow: 2px 2px 6px rgba(0,0,0,0.8);
}
#logo h1 a {
	color: #ffffff;
	text-decoration: none;
	font-weight: normal;
}
#logo h1 a:hover {
	color: #ffffff;
	text-decoration: none;
}
#logo h2 {
	font: normal 0.85em 'Muli', Verdana, Helvetica, sans-serif;
	color: #fff;
	margin: 0;
	padding: 0;
	letter-spacing: 1px;
	text-shadow: 2px 2px 6px rgba(0,0,0,0.8);
}
#logo hr {
	background-color: #555;
	color: #555;
	border: none;
	border-top: 1px rgba(0,0,0,0.3) solid;
	height: 2px;
	margin: 10px 20%;
}
#phoneblock {
	position:absolute;
	top:56px;
	right:80px;
}
#phoneblockmobile {
	visibility:hidden;
	display:none;
	position:absolute;
	top:10px;
	left:50%;
	margin-left:-130px;
	font-family: Montserrat;
	color: #E3ECF4;
	font-size: 14px;
}
#phone {
	font-weight: normal;
	font-family: Merriweather; 		/* redesign: per navigation style  */
	font-size: 33px; 				/* redesign: per navigation style  */
	color: #C27830; 		    	/* redesign: per navigation style  */
	border-top:4px #5489C6 solid;
	border-bottom:4px #5489C6 solid;
}
#phone2 {
	font-weight: bold;
	font-family: Merriweather; 		/* redesign: per navigation style  */
	font-size: 18px; 				/* redesign: per navigation style  */
	color: #1D3361; 		    	/* redesign: per navigation style  */
	padding-top:4px;
	text-align:center;
}
.phone3 {
	font-weight: bold;
	font-family: Merriweather; 		/* redesign: per navigation style  */
	font-size: 20px; 				/* redesign: per navigation style  */
	color: #1D3361; 		    	/* redesign: per navigation style  */
	padding:6px 0 10px 0;
	white-space:nowrap;
}
/* ======== MAIN NAVIGATION AREA ======== */
#topnav {
	text-align:right;
	height: 40px;
	color: white;
	margin: 0 auto;
	width: 90%;
	text-transform: uppercase;	
}
#topnav li {
	display: inline-block;
	background: transparent;
	position: relative;
	z-index: 500;
	margin: 0 -2px 0 -3px;
	padding: 0;
	text-align: left;
}
/* this is the parent menu */
#topnav li a {
	display: inline-block;
	padding: 16px 10px 13px 10px; /*redesign: asjusted left/right padding from 15px to 10px to fix entire menu */
	text-decoration: none;
	font-weight: normal;
	font-family: Merriweather; 	/* redesign: per navigation style  */
	font-size: 13px; 			/* redesign: per navigation style  */
	color: #E3ECF4; 		   	/* redesign: per navigation style  */
	text-transform: uppercase;	/* redesign: per navigation style  */
	text-align: left;
	-webkit-transition: all 0.3s ease 0.0s;
	transition: all 0.3s ease 0.0s;
}
#topnav li a:hover {
	font-weight:900;
	text-decoration:underline;
}
#mainnav {
  position: absolute;
  top: 140px;
  left: 5%;
	height: 50px;
	color: #000000;
	margin: 0 auto;
	width: 90%;
}
#nav {
	margin: 0;
	padding: 0;
	list-style: none;
	text-align: center;
	text-transform: uppercase;
}
#nav li {
	display: inline-block;
	background: transparent;
	position: relative;
	z-index: 500;
	margin: 0 -2px 0 -3px;
	padding: 0;
	text-align: left;
}
/* this is the parent menu */
#nav li a {
	display: block;
	padding: 16px 10px 13px 10px; /*redesign: asjusted left/right padding from 15px to 10px to fix entire menu */
	text-decoration: none;
	font-weight: normal;
	font-family: Montserrat; 	/* redesign: per navigation style  */
	font-size: 14px; 			/* redesign: per navigation style  */
	color: #333348; 			/* redesign: per navigation style  */
	text-transform: uppercase;	/* redesign: per navigation style  */
	text-align: left;
	-webkit-transition: all 0.3s ease 0.0s;
	transition: all 0.3s ease 0.0s;
}
#nav li a:hover {
	font-weight: normal;
	padding: 16px 10px 13px 10px; /*redesign: asjusted left/right padding from 15px to 10px to fix entire menu */
	color: #ffffff;
	background: #C27830; /*redesign: per Jemsu specification for nav a.hover */
	background-image: -webkit-linear-gradient(top, #C27830, #C57A70, #C27830); 
	background-image: -moz-linear-gradient(top, #C27830, #C57A70, #C27830);
	background-image: -ms-linear-gradient(top, #C27830, #C57A70, #C27830);
	background-image: -o-linear-gradient(top, #C27830, #C57A70, #C27830);
	-webkit-transition: all 0.3s ease 0.0s;
	transition: all 0.3s ease 0.0s;
}
/* submenu, it's hidden by default */
#nav ul {
	position: absolute;
	left: 0;
	display: none;
	margin: 0;
	padding: 0 0 0 0;
	list-style: none;
	box-shadow: 0 3px 8px #000;
}
#nav ul li {
	width: 190px; /* you can increase or decrease width of submenu / increased from 170px */
	float: left;
	padding: 0;
	margin: 0;
	border-radius: 0;
	font-size: 0.90em;
}
#nav ul a {
	display: block;
	height: 18px;
	font-weight: normal;
	text-transform: none;
	padding: 5px 3px 5px 15px;
	color: #000000;
	background: #5489C6;
	border-top: none;
	border-radius: 0;
	box-shadow: none;
}
#nav ul a:hover {
	font-weight: normal;
	color: #ffffff;
	padding: 5px 3px 5px 15px;
	text-transform: none;
	text-decoration: none;
	border-top: none;
	background: #C27830; /*redesign: per Jemsu specification for nav a.hover */
	background-image: -webkit-linear-gradient(top, #C27830, #C57A70, #C27830); 
	background-image: -moz-linear-gradient(top, #C27830, #C57A70, #C27830);
	background-image: -ms-linear-gradient(top, #C27830, #C57A70, #C27830);
	background-image: -o-linear-gradient(top, #C27830, #C57A70, #C27830);
	border-radius: 0;
	box-shadow: none;
}
.selectnav { display: none; 
}
#nav li a.highlightnav {
	color: white;
	height:17px;
	width:171px;
	margin:1px 0 0 0;
	background: #5489C6;
}
#nav li a.highlightnav:hover {
	background: #C27830; /*redesign: per Jemsu specification for nav a.hover */
}
/* ======== MAINIMAGE AREA ======== */
#photoblock { /*
  text-align: left;
  padding: 5%;
	Xbackground: url('../images/slideshowbg.jpg') no-repeat;
	xbackground-size: cover;
	width: 90%;
	border-bottom: 1px #bbb solid;
	box-shadow: inset 0 -15px 15px -15px rgba(0,0,0,0.8);
*/}
#slider {
  position: relative;
  z-index: 10;
  width: 100%;
  box-shadow: 0 0 20px rgba(0, 0, 0, 0.9);
	height: 360px;
/*  max-height:360px; caused the bottom of the pictures to be cropped on some sized browsers */
	height:auto;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}
.nivoSlider {
	position: relative;
	z-index: 20;
	width: 100%;
	height: auto;
	overflow: hidden;
}
.nivoSlider img {
	position: absolute;
	top: 0;
	left: 0;
	max-width: none;
}
.nivo-caption {
	position: absolute;
	bottom: 2%;
	left: 1%;
	background-color: #222;
	color: #ffffff;
	text-align: center;
	width: 40%;
	z-index: 8;
	padding: 10px;
	overflow: hidden;
	display: none;
	opacity: 0.8 !important;
	-webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
	-moz-box-sizing: border-box;    /* Firefox, other Gecko */
	box-sizing: border-box;         /* Opera/IE 8+ */
	border-radius: 5px;
}
.nivo-caption p {
	padding: 0;
	margin: 0;
}
/* ======== SIDEBAR AREAS ======== */
#sidebarLeft {
	float: left;
	width: 23%;
	padding: 0 1% 0 0;
	margin: 0 1% 0 0;
	line-height: 1.4em;
}
#sidebarRight {
	float: right;
	width: 30%; 				/* orig: 23%; */;
	padding: 0 10px 0 1%;
	margin: 0 0 0 1%;
	line-height: 1.4em;
	text-align:center;			/* Added: this will keep images aligned on all widths, but might screw up text */
}
#sidebarRight ul{
	text-align:left;
}
/* ======== CONTENT AREA ======== */
#contentRight {
	float: right;
	width: 73%;
	padding: 0 0 0 1%;
	margin: 0 0 0 1%;
	line-height: 1.5em;
}
#contentLeft {
	float: left;
	width: 64%; 				/* orig: 73%; */
	padding: 0 1% 0 0;
	margin: 0 1% 0 0;
	line-height: 1.5em;
}
#contentMiddle {
	float: left;
	width: 47%;
	padding: 0 1%;
	margin: 0 0.50%;
	line-height: 1.5em;
	overflow: hidden;
}
.color01 { /*white background*/
	clear: both;
  	background-color: #ffffff;
	width: 96%;
	margin: 0;
	padding: 15px 2%;
	line-height: 1.5em;
	border-bottom: 2px #00607a solid;
}
.color02 { /*slideshow background block*/
	clear: both;
	background: #ffffff;
	background-image: -webkit-linear-gradient(bottom, #3bdbff, #ffffff); 
	background-image: -moz-linear-gradient(bottom, #3bdbff, #ffffff);
	background-image: -ms-linear-gradient(bottom, #3bdbff, #ffffff);
	background-image: -o-linear-gradient(bottom, #3bdbff, #ffffff);
	width: 96%;
	margin: 0;
	padding: 15px 2%;
	line-height: 1.5em;
	border-bottom: 2px #00607a solid;
}
.color03 { /*dark background - Jemsu dark grey*/
	clear: both;
	color: #ffffff;
	background: #404041;
	width: 96%;
	margin: 0;
	padding: 15px 2%;
	line-height: 1.5em;
}
.color02 h1, .color02 h2 {color: #000000;}
.color03 h1, .color03 h2 {color: #919191;}
/* ======== SECTION BLOCKS ======== */
.contentBox2 {
	float: left;
	width: 46%;
	padding: 0 1%;
	margin: 0 1%;
	line-height: 1.4em;
}
.contentBox2 h1	 {						/* an h6 without the underline - initially used for home page SEO content */
	font-family: Montserrat;
	font-size:16px;
	font-weight:400;
	color: #00607a;
	margin: 0;
	line-height:16px;
}
.contentBox3 {
	float: left;
	width: 29.33333%;
	padding: 0 1%;
	margin: 0 1%;
	line-height: 1.4em;
}
.contentBox4 {
	float: left;
	width: 21%;
	padding: 0 1%;
	margin: 0 1%;
	line-height: 1.4em;
}
.contentBox4mobile {
	float: left;
	width: 21%;
	padding: 0 1%;
	margin: 0 1%;
	line-height: 1.4em;
}
.alpha {padding: 0 2% 0 0; margin: 0 2% 0 0;}
.omega {padding: 0 0 0 2%; margin: 0 0 0 2%;}

/* adds a border to the bottom of a div */
.catalog {
	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;
}
/* ======== FOOTER AREA ======== */
footer {
	clear: both;
	width: 98%;
	margin: 0;
	padding: 20px 1%;
	line-height: 1.5em;
	X-box-shadow: inset 0 16px 10px -10px rgba(0,0,0,0.9);
	color: #ffffff;
	font-size: 0.85em;
}
footer ul {
	list-style-type: none;
	line-height: normal;
	margin: 0;
	padding: 0;
}
footer ul li {
	margin: 0;
	background: url('../css/images/bullet02.png') no-repeat 0 3px;
	padding: 0 0 0 18px;
}
footer ul li a {
	color: #c3e3f4;
	text-decoration: none;
	font-weight: normal;
	letter-spacing: 2px;
	line-height:20px;
}
footer ul li a:hover {
	color: #919191;
	text-decoration: underline;
	font-weight: normal;
}
footer a {
	color: #c3e3f4;
	font-weight: normal;
}
footer a:hover {
	color: #919191;
	font-weight: normal;
}
footer hr {
	width: 90%;
	margin: 10px 5%;
	background-color: #444;
	color: #444;
	border: none;
	border-top: 1px rgba(0,0,0,0.7) solid;
	height: 2px;
}
footer h4 {
	font-family: Montserrat;
	line-height: 22pt;
	text-transform: uppercase;
	font-size:14px;
	color:#fbfbfb;
	margin: 0.5em 0;
	text-align: left;
}
.socialmedia {
   margin: 10px 5%;
  letter-spacing: 10px;
  text-align: center;
}
/* ======== CONTACT FORM ======== */
form.contactform {
	width: 99%;
	text-align: left;
}
.contactform label {
  width: 99%;
  text-align: left;
  font-style: italic;
	line-height: 1.5em;
	display: block;
	margin-bottom: 4px;
}
.contactform input {
  width: 99%;
  border: 1px #c0c0c0 solid;
  background-color: #efefef;
  padding: 5px;
  margin-bottom: 10px;
	color: #000000;
	border-radius: 5px;
}
.contactform textarea {
  width: 99%;
  border: 1px #c0c0c0 solid;
  background-color: #efefef;
  padding: 5px;
  resize:none;
	color: #000000;
	border-radius: 5px;
}
.contactform .submit {
  width: 100px;
  margin: 10px 0 0 0;
  cursor: pointer;
	color: #fff;
	text-shadow: 0 1px 1px #202020;
	font-size: 11px;
	font-weight: normal;
	padding: 6px 10px;
	text-decoration: none;
	background: #00607a;
	background-image: -webkit-linear-gradient(top, #3bdbff, #00607a); 
	background-image: -moz-linear-gradient(top, #3bdbff, #00607a);
	background-image: -ms-linear-gradient(top, #3bdbff, #00607a);
	background-image: -o-linear-gradient(top, #3bdbff, #00607a);
	border: solid 1px #00607a;
	border-radius: 3px;
	box-shadow: 0 1px 2px rgba(0, 0, 0, 0.5);
}
.contactform .submit:hover {
  width: 100px;
  margin: 10px 0 0 0;
  cursor: pointer;
	color: #fff;
	font-size: 11px;
	font-weight: normal;
	text-decoration: none;
	background: #919191;
	background-image: -webkit-linear-gradient(top, #919191, #919191); 
	background-image: -moz-linear-gradient(top, #919191, #919191);
	background-image: -ms-linear-gradient(top, #919191, #919191);
	background-image: -o-linear-gradient(top, #919191, #919191);
	border: solid 1px #919191;
}
/* ======= PHOTO GALLERY ========= */
.photogallery {
  background-color: #E3ECF4;
  border: 15px #ffffff solid;
  padding: 10px;
  margin: 0 2% 40px 2%;
  text-align: center;
  box-shadow: 0 5px 15px -4px 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);
}
.photogallery p {
  text-align: left;
}
.photogallery ul {
  text-align: left;
}
.photogallery hr {
	background-color:#5489C6;
	width:85%;
	margin-top:-30px;
	margin-bottom:20px;
}

/* ======= TABBED CONTENT ======== */
ul.tabs {
	margin: 20px 0 0 0;
	padding: 0;
	float: left;
	list-style: none;
	height: 32px;
	border-bottom: 1px solid #bbb;
	border-left: 1px solid #bbb;
	width: 100%;
	border-radius: 10px 0 0 0;
}
ul.tabs li {
	font-family: Montserrat;
	text-transform: uppercase;
	float: left;
	margin: 0;
	cursor: pointer;
	padding: 0px 25px;
	height: 31px;
	line-height: 31px;
	border: 1px solid #bbb;
	border-left: none;
	color: white;
	background: #1D3361;
	background-image: -webkit-linear-gradient(top, #5489C6, #1D3361); 
	background-image: -moz-linear-gradient(top, #5489C6, #1D3361); 
	background-image: x-ms-linear-gradient(top, #5489C6, #1D3361); 
	background-image: -o-linear-gradient(top, #5489C6, #1D3361); 
	overflow: hidden;
	position: relative;
	border-radius: 10px 10px 0 0;
}
ul.tabs li:hover {
	background: #fff;
	background-image: -webkit-linear-gradient(top, #fff, #bbb); 
	background-image: -moz-linear-gradient(top, #fff, #bbb);
	background-image: -ms-linear-gradient(top, #fff, #bbb);
	background-image: -o-linear-gradient(top, #fff, #bbb);
	color: #000;
}	
ul.tabs li.active{
	background: #E3ECF4;	/* Jemsu lightgray */
	color: #000000;
	border-bottom: 1px solid #ffffff;
}
.tab_container {
	border: 1px solid #bbb;
	border-top: none;
	clear: both;
	float: left; 
	width: 100%;
	background-color: #E3ECF4;	/* Jemsu lightgray */
	margin-bottom: 20px;
}
.tab_content {
	padding: 20px;
	font-size: 0.90em;
	display: none;
	line-height: normal;
}
/* ======== 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;
}
.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 ======== */
p.comment {
	background: url('../css/images/comment.png') no-repeat 0 3px;
	padding: 0 0 5px 25px;
}
p.home {
	background: url('../css/images/home.png') no-repeat 0 3px;
	padding: 0 0 5px 25px;
}
p.phone {
	background: url('../css/images/phone.png') no-repeat 0 2px;
	margin:0px;
	padding: 0 0 0px 25px;
}
p.phone2 {
	margin: 0px 0 5px 26px;
}
p.email {
	background: url('../css/images/email.png') no-repeat 0 3px;
	padding: 0 0 5px 25px;
}
p.hours {
	background: url('../css/images/clock.png') no-repeat 0 3px;
	padding: 0 0 5px 25px;
}
p.authorDate {
  font-size: 0.90em;
  border-bottom: 1px #777 dashed;
  text-transform: uppercase;
  font-weight: lighter;
  color: #777;
  margin: 0;
  padding: 0;
}
.responsive img {
	max-width:100%;
	height:auto;
}
.center {
	text-align: center;
}
.right {
	text-align: right;
}
.small {
	font-size: 0.85em;
}

.clear      {height: 0; line-height: 0; margin: 0; padding: 0; clear: both;}
.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;}

dt.question {
	font: normal 1.3em Georgia, Garamond, serif;
	color: #444;
	font-variant: small-caps;
	padding: 3px 10px;
	margin: 10px 50px 0 50px;
	border-bottom: 1px #444 solid;
}
dd.answer {
	padding: 0 0 30px 0;
	margin: 0 100px;
	display: block;
}
.highlight {
	background-color: #FFFF00;
	color: #000;
}
/* for new Regent drop-down search box, initially hidden */
.searchwrapper {
	display:none;
	background: #5489C6;
	padding: 0 12px;
	width:167px;
	position:absolute;
	top:100px;
	left:100px;
	z-index: 20; /* to get it over the photoblock */
}
.searchselectrow {
	X-background: #5489C6 url("../images/icons/searchbg.png") no-repeat right;
	padding:6px;
}
.searchselect {
	background: white; /*transparent;*/
	color: #1D3361;
	font-family: Merriweather;
	font-weight: bold;
	font-size: 11px;
	width: 155px;
	height: 30px;
}
.searchselectrow.center {
	X-background: #5489C6 url("../images/icons/searchbg.png") no-repeat right;
	padding: 6px;
	text-align: center;
}
.searchselect.wide {
	background: white; /*transparent;*/
	color: #1D3361;
	font-family: Merriweather;
	font-weight: bold;
	font-size: 16px;
	width: 80%;
	height:30px;
}
.searchlastrow {
	padding: 10px 0px 10px 0px;
	text-align: center;
}
.searchbtn, .popupQuoteForm_open {
  -webkit-border-radius: 3;
  -webkit-box-shadow: 0px 1px 3px #666666;  
  -moz-border-radius: 3;
  -moz-box-shadow: 0px 1px 3px #666666;
  border-radius: 3px;
  box-shadow: 0px 1px 3px #666666;
  
  font-family: 'Montserrat';
  color: #fbfbfb;
  font-size: 16px;
  text-transform: uppercase;
  background: #C27830;
  padding: 10px 14px 10px 14px;  
  text-decoration: none;
  cursor:pointer;
}
.searchbtn:hover, .popupQuoteForm_open:hover {
  background: rgb(170,106,46);
}
.slidebtn {				/* same as searchbtn, without shadows */
  -webkit-border-radius: 6px;
  -webkit-box-shadow: none;
  -moz-border-radius: 6px;
  -moz-box-shadow:none;
  border-radius: 6px;
  box-shadow:none;

  font-family: 'Montserrat';
  color: #fbfbfb;
  font-size: 16px;
  text-transform: uppercase;
  background: #C27830;
  padding: 10px 20px 10px 20px;  
  text-decoration: none;
}
/* ======== VIDEO CLASSES ======== */

.videoRight {
	max-width: 450px; 
	width: 100%; 
	float: right;
	margin:20px;
}
.videoLeft {
	max-width: 450px; 
	width: 100%; 
	float: left;
	margin:20px;
}
.videoWrapper {
	position:relative;
	padding-bottom:56.25%;
	padding-top:30px;
	height:0;
	overflow:hidden;
}
.videoWrapper IFRAME, .videoWrapper iframe, .videoWrapper object, .videoWrapper embed {
	position:absolute;
	top:0;
	left:0;
	width:100%;
	height:100%;
}
/* =======================  New for AZA, for embedded videos ================================================= */
.youtube-container { display: block; margin: 20px auto; width: 100%; max-width: 600px; }
.youtube-title {
	font-family: 'Montserrat';
	font-size: 14px;
	font-weight:normal;
	line-height:30px;
	text-transform: uppercase;
	color: #ffffff;		
	background-color:#5489C6;
}
.youtube-player { display: block; width: 100%; /* assuming that the video has a 16:9 ratio */ padding-bottom: 56.25%; overflow: hidden; position: relative; width: 100%; height: 100%; cursor: hand; cursor: pointer; display: block; }
img.youtube-thumb { bottom: 0; display: block; left: 0; margin: auto; max-width: 100%; width: 100%; position: absolute; right: 0; top: 0; height: auto }
div.play-button { height: 72px; width: 72px; left: 50%; top: 50%; margin-left: -36px; margin-top: -36px; position: absolute; background: url("../images/buttons/videoPlay4.png") no-repeat; }
div.play-button:hover { height: 72px; width: 72px; left: 50%; top: 50%; margin-left: -36px; margin-top: -36px; position: absolute; background: url("../images/buttons/videoPlay1.png") no-repeat; }
#youtube-iframe { width: 100%; height: 100%; position: absolute; top: 0; left: 0; }

/* ======================================= MEDIA QUERIES ==================================================== */

/* ========================================================== */
/* ================ CELL PHONE - PORTRAIT VIEW ============== */
/* ========================================================== */
@media screen and (max-width: 320px) {
	#wrapper {
  	width: 96%;
  	margin: 0 2% 20px 2%;}
	#logo h1 {
    font-size: 1.5em;}
  #logo h2 {
    font-size: 0.80em;}
/* ===== navigation ===== */
	.js #nav {display: none;}
	.js .selectnav {display: block;}
	 select#selectnav1 {
    background-color: transparent; 
    color: black; /* #ffffff;  since on top of white background */
    width: 260px; 
    margin: 0px auto 0 auto; 
    padding: 14px; 
    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 ===== */
	#slider {
	width: 100%;
	height: auto;}
	.nivo-caption {visibility: hidden; display: none;}
	.nivo-caption p {visibility: hidden; display: none;}
/* ===== tabbed content ===== */
	ul.tabs, .tab_container {
    visibility: hidden; 
    display: none;}
/* ===== miscellaneous ===== */
	#phoneblock, #topnav {visibility:hidden; display: none;}
	#phoneblockmobile {visibility:visible;display:block;font-size:12px;margin-left:-110px;}
	blockquote.leftside, blockquote.rightside {visibility: hidden; display: none;}
	.contentBox2, .contentBox3, .contentBox4, #sidebarLeft, #sidebarRight, #contentRight, #contentLeft, #contentMiddle {
    	width: 98%; 
    	margin: 1%; 
    	padding: 0;
    }
  	.catalog {margin-bottom: 20px;}
	dt.question {
    	padding: 10px 0 0 30px; 
    	margin: 0 5px;
    }
	dd.answer {margin: 0 20px;}
	
	footer section.contentBox4 			{visibility: hidden; display: none;}
	footer section.contentBox4mobile 	{visibility: hidden; display: none;}	
	
	footer hr {display: none;}
}

/* ========================================================== */
/* =============== CELL PHONE - LANDSCAPE VIEW ============== */
/* ========================================================== */
@media screen and (max-width: 480px) and (min-width: 321px) {
	#wrapper {
  	width: 96%;
  	margin: 0 2% 20px 2%;}
	#logo h1 {
    font-size: 1.7em;}
  #logo h2 {
    font-size: 0.80em;}
/* ===== navigation ===== */
	.js #nav {display: none;}
	.js .selectnav {
    display: block;}
	 select#selectnav1 {
    background-color: transparent; 
    color: black; /* #ffffff;  since on top of white background */
    width: 260px; 
    margin: 0px auto 0 auto; 
    padding: 14px; 
    font-size: 1.0em; 
    letter-spacing: 1px; 
    border: none;}
	select#selectnav1 option {
    background-color: #efefef; 
    color: #000000; 
    font-size: 0.80em; 
    padding: 1px 10px;}
/* ===== main image area ===== */
	#slider {
	width: 100%;
	height: auto;}
	.nivo-caption {visibility: hidden; display: none;}
	.nivo-caption p {visibility: hidden; display: none;}
/* ===== tabbed content ===== */
	ul.tabs, .tab_container {
    visibility: hidden; 
    display: none;}
/* ===== miscellaneous ===== */
	#phoneblock, #topnav {visibility:hidden;}
	#phoneblockmobile {visibility:visible;}	
	blockquote.leftside, blockquote.rightside {visibility: hidden; display: none;}
	.contentBox2, .contentBox3, .contentBox4, #sidebarLeft, #sidebarRight, #contentRight, #contentLeft, #contentMiddle {width: 98%; margin: 1%; padding: 0;}
  .catalog {margin-bottom: 20px;}
	dt.question {padding: 10px 0 0 30px; margin: 0 5px;}
	dd.answer {margin: 0 20px;}
	footer section.contentBox4 			{visibility: hidden; display: none;}
	footer section.contentBox4mobile 	{visibility: hidden; display: none;}		
	footer hr {display: none;}
}

/* ========================================================== */
/* ============== SMALL TABLET - PORTRAIT VIEW ============== */
/* ========================================================== */
@media screen and (max-width: 623px) and (min-width: 481px) {
	#wrapper {
  	width: 96%;
  	margin: 0 2% 20px 2%;}
	#logo h1 {
    font-size: 2.0em;}
  #logo h2 {
    font-size: 0.80em;}
/* ===== navigation ===== */
	.js #nav {display: none;}
	.js .selectnav {
    display: block;}
	 select#selectnav1 {
    background-color: transparent; 
    color: black; /* #ffffff;  since on top of white background */
    width: 260px; 
    margin: 0px auto 0 auto; 
    padding: 14px; 
    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 ===== */
	#slider {
	width: 100%;
	height: auto;}
/* ===== tabbed content ===== */
	ul.tabs li {padding: 0px 5px; font-size: 0.90em;}
/* ===== miscellaneous ===== */
	#phoneblock, #topnav {visibility:hidden;}
	#phoneblockmobile {visibility:visible;}		
	blockquote.leftside, blockquote.rightside {visibility: hidden; display: none;}
	.contentBox3, .contentBox4, #sidebarLeft, #sidebarRight, #contentRight, #contentLeft, #contentMiddle {width: 98%; margin: 1%; padding: 0;}
	.contentBox4.catalog {width: 48%; margin-bottom: 20px;}
	dt.question {padding: 10px 0 0 30px; margin: 0 5px;}
	dd.answer {margin: 0 20px;}

	/* turn off two of the boxes, and resize the remaining two for approx 50% wide */
	footer section.contentBox4 {width: 46%; margin: 0 2%; padding: 0;}
	footer section.contentBox4mobile 	{visibility: hidden; display: none;}	
}

/* ========================================================== */
/* ============= SMALL TABLET - LANDSCAPE VIEW ============== */
/* ========================================================== */
@media screen and (max-width: 800px) and (min-width: 769px) { /* responsiView 'Table Portrait' fits here */ 
	#wrapper {
  	width: 96%;
  	margin: 0 2% 20px 2%;}
	#logo h1 {
    font-size: 2.1em;}
  #logo h2 {
    font-size: 0.85em;}
/* ===== navigation ===== */
	.js #nav {display: none;}
	.js .selectnav {
    display: block;}
	 select#selectnav1 {
    background-color: transparent; /* transparent; */
    color: black; /* #ffffff;  since on top of white background */
    width: 260px; 
    margin: 0px auto 0 auto; 
    padding: 14px; 
    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 ===== */
	#slider {
	width: 100%;
	height: auto;}
/* ===== tabbed content ===== */
	ul.tabs li {padding: 0px 5px; font-size: 0.90em;}
/* ===== miscellaneous ===== */
	.GridOffer {width:200px;}
	.GridOfferImage{max-width:200px;}

	blockquote.leftside, blockquote.rightside {visibility: hidden; display: none;}
	.contentBox4.catalog {width: 48%; margin-bottom: 20px;}
	dt.question {padding: 10px 0 0 30px; margin: 0 5px;}
	dd.answer {margin: 0 20px;}
	.image-googlemap {max-width: 90%;}
	.contentBox4 {width: 48%; margin: 0 1%; padding: 0;}
	
	/* original css footer section.contentBox4 is too wide:
	footer section.contentBox4 {width: 46%; margin: 0 2%; padding: 0;}
	changed to: 																*/
	footer section.contentBox4 			{width: 20%; margin: 0 2%; padding: 0;}
	footer section.contentBox4mobile 	{width: 20%; margin: 0 2%; padding: 0;}
}

/* ========================================================== */
/* ============== LARGE TABLET - PORTRAIT VIEW ============== */
/* ========================================================== */
@media screen and (max-width: 768px) and (min-width: 624px) {  /* ipad portrait uses these */
	#wrapper {
  	width: 96%;
  	margin: 0 2% 20px 2%;}
	#logo h1 {
    font-size: 2.1em;}
  #logo h2 {
    font-size: 0.95em;}
/* ===== navigation ===== */
	.js #nav {display: none;}
	.js .selectnav {
    display: block;}
	 select#selectnav1 {
    background-color: #efefef; 
    color: #1D3361; /* #ffffff;  since on top of white background */
    width: 260px; 
    margin: 14px auto 0 auto; 
    padding: 14px; 
    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 ===== */
	#slider {
	width: 100%;
	height: auto;}
/* ===== tabbed content ===== */
	ul.tabs li {padding: 0px 5px; font-size: 0.90em;}
	/* ===== miscellaneous ===== */
	blockquote.leftside, blockquote.rightside {visibility: hidden; display: none;}
	dt.question {padding: 10px 0 0 30px; margin: 0 5px;}
	dd.answer {margin: 0 20px;}
	.image-googlemap {max-width: 90%;}
	.contentBox4.catalog {width: 48%; margin-bottom: 20px; padding: 0;}
	Xfooter section.contentBox4 			{width: 20%; margin: 0 2%; padding: 0;}
	Xfooter section.contentBox4mobile 	{width: 20%; margin: 0 2%; padding: 0;}	
	.detailbox.tabletOFF {visibility:hidden;display:none;}
}

/* ========================================================== */
/* ======== LARGE TABLET PORTRAIT/DESKTOP/LAPTOP VIEW ======= */
/* ========================================================== */
@media screen and (max-width: 1250px) and (min-width: 801px) {
	#wrapper {
  	width: 96%;
  	margin: 0 2% 20px 2%;}
/* ===== main image area ===== */
	#slider {
	width: 100%;
	height: auto;}
/* ===== tabbed content ===== */
	ul.tabs li {padding: 0px 5px;font-size: 0.90em;}
/* ===== navigation ===== */
}
