﻿@charset "UTF-8";
/* CSS Document */

@font-face {
 font-family: 'HelveticaLight';
 src: url('helveticalight.eot');
 src: url('helveticalight.eot?#iefix') format('embedded-opentype'),  url('helveticalight.woff') format('woff'),  url('helveticalight.ttf') format('truetype'),  url('helveticalight.svg#') format('svg');
 font-weight: normal;
 font-style: normal;
}
 @font-face {
 font-family: 'Conv_HelveticaNeueCondensedBold';
 src: url('HelveticaNeueCondensedBold.eot');
 src: local('☺'), url('HelveticaNeueCondensedBold.woff') format('woff'), url('HelveticaNeueCondensedBold.ttf') format('truetype'), url('HelveticaNeueCondensedBold.svg') format('svg');
 font-weight: normal;
 font-style: normal;
}
 @font-face {
 font-family: 'HelveticaNeue-Bold';
 src: url('helveticaneuebold.eot');
 src: url('helveticaneuebold.eot?#iefix') format('embedded-opentype'), url('helveticaneuebold.woff') format('woff'), url('helveticaneuebold.ttf') format('truetype'), url('helveticaneuebold.svg#helveticaneuebold') format('svg');
 font-weight: normal;
 font-style: normal;
}
* {
	padding:0px;
	margin:0px;
}
body, html {
	font-family: Arial, Helvetica, sans-serif;
    color: #555;
}
h2 {
	padding:10px;
	margin:auto 0px auto 0px;
	
}
h2 a {
	color:#FFF;
	text-shadow:1px 1px 0px #999;
}
a {
	text-decoration:none;
}
img {
	border:none;
}
.clearMe {
	clear:both;
}
.clearfix:before, .clearfix:after {
	content: " ";
	display: table;
}
.clearfix:after {
	clear: both;
}
.clearfix {
 *zoom: 1;
}
.default {
	color: #2b2b2b;
}
#wrapper {
	position: relative;
	width: 100%;
	top: 0px;
	margin:0px;
    min-height: 800px;
}
/* NAVIGATION */

#header {
     z-index: 100; 
     width: 100%;
     position: relative; 
}

#nav {
	height:auto;
	width: 100%;
	background: #2b2b2b;
	font-size: 1em;
	position: relative;
	margin:0px;
    
}
#nav ul {
	padding: 0;
	margin: 0 auto;
	width: 100%;
	height:auto;
}
#nav li {
	display: inline;
	float: left;
}
#nav li iframe {
	height:20px; 
	width:600px !important;
}
#nav a, #nav span.a {
	color: #fff;
	display: inline-block;
	width: auto;
	text-align: center;
	text-decoration: none;
	line-height: 40px;
	text-shadow: 1px 1px 0px #283744;
    cursor: pointer;
}
#nav li a, #nav li span.a {
	border-right: 1px solid #576979;
	box-sizing:border-box;
	-moz-box-sizing:border-box;
	-webkit-box-sizing:border-box;
	padding:0px 10px 0px 0px;
}
#nav li:last-child a {
	border-right: 0;
}
#nav a:hover, nav a:active {
	background-color: #2b2b2b;
}
#nav a#pull {
	display: none;
}
#nav img {
	float:left;
	margin:0px 5px 0px 5px;
	width:auto !important;
}
#nav li img {
	margin:0px;
    padding-left:10px;
}
#nav ul li.device {
	display:none;
}
.desktop {
	display:block;
}
span.desktop {
    display: inline;
}

#socialicons {margin:5px 10px 0px 0px; float:right; width:auto;}
#socialicons img {margin:0px 0px 0px 0px; padding:0px; width:35px; height:35px;}

#subnav { margin:0px; background-color:#606060; color:#FFF; font-size: 1em; position: relative;display: block; line-height:15px;
    min-height: 40px;padding-left: 20px;}
#subnav ul {display:inline}
#subnav li {margin:2px 15px 0px 15px; display:inline }
#subnav a {color:#FFF; white-space: nowrap}
#subnav h3 {padding:0px; font-size:1em; display:inline }
#subnav .btn-right { padding:2px 10px; margin:5px 10px 0px 0px; font-size:12px;  }

.hiddenform {
    display: none;
    padding: 5px;
    background-color:#DDD;
}

.hiddenform form {
    margin: 0;
    padding: 0;
}

    .hiddenform label {
        display: inline;
        padding-right: 20px;
    }

.hiddenform input { margin-bottom: 0px; }


#user-banner {height:50px; width:100%; overflow:hidden; background: #2b2b2b ; }
#user-banner ul {list-style-type:none; margin:0px; padding:0px;}
#user-banner li {float:left; margin:0px; padding:0px;}
#user-banner li img {float:left; margin:0px; padding:0px;width: 50px; height:50px}


/* NEWS ITEMS */

.post-title {
}
.post-title img {
	float:right;
	margin:20px;
	width:50px;
	height:50px;
}

.post-title-white {
	
	}

.post-title-white img {
	float:right;
	margin:20px;
	width:50px;
	height:50px;
}

.bluebg {
	background-color:#a9dff9;
}
.greenbg {
	background-color:#aab734;
}
.orangebg {
	background-color:#e8b400;
}
.purplebg {
	background-color:#ca3179;
}
iframe {
	display:inline;
}


#sidebar {
	float:left;
	height:100%;
	overflow-x:hidden;
    overflow-y: scroll;
    -webkit-overflow-scroll: touch;
    -webkit-overflow-scrolling: touch;
	background-color:#ececec;
	margin:0px;
	padding:0px;
	border:none;
	position:absolute;

}

#sidebar .container {
	width:100%;}
.side-item {
	height:auto;
	border-bottom:1px dotted #CCC;


}
#sidebar .side-item h3 {
	padding:10px;
	margin:0px;
	font-size:1.2em;
	color:#333;
	text-transform:capitalize;
	line-height:normal;
	
}
.side-item p {
	margin-left:10px;
	font-size:1em;


}
.side-item a {
	color:#333;
	
}

body {
    background-color:#DDD;
    overflow-y: scroll;

}

.newsbox-wide, #grid {
    -webkit-overflow-scroll: touch;
    -webkit-overflow-scrolling: touch;
	overflow-x:hidden;
	float:left;
	border:none;

}



.newsbox-wide { min-height:100%; width:100% }

#gridholder { text-align:center }
#grid > span { text-align:left}

* .newsbox-wide {
	padding:0px;
	margin:0px;
	display:inline;
}

.whitebg {background-color:#FFF;}

.newsbox-wide h2 {
	margin:20px;
	font-weight:normal;
}
.newsbox-wide a {
	color:#828f0c;
}
.newsbox-wide a:hover {
	color:#8f9a28;
}

.newsbox-wide img {max-width:92%;}

.vidmargin {margin:0px 20px 10px 20px;} 



.post-details {
	font-size:.8em;
	height:30px;
	text-transform:uppercase;
	background-image:url(img/post-details.jpg);
	/* border-top: solid 20px #0F0; */
}
.post-details img {
	height:30px;
	margin:0px 10px 0px 10px;
	float:left;
}
.deets {
	float:left;
	line-height:30px;
}
.likewrap {
	float:right;
}
.likewrap img {
	margin:5px 5px 0px 0px;
	height:20px;
}
.categ {background-color:#FFF; height:auto; margin:20px 0px 0px 0px;}
.categ img {height:25px; margin:0px 10px 30px 20px; float:left;}
.categ li a:hover {color:#666;}


.tags { font-size:.7em; font-weight:bold; text-transform:uppercase; float:left;}
.tags a {color:#000;}
.geoinfo {
	line-height:40px;
	font-size:.7em;
	font-weight:bold;
	text-transform:uppercase;
	float:right;
	margin:0px 10px 0px 0px;
}
.geoinfo a {
	color:#000;
}
/* SETTINGS PAGE */

#settings {
	height:auto;
	background-color:#FFF;
	box-shadow: 0px 0px 10px #CCC;
}
#settings h2 {
	width:100%;
	float:none;
}
#settings ul {
	list-style-type:none;
	background-color:#FFF;
}
#settings li {
	width:100%;
	border-bottom:1px #CCCCCC solid;
	height:50px;
	font-size:1em;
	line-height:50px;
	background-image:url(img/li-arrow.jpg);
	background-position:right;
	background-repeat:no-repeat;
}
#settings li a {
	color:#b1b1b1;
	display:block;
}
#settings img {
	margin:0px 10px 0px 10px;
	float:left;
	height:50px;
}
#setbox {
	float:left;
	width:49%;
	text-align:center;
	padding:0px 0px 20px 0px;
}
#setbox img {
	max-height:100%;
	max-width:100%;
	height:auto;
	float:none;
	margin:10px;
}
.bright {
	border:1px solid #CCC;
}
#fb-deets {
	margin:30px auto 0px auto;
	width:300px;
}
#fb-deets img {
	float:left;
	height:50px;
}
#fb-deets p {
	font-size:1.5em;
	text-transform:uppercase;
}
#fb-deets p a {
	color:#aab734;
	font-size:.8em;
}
#your-categories {
	float:left;
	width:50%;
	text-align:center;
	padding:0px 0px 20px 0px;
}
#footer {
	height:30px;
	width:100%;
	background-color:#2b2b2b;
	margin:0px 0px 0px 0px;
	font-size:9px;
	overflow: hidden;
}
#footer ul {
	margin:5px;
	float:right;
	list-style-type:none;
}
#footer li {
	float:left;
	margin:0px 10px 0px 10px;
}
#footer a {
	color:#CCC;
}


.editform { margin:20px}
.editform label { margin-top: 10px;display: block; color:gray }
.editform input[type='text'], .editform textarea { width: 90%;font-family: Arial, sans-serif; padding:5px }
.editform .buttons { margin-top:20px }
.editform input.dateinput { width:300px}
.editform .datelater { color:orange }



#subnav { position: relative }
.btn-postitems { position: absolute; left: 5px; top:3px }

.newsbox-wide .btn-info  {color:#000 !important;}
.newsbox-wide .btn-success  {color:#FFF !important;}



.btn-right { float:right }



.editform textarea { height:200px }
.editform .SelectedCategories { list-style:none }
.editform .SelectedCategories label { color: black; font-weight:bold  }
.editform .SelectedCategories span { padding-left:10px }
.editform .SelectedCategories input[type='text'] { width:30% }

.tags { float:none }
.tags ul { list-style:none }
.tags ul li { display:inline }
.tags a:hover { display: inline;color: navy; cursor:pointer }
.tags ul li:after { content:", " }
.tags ul li:last-child:after { content:"" }

.side-item {
    color:#333;
}
    
ul.accounts { margin: 20px; list-style:none }
ul.accounts li { margin-bottom: 10px;}
ul.accounts li a { width: 300px;max-width: 80%; vertical-align: middle;  }
ul.accounts li img { width: 30px;float: left; margin-right:10px }

/*
h1, h2, h3 {
    line-height: inherit !important;
}
*/




 @media screen and (max-width: 800px) {
 html {
height:100%;
}
#wrapper {
top:120px;
}
 #nav {
 height: auto;
}
#nav ul {
 width: 100%;
 display: block;
 height: auto;
}
#nav li {
 width: 50%;
 float: left;
 position: relative;
}
#nav li a, #nav li span.a {
 border-bottom: 1px solid #576979;
 border-right: 1px solid #576979;
 width: 100%;
 text-align:left;
  text-indent: 25px;
  }
#nav a {
 text-align: left;
 width: 100%;
 text-indent: 25px;
}
 #subnav {
margin:0px 0px 0px 0px;
}
 .desktop, span.desktop {
display:none;
}
#nav ul li.device {
display:block;
}

#user-banner {display:none;}

#socialicons {display:none;}


}

 @media only screen and (max-width : 480px) {
 body, html {
font-family:  Arial, Helvetica, sans-serif;
background-image:url(img/bg.jpg);
height:auto;
}
 #nav {
 border-bottom: 0;
 height: auto;
 z-index:500;
}
#nav ul {
 display: none;
 height: auto;
}
#nav a#pull {
 display: block;
 background-color: #2b2b2b;
 width: 100%;
 position: relative;
}
#nav a#pull:after {
 content:"";
 background: url('img/nav-icon.png') no-repeat;
 width: 30px;
 height: 30px;
 display: inline-block;
 position: absolute;
 right: 15px;
 top: 10px;
}
 #nav ul li.device {
display:none;
}
 #subnav {
margin:0px;
}
 #wrapper {
top:40px;
height:auto;
position:absolute;
}

 #footer {
height:auto;
z-index:300;
}
 #footer li {
 display: block;
 float: left;
 width: auto;
}

}
 @media only screen and (max-width : 320px) {
     #nav li {
     display: block;
     float: none;
     width: 100%;
    }
     #nav li a, #nav li span.a {
     border-bottom: 1px solid #576979;
    }

}

.item .date { font-size: 0.8em; }

.selected, .selected:hover {
    background-color: #A9DFF9;
    color: black;
}

.commentarea {
    margin: 10px;
	background-color:#CCC;
	padding:10px;
}
.comments {margin:0px 0px 0px 0px;}
.comment {background-color:#FFF; margin:10px; padding:10px;}
.comment-enter {margin:10px; padding:10px; background-color:#FFF;}
.newsbox-wide .comment-login p {margin:10px; padding:0px; font-size:1em;}

.notbtn.btn {
padding: 0;
}

.post-title h2 {
    color: #FFFFFF;
    font-size: 2em; 
    text-shadow:1px 1px 0px #999;
	font-weight:normal;
	width:70%;
	margin:20px;
    line-height: 150%;
}

.post-title-white h2 {
    color: #000;
    font-size: 1.6em; 
	font-weight:bold;
	margin:10px 20px 0px -10px;
    line-height: 1.4em;
	
}

.selectedItem {display: block;position: relative; max-width: 800px; margin:0 auto 0 auto; background-color:#FFF; padding:0px 0px 10px 0px; }

#map { position: absolute;  }
.vidwrap { max-width: 800px; max-height:60%}

#grid {
    margin:0px; 
    padding:0 0;
    width:100%;
    box-sizing:border-box;
    -moz-box-sizing:border-box;
    -webkit-box-sizing:border-box;
}

@media screen and (min-width: 480px) {

    #grid {
    padding:0 20px;
    }
}

#grid .itemholder {
    display: block;
    position: relative;
    float: left;
    width: 22%;
    height: 320px;
    padding: 10px;
    overflow: hidden;
    box-sizing:border-box;
    -moz-box-sizing:border-box;
    -webkit-box-sizing:border-box;
}
#grid .item {
    height: 280px;
    overflow: hidden;
    padding: 10px;
    text-align:left;
    position: relative;
    vertical-align: top;
    border-radius: 5px;
    background-color: white;
    box-shadow: 0 1px 1px 0 rgba(0, 0, 0, 0.18);
}

#grid .itemholder .item.more { background-color: inherit; }

#grid .itemholder .item.highlight { box-shadow: 0 0 5px 5px yellow;}

#grid .oneline {
    overflow-y: hidden;
    height: 1.5em;
	margin:0px; padding:0px;
    color: gray;
}


#grid .item .bodyhtml img {
    width: 100%; 
	
    /*position:absolute;
    clip:rect(0px,280px,180px,0px);*/
}
#grid .item .itemwrap { overflow: hidden;}
#grid .item .body {
    margin: 0;padding: 5px;position: relative;
}

#grid .item .body p { font-size: 0.9em;line-height: 1.5em; margin-bottom:1.5em }

.itemwrap h2 {margin:0px; padding:0px;}

.item p {margin:10px 0px 0px 0px; padding:0px 0px 10px 0px;}
.item p a {margin:0px; padding:0px;}
.item p a.btn { padding:4px 12px }

.vidoverlay { position: absolute;top: 0;width: 100%;height: 150px; background-color: rgba(0,0,0,0)}

.bottomfade {position: absolute; bottom: 0;width: 100%;height: 30px;
             
background: -moz-linear-gradient(top,  rgba(253,253,253,0), rgba(253,253,253,1)); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(253,253,253,0)), color-stop(100%,rgba(253,253,253,1))); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top,  rgba(255,155,255,0) 0%,rgba(253,253,253,1) 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top,  rgba(253,253,253,0) 0%,rgba(253,253,253,1) 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top,  rgba(253,253,253,0) 0%,rgba(253,253,253,1) 100%); /* IE10+ */
background: linear-gradient(to bottom,  rgba(253,253,253,0) 0%,rgba(253,253,253,1) 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#00ffffff',GradientType=0 ); /* IE6-9 */


             }


#grid .itemholder.reverse .item { 
	background-color: inherit;
}

#grid .item .altedit { position:absolute; top:0;}

#grid .itemholder.reverse .itemwrap {
    
    background-color: #2b2b2b;
    border-radius: 5px;
    color:  #fdfdfd;
    padding: 10px;
    width: auto;
    height: auto;
}

#grid .itemholder .meta { margin-right:45px}

#grid .item.reverse .bottomfade {
    background: inherit;
}


#grid .itemholder.nomore .viewmore {
    display: none;
}

#grid .itemholder.nometa .meta {
    display: none;
}

.item .avatar, .post-title-white .avatar {
    position:absolute; 
    right:5px;
}

#user-banner .avatar {
    position: relative;
    margin-left: -3px;
}

.avatar img {
    max-width: 50px;
    max-height: 50px;
}

#grid .item h3 { font-size: 1.3em; font-weight: bold;margin: 0;line-height: 1.3em; }
#grid .item p { margin:0 }

@media screen and (max-width:2500px ) {
    #grid .itemholder { width: 16.5%; }
    #grid .itemholder.doublewidth { width:33% }
    #grid.mapped .itemholder { width: 33.3%; }
    #grid.mapped .itemholder.doublewidth { width:33.3% }
}

@media screen and (max-width:1500px ) {
    #grid .itemholder { width: 25%; }
    #grid .itemholder.doublewidth { width:50% }
    #grid.mapped .itemholder { width: 50%; }
    #grid.mapped .itemholder.doublewidth { width:50% }

}

@media screen and (max-width:1200px ) {
    #grid .itemholder { width: 33.3%; }
    #grid .itemholder.doublewidth { width:66.6% }
    #grid.mapped .itemholder { width: 33.3%; }
    #grid.mapped .itemholder.doublewidth { width:66.6% }

}

@media screen and (max-width:900px ) {
    #grid .itemholder { width: 50%; }
    #grid .itemholder.doublewidth { width:100% }
    #grid.mapped .itemholder { width: 50%; }
    #grid.mapped .itemholder.doublewidth { width:100% }
    
}

@media screen and (max-width:600px ) {
    #grid .itemholder { width: 100%; height:auto }
    #grid .item { height:auto }
    #grid.mapped .itemholder { width: 100%; height:auto }
    #grid.mapped .item { height:auto }

}



.slideDown {
    background: #ccc;  
    height: auto;
    left: 50%;
    margin-left:-26%; 
    position: absolute;
    top: -500px;
    width: 50%;
	z-index:5000;
	
	border:#CCC 5px solid;
   
}

.slideClose {float:right; margin:10px 0px 0px 0px; padding:0px; cursor: pointer; }


.introText {background-color: #2b2b2b;
    color:  #fdfdfd;
    padding: 30px;}

.slideDown img {max-width:50%; max-height:133px;}

.closeMe { background-color:#CCC; color:#333; padding:10px 0px 10px 0px; text-indent:10px; display: inline-block; cursor:pointer}
.editMe { background-color:#CCC;display: inline-block;position: absolute;right: 0; padding-right:10px }

.likewrap { display:none }

@media only screen and (max-width : 480px) {

    .slideDown {
      display:none;
   
    }

    .selectedItem svg { display:none }
}

.bodyhtml { padding: 0 30px 0 30px }

.post-title-white { padding:0 30px 0 30px}

.post-title-white h2 { margin-top:0px}

.newsbox-wide p {
	font-size:1.1em;
    margin-bottom: 1em;
}


img.inline { display: block;clear: both;max-width:100%}

.importitem { width: 90%;padding: 10px;margin: 10px;border-bottom: 1px solid silver; float:left}

div.socialfooter { padding-bottom:20px }
div.socialfooter a { cursor:pointer }

 option.bold { font-weight: bold }

 .newsbox-wide .imgwrap { padding-left:30px}

 #searchform { display:none }
 #searchform input { margin-top: 3px;margin-left: 10px; width:300px}
 #searchform button { top: -3px; position: relative;}

.vote {
    padding: 0 30px;
    vertical-align: top;
    position: relative;
}

.vote label { display: inline }

.vote button {position: relative;top: -5px; left:5px }

.confirm { padding: 5px;background-color: yellow; font-size:110%}

.votesuccess {
    display: none;
}

.bodyhtml label { margin-top: 10px;}
.bodyhtml input[type="radio"], .bodyhtml input[type="checkbox"]  { margin-right: 5px; margin-top:-2px }