/* @override 
	http://ufo.local/ufo/wp-content/themes/uforic-sos/css/uforic.css
	http://www.lostalone.com/ufo/wp-content/themes/uforic-sos/css/uforic.css
*/

/* 
\m/ LostAlone \m/
site design by @jake74
based on artwork by jim cork

colors 

green						#ccc
darker green /visted		#666

*/

html {
	
	background: #000 url(../images/sos/promo_desat.jpg) no-repeat center center;
	background-size: cover;
	background-attachment: fixed;
}

body {
	color: #f4f4f4;
	font: 62.5%/1.8em 'Roboto Condensed', "Helvetica Neue", Arial, Helvetica, Geneva, sans-serif;
	background: url(../images/sos/pattern.png) fixed;
}


img {
	display: block;
}

::-moz-selection { background: #ccc; color:#262626; text-shadow: none; }
::selection { background:#ccc; color:#262626; text-shadow: none; }

/* @group clearfix */

.clearfix:after {
	content: ".";
	display: block;
	clear: both;
	visibility: hidden;
	line-height: 0;
	height: 0;
}
 
.clearfix {
	display: inline-block;
}
 
html[xmlns] .clearfix {
	display: block;
}
 
* html .clearfix {
	height: 1%;
}

/* @end */

a {
	color: #1297d2;
	-webkit-transition: all .2s ease-in;
	-moz-transition: all .2s ease-in;
	-o-transition: all .2s ease-in;
    transition: all .1s ease-in;
}

a:visited {
	color: #666;
}

a:hover {
	color: #84e5f8;
}

h1, h2, h3 {
	font-weight: 700;
	text-rendering: optimizeLegibility;
	-webkit-font-smoothing: antialiased;
	margin-top: 0;
	margin-bottom: 0.5em;
}

h3 {
	color: #999;
}

.wrapper {
	width: 100%;
	font-size: 1.6em;
	padding-top: 20px;
	z-index: 20;
	position: relative;
	margin-left: 30px;
}

.wrapper > header {
	width: 178px;
	float: left;
	margin-right: 30px;
}

.centre {
	/*width: 474px;*/
	width: calc(100% - 640px);
	min-width: 410px;
	max-width: 800px;
	float: left;
	margin-right: 30px;
	padding-top: 57px;
	padding-bottom: 1em;
}

.centre img {
	width: 100%;
	height: auto;
}

aside {
	width: 306px;
	float: left;
	margin-top: 39px;
}

p {
	margin-top: 0;
}

hgroup h1 {
	margin-left: -10px;
}

hgroup h1 a {
	display: block;
	background-image: url(../svg/device.svg);
	background-size: contain;
	width: 180px;
	height: 180px;
	text-indent: -5000px;
	margin-bottom: 35px;
	margin-left: 10px;
}

hgroup h2 {
	display: none;
}

hr {
	border-bottom-style: none;
	border-right-style: none;
	border-left-style: none;
	border-top: 1px solid #666;
}

/* @group nav */

nav.menu-main-container {
	letter-spacing: -1px;
	font-size: 2em;
	font-weight: 700;
	text-rendering: optimizeLegibility;
	-webkit-font-smoothing: antialiased;
	line-height: 1.4em;
	text-transform: uppercase;
	padding-bottom: 1em;
}

nav.menu-main-container ul {
	margin: 0;
	padding: 0;
}

nav.menu-main-container li {
	list-style: none;
	margin-bottom: 0.2em;
}

nav.menu-main-container a {
	text-decoration: none;
	border-bottom: 1px solid transparent;
	line-height: 1em;
	display: block;
}

nav.menu-main-container a:hover {
	border-bottom: 1px solid #84e5f8;
}

nav.menu-main-container li.current-menu-item a,
nav.menu-main-container li.current-page-ancestor a {
	color: #fff;
}

/* @end */

/* @group article */

article header h1,
article header h2 {
	text-transform: uppercase;
	text-rendering: optimizeLegibility;
	-webkit-font-smoothing: antialiased;
	letter-spacing: -1px;
	line-height: 1em;
	font-size: 2em;
}

article header h2,
.centre h2 {
	color: #ccc;
}

article header h2 a {
	text-decoration: none;
}

.when-who {
	color: #999;
	margin-bottom: 2em;
}

article {
	margin-bottom: 1em;
	padding-bottom: 1em;
	border-bottom: 1px solid #666;
	line-height: 1.4em;
	font-size: 1.3em;
}

article.sticky footer,
article.sticky .when-who,
article.sticky .addthis_toolbox {
	display: none;
}

.centre nav {
	border-bottom: 1px solid #666;
	padding-bottom: 1em;
	padding-top: 1em;
	margin-bottom: 1em;
}

.centre > nav:first-of-type {
	display: none;
}

.centre nav:last-of-type {
	margin-top: -1em;
}

.centre nav a {
}

.centre nav a + a {
	float: right;
}

.addthis_toolbox {
	border-top: 1px solid #666;
	border-bottom: 1px solid #666;
	margin-bottom: 1em;
	padding-top: 10px;
	padding-bottom: 8px;
}

.addthis_toolbox a {
	-moz-transition: none;
    -webkit-transition: none;
    transition: none;
}

.youtube_sc {
	margin-bottom: 1em;
	padding-bottom: 0;
}

/* @end */

/* @group aside */

.wrapper > aside {
	padding-top: 19px;
}

aside ul {
	float: left;
	width: 100%;
	padding: 0 0 20px;
	margin: 0 0 20px;
}

aside ul.hl_recent_tweets {
	padding-bottom: 0;
}

aside ul > li {
	list-style: none;
	margin-bottom: 1em;
	word-wrap: break-word;
}

aside ul > li a {
	font-weight: normal;
	font-style: normal;
}

aside ul.xoxo li,
aside ul ul li {
	border-style: none;
	margin-bottom: 0;
}

aside ul:nth-of-type(2) {
	margin-right: 30px;
}

a img.mypictures {
	border-width: 1px;
	border-style: solid;
	margin-bottom: 1em;
}

ul > li select {
	width: 100%;
	margin-bottom: 1em;
}

aside h3 {
	clear: both;
}

/* @end */

/* @group footer */

.wrapper > footer {
	overflow: hidden;
	clear: both;
	border-top: 1px solid #666;
	padding-top: 1em;
	padding-bottom: 2mm;
}

.wrapper > footer ul {
	margin: 0 0 0 30px;
	padding: 0;
	width: 222px;
	float: left;
}

.wrapper > footer ul:first-of-type {
	margin-left: 0;
}

.wrapper > footer li {
	list-style: none;
}

footer label.screen-reader-text {
	display: none;
}

input#s {
	margin-bottom: 1em;
	color: #666;
	outline: none;
	border: 1px solid #666;
	background-color: #000;
	background-color: rgba(0,0,0,0.5);
	width: 218px;
	height: 23px;
}

input#s:focus {
	border: 1px solid #ccc;
	color: #ccc;
}

input#searchsubmit {
	background-color: #000;
	background-color: rgba(0,0,0,0.5);
	color: #666;
	border: 1px solid #666;
	text-transform: uppercase;
	float: right;
	padding-right: 20px;
	padding-left: 20px;
}

input#searchsubmit:hover {
	background-color: #ccc;
	color: #262626;
}


/* @end */

/* @group contact form */

.wpcf7 {
}

.wpcf7-form {
	background-color: #000;
	background-color: rgba(0,0,0,0.5);
	border: 1px solid #666;
	padding: 20px;
}

.wpcf7-form input[type *='text'],
.wpcf7-form textarea {
	color: #666;
	outline: none;
	border: 1px solid #666;
	background-color: #000;
	background-color: rgba(0,0,0,0.5);
	height: 23px;
	width: 99%;
}

.wpcf7-form textarea {
	height: 100px;
}

.wpcf7-form input[type *='text']:focus {
	border: 1px solid #ccc;
	color: #ccc;
}

.wpcf7-form input[type *='submit'] {
	background-color: #000;
	background-color: rgba(0,0,0,0.5);
	color: #666;
	border: 1px solid #666;
	font-family: proxima-nova-extra-condensed;
	text-transform: uppercase;
	float: right;
	padding-right: 20px;
	padding-left: 20px;
}

.wpcf7-form input[type *='submit']:hover {
	background-color: #ccc;
	color: #262626;
}
.wpcf7-form .wpcf7-validation-errors {
	border-color: #ccc;
}

.wpcf7-form .wpcf7-response-output {
	margin-right: 0;
	margin-left: 0;
	margin-bottom: 0;
	text-align: center;
}

.wpcf7-form span.wpcf7-not-valid-tip {
	width: 99%;
	top: -3px;
	left: 0;
	background-color: #000;
	height: 21px;
}

/* @end */

.banner {
	max-width: 808px;
	height: auto;
	margin-left: 210px;
	margin-right: 60px;
	margin-bottom: 10px;
	margin-top: 31px;
}

.banner a img,
.banner img {
	border: 1px solid #ccc;
	width: 100%;
	height: auto;
}

.banner a:hover img,
.banner img:hover {
	border-color: #fff;
}

ul.shop {
	margin: 0;
	padding: 0;
	overflow: hidden;
}

ul.shop p {
	font-size: 20px;
}

ul.shop li {
	text-decoration: none;
	float: left;
	display: block;
	position: relative;
	border-top: 1px solid #666;
	width: 213px;
}

ul.shop li:nth-of-type(2n) {
	margin-left: 48px;
}

ul.shop .frame {
	background: url(../images/merch_frame.png) no-repeat;
	width: 213px;
	height: 283px;
	display: block;
	position: absolute;
	top: 10px;
	left: 0;
}

.shop img {
	margin-top: 23px;
	margin-left: 11px;
}

.shop li select {
	width: 160px;
	float: left;
}

.shop em {
	font-weight: normal;
	font-style: normal;
	float: left;
	margin-right: 20px;
}

.shop input[type *='image'] {
	margin-left: 112px;
}

.shop form {
	
}

body.page-id-1230 .centre,
body.page-id-1456 .centre {
	margin-right: 0;
	width: 810px;
}

.leaflet-container {
	color: #262626;
	margin-bottom: 20px;
}

body.page-id-1230 .wpcf7,
body.page-id-1456 .wpcf7 {
	width: 405px;
	margin-bottom: 20px;
	overflow: hidden;
}

ul.social {
	background-color: #000;
	margin-bottom: 16px;
	overflow: hidden;
	height: 31px;
	display: block;
	padding: 10px;
	width: auto;
	border-radius: 14px;
}

ul.social li {
	display: block;
	width: 31px;
	height: 31px;
	margin-left: 11px;
	float: left;
	border-bottom-style: none;
	margin-bottom: 0;
}

ul.social li:first-of-type {
	margin-left: 0;
}

ul.social a {
	display: block;
	overflow: hidden;
	width: 31px;
	height: 0;
	padding-top: 31px;
	background: url(../images/social_icons.gif) no-repeat;
	
	-webkit-transition: none;
	-moz-transition: none;
	-o-transition: none;
	transition: none;
}

li.twi a {
	background-position: -295px 0;
}

li.twi a:hover {
	background-position: -295px -44px;
}

li.fac a {
	background-position: -66px 0;
}

li.fac a:hover {
	background-position: -66px -44px;
}

li.tum a {
	background-position: -231px 0;
}

li.tum a:hover {
	background-position: -231px -44px;
}

li.ins a {
	background-position: -263px 0;
}

li.ins a:hover {
	background-position: -263px -44px;
}

li.you a {
	background-position: 0 0;
}

li.you a:hover {
	background-position: 0 -44px;
}

li.mys a {
	background-position: -133px 0;
}

li.mys a:hover {
	background-position: -133px -44px;
}

li.fli a {
	background-position: -33px 0;
}

li.fli a:hover {
	background-position: -33px -44px;
}

li.ema a {
	background-position: -198px 0;
}

li.ema a:hover {
	background-position: -198px -44px;
}

.tour-poster {
	float: right;
	text-align: center;
	font-size: 36px;
}

.tour-poster img {
	margin-bottom: 30px;
}

.page-template-wide-page-php .wrapper {
	width: 1130px;
}

.wide .centre {
	width: 80%;
	margin-right: 0;
}

// launched