#bghMapStreetContainer {
   width: 100%;
   height:405px;
   margin-bottom: 20px;
}
#bghMapTravelContainer {
   float:left;
   width: 100%;
   margin-top: 20px;
}
#bghMapView {
   float:left;
   width: 48%;
   height:400px;
}
#bghStreetView {
   float:right;
   width: 48%;
   height:400px;
}


#bghMapTravelContainer {   
   width: 100%;
   margin-top: 20px;
}
#bghMapTravelView_item1 {  
   text-align:center;
   width: 100%;   
}
#bghMapTravelView_item2 {
   margin-top: 15px;
   width: 100%; 
}
#bghMapTravelView_item3 {
   margin-top: 15px;
   width: 100%; 
}


p.popupHeader {
   font-size:13px;
   font-weight:bold;
   color:#ff0;
   text-align:center;
}
p.mocAlert {
   color: #e1f5fe;
   font-weight:bold;
   font-size:11px;
   text-align:center;
}
.normText {
   color: #444;
   font-weight:normal;
   font-style:italic;
   font-size:13px;
   text-align:center;
}

/***** START OF INDEX EMBED VIDEO STYLES *****/
 .playerWrapper {
      width:68%;
      padding:5px;
      background-color:#222;
      margin: auto;
      border-top-left-radius: 10px;
      border-top-right-radius: 10px;
      border-bottom-left-radius: 10px;
      border-bottom-right-radius: 10px;
      -moz-border-radius-topleft: 10px;
      -moz-border-radius-topright: 10px;
      -moz-border-radius-bottomleft: 10px;
      -moz-border-radius-bottomright: 10px;
      -webkit-border-top-right-radius: 10px;
      -webkit-border-top-left-radius: 10px;
      -webkit-border-bottom-left-radius: 10px;
      -webkit-border-bottom-right-radius: 10px;
 }
 .container {
     position: relative;
     width: 100%;
     overflow: hidden;
     padding-top: 56.25%; /* 16:9 Aspect Ratio */
 }
 .responsive-iframe {
     position: absolute;
     top: 0;
     left: 0;
     bottom: 0;
     right: 0;
     width: 100%;
     height: 100%;
     border: none;
 }
 

/***** START OF MEDIA QUERIES *****/
/***** Desktops / Laptops *****/
@media all and (min-width:1025px) and (max-width:1600px) {
   #bghMapStreetContainer {
      width: 100%;
      height:400px;
      margin-bottom: 20px;
   }
   #bghMapTravelContainer {
      float:left;
      width: 100%;
      margin-top: 20px;
   }   
   #bghMapView {
      float:left;
      width: 48%;
      height:400px;
   }
   #bghStreetView {
      float:right;
      width: 48%;
      height:400px;
   }
   .playerWrapper {
      width:68%;
      padding:5px;
      background-color:#222;
      margin: auto;
   }
   .normText {
      font-size:13px;
   }
   p.popupHeader {
      font-size:13px;
   }   
}

/***** iPad [portrait + landscape] *****/
@media all and (min-width:769px) and (max-width:1024px) {
   #bghMapStreetContainer {
      width: 100%;
      height:400px;
      margin-bottom: 20px;
   }
   #bghMapTravelContainer {
      float:left;
      width: 100%;
      margin-top: 60px;
   }      
   #bghMapView {
      margin-bottom: 40px;
      float:left;
      width: 100%;
      height:400px;
   }
   #bghStreetView {
      margin-top: 40px;
      float:left;
      width: 100%;
      height:400px;
   }
   .playerWrapper {
      width:99%;
      padding:5px;
      background-color:#222;
      margin: auto;
   }
   .normText {
      font-size:12px;
   }
   p.popupHeader {
      font-size:12px;
   }   
}

/***** TABLETS *****/
@media all and (min-width:481px) and (max-width:768px) {
   #bghMapStreetContainer {
      width: 100%;
      height:400px;
      margin-bottom: 20px;
   }
   #bghMapTravelContainer {
      float:left;
      width: 100%;
      margin-top: 60px;
   }      
   #bghMapView {
      margin-bottom: 40px;
      float:left;
      width: 100%;
      height:400px;
   }
   #bghStreetView {
      margin-top: 40px;
      float:left;
      width: 100%;
      height:400px;
   }
   .playerWrapper {
      width:99%;
      padding:5px;
      background-color:#222;
      margin: auto;
   }
   .normText {
     font-size:12px;
   }
   p.popupHeader {
      font-size:12px;
   }   
}


/***** iPhone LANDSCAPE MODE *****/
@media all and (max-width: 480px) {
   #bghMapStreetContainer {
      width: 100%;
      height:400px;
      margin-bottom: 20px;
   }
   #bghMapTravelContainer {
      float:left;
      width: 100%;
      margin-top: 60px;
   }      
   #bghMapView {
      margin-bottom: 40px;
      float:left;
      width: 100%;
      height:400px;
   }
   #bghStreetView {
      margin-top: 40px;
      float:left;
      width: 100%;
      height:400px;
   }
   .playerWrapper {
      width:98%;
      padding:5px;
      background-color:#222;
      margin: auto;
   }
   .normText {
      font-size:11px;
   }
   p.popupHeader {
      font-size:11px;
   }   
}

/***** iPhone PORTRAIT MODE *****/
@media all and (max-width: 320px) {
   #bghMapStreetContainer {
      width: 100%;
      height:400px;
      margin-bottom: 20px;
   }
   #bghMapTravelContainer {
      float:left;
      width: 100%;
      margin-top: 60px;
   }      
   #bghMapView {
      margin-bottom: 40px;
      float:left;
      width: 100%;
      height:400px;
   }
   #bghStreetView {
      margin-top: 40px;
      float:left;
      width: 100%;
      height:400px;
   }
   .playerWrapper {
      width:98%;
      padding:5px;
      background-color:#222;
      margin: auto;
   }
   .normText {
      font-size:11px;
   }
   p.popupHeader {
     font-size:11px;
   }   
}
/***** END OF MEDIA QUERIES *****/