@import url(http://fonts.googleapis.com/css?family=Ropa+Sans);
body{background: url(../img/landing/bg-pattern.jpg) top left repeat; padding:0; margin:0; font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;}
.container{ margin: 0 auto; padding:0; width:1120px; clear: both;}

.navbar-inner {
margin:0; padding:0; height:50px; width:100%;
background: #0098fe; /* Old browsers */
background: -moz-linear-gradient(top,  #0098fe 0%, #005db8 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#0098fe), color-stop(100%,#005db8)); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top,  #0098fe 0%,#005db8 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top,  #0098fe 0%,#005db8 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top,  #0098fe 0%,#005db8 100%); /* IE10+ */
background: linear-gradient(to bottom,  #0098fe 0%,#005db8 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#0098fe', endColorstr='#005db8',GradientType=0 ); /* IE6-9 */
border-top:2px solid #80ccff;
border-bottom:1px solid #003366;
}

.nav-btn-holder{float: left; padding: 12px 0 0 0; width: 200px;}
.login-btn{float: right; margin: 5px 5px 0 0;}

#map{ background: url(../img/landing/large-map-bg.jpg) top center repeat; width: 100%; height: 400px; margin:0; padding:0; border-bottom:1px solid #FFF;}
	.overlay{ margin: 0 auto; padding:0; width:1024px; text-align: center;}
	   .overlay img{max-width: 90%; margin: 0 auto;}

#bottom{ margin: 0 auto; padding:0; width:1090px; background: url(../img/landing/white-shadow.png) top center no-repeat; height:auto;}	
    #bottom img{max-width: 100%;}
h1{ color:#FFF; font-size:40px; text-shadow: 1px 1px 3px #333;	font-family: 'Ropa Sans', sans-serif; text-align:center; padding:20px 0; margin:0; text-transform:uppercase; font-weight:  normal;}
h2{ color:#005db8; font-size:30px; font-family: 'Ropa Sans', sans-serif; padding:0; margin:0; font-weight:  normal;}
form{ margin:20px auto; padding:0; width: 330px;}

input.inputfield{width:175px; background:#FFF; border: 1px solid #333; -webkit-border-radius: 8px 0px 0px 8px; -moz-border-radius: 8px 0px 0px 8px; border-radius: 8px 0px 0px 8px; 
	color: #666; font-size:12px; padding:8px 10px;}
	
input.submitbtn{
margin:0;
cursor:pointer;
padding:6px 12px 8px 10px;
width:120px;
color:#FFF;
font-size:14px;
font-weight: bold;
text-shadow: 1px 1px 1px #333;
background: #41b0fd; /* Old browsers */
background: -moz-linear-gradient(top,  #41b0fd 0%, #2e97df 50%, #2e81b9 50%, #0291f4 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#41b0fd), color-stop(50%,#2e97df), color-stop(50%,#2e81b9), color-stop(100%,#0291f4)); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top,  #41b0fd 0%,#2e97df 50%,#2e81b9 50%,#0291f4 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top,  #41b0fd 0%,#2e97df 50%,#2e81b9 50%,#0291f4 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top,  #41b0fd 0%,#2e97df 50%,#2e81b9 50%,#0291f4 100%); /* IE10+ */
background: linear-gradient(to bottom,  #41b0fd 0%,#2e97df 50%,#2e81b9 50%,#0291f4 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#41b0fd', endColorstr='#0291f4',GradientType=0 ); /* IE6-9 */
-webkit-border-radius: 0px 8px 8px 0px; -moz-border-radius: 0px 8px 8px 0px; border-radius: 0px 8px 8px 0px; 
border: none;
box-shadow: 0px 1px 3px #502b03; -moz-box-shadow: 0px 1px 3px #502b03; -webkit-box-shadow: 0px 1px 3px #502b03;

}	

#subForm input{margin: 0;}

#subSectionOne{ margin: 20px 0; background: #222; border-top: 1px solid #333; border-bottom: 1px solid #333; width:100%;}
    #rightsubsect{float: right; width: 630px;}
    #leftsubsect{float: left; width: 630px;}
    #rightsubsect p, #leftsubsect p{padding: 0; color: #ddd; font-size: 18px; line-height: 1.5em; text-shadow: -1px -1px 0 #000;}

    .lefttSubImage{float:left; margin: 0 0 20px 20px;}
    .rightSubImage{float:right; margin: 0 20px 20px 0px;}

    
.footer{color: #aaa; font-size: 11px;}
.footer a{ color: #aaa;}
  
body#staticIndex .modal{width: 100%; background: none; border: none;}
#box{
    position:  fixed; 
    top: 40px; 
    right: 3.5%; 
    z-index: 1050;
    margin:20px auto; 
    padding:0; 
    width:400px; 
    height:auto; 
    background:#2c2f30; 
    border-radius: 10px; -moz-border-radius: 10px; -webkit-border-radius: 10px;
    text-align: left;
    border: 1px solid #333;
    box-shadow: 3px 3px 5px #000;
}
#box form{margin: 0; padding: 0; width: auto;}
#box h1{
  color: #FFF; text-shadow: -1px -1px 0px #003366;
  font-family: 'Ropa Sans', sans-serif;  
  background: #0098fe; /* Old browsers */
  background: -moz-linear-gradient(top,  #0098fe 0%, #005db8 100%); /* FF3.6+ */
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#0098fe), color-stop(100%,#005db8)); /* Chrome,Safari4+ */
  background: -webkit-linear-gradient(top,  #0098fe 0%,#005db8 100%); /* Chrome10+,Safari5.1+ */
  background: -o-linear-gradient(top,  #0098fe 0%,#005db8 100%); /* Opera 11.10+ */
  background: -ms-linear-gradient(top,  #0098fe 0%,#005db8 100%); /* IE10+ */
  background: linear-gradient(to bottom,  #0098fe 0%,#005db8 100%); /* W3C */
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#0098fe', endColorstr='#005db8',GradientType=0 ); /* IE6-9 */
  border-bottom:1px solid #003366;
  border-radius: 10px 10px 0 0; -moz-border-radius: 10px 10px 0 0; -webkit-border-radius: 10px 10px 0 0;
  padding: 5px 0;
}
#box h1 span{text-align: center; padding: 5px 0 0 0;}
  
.innerform{padding:8px 0; text-align:center;}

input.field{ background:#3a3f41; padding:10px; color:#bbb; font-size:14px;
	border-radius: 5px; -moz-border-radius: 5px; -webkit-border-radius: 5px;
	border: none;
	width:80%; margin:10px auto;
	text-align: left;
	}

.innerform button{display:block; width:85%; margin:10px auto; padding:8px; cursor: pointer;}	
/*form button{ margin-top:5px; width:55px; height:75px; background: url(../img/vertical-login-button.png) top left no-repeat; text-indent:-5000px; border:0; cursor: pointer; float: right;}*/


#extras{width:auto; height:auto; background:#1e2223; border-radius: 0 0 10px 10px; -moz-border-radius: 0 0 10px 10px; -webkit-border-radius: 0 0 10px 10px;}
#extras ul{list-style: none; margin:0; margin-top:10px; padding:0;}
#extras ul li{list-style: none; display:inline-block; text-align:center; width:49%;}
#extras ul li:first-child{border-right: 1px solid #111;}
#extras ul li a{color:#bbb; font-size:11px; text-decoration: none; display: inline-block; padding:10px;}
#extras ul li a:hover{color:#FFF; text-decoration: underline;}

.or{text-align:center; padding:5px 0; color:#666; font-size:13px; text-shadow: -1px -1px 0px #111; font-weight:bold;}





@media only screen and (max-width: 1024px) {
.container{ margin: 0 auto; padding:0; width:100%;}
#map{height: 300px;}
.overlay{ margin: 0 auto; padding:0; width:100%;}
#bottom{width:100%;}
#rightsubsect{float: right; width: 500px;}
.footer img{max-width: 100%;}

}

@media only screen and (max-width: 800px) {
.nav-btn-holder{display: none;}    
.login-btn{float: none; display: block; text-align: center; width: 90%; margin: 10px auto 0 auto;}
.lefttSubImage, .rightSubImage{float:none; display:block; width: auto; margin: 0 auto;}
#rightsubsect, #leftsubsect{float: none; width: 90%; display: block; margin: 10px auto;}
#box{width: 90% !important; position: static; top:30px !important; right: 3.5% !important;}
.or{padding: 0;}
.footer span{display: block;}
}