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

article, aside, details, figcaption, figure, footer, header, hgroup, nav, section { display: block; }
audio, canvas, video { display: inline-block; *display: inline; *zoom: 1; }
audio:not([controls]) { display: none; }
[hidden] { display: none; }


/**
 * 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 */
}

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


/*
 * 1. Correct text resizing oddly in IE6/7 when body font-size is set using em units
 * 2. Force vertical scrollbar in non-IE
 * 3. Prevent iOS text size adjust on device orientation change, without disabling user zoom: h5bp.com/g
 * 4.Address margins handled incorrectly in IE 6/7.
 */

body { 
  font-size: 1em; /* 16px */
  line-height: 1.4; /* 20px */ 
  overflow-x: hidden;
  margin: 0; 
  -webkit-font-smoothing: antialiased;
}

body, button, input, select, textarea { 
  font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; 
  color: #545861; 
  font-weight: normal;  
}



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

a { 
  color: #d42b1e; 
  text-decoration: none; 
}

a:visited { color: #d42b1e; }

a:hover, a:focus { 
  cursor: pointer; 
  text-decoration: underline;
}

/* Improve readability when focused and hovered in all browsers: h5bp.com/h */
a:hover, a:active, a:focus { outline: 0; }



/* =============================================================================
   Stabilize padding for Fliud Grid
================================================================================ */

*, *:after, *:before {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box; 
  

}



/* =============================================================================
   Color Key
================================================================================ */

/* primary_color: #d42b1e; */
/* secondary_color: #35c0e2; */
/* tertiary_color: #fff; */


::-moz-selection { 
  background: #d42b1e; 
  color: #fff; 
  text-shadow: none; 
}
::selection { 
  background: #d42b1e; 
  color: #fff; 
  text-shadow: none; 
}


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

/* Flexible Images for Responsive Design
 *
 * 1. Force Images to scale to parent container
 * 2. Preserve porportion of images
 * 3. Remove the gap between images and the bottom of their containers: h5bp.com/i/440
 * 4. Remove border when inside `a` element in IE 6/7/8/9 and Firefox 3.
 * 5. Improve image quality when scaled in IE 7.
 */

img { 
  max-width: 100%;
  height: auto !important;
  vertical-align: middle; 
  border: 0; /* 1 */
    -ms-interpolation-mode: bicubic; /* 2 */
}

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

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


/* ==========================================================================
   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: 2.938em; /* 47px / 16px */
    margin: 0 0 0.67em;
}

h2 {
    font-size: 2.563em; /* 41px / 16px */
    margin: 0 0 0.83em;
}

h3 {
    font-size: 1.3125em; /* 21px / 16px */
    margin: 0 0 .5em;
}

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

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

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


/* 
* Fine-Tune body copy size 
*/

p, 
li p { 
  font-size: 0.875em;  /* 14px / 16px */
  margin: 0 0 1em;
} 


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

b,
strong {
    font-weight: bold;
}

/**
 * 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 inconsistent and variable font size in all browsers.
 */

small {
    font-size: 0.75em;
}

/**
 * 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: 0 0 1em; }

dd { margin: 0 0 1em; }

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

menu,
ol,
ul { 
  padding: 0; 
  list-style: none;
  margin-bottom: 1em;
}

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

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


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

/**
 * 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 */
}

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

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



/* =============================================================================
   General Content Styling
   ========================================================================== */

/* Headers */
h1,h2,h3,h4,h5,h6 {
  font-family: 'MuseoSlab-900', Helvetica, Arial, sans-serif;
  margin: 0 0 .5em;
}

/* Paragraph Styles */
p, label, footer{  font-family:'AvenirLTStd-Roman', 'Helvetica Neue', Helvetica, Arial, sans-serif;
font-size: 1.125em; /* 18px / 16px */ 
font-weight: 100;
}



/* =============================================================================
   Header
   ========================================================================== */

header[role="banner"] {
  width: 100%;  
  background: #3d434a;
  margin-bottom: 1em;
  padding: .5em 0 .6em;
}

/* =============================================================================
   Header Styles
   ========================================================================== */

.site-header {
  padding: .5em;
  margin: 0;
  width: 100%;
  background: rgba(0,0,0, .75);
}

/* Site Logo */

.site-title { margin: 12px 0 0 0; }

.site-title a {
  float: left;
  background: url('../images/boingo-logo.png') no-repeat;
  width: 77px;
  height: 37px;
  /* Image Replacement */
  background-color: transparent;
  border: 0;
  overflow: hidden;
  /* IE 6/7 fallback */
  text-indent: -9999px; 
  -webkit-transition: all .2s ease-in-out;
  -moz-transition: all .2s ease-in-out;
  -ms-transition: all .2s ease-in-out;
  transition: all .2s ease-in-out;

}

.site-title a:before {
    content: "";
    display: block;
    width: 0;
    height: 100%;
}




/* 
* Global Navigation Styling 
*/

nav li > a {  
  font-family:'Avenir LT W01 85 Heavy', 'Helvetica Neue', Helvetica, Arial, sans-serif;
  font-weight: normal;  
  letter-spacing: .1em;
  color: #fff; 
}

nav li > a:hover {
  color: #35C0E2; 
  text-decoration: none;
} 


/* 
* Mobile Off-Canvas Navigation 
*/




/* =============================================================================
  Body 
================================================================================ */

/*Home Landing Page*/
.landing{
  background: url('../images/featured-bg.jpg') no-repeat top center;
  overflow-x: hidden;
  background-size: cover;
  width: 100%;
  min-height: 37.5em;
  margin-top: -11.5em;
  z-index: -1;
  position: absolute;
  -webkit-box-shadow: inset 0 -5px 5px -3px rgba(0,0,0,0.2);
  -moz-box-shadow: inset 0 -5px 5px -3px rgba(0,0,0,0.2);
  -ms-box-shadow: inset 0 -5px 5px -3px rgba(0,0,0,0.2);
  box-shadow: inset 0 -5px 5px -3px rgba(0,0,0,0.2);
}
.landing.non-landing{
  min-height: 10.938em;
  box-shadow: none;
}

.white-bg{
  border-left: solid 5px #B4261E;
  width: 100%;
  /*min-height: 20.625em;*/
  padding: 5.625em 0;
  background: rgba( 255,255,255, .63);
  margin: 5.625em 0;

}

/* Container */
.container {
  margin: 0 auto 1em;
  max-width: 940px;
}


.partner-logo { 

  height: 94px ;
  width: 94px;
  float: left;
}



/*Landing Page*/
.partner-logo + h1, .partner-logo + h1 + h1 + p{
  margin: -5px 0 0 115px;
}

.partner-logo + h1 + h1{
  margin: 0px 0 0 115px;
}
.partner-logo + h1 + h1 + p{
  margin-top: 10px;
}

/*Non-landing pages */
.partner-logo.non-main{
/*  height: 70px;
  width: 70px;
  background-size: 70px;*/
  background: url('../images/main_boingo_logo.png') no-repeat;
}
.partner-logo + h5 + h1{
  width: 80%;
  display:inline-block;
}




/* =============================================================================
    Footer
   ========================================================================== */
footer{
  margin-top: 4.063em;
  padding-top: 2.188em;
}

footer .main-boingo-logo{
  display: inline-block;
  width: 113px;
  height: 55px;
  background: url('../images/boingo-footer-logo.png') no-repeat;
  text-indent: -9999px;
  margin-right: 2.813em;
  -webkit-transition: all .2s ease-in-out;
  -moz-transition: all .2s ease-in-out;
  -ms-transition: all .2s ease-in-out;
  transition: all .2s ease-in-out;

}
footer ul {
  margin-top: 1.813em;
}
footer ul > li{
  padding: 0 10px;
  border-right: 1px solid grey;
  font-size: .8em;
  float: left;
}
footer ul > li:last-child{
  border-right: none;
}
footer ul > li a{
  color: #545861;
  display: inline-block;
}
footer ul > li a:visited{
  color: #545861;
}
footer p{
  font-size: .6em;
}


/* =============================================================================
  Alignment
================================================================================ */


.alignleft {
  display: inline;
  float: left;
}

.alignright {
  display: inline;
  float: right;
}

.aligncenter {
  clear: both;
  display: block;
  margin-left: auto;
  margin-right: auto;
  text-align: center;
}
.left { 
  float: left;
  margin-right: .5em; 
}

.right { float: right; }

.center { margin: 0 auto; }
.valign-top{ vertical-align: top }



/* =============================================================================
   Non-Semantic Helper Classes
================================================================================ */

/*
 * Image replacement
 */

.ir {
    background-color: transparent;
    border: 0;
    overflow: hidden;
    /* IE 6/7 fallback */
    *text-indent: -9999px;
}

.ir:before {
    content: "";
    display: block;
    width: 0;
    height: 150%;
}

/*
 * Hide from both screenreaders and browsers: h5bp.com/u
 */

 .hide-all{
  display: none;
 }

.hidden-on-mobile {
    display: none;
    visibility: hidden;
}

.hidden-on-desktop{
  display: none;
  visibility: hidden;
}

/*
 * Hide only visually, but have it available for screenreaders: h5bp.com/v
 */

.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: h5bp.com/p
 */

.visuallyhidden.focusable:active,
.visuallyhidden.focusable:focus {
    clip: auto;
    height: auto;
    margin: 0;
    overflow: visible;
    position: static;
    width: auto;
}

/*
 * Hide visually and from screenreaders, but maintain layout
 */

.invisible {
    visibility: hidden;
}

/*
 * Group (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.
 */

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

.group:after {
    clear: both;
}

/*
 * For IE 6/7 only
 * Include this rule to trigger hasLayout and contain floats.
 */

.group { *zoom: 1; }



/* =============================================================================
  Utility Helper Classes
================================================================================ */


.bold-font{
  font-weight: 600;
}

.small-font{
  font-size: .9em;
}
.super-small{
  font-size: .4em;
}


.module {
    padding: 1em;
    background: #fff;
    border-top: 4px solid #d42b1e;
    
    border-bottom-left-radius: .3em;
    border-bottom-right-radius: .3em;
        
    -webkit-box-shadow: 0 1px 4px 1px rgba(0,0,0,.25);
    -moz-box-shadow: 0 1px 4px 1px rgba(0,0,0,.25);
    box-shadow: 0 1px 4px 1px rgba(0,0,0,.25);  
}


hr{
  border-top: solid 1px #989ba0;
}

.inlineblock{ display:inline-block;}
.inline{display: inline;}

.block{ display: block;}

.underline { 
  padding-bottom: .25em;
  margin-bottom: .25em; 
  border-bottom: 1px solid #ccc; 
}
.underline-md{
  border-top: 2px solid #ccc;
  width: 90%;
  margin-left: 15px;
}
.underline-md.white{
  border-top: 1px solid #fff;
}
.line-through{
  text-decoration: line-through;
}
.line-through.black-line{
  color: #000;
}

.uppercase{
  text-transform: uppercase;
}

.top-border{
  border-top: 4px solid #989ba0;
  -webkit-box-shadow: inset 0px 1px 1px #ccc;
  -moz-box-shadow: inset 0px 1px 1px #ccc;
  -ms-box-shadow: inset 0px 1px 1px #ccc;
  box-shadow: inset 0px 1px 1px #ccc;
}

.letter-spacing{ letter-spacing: 0.03em;}


/* Utility for padding
 *
 */
.padding-top-bottom-5{ padding: 5px 0; }
.padding-top-bottom-10{ padding: 10px 0; }


.padding-10{ padding: 10px; }
.padding-20{  padding: 20px; }

.padding-left-10{  padding-left: 10px; }
.padding-right-10{  padding-right: 10px; }

.padding-top-5{ padding-top: 5px; }
.padding-top-10{ padding-top: 10px; }
.padding-top-15{ padding-top: 15px; }
.padding-top-20{ padding-top: 20px; }
.padding-top-25{ padding-top: 25px; }
.padding-top-70{ padding-top: 70px; }
.padding-top-135{padding-top: 135px; }



/* Adjustable Margin
 */

 /* Margins that adjust according to media queries*/
 .adjustable-margin{
  margin-top: 135px;
 }

 .negative-top-margin{
  margin-top: -6.5em;
 }

.margin-left-10{ margin-left: 10px; }
.margin-left-20{ margin-left: 20px; }

.margin-right-15{ margin-right: 15px; }

.margin-top-neg10{ margin-top: -10px;}
.margin-top-5{ margin-top: 5px; }
.margin-top-10{ margin-top: 10px;}
.margin-top-35{ margin-top: 35px; }
.margin-top-50{ margin-top: 50px; }

/* Hide mobile-phone input for pid=300 */
.mobile-phone-input{ display: none;}





/*
 * Index Page -- Global
 */

/*Hide Page Title */
.entry-title{
	display: none;
}

/*Navigation*/
.main-nav #responsive_current_menu_item, .main-nav .menu { display: none;}

/*Hide Breadcrumbs */
.breadcrumb-list{ display: none;}

/*Edit tag that pops up when logged in on admin */
.post-edit{ display: none;}




/* =============================================================================
  Media Queries
================================================================================ */


/* 
* Retina Display Media Query to Target HiDPI Devices 
* For including high-res graphics, but only for screens that can make us of them. "Retina" being "2x":
* Info: http://css-tricks.com/snippets/css/retina-display-media-query/
*/

@media
only screen and (-webkit-min-device-pixel-ratio: 2),
only screen and (min--moz-device-pixel-ratio: 2),
only screen and (-o-min-device-pixel-ratio: 2/1),
only screen and (min-device-pixel-ratio: 2),
only screen and (min-resolution: 192dpi),
only screen and (min-resolution: 2dppx) {

    
}





@media only screen and (max-width: 767px) {

      h1{
        font-size: 1.8em;
      }
      h2{
        font-size: 1.6em;
      }
      p{
        font-size: 16px;
      }
      .site-header{
        padding: 0;
      }
      .site-title a {
        background-size:  80%;
        margin-bottom: 10px;
        border-right: 1px solid #000;
      }
      .partner-logo{
        background-size: 55px;
        margin-top: 0;
        width: 55px;
        height: 55px;

      }

      .partner-logo.non-main {
        height: 51px;
        width: 51px;
        background-size: 51px;
      }
      .partner-logo + h1, .partner-logo + h1 + h1, .partner-logo + h1 + h1 + p{
        margin-left: 65px;
      }
      .white-bg {
        padding: 35px 0;
        margin: 35px 0;
      }
      .landing{
        min-height: 26em;
      }
      .landing.non-landing{
        min-height: 7.938em;
      }
       .adjustable-margin{
          margin-top: 3.438em;
      }
      .block.hidden-on-mobile{
        display: none;
      }
      footer .main-boingo-logo{
        background-size: 60%;
        height: 40px;
      }
      footer ul{
        margin: 0;
      }
      footer ul > li{
        border-right: none;
        display: block;
        float: none;
        padding: 0;
        margin: .5em 0;
      }
      .hidden-on-desktop{
        display: block;
        visibility: visible;
      }



}



@media only screen and (min-width: 768px){

  .x-large-font{ font-size: 2.4em;}

  .hidden-on-mobile {
    display: block;
    visibility: visible;
  }
  .partner-logo + h5 + h1{
  width: 87%;
  }



}

/*Targets main image on landing page*/
@media only screen and (max-width: 344px){
  .landing.main{
    min-height: 35em;
  }
  .landing.main.extra-height-lang{
    min-height: 28em;
  }
}
@media only screen and (min-width: 345px) and (max-width: 390px){
  .landing.main{
    min-height: 33em;
  }
}
@media only screen and (min-width: 391px) and (max-width: 410px){
  .landing.main{
    min-height: 30em;
  }
}
  @media only screen and (min-width: 411px) and (max-width: 660px){
  .landing.main{
    min-height: 28em;
  }
  .landing.main.extra-height-lang{
    min-height: 26em;
  }
}