
body {
 	margin:50px 0 0 0;
}

.wrapper,
.inner {min-width:700px;max-width:1400px;width:98%;margin:0 auto;position:relative;}
.wrapper {border:1px solid red;}

#body {padding:0;}
#content {padding:10px 0 20px;}


#top {
	position:fixed;
	top:0;
	width:100%;
	z-index:9;
}

header {
	height:50px; /* 60px */
	padding:0 0;  /* 7px 0 */
}


.logo {
	background-position:-5px 50%;
	height:50px;
	max-width:200px;
}

/*
	.d1 .logo {max-width:auto;text-indent:0;}
*/	
 
/* locations */

div.sightings {width:400px;float:left;clear:both;}
div#nearby,
div.photos {width:450px;float:right;}





h3.date {top:50px;padding-top:10px}



.ni {text-align:center;box-shadow:0;position:relative;overflow:hidden;}
img#photograph {z-index:1}
#content div.ni img#spacer {position:absolute;top:0;left:0;width:100%;height:100%;z-index:2;border:0;box-shadow:0;}





/* news */

div.news-image {width:300px;float:right;border:1px solid #007;margin-left:20px;}
div.news-image img {border:0;max-width:300px;}

#content div.home-news-image {margin:10px 0;}



	.n2-overlay {opacity:0;-webkit-transform:scale(0);transform:scale(0);font-size:1rem;padding:20px}
	
	.n2-link {padding:0;}
	.n2-link:focus .n2-overlay,
	.n2-link:hover .n2-overlay {opacity:1;-webkit-transform:scale(1);transform:scale(1);}

	.n2-title {font-size:1.3rem;font-weight:400}


/* photo lists */

div.a-img {width:110px;float:left;}
div.a-text {width:500px;float:left;}
div.a-tool {width:200px;float:right;}


/* shadows and curved corners - browserspecific*/



ol.stats span {font-weight:bold;}



h2 {font-size:2.4rem;}

h3+fieldset{margin:10px 0;}




#adminarea {background:#fffff1;padding:3px 10px;border:1px dotted #aaf}




#loginbox {display:none;}

td.photo {
  width:100px;
}




#content p.o {margin:3px 0;}

#yoursightings p.o {float:left;margin:5px;padding: 2px 25px 2px 2px;}
#yoursightings h2,#yoursightings h3 {clear:left;}




a.ct {float:left;margin:3px 10px 10px 0;}


.post {padding:10px 20px 20px 29px;}

	
	
/*	
p#sighting_validation {display:block;}
button#submit{display:none;}
*/




/* 2016 changes */


nav {
	border:none;
	position:relative;
	top:auto;
	display:block;
	height:50px;
	padding:0;
	background:none;
	box-shadow:none;
	margin:none;
	transition:none;
}

.nav {
	clear:none;
	border-left: 0 solid #000;
	
	
	
	display: -webkit-flex; 
    -webkit-justify-content: space-between; 
    display: flex;
    justify-content: space-between;
	
}

.nav-item {
	border:none;
	cursor:pointer;
	display:block;
	line-height:49px;
	font-size:0.85rem;
	float:left;
	padding:0;
	position:relative;
	border:none;
	color:#222;
	margin:0;
	clear:none
}
.nav-log,
.nav-photo {background:none;width:auto;border:none;color:#009;font-weight:bold;}

.ff1 .nav-log {line-height:26px;height:30px;margin-top:10px;color:#fff;border:1px solid #007;background:#007;}

.nav-event {color:#009;background:none;width:auto;border:none;}

.nav-item:focus,
.nav-item:hover {background:#FFFFFF;color:#000;cursor:pointer;}
.nav-link {color:inherit!important;padding:0 5px;	font-weight:600;
}
.nav-link:hover {text-decoration:none;}

	.sub {display:none;position:absolute;left:-15px;top:49px;background:#FFFFFF;padding:7px 19px 12px;margin:0;width:300px;border-width:0 1px 1px 1px;border-style:solid;border-color:#fff #007 #007;}
		.sub-item {line-height:30px;padding:0;color:#000;font-size:0.9rem}
		.sub-link:hover {color:#009;}
		.nav-item:focus .sub,
		.nav-item:hover .sub {display:block;}
		.sub2 {width:600px;left:-290px}
		.sub2 ul {width:50%;float:left;}
		
		.sub3 {width:800px;left:-270px}
		.sub3 ul {width:33.333333%;float:left;}



	.user0 .link-upgrade {color:#c0392b;font-style:italic;}
	
.pull {
 	display:none
}
.avatar__menu {margin:0 0 0 12px ;float:right;display:inline-block;transition:border-color 0.1s ease-in}
.nav-item:hover .avatar {border-color:#289ad0;}


/* search */
	.input__search {
		font-size:0.8rem;
		margin:0;
		padding:4px 7px;
		margin:3px 0 0 0;
	}
	
	.searchbox {margin:4px 0 0 0;}
.button__search { background-position:-8px -267px;cursor:pointer;}

	
	
	
.search_results__ul {width:400px;position:absolute;left:auto;right:0;top:40px;}


.banner {text-align:center;}
.banner-overlay {padding:10vh 70px;}
.banner-title {font-size: 2.4rem;}
.banner-sub {font-size: 1.4rem;}



 /*
.d1 .banner {border-bottom:3px solid black;text-align:left; }

.d1 .banner-overlay {z-index:1;position:relative;padding:10vh 0;}
.d1 .banner-title {color:#fad300;display:inline-block;margin-bottom:20px;max-width:45%;
 border-left:5px solid #fad300;padding-left:20px;border-bottom:0;
}
.d1 .banner-title .avatar {display:none;}
.d1 .banner-sub {max-width:45%;}
.d1 .banner-image {width:70%;height:100%;}
 
 
.d1 .fade { background: rgb(0,0,0);
background: -moz-linear-gradient(90deg, rgba(0,0,0,1) 33%, rgba(0,0,0,0) 55%);
background: -webkit-linear-gradient(90deg, rgba(0,0,0,1) 33%, rgba(0,0,0,0) 55%);
background: linear-gradient(90deg, rgba(0,0,0,1) 33%, rgba(0,0,0,0) 55%);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#000000",endColorstr="#000000",GradientType=1); }
 
 */
 
 
 
/* VEHICLE PAGES */

.fact {padding:5px;font-size:1.2rem}
.fact__evn {}
	.fact strong {}
	.fact i {}
	
.fact-thumb {display:block;width:100%;height:auto;border:2px solid #F9D200;}


/* tabs */

/*
.tabs {border-bottom:1px solid #2980b9;border-left:none;margin:2rem 0 0 0;}
.tab {margin:0 0 0 10px;font-size:0.9rem;float:left;border-radius:5px 5px 0 0;padding:7px 10px;}
.tab:hover,
.tab__active {border-radius:4px 4px 0 0;}
*/
.tabs {position:relative;border:1px solid #2980b9;z-index:0;box-shadow:none;}
.tab {background-position:8px 50%;padding:10px 10px 10px 40px;text-align:left;border-left:1px solid #2980b9;font-size:0.8rem;height:auto;}

	.tab:hover,
	.tab__active {background-position:5px 50%;}

	
	.tab span {display:inline-block;margin-left:5px;padding:1px 5px;border-radius:3px;position:relative;top:auto;left:auto;right:auto;font-size:1em;color:#fff;background:#2980b9;}
span.none {color:#fff;background:#c0392b;;}
.tab_box { padding:10px 0;}



#recent_n2 {margin:0;}


/* TABLES */
.col {display:none;border:none;}
td,
.col__show {display:table-cell}

.fleet thead {display:table-header-group;}
.fleet tbody tr {display:table-row}
.fleet tbody td,
.fleet tbody .t-photo {float:none;height:80px;}

.col__show {clear:none;display:table-cell;}

.list-thumb {width:100px;height:auto;border:1px solid #aaa;}


/* forms */
.form {padding:12px 16px;margin-bottom:1.6rem;}

.form__sticky {
	position: -webkit-sticky;
  position: -moz-sticky;
  position: -ms-sticky;
  position: -o-sticky;
position:sticky;
top:60px;z-index:5; }


.xxitems .form {height:100%;}



.form-heading {color:inherit; margin:-12px -16px 10px -16px;padding:8px 16px;}


label {font-size:1rem;}
.form-input {font-size:1rem;}

.hint {margin:2px 0 0;clear:both;font-size:0.8rem;padding:0;color:#000;font-style:italic;text-align:right}

.friend__mini {width:33%;text-align:left;}

 .filters {
	display: -webkit-flex; /* Safari */
    display: flex;
	padding:12px;
	gap:12px;

	 
	border:none;
	margin: 1rem -20px 2rem;width: calc(100% + 40px); 
}

.filters input,
.filters select {flex:1;margin:0;}
	
.filters .button {flex:0;width:150px;}	
 


#footer {padding:20px 0;}
#footer .g03 ,
#footer .g04 {width:25%;float:left;clear:none}


/* grid */

.row {clear:both;}
.grid {float:left;}
.grid_right {float:right;}
	.g01 {width:8.33%;}
	.g9th {width:11%;}
	.g8th {width:12.5%;}
	.g02 {width:16.66%;}
	.g20 {width:20%;}
	.g03 {width:25%;}
	.g04 {width:33.3%;}
	.g40 {width:40%;}
	.g05 {width:41.66%;}
	.g06 {width:50%;}
	.g07 {width:58.3%;}
	.g08 {width:66.66%;}
		.g03 + .g08 {width:73%;}
	.g09 {width:75%;}
	.g10 {width:83.3%;}
	.g11 {width:91.66%;}
	.g12 {width:100%;}
	.padding-right {padding-right:4.1%;}
	.padding-left {padding-left:4.1%;}
	.padding-all {padding:5px;}
	.margin__right {margin-right:20px;}
	
	

/* flex */
.flex_row {
	display: -webkit-flex; /* Safari */
    display: flex;
}
.flex_wrap {
	-webkit-flex-wrap:wrap;
	flex-wrap:wrap;	
}

.flex_item {
	-webkit-flex:1;
	flex:1;	
}
.flex__gap {margin:12px;}
	
	
	.flex_row h3 {margin:0;XXpadding-left:15px;}
 






	.item-image {height:120px;}
	.g04 .item-image {height:160px;}

/* new items */


	.items {gap:19px;padding:6px 0}
	
	.items__highlight {margin: 1rem -20px 2rem;width: calc(100% + 40px);padding: 20px;}
	
/*.items + .items {margin-top:25px;}*/



	.xitem { width:calc(25% - 15px);height:130px;}
	
	.items__mini  .xitem {width:calc(50% - 10px)!important;}

	.xitem__noimage {width:calc(20% - 16px);max-width:calc(25% - 15px);}

	.xitem__news {width:calc(33.333333% - 14px);}
	.xitem__news.xitem__noimage {width:calc(33.333333% - 13.333333px);max-width:calc(33.333333% - 13.333333px);}
	
	
	.item,
	.xitem__large {width:calc(33.333333% - 13.4px);}
	
	.xitem__third {width:calc(33.333333% - 13.4px)!important;}
	.xitem__large {;height:170px;}

	.xitem__thumb {width:calc(16.666666666667% - 16.666666666667px);height:auto;}

	.c2a {flex:1;}

.c2a__user {flex-grow:1;}

.mini_filter  {right:0;top:-2px;width:calc(25% - 15px); }
 
 
 	.card {width:calc(33.333333% - 14px); }

 
@media screen and (min-width: 1150px) {
	.nav-item {
		font-size:0.95rem;
	}

}



@media screen and (min-width: 1400px) {
	#content {padding:0;background:#f4f4f4}
	.content .inner,
	#content .inner {width:100%;padding:1rem 2rem;box-shadow:0 0 5px #bbb;background:#fff}

.filters,
	.items__highlight {margin: 1rem -2rem 2rem;;width: calc(100% + 4rem);padding: 20px 2rem;}

  	.card {width:calc(33.333333% - 14px); }

}



@media screen and (min-width: 1750px) {
	 


p,li,td,th {font-size:1.05rem;margin:1rem 0;}

p.intro {font-size:1.2rem;}
	.items__mini  .xitem {width:calc(33.333333% - 14px)!important;max-width:calc(33.333333% - 14px)!important;}
	.xitem__news {width:calc(33.333333% - 14px);}


}