/*! normalize.css v1.1.0 | MIT License | git.io/normalize */

/* ==========================================================================
   HTML5 display definitions
   ========================================================================== */

/**
 * Correct `block` display not defined in IE 6/7/8/9 and Firefox 3.
 */

article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
main,
nav,
section,
summary {
    display: block;
}

/**
 * Correct `inline-block` display not defined in IE 6/7/8/9 and Firefox 3.
 */

audio,
canvas,
video {
    display: inline-block;
    *display: inline;
    *zoom: 1;
}

/**
 * Prevent modern browsers from displaying `audio` without controls.
 * Remove excess height in iOS 5 devices.
 */

audio:not([controls]) {
    display: none;
    height: 0;
}

/**
 * Address styling not present in IE 7/8/9, Firefox 3, and Safari 4.
 * Known issue: no IE 6 support.
 */

[hidden] {
    display: none;
}

/* ==========================================================================
   Base
   ========================================================================== */

/**
 * 1. Correct text resizing oddly in IE 6/7 when body `font-size` is set using
 *    `em` units.
 * 2. Prevent iOS text size adjust after orientation change, without disabling
 *    user zoom.
 */

html {
    font-size: 100%; /* 1 */
    -webkit-text-size-adjust: 100%; /* 2 */
    -ms-text-size-adjust: 100%; /* 2 */
}

/**
 * Address `font-family` inconsistency between `textarea` and other form
 * elements.
 */

html,
button,
input,
select,
textarea {
    font-family: sans-serif;
}

/**
 * Address margins handled incorrectly in IE 6/7.
 */

body {
    margin: 0;
}

/* ==========================================================================
   Links
   ========================================================================== */

/**
 * Address `outline` inconsistency between Chrome and other browsers.
 */

a:focus {
    outline: thin dotted;
}

/**
 * Improve readability when focused and also mouse hovered in all browsers.
 */

a:active,
a:hover {
    outline: 0;
}

/* ==========================================================================
   Typography
   ========================================================================== */

/**
 * Address font sizes and margins set differently in IE 6/7.
 * Address font sizes within `section` and `article` in Firefox 4+, Safari 5,
 * and Chrome.
 */

h1 {
    font-size: 2em;
    margin: 0.67em 0;
}

h2 {
    font-size: 1.5em;
    margin: 0.83em 0;
}

h3 {
    font-size: 1.17em;
    margin: 1em 0;
}

h4 {
    font-size: 1em;
    margin: 1.33em 0;
}

h5 {
    font-size: 0.83em;
    margin: 1.67em 0;
}

h6 {
    font-size: 0.67em;
    margin: 2.33em 0;
}

/* optimized headers */
h1.optim, h2.optim {
    font-size: 2em;
    margin: 0.67em 0;
}

h3.optim {
    font-size: 1.5em;
    margin: 1em 0;
}

h4.optim {
    font-size: 1.22em;
    margin: 1.33em 0;
}

h5.optim {
    font-size: 1.18em;
    margin: 1.67em 0;
}

h6.optim {
    font-size: 1.1em;
    margin: 2.33em 0;
}


/**
 * Address styling not present in IE 7/8/9, Safari 5, and Chrome.
 */

abbr[title] {
    border-bottom: 1px dotted;
}

/**
 * Address style set to `bolder` in Firefox 3+, Safari 4/5, and Chrome.
 */

b,
strong {
    font-weight: bold;
}

blockquote {
    margin: 1em 40px;
}

/**
 * Address styling not present in Safari 5 and Chrome.
 */

dfn {
    font-style: italic;
}

/**
 * Address differences between Firefox and other browsers.
 * Known issue: no IE 6/7 normalization.
 */

hr {
    -moz-box-sizing: content-box;
    box-sizing: content-box;
    height: 0;
}

/**
 * Address styling not present in IE 6/7/8/9.
 */

mark {
    background: #ff0;
    color: #000;
}

/**
 * Address margins set differently in IE 6/7.
 */

p,
pre {
    margin: 1em 0;
}

/**
 * Correct font family set oddly in IE 6, Safari 4/5, and Chrome.
 */

code,
kbd,
pre,
samp {
    font-family: monospace, serif;
    _font-family: 'courier new', monospace;
    font-size: 1em;
}

/**
 * Improve readability of pre-formatted text in all browsers.
 */

pre {
    white-space: pre;
    white-space: pre-wrap;
    word-wrap: break-word;

}

/**
 * Address CSS quotes not supported in IE 6/7.
 */

q {
    quotes: none;
}

/**
 * Address `quotes` property not supported in Safari 4.
 */

q:before,
q:after {
    content: '';
    content: none;
}

/**
 * Address inconsistent and variable font size in all browsers.
 */

small {
    font-size: 80%;
}

/**
 * Prevent `sub` and `sup` affecting `line-height` in all browsers.
 */

sub,
sup {
    font-size: 75%;
    line-height: 0;
    position: relative;
    vertical-align: baseline;
}

sup {
    top: -0.5em;
}

sub {
    bottom: -0.25em;
}

/* ==========================================================================
   Lists
   ========================================================================== */

/**
 * Address margins set differently in IE 6/7.
 */

dl,
menu,
ol,
ul {
    margin: 1em 0;
}

dd {
    margin: 0 0 0 40px;
}

/**
 * Address paddings set differently in IE 6/7.
 */

menu,
ol,
ul {
    padding: 0 0 0 26px;
}

/**
 * Correct list images handled incorrectly in IE 7.
 */

nav ul,
nav ol {
    list-style: none;
    list-style-image: none;
	padding:0;
	margin:0;
}

/* ==========================================================================
   Embedded content
   ========================================================================== */

/**
 * 1. Remove border when inside `a` element in IE 6/7/8/9 and Firefox 3.
 * 2. Improve image quality when scaled in IE 7.
 */

img {
    border: 0; /* 1 */
    -ms-interpolation-mode: bicubic; /* 2 */
}

/**
 * Correct overflow displayed oddly in IE 9.
 */

svg:not(:root) {
    overflow: hidden;
}

/* ==========================================================================
   Figures
   ========================================================================== */

/**
 * Address margin not present in IE 6/7/8/9, Safari 5, and Opera 11.
 */

figure {
    margin: 0;
}

/* ==========================================================================
   Forms
   ========================================================================== */

/**
 * Correct margin displayed oddly in IE 6/7.
 */

form {
    margin: 0;
}

/**
 * Define consistent border, margin, and padding.
 */

fieldset {
    border: 1px solid #c0c0c0;
    margin: 0 2px;
    padding: 0.35em 0.625em 0.75em;
}

/**
 * 1. Correct color not being inherited in IE 6/7/8/9.
 * 2. Correct text not wrapping in Firefox 3.
 * 3. Correct alignment displayed oddly in IE 6/7.
 */

legend {
    border: 0; /* 1 */
    padding: 0;
    white-space: normal; /* 2 */
    *margin-left: -7px; /* 3 */
}

/**
 * 1. Correct font size not being inherited in all browsers.
 * 2. Address margins set differently in IE 6/7, Firefox 3+, Safari 5,
 *    and Chrome.
 * 3. Improve appearance and consistency in all browsers.
 */

button,
input,
select,
textarea {
    font-size: 100%; /* 1 */
    margin: 0; /* 2 */
    vertical-align: baseline; /* 3 */
    *vertical-align: middle; /* 3 */
}

/**
 * Address Firefox 3+ setting `line-height` on `input` using `!important` in
 * the UA stylesheet.
 */

button,
input {
    line-height: normal;
}

/**
 * Address inconsistent `text-transform` inheritance for `button` and `select`.
 * All other form control elements do not inherit `text-transform` values.
 * Correct `button` style inheritance in Chrome, Safari 5+, and IE 6+.
 * Correct `select` style inheritance in Firefox 4+ and Opera.
 */

button,
select {
    text-transform: none;
}

/**
 * 1. Avoid the WebKit bug in Android 4.0.* where (2) destroys native `audio`
 *    and `video` controls.
 * 2. Correct inability to style clickable `input` types in iOS.
 * 3. Improve usability and consistency of cursor style between image-type
 *    `input` and others.
 * 4. Remove inner spacing in IE 7 without affecting normal text inputs.
 *    Known issue: inner spacing remains in IE 6.
 */

button,
html input[type="button"], /* 1 */
input[type="reset"],
input[type="submit"] {
    -webkit-appearance: button; /* 2 */
    cursor: pointer; /* 3 */
    *overflow: visible;  /* 4 */
}

/**
 * Re-set default cursor for disabled elements.
 */

button[disabled],
html input[disabled] {
    cursor: default;
}

/**
 * 1. Address box sizing set to content-box in IE 8/9.
 * 2. Remove excess padding in IE 8/9.
 * 3. Remove excess padding in IE 7.
 *    Known issue: excess padding remains in IE 6.
 */

input[type="checkbox"],
input[type="radio"] {
    box-sizing: border-box; /* 1 */
    padding: 0; /* 2 */
    *height: 13px; /* 3 */
    *width: 13px; /* 3 */
}

/**
 * 1. Address `appearance` set to `searchfield` in Safari 5 and Chrome.
 * 2. Address `box-sizing` set to `border-box` in Safari 5 and Chrome
 *    (include `-moz` to future-proof).
 */

input[type="search"] {
    -webkit-appearance: textfield; /* 1 */
    -moz-box-sizing: content-box;
    -webkit-box-sizing: content-box; /* 2 */
    box-sizing: content-box;
}

/**
 * Remove inner padding and search cancel button in Safari 5 and Chrome
 * on OS X.
 */

input[type="search"]::-webkit-search-cancel-button,
input[type="search"]::-webkit-search-decoration {
    -webkit-appearance: none;
}

/**
 * Remove inner padding and border in Firefox 3+.
 */

button::-moz-focus-inner,
input::-moz-focus-inner {
    border: 0;
    padding: 0;
}

/**
 * 1. Remove default vertical scrollbar in IE 6/7/8/9.
 * 2. Improve readability and alignment in all browsers.
 */

textarea {
    overflow: auto; /* 1 */
    vertical-align: top; /* 2 */
}

/* ==========================================================================
   Tables
   ========================================================================== */

/**
 * Remove most spacing between table cells.
 */

table {
    border-collapse: collapse;
    border-spacing: 0;
}

/*
 * jQuery FlexSlider v2.0
 * http://www.woothemes.com/flexslider/
 *
 * Copyright 2012 WooThemes
 * Free to use under the GPLv2 license.
 * http://www.gnu.org/licenses/gpl-2.0.html
 *
 * Contributing author: Tyler Smith (@mbmufffin)
 */

 
/* Browser Resets */
.flex-container a:active,
.flexslider a:active,
.flex-container a:focus,
.flexslider a:focus  {outline: none;}
.slides,
.flex-control-nav,
.flex-direction-nav {margin: 0; padding: 0; list-style: none;} 

/* FlexSlider Necessary Styles
*********************************/ 
.flexslider {margin: 0; padding: 0; min-height:150px; background:url(images/loader.gif) no-repeat center center;}
.flexslider .slides > li {display: none; -webkit-backface-visibility: hidden;} /* Hide the slides before the JS is loaded. Avoids image jumping */
.flexslider .slides img {width: 100%; display: block;}
.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 */
/* If you are not using another script, such as Modernizr, make sure you
 * include js that eliminates this class on page load */
.no-js .slides > li:first-child {display: block;}


/* FlexSlider Default Theme
*********************************/
.flexslider {position: relative;  zoom: 1; }
.flex-viewport {max-height: 2000px; -webkit-transition: all 1s ease; -moz-transition: all 1s ease; transition: all 1s ease;}
.loading .flex-viewport {max-height: 300px;}
.flexslider .slides {zoom: 1;}

.flexslider .flex-caption{ margin:10px 7px;}

.carousel li {margin-right: 5px}


/* Direction Nav */
.flex-direction-nav {*height: 0;}
.flex-direction-nav a {width: 30px; height: 30px; margin: -20px 0 0; display: block; background: url(images/bg_direction_nav.png) no-repeat 0 0; position: absolute; top: 50%; z-index: 10; cursor: pointer; text-indent: -9999px; opacity: 0; -webkit-transition: all .3s ease;}
.flex-direction-nav .flex-next {background-position: 100% 0; opacity: 0.8; right: 5px;}
.flex-direction-nav .flex-prev {opacity: 0.8; left: 5px;}
.flexslider:hover .flex-next:hover, .flexslider:hover .flex-prev:hover {opacity: 1;}
.flex-direction-nav .flex-disabled {opacity: .3!important; filter:alpha(opacity=30); cursor: default;}

/* Control Nav */
.flex-control-nav {width: 100%; position: absolute; bottom: -40px; text-align: center; display:none;}
.flex-control-nav li {margin: 0 6px; display: inline-block; zoom: 1; *display: inline;}
.flex-control-paging li a {width: 11px; height: 11px; display: block; background: #666; background: rgba(0,0,0,0.5); cursor: pointer; text-indent: -9999px; -webkit-border-radius: 20px; -moz-border-radius: 20px; -o-border-radius: 20px; border-radius: 20px; box-shadow: inset 0 0 3px rgba(0,0,0,0.3);}
.flex-control-paging li a:hover { background: #333; background: rgba(0,0,0,0.7); }
.flex-control-paging li a.flex-active { background: #000; background: rgba(0,0,0,0.9); cursor: default; }

.flex-control-thumbs {margin: 5px 0 0; position: static; overflow: hidden;}
.flex-control-thumbs li {width: 25%; float: left; margin: 0;}
.flex-control-thumbs img {width: 100%; display: block; opacity: .7; cursor: pointer;}
.flex-control-thumbs img:hover {opacity: 1;}
.flex-control-thumbs .flex-active {opacity: 1; cursor: default;}

.flexslider {
    width: 350px;
    height: 200px;
}

.flexslider .slides img {
    width: 350px;
    height: 200px;
}

/*
Simple Responsive Template v 1.2

primary styles 
   Author: www.prowebdesign.ro
   Add your own styles to customize the project.

BASE (MOBILE) SIZE
	These are the mobile styles. It's what people see on their phones.
	Remember, keep it light: Speed is Important.
*/
/* typography */
body {
	color:#2F2F2F;
	font-family:'Open Sans Condensed', Tahoma, Arial, Helvetica, sans-serif; 
	font-size:1em;
	line-height:1.4em; 
	font-weight:normal;
}
h1, h2, h3, h4, h5, h6 {
	font-weight:normal;
	font-family: 'Yanone Kaffeesatz', sans-serif;
	line-height:1.5em;
	margin:.45em 0;
	padding:0;
}
h1.h1-story {
	text-align: center;
}
.story-fst p, .story-snd p {
	margin: 0 4% 1.5em 4%;
}
h1.h1-story a {
	max-width: 88%;
	font-family: Georgia, Century, serif;
    font-size: 40px;
    color: black;
    text-decoration: none;
    height: 60px;
}
h1.h1-story a:after {
	content: '';
    width: 40%;
    height: 2px;
    background-color: #000;
    margin-left: auto;
    margin-right: auto;
    display: block;
    margin-top: 8px;
    margin-bottom: 40px;	
}
h2.toph2 {
	font-size:16pt;
	height:110px;
}
h2.toph2 span.butt-fst {
	display: block;
	text-decoration: underline;
	font-weight: 700;
	font-style: normal;
	font-size: 18pt !important;
	text-align:center;
	background-color: #0099ff;
	padding: 12px;
	width: 238px;
	color: white;
	float: left;
	margin: 0 10px 40px 0;
}
h2.toph2 span.butt-snd {
	display: block;
    padding-top: 12px;
}
h2.contact-form {
	font-size:12pt;font-style:italic
}
h3.toph3, p.toph3 {
	float: none;
    clear: both;
}
h2.first-header {
    font-family: 'Open Sans Condensed', sans-serif;
    text-align: center;
}
h6.best_worst_st1 {
	 text-align: center;
	 color: #fff;
}
.best_worst_st2 {
	 text-align: center; 
	 color: white;
}
.best_worst_st3 {
	 margin:0 100px;
}
.best_worst_st4 {
	 float:left;
}
.best_worst_st5 {
	 color:white;
}
.best_worst_st6 {
	 text-align:center;
}
.best_worst_st7 {
	 color: gray;
}
h2.first-header:after {
	content: '';
    width: 80px;
    height: 2px;
    background-color: #0099ff;
    margin-left: auto;
    margin-right: auto;
    display: block;
    margin-top: 8px;
    margin-bottom: 40px;
}
.cent {
  text-align: center;
}
#logo {
	float:left;
	margin-right:10px;
}
#logo img {
	max-width: 100%;
}
#main_header {
	float:left;
	width:auto;
}
#main_header h1 {
	font-family: 'Yanone Kaffeesatz', sans-serif;
	font-weight:300;
	font-size:1.4em;
	color:#0099ff;
}
/* links */
a,
a:visited,
a:active,
a:hover{color:#0099ff;}
a:hover{ text-decoration:none;}
/* Box sizing. Awesome thing. Read about it here: http://www.w3schools.com/cssref/css3_pr_box-sizing.asp */
*{box-sizing:border-box;-moz-box-sizing:border-box;}
/* structure */   
.wrapper{
	width: 92%; 
	margin: 0 auto;
}
header{ 
	padding:15px 0;
}
#banner{ 
	text-align:center;
}
.wrapper>h1, .wrapper>h2 {
	color:white;
}
#hero {
	  background: rgb(244, 244, 244) !important;
}
#hero,
#page-header{
	background: url(images/header_bg.png) #070707;
	border-top:1px solid #cecece;
	border-bottom:1px solid #cecece;
	padding:20px 0;
}
#hero h1{ 
	line-height:1.2em;
	margin-top:0px;
	margin-bottom:10px;
}
.flexslider{
	display:none;
}
ul.slides li p.flex-caption {
	position: absolute;
    top: 106px;
    left: inherit;
    background: rgba(0, 0, 0, 0.4);
    width: 320px;
    margin-left: 10px;
    color: whitesmoke;
    padding: 6px;
    text-align: justify;
    font-family: 'Open Sans Condensed', Tahoma;
    font-size: 11.4pt;
}
#content {  
	margin:40px 0;
}
h4.best-worst-hdr {
	font-size: 24px;
	text-align: center; 
	color: #fff;
}
aside { 
	margin:40px 0;
}
p{ margin:0 0 1.5em;}
/* RESPONSIVE IMAGES */
img{ max-width:100%; height:auto;}
/*MAIN MENU*/
.menu-toggle{
	display:block;
	padding:10px;
	margin:20px 0 0;
	background:#666;
	color:#fff;
	cursor:pointer;
	text-transform:uppercase;
	font-size:20px;
}
.menu-toggle.toggled-on{
	background:#0099ff;
}
.srt-menu{
	display:none;
}	
.srt-menu.toggled-on{
	display:block;
	position:relative;
	top: 20px;
	z-index:10;
}
.srt-menu{
	clear:both;
	margin-bottom:60px;
}
.srt-menu li a {
	background:#dadada;
	display:block;
	margin:1px 0; 
	padding:10px;
	text-decoration:none;
}
.srt-menu li a:hover{
	background:#0099ff;
	color:#fff;
}
.srt-menu li li a {
	background:#e8e8e8;
	padding-left:40px;
}
.srt-menu li li li a {
	background:#efefef;
	padding-left:80px;
}
/*SECONDARY MENU*/
#secondary-navigation{
	margin-bottom:60px;
}
#secondary-navigation ul{
	margin:0;
	padding:0;
}
#secondary-navigation ul li a{ 
	background:#E6E6E6;
	display:block;
	margin:5px 0; 
	padding:10px;
	text-decoration:none;
}
#secondary-navigation ul li a:hover,
#secondary-navigation ul li.current a{
	background:#0099ff;
	color:#fff;
}
.m54 {
  font-size: 19px;
  line-height: 26px;
  font-weight: 700;
  color: #2d2d2d;
}
.m55 {
	font-size: 15px;
}
.grid_4 h1 {
	text-align: center;
}
.left {
	float:left;
}
.right {
	float:right;
}
/*SPACE GRID ELEMENTS VERTICALLY, SINCE THEY ARE ONE UNDER ANOTHER SO FAR*/
.grid_1,
.grid_2,
.grid_3,
.grid_4,
.grid_5,
.grid_6,
.grid_7,
.grid_8,
.grid_9,
.grid_10,
.grid_11,
.grid_12 {
	margin-bottom:40px;
	position: relative;
    min-height: 1px;
    padding-left: 15px;
    padding-right: 15px;
}
/*FOOTER*/
footer{  
	clear:both;
	font-size:80%;
	padding:20px 0;
	font-style:italic;
}
footer ul{
	margin:0;
	padding:0;
}
/*colors and backgrounds*/
body{
	background:#fff;
}
h1, h2, h5, h6{
	color:#333; 
}
}
h3, h4{
	color:#fff;
}	
footer{ 
	background:#333;
	color:#ccc;
}
footer h1, footer h2, footer h3, footer h4{ 
	color:#CCC; 
	margin-bottom:10px;
}
footer ul{
	margin:0 0 0 8%;
}
a.buttonlink{ 
	background:#0099ff; 
	border-radius:7px; 
	color:#fff;
	display:block;
	float:left; 
	margin:10px 15px 10px 0; 
	padding:10px;
	text-decoration:none;
}
a.buttonlink:hover{
	background:#8dbc01;
}
.greenelement{
	background:#5ec79e;
	color:#fff;
}
.violetelement{
	background:#887dc2;
	color:#fff;
}
/* Contain floats*/ 
.clearfix:before,
.clearfix:after,
.row:before,
.row:after {
  content: " ";
  display: table;
}
.clearfix:after,
.container:after,
.row:after{
  clear: both;
}
.color-about {
	color: #9cba7f;
}
.color-about2 {
	color: #00f;
}
.fw400 {
	 font-weight: 400;
}
/*
LARGER MOBILE DEVICES
This is for mobile devices with a bit larger screens.
*/
@media only screen and (min-width: 481px) {
#banner{
	float:left;
	text-align:left;
	margin-bottom:-20px;/*this depends on the height of the logo*/
}
.menu-toggle{/*make menu float right, instead of sitting under the logo*/
	margin-top:10px; /*this depends on the height of the logo*/
	float:right;
}
}
/*
TABLET & SMALLER LAPTOPS
The average viewing window and preferred media query for those is 768px.
But I think that some more breathing space is good:)
*/
@media only screen and (min-width: 920px) {
.wrapper{
	max-width: 1200px; 
	margin: .75em auto;
}
#banner{ 
	float: left;
	margin-bottom: 0px;
}
header{
	padding:0;
}
#content {  
	float:left;
	width:65%;
}
#content.wide-content{
	float:none;
	width:100%;
}
.flexslider{
display:block;
/*demo 1 slider theme*/	
margin: 0 32px 60px; 
background: #fff; 
border: 4px solid #fff; 
-webkit-border-radius: 4px; 
-moz-border-radius: 4px; 
-o-border-radius: 4px; 
border-radius: 4px; 
box-shadow: 0 1px 4px rgba(0,0,0,.2); 
-webkit-box-shadow: 0 1px 4px rgba(0,0,0,.2); 
-moz-box-shadow: 0 1px 4px rgba(0,0,0,.2); 
-o-box-shadow: 0 1px 4px rgba(0,0,0,.2);
}
aside { 
	float:right;
	width:30%;
}
/*** MAIN MENU - ESSENTIAL STYLES ***/
.menu-toggle{display:none;}
#menu-main-navigation{display:block;   padding-top: 21px; position: relative;
  right: 34px;
}
.srt-menu, .srt-menu * {
	margin:			0;
	padding:		0;
	list-style:		none;
}
.srt-menu ul {
	position:		absolute;
	display:none;
	width:			12em; /* left offset of submenus need to match (see below) */
}
.srt-menu ul li {
	width:			100%;
}
.srt-menu li:hover {
	visibility:		inherit; /* fixes IE7 'sticky bug' */
}
.srt-menu li {
	float:			left;
	position:		relative;
	margin-left:1px;
}
.srt-menu li li {
	margin-left:0px;
}
.srt-menu a {
	display:		block;
	position:		relative;
}
.srt-menu li:hover ul,
.srt-menu li.sfHover ul {
	display:block;
	left:			0;
	top:			45px; /* match top ul list item height */
	z-index:		99;
	-webkit-box-shadow:  2px 3px 2px 0px rgba(00, 00, 00, .3);
    box-shadow:  2px 3px 2px 0px rgba(00, 00, 00, .3);
}
ul.srt-menu li:hover li ul,
ul.srt-menu li.sfHover li ul {
	top:			-999em;
}
ul.srt-menu li li:hover ul,
ul.srt-menu li li.sfHover ul {
	left:			12em; /* match ul width */
	top:			0;
}
ul.srt-menu li li:hover li ul,
ul.srt-menu li li.sfHover li ul {
	top:			-999em;
}
ul.srt-menu li li li:hover ul,
ul.srt-menu li li li.sfHover ul {
	left:			10em; /* match ul width */
	top:			0;
}
/*** DEMO1 SKIN ***/
#topnav, .srt-menu {
	  /* float: right; */
  float: right;
  margin: .1em 0 0 0;
}
.srt-menu a {
	text-decoration:none;
}
.srt-menu li a {
	background:#fff;
	margin:0; 
	padding: 6px 20px;
    height: 32px;
}
.srt-menu a, .srt-menu a:visited  { /* visited pseudo selector so IE6 applies text colour*/
	color:			#0099ff;	
}
.srt-menu li li a {
		border-top:		1px solid rgba(255,255,255,.2);
		background:		#333; /*fallback for old IE*/
		background:rgba(0,0,0,.6);
		color:	#fff;
		padding-left:20px;
		height:auto;
}
.srt-menu li li a:visited{color:#fff;}
.srt-menu li li li a,
.srt-menu li.current * li a{
	padding-left:20px;
	background:rgba(0,0,0,.6);
}
.srt-menu li:hover > a,
.srt-menu li.current a{ 
	color:#fff;
	background:#0099ff;
}
.srt-menu li li:hover > a{
	color:#fff;
	background:#0099ff;
}
/*GRID*/
/*
 & Columns : 12 
 */
 .row{
	 margin-left: -15px;
     margin-right: -15px;
}
#social1 {
	position: absolute;
	right: 20px;
	top: 6px;
}
#social1 img {
	width: 24px; 
	height: 24px;
}
#main_container {
	position:relative;
	display:block;
	background:rgb(244, 244, 244);
	width:100%;
	border-top:1px solid #cecece;
	border-bottom:1px solid #cecece;
	padding:60px 0 40px 0;
}
#main {
	margin: 0 auto !important;
}
#main2_container {
	width: 100%; 
	display: block; 
	background: black; 
	position: relative;
}
#content_best_worst {
	background: black;
	color: white;
}
.grid_1 { width: 8.33333333%; }

.grid_2 { width: 16.66666667%; }

.grid_3 { width: 25%; }

.grid_4 { width: 33.33333333%; }

.grid_5 { width: 41.66666667%; }

.grid_6 { width: 50%; }

.grid_7 { width: 58.33333333%; }

.grid_8 { width: 66.66666667%; }

.grid_9 { width: 75%; }

.grid_10 { width: 83.33333333%; }

.grid_11 { width: 91.66666667%; }

.grid_12 { width: 100%; }

.grid_1,
.grid_2,
.grid_3,
.grid_4,
.grid_5,
.grid_6,
.grid_7,
.grid_8,
.grid_9,
.grid_10,
.grid_11,
.grid_12 {
	float: left;
	display: block;
}
.rightfloat{float:right;}
#hero [class*="grid_"] { margin-bottom:-20px;}

}
div.grid_7.rightfloat iframe {
	width:100%;
}
div.grid-info {
	margin-bottom: 0;
}
p.p-center {
	text-align: center;
}
p.p-italic {
	font-style: italic;
}
p.p-mission, p.p-mission2 {
	width: 100%;
    height: 440px;
    background: rgba(0, 153, 255, 0.05);
    padding: 8px 12px;
    color: #465D66;
    text-align: justify;
    font-size: 11pt;
    border: 1px solid #243038;
    box-shadow: 4px 4px rgba(195, 207, 213, 0.4);
}
p.p-mission2 {
    background: rgb(0, 153, 255);
    color: #FFFFFF;
    box-shadow: 4px 4px rgba(64, 104, 123, 0.65);
}
p a.butt-here {
	width: 80px;
    height: 20px;
    background: #0099ff;
    color: #fff;
    padding: 4px;
    text-decoration: none;
}
p.main-header {
	font-family: 'Open Sans Condensed', Tahoma, sans-serif;
    font-size: 14pt;
    text-align: justify;
}
#goo-form-container {
	margin-bottom: 0;
}
div.story-snd {
	background: rgb(244, 244, 244);
    border-top: 1px solid #cecece;
    border-bottom: 1px solid #cecece;
    border-bottom: #cecece;
    margin-bottom: 0;
}
div.story-fst {
    margin-bottom: 0;
}
div.story-fst h1.first-header {
    font-style: italic;
    font-size: 20pt;
}
div.story-fst p.story-clicktip {
    font-size: 11pt;
}
div.story-fst p a, div.story-snd p a {
	width: 80px;
    height: 20px;
    background: #0099ff;
    color: #fff;
    padding: 4px;
    text-decoration: none;
}

p.h-string {
	font-size: 0.84em;
	font-weight: normal;
    font-family: 'Yanone Kaffeesatz', sans-serif;
    line-height: 1.5em;
    margin: .45em 0;
    padding: 0;
}
div.spacer {
	float:none;
	clear:both;
}	
div.spacer20 {
	width:100%;
	height:20px;
}
/*
DESKTOP
This is the average viewing window. So Desktops, Laptops, and
in general anyone not viewing on a mobile device. Here's where
you can add resource intensive styles.
*/
@media only screen and (min-width: 1030px) {
	div.grid_7.rightfloat iframe {
		height: 988px;
		border:0;
	}
}
/*
LARGE VIEWING SIZE
This is for the larger monitors and possibly full screen viewers.
*/
@media only screen and (min-width: 1240px) {

} 
/*
RETINA (2x RESOLUTION DEVICES)
This applies to the retina iPhone (4s) and iPad (2,3) along with
other displays with a 2x resolution.
*/
@media only screen and (-webkit-min-device-pixel-ratio: 1.5),
       only screen and (min--moz-device-pixel-ratio: 1.5),
       only screen and (min-device-pixel-ratio: 1.5) {

} 
/*
iPHONE 5 MEDIA QUERY
iPhone 5 or iPod Touch 5th generation styles (you can include your own file if you want)
*/
@media (device-height: 568px) and (-webkit-min-device-pixel-ratio: 2) { 

}
/*
PRINT STYLESHEET
*/
@media print {
  * { background: transparent !important; color: black !important; text-shadow: none !important; filter:none !important; -ms-filter: none !important; } /* Black prints faster: h5bp.com/s */
  a, a:visited { text-decoration: underline; }
  a[href]:after { content: " (" attr(href) ")"; }
  abbr[title]:after { content: " (" attr(title) ")"; }
  .ir a:after, a[href^="javascript:"]:after, a[href^="#"]:after { content: ""; }  /* Don't show links for images, or javascript/internal links */
  pre, blockquote { border: 1px solid #999; page-break-inside: avoid; }
  thead { display: table-header-group; } /* h5bp.com/t */
  tr, img { page-break-inside: avoid; }
  img { max-width: 100% !important; }
  @page { margin: 0.5cm; }
  p, h2, h3 { orphans: 3; widows: 3; }
  h2, h3 { page-break-after: avoid; }
}
@media only screen and (max-width: 1310px) {
	h2.toph2 span.butt-fst {
		float:none;
		margin-bottom:0;
	}
	p.p-mission, p.p-mission2 {
		height:500px;
	}
}
@media only screen and (max-width: 1310px) {
	div.grid_7.rightfloat iframe {
		height: 998px;
	}
}
@media only screen and (max-width: 1000px) {
	div.grid_7.rightfloat iframe {
		height: 1040px;
	}
}
@media only screen and (max-width: 940px) {
	div.grid_7.rightfloat iframe {
		height: 1040px;
	}
	p.p-mission, p.p-mission2 {
		height:700px;
	}
}
@media only screen and (max-width: 1170px) {
	p.p-mission, p.p-mission2 {
		height:600px;
	}
}
@media only screen and (max-width: 1100px) {
	#main_header {
		float: none;
    	clear: both;
	}
}
@media only screen and (max-width: 1030px) {
	h2.first-header {
		height: 110px;
	}
	p.p-mission, p.p-mission2 {
		height:700px;
	}
}
@media only screen and (max-width: 920px) {
	div.grid_7.rightfloat iframe {
		height: 990px;
	}
	p.p-mission, p.p-mission2 {
	    height: 240px;
	}
	h2.first-header {
	    height: 60px;
	}
	div.grid-info h2.first-header {
		height: 110px;
	}
	p.p-mission {
		height: 140px;
	}
	p.p-mission2 {
	    height: 220px;
	}
	#content_best_worst {
		padding: 40px 0;
	}
	#content_best_worst .grid_4 {
		width:33%;
		font-size:10pt;
		float:left;
	}
	#content_best_worst .grid_4 div {
		margin:0 !important;
	}
	h4.best-worst-hdr, .best_worst_st2, .best_worst_st5 {
		color:#000;
	}
	h4.best_worst_st2 {
		border-bottom:1px solid #000;
	}
	#main2_container {
		border-top:1px solid #cecece;
		background: rgb(244, 244, 244);
		border-bottom:1px solid #cecece;
	}
	
	#main_form section {
		display: -webkit-box;
	    display: -moz-box;
	    display: -ms-flexbox;
	    display: -webkit-flex;
	    display: flex;
	    -webkit-box-orient: vertical;
	    -moz-box-orient: vertical;
	    -webkit-flex-direction: column;
	    -ms-flex-direction: column;
	    flex-direction: column;
	    /* optional */
	    -webkit-box-align: start;
	    -moz-box-align: start;
	    -ms-flex-align: start;
	    -webkit-align-items: flex-start;
	    align-items: flex-start;
	}
	#main_form section div.grid_5 {
		-webkit-box-ordinal-group: 2;
	    -moz-box-ordinal-group: 2;
	    -ms-flex-order: 2;
	    -webkit-order: 2;
	    order: 2;
	}
	#main_form section div.grid_7 {
		width:100%;
		-webkit-box-ordinal-group: 1;
	    -moz-box-ordinal-group: 1;
	    -ms-flex-order: 1;
	    -webkit-order: 1;
	    order: 1;
	}
	#content_best_worst div.grid_4 {
		margin-bottom:10px;
	}

}
@media only screen and (max-width: 880px) {
	p.p-mission {
		height:180px;
	} 
	p.p-mission2 {
	    height: 320px;
	}
}
@media only screen and (max-width: 698px) {
	p.p-mission {
		height:240px;
	}
	p.p-mission2 {
	    height: 400px;
	}
}
@media only screen and (max-width: 580px) {
	div.grid_7.rightfloat iframe {
		height: 1006px;
	}
	div.grid-info h2.first-header {
	    height: 200px;
	}
}
@media only screen and (max-width: 560px) {
	#logo {
		float: none;
	    clear: both;
	    margin: 0;
	    display: block;
	}
	#social1 {
		float:none;
		clear:both;
		width:55px;
		position:absolute;
		left:inherit !important;
		right:2.6% !important;
		top:14px !important;
	}
	#banner {
		width: 100%;
	    float: none;
	    clear: both;
	    margin:0 0 10px 0;
	}
	.menu-toggle {
    	float: none;
    	clear:both;
	}
	p.toph3 {
		position:relative;
		top:24px;
	}
}
@media only screen and (max-width: 500px) {
	p.p-mission {
		height:300px;
	} 
	p.p-mission2 {
	    height: 500px;
	}
	div.grid_7.rightfloat iframe {
		height: 1100px;
	}
}
@media only screen and (max-width: 500px) {
	div.grid-info h2.first-header {
	    height: 240px;
	}
}
@media only screen and (max-width: 480px) {
	#banner {
		text-align:left;
	}
	#banner img {
		max-width:68%;
	}
	#main_form section div.grid_7 iframe {
		height: 1280px;
		border:0;
	}
}
@media only screen and (max-width: 400px) {
	p.p-mission {
		height:326px;
	}
	p.p-mission2 {
	    height: 560px;
	}
}
@media only screen and (max-width: 320px) {
	p.p-mission {
		height: 360px;
	} 
	p.p-mission2 {
	    height: 620px;
	}
}
.uols ol {
display: inline-block;
}

.page_nav {
	text-align:center;
}
.page_nav a {
	width: 24px;
    height: 24px;
    display: inline-block;
    background: #288bcc;
    margin-right: 4px;
    color: #fff;
    text-decoration: none;
    border:1px solid #444;
    border-radius:4px;
}
.page_nav a:hover {
	background: #22445a;
}