/*! HTML5 Boilerplate v5.3.0 | MIT License | https://html5boilerplate.com/ */

/*
* What follows is the result of much research on cross-browser styling.
* Credit left inline and big thanks to Nicolas Gallagher, Jonathan Neal,
* Kroc Camen, and the H5BP dev community and team.
*/

/* ==========================================================================
Base styles: opinionated defaults
========================================================================== */

@font-face {
   font-family: 'Montserrat-Bold';
   src: url('../fonts/Montserrat-Bold.eot?#iefix') format('embedded-opentype'), url('../fonts/Montserrat-Bold.otf') format('opentype'),  url('../fonts/Montserrat-Bold.woff') format('woff'), url('../fonts/Montserrat-Bold.ttf') format('truetype'), url('../fonts/Montserrat-Bold.svg#Montserrat-Bold') format('svg');
   font-weight: normal;
   font-style: normal;
}
@font-face {
   font-family: 'Montserrat-Light';
   src: url('../fonts/Montserrat-Light.eot?#iefix') format('embedded-opentype'), url('../fonts/Montserrat-Light.otf') format('opentype'),  url('../fonts/Montserrat-Light.woff') format('woff'), url('../fonts/Montserrat-Light.ttf') format('truetype'), url('../fonts/Montserrat-Light.svg#Montserrat-Light') format('svg');
   font-weight: normal;
   font-style: normal;
}
@font-face {
   font-family: 'Montserrat-Regular';
   src: url('../fonts/Montserrat-Regular.eot?#iefix') format('embedded-opentype'), url('../fonts/Montserrat-Regular.otf') format('opentype'),  url('../fonts/Montserrat-Regular.woff') format('woff'), url('../fonts/Montserrat-Regular.ttf') format('truetype'), url('../fonts/Montserrat-Regular.svg#Montserrat-Regular') format('svg');
   font-weight: normal;
   font-style: normal;
}
@font-face {
   font-family: 'Montserrat-SemiBold';
   src: url('../fonts/Montserrat-SemiBold.eot?#iefix') format('embedded-opentype'), url('../fonts/Montserrat-SemiBold.otf') format('opentype'),  url('../fonts/Montserrat-SemiBold.woff') format('woff'), url('../fonts/Montserrat-SemiBold.ttf') format('truetype'), url('../fonts/Montserrat-SemiBold.svg#Montserrat-SemiBold') format('svg');
   font-weight: normal;
   font-style: normal;
}
html { color: #222; font-size: 1em; line-height: 1.4; }

/*
* Remove text-shadow in selection highlight:
* https://twitter.com/miketaylr/status/12228805301
*
* These selection rule sets have to be separate.
* Customize the background color to match your design.
*/

::-moz-selection {
   background: #b3d4fc;
   text-shadow: none;
}

::selection {
   background: #b3d4fc;
   text-shadow: none;
}
/*
* A better looking default horizontal rule
*/

hr { display: block; height: 1px; border: 0; border-top: 1px solid #ccc; margin: 1em 0; padding: 0; }
/*
* Remove the gap between audio, canvas, iframes,
* images, videos and the bottom of their containers:
* https://github.com/h5bp/html5-boilerplate/issues/440
*/

audio, canvas, iframe, img, svg, video { vertical-align: middle; }
/*
* Remove default fieldset styles.
*/

fieldset { border: 0; margin: 0; padding: 0; }
/*
* Allow only vertical resizing of textareas.
*/

textarea { resize: vertical; }
/* ==========================================================================
Browser Upgrade Prompt
========================================================================== */

.browserupgrade { line-height: 30px; font-size: 16px; padding: 15px; background-color: #43c2ff; text-align: center; }
/* ==========================================================================
Author's custom styles
========================================================================== */

* { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; }
body { font-family: 'Montserrat-Regular', sans-serif; margin: 0; }
.banner-section {position:relative; background-image: url(../images/banner-img.jpg); background-repeat: no-repeat; background-size: cover; background-position: center; background-color: #222; }
.header-section { position: relative; text-transform: uppercase; color: #fff; padding-top: 20px; padding-bottom: 20px; font-family: 'Montserrat-SemiBold', sans-serif; letter-spacing: 1px; width: 100%; top: 0; font-size: 12px; line-height: 34px; }
.header-section a { display: inline-block; padding-bottom: 5px; color: #fff; text-decoration: none; letter-spacing: 3px; margin-left: 25px; font-size: 14px; font-family: 'Montserrat-SemiBold', sans-serif; border-bottom: 1px solid transparent; transition: border-color 0.3s; }
.header-section a.active{color:#3fde9c;}
.header-section a:first-child { margin-left: 0; }
.header-section a:hover, .header-section a:focus { border-bottom: 1px solid #fff; }
.your-class{width: 100%;float: left; position:absolute;bottom: 0px;    padding: 14.5px 5px 14.5px 3px; background-color: rgba(54, 54, 54, 0.7);}
.slick-slide img{margin: 0 auto;width:auto !important;}
.menu-container { display: none; transition: opacity 0.3s; opacity: 0; }
.menu-container.open { display: block; position: absolute; width: 100%; left: 0px; top: 90px; background-color: #FFF; height: 102px; opacity: 1; }
.menu-container.open a { display: block; color: #222; margin: 0; padding: 8px 8px 8px 20px; }
.menu-icon { display: inline-block; }
.primary-text { font-family: 'Montserrat-Regular', sans-serif; font-size: 30px; font-weight: 400; text-transform: uppercase; color: #fff; letter-spacing: 4px; margin-top: 0; margin-bottom: 0; }
.secondary-text { font-family: 'Montserrat-Bold', sans-serif; font-size: 40px; font-weight: 600; text-transform: uppercase; color: #fff; margin: 0; line-height: 50px; }
.banner-text { font-family: 'Montserrat-Regular', sans-serif; color: #fff; font-size: 16px; font-weight: 400; max-width: 720px; line-height: 26px; margin-bottom:50px; }
.banner-section .primary-text { margin-top: 20px; }
.banner-section .primary-btn { margin-bottom: 20px; }
.is-table .is-table-cell { float: none; display: table-cell; vertical-align: middle; }
.is-table { display: table; width: 100%; height: calc(100vh - 70px); }
.primary-btn { font-family: 'Montserrat-Bold', sans-serif; background-color: #3fde9c; width: 200px; height: 60px; font-weight: 600; font-size: 16px; text-align: center; color: #fff; text-transform: uppercase; display: inline-block; text-decoration: none; line-height: 60px; letter-spacing: 4px; border-radius: 3px; transition: background-color 0.3s; will-change: background-color; }
.primary-btn:hover, .primary-btn:focus, .primary-btn:active { background-color: #34c589; }
.primary-color { color: #3fde9c; }
.white-section { padding-top: 50px; padding-bottom: 50px; background-color: #f8f8ff; }
.white-section .page-heading { color: #212121; }
.page-heading { font-size: 30px; font-family: 'Montserrat-Light', sans-serif; font-weight: 300; text-align: center; text-transform: uppercase; margin: 0; }
.page-heading .f-w-500 { font-family: 'Montserrat-SemiBold', sans-serif; font-weight: 500; }
.icon-container { text-align: center; margin-bottom: 15px; margin-top: 35px; }
.icon-border { display: inline-block; height: 100px; width: 100px; border: 3px solid #f0f0f0; border-radius: 50px; padding: 8px; }
.icon-border img { width: 100%; }
.info-container { text-align: center; }
.info-heading { display: block; font-size: 18px; text-transform: uppercase; letter-spacing: 4px; font-family: 'Montserrat-Bold', sans-serif; font-weight: 600; margin: 0; }
.info-text { font-family: 'Open Sans', sans-serif; font-weight: 400; display: inline-block; font-size: 16px; line-height: 26px; color: #898989; max-width: 228px; margin-bottom: 0; margin-top: 15px; }
.form-section { background-color: #222; background-image: url(../images/form-bg.jpg); background-repeat: no-repeat; background-size: cover; background-position: center; padding-top: 50px; padding-bottom: 50px; }
.form-section .page-heading { color: #fff; margin-bottom: 40px; }
.form-section .row { margin-left: -30px; margin-right: -30px; }
.form-section .row .col-sm-6 { padding-left: 30px; padding-right: 30px; }
.form .primary-btn { border: 0; outline: none; display: inline-block; width: 220px; font-size: 22px; margin-top: 20px; cursor: pointer; }
/* For material input */
.paper-input-wrapper { position: relative; width: 100%; margin-bottom: 30px; margin-top: 10px; }
.paper-input { display: block; width: 100%; margin: 0; border: none; border-bottom: 2px solid #fff; font-size: 16px; font-family: 'Montserrat-Regular', sans-serif; padding: 8px 0; background-color: transparent; color: #fff; letter-spacing: 2px; height: 48px; box-shadow:none; }
.paper-input:focus, .paper-input.has-focus { outline: none; }
.paper-input:focus ~ label::after, .paper-input.has-focus ~ label::after {
   visibility: visible;
   width: 100%;
   left: 0;
}
.paper-input ~ label {
   font-size: 16px;
   font-family: 'Montserrat-Regular', sans-serif;
   width: 100%;
   position: absolute;
   pointer-events: none;
   left: 0;
   top: 0;
   bottom: 0;
   color: #fff;
   letter-spacing: 4px;
   text-transform: uppercase;
   line-height: 38px;
}
.paper-input ~ label::after {
   content: '';
   background-color: #fff;
   height: 2px;
   width: 0.625rem;
   bottom: 0;
   left: 45%;
   visibility: hidden;
   position: absolute;
   transition: 0.2s ease all;
}
.paper-input--floating ~ label {
   transition: 0.2s ease all;
}
.paper-input--floating:focus ~ label, .paper-input--floating.paper-input--touched ~ label {
   visibility: visible;
   top: -20px;
   font-size: 14px;
   color: #fff;
}
/*.paper-input--floating.paper-input--dirty:invalid ~ label {
color: #d34336;
}*/
/* .paper-input--dirty:invalid ~ label:after {
background-color: #d34336;
}*/

.paper-input--dirty.error ~ label::after {
   background-color: #d34336;
}
.logo img{max-width:250px;}
.logo a:hover,.logo a:focus{text-decoration:none; border-bottom:none;}
/* .paper-input--dirty:invalid {
box-shadow: none;
border-color: #d34336;
}*/
/* For material input */

.form #title-error { display: none !important; }
.container { margin-right: auto; margin-left: auto; padding-left: 15px; padding-right: 15px; }
.row { margin-left: -15px; margin-right: -15px; }
/* Bootstrap Clearfix */
.clearfix:before, .clearfix:after, .dl-horizontal dd:before, .dl-horizontal dd:after, .container:before, .container:after, .container-fluid:before, .container-fluid:after, .row:before, .row:after, .form-horizontal .form-group:before, .form-horizontal .form-group:after, .btn-toolbar:before, .btn-toolbar:after, .btn-group-vertical>.btn-group:before, .btn-group-vertical>.btn-group:after, .nav:before, .nav:after, .navbar:before, .navbar:after, .navbar-header:before, .navbar-header:after, .navbar-collapse:before, .navbar-collapse:after, .pager:before, .pager:after, .panel-body:before, .panel-body:after, .modal-header:before, .modal-header:after, .modal-footer:before, .modal-footer:after { content: " "; display: table; }
.clearfix:after, .dl-horizontal dd:after, .container:after, .container-fluid:after, .row:after, .form-horizontal .form-group:after, .btn-toolbar:after, .btn-group-vertical>.btn-group:after, .nav:after, .navbar:after, .navbar-header:after, .navbar-collapse:after, .pager:after, .panel-body:after, .modal-header:after, .modal-footer:after { clear: both; }
.clearfix:before, .clearfix:after, .dl-horizontal dd:before, .dl-horizontal dd:after, .container:before, .container:after, .container-fluid:before, .container-fluid:after, .row:before, .row:after, .form-horizontal .form-group:before, .form-horizontal .form-group:after, .btn-toolbar:before, .btn-toolbar:after, .btn-group-vertical>.btn-group:before, .btn-group-vertical>.btn-group:after, .nav:before, .nav:after, .navbar:before, .navbar:after, .navbar-header:before, .navbar-header:after, .navbar-collapse:before, .navbar-collapse:after, .pager:before, .pager:after, .panel-body:before, .panel-body:after, .modal-header:before, .modal-header:after, .modal-footer:before, .modal-footer:after { content: " "; display: table; }
/* End Bootstrap Clearfix */

.col-sm-4, .col-sm-6, .col-xs-12 { position: relative; min-height: 1px; padding-left: 15px; padding-right: 15px; float: left; }
.col-xs-12 { width: 100%; }
.xs-block { display: block; }

/* Preload */
#contactForm { min-height:390px; }
.success h2 { margin-bottom: 5px; text-align:center; font-size:24px; line-height:40px; color:#fff; }
.success p { color:#fff; font-size:14px; margin-bottom:50px; }
.spinner { width: 90px; height: 90px; position: relative; margin: auto; }
.double-bounce1, .double-bounce2 { width: 100%; height: 100%; border-radius: 50%; background-color: #3fde9c; opacity: 0.6; position: absolute; top: 0; left: 0; -webkit-animation: sk-bounce 2.0s infinite ease-in-out; animation: sk-bounce 2.0s infinite ease-in-out; }
.double-bounce2 { -webkit-animation-delay: -1.0s; animation-delay: -1.0s; }
@-webkit-keyframes sk-bounce {  0%, 100% {
   -webkit-transform: scale(0.0)
   }
   50% {
      -webkit-transform: scale(1.0)
   }
}
@keyframes sk-bounce {  0%, 100% {
   transform: scale(0.0);
   -webkit-transform: scale(0.0);
   }
   50% {
      transform: scale(1.0);
      -webkit-transform: scale(1.0);
   }
}

.checkmark__circle {
   stroke-dasharray: 166;
   stroke-dashoffset: 166;
   stroke-width: 5;
   stroke-miterlimit: 10;
   stroke: #7ac142;
   fill: none;
   animation: stroke 0.6s cubic-bezier(0.65, 0, 0.45, 1) forwards;
}

.checkmark {
   width: 70px;
   height: 70px;
   border-radius: 50%;
   display: block;
   stroke-width: 5;
   stroke: #fff;
   stroke-miterlimit: 10;
   margin: auto;
   box-shadow: inset 0px 0px 0px #7ac142;
   animation: fill .4s ease-in-out .4s forwards, scale .3s ease-in-out .9s both;
   background:#7ac142;
}

.checkmark__check {
   transform-origin: 50% 50%;
   stroke-dasharray: 48;
   stroke-dashoffset: 48;
   animation: stroke 0.3s cubic-bezier(0.65, 0, 0.45, 1) 0.8s forwards;
}

@keyframes stroke {
   100% {
      stroke-dashoffset: 0;
   }
}
@keyframes scale {
   0%, 100% {
      transform: none;
   }
   50% {
      transform: scale3d(1.1, 1.1, 1);
   }
}
@keyframes fill {
   100% {
      box-shadow: inset 0px 0px 0px 30px #7ac142;
   }
}

/*Google Form Styling*/
.ss-form-question{ width:50%; float:left; padding:0px 50px; position:relative; margin-bottom:30px; margin-top:10px;}
.jfk-button{ border:none; outline:none; cursor:pointer;}
#navigation-table{ width:100%; text-align:center; margin-top:50px; float:left;}
.ss-item{ position:relative;}

/*Thank You Css*/
.thank-you-section{ width:100%; float:left; padding:150px 0px;}
.thank-you-container{ width:100%; max-width:600px; border:1px solid #ccc; padding:50px; margin:0px auto; border-radius:6px;}
.thank-you-banner{ height:140px !important;}
.thank-you-container h1{ font-size:40px;}

/*News page*/
.news-txt p{color:#898989; font-size:16px; line-height:28px;  font-family: 'Montserrat-Regular'; margin-bottom: 45px; font-family: 'Open Sans';}
.news-txt a{color:#3fde9c; text-decoration:none;}
.black-box{overflow:hidden; font-family: 'Open Sans';}
.black-box{background:#1f282f; padding:50px 40px; color:#f8f8ff; margin-bottom:62px;}
.black-box li{width:25%; float: left; color:#3fde9c; font-size:16px; padding:0 56px 0 0; line-height:30px;}
.black-box li:last-child{padding-right:0;}
.black-box ul{padding:0;}
.black-box.testimonials { padding:10px 10px 10px 40px; }
.black-box.testimonials ul { list-style-type:none; }
.black-box.testimonials ul li { width:33.33%; padding:0 35px 0 40px; position:relative; }
.black-box.testimonials ul li::before { content: ''; background-image: url("../images/left-quote.svg"); background-repeat: no-repeat; background-size:30px; position: absolute; top: 5px; width: 30px; height: 27px; left: 0; }
.black-box.testimonials ul li p { padding-top:0; margin-top:0; }
.black-box.testimonials ul li h2 { margin:2px 0; font-size:20px; } 
.black-box.testimonials ul li .white-text{ color:#f8f8ff; }
.black-box.testimonials ul li .gray-text {color:#898989; }

.team-image{width:104px; height:104px; border-radius:50%; overflow:hidden; border:1px solid #41de9d;}
.member-name{color:#212121; font-size:18px;  font-family: 'Montserrat-Bold'; text-transform:uppercase;}
.member-des{color:#898989; font-size:16px; font-family: 'Open Sans';}
.team-info{margin: 18px 0 0 10px; max-width:234px;}
.team .col-xs-4{width:33.3333%; float: left; margin-bottom:50px;}
.white-section.news-section{background:#fff; padding-top:66px; border-bottom:#41de9d solid 1px; }
.news-section h3{text-align: left;}
.dark-txt{color:#212121;}
.news-txt ul{padding:0; margin:0 0 40px 20px;;}
.news-txt p.marginbottom-10{margin-bottom:10px;}
.banner-section.news{ background-image: url("../images/news-banner.jpg");}
/*News page*/
.guide-line-detail .news-txt p{margin-bottom: 28px;}
.guide-line-detail {width: calc(100% - 400px); float: left; padding-right: 118px;}
.download{color: #212121; font-size: 16px;font-family: 'Open Sans';margin-top: 10px;float: left;}
.hubspot-form{width: 400px; float: left; background: #1f282f; color: #fff; padding: 40px 38px 42px;}
.hubspot-form h3{ font-size: 28px; font-family: 'Montserrat-Light', sans-serif; font-weight: 300; margin-top: 0;margin-bottom: 15px;}
.hubspot-form h3 strong{font-family: 'Montserrat-Bold'; font-weight: 500;}
.hubspot-form .hs-form-field > label {font-size: 14px;font-family: 'Open Sans';text-transform: uppercase;display: inline-block;margin-bottom: 8px;}
.hs-form-required{display: none;}
.hs-input{width: 100%;height: 38px; padding-left: 10px;}
.hs-form-field{margin-top: 15px;}
.hs-button {background: #3fde9c;font-size: 13px;font-family: 'Montserrat-SemiBold';box-shadow: none;border: none;color: #fff;width: 100%;height: 47px;border-radius: 5px;margin-top: 30px;letter-spacing: 3px;line-height: normal; cursor: pointer;transition: background-color 0.3s;will-change: background-color;}
.hs-button:hover,.hs-button :active,.hs-button:focus{background-color: #34c589;}
.white-section.news-section.guide-line-detail-padding{ padding-bottom: 249px;}
.hs-error-msgs {list-style-type: none;font-size: 12px;font-weight: normal;color: red;font-family: 'Montserrat', sans-serif;margin: 2px 0 0 0;padding: 0;}

@media (min-width: 640px) {
   .secondary-text {
      font-size: 40px;
      line-height: 50px;
   }
   .page-heading {
      font-size: 34px;
   }
   .header-section {
      position: absolute;
      padding-top: 45px;
      font-size: 20px;
      padding-bottom: 0;
   }
   
   
   .xs-block {
      display: inline-block;
   }
   .is-table, .banner-section {
      height: 100vh;
   }


}
@media (min-width:732px){
   .menu-icon{
       display:none;
   }
   .menu-container {
    display: inline-block;
    opacity: 1;
 }
}
@media (min-width: 768px) {
   .container {
      width: 750px;
   }
   .col-sm-4 {
      width: 33.33333333%;
   }
   .col-sm-6 {
      width: 50%;
   }
   .primary-text {
      font-size: 40px;
      letter-spacing: 4px;
   }
   .secondary-text {
      font-size: 50px;
      line-height: 62px;
   }
   .banner-text {
      font-size: 18px;
      line-height: 28px;
      margin-top: 10px;
   }
   .white-section {
      padding-top: 90px;
      padding-bottom: 60px;
      background-color: #f8f8ff;
   }
   .form-section {
      padding-top: 90px;
      padding-bottom: 90px;
   }
   .form-section .page-heading {
      margin-bottom: 70px;
   }
   .page-heading {
      font-size: 40px;
   }
}
@media (min-width: 992px) {
   .container {
      width: 970px;
   }
   .primary-text {
      font-size: 50px;
      letter-spacing: 4px;
   }
   .secondary-text {
      font-size: 60px;
      line-height: 62px;
   }
   .banner-text {
      font-size: 20px;
      line-height: 30px;
   }
   .banner-section {
      height: 720px;
   }
   .is-table {
      height: 720px;
   }
   .banner-section.news,.banner-section.news .is-table{ height:384px;}
}
@media (min-width: 1200px) {
   .container {
      width: 1170px;
   }
   .form-section .row {
      margin-left: -50px;
      margin-right: -50px;
   }
   .form-section .row .col-sm-6 {
      padding-left: 50px;
      padding-right: 50px;
   }
}
.paper-input ~ label.error{color: #ff0000;
   font-size: 9px;
   position: absolute;
   top: 36px;}
@media only screen and (max-width:1023px)
{
   .black-box li{width:100%;}
   .team .col-xs-4{width:50%;}
   .black-box.testimonials ul li { width:100%; margin-bottom:30px; }

}

@media only screen and (max-width:992px)
{
   .guide-line-detail .page-heading {font-size: 26px;}
   .white-section.news-section.guide-line-detail-padding {padding-bottom: 69px;}
   .hubspot-form {width: 45%;padding: 30px 18px 42px;}
   .guide-line-detail {padding-right: 18px;width: 55%;}
   .ss-form-question{ width:100%;}
   .news .is-table{height:calc(50vh - 70px);}
   .banner-section.news{height:auto;}
   .header-section a{margin-left:13px;}
  

}

@media only screen and (max-width:1200px)
{
   .guide-line-detail{padding-right: 48px;}
   .guide-line-detail .page-heading { font-size: 37px;}
   .white-section.news-section.guide-line-detail-padding {padding-bottom: 149px;}

}
@media only screen and (max-width:767px)
{
   .menu-container.open{height: auto;}
   .hubspot-form {width: 100%;padding: 30px 28px 42px;margin-top: 40px;}
   .guide-line-detail {padding-right: 18px;width: 100%;}
   .thank-you-container{ max-width:90%; padding:30px;}	
   .thank-you-container h1{ font-size:38px;}
   .team .col-xs-4{width:100%;}
   .white-section.news-section.guide-line-detail-padding {padding-bottom: 79px;}
   .form-section .row{margin: 0;}
   .ss-form-question{padding: 0 20px;}
   .banner-text{margin-bottom:20px;}
   .black-box.testimonials { padding:10px 10px 10px 29px; }
}

/* ==========================================================================
Helper classes
========================================================================== */

/*
* Hide visually and from screen readers
*/

.hidden { display: none !important; }
.pull-left { float: left; }
.pull-right { float: right; }
.text-center { text-align: center; }
/*
* Hide only visually, but have it available for screen readers:
* http://snook.ca/archives/html_and_css/hiding-content-for-accessibility
*/

.visuallyhidden { border: 0; clip: rect(0 0 0 0); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; width: 1px; }
/*
* Extends the .visuallyhidden class to allow the element
* to be focusable when navigated to via the keyboard:
* https://www.drupal.org/node/897638
*/

.visuallyhidden.focusable:active, .visuallyhidden.focusable:focus { clip: auto; height: auto; margin: 0; overflow: visible; position: static; width: auto; }
/*
* Hide visually and from screen readers, but maintain layout
*/

.invisible { visibility: hidden; }
/*
* Clearfix: contain floats
*
* For modern browsers
* 1. The space content is one way to avoid an Opera bug when the
*    `contenteditable` attribute is included anywhere else in the document.
*    Otherwise it causes space to appear at the top and bottom of elements
*    that receive the `clearfix` class.
* 2. The use of `table` rather than `block` is only necessary if using
*    `:before` to contain the top-margins of child elements.
*/

.clearfix:before, .clearfix:after { content: " "; /* 1 */ display: table; /* 2 */ }
.clearfix:after { clear: both; }

/* ==========================================================================
EXAMPLE Media Queries for Responsive Design.
These examples override the primary ('mobile first') styles.
Modify as content requires.
========================================================================== */

@media only screen and (min-width: 35em) {
   /* Style adjustments for viewports that meet the condition */
}
@media print,  (-webkit-min-device-pixel-ratio: 1.25),  (min-resolution: 1.25dppx),  (min-resolution: 120dpi) {
   /* Style adjustments for high resolution devices */
}

/* ==========================================================================
Print styles.
Inlined to avoid the additional HTTP request:
http://www.phpied.com/delay-loading-your-print-css/
========================================================================== */

@media print {
   *,  *:before,  *:after,  *:first-letter,  *:first-line { background: transparent !important; color: #000 !important; /* Black prints faster:
      http://www.sanbeiji.com/archives/953 */ box-shadow: none !important; text-shadow: none !important; }
   a,  a:visited { text-decoration: underline; }
   a[href]:after { content: " (" attr(href) ")"; }
   abbr[title]:after { content: " (" attr(title) ")"; }

   /*
   * Don't show links that are fragment identifiers,
   * or use the `javascript:` pseudo protocol
   */

   a[href^="#"]:after,  a[href^="javascript:"]:after {
      content: "";
   }
   pre,  blockquote { border: 1px solid #999; page-break-inside: avoid; }
   /*
   * Printing Tables:
   * http://css-discuss.incutio.com/wiki/Printing_Tables
   */

   thead { display: table-header-group; }
   tr,  img { page-break-inside: avoid; }
   img { max-width: 100% !important; }
   p,  h2,  h3 { orphans: 3; widows: 3; }
   h2,  h3 { page-break-after: avoid; }
}