/* http://meyerweb.com/eric/tools/css/reset/
   v2.0 | 20110126
   License: none (public domain)

   Stylesheet for Zoo Creative - 20 Sept 2016
*/

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video { margin: 0; padding: 0; border: 0; font-size: 100%; font: inherit;	vertical-align: baseline;}

/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {display: block;}

html {font-family: 'Yantramanav', sans-serif; font-weight:300;}

body {line-height: 1; background:#232323; background-image:url('../images/logo-right.png'); background-repeat:no-repeat; background-position:right top; background-size:25% auto;}

p {font-size:14px;}

a,
a:link, a:visited {color:#ffffff; text-decoration:none;}
a:hover, a:active {color:#ffffff; text-decoration:underline;}

ol, ul {list-style: none;}

blockquote, q {quotes: none;}

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

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

h1.main-text{display:inline;}

.mdash {position:relative; top:-4px;}

#wrapper {color:#ffffff;}

#main {width:100%;}

/**********  content left  ************/

#header-left {float:left; padding:15px 0px 25px 0px; width:40%;}
#header-left img {height:31px;}
#header-left h1 {font-weight:700; letter-spacing:3px; font-size:18px; display:inline-block; text-transform: uppercase; position:absolute; margin-top:8px; padding-left:30px;}

#header-right {float:right; width:40%; text-align:right; padding:13px 15px 15px 15px;}
#header-right img {height:40px; padding-left:5px;}

/**********  content middle  ************/

/**********  footer  ************/

#footer {margin-left:50px; margin-top:40px; margin-bottom:100px;}
#footer h1 {display:none;}
#footer p {width:100%; padding-top:5px;}
#footer p strong {font-weight:300;}

ul {display: table;}
ul > li {display: table-row;}
ul > li::before {content:"//\00a0\00a0"; display: table-cell; text-align: right;}
ul > li.phone::before {content:"\00a0\00a0"; display: table-cell; text-align: right;}

#footer-text {}

#footermobile {display:none;}

.videoWrapper {clear:both; position: relative; padding-bottom: 54.25%; /* 16:9 */ padding-top: 25px; height: 0;}
.videoWrapper iframe {position: absolute; top: -10px; left: 0; width: 100%; height: 100%;}

/*==========  Mobile First Method  ==========*/

/****************************************/
/***** MEDIA QUERY FOR BELOW 767PX ******/
/****************************************/
@media (max-width:767px) {

   #header-left h1 {display:none;}

   #footer {display:none;}

   #footermobile {display:inline;}
   #footermobile {display:block; margin-left:50px; margin-top:40px; margin-bottom:100px;}
   #footermobile h1 {display:inline; font-weight:700; letter-spacing:3px; font-size:18px;}
   #footermobile p {width:100%; padding-top:10px; line-height:22px;}

   ul {display: table;}
   ul > li {display: table-row;}
   ul > li::before {content:"//\00a0\00a0"; display: table-cell; text-align: right;}
   ul > li.phone::before {content:"\00a0\00a0"; display: table-cell; text-align: right;}

   .videoWrapper {clear:both; position: relative; padding-bottom: 48.25%; /* 16:9 */ padding-top: 25px; height: 0;}
   .videoWrapper iframe {position: absolute; top: -10px; left: 0; width: 100%; height: 100%;}

}

/****************************************/
/**** MEDIA QUERY FOR 768PX - 991PX *****/
/****************************************/
@media (min-width:768px) and (max-width:991px) {

   #footer {margin-left:50px; margin-top:40px;}

}

/****************************************/
/*** MEDIA QUERY FOR 992PX - 1199PX *****/
/****************************************/
@media (min-width:992px) and (max-width:1199px) {

}

/****************************************/
/*** MEDIA QUERY FOR 1200PX AND ABOVE ***/
/****************************************/
@media (min-width:1200px) {

}
