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

@import url('https://fonts.googleapis.com/css?family=Open+Sans');
@import url('https://fonts.googleapis.com/css?family=Fjalla+One');
	
* { -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; }

body,div,dl,dt,dd,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,p,blockquote,th,td {
  margin: 0;
  padding: 0;
}
html {
	/*background-color: #666;*/
	font-family: Open Sans, Arial, Helvetica, sans-serif;
}
body{
	color:#222;
	
}
body.dark{
	background:#03242d;
	color:#ddd;
}
.wrapper{
	display: grid;
	width:100%;
	max-width:960px;
	grid-template-rows: auto;
	grid-template-columns:291px 1fr;
	display: -ms-grid;
	-ms-grid-rows: auto;
	-ms-grid-columns:291px 1fr;
	justify-items:center;
	margin-left:auto;
	margin-right:auto;
}
.header{
	background:#000 url('../images/squall-banner.jpg') left top no-repeat;
	max-width:960px;
	min-height:123px;
	padding:110px 0 0 0;
	font-family: Open Sans, Arial, Helvetica, sans-serif;
	font-weight:800;
	font-size:14px;
	color:#fff;
	width:100%;
	position:relative;
}

/*	HEADER IMAGE WITH LOGO ON TOP */
	.header_background_image
	{
		position: relative;
		top: 0;
		left: 0;
		width:100%;
		height:auto;
		max-width:960px;
	}
	.header .logo{ /*header logo on all other pages*/
		position: absolute;
		top: 10px;
		left: 9px;
	}
	.header .logo img{
		width: 290px;
		height:auto;
	}
	.header_logo/* this is homepage only*/
	{
		position: absolute;
		top: 153px;
		left: 15px;

	}
	.header_text
	{
		position: absolute;
		top: 245px;
		left: 25px;
		z-index: 1;
		color: white;
		font-size: 15pt;
		line-height: 140%;
		/*-webkit-text-stroke: 2px black;*/
		/*text-shadow: 2px 2px 4px rgba(0, 0, 0, 1);*/
		text-shadow: -1px 1px 0 #000,
					  1px 1px 0 #000,
					  1px -1px 0 #000,
					 -1px -1px 0 #000;
		/*background-color: rgba(0,0,0,.5);*/			 
	}
#carousel-container{
	margin-top:-80px;
}
.header{
	grid-column-start: 1;
	  grid-column-end: 3;
	  grid-row-start:1;
	  grid-row-end:1;
	  -ms-grid-column: 1;
	  -ms-grid-column-span: 2;
	  -ms-grid-row:1;
	  -ms-grid-row-span:1;
}
.home .header{
	padding:0;
	padding-bottom:80px;
}
.f .header{
	background:#000 url('../images/squall-banner_f.jpg') left top no-repeat;
}
.fc .header{
	background:#000 url('../images/squall-banner_fc.jpg') left top no-repeat;
}
.uu .header{
	background:#000 url('../images/squall-banner_uu.jpg') left top no-repeat;
}
.sii .header{
	background:#000 url('../images/squall-banner_sii.jpg') left top no-repeat;
}
.r .header{
	background:#000 url('../images/squall-banner_r.jpg') left top no-repeat;
}
.header .necessity{
	padding-left:16px;
	padding-bottom:4px;
}
.header .menu-button {
    display:none;
}
.necessity{
    display: inline-block;
	vertical-align:middle;
}
.search-container{
	position: relative;
	height: 45px;
	background-color: #000;
	display:inline-block;
	padding-left:16px;
	vertical-align:middle;
	padding-top:5px;
}
.nav .search-container{
	display:none;
}
.header .search-container{
	display:inline-block;
}
#searchsquall{
	height:30px;
	width:200px;
	border-radius:3px;
	background:#eee;
	border:none;
	box-shadow: inset 3px 2px 5px 0px rgba(50, 50, 50, 0.7);
	padding-left:10px;
}
.search-button{
	width: 30px;
	height: 30px;
	color: #666;
	background:#666 url('../images/search.png') center center no-repeat;
	background-size:20px;
	border:none;
	display:inline-block;
	vertical-align:middle;
	margin-left:5px;
	border-radius:3px;
}
.nav{
	/*
	width:291px;
	padding:18px;
	margin:18px;
	margin-left:0;
	float:left;
	border-right:1px solid #c4c4c4;
	padding-top:0;*/
	grid-column-start: 1;
	  grid-column-end: 1;
	  grid-row-start:2;
	  grid-row-end:5;
	  -ms-grid-column: 1;
	  -ms-grid-column-span: 1;
	  -ms-grid-row:2;
	  -ms-grid-row-span:5;
	  padding:18px;
	margin:18px;
	margin-left:0;
	border-right:1px solid #c4c4c4;
	padding-top:0;
}
.nav ul{
	list-style:none;
	padding:0;
}
.lights.on, .dark .lights.off{
	display:none;
}
.dark .lights.on{
	display:inline;
}
.twitter-timeline{
	min-height: 200px;
	border: 1px solid #c4c4c4 !important;
}
.twit.d, .dark .twit.l{
	display:none;
}
.dark .twit.d, .twit.l{
	display:block;
}
.socials{
    padding-top:10px;
    text-align:center;
    margin-left:-10px;
}
.socials a{
    padding:10px;
}
#notes {
   	font-size: 0.8em;
	line-height: 90%;
/*	margin-left: 15px; */
	margin-bottom: 20px;

}
a, .style2 {
/*	color: #FF3300;  */
	color: #205aa4;
	text-decoration: none;
	font-weight: 800;
}

/* mouse over link */
a:hover {
/*  color: #FFAFA2;   */
	color: #8dbffe;
	text-decoration: none;
}	
.nav a, .dark .nav a {
	color: #FF3300;
}
.nav a:hover, .dark .nav a:hover {
	color: #FFAFA2;
}
.dark a, .dark .style2 {
	color: #8dbffe;
	text-decoration: none;
	font-weight: 800;
}
.dark a:hover {
/*  color: #FFAFA2;   */
	color: #8dffff;
	text-decoration: none;
}


.article{
	background:#ffffff;
	max-width:650px;
	padding:20px;
	margin:18px 0;
	padding-top:0;
	grid-column-start: 2;
	  grid-column-end: 2;
	  grid-row-start:2;
	  grid-row-end:5;
	  -ms-grid-column: 2;
	  -ms-grid-column-span: 1;
	  -ms-grid-row:2;
	  -ms-grid-row-span:5;
}
.dark .article{
	background:#03242d;
}

p, ul, ol, td {
	padding-top:7px;
	padding-bottom:7px;
	font-size: 0.88em;
	line-height:160%;
}
p + ul {
    margin-top: -1px;
}
p.style2{padding-bottom:0;}
h6, h4{
	padding-top:5px;
	padding-bottom:5px;
}

/* FORMATTING FOR ARTICLES */
/* date of publication */
.style3 {
	border-bottom: 0.02px solid lightgrey;
	border-top: 0.02px solid lightgrey;
	font-size: 0.72em;
	margin-bottom: 5px
}
/* photo caption */
.style4 {
	font-size: 0.7em;
	line-height:130%;
}
/* subhead - first paragraph */
.style5 {
	font-size: 0.94em;
	font-weight:bold;
	line-height:160%;
}
/* article strapline */
.style6 {
	/*padding-top:5px;*/
	padding-bottom:15px;
	font-size: 1.1em;
	/*font-weight:bold;*/
	line-height:160%;
    font-family: 'Fjalla One', sans-serif;
}

/* blurb strapline */
.style8 {
	font-size: 1.3em;
	font-family: 'Fjalla One', sans-serif;
	line-height:150%;
	font-weight: bold;
	padding-bottom:5px;
	/*padding-top:5px;*/
}
/* Med-Small font for secondary/ancilliary menuing */
.style7 {
	font-size: 0.72em;
	line-height:160%;
}

/* article pre-category */
.style9 {
	border-bottom: 0.5px solid black;
	font-weight: bold;
	font-size: 1em;
	font-family: "Palatino Linotype", Palatino, serif;
	margin-bottom: 20px;
	/*padding-left: 10px;*/

}

/* FORMATTING FOR SQ&A */
.questions {
	margin-top: 10px;
	color: #A0000B;
}

.answers {
	margin-left: 20px;
}

blockquote-sqa { 
	display: block;
	margin: 12px 0px;
	padding: 8px 40px;
	font-size: 1.2em;
	font-style: italic;
	line-height:150%;
	font-family: 'Fjalla One', sans-serif;
	background-color: #F4F4EE;
}

/* Indent Paragraph */
.tab30 { 
	margin-left: 30px;
 }
.tab60 { 
	margin-left: 60px;
 }

/* h styles */
h1 {
	font-size: 1.9em;
	font-family: 'Fjalla One', sans-serif;
	/*letter-spacing: -1px; */
	/* font-weight: 900; */
	line-height:150%;
	padding-bottom:10px;
}
h2 {
    font-size: 1.5em;
    font-family: 'Fjalla One', sans-serif;
	/*letter-spacing: -1px;*/
	/*font-weight: 900;*/
	line-height:150%;
    padding-bottom:10px;
    padding-top:5px;
}
h3 { 
	font-size: 1.3em;
    font-family: 'Fjalla One', sans-serif;
	line-height:150%;
	padding-bottom:5px;
    padding-top:5px;
}

h4 { 
	font-size: 1.2em;
	font-family: 'Fjalla One', sans-serif;
	line-height:150%;
	padding-bottom:5px;
	padding-top:5px;
}

h5 {  font-size: 0.7em;
}

h6 {  font-size: 0.7em;
}

/* -- PHOTO PLUS CAPTION -- */

.imageHolder {
	float:right;
	margin: 0px 0px 10px 15px;
	display: inline-table;
	border: 1px solid gray;
	box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.2), 0 3px 10px 0 rgba(0, 0, 0, 0.19);
}
.imageHolder img{
	display:block;
}

.imageHolder .caption {
	font-size: 0.7em;
	text-align:left;
	padding: 7px;
	line-height:150%;
	caption-side: bottom;
	background-color: #FFF;
	border: 1px solid gray;
	/*box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.2), 0 3px 10px 0 rgba(0, 0, 0, 0.19);*/
}

.imageHolder-full-width {
	/*float:right;*/
	margin: 0px 0px 20px 0px;
	display: block;
	border: 1px solid gray;
	box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.2), 0 3px 10px 0 rgba(0, 0, 0, 0.19);
}
.imageHolder-full-width img{
	display:block;
}

.imageHolder-full-width .caption {
	font-size: 0.7em;
	text-align:left;
	padding: 7px;
	line-height:150%;
	caption-side: bottom;
	background-color: #FFF;
	border: 1px solid gray;
	/*box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.2), 0 3px 10px 0 rgba(0, 0, 0, 0.19);*/
}


.imageHolderShadowBorder {
	float:right;
	margin-left:15px;
	margin-bottom: 5px;
	border:1px solid black;
	box-shadow:5px 5px 5px gray;
}
f
 .imageHolderShadowBorder .caption {
	font-size: 0.7em;
	text-align:center;
	margin-left:10px;
	line-height:130%;
	/*margin-bottom:5px;*/
} 

/* IMAGES USING 'FIGURE' */

/*
figure {
float: right;
display: block;
/*display: inline-table;*/
border: 1px solid gray;
margin: 0;
box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.2), 0 3px 10px 0 rgba(0, 0, 0, 0.19);
font-size: 0.7em;
line-height:130%;
} 

/*
figcaption {
display: table-caption;
caption-side: bottom;
font-size: 0.7em;
line-height:130%;

}
*/

/* BACK ISSUE LIST DIVS */

.backissue1 {
	border-bottom: 1px solid black;
	padding: 20px 20px;
	margin: 20px 0px;
}

.imageHolderIssue {
	float:right;
	margin-left:10px;
	border:1px solid black;
	box-shadow:5px 5px 5px grey;
}

 .imageHolderIssue .caption {
	font-size: 0.7em;
	text-align:center;
	margin-left:10px;
	/*margin-bottom:5px;*/
} 

.imageHolder160 {
	float:right;
	margin-left: 15px;
	margin-bottom: 10px;
	border:1px solid black;
	box-shadow:5px 5px 5px grey;
}


/* -- Horizontal Line -- */
hr {
border-top: 0.1px solid #C4C4C4;
}

/* BOX AND BLOCKQUOTE FORMATTING */

/* -- Block Quote -- */
blockquote { 
	display: block;
	margin-top: 0.7em;
	margin-bottom: 0.7em;
	margin-left: 40px;
	margin-right: 40px;
	font-size: 1.2em;
	line-height:150%;
	font-family: 'Fjalla One', sans-serif;
}

.textbox {
	width: 100%;
	border: 1px solid #C4C4C4;
	/*background-color:#F2F2F2;*/
	padding: 10px 25px 0px 25px;
	margin: 15px 0px 15px 0px;
	box-shadow: 5px 5px 3px #DBDBDB;
	float: left;
}

.textbox2 {
	width: 100%;
	border: 1px solid black;
	/*background-color:#F2F2F2;*/
	padding: 10px 25px 0px 25px;
	margin: 15px 0px 15px 0px;
	float: left;
}

.textbox3 {
	width: 100%;
	border-left: 1px solid #E8E8E8;
	border-top: 1px solid #E8E8E8;
	/*background-color:#F2F2F2;*/
	padding: 10px 12px;
	margin: 15px 0px;
	float: left;
}


/* FEATURE BOXES AT TOP OF /f/index.html */

.feature_box {
  width: 190px;
  border: 1px solid #000;
  /*background-color:#F2F2F2;*/
  padding: 10px 10px;
  margin: 15px 5px;
  box-shadow: 5px 5px 3px #DBDBDB;
  float: left;
  
}

.feature_box-image {
	max-height: 100%;
    max-width: 100%;
	

}

@media (min-width: 1001px){
	/* RESPONSIVE */
	.imageHolder .caption {
		 display: table-caption;
	 }
	.necessity{
		width: 680px;
	}
}
@media (max-width: 768px){
	.wrapper{
		display: grid;
		width:100%;
		max-width:100%;
		grid-template-rows: auto;
		grid-template-columns:1px 1fr;
		display: -ms-grid;
		-ms-grid-rows: auto;
		-ms-grid-columns:1px 1fr;
		justify-items:center;
	}
	.header{
		grid-column-start: 2;
		grid-column-end: 2;
		grid-row-start:1;
		  grid-row-end:1;
		  -ms-grid-column: 2;
		  -ms-grid-column-span: 1;
		  -ms-grid-row:1;
		  -ms-grid-row-span:1;
	}
	.header .menu-button {
		position: absolute;
		bottom:13px;
		right: 10px;
		display: block;
		width: 33px;
		height: 21px;
		background-image: url(../images/menu.png);
		background-size: contain;
	}
	.header .menu-button.shown {
		background-image: url(../images/closemenu.png);
	}
	.necessity{
		line-height:40px;
		width: auto;
	}
	.search-container{
		position:relative;
		width: 100%;
		position: relative;
		height: 30px;
		background-color: #000;
		display:block;
		padding-left:16px;
	}
	@keyframes slide-menu {
	  0%   {width:0;}
	  50%  {width:80%;}
	  100% {width:90%}
	}
	@keyframes slide-menu-close {
	  0%   {width:90%;}
	  50%  {width:10%;}
	  100% {width:0}
	}
	.nav{
		position:absolute;
		display:none;
		width:90%;
		margin:0;
		top:146px;
		float:none;
		border-right:none;
		animation-name: slide-menu;
		animation-duration: 0.5s;
		overflow-x:hidden;
		z-index:2;
		background:#aaa;
		box-shadow: 3px 1px 5px 0px rgba(50, 50, 50, 0.7);
		border-top-right-radius:5px;
		border-bottom-right-radius:5px;
		margin-top:10px;
		grid-column-start: 2;
		grid-column-end: 2;
		grid-row-start:1;
		grid-row-end:2;
		-ms-grid-column: 2;
		-ms-grid-column-span: 1;
		-ms-grid-row:2;
		-ms-grid-row-span:1;
	}
	.dark .nav{
		background:#666;
	}
	.nav.shown{
		display:block;
		width:90%;
	}
	.nav ul li{
		/*display:inline;*/
		padding-right:18px;
	}
	.twitter-timeline{
		display:none !important;
	}
	.article{
		margin:0;
		width:94%;
		/*max-width:94%;*/
		min-width:0;
		padding:3%;
		grid-column-start: 2;
	  grid-column-end: 2;
	  grid-row-start:3;
	  grid-row-end:3;
	  -ms-grid-column: 2;
	  -ms-grid-column-span: 1;
	  -ms-grid-row:3;
	  -ms-grid-row-span:1;
	}
	.imageHolder {
		float:none;
		margin-left:0;
		display: block;
		border: none;
		box-shadow: none;
	}
	.imageHolder img{
		display:block;
		width:100%;
		height:auto;
	}
	.header .search-container, #carousel{
		display:none;
	}
	.nav .search-container{
		display:block;
		background:none;
		padding-left:0;
		padding-top:10px;
		height:auto;
	}
	.header_logo {
		top: 143px;
	}
}
@media (max-width: 480px){
.nav{
		top:180px;
	}
	.home .nav{
		top:330px;
	}
}
/*old mobiles*/
@media (max-width: 320px){
	.header_logo {
		top: 133px;
		width:80%;
		height:auto;
	}
	.necessity {
		font-size:13px;
	}
}