/* 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 */
 
*{
	font-family: Helvetica Neue, Verdana, Arial, sans-serif; 
}
body{
    color:#EEE2DC;
    font-family: Helvetica Neue, Verdana, Arial, sans-serif; 
    font-size:1em;
    line-height:1.4em; 
    font-weight:normal;
    background-color: #BAB2B5;
 
}
#preorderdiv{
	width: 95%;
	max-width: 350px;
	/*height: 200px;
     margin:auto; */
    position: fixed;
    top: 22px;
    left: 60px;
	display: none; 
	text-align: center;
	border: 2px solid #AC3B61;;
	border-top: 0px solid white;
	background-color:  white;/* #AC3B61; */

	 color: #AC3B61;
	padding: 5px;
	-webkit-box-shadow: 10px 10px 35px 0px rgba(0,0,0,0.75);
	-moz-box-shadow: 10px 10px 35px 0px rgba(0,0,0,0.75);
	box-shadow: 10px 10px 35px 0px rgba(0,0,0,0.75);
	z-index: 5000000;
	border-radius: 0 0 8px 8px;
	
}
.awardcircle{
	width: 11%;
	height: 11%;
	display: none;
	opacity: 0.7;
	
	
}
#axiomcirc{
	position: absolute;
	top: 15%;
	left: 87%;
    z-index: 2000000;
}
#hbrcirc{
	position: absolute;
	top: 28%;
	left: 82%;
    z-index: 2000000;
}
#cmicirc{
	position: absolute;
	top: 43%;
	left: 87%;
    z-index: 2000001;
}
#bookpalcirc{
	position: absolute;
	top: 58%;
	left: 82%;
    z-index: 2000001;
}
#inccirc{
	position: absolute;
	top: 71%;
	left: 87%;
    z-index: 2000002;
}
#enterprisers{
	position: absolute;
	top: 84%;
	left: 82%;
    z-index: 2000003;
}
#videocircle{
    position: absolute;
    z-index: 2000000;
    width: 20%;
    height: 20%;
 
}
#videoad{
    width: 20%;
    height: auto;
    position: absolute;
    top: 75%;
    left: 45%;
    z-index: 1500;
    cursor: pointer;
    display:none;
 
}
#blocker{
    display: none;
    height:100%;
    width: 100%;
    background-color: gray;
    position:fixed;
    top: 0;
    left: 0;
    z-index: 10000;
    opacity: 1;
}
 
#titlepopup {
        display: none;
        position: absolute;
        width: 280px;
        padding: 10px;
        background: #eeeeee;
        color: #000000;
        border: 1px solid #1a1a1a;
        font-size: 0.8em;
      }
 
#bigimage{
    width: 100%;
}
 
.summemph{
    background-color: #3F85D8;
    color: #98D6FA
}
.summemphoff{
    background-color: #96BCFF;
    color: #295284;
}
 
#sampleoffer{
    position: absolute;
    top: 0;
    width: 100%;
    /* left: 0; */
    text-align:center;
    margin: auto;
    display:none;
    z-index: 500000;
    cursor: pointer;
    -webkit-box-shadow: 10px 10px 35px 0px rgba(0,0,0,0.75);
    -moz-box-shadow: 10px 10px 35px 0px rgba(0,0,0,0.75);
    box-shadow: 10px 10px 35px 0px rgba(0,0,0,0.75);
 
}
 
#sampleoffer_old{
    /* width: 40%; */
    display:none;
    font-size: 1.6em;
    background-color: #AC3B61; ;
    color: white;
    position: absolute;
    top: 0;
    width: 100%;
    right: 0%;
    opacity: 0.9;
    text-align: center;
/* 
 
    padding-left: 20px;
 */
    padding-top:10px;
    padding-bottom:10px;
    /* padding-right: 5px; */
    z-index: 500000;
    cursor: pointer;
    -webkit-box-shadow: 10px 10px 35px 0px rgba(0,0,0,0.75);
    -moz-box-shadow: 10px 10px 35px 0px rgba(0,0,0,0.75);
    box-shadow: 10px 10px 35px 0px rgba(0,0,0,0.75);
    /* 
-moz-border-radius: 11px 0px 0px 11px; 
    -webkit-border-radius: 11px 0px 0px 11px; 
 */
     
}
 
#restofaboutthebook{
    display:none;
}
 
.redsubhead{
    margin-top: 1em;
    font-size: 1.5em;
    line-height: 1.8em; 
    color: white;
    /* padding-left:1em; */
    background-color: #AC3B61;
    text-align: center;
    margin-bottom: 0;
}
.aboutauthor{
    color: #3F0601;;
}
#aboutthebook{
    color: #295284;
}
.endorser{
    color: #E46624;
    /* background-color: #FFF498; */
}
#hiddenaboutthebook{
    display: none;
}
#moreabout, #lessbutton{
    color:#FD8008;
    padding: 5px;
    border: 2px solid #D8FBEF;
    background-color: #2936FA;
    color: white;
    border-radius: 5px;
}
#coverimg{
    /* 
height: 80%;
    width: 80%
 */
}
 
#abouttheauthor{
    
}
.toc{
     
    font-size: 1.2em;
    color: #3F0601;
}
 
#TOCbuttons{
    height-min: 200px;
    width: 80%;
    margin:auto;
    display: flex;
    /* border: 5px solid green; */
    justify-content: center;
  flex-direction: row;
  text-align: center;
    flex-wrap: wrap;
    justify-content: center;
  text-align: center;
}
 
#topmenu{
    width: 100%;
    position: fixed;
    height:40px;
    background-color:purple;
    z-index:3000000;
    text-align:center;
}
.topmenuitem{
    background-color: #FEBC8B;
    border: 2px #DD7523 solid;
    width: 20em;
}
.coda{
    margin-left:1em;
    font-size: 0.8em;
    color: #8D5D0F;
    font-style: italic;
}

 
.preorderbtn{
    font-size: 20px;
    background:#FEBC8B; 
    border-radius:7px; 
    color: #AC3B61;
    display:inline-block;
    margin:10px 15px 10px 0; 
    padding:10px;
    text-decoration:none;
    cursor: pointer;
}
 
/* 

    width: 95%;
    max-width: 350px;
    /*height: 200px;
     margin:auto; */
/* 
#preorderdiv{
    position: fixed;
    top: 0;
    left: 0px;
    margin-left: auto;
    margin-right: auto;
    display: none; 
    text-align: center;
    border: 4px solid #EEE2DC;
    border-top: 0px solid white;
    background-color:  #AC3B61;
 
     color: #AC3B61;
    padding: 5px;
    -webkit-box-shadow: 10px 10px 35px 0px rgba(0,0,0,0.75);
    -moz-box-shadow: 10px 10px 35px 0px rgba(0,0,0,0.75);
    box-shadow: 10px 10px 35px 0px rgba(0,0,0,0.75);
    z-index: 500000;
    border-radius: 0 0 8px 8px;
     
}
 */


#preorderdiv{
	display: none; 
	border: 2px solid blue;
	width: 30%;
	position: fixed;
    top: 20px;
    right: 0;
    left: 0;
    margin-right:auto;
   	margin-left: auto;
	-webkit-box-shadow: 7px 7px 35px 0px rgba(0,0,0,0.75);
	-moz-box-shadow: 7px 7px 35px 0px rgba(0,0,0,0.75);
	box-shadow: 7px 7px 35px 0px rgba(0,0,0,0.75);
	background-color: #99274F;
	 z-index: 3000000;  
}
 
.orderclass{
    background-color: #123C69;
    color: #EDC7b7;
    width: 100%;
    margin-bottom: 8px;
    cursor: pointer;
}
.orderclass:a{
    text-decoration: none;
}
.orderclass:hover{
    background-color: #FB0207;
}
 
/* Top flex buttons */
#topmenuflexdiv{
	background-color: #6E2637;
	position: fixed;
	width: 100%;
	margin:auto;
	/* height: 40px; */
	display: flex;
	justify-content: flex-start;
  flex-direction: flex-start;
  text-align: left;
	/* flex-wrap: wrap; */

	z-index:3000000;
	
	top: -5px;
}
.topmenuflexbox{
  width: 10em;  
  height: auto;  
  margin: 1.5px;  /* Magic! */
 /*  background-color: #FEBC8B; */
  color: white; /* #AC3B61; */
  /* border: 8px solid white;  */
  text-align: center;
  font-size: 1.5em;
  border: 1px #5E7D6A solid;
  cursor:pointer;
}
.widetopitem{
	width: 15em;
}


.contactflexbox:hover, .contactflexbox a:hover, .preorderbtn:hover{
    background-color: #123C69;
    color: #FEBC8B;
}
 
/* Bottom flex buttons */
 
#contactflexdiv{
    height-min: 200px;
    width: 80%;
    margin:auto;
    display: flex;
    /* border: 5px solid green; */
    justify-content: center;
  flex-direction: row;
  text-align: center;
    flex-wrap: wrap;
    justify-content: center;
  text-align: center;
}
.contactflexbox{
  width: 150px;  
  padding: 10px;
  height: auto;  
  margin: 8px;  /* Magic! */
  background-color: #FEBC8B;
  color: #AC3B61;
  /* border: 8px solid white;  */
  text-align: center;
  font-size: 1em;
  border-radius: 5px;
  cursor:pointer;
 
}
.contactflexbox:hover, .contactflexbox a:hover, .preorderbtn:hover{
    background-color: #123C69;
    color: #FEBC8B;
}
 
.contactflexbox a{
    color: #AC3B61;
}
.spanlink:hover{
    color: white;
}
 
#video_container{
   display: none;
   width:100%;
   height: 100%;
   text-align:center;
   position:fixed;
    top: 0;
   left: 0;
   background-color: rgba(66,110,244,0.9);
   z-index: 2000000;  
}
#video_alert_bak{
    /* height: em; */
    font-size: 1.5em;
    background-color: red;
    color: white;
    cursor: pointer;
    margin: auto;
    display:none;
    text-align: center;
    margin-top: -5px;
    margin-bottom: 0px;
    line-height: 2em;
}
#video_alert{
    /* height: em; */
    font-size: 0.8em;
    background-color: #560D25;
    border: 3px solid #DD922B;
    color: #DD922B;
    cursor: pointer;
    margin: auto;
    display:none;
    text-align: center;
    width: 200px;
    height: auto;
    position: absolute;
    top: 0;
    left: 60%;
    z-index: 4000000;
}
#vidplayerdiv {
   background-color:#fff;
   width:750px;
/*    height: 600px; */
   padding-top: 10px;
    margin-left: auto;
    margin-right: auto;
    margin-top: 20px;
   opacity: 1.0;
   z-index: 2000001;
   position: relative;
   border-radius:  8px;
  /*  border: 3px solid blue; */
   -webkit-box-shadow: 7px 7px 35px 0px rgba(0,0,0,0.75);
    -moz-box-shadow: 7px 7px 35px 0px rgba(0,0,0,0.75);
    box-shadow: 7px 7px 35px 0px rgba(0,0,0,0.75);
}
 
 
h1, h2, h3, h4, h5, h6{
    font-weight:normal; 
    line-height:1.5em;
    margin:.45em 0;
    padding:0;
} 
 
.callout{
    font-size: 1.5em;
    line-height: 1.5em;
}
#dwphoto{
 
    float:right;
 
    z-index: 1;
}
/* 
#mainquote{
    position
 
}
 */
 
 
/* links */
a,
a:visited,
a:active,
a:hover{color:#0099ff;}
a:hover{ text-decoration:none;}
a{
    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;
}
     
#hero,
#page-header{
    background:#EEE2dc;
    /* 
border-top:1px solid #e2e2e2;
    border-bottom:1px solid #e2e2e2;
    padding:20px 0;
 */
 
}
#hero h1{ 
    line-height:1.2em;
    margin-top:0px;
    margin-bottom:10px;
}
 
.flexslider{
    display:none;
}
 
#content {  
    margin:40px 0;
}
 
aside { 
    margin:40px 0;
}
 
p{ margin:0 0 1.5em;}
 
 
/* RESPONSIVE IMAGES */
img{ max-width:100%; height:auto;}
 
#mainimgdiv{  
  width: 100%;  
  height: auto;
  position:relative;
  
}
#topspacer{
    height: 15px;
}
 
#bookcovers{
  /* background-color: #FED9E3; */
  /* 
width: 600px;
  height:150px;
 */
  margin-left: auto ;
  margin-right: auto ;
  padding-bottom: 8px;
  padding-right: 8px;
  text-align:center;
   
}
 
.bookicon{
    -webkit-box-shadow: 7px 7px 35px 0px rgba(0,0,0,0.75);
    -moz-box-shadow: 7px 7px 35px 0px rgba(0,0,0,0.75);
    box-shadow: 7px 7px 35px 0px rgba(0,0,0,0.75);
}
 
.booknook{
  height:100px;
  width:95px;
  float:left;
  font-size: 14px;
  line-height: 14px;
  padding-top: 10px;
  padding-left: 20px;
  color: #FEBC8B;
  
  }
   
.booknote:a{
    text-decoration:none;
     
}
 
#contacttable{
    background-color: #123C69;
    color: #EDC7b7;
    width: 100%;
     
}
#contactheader, #moreheader{
    background-color: #AC3B61;
    text-align: center;
    color: #EDC7b7;
    font-size: 1.2em;
}
#moreheader{
    background-color: #00F;
}
.contact, .morecell{
    /* border: 5px solid #1F43C9; */
    text-align: center;
    font-size: 1.5em;
    background-color: blue;
    color: white;
}
.morecell{
    cursor: pointer;
    color:white;
}
.contact a{
    color:#800080;
}
 
 
#flexpraisediv{
    display: flex;
    flex-flow: row wrap;
    justify-content: flex-start; 
    margin: 10px;
}
.praiseflexbox{
      width: 250px; /*  Or whatever */
      margin-top: 2em;
      flex: 300px;
      margin: auto;  /* Magic! */
      background-color: #123C69;
      padding: 8px;
      color: white;
      border: 2px solid #85ABFB;
      border-radius: 10px;
 
}
.praiseauthor{
    width:100%;
    background-color: #AC3B61;
    color: white;
    font-size: 1.8em;
}
.praiseattribution{
    width:100%;
    background-color: #319AFF9;
    color: white;
    font-size: 12px;
}
.praiseShortquote {
    width:100%;
     
    font-size: 2em;
    line-height: 1em;
    color: white;
    padding: 5px;
     
 
}
.praiseFull{
    /* font-family: Georgia; */
    width:100%;
    font-size: 1em;
    color: #EEE2DC;
    padding: 5px;
    /* background-color: black; */
    z-index: 20001;
    -webkit-box-shadow:  2px 2px 19px 0px rgba(0,0,0,0.75);
-moz-box-shadow:  2px 2px 19px 0px rgba(0,0,0,0.75);
box-shadow:  2px 2px 19px 0px rgba(0,0,0,0.75);
}
 
.earlyrevemph{
    /* background-color:#400080; */
    /* text-shadow: 2px 2px 5px black; */
    color: #FEBC8B;
    font-weight: 550;
    /* letter-spacing: 0.2em; */
    /* font-size: 1.2em; */
}
#lessabout{
    background-color: #6CF;
    margin-left: auto;
    margin-right: auto;
    width: 100px;
}
 
 
.praiseExtra{
    display:none;
     
}
 
#aboutBookOverlay{
        display: none;
  margin: auto;
position: absolute;
padding-left: 20%;
padding-right: 30%;
top: 0px; left: 0px;
bottom: 0px; right: 0px;
background-color: #000;
opacity: .9;
color: white;
z-index:5;
}
 
#aboutbookpopout{
    /* background-color: ; */
   width: 80%;
   margin: 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;
    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;
}
 
/*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;
    /*positioning and padding*/
    position: relative;
    min-height: 1px;
    padding-left: 15px;
    padding-right: 15px;
}
 
/*FOOTER*/
footer{  
    clear:both;
    font-size:80%;
    padding:5px 0;
}
footer ul{
    margin:0;
    padding:0;
}
 
/*colors and backgrounds*/
body{
    background:#fff;
}
h1, h2, h3, h4, h5, h6{
    color:#333; 
}
 
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%;
}
 
.offer{
    background-color: #AC3B61;
    color: #EDC7b7;
    font-size: 1em;
    padding: 0.25em;
    border: 2px solid #EDC7b7;
    margin-top: 0;
    margin-bottom: 0;
    width: 100%;
}
 
.offer-cell{
    border-width: 0;
}
.offerbtn{
    font-size: 1em;
    background-color: #123C69;
    color: #FEBC8B;
    cursor: pointer;
 
}
/* table cell for offer button */
.offerbutt{
    width: 25%;
    text-align:right;
    margin-right: 5px;
}
 
.buttonlink{ 
    background:#0099ff; 
    border-radius:7px; 
    color:#fff;
    display:block;
    float:left; 
    margin:10px 15px 10px 0; 
    padding:10px;
    text-decoration:none;
    cursor: pointer;
}
.buttonlink:hover{
    background:#FD8008;
}
.greenelement{
    background:#00008E;
    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;
}
 
 
/*
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; 
    text-align:left;
    margin-bottom:0px;
}
header{
    padding:0;
}
 
#thirdblock{
    background-color: #BAB2B5;
    width: 100%;
    padding:10px;
}
#toc-header{
    padding-left: 20px
}
.toc{
    padding-left: 20px;
 
}
#content {  
    float:left;
    width:65%;
     
}
#content.wide-content{
    float:none;
    width:100%;
}
 
.flexslider{
display:block;
/*demo 1 slider theme*/
margin: 0 0 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;}
 
.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;
    margin: .35em 0 0 0;
}
.srt-menu a {
    text-decoration:none;
}
.srt-menu li a {
    background:#fff;
    margin:0; 
    padding:10px 20px;
    height:45px;
}
.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;
}
  
.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;}
/* @notation inspired by tinyGrid, .row and percentage by Twitter Bootstrap
 */
  
#hero [class*="grid_"] { margin-bottom:-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) {
 
} 
 
/*
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; }
}