/* Apply a natural box layout model to all elements: http://paulirish.com/2012/box-sizing-border-box-ftw/ */
* { -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; }

.chromeframe {position: absolute; top: 0;}

/* Ok, this is where the fun starts.
-------------------------------------------------------------------------------*/

/* A Linux- and Windows-friendly sans-serif font stack: http://prospects.mhurrell.co.uk/post/updating-the-helvetica-font-stack */
body {font: 14px Helmet, Freesans, sans-serif;line-height:1.5;background: #fff;}
body.modal-open { margin-right: inherit; }
/* Using local fonts? Check out Font Squirrel's webfont generator: http://www.fontsquirrel.com/tools/webfont-generator */

/* We like off-black for text. */
body, select, input, textarea {color: #333;}

a { color: #0089AF;text-decoration: none; }
a:hover { color: #448aae;text-decoration: none; }

/* Custom text-selection colors (remove any text shadows: http://twitter.com/miketaylr/status/12228805301) */
::-moz-selection{background: #0089AF; color: #fff; text-shadow: none;}
::selection {background: #0089AF; color: #fff; text-shadow: none;} 

/*	j.mp/webkit-tap-highlight-color */
a:link {-webkit-tap-highlight-color: #fcd700;} 

ins {background-color: #fcd700; color: #000; text-decoration: none;}
mark {background-color: #fcd700; color: #000; font-style: italic; font-weight: bold;}

.container { width: 940px;margin: 0 auto; }
input:-moz-placeholder { color: green; }
textarea:-moz-placeholder { color: green; }

quote { padding-left: 30px;border-left: 3px solid #EBDDD0;margin-bottom: 18px;display: block; }


h1, h2, h3, h4, h5, h6 { font-family: 'PT Sans Narrow', sans-serif;font-weight: 400;margin-bottom: 18px; }
h1 { font-size: 25px; }
h2 { font-size: 20px; }
h3 { font-size: 18px; }






/* Nav
-------------------------------------------------------------------------------*/

.nav { margin-top: 10px; }

.navbar { border-radius: 0;margin-bottom: 0;font-family: 'PT Sans Narrow', sans-serif;-webkit-box-shadow: 1px 2px 5px 1px rgba(0, 0, 0, .2);box-shadow: 1px 2px 5px 1px rgba(0, 0, 0, .2); }
.navbar-brand { padding: 0;/*width: 200px;*/ }
.navbar-brand:hover {color: #fff;text-decoration: none; }
.navbar-brand h1.logo { display: inline-block;float: left;margin: 5px;padding: 5px 15px;/*background: #1c6f99;-webkit-box-shadow:	1px 2px 5px 1px rgba(0, 0, 0, .1);box-shadow: 1px 2px 5px 1px rgba(0, 0, 0, .1);*/ }
.navbar-brand h1.logo img { height: 50px; }
.navbar-brand h1.name { color: #fff;padding: 9px 0 5px 20px;display:none; }

.navbar-default .navbar-collapse, .navbar-default .navbar-form { border-color: #fff; }
.navbar-default { background-color: #448aae;border-color: #448aae; }
.navbar-default .navbar-toggle { margin-top: 15px; }
.navbar-default .navbar-nav>li>a { color: #fff; }
.navbar-default .navbar-nav>li>a:hover {color: #fff;text-decoration: none;background-color: #1c6f99;-webkit-box-shadow:	1px 2px 5px 1px rgba(0, 0, 0, .1);box-shadow: 1px 2px 5px 1px rgba(0, 0, 0, .1);-webkit-border-radius: 2px;border-radius: 2px; }


.nav ul{
	background:#fff; /* Adding a background makes the dropdown work properly in IE7+. Make this as close to your page's background as possible (i.e. white page == white background). */
	background:rgba(255,255,255,0); /* But! Let's make the background fully transparent where we can, we don't actually want to see it if we can help it... */
	list-style:none;
	position:absolute;
	left:-9999px; /* Hide off-screen when not needed (this is more accessible than display:none;) */
}
.nav ul li{ float:none;display: block;margin-right:20px; }
.nav ul a{ white-space:nowrap; /* Stop text wrapping and creating multi-line dropdown items */ }
.nav li:hover ul{ /* Display the dropdown on hover */
	left:0; /* Bring back on-screen when needed */
}
.nav li:hover a{ /* These create persistent hover states, meaning the top-most link stays 'hovered' even when your cursor has moved down the list. */
	background: #1c6f99;
	color: #fff;
	-webkit-box-shadow:	1px 2px 5px 1px rgba(0, 0, 0, .1);
	box-shadow: 1px 2px 5px 1px rgba(0, 0, 0, .1);
}
.nav li:hover ul a{ /* The persistent hover state does however create a global style for links even before they're hovered. Here we undo these effects. */
	text-decoration:none;
	display: block;
	padding: 3px 15px 3px 5px;
}
.nav li:hover ul li a:hover{ /* Here we define the most explicit hover states--what happens when you hover each individual link. */
	background: #448aae;
}
.nav .social { margin-left: 0;margin-right: 0; }
.nav .cities { margin-top: 10px; }
.nav .cities a {
	background: #1c6f99;
	padding: 15px;
	width: 180px;
	margin-top: -10px;
	-webkit-box-shadow:	1px 2px 5px 1px rgba(0, 0, 0, .1);
 	box-shadow: 1px 2px 5px 1px rgba(0, 0, 0, .1);
	-webkit-border-radius: 2px;
	border-radius: 2px;
}
.nav .cities a .arrow-down { margin-top: 5px; }


footer #nav a { font-size: 18px; }






.btn {
	background: #1c6f99;
	padding: 8px 40px;
	color: #fff;
	text-decoration: none;
	font-family: 'PT Sans Narrow', sans-serif;
	font-size: 15px;
	-webkit-border-radius: 3px;
	border-radius: 3px;
}
.btn:hover { background: #25996A;color: #F4F3F0;text-decoration: none; }


.btn.first { background: #0089AF; }
.btn.second { background: #16763c; }
.btn.fade, .btn.first.fade, .btn.second.fade { opacity: .5; }
.btn.small { padding: 8px 12px;}

.claim-btn .btn {
	width: 100%;
	display: block;
	text-align: center;
}
input[type=submit] { border: none; }
button { border: none; }



/* Sidebar */
.keypin { margin: 5px 10px; height: 50px;display:inline-block; }

#listings { width: 310px;background:rgba(255, 255, 255, .90);z-index:999;position:absolute;left: 5px;padding: 10px 20px;overflow-x: hidden;overflow-y: auto;-webkit-box-shadow:	1px 2px 5px 1px rgba(0, 0, 0, .1);box-shadow: 1px 2px 5px 1px rgba(0, 0, 0, .1);top:80px; }
#listings header { padding: 0 0 10px 0;border-bottom: 2px solid #333; }
.listing {
	overflow-x: hidden;
	border-bottom: 2px solid #333;
}
.listing h2 { float:left;font-size: 40px;margin-right:10px; }
.listing:last-child {
	border-bottom: none;
}
.pallet-listing h2 { margin-bottom: 10px; }
.pallet-listing img { float: left;margin: 2px; }
.pallet-listing table tr {
	border-bottom: 1px dotted #34C390;
}
.pallet-listing table {
	margin-bottom: 4px;
}
.pallet-listing table tr td {
	padding-top: 2px;
	border-right: 1px dotted #34C390;
	width: 120px;
}
.pallet-listing table tr td:last-child {
	border-right: none;
	text-align: right;
}
.pallet-listing table tr td.message {
	text-align: left;
}
.listing .images {
	margin-top: 10px;
	width: 100%;
	overflow-x: scroll;
	overflow-y: hidden;
}
.listing .images img {
	height: 50px;
}
.listing .claim-btn { margin: 10px 0; }
#listings { display: none; }
.otherpallets { width: 240px; }
.message { background: #f2f2f2;margin: 5px 0;padding: 5px;-webkit-border-radius: 2px;border-radius: 2px;}

.claim-return, .quote-return { display: none; }


/* content pages */
#headermap {  }
#correct { display: none; }
.links {
	background: #f2f2f2;
	padding: 20px;
	-webkit-border-radius: 2px;
	border-radius: 2px;
	font-size: 18px;
	margin-bottom: 20px;
	
}
.links ul li { margin-bottom: 5px; }

#userinfo p {
	margin-bottom: 10px;
}

/* Actions
-------------------------------------------------------------------------------*/
.actions { margin: 12px 0;display: table; }
.actions h2 { margin-bottom: 8px; }
.actions p { margin-bottom: 12px; }
.actions .email-submit { width: 300px;height: 240px;float: left;margin: 0 10px;background: #f2f2f2;padding: 15px; }
.actions .email-submit p { margin-bottom: 6px; }
.actions .email-submit input[type=text] { width: 270px; }
.actions .email-submit select { width: 270px;margin: 10px 0; }

.action { margin-left: 320px;clear: right; }
.action .btn { margin-bottom: 20px; }
.action .first, .action .second, .action .third { width: 32%;float: left;margin: 0 7px; }
.action .first .icon, .action .second .icon, .action .third .icon { padding: 20px;margin-bottom: 5px;color: #fff;-webkit-border-radius: 2px;border-radius: 2px;-webkit-box-shadow:	1px 2px 5px 1px rgba(0, 0, 0, .1);box-shadow: 1px 2px 5px 1px rgba(0, 0, 0, .1); } 
.action .first .icon img, .action .second .icon img, .action .third .icon img { width: auto;margin: 0 auto;display: block } 
.action .first .icon, .action .first .btn { background: #0089AF; }
.action .second .icon, .action .second .btn { background: #16763c; }
.action .third .icon, .action .third .btn { background: #FF793C; }
.action .first .btn, .action .second .btn, .action .third .btn { float: right; }

.content .first, .content .second, .content .third { width: 100%; }
.content .first .icon, .content .second .icon, .content .third .icon { padding: 20px;margin-bottom: 10px;color: #fff;-webkit-border-radius: 2px;border-radius: 2px;-webkit-box-shadow:	1px 2px 5px 1px rgba(0, 0, 0, .1);box-shadow: 1px 2px 5px 1px rgba(0, 0, 0, .1); } 
.content .first .icon img, .content .second .icon img, .content .third .icon img { width: 75px;margin: 0 auto;display: block } 
.content .first .icon { background: #0089AF; }
.content .second .icon {
	background: #16763c;
}
.content .third .icon { background: #FF793C; }

.content {
	background: #fff;
	padding: 20px 0 50px;
}
.content h1 { margin: 0; }
.content p {
	margin-bottom: 18px;
}
.content img {
	margin-bottom: 18px;
}
#how-to .postpallets { text-align: center;margin: 20px 0 30px; }
#how-to .postpallets a {
	font-size: 21px;
	padding: 10px 40px;
}
#maparea { z-index: 990;width: 100%; }
#map-canvas { }
#map-canvas.contentmap { height: 250px; }
.map-btn { position: relative;top: -40px;left: 10px; }

#admin { margin-top: 60px; }
#admin input, #admin select { margin-bottom: 10px; }
#admin input.title { width: 100%;margin-bottom: 10px; }
#admin textarea { width: 100%;height: 400px;margin-bottom: 20px; }

#admin table {
	width: 100%;
	margin-bottom: 30px;
}
#admin table tr th {
	padding: 5px;
	vertical-align: middle;
}
#admin table tr td {
	padding: 5px;
	vertical-align: middle;
	border-left: 2px solid #34C390;
}
#admin table tr td:first-child {
	border-left: none;
}
#admin table tr:nth-child(even) {
	background: #EDEDED;
}

.markets.row input, .markets.row select { width: 150px;display: inline; }


footer {
	background: #333;padding: 20px;color: #fff;
}
footer a {
	color: #fff;
	text-decoration: none;
	font-family: 'PT Sans Narrow', sans-serif;
}

/** FIX for Bootstrap and Google Maps Info window styes problem **/
img[src*="gstatic.com/"], img[src*="googleapis.com/"] {
max-width: none;
}


/* Partners page input[type=radio]
-------------------------------------------------------------------------------*/
.label { display: block;margin: 5px }
.label label { display: inline-block;width: 200px; }
.label input { width: 250px;padding: 4px; }
.label textarea { margin-left: -4px;padding: 4px;height: 100px; }
.label input#quantity, .label input#chepnumber, .label input#height, .label input#width { width: 50px;padding: 4px; }
.label select.region { margin-left:-4px; }
.mainlabel { width: 145px; }

.label.center input { text-align: center; }

.form h3 { margin-bottom: 0; }
.form hr { margin-top: 0; }
.form .btn { margin-left: 155px; }
.form .btn.fade { margin-left: 5px; }


input[type=text], input[type=email] {
	width: 360px;
	border: 1px solid #ccc;
	background-color: #fff;
	border-radius: 3px;
	padding: 5px;
	font-size: 18px;
}
textarea {
	width: 360px;
	border: 1px solid #ccc;
	background-color: #fff;
	border-radius: 3px;
	padding: 5px;
	font-size: 18px;
}
select {
	width: 360px;
	border: 1px solid #ccc;
	padding: 9px;
	background: #fff;
	height: 32px;
	overflow: hidden;
	-webkit-border-radius: 2px;
	border-radius: 2px;
}


.image-form { background: #f2f2f2;height: 120px;padding: 25px; }
.image-form .btn { margin-top: -45px; }
.image-form .file { margin-bottom: 10px;padding: 0 30px; }
.images { width: 240px;overflow-x: auto;white-space:nowrap; }
.images img { height: 80px; }


/* Forms
-------------------------------------------------------------------------------*/
#pallet-fade { min-height: 620px; }
#pallet-fade span.pic { float: left;margin-right: 10px;margin-top: -5px;font-size: 24px;}
#pallet-final { min-height: 620px; }
.skip { margin-right: 32px;float: right; }


/* Helpers
-------------------------------------------------------------------------------*/
.arrow-up {
	width: 0; 
	height: 0; 
	border-left: 5px solid transparent;
	border-right: 5px solid transparent;
	border-bottom: 5px solid #fff;
}
.arrow-down {
	width: 0; 
	height: 0; 
	border-left: 5px solid transparent;
	border-right: 5px solid transparent;
	border-top: 5px solid #fff;
}
.displaynone { display: none; }
.pull-right { float: right; }
.pull-left { float: left; }
.tenmargin { margin: 10px 0; }
.twentymargin { margin: 20px 0; }
.topmargin { margin-top: 20px; }
#sending { display: none; }
#waiting { background: #009B4E; }
.waiting img { display: block;width: 16px;margin: 0 auto;padding-top: 100px; }
#cityview { display: none; }

/* Bootstrap Overrides
-------------------------------------------------------------------------------*/
.modal { }
.modal-backdrop { background-color: #fff; }
.modal-backdrop.in { opacity: 0.8;filter: alpha(opacity=80); }
.modal-content { -webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.5);box-shadow: 0 1px 3px rgba(0, 0, 0, 0.5); }
.modal-content {
	border: none;
	border-radius: 0;
	-webkit-box-shadow: 0 3px 9px rgba(0, 0, 0, 0.5);
	box-shadow: 0 3px 9px rgba(0, 0, 0, 0.5);
	background-clip: padding-box;
	outline: none;
}
.modal-content.green { background: #448aae;color: #fff; }
.modal-content.green a { color: #fff }
.modal-content.green .modal-header { border-bottom: none;background: #1c6f99;-webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.5);box-shadow: 0 1px 3px rgba(0, 0, 0, 0.5); }

label { font-weight: normal; }

.close { background: #448aae;color: #fff; }






/* Grid
-------------------------------------------------------------------------------*/

.row {
  margin-left: -20px;
  *zoom: 1;
}

.row:before,
.row:after {
  display: table;
  line-height: 0;
  content: "";
}

.row:after {
  clear: both;
}

[class*="span"] {
  float: left;
  min-height: 1px;
  margin-left: 20px;
}

.container {
  width: 940px;
}

.span12 {
  width: 940px;
}

.span11 {
  width: 860px;
}

.span10 {
  width: 780px;
}

.span9 {
  width: 700px;
}

.span8 {
  width: 620px;
}

.span7 {
  width: 540px;
}

.span6 {
  width: 460px;
}

.span5 {
  width: 380px;
}

.span4 {
  width: 300px;
}

.span3 {
  width: 220px;
}

.span2 {
  width: 140px;
}

.span1 {
  width: 60px;
}

.offset12 {
  margin-left: 980px;
}

.offset11 {
  margin-left: 900px;
}

.offset10 {
  margin-left: 820px;
}

.offset9 {
  margin-left: 740px;
}

.offset8 {
  margin-left: 660px;
}

.offset7 {
  margin-left: 580px;
}

.offset6 {
  margin-left: 500px;
}

.offset5 {
  margin-left: 420px;
}

.offset4 {
  margin-left: 340px;
}

.offset3 {
  margin-left: 260px;
}

.offset2 {
  margin-left: 180px;
}

.offset1 {
  margin-left: 100px;
}
/*.gm-style-iw>div:first-of-type{border:solid 1px red !important;}*/
/* Landscape phone to portrait tablet */
@media (max-width: 767px) {
	.collapse { display: none; }
}


/* Portrait Phone */
@media screen and (max-width: 480px) {
	.collapse { display: none; }
	#listings {
		height: auto !important;
		position: inherit !important;
		width: 100%;
		background: #fff;
		opacity: 1;
		box-shadow: none;
	}
	div.actions,.email-submit,.action{
		float:left !important;
		width:100%;
		display:block;
	}
	.email-submit,.second,.first{
		margin: 0 !important;
		padding: 2% !important;
		width: 100% !important;
	}
	.action {
		margin-left: 0 !important;
	}
	[class*="span"], .container, footer {
		float: left;
		width: 100% !important;
		margin: 0 !important;
		padding: 10px 0 10px 17px;
	}
	.span2{
		width:33% !important;
	}
}