.overlay {
    display: block; /* ensures it’s invisible until it’s called */
    text-align: center;
    position: fixed; /* makes the div go into a position that’s absolute to the browser viewing area */
    left: 25%; /* positions the div half way horizontally */
    top: 25%; /* positions the div half way vertically */
    padding: 25px; 
    border: 2px solid black;
    background-color: #77bdf1;
    color: #000000;
    overflow: scroll;
    width: 50%;
    height: 50%;
    z-index: 100; /* makes the div the top layer, so it’ll lay on top of the other content */
}

#fade {
    display: block;  /* ensures it’s invisible until it’s called */
    position: fixed;  /* makes the div go into a position that’s absolute to the browser viewing area */
    left: 0%; /* makes the div span all the way across the viewing area */
    top: 0%; /* makes the div span all the way across the viewing area */
    background-color: black;
    -moz-opacity: 0.7; /* makes the div transparent, so you have a cool overlay effect */
    opacity: .70;
    filter: alpha(opacity=70);
    width: 100%;
    height: 100%;
    z-index: 90; /* makes the div the second most top layer, so it’ll lay on top of everything else EXCEPT for divs with a higher z-index (meaning the #overlay ruleset) */
}

body{
	background-color: #77bdf1;
	font-family: 'Nunito', sans-serif;
	color: #fff;
	padding-left: 0px;
	padding-right: 0px;
}

header {
	display: inline-block;
}


section {
	background-image: url("../img/hills_rays-small.png");
	background-repeat: no-repeat;
	background-position: center bottom;
	background-size: contain;
	padding: 0px 20px 160px 20px;
}


h1, h2, h3, h4, h5 {
	text-shadow: 1px 1px 1px rgba(0, 0, 0, .29);
}

a {
	color: #400162;
}

p, li {
	font-size: 1.385em;
	line-height: 1.385em;
}

hr {
	border-top: 1px solid #317fbc;
	border-bottom: 1px solid #b1dbfb;
}

img {
	max-width: 100%;
}

footer {
	height: 100%;
	text-align: center;
	border-top: 1px solid rgba(0, 0, 0, .25);
	background: #256698;
	background: -moz-linear-gradient(28deg, #256698 0%, #82b7e1 100%);
	background: -webkit-gradient(linear, left 28deg, left bottom, color-stop(0%,#256698), color-stop(100%,#82b7e1));
	background: -webkit-linear-gradient(28deg, #256698 0%,#82b7e1 100%);
	background: -o-linear-gradient(28deg, #256698 0%,#82b7e1 100%);
	background: -ms-linear-gradient(28deg, #256698 0%,#82b7e1 100%);
	background: linear-gradient(28deg, #256698 0%,#82b7e1);
}

footer.row-fluid > ul.span2 {
	list-style: none;
	margin-top:	20px;
}

footer li{
	line-height: 21px;
}

footer ul li a{
	color: #fff;
	display: block;
	margin-bottom: 3px;
}


.content-block {
	background: rgba(37, 102, 152, .25);
	border-radius: 10px;
}

.content {
	padding: 1em 2em 1em 2em;
}

.content ul {
	font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
	margin-bottom: 2em;
	margin-top: 1.5em;
	margin: 1.5em 0 2em 1.923em;
}

.content p {
	margin: .5em 0 1em 0;
}

.content- p:first-child {
	margin-top: 5em;
}

.content img {
	border-radius: 10px;
	display: block;
	margin: auto;
}

.phone-download {
	text-align: center;
}

/*nav*/
.nav {
	margin-left: auto;
}

.nav-pills > li:first-child{
	margin-top: 1em;
}

.nav-pills > li > a {
	font-size: 1.462em;
	color: #60108b;
  	background-color: #fff;
  	text-align: center;
}

.nav > .nav-header {
	color: #343838;
	font-size: 1.385em;
	line-height: 1.385em;
}

.navrow > .nav-full {
	display: none;
}

.nav-small > a:first-child {
	display: inline-block;
	width: 70%;
}

.logo {
	float: left;
	margin-bottom: 10px;
}

.navrow {
	margin-top: 30px;
}

/*remove border from header*/
.modal-header {
	border: none;
}

.slide-util{
	text-align: center;
}

.hitcherphoto {
	border-radius: 10px;
}

.downloads {
	margin-top: 2em;
}

/*hp button */
.button, .navbar >.btn-navbar {
	color: #fff;

	font-size; 1.154em;	 
    display: inline-block;
    position: relative;
    margin: 0.769em;
    padding: 0.385em 1.538em;
    line-height: 2em;

    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;
 
    -webkit-box-shadow: 1px 1px 1px rgba(0,0,0, .29), inset 1px 1px 1px rgba(255,255,255, .44);
    -moz-box-shadow: 1px 1px 1px rgba(0,0,0, .29), inset 1px 1px 1px rgba(255,255,255, .44);
    box-shadow: 1px 1px 1px rgba(0,0,0, .29), inset 1px 1px 1px rgba(255,255,255, .44);
	 
    -webkit-transition: all 0.15s ease;
    -moz-transition: all 0.15s ease;
    -o-transition: all 0.15s ease;
    -ms-transition: all 0.15s ease;
    transition: all 0.15s ease;

	background: #52a552; /* Old browsers */
	background: -moz-linear-gradient(top,  #52a552 0%, #1f6c1f 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#52a552), color-stop(100%,#1f6c1f)); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top,  #52a552 0%,#1f6c1f 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top,  #52a552 0%,#1f6c1f 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top,  #52a552 0%,#1f6c1f 100%); /* IE10+ */
	background: linear-gradient(top,  #52a552 0%,#1f6c1f 100%); /* W3C */
} 

.navbar >.btn-navbar {
	padding: 1em;
}

.download_buttons img {
	margin-top: 18px;
}

.download_buttons li {
	list-style: none;
}

.figure {
	text-align: center;
}

.takenat {
	display: block;
	margin-top: 1em;
	padding: 0.38em 0.38em 0.2em 0em;
	min-height: 2.7em;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;
	background: rgba(255,255,255, .4); /* Old browsers */
}

.takenat img {
	margin-top: -.62em;
	padding-right: 1.2em;
	float: left;
}

.sharetravels {
	background-image: url("../img/sharecloud.png");
	background-repeat: no-repeat;
	padding: 3.8em 3.8em 1em 3.8em;
	display: block;
	margin-top: 18px;
}


/* outside of @media incase loads wide, then shrinks */
.slidewrap .carousel-tabs {
    margin: 1em 0;
    clear: both;
    text-align: center;
}
            
.slidewrap .carousel-tabs li {
    display: inline-block; 
    padding: 0 .9em;
}
   
.slidewrap .carousel-tabs a {
    background: #51007c; /* Old browsers */
	background: -moz-linear-gradient(top,  #51007c 0%, #390157 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#51007c), color-stop(100%,#390157)); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top,  #51007c 0%,#390157 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top,  #51007c 0%,#390157 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top,  #51007c 0%,#390157 100%); /* IE10+ */
	background: linear-gradient(top,  #51007c 0%,#390157 100%); /* W3C */

    display: inline-block;
    height: 20px;
    text-indent: -9999px;
    width: 20px;
    border-radius: 10px;
}
.ie .slidewrap .carousel-tabs li,
.ie .slidewrap .carousel-tabs a { 
    display: block;
    float: left;
}

.slidewrap .carousel-tabs .carousel-active-tab a {
    background: #52a552; /* Old browsers */
	background: -moz-linear-gradient(top,  #52a552 0%, #1f6c1f 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#52a552), color-stop(100%,#1f6c1f)); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top,  #52a552 0%,#1f6c1f 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top,  #52a552 0%,#1f6c1f 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top,  #52a552 0%,#1f6c1f 100%); /* IE10+ */
	background: linear-gradient(top,  #52a552 0%,#1f6c1f 100%); /* W3C */
}

.hero-unit {
	background: none;
	padding: 0;
}

.hero-unit h1 {
	font-size: 4em;
	text-align: center;
}

.hero-unit p {
	padding-top: 1em;
}

.btn, .teaser-title img {
	display: block;
	margin: .5em auto;
}

.teaser-title h2 {
	text-align: center;
	padding-bottom: .5em;
}

.teaser-title {
	margin-bottom: 1em;
}

.well-downloads {
	min-height: 20px;
	padding: 19px;
	margin-bottom: 20px;
	text-align: center;
}

.well-downloads > .download_buttons {
	display: block;
	margin: auto;
}

#goog-wm > .content {
	padding: 1em 0 0 0;
}

.search-goog {
	list-style: none;
}

@media (min-width: 430px) {
	section {
		background-image: url("../img/hills_rays-medium.jpg");
	}
}

@media (min-width: 480px){
	.mobilerule {
		display: none;
	}

    .row > .iphone{
    	float: left;
    	margin-left: 18%;
    }
}

@media (min-width: 768px) {
	section {
		background-image: url("../img/clouds.png"), url("../img/hills_rays.jpg");
		background-repeat: no-repeat;
		background-position: center top, center bottom;
	}
 
	p, li, .nav > .nav-header {
		font-size: 1.077em;
		line-height: 1.385em;
	}
    
	footer, .figure {
		text-align: left;
	}

	.nav-small {
		display: none;
	}

	.navrow > .nav-full {
		display: block;
	}

  	footer ul li a {
  		font-size: 1.077em;
  	}

	/*blank first row*/
	.row-fluid  > [class*="offset"]:first-child {
		margin-left: 8.510638297%; /*no margin span 1 + 2.5641%*/
	}

	footer.row-fluid > [class*="offset"]:first-child {
		margin-left: 17.094017094%;
	}

	.about-mobilerule {
		display: none;
	}

	.teaser-title h2 {
		margin-top: 10%;
		float: left;
	}

	.btn {
		display: inline-block;
	}

	.teaser-buses p {
		margin-top: 2em;
	}

	.twitter {
		float: left;
		margin-right: 15px;
	}

	.slidewrap .carousel-tabs {
		text-align: none;
		float: right;
		display: inline-block;
	}

	.slidewrap .carousel-tabs a {
    	height: 15px;
    	width: 15px;
    	border-radius: 10px;
	}

	.slidewrap .carousel-tabs li {
		padding: 0em .6em;
	}

  	.learn-button {
  		margin-left: 51.282051282%;
  		width: auto;
  		float: left;
  	}

  	.slide-util > .circles {
  		width: auto;
  	}

  	.slide-util {
  		text-align: left;
  	}

	.phone-download {
		margin-top: 5em;
	}

	.downloads {
		margin: auto;
	}

	.hero-unit {
		padding: 0 1em 0 1em;
		background: none;
	}

	.hero-unit h1 {
		font-size: 4em;
		text-align: left;
	}

	.well {
		background-image: url("../img/sec_nav_small.jpg");
		background-repeat: no-repeat;
		background-position: center top;
		background-color: #fff;
		padding-top: 35%;
		border: none;
		box-shadow: none;
	}

	.nav-tabs, .nav-pills {
		display: block;
  	}

  	.nav > .nav-about {
  		background-image: url("../img/nav_left.jpg");
  		background-repeat: no-repeat;
  		float: left;
  		padding: 13% 9% 5% 7%;
  	}

  	.nav > .nav-contact {
  		display: inline-block;
  		position: relative;
  		background-image: url("../img/nav_center.png");
  		background-repeat: no-repeat;
  		padding: 11% 5% 4% 5.5%;
  		margin: 2em 0 0 -3em;
  	}


	.nav-pills > li > a {
		background-color: transparent;
		text-align: left;
	}

	.nav-pills > li > a:hover {
		background-color: transparent;
	}

	.plane {
  		margin-top: -7%;
		display: inline-block;
  	}
}

@media (min-width: 980px){
	.well {
		background-image: url("../img/sec_nav_med.jpg");
	}

	.nav > .nav-about {
  		padding: 10% 7% 5% 6%;
  	}

  	.nav > .nav-contact {
  		padding: 9% 5% 3% 4.5%;
  	}

  	.plane {
  		margin-top: -5%;
  	}

	.content {
		padding: 2em 4em 2em 4em;
	}

  	.content img {
		float: right;
		margin: 2em 0 2em 1.5em;
	}
}

@media (min-width: 1200px){
	
	.top {
		margin-bottom: 4em;
	}

	.nav {
		margin-bottom: 0px;
	}


	.nav-pills > li > a {
  		text-shadow: 0 0 38px rgba(0, 0, 0, 0.25);
  	}

  	.plane {
  		margin-top: -3%;
  	}

  	.slides h2 {
  		font-size: 3.205em;
  		line-height: 50px;
  	}

  	.slideimage > img {
  		float: right;
  	}

  	.learn-button {
  		margin-left: 59.829059829%;
  	}


  	.slide-util {
  		text-align: left;
  	}

  	.nav-tabs, .nav-pills {
		display: block;
  	}

  	.nav > .nav-about {
  		padding: 8% 5% 3% 5%;
  	}

  	.nav > .nav-contact {
  		padding: 7% 5% 3% 3.5%;
  	}


	.nav-pills > li > a {
		background-color: transparent;
		text-align: left;
	}

	.nav-pills > li > a:hover {
		background-color: transparent;
	}


	.well {
		background-image: url("../img/sec_nav_large.jpg");
	}
}