/*
Title:      Styles for Longitude Licensing Ltd.
Author:     Martin Caton, martin@catondesigns.com
Updated:    April 2014
*/

/***** Main *****/
body { background-color:#FFF; font-family: Arial, Helvetica, sans-serif;}

h1 {
	color: #005ebc;
	font-size: 30px;
	font-weight: bold;
	padding: 35px 0 2px 0;
}

h2 {
	color: #000;
	font-size: 18px;
	font-weight: bold;
}


#header {background-color:#474747; position: fixed; width:100%;z-index:10; /* allocate a suitable z-index */
}

#pin {height:62px}

#footer {background-color:#3a3a3a}

#footer h1 {
	color: #FFF;
	}
	
#footer p {
	line-height: 18px;
	color: #b9b9b9;
	}	
	
#footer .emph {
	color: #FFF;
	font-weight: bold;
	}	
	
#hero1 {background-color:#474747; background-image: url('../img/hero1.jpg'); background-size: auto 100%; background-position: center top; background-repeat: no-repeat; /*padding-top:60px;*/}

.heroTxt {
	color: #FFF;
	font-size: 26px;
	text-align: center;
	padding: 75px 0 25px 0;
	text-shadow: 0px 0px 10px black;
}

#hero2 {background-color:#474747; background-image: url('../img/hero2.jpg'); background-size: auto 100%; background-position: center top; background-repeat: no-repeat;}


#content {
	background-color: #FFF;
	font-size: 17px;
	line-height: 25px;
	color: #645c54;
	position:relative; /* set up relative positioning so that z-index will work */
z-index:3; /* allocate a suitable z-index */
}

#content p {
	padding-top: 5px;
}

.stripe {
	width: 100%;
	height: 11px;
}
	  
.link {
   list-style: none;
   display:block;
   overflow:hidden;
   position:relative;
margin-top:8px;
}
.link li a:hover,
.link li a:focus {
	list-style: none;
	color: #fff;
	text-decoration: none;
	background-color: #d19b45;
	font-weight: bold;
}
.link li a,
.link li a.active,
.link li a.active:hover,
.link li a.active:visited {
	list-style: none;
	margin: 0;
	padding: 12px 20px 9px 15px;
	margin: 10px 10px 3px 0;
	float: left;
	color: #fff;
	text-decoration: none;
	background-color: #244771;
	font-weight: bold;
}

#footer a:link {color:#b9b9b9;}
#footer a:visited, #footer a:active {color:#b9b9b9;}
#footer a:hover {color:#d19b45;}

.google-maps {
        position: relative;
        padding-bottom: 100%; // This is the aspect ratio
        height: 0;
        overflow: hidden;
    }
    .google-maps iframe {
        position: absolute;
        top: 0;
        left: 0;
        width: 100% !important;
        height: 100% !important;
	
    }
#navmenu {
   float:left;
   width:100%;
   overflow:hidden;
   position:relative;
}
#navmenu ul {
   clear:left;
   float:left;
   list-style:none;
   margin:0;
   padding:0;
   position:relative;
   left:50%;
   text-align:center;
}
#navmenu ul li {
   display:block;
   float:left;
   list-style:none;
   margin:0;
   padding: 0 1px 0 0;
   position:relative;
   right:50%;
}
#navmenu ul li a {
   display:block;
   margin:0 0 0 1px;
   padding:22px 56px 20px;
   color:#fff;
   text-decoration:none;
}
#navmenu ul li a:hover {
   background:#d19b45;
   color:#fff;
}
#navmenu ul li a.active,
#navmenu ul li a.active:hover {
   color:#fff;
   background-color: #244771;
   font-weight:bold;
}


/***** Screen 1200px+ *****/

.example								{  }



/***** Screen Smaller than 1199px *****/
@media only screen and (min-width: 960px) and (max-width: 1199px) {

.heroTxt {
	font-size: 26px;
	text-shadow: 0px 0px 10px black;
}
#navmenu ul li a {
   padding:22px 36px 20px;
}

}

/***** Tablet (Smaller than 959px) *****/
@media only screen and (min-width: 768px) and (max-width: 959px) {

.heroTxt {
	font-size: 22px;
	padding: 50px 0 15px 0;
	text-shadow: 0px 0px 10px black;
}
#navmenu ul li a {
   padding:22px 20px 20px;
}
#pin {height:48px}


}

/***** Mobile (portrait 300px) *****/
@media only screen and (min-width:481px) and (max-width: 767px) {

.heroTxt {
	font-size: 16px;
	padding: 50px 0 15px 0;
	text-shadow: 0px 0px 10px black;
}
#navmenu ul li a {
   padding:10px;
}
#pin {height:48px}

		
}	 

/***** Mobile (landscape 420px) *****/
@media only screen and (max-width: 480px) {

.heroTxt {
	font-size: 14px;
	padding: 20px 0 15px 0;
	text-shadow: 0px 0px 10px black;
}
#navmenu ul li a {
   padding:10px;
}
#pin {height:48px}


}