/* Farsight CSS */

html, body {

	font			: 12px/25px "Lucida Grande", "Lucida Sans Unicode", Helvetica, Arial, Verdana, sans-serif;
	-webkit-font-smoothing	: antialiased;
	background-color	: #3a3f44; /* gunmetal grey */
	top			: 0px;
	left			: 0px;
	text-rendering		: optimizeLegibility;
	font-size		: 100%;
	color			: black;
}

html, body, #container {
	height			: 100%;
}

body > #container {
	height			: auto;
	min-height		: 100%;
	background-color	: white;
	margin-left		: 10px;
	margin-right		: 10px;
	/* also update #footer border-(left|right) */
}

article {
	overflow		: auto;
	clear			: both;
	padding-bottom		: 20px;
}

#receptacle {
	/* fallback */
	padding-bottom		: 5.5em;
	/* - #footer margin-top */
	padding-bottom		: calc(4.5em + 18px);
	padding-top		: 10px;
	margin-top		: 5px;
	margin-bottom		: 5px;
}

#footer {
	clear			: both;
	position		: relative;
	z-index			: 10;
	/* fallback */
	margin-top		: -5.5em;
	/*
	 * From #footer div height+padding, with em units
         * scaled by .75 to match font-size, add the top
	 * border.  We also seem to need another 4px fudge.
         */
	margin-top		: calc(-4.5em - 18px);
	border-top		: 2px solid #3a3f44;

	/* also update body > #container margin-(left|right) */
	margin-left		: 10px;
	margin-right		: 10px;
}

#footer div {
	float			: left;
	/* The social media column is 77px wide, and we want about 30px
         * left and right margins, so available total width is:
         * 100% - 137px.  Since there are three columns with this width,
         * divide both by 3.
         */
	width			: 25%; /* fallback if needed */
	width			: calc(33% - 45px);

	font-size		: 75%;
	/* also update #footer margin-top */
	/* also update #receptacle padding-bottom */
	height			: 6em;
	padding-top		: 5px;
	padding-bottom		: 7px;
}

#footer div:first-child {
	padding-left		: 30px;
}

#footer div:last-child {
	width			: initial;
}

#footer div img {
	padding-right		: 3px;
	vertical-align		: middle;
}

html, body, div, p, input, select, pre {
	margin			: 0px;
	padding			: 0px;
}

select option[disabled]:first-child {
        display                 : none;
}

p, pre, .archivepage {
	margin-bottom		: 10px;
}
	
p {
	max-width		: 1000px;
}

pre, code {
	font			: 15px/18px Consolas, Monaco, "Lucida Console", monospace;
}

h1, h2, h3, h4 {
	color			: #426fa3;
	text-transform		: uppercase;
	margin			: 0px;
	margin-top		: 1em;
	margin-bottom		: 5px;
	padding			: 0px;
}

h5, h6 {
	margin			: 0px;
	margin-top		: 1em;
	margin-bottom		: 5px;
	padding			: 0px;
}

dt {
	font-weight		: bold;
}

dd {
	margin			: 5px;
	margin-left		: 10px;
}

img.left {
	float			: left;
	margin			: 0 10px 0 0;
	width			: 15%;
	max-width		: 300px;
}

img.right {
	float			: right;
	margin			: 0 0 0 10px;
	width			: 15%;
	max-width		: 300px;
}

ul.team, ul.team li {
	list-style		: none;
	list-style-image	: none;
}

ul.team li {
	text-align		: center;
	vertical-align		: top;
	display			: inline-block;
	margin-right		: 15px;
	margin-bottom		: 15px;
}

/* The background content wrapper */
#container > #receptacle > .content {
	overflow		: auto;
	margin-left		: 30px;
	margin-right		: 30px;
}

a {
	color			: #2020E0;
	text-decoration		: none;
}

a:hover {
	color			: #2020E0;
	text-decoration		: underline;
}

a:visited {
	color			: #4040C0;
	text-decoration		: none;
}

header div.logo {
	float			: left;
	margin			: 10px 0px 0px 20px;
}

header div.logo a {
	border-bottom		: none;
}

header div.logo a img {
        border                  : 0;
}

header div.slogan {
	color			: #426fa3;
	display			: inline;
	float			: right;
	margin			: 5px 20px 0px 0px;
}

header div.endheader {
	clear			: both;
}

img.country {
	width			: 14px;
	height			: 14px;
	border			: 1px solid black;
	max-width		: 14px;
}

.invisible {
	display			: none;
}

nav.menu {
	min-height		: 2em;
	margin			: 5px 50px 0px 0px;
	float			: right;
}

nav.menu ul {
	transition		: max-height 0.25s linear;
	text-align		: center; 
	padding-left		: 0;
	margin-top		: 0;
	margin-bottom		: 0;
}

nav.menu ul li {
	transition		: visibility .25s linear;
	display			: inline-block;
	padding			: 5px 5px 10px;
	vertical-align		: top;
	list-style		: none outside none;
}

nav.menu ul li a, nav.menu ul li span, nav.menu a {
	/* color			: #2020E0; */
	color			: #426fa3;
	font-weight		: bold;
	text-decoration		: none;
	text-shadow		: 0 1px 0 #fff;
	border-bottom		: none;
	text-transform		: uppercase;
	display			: block;
}

nav.menu ul li a:hover, nav a:hover {
	color			: #426fa3;
}

nav.menu > ul > li > a:only-child:hover, nav a:only-child:hover {
	color			: black;
}

nav.menu li > span:after {
	content			: '\25BC';
	font-size		: 66%;
}

nav.menu li > a:only-child:after {
	content			: '';
}

nav.menu ul ul {
	text-align		: left; 
	z-index			: 20;
	background-color	: white;
	box-shadow		: rgba(0, 0, 0, 0.1) 0px 8px 15px 0px;
	overflow		: visible;
	position		: absolute;
	display			: none;
}

nav.menu ul ul a:hover {
	color			: black;
}

nav.menu ul li:hover > ul {
	display			: block;
}

nav.menu ul ul li {
	/* float			: none; */
	display			: block;
	padding			: 1px 5px;
	position		: relative;
}

nav.menu ul ul a {
	font-weight		: normal;
	text-transform		: none;
	display			: inline-block;
}

nav.menu ul ul a:after {
	content			: ' \25B6';
	font-size		: 66%;
}

nav.menu ul ul a:only-child:after {
	content			: '';
}

nav.menu ul ul ul {
	top			: 0;
	display			: none;
}

nav.menu ul ul li:hover > ul {
	display			: inline-block;
}

#resources > li > a {
	width			: 70px;
}

#resources ul {
	/* above width + 2 * 5px li padding */
	left			: 80px;
}

#news-and-events > li > a {
	width			: 120px;
}

#news-and-events ul {
	/* above width + 2 * 5px li padding */
	left			: 130px;
}

h3#in-the-news-header {
	display			: inline;
	padding-right		: 10px;
}

#prev-next-year {
	display			: inline-block;
	font-size		: 75%;
	line-height		: 12px;
}

#prev-next-year div {
	display			: inline;
}


/* Small screens, eg mobile devices */
@media (max-width: 810px) {
	nav.menu {
		background-color: white;
	}

	nav.menu ul {
		max-height	: 0;
		text-align	: center; 
	}

	nav.menu li {
		visibility	: hidden;
		display		: block;
		border		: none;
	}

	nav.menu li:hover {
		background-color: #426fa3;
		color		: black;
	}

	nav.menu .navbar-handle {
		display		: block;
	}

	#navbar-checkbox:checked + .menu ul {
		max-height	: 100%;
	}

	#navbar-checkbox:checked + .menu li {
		visibility	: visible;
	}

	#navbar-checkbox:checked + .menu .navbar-handle,
	#navbar-checkbox:checked + .menu .navbar-handle:after,
	#navbar-checkbox:checked + .menu .navbar-handle:before {
		border-color	: #aaa;
		display		: none;
	}

	#container {
		margin-top	: 0px;
		margin-left	: 0px;
		margin-right	: 0px;
		margin-bottom	: 0px;
	}

	#container > #receptacle > .content {
		padding		: 0px;
		margin-left	: 0px;
		margin-right	: 0px;
		overflow	: initial;
	}

	body > #container {
		margin		: 0px;
	}

	#container > #receptacle {
		margin		: 0px;
		/* from margin top below */
		padding-bottom	: 22em;
		padding-bottom	: calc(18em + 52px);
	}

	#footer {
		/* fallback */
		margin-top	: -22em;
		/*
		 * From #footer div height+padding+border,
		 * times 4.
         	*/
		margin-top	: calc(-18em - 52px);

		border		: 0;
		background-color: white;
		margin-left	: 0;
		margin-right	: 0;
	}

	#footer div {
		border-top	: 1px solid #3a3f44;
		text-align	: center;
		float		: none;
		width		: 100%;
	}

	#footer div:nth-child(20n+1) {
		padding-left	: 0px;
	}
}

/* Printing support */
@media print {
	nav.menu, #navbar-checkbox, .navbar-handle {
		visibility	: hidden;
		display		: none;
	}

	h1, h2, h3, h4 {
		clear		: both;
	}

	#footer {
		border		: 0;
		background-color: white;
		height		: initial;
	}

	#footer div {
		border-top	: 1px solid #3a3f44;
		text-align	: center;
		float		: left;
		width		: 33%;
	}

	#footer div:nth-child(20n+1) {
		padding-left	: 0px;
	}

	#footer div:nth-child(20n+3) a {
		visibility	: hidden;
		display		: none;
	}

	#footer div:nth-child(20n+3):before {
		content		: "www.farsightsecurity.com";
		color		: #426fa3;
		border-bottom	: none;
	}

	a, a:visited {
		color		: #4040C0;
		border-bottom	: none;
	}
}

.navbar-checkbox {
	display			: none;
}

.navbar-handle {
	display			: none;
	cursor			: pointer;
	position		: relative;
	font-size		: 45px;
	padding			: .5em 0;
	height			: 0;
	width			: 1.6666666666666667em;
}

.navbar-handle:before,
.navbar-handle:after {
	position		: absolute;
	left			: 0;
	right			: 0;
	content			: ' ';
}

.navbar-handle, .navbar-handle:before, .navbar-handle:after {
	border-top		: 0.27em solid #426fa3;
}

.navbar-handle:before {
	top			: 0.37777777777777777em;
}
.navbar-handle:after {
	top			: 0.8888888888888888em;
}

nav.menu {
	top			: 0;
	left			: 0;
	right			: 0;
}

nav.menu .navbar-handle {
	position		: absolute;
	font-size		: 0.9em;
	top			: 0.6em;
	right			: 12px;
	z-index			: 10;
}

#fsiticker {
	border			: 3px dotted black;
	background-color	: #eeeeee;
	width			: 100%;
	text-align		: center;
	visibility		: hidden;
	font-family		: monospace;
}

.boxed {
	border			: 1px solid black;
	padding			: 20px;
	text-align		: center;
	background-color	: #426fa3;
	color			: white;
	margin-bottom		: 20px;
	margin-left		: 20px;
	margin-right		: 20px;
	margin-top		: 20px;
	clear			: both;
}

.centered {
	margin-left		: auto;
	margin-right		: auto;
}

.inlineblock {
	display			: inline-block;
	margin-left		: 0;
	margin-right		: 0;
}

table {
	border-spacing		: 0px;
}

div.withboxes {
	margin			: 10px;
}

table.withboxes {
	border-spacing		: 10px;
}

td {
	padding			: 2px;
}

td.nopad {
	padding			: 0px;
}

td.roundedboxed, div.roundedboxed {
	vertical-align		: top;
	border			: 5px solid #426fa3;
	border-radius		: 15px;
	padding			: 15px;
}

td>h4 {
	background-color	: #fafafa;
	margin			: 0px;
	padding			: 5px;
}

.author {
	display			: block;
}

.pagedate {
	margin-top		: 1em;
}

.inlineheader a:after {
	content			: "permalink";
	font-size		: 66%;
	font-weight		: normal;
	text-transform		: none;
	padding-left		: 1em;
}

.inlinefooter {
	padding-bottom		: 0em;
}

span.header {
	display			: block;
        margin                  : 0px;
        margin-top              : 1em;
        margin-bottom           : 5px;
        padding                 : 0px;
}

span.header a {
        color                   : #426fa3;
        text-transform          : uppercase;
	font-weight		: bold;
}

.like_td {
	display			: block;
}

.like_th {
	display			: block;
	font-weight		: bold;
}

.grant_form_part {
	display			: none;
}

.commercial_form_part {
	display			: none;
}

.submit_form_part {
	display			: none;
}

.grant_form_part_activator:checked ~ .grant_form_part,
.grant_form_part_activator:checked ~ .submit_form_part {
	display			: block;
}

.commercial_form_part_activator:checked ~ .commercial_form_part,
.commercial_form_part_activator:checked ~ .submit_form_part {
	display			: block;
}

.checklist td, .checklist th {
	text-align		: left;
	padding-left		: 1em;
}

#contact-form th {
	text-align		: left;
}

th.checklistnoindent {
	text-align		: left;
	padding-left		: 0;
}

.horizcheckbox {
	margin-left		: 1em;
}

.horizcheckbox .afterlabel {
	margin-left		: 0.5em;
}

.horizcheckbox input {
	margin-right		: 0.5em;
}

.bigbutton {
	font-size		: 1.5em;
}

.buttonlocation {
	text-align		: center;
}

#processing {
	border                  : 1px solid black;
	padding			: 20px;
	background-color	: #426fa3;
	color			: white;
	position		: fixed;
	top			: 50%;
	left			: 50%;
	transform		: translate(-50%, -50%);
	z-index			: 100;
	visibility		: hidden;
	outline			: 9999px solid rgba(0,0,0,0.5);
}

.ignore {
	display			: none;
}

.hidden {
	visibility		: hidden;
}

div.hidden {
	display			: inline-block;
}

#source_show_wrap2 {
	min-width		: 20em;
}

.required-error {
	border			: 1px solid red;
	border-radius: 5px;
}

div.required {
	display			: inline-block;
}

.required:after, .required-error:after {
	color: #f00;
	content: "* ";
}

/* highlight plugin */
pre.hl { color:#000000; background-color:#f5f5f5; margin-left:2em;}
.hl.num { color:#2928ff; }
.hl.esc { color:#ff00ff; }
.hl.str { color:#ff0000; }
.hl.dstr { color:#818100; }
.hl.slc { color:#838183; font-style:italic; }
.hl.com { color:#838183; font-style:italic; }
.hl.dir { color:#008200; }
.hl.sym { color:#000000; }
.hl.line { color:#555555; }
.hl.mark { background-color:#ffffbb; }
.hl.kwa { color:#000000; font-weight:bold; }
.hl.kwb { color:#830000; }
.hl.kwc { color:#000000; font-weight:bold; }
.hl.kwd { color:#010181; }