@charset "UTF-8";
/* CSS Document */



/* page environments */
html {
	background-color: rgb(100,40,3);
	font-family:"Lucida Sans Unicode", "Lucida Grande", Arial, Helvetica, sans-serif;
	font-size: 10pt;
	color:#8D433A;
	background-image:url("graphics/scrape-transparent.png");
	background-repeat:repeat;
	background-position:center top;
	margin:0;
	padding: 0;
}
body {
	width:1100px;
	margin:0 auto;
}
.package {
	width: 1000px;
	margin: 70px 20px 30px 70px;
	background-color:rgb(255,235,180);
	border: 1px solid rgb(100.50.5);
	box-shadow: rgba(0,0,0,0.8) 0 5px 20px, inset rgba(100,50,5,0.8) 0 0 40px;
	border-radius: 10px;
}
a {
	color: #ee3f25;
}
header {
	height: 137px;
	margin: 0 0 10px;
	background-color:rgba(230,180,50,0.7);
	background-image:url(graphics/horiz-scrape-transparent.png);
	background-repeat: repeat;
	background-position: top left;
	border: ipx solid #e92;
	border-top-right-radius: 10px;
	border-top-left-radius: 10px;
	position:relative;
	box-shadow:inset rgba(100,50,5,0.8) 0 20px 40px;
}
header:after {
	content:"";
	display:block;
	position:absolute;
	top: 0;
	right:20px;
	bottom:0;
	left:365px;
	background-image:url(graphics/Header-boat-train-plane.png);
	background-repeat: no-repeat;
	background-position: 0 -2px;
}
h1 {
	margin: -66px 0 0 -65px;
	padding:0;
	float: left;
}
h1 a {
	margin: 0;
	display:block;
	width: 350px;
	height: 175px;
	background-image:url(graphics/GoldenfreightLogo2015-300px.png);
	background-repeat:no-repeat;
}
h1 a span {
	display:block;
	height: 0;
	width: 0;
	overflow: hidden;
	font-size: 6pt;
}
header ul {
	margin: -30px 30px 0 0;
	float: right;
}
header ul li {
	display: inline;
	margin: 0 1em;
}
header ul li a {
	color:rgb(200,180,70);
}
main {
	clear: both;
	float:right;
	width: 750px;
	min-height: 400px;
	margin: 0 20px 1em 0;
	position:relative;
}
main .intro {
	font-size: 12pt;
	color:#ee3f25;
}

main img.flyer {
	display:block;
	margin: 1em 0;
	border: none;
}
main img {
	display:block;
	margin: 1em auto;
	border: none;
	float: right;
	border: 1px solid #ee3f25;
	margin: 5px 0 5px 10px;
	width: 40%;
	clear:right;
}
main img.insert {
	display:block;
	border: 1px solid #CCC;
	margin: 5px 0 5px 0;
}
main img.example {
	display:inline;
	border: none;
	margin: 0 0 0 0;
}
main h2,
main h3,
main h4 {
	font-family:"Futura", "Century Gothic", "Lucida Sans Unicode", "Lucida Grande", Arial, Helvetica, sans-serif;
}
main h2 {
	font-size: 24pt;
	font-weight: bold;
	margin: 0 0 0.5em;
	color:#ee3f25;
	text-transform:uppercase;
}
.home main h2 {
	color: #ee3f25;
	font-size: 22pt;
	font-weight: bold;
	letter-spacing: 0.04em;
	margin: 0 0 0.5em;
	text-transform: uppercase;
}
main h3 {
	font-size: 18pt;
	font-weight: normal;
	margin: 1em 0 0;
	color:#ee3f25;
}
main h4 {
	font-size: 10pt;
	font-weight:bold;
	text-transform: uppercase;
	margin: 1em 0 0;
	color:#ee3f25;
}
main p {
	margin: 0 0 1em;
	line-height: 1.5em;
}
main ul li {
	margin-bottom: 0.5em;
}

main dl dt {
	float:left;
	width: 9em;
	font-weight:bold;
	text-align: right;
}
main dl dd {
	margin-left: 10em;
	margin-bottom: 1em;
}

/*---------------   -----------   -----------   ----------- */
.nav-trigger,
label[for="nav-trigger"] {
	display:none;
}
nav {
	position:absolute;
	top: 220px;
	left:0;
	right:0;
}
nav dl {
	font-weight:bold;
	width: 1100px;
	margin:0 auto 2em;
	font-family:Arial, Helvetica, sans-serif;
}
nav dl dt,
nav dl dd {
	width:175px;
	}

nav dl dt {
	font-size: 8pt;
	letter-spacing: 0.1em;
	margin-bottom: 0.5em;
	text-transform: uppercase;
	margin-left: 80px;
}
nav dl dd {
	margin-left: 90px;
	margin-bottom: 0.5em;
}
nav dl dd a {
	display:block;
	width: 130px;
	text-decoration: none;
	padding: 2px 4px;
}
nav dl dd a:link {
	color:#ee3f25;
	text-decoration: none;
}
nav dl dd a:visited {
	color:#ee3f25;
	text-decoration: none;
}
nav dl dd a:hover {
	color:#8D433A;
	text-decoration: underline;
}
nav dl dd a:active {
	color:#8D433A;
	text-decoration: underline;
}
/* auto-style the link for current page */
body.home nav dl dd a.home,
body.about nav dl dd a.about,
body.contact nav dl dd a.contact,
 body.ocean nav dl dd a.ocean,
body.air nav dl dd a.air,
body.land nav dl dd a.land,
 body.packing nav dl dd a.packing,
 body.tickets nav dl dd a.tickets,
 body.warehouse nav dl dd a.warehouse,
body.form nav dl dd a.form {
	color:rgb(230,200,100);
	background-color: #9f7627;
	border: 1px solid #8D433A;
	padding: 1px 3px;
	border-radius: 4px;
}
main button {
	cursor: pointer;
	font-weight:bold;
	color:rgb(230,200,100);
	background-color: #9f7627;
	border: 1px solid #8D433A;
	padding: 1px 3px;
	border-radius: 4px;
}
img.badge,
p.badge img {
	border: none;
	width: auto;
	display:inline;
	vertical-align:text-top;
	margin: 5px;
}
footer {
	clear: both;
	padding-bottom: 0;
	color: #8d433a;
	overflow: hidden;
	border-top: 1px solid #8D433A;
	margin: 0 30px;
}
footer dl {
	float: right;
	width: 295px;
	font-size: 8pt;
}
footer dl dd {
	margin-left: 0;
}
footer dl dt {
	font-weight:bold;
}
footer a {
	color: #8d433a;
}
footer address {
	font-size: 10pt;
	font-weight: normal;
	font-style: normal;
	/*text-align: center;*/
	padding-top: 10px;
	margin: 0 310px 0 0;
}
footer ul {
	margin: 5px 310px 0 0;
	padding: 5px 0;/*text-align: center;*/
}
footer ul li {
	display: inline;
	margin: 0 1em 0 0;
}
p.copyright {
	float: left;
	padding-top:10px;
	padding-bottom: 0.5em;
	padding-left: 2em;
	color:rgb(200,180,70);
	font-size: 8pt;
	margin: 0 30px 0;
}
p.sitecredit {
	float: right;
	color:rgb(200,180,70);
	padding-top:10px;
	padding-right: 2em;
	font-size: 8pt;
	margin: 0 30px 0;
}
p.sitecredit a {
	color:rgb(200,180,70);
}
.picturemenu {
	float:right;
	margin-left:34px;
}
.picturemenu a {
	display:block;
	border: solid 1px #ee3f25;
	border-radius: 8px;
	background-image:url(graphics/Ocean-Air-Land.png);
	float:none;
	margin:0 0 30px;
	background-size:365px 214px;
	box-shadow: 0 5px 10px rgba(0,0,0,0.5);
	height:214px;
	width:120px;
	position:relative;
}
.picturemenu a span {
	display:none;
}
.picturemenu a:hover:before {
	content:"";
	position:absolute;
	top: 0;
	left:0;
	bottom:0;
	right:0;
	border-radius: 8px;
	background-color:rgba(255,255,255,0.5);
}
.picturemenu a#air {
	background-position: -122px 0;
}
.picturemenu a#land {
	background-position: -244px 0;
}
.youtube {
	position: relative;
	padding-bottom: 41.25%; /* 16:9 */
	padding-top: 25px;
	height: 0;
	overflow:hidden;
	margin-bottom:34px;
	box-shadow: 0 5px 10px rgba(0,0,0,0.5);
	border: solid 1px #ee3f25;
}
.youtube iframe {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}
.home main h3 {
	margin:0 0 1em;
}
/* ---------------------------------------------------------------- */
/* forms */

main fieldset {
	border: none;
	margin-bottom: 1em;
}
main fieldset.buttons {
	text-align: right;
	margin-right: 100px;
}
main label {
	float: left;
	clear: left;
	width: 14em;
	text-align: right;
	padding-right: 1em;
}
main label:after {
	content: ":";
}
main input,
main textarea {
	display:block;
	margin-left: 18em;
	margin-bottom: 1em;
	width: 20em;
	background-color: #fdf3bc;
	border: 1px solid #ee3f25;
	border-radius: 4px;
}
main input:focus {
	color: #000;
	background-color: #ef9b23;
}
.bigger {
	font-size:14pt;
}
/* RESPONSIVE----------------------------------    ----------------------- */
/* RESPONSIVE-----------------------------------    ---------------------- */
 @media only screen and (max-device-width : 1000px) {

html,
body {
	overflow-x: hidden;
	width:100%;
	font-size:14pt;
	}

body,
.package,
main,
header,
header:after {
	width: auto;
	margin:0;
	border-radius:0;
	background-image:none;
	box-shadow:none;
}
div.package {
	padding-bottom:30px;
	box-shadow:0 5px 20px rgba(0, 0, 0, 1);
	min-width: 100%;
    min-height: 100%;
    position: relative;
    top: 0;
    bottom: 100%;
    left: 0;
    z-index: 1;
}

header {
	background-image:url(graphics/horiz-scrape-transparent.png),linear-gradient(rgba(0,0,0,0.5) 0, rgba(0,0,0,0) 75%);
	height:auto;
	padding:20px 0 20px 65px;
	
}
header ul {
	display:none;
}
header h1 {
	margin:0;
	float:none;
	width:171px;
	}
header h1 a {
	background-position: -3px 0;
    height: 86px;
    width: 171px;
	background-size:180px 100px;
	}

main {
	float:none;
	width:auto;
	padding:0 10px 20px 65px;
	min-height:0;}
footer {
	margin:0 10px 0 65px;
	}
footer dl,
footer ul,
footer address {
	float:none;
	width:auto;
	margin-right:0;
	font-size:8pt;
}
footer address,
p.copyright {
	border-top: 1px solid #8D433A;
}

p.sitecredit,
p.sitecredit a,
p.copyright {
	float: none;
	color:inherit;
	padding-top:10px;
	padding-right:0;
	font-size: 6pt;
	margin: 0 10px 0 65px;
	padding:0;
}
p.sitecredit a {
	margin:0;
	}
/* ------- Responsive Menu ------------*/
nav {
	position:fixed;
	top: 20px;
	z-index:0;
}
nav dl {
	width:100%;
	color:rgba(240,154,45,1);
	font-size:10pt;
}

nav dl dt {
	
	margin-left: 20px;
}
nav dl dd {
	margin-left: 30px;
}
/* nav-menu {
background-size: 360px 200px;
} */
.nav-trigger {
	display:block;
	position: absolute;
	clip: rect(0, 0, 0, 0);
}
label[for="nav-trigger"] {
	display:block;
	position: fixed;
	top: 10px;
	left: 10px;
	z-index: 2;
	width:30px;
	color: #ee3f25;
	border:2px solid;
	background-color:rgba(255,235,180,1);
	text-align:center;
	padding-bottom:5px;
	cursor:pointer;
	box-shadow: 0 5px 10px rgba(0,0,0,0.5);
}

label[for="nav-trigger"]:after {
	content:"☰";
	display:block;
	font-size:25px;
	line-height:20px;
}
label[for="nav-trigger"]:before {
	display:block;
	content:"Menu";
	font-size:8px;
	font-weight:bold;
	line-height:10px;
	margin-bottom:5px;
}

.nav-trigger + label,
div.package {
	transition: left 0.5s ease;
}
.nav-trigger:checked ~ div.package {
 left: 200px;
}
.nav-trigger:checked + label {
	left:210px;
}
/* front page design -------- */
.picturemenu {
	display:none;
}
/* Form Page ---------------*/
main label {
	float: none;

	width: auto;
	text-align:left;
	padding-right:0;
}
main input,
main textarea {
	display:block;
	margin-left: 0;
	width: 20em;
}
}
 @media only screen and (max-device-width : 800px) and (orientation: landscape) {
	 nav dl {
	font-size:10pt;
	margin:0 auto;
}
 }