/* ------------------------------GLOBAL and MICRO below 280px--------------------------
--------------------------------------------------------------------------------*/

body {margin-top: 0; background:#24313d; font-family:helvetica,verdana,arial,sans-serif; font-size: 0.9em; font-weight:100;}

marquee {color:red;}

/*flexible images*/
img {max-width: 100%; height: auto; 
width: auto\9; /* ie8 */
}  

 /* flexible videos8 */
.video embed, .video object, .video iframe {width: 100%; height: auto;} 

#main p, .sidebox   {line-height: 1.3em;}
.sidebox a, #footer a, .sm {line-height:1.6em;}
img {border:0;}
.callout, .scallout, .code {border:1px dashed #21445e;}
.hr {margin:10px 0px 10px 0px; border-bottom:1px dashed  #3a6f99;}
.button, .btn {border:3px double #3a6f99; background:#f4eedc;}

.ul li {margin-bottom:0.5em;}
.navbox ul {list-style-type:none;}

p.small {color:#000000;}
h1, h2, h3, h4 {color: #21445e;}
.red {color:red;}

a:link, a h1 {color: #3a6f99;} 
a:link, a h1, .navbox a:link, .navbox a:visited, .button a {text-decoration:none; border-bottom:none;}
p a:link { font-weight:400;}
a:visited {color: #72879a;}
p a:hover {border-bottom:1px solid;}
#submenu a:hover, #submenu a:active {border-top:4px double; border-bottom:4px double;}
.sidebox h2, fieldset, .navbox a:link, .navbox a:visited {color:#d6be78;}
.navbox a:hover, .navbox a:active {color:#fef6bd;}
.button:hover, .button:focus, .button:active {background:#fffcf2;}
.btn:hover, .btn:focus {color:#ea6631; background:#fff;}
.sm a:active {background:#bfbbae;}

h1, h2, h3, h4, #submenu, #footer, .sidebox h2, .preview, .sm, .button, .navbox  {text-align:center;}
.leftimgtext, .rightimgtext, .previewtext {text-align:left;}
em, .leftimgtext, .rightimgtext {font-style:italic;}
h1, h2, h3, h4, #submenu, .sm, .sidebox h2, .button, .navbox, .fm  {font-variant:small-caps;}
.btn {text-transform:uppercase;}
h1, h2, h3, h4, a:visited h1, em, #submenu, .leftimgtext, .rightimgtext, .btn, .button, fieldset span, .sm, .navbox, .fm  {font-family:"times new roman", serif;}
p.small, .previewtext {font-family:verdana, arial, sans-serif;}

p.small, .quotename, #footer, .previewtext {font-size:0.75em;}
.sidebox {font-size:0.85em;}
.leftimgtext, .rightimgtext {font-size:1.05em;}
em, #submenu, #navboxcontainer a, #header span, .button span { font-size:1.1em;}
.sm, .navbox, .fm {font-size:1.2em;}
.sm {line-height:1.5em;}
h1, h2, h3, h4, .sidebox h2, .navbox {font-weight:100;}
h2 b, #submenu b, .fm b {font-size:0.6em}

.clr {clear:right;}
.cll {clear:left;}
.clearboth {clear:both;}
#hdlink {width:90%; height:90px; background:url('shared/transp.png');}

hr {
margin:15px auto 15px;
border:0; height:1px;
background-image:-webkit-linear-gradient(left, rgba(0,0,0,0), rgba(0,0,0,0.75), rgba(0,0,0,0));
background-image:-moz-linear-gradient(left, rgba(0,0,0,0), rgba(0,0,0,0.75), rgba(0,0,0,0));
background-image:-ms-linear-gradient(left, rgba(0,0,0,0), rgba(0,0,0,0.75), rgba(0,0,0,0));  }


/*.......................................................PAGE ELEMENTS .............*/

#container {width: 100%; margin: 0; background:#ede7d6;}
#main, #sideone, #sidetwo {width:92%; margin:10px;}
#footer {width:90%; clear:both; margin:auto; margin-bottom:50px;}
#header {width: 100%; height:85px; margin:auto; background:#21445e;}
.hdimg {height:85px; background:url('shared/hwcs.png') center no-repeat;}  
#navboxcontainer {width:90%; margin:60px auto 0px;}
#submenu {width:95%; height:50px; position:absolute; top:88px; padding-top:10px;}
.sidebox {padding:0;}
.sidebox h2 {padding:4px 0px; border-top:4px double  #f0d587; border-bottom:4px double  #f0d587; background:#21445e;}
#su {display:none;}

/*............................................MENU...............................................*/

.navbox:active {background:#62819a;} 
.navbox:active {
background: -webkit-gradient(linear, left top, left bottom, from(#3a6f99), to(#94c1e7));
background: -moz-linear-gradient(top,  #3a6f99,  #94c1e7);
filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#3a6f99', endColorstr='#94c1e7');}

span.navlrg, .drop {display:none;}
.navbox {max-width:260px;  height:20px; margin:4px auto; padding:7px 10px 12px; border-top:3px double #f0d587; border-bottom:3px double #f0d587; background:#21445e;}	

.navbox ul {margin:0 0 0 -40px;}

.navbox a {display:block;}  /* display the link ~a~  as block makes whole box clickable */


/* ----------SECTION MENU---------*/

.sm {position:relative; display:block; max-width:260px; margin:10px auto;}

/*  ........................................ FORM ............... */

.signup {max-width:230px;}
fieldset {border:0; background:#21445e; padding:10px 20px 10px 20px; margin: 10px 0;}
fieldset span {font-size:1.8em;}
fieldset .mc-field-group {margin: 0px; clear: both; overflow: hidden;}
label {display: block; margin: 16px 0 0 0;}
input .required {margin-right: 5px;padding: .2em .3em; width: 90%; float: left; z-index: 999; background:#fefcee;}
.mce-responses {float: left; top:-1.4em; padding: 0em .5em 0em .5em; overflow: hidden; width: 90%; margin: 0 5%; clear: both;}
.error, .success {display: none; margin: 1em 0; padding: 1em .5em .5em 0; font-weight: bold; float:left; top:-1.5em; z-index:1; width: 80%; background: #fbe3e4;}
.error {color: #d12f19;}
.success {color: #3a6f99;}
.btn {display: block; margin: 10px 0 0px 0px; padding:6px; color:#3a6f99;}
form.validate {font: normal 100% verdana, sans-serif;font-size: 8pt;}
            
.button {width:8em; padding:5px;}
button:hover {background: #ededed;}


/* ........................................................... INCLUSION ITEMS .......................................... */

/*....................... LEFT and RIGHT CAPTION IMAGE....... */
.leftimg, .rightimg {max-width:240px; margin:0 0 10px 0;}
.leftimg img, .rightimg img {border:0;}
.leftimgtext, .rightimgtext {margin:5px 10px 10px 0;}


/*...................LEFT and RIGHT IMAGE UNRESTRICTED.........*/
img.left, img.right {display:block; margin:0 15px 15px 0;}


/*......................LONG TEXT GALLERY............*/
.ltg {float:left; margin-bottom:15px; padding:15px; border:1px dashed  #21445e;}
.ltg img {display:block; margin:0 auto 10px ;}
.ltg h3 {margin-top:0;}
.ltg p {margin-top:0;}

/*......................CAPTION GALLERY..........*/
.previewwrapper {height:180px;}
.preview {height:170px; width:110px; float: left; margin:8px 4px 7px 0; padding:4px; border:solid #62819a 1px;}
.previewtext {margin: 3px;}
.preview img {height:90px;width:110px;}

/* ..........................CALLOUT .........*/
.callout {max-width:200px; float:right; margin:0 0 15px 15px; padding:15px 30px;}
.callout img {float:left; margin: 0 20px 10px 0;}

/* ..........................SALES PAGE CALLOUT .........*/
.scallout {max-width:400px; float:left; margin:0 15px 15px 0; padding:30px;}
.scallout img {float:right; margin: 0 0 10px 20px;}


/*.......................CODE BOX ....... */
.code {padding:15px; margin:20px 0 20px 0;}


/* ---------------end GLOBAL and MICRO -----------------*/




/* --------------------------------------MQ  MINI min 310px--------------------------------------
-------------------------------------------------------------------------------------------------*/

/* Mini screen! */ @media screen and (min-width: 310px) {

/*.............................................PAGE ELEMENTS...............................*/

#container {width: 98%; margin: 0 auto;}
#main {width:90%; margin:7px 5% 10px 5%;}
#header {width: 100%; height:110px; background:#21445e url('shared/hdbg.png') repeat-x  center;}
.hdimg {height:110px; background:url('shared/hwcs.png') center no-repeat;}
#navboxcontainer {width:100%; margin-top:40px;}
#submenu {width:98%; height:30px; padding:0px; top:123px;}
#sideone {width:90%; margin:7px 5% 10px 5%;}
#sidetwo {width:90%; margin:7px 5% 10px 5%;}


} /* ---------------end MQ MINI ---------------------*/




/* ----------------------------------------MQ  MEDIUM min 640px----------------------------------
----------------------------------------------------------------------------------------------------------*/

@media screen and (min-width: 640px) 
{

h1, h2, h3, h4 {text-align:left;}
.button {-moz-box-shadow: 1px 1px 5px #c0b89c; -webkit-box-shadow: 1px 1px 5px #c0b89c; box-shadow: 1px 1px 5px #c0b89c;}

/*.......................................................PAGE ELEMENTS .............*/

#container {width:100%;z-index:-1; margin:auto;}
#wrapper {width:100%; z-index:3;}
#main {width:62%; float:left; margin:0px 0 10px 15px;}
#sideone {width:30%; float:right; margin:0 15px 20px 0;}
#sidetwo {width:30%; float:right; clear:right; margin:0 15px 20px 0;}
#su {display:block;}

/*............................................MENU...............................................*/

#navboxcontainer {width:510px; height:250px; margin:40px auto 0;} 
.navbox {width:220px; height:57px; float:left; margin:4px; padding:5px 15px 6px 5px; border:3px double #24313d;}
.navbox li { line-height:3em;} 

.navbox ul {margin-left:-40px;}
#s1, #s2, #s3, #s4, #s5, #s6 {height:57px; width:57px; float:left; margin-right:10px;} 
#s1{background:url('shared/m_castle.jpg');}
#s2{background:url('shared/m_church.jpg');}
#s3{background:url('shared/m_shire.jpg');}
#s4{background:url('shared/m_stokes.jpg');}
#s5{background:url('shared/m_river.jpg');}
#s6{background:url('shared/m_today.jpg');}

/* ........................................................... INCLUSION ITEMS ................................ */

/*....................... LEFT CAPTION IMAGE....... */
.leftimg {float:left; max-width:240px; margin:5px 15px 10px 0;}
.leftimg img {border:0;}
.leftimgtext {margin:5px 10px 10px 0;}

/*.....................RIGHT CAPTION IMAGE....... */
.rightimg {float:right; max-width:240px; margin:5px 0 10px 15px;}
.rightimg img {border: 0;}
.rightimgtext {margin:5px 10px 10px 0;}


/*...................LEFT IMAGE UNRESTRICTED.........*/
img.left {float:left; margin:0 15px 15px 0;}

/*...................RIGHT IMAGE UNRESTRICTED.........*/
img.right {float:right; margin:0 0 15px 15px;}

/*......................LONG TEXT GALLERY............*/
.ltg {margin-bottom:15px; padding:30px 35px 20px; border:1px dashed  #21445e;}
.ltg img {display:inline; float:left; margin: 0 20px 10px 0;}

/* ..................CALLOUT SHADOW .......... */
.callout, .scallout {border:1px solid #d9d1bb;
-moz-box-shadow: 1px 1px 10px #c0b89c;              
-webkit-box-shadow: 1px 1px 10px #c0b89c;
box-shadow: 1px 1px 10px #c0b89c;}


}   /* ---------------END MQ  MEDIUM -------------*/




/* --------------------------MQ  LARGE min 980px-------------------------------
--------------------------------------------------------------------------------*/

/* Desktop */ @media screen and (min-width: 980px) {

h1 {font-size:2.3em;}
h3 {font-size:1.3em;}
h4 {font-size:1.2em;}

/*.......................................................PAGE ELEMENTS .............*/


#container {width:960px;}
#header {width:960px; height:249px; position:absolute; top:0; background:url('shared/banner.jpg');}
#navboxcontainer {width:795px; height:140px; position:absolute; z-index:4; margin-left:78px;top:255px;}
#submenu {width:960px; top:260px; text-align:center;}
#wrapper {margin-top:245px;}
#main {width:550px; margin:190px 0 0 65px; padding:7px 10px 10px 0px;}
#sideone {width:230px; margin:200px 65px 20px 0;}
#sidetwo {width:230px; margin:0 65px 20px 0;}

/*............................................MENU...............................................*/

.hdimg {height:210px; background:url('shared/transp.png');}
#hdlink {width:90%; height:250px; background:url('shared/transp.png');}
#header a:link {width:960px; height:220px;}

.drop li  {font-size:1.2em; line-height:1.4em;}
.drop a:link {color: #3a6f99;}
.drop a:visited {color: #72879a;}

.navbox {height: 122px; width: 110px; margin: 0px 2px 7px 2px; padding:5px; border:4px double #998e79; text-align: center; font-size:0.9em;}

span.navlrg {display:inline;}
.sm {display:none;}

#navboxcontainer ul , ul ul {
display:block;
margin:0;   /*margin and padding of link */
padding:0;}

#navboxcontainer ul ul {   /*drop down box*/
display:none;  /*hiding box from parent*/
width:220px;
top:12px;  /*position of box to link parent */
left:0px;    /*position to link parent */
list-style-type:none;
border:1px solid #aaa;}

#navboxcontainer  li { 
display:block;   /*parent links*/
padding:10px 0;  /*box position and space between link parent*/
margin: 0; /*between child links and to inside of box*/
}

#navboxcontainer  li ul li {   /*drop down box*/
position:relative;
z-index:98;
padding:2px 10px 5px 10px;  /*around child links*/
border-top:1px solid #fff; border-bottom:1px solid #bbb; background:#fffbf3;
font-size:1.1em;}

#navboxcontainer  li ul li:hover {background:#e0e0d0;}
#navboxcontainer  li:hover ul  {display:block;; background:#fff;}

#s1, #s2, #s3, #s4, #s5, #s6 {height:90px;width:110px; margin:0 auto;} /*bottom margin pushes text down */
#s1{background:url('shared/castle.jpg');}
#s2{background:url('shared/church.jpg');}
#s3{background:url('shared/shire.jpg');}
#s4{background:url('shared/stokes.jpg');}
#s5{background:url('shared/river.jpg');}
#s6{background:url('shared/today.jpg');}

/* ................end MENU .. */



}  /* ------------------------------------------end MQ LARGE -----------------------------------*/