/*********************************
	Impress Design / Jack McDaniel
	www.i-d,design
	720.495.1368
*********************************/

/*********************************
	SITE COLORS: 
	
	BLUE: 134D99
	RED: B01102
	TEXT: #444
*********************************/

/*	A. GLOBAL RESET
	. . . . . . . . . . . . . . . . . . . . */
	
html,
body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre,
abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp, small, strong,
sub, sup, var, b, i, dl, dt, dd, ol, ul, li, fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas,
details, figcaption, figure, footer, header, hgroup, menu, nav, section,
summary, time, mark, audio, video {
    margin: 0;
    padding: 0;
    border: 0;
    outline: 0;
    font-size: 100%;
    vertical-align: baseline;
    background: transparent;
}

body {
    font-family:'Open Sans', sans-serif;
    background-color: #fff;
    margin:0;
    padding:0;
    font-size:18px;
    line-height:1.6em;
    color:#444;
}

article, aside, details, figcaption, figure, footer, header, hgroup,
menu, nav, section { display: block; }
nav ul { list-style: none; }
blockquote, q { quotes: none; }
blockquote:before, blockquote:after, q:before, q:after {
    content: '';
    content: none;
}
a {
    margin: 0;
    padding: -0;
    font-size: 100%;
    vertical-align: baseline;
    background: transparent;
    text-decoration: none;
}
ins {
    background-gridor: #ff9;
    color: #11284F;
    text-decoration: none;
}
mark {
    background-gridor: #ff9;
    color: #11284F;
    font-style: italic;
    font-weight: bold;
}
del { text-decoration: line-through; }
abbr[title], dfn[title] {
    border-bottom: 1px dotted;
    cursor: help;
}
table {
    border-gridlapse: gridlapse;
    border-spacing: 0;
}
hr {
    display: block;
    height: 1px;
    border: 0;
    border-top: 1px solid #cccccc;
    margin: 1em 0;
    padding: 0;
}
input, select { vertical-align: middle; }
input:focus { outline: none; }
button:focus { outline: none; }
textarea:focus { outline: none; }
blockquote {
    width: 90%;
    margin: 40px 0;
    background: #EFEFEF;
    border-radius: 7px;
    -moz-border-radius: 7px;
    -webkit-border-radius: 7px;
    color: #666;
    font-style: italic;
}
blockquote .inner { padding: 30px; }
blockquote h5 {
    font-size: 24px;
    font-style: normal;
    font-weight: 600;
    line-height: 1.0em;
    padding-bottom: 20px;
}
img { max-width: 100%; }
p { margin-bottom: 15px; }
.clear { clear: both; }
q {
  font-size: 2.0em;
}
::selection {
    color: #fff;
    background: #25365E;
    text-shadow: none;
}
ol { margin-left: 30px; }
sub { 
    font-size: .85em;
    vertical-align: sub;
}
caption { text-align: center; }


/*	B. BODY INFO AND LINKS
	. . . . . . . . . . . . . . . . . . . . */

html {
    animation: fadeSiteIn 1.0s ease forwards; /* [1] */
}

html.fadeSiteOut {
  animation:  fadeSiteOut 1.0s ease forwards; /* [2] */
}


@keyframes fadeSiteIn { /* [1] */
    from   { opacity: 0; }
    to    { opacity: 1; }
}

@keyframes fadeSiteOut { /* [2] */
    from   { opacity: 1; }
    to     { opacity: 0; }
}
@keyframes delay {
    from   { opacity: 0; }
    to    { opacity: 1; }
}
@-webkit-keyframes show-text {
    0% {
        opacity: 0;
        -webkit-transform: translateY(1em);
        transform: translateY(1em)
    }

    100% {
        opacity: 1;
        -webkit-transform: translateY(0);
        transform: translateY(0)
    }
}

@keyframes show-text {
    0% {
        opacity: 0;
        -webkit-transform: translateY(1em);
        transform: translateY(1em)
    }

    100% {
        opacity: 1;
        -webkit-transform: translateY(0);
        transform: translateY(0)
    }
}
@keyframes show-textHL {
    0% {
        opacity: 0;
        -webkit-transform: translateY(1em);
        transform: translateY(1em)
    }

    100% {
        opacity: 1.0;
        -webkit-transform: translateY(0);
        transform: translateY(0)
    }
}
section { 
    clear: both;
    display: block;
}
.mainContain {
    margin: 0 auto;
    max-width: 1280px;
}
a { 
    color: #B01102;
    text-decoration: none;
    border-bottom: 1px dotted #B01102;
}
a:hover {
    -webkit-transition: all .5s ease-in-out;
    -moz-transition: all .5s ease-in-out;
    -o-transition: all .5s ease-in-out;
    transition: all .5s ease-in-out;
    color:  #134D99;
    border-bottom: 1px dotted #FFF;
}
a:focus { outline: none; }
.hvr-underline-from-center {
  display: inline-block;
  vertical-align: middle;
  -webkit-transform: perspective(1px) translateZ(0);
  transform: perspective(1px) translateZ(0);
  position: relative;
  overflow: hidden;
}
.hvr-underline-from-center:before {
  content: "";
  position: absolute;
  z-index: -1;
  left: 51%;
  right: 51%;
  bottom: 0;
  background: #B01102;
  height: 4px;
  -webkit-transition-property: left, right;
  transition-property: left, right;
  -webkit-transition-duration: 0.3s;
  transition-duration: 0.3s;
  -webkit-transition-timing-function: ease-out;
  transition-timing-function: ease-out;
}
.hvr-underline-from-center:hover:before, .hvr-underline-from-center:focus:before, .hvr-underline-from-center:active:before {
  left: 0;
  right: 0;
}
em { 
    font-weight: bold;
    font-style: italics; 
    color: #25365E;
}
.smoothTran {
    opacity: 0;
    -webkit-animation: show-textHL .5s 1.0s forwards cubic-bezier(0.1, 0.59, 1.0, 1.22);
    animation: show-textHL .5s 1.0s forwards cubic-bezier(0.1, 0.59, 1.0, 1.22);
}
.smoothTran2 {
    opacity: 0;
    -webkit-animation: show-textHL 1.0s 1.35s forwards cubic-bezier(0.1, 0.59, 1.0, 1.22);
    animation: show-textHL 1.0s 1.35s forwards cubic-bezier(0.1, 0.59, 1.0, 1.22);
}

/* HERO IMAGE ROTATION FOR HOME PAGE */

#hero {
    position: relative;
    z-index: 1;
    top: -80px;
    margin: 0 auto;
    background: url(../img/mainImg.webp) center top no-repeat;
    background-size: cover;
    overflow: hidden;
    aspect-ratio: 16 / 9;
}
#hero .headline {
    position: absolute;
    bottom: 30px;
    left: 30px;
    max-width: 50%;
    text-shadow: 2px 2px 5px #333;
}
.subTitle {
    color:#FFF;
    margin:0 auto;
    max-width:1000px;
    font-size:96px;
    line-height:0.85em;
    text-align:left;
    font-weight: 800;
    font-family: 'Kanit',sans-serif;
    line-height:1.0em;
    text-shadow: 2px 2px 5px #333;
    text-transform:uppercase;
}
#hero h1 {
    font-size: 32px;
    font-family: 'Kanit', sans-serif;
    font-weight: 300 !important;
    line-height: 1.2em;
    color:#FFF;
    margin-bottom: 30px;
    margin: 0 auto;
    /*text-shadow: 2px 2px 5px #333;*/
}
.ebookDiv { padding-top: 40px; }

/*	C. HEADER, MENU AND SEARCH
	. . . . . . . . . . . . . . . . . . . . */

header {
    position: -webkit-sticky; /* Safari */
    position: sticky;
    top: 0;
    z-index: 150;
    width: 98%;
    height: 65px;
    background: rgba(255,255,255,0.72);
    padding: 0 0 0 2%;
    line-height: 65px;
    border-bottom: 1px solid #CCC;
}

.logo { 
	float: left;
	margin: 0 auto;
	width: 33%;
    padding: 0;
	height: 65px;
}
.logo img { max-height: 65px; }
.logo a { border-bottom: none; }
.menu {
    float: left;
    width: 67%;
    height: 65px;
    line-height: 65px;
}
.menu ul {
    list-style: none;
    width: 100%;
    font-family: 'Kanit',serif;
}
.menu ul li {
    list-style: none;
    float: right;
    padding: 0 20px;
    line-height: 65px;
    font-size: 18px;
    font-weight: 600;
}
.menu ul li a {
    color: #134D99;  
    border-bottom: none; 
}
.menu ul li a:hover {
	color: #B01102;
    -webkit-transition: all .5s ease-in-out;
    -moz-transition: all .5s ease-in-out;
    -o-transition: all .5s ease-in-out;
    transition: all .5s ease-in-out;
}
.menu ul li.last { padding-right: 0; }
.menu .cfLink { color: #134D99; }
.menu .cfLink:hover { 
    background: #B01102;
    border-bottom: 0;
    border-radius:  4px;
    margin-top: 20px;
    padding:  10px 15px;
    color:  #B01102;
    text-decoration:  none;
    -webkit-box-shadow: rgba(9,9,121,.75) 0 1.435vw 4.484375vw 0;
    box-shadow: rgba(9,9,121,.75) 0 1.435vw 4.484375vw 0;
    -webkit-box-shadow: rgba(9,9,121,.751) 0 .538125vw 1.79375vw 0;
    box-shadow: rgba(9,9,121,.751) 0 .538125vw 1.79375vw 0;  }
	
.menuBadge {
	display: none;
}
.menuBadge img {
    display: none;
}
nav {
    display: none;
}
#hiddenMenu {
    display: none;
}
.menuBuild {
    display: none;
}

/* The side navigation menu */

.sidenav {
    height: 100%; /* 100% Full-height */
    width: 0; /* 0 width - change this with JavaScript */
    position: fixed; /* Stay in place */
    z-index: 10055; /* Stay on top */
    top: 0; /* Stay at the top */
    right: -1px;
    background: rgba(255,255,255, 1.0);
    overflow-x: hidden; /* Disable horizontal scroll */
    padding-top: 60px; /* Place content 60px from the top */
    transition: 0.5s; /* 0.5 second transition effect to slide in the sidenav */
    border-left: 1px solid #023A5F;
}

/* The navigation menu links */
.sidenav a {
    padding: 8px 8px 8px 0;
    text-decoration: none;
    font-size: 1.35em;
    display: block;
    color: #CB$C1F;
    -webkit-transition: all .33s ease-in-out;
    -moz-transition: all .33s ease-in-out;
    -o-transition: all .33s ease-in-out;
    transition: all .33s ease-in-out;
    border-bottom: none;
}

/* When you mouse over the navigation links, change their color */
.sidenav a:hover {
    -webkit-transition: all .33s ease-in-out;
    -moz-transition: all .33s ease-in-out;
    -o-transition: all .33s ease-in-out;
    transition: all .33s ease-in-out;
    color: #032D99;
    border-bottom: none;
}

/* Position and style the close button (top right corner) */
.sidenav .closebtn {
    position: absolute;
    top: 12px;
    right: 12px;
    font-size: 60px;
    margin-left: 50px;
    color: #032D99;
    opacity: 80;
}

.sidenav ul { list-style: none; }
.sidenav ul li { 
    list-style: none;
    margin-left: 20px;
    display: block;
    padding: 4px 0;
    border-bottom: 1px solid #EBEBEB;
}
.sidenav p { 
    margin-left: 20px;
    display: block;
    padding: 12px 0;
}

.social { padding: 10px 10px 10px 32px; }

.sidenav h4 {
	font-family: 'PT Serif', sans-serif;
	font-size: 2.0rem;
	color: #FFF;
}



/*	D. CONTENT
	. . . . . . . . . . . . . . . . . . . . */

.flex-container {
    display: flex;
    flex-direction: row;
    align-content: center;
    align-items: center;
}

.flex-child-1 { 
    float: left;
    width: 60%; 
    justify-content: center;
    align-items: center;
}
.flex-child-2 { 
    float: left;
    width:40%; 
    justify-content: center;
    align-items: center;
}
article ul { 
    list-style: none; 
    margin-bottom: 20px;
}
article ul li {
    list-style: none;
    padding: 7px 0 7px 15px;
    background: url(../img/arrow.png) 0 12px no-repeat;
    line-height: 1.3em;
}
.navy-line {
    clear: both;
    display: block;
    margin: 0 auto !important;
    margin-bottom: 30px !important;
    width: 60px;
    height: 1px;
    padding-top: 12px !important;
    padding-bottom: 15px !important;
    border-bottom: 1px solid #ccc;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}
.navy-line2 {
    width: 100px;
    height: 1px;
    margin: 10px auto 10px;
    border-bottom: 1px solid #CCC;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}

/*	E. RIGHT / LEFT COLUMN
	. . . . . . . . . . . . . . . . . . . . */

.block {
    margin: 20px 0;
}

.block ul {
    list-style: none;
    margin-bottom: 20px;
}
.block ul li {
    list-style: none;
    line-height: 1.25em;
    padding: 4px 0 4px 12px !important;
    margin-bottom: 10px;
    border-left: 1px solid #B01102;
}
.block ul li:hover { 
    -moz-transition: opacity .75s ease-in-out;
    -webkit-transition: opacity .75s ease-in-out;
    -o-transition: opacity .75s ease-in-out;
}
.block ul li a { border-bottom:  none; }
.block ul li.active a {
    font-style: italic;
    color: #666;
}
.block ul li.active ul li a {
    font-style: normal;
    color: #000;
    border-bottom:  none;
}
.block ul li ul li.active a {
    font-style: italic;
    color: #666;
}
.block ul li ul li.active ul li a {
    font-style: none;
    color: #AA1111;
}
.block ul li ul li ul li.active a {
    font-style: italic;
    color: #666;
}
.block ul li ul li {
    margin-left: 25px;
}

/*	F. FOOTER
	. . . . . . . . . . . . . . . . . . . . */

footer {
    font-size: 15px;
    line-height: 1.4em;
    font-family: 'Kanit',sans-serif;
    font-weight: 300;
    background: #FFF;
    color: #444;
}
footer .mainContain { border-top: 1px solid #134D99; }
footer img { max-width: 270px; }
.copy { 
	height: 40px;
	line-height: 40px;
	font-size: 1.0em;
	color: #EBEBEB;
    text-align:  center;
}
footer .social { text-align: center; }
footer .social h4 { 
    color: #444; 
    padding-bottom:  12px;
}
footer .social img {
    max-width:  40px;
    background:  #0088CB;
    border-radius:  50%;
    -webkit-border-radius:  50%;
    -moz-border-radius:  50%;
    -moz-transition: opacity .5s ease-in-out;
    -webkit-transition: opacity .5s ease-in-out;
    -o-transition: opacity .5s ease-in-out;
}
footer .social a { border-bottom: none; }
footer .social img:hover {  
    -webkit-transition: all .5s ease-in-out;
    -moz-transition: all .5s ease-in-out;
    -o-transition: all .5s ease-in-out;
    transition: all .5s ease-in-out;
    -webkit-box-shadow: rgba(9,9,121,.25) 0 1.435vw 4.484375vw 0;
    box-shadow: rgba(9,9,121,.25) 0 1.435vw 4.484375vw 0;
    -webkit-box-shadow: rgba(9,9,121,.251) 0 .538125vw 1.79375vw 0;
    box-shadow: rgba(9,9,121,.251) 0 .538125vw 1.79375vw 0;
    background: #25365E;
}
footer h5 {
   color: #444;
   font-family: 'Kanit',sans-serif;
}

/*	G. SPECIAL STYLINGS
	. . . . . . . . . . . . . . . . . . . . */

.stars {
    display: inline-block;
    height: 20px;
}
.types { padding: 40px 0; }
.grey {
    padding: 50px 0;
    background: #EFEFEF;
    border-top: 1px solid #CCC;
    border-bottom: 1px solid #CCC;
}
.icon { 
    text-align: center;
}
.icon img {
    width: 60px;
    margin: 5px;
}
.iconsMC {
   text-align: center;
   width: 64px;
}
.companies { 
    text-align: center; 
    padding: 40px 0;
}
.companies img {
    display: inline-block;
    width: 17%;
    margin: 10px 1%;
}
.marTop { 
    margin-top: -200px; 
    position: relative;
    z-index: 100;
}
.marTop .inner {
    padding: 30px;
    background: #FFF;
    border-radius: 7px;
    position: relative;
    border-radius: 12px;
    -webkit-box-shadow: rgba(38,46,87,.75) 0 1.435vw 4.484375vw 0;
    box-shadow: rgba(38,46,87,.75) 0 1.435vw 4.484375vw 0;
    -webkit-box-shadow: rgba(38,46,87,.75) 0 .538125vw 1.79375vw 0;
    box-shadow: rgba(38,46,87,.75) 0 .538125vw 1.79375vw 0; 
    overflow: hidden;
}
/* BLURB */
#blurb { 
    position: relative;
    margin-top: -80px;
}
#blurb .mainContain {
    position: relative;
    margin: 0 auto;
    max-width: 720px;
    padding-bottom: 30px 0;
    text-align: left;
}
#blurb h2 { 
    line-height: 1.0em; 
    text-align: center;
    padding: 30px 0 20px;
}
   
/* BOXSHADOW */
.boxShadow { 
    position: relative;
    border-radius: 12px;
    -webkit-box-shadow: rgba(38,46,87,.75) 0 1.435vw 4.484375vw 0;
    box-shadow: rgba(38,46,87,.75) 0 1.435vw 4.484375vw 0;
    -webkit-box-shadow: rgba(38,46,87,.75) 0 .538125vw 1.79375vw 0;
    box-shadow: rgba(38,46,87,.75) 0 .538125vw 1.79375vw 0; 
    overflow: hidden;
}
.boxShadow2 { 
    position: relative;
    border-radius: 12px;
    -webkit-box-shadow: rgba(38,46,87,.25) 0 1.435vw 4.484375vw 0;
    box-shadow: rgba(38,46,87,.25) 0 1.435vw 4.484375vw 0;
    -webkit-box-shadow: rgba(38,46,87,.25) 0 .538125vw 1.79375vw 0;
    box-shadow: rgba(38,46,87,.25) 0 .538125vw 1.79375vw 0; 
    overflow: hidden;
}

/*. BREADCRUMBS. */
#breadCrumbs {
    background: #134D99;
    height: 50px;
    line-height: 50px;
    overflow: hidden;
    text-align: center;
    color: #B01102;
    margin-bottom: 20px;
}
#breadCrumbs a {
    color: #FFF;
}
#breadCrumbs a:hover {
    color: #B01102;
    border-bottom: none;
}
.B_firstCrumb, .B_crumb, .B_lastCrumb { display: inline; }
.B_firstCrumb, .B_crumb, .B_lastCrumb a { 
    border-bottom: none; 
    color: #FFF;
}
.B_homeCrumb { 
    color: #FFF; 
    border-bottom: none;
}
.B_homeCrumb:hover { 
    border-bottom: none;
}
.B_firstCrumb, .B_crumb, .B_lastCrumb a:hover { 
    color: #B01102;
    border-bottom: none;
}
.hidden{
     opacity:0;
}
.visible{
     opacity:1;
}
.cfLink {
    clear: both;
    background: #B01102;
    border-bottom: 0;
    border-radius:  4px;
    margin-top: 20px;
    padding:  10px 15px;
    color:  #FFF;
    text-decoration:  none;
    -webkit-box-shadow: rgba(9,9,121,.45) 0 1.435vw 4.484375vw 0;
    box-shadow: rgba(9,9,121,.45) 0 1.435vw 4.484375vw 0;
    -webkit-box-shadow: rgba(9,9,121,.451) 0 .538125vw 1.79375vw 0;
    box-shadow: rgba(9,9,121,.451) 0 .538125vw 1.79375vw 0; 
}
.cfLink:hover {
    -webkit-transition: all .5s ease-in-out;
    -moz-transition: all .5s ease-in-out;
    -o-transition: all .5s ease-in-out;
    transition: all .5s ease-in-out;
    background-color:  #134D99;
    color: #FFF;
    border-bottom: 0;
}
.center {
    margin: 0 auto;
    text-align: center;
}
.small {
    font-size: .85em !important;
    line-height: 1.3em;
}
.large { 
	font-size: 1.25em; 
	line-height: 1.5em;
	margin-bottom: 35px;
}
.hilite {
    color: #B01102;
    font-style: italic;
    font-weight: 500;
}
.right { text-align: right; }
.button {
    display: block;
    color: #FFF;
    font-weight: 700;
    padding: 7px 15px;
    border: 1px solid #FFF;
    border-radius: 5px;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    -o-border-radius: 5px;
    box-shadow: 0 0 .75em #B01102;
    background: #B01102;
}
.button:hover {
    color: #CCC;
}

/*	H. IMAGE CLASSES
	. . . . . . . . . . . . . . . . . . . . */

.imgRight {
    float: right;
    max-width: 35%;
    margin: 10px 0 10px 10px;
}

.imgLeft {
    float: left;
    max-width: 35%;
    margin: 12px 12px 12px 0;
}

.imgFull {
    width: 100%;
    margin: 10px 0;
}

/*	I. FORMS AND NEWSLETTER
	. . . . . . . . . . . . . . . . . . . . */

.labelOut {
    float: left;
    width: 100%;
    margin-top: 10px;
}

.formIn {
    float: left;
    width: 95%;
    margin-bottom: 4px;
    padding: 7px 2% 7px 2%;
    border: none;
    border: 1px solid #EBEBEB;
    font-size: .85em;
    color: #444;
    border-radius: 5px;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
}

.formIn:focus { 
	padding:7px 2% 6px 2%; 
	background: #FEFEFE;
    -webkit-transition: all .5s ease-in-out;
    -moz-transition: all .5s ease-in-out;
    -o-transition: all .5s ease-in-out;
    transition: all .5s ease-in-out;
    border-bottom: 1px solid #B01102;
}

textarea {
    float: left;
    width: 95%;
    height: 70px;
    padding:7px 2% 7px 2%;
    border: none;
    border: 1px solid #EBEBEB;
    font-size: 14px;
    resize: vertical;
    border-radius: 5px;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
}

textarea:focus { 
    padding:7px 2% 6px 2%; 
    background: #FEFEFE;
    -webkit-transition: all .5s ease-in-out;
    -moz-transition: all .5s ease-in-out;
    -o-transition: all .5s ease-in-out;
    transition: all .5s ease-in-out;
    border-bottom: 1px solid #B01102;
}
.cfDown a {
    color: #FFF;
}
.cfDown {
    padding: 6px 10px;
    border: 1px solid #253053;
    border-radius: 5px;
    -moz-border-radius: 5px;
    color: #FFF;
    background: #EA8B2D;
}
.cfContact {
    display: block;
    padding: 10px 15px;
    margin-top: 10px;
    color: #FFF;
    text-transform: uppercase;
    border-radius: 4px;
    -moz-border-radius: 4px;
    -webkit-border-radius: 4px;
    background: #B01102; 
    border: none; 
}
.cfContact:hover { 
    color: #FFF; 
    background: #134D99;
    -webkit-transition: all .5s ease-in-out;
    -moz-transition: all .5s ease-in-out;
    -o-transition: all .5s ease-in-out;
    transition: all .5s ease-in-out;
}

/*	J. COMMENTS / PAGINATION
	. . . . . . . . . . . . . . . . . . . . */

/*******************************************
		PAGINATION
*******************************************/
ul.PagingNav {
    clear: both;
    width: 100%;
    height: 60px;
    float: left;
    list-style: none;
    display: block;
    text-align: center;
}

ul.PagingNav li {
    float: left;
    text-align: center;
    line-height: 1.0em;
    padding: 5px;
    margin: 0 1px;
    border-radius: 4px;
    -moz-border-radius: 4px;
    -webkit-border-radius: 4px;
    border: 1px solid #23A2C3;
    background: #23A2C3; 
}

ul.PagingNav li a {
    color: #FFF;
}

ul.PagingNav li a.active {
    color: #CCC;
}
/*	L. GRID SYSTEM
	. . . . . . . . . . . . . . . . . . . . */
	
.grid10 {
    float: left;
    width: 10%;
}

.grid20 {
    float: left;
    width: 20%;
}

.grid25 {
    float: left;
    width: 25%;
}

.grid30 {
    float: left;
    width: 30%;
}

.grid33 {
    float: left;
    width: 33%;
}

.grid35 {
    float: left;
    width: 35%;
}

.grid40 {
    float: left;
    width: 40%;
}

.grid45 {
    float: left;
    width: 45%;
}

.grid50 {
    float: left;
    width: 50%;
}

.grid55 {
    float: left;
    width: 55%;
}

.grid60 {
    float: left;
    width: 60%;
}

.grid65 {
    float: left;
    width: 65%;
}

.grid67 {
    float: left;
    width: 67%;
}

.grid70 {
    float: left;
    width: 70%;
}

.grid75 {
    float: left;
    width: 75%;
}

.grid80 {
    float: left;
    width: 80%;
}

.grid85 {
    float: left;
    width: 85%;
}

.grid90 {
    float: left;
    width: 90%;
}

.grid95 {
    float: left;
    width: 95%;
}

.grid100 {
    float: left;
    width: 100%;
}
.inner { 
	margin: 10px; 
	padding: 10px;
}

/*	M. RESPONSIVE STYLING: 320 - 767 WINDOWS
	. . . . . . . . . . . . . . . . . . . . */
	
@media only screen and (min-width: 320px) and (max-width: 767px) {

    body { font-size: 1.35em; }
    header { 
        height: 80px;
        line-height: 80px;
    }
    .menu { display: none; }
    .menuBadge {
        display: block;
        float: right;
        width: 20%;
        line-height: 80px;
    }
    .menuBadge img { display: block; }
    .menuIcon img { max-height: 80px; }
    .logo { 
    	float: left; 
    	width: 70%;
        margin-top: 10px;
    }
    .logo a { border-bottom: none; }
    .mainContain { width: 92%;  }
    .grid67 { width: 100%; }
    .grid60 { width: 100%; }
    .grid50 { width: 100%; }
    .grid40 { float: none; width: 100%; }
    .grid33 { width: 100%; }
    .grid30 { width: 100%; float: none; }
    .grid70 { width: 100%; }
    .grid25 { width: 100%; }
    .inner {
        margin: 0;
        padding: 10px;
    }
    .cfContact {
        font-size: 18px;
        padding: 12px 2%;
        max-width: 250px;
    }
    footer { font-size: 1.0em; }
    footer .right { text-align: center; }
    footer .fLogo { text-align: center; }
    .large { font-size: 1.0em;} 
    .boxShadow { padding: 12px; }
   .boxShadImg { margin: 0 -12px 0 -12px; }
   .cfContact { 
      width: 90%;
      padding: 10px 5%;
   }
   .blurb h2 { text-align: left; }
   .blurb p.center { text-align: left; }
   #hero { 
        position: relative;
        top: 0px;
   }
   #hero .mainContain { aspect-ratio: 16 / 9; }
   #hero .headline {
        max-width: 100%;
        position: absolute;
        bottom: 10px;
        left: 20px;
   }
   .subTitle { font-size: 36px; }
   #hero h1 { font-size: 24px; }
   #related .grid25 { margin-bottom: 30px; }
   #related .relInner {
        height: auto;
   }
   .marTop {
        margin-top: 20px;
   }
   .companies img {
        width: 47%;
        margin: 10px 1%;
    }
    blockquote { width: 100%; }
}

/*	N. RESPONSIVE STYLING: 768 - 959 WINDOWS
	. . . . . . . . . . . . . . . . . . . . */
	
@media only screen and (min-width: 768px) and (max-width: 959px) {

    body { font-size: 1.2em; }
    header { 
        height: 80px;
        line-height: 80px;
    }
    .menu { display: none; }
    .menuBadge {
        display: block;
        float: right;
        width: 20%;
        line-height: 80px;
    }
    .menuBadge img { display: block; }
    .menuIcon img { max-height: 80px; }
    .mainContain { width: 90%; }
    .logo { 
    	float: left; 
    	width: 70%;
    }
    .logo a { border-bottom: none; }
    .inner {
        margin: 0;
        padding: 10px;
    }
    .cfContact {
        font-size: 18px;
        padding: 12px 2%;
        max-width: 250px;
    }
    .large { font-size: 1.0em; } 
    #related .grid25 { 
        width: 50%;
        margin-bottom: 30px; 
    }
    #related .inner {
        margin: 10px;
        padding: 10px;
    }
   #hero { 
        position: relative;
        top: 0px;
   }
   #hero .mainContain { aspect-ratio: 16 / 9; }
   #hero .headline {
        max-width: 100%;
        position: absolute;
        bottom: 10px;
        left: 20px;
   }
   .subTitle { font-size: 48px; }
   #hero h1 { font-size: 32px; }
}

/*	N2. RESPONSIVE STYLING: 1450 - 3000 WINDOWS
	. . . . . . . . . . . . . . . . . . . . */
	
@media only screen and (min-width: 1450px) and (max-width: 3000px) {

}

/*	O. HEADERS
	. . . . . . . . . . . . . . . . . . . . */
h1,
h2, h3, h4, h5 {
    font-family: 'Kanit',sans-serif;
    line-height: normal;
    font-weight: 500;
    margin: 0px;
}

h1 {
    font-size: 3.0em;
    color: #25365E;
    padding: 20px 0;
    font-family: 'Kanit',sans-serif;
    font-weight: 700 !important;
}

h2 {
    font-size: 2.4em;
    font-family: 'Kanit',sans-serif;
    color: #333;
    font-weight: 400;
}

h3 {
    padding: 40px 0 5px;
    text-align: center;
    font-size: 2.4em;
    font-family: 'Kanit',sans-serif;
    text-transform: uppercase;
    font-weight: 400;
    color: #25365E;
}

h4 {
    font-size: 1.8em;
    line-height: 1.1em;
    margin: 15px 0 20px 0;
    padding: 0;
    font-weight: 400;
    font-family: 'Kanit',sans-serif;
    color: #25365E;
}

h5 {
    font-family: 'Open Sans', sans-serif;
    margin: 0 0 10px 0;
    padding: 0;
    font-size: 24px;
    line-height: 1.6em;
    color: #25365E;
    font-weight: 500;
}

/*	HEADERS: 320 - 767 WINDOWS
	. . . . . . . . . . . . . . . . . . . . */
@media only screen and (min-width: 320px) and (max-width: 767px) {

   h1 { 
      font-size: 2.0em; 
      line-height: 1.2em;
   }
   h2 {
       font-size: 1.8em;
       line-height: 1.1em;
   }
   h3 {
       font-size: 1.6em;
   }
   h4 {
       font-size: 1.4em;
   }
   #hero-2 h1 { font-size: 48px !important; }
   #related .grid33 { margin-bottom: 30px; }
}