
/*
project: yearoutgroup.org
author:james holmes
url:thirdfloordesign.co.uk
date created: 09/06/2015
*/


/* Smartphones (portrait and landscape) ----------- */
@media (max-width : 1024px) {
/* structure */

div#admin-bar {
	display: none;
}
div.header-content-wrapper {
	width: 100%;
	margin: 0 auto;
	height: auto;
}
a.logo {
	margin: 4% 0 2% 4%;
	background-size: 70%;
}
/* search styles */

#header #headerRight .searchBox {
	width: 92%;
	margin: 3% 4%;
}
#header #headerRight .searchBox .leftSearch {
	width: 75%;
}
#header #headerRight .searchBox .rightSearch {
	width: 25%;
}
#searchQ {
	width: 100%!important;
	padding: 1em;
}
.search-submit {
	width: 100%;
	height: 66px;
	background-size: 20%;
}
div.content-wrapper {
	width: 92%;
	margin: 0 4%;
}
/* mobile nav */

a#simple-menu {
	display: block!important;
	width: 32px;
	height: 38px;
	background-image: url(../imgs/menu-icon.png);
	background-repeat: repeat-x;
	background-size: 21px 19px;
	z-index: 10000;
	position: absolute;
	float: none;
	right: 4%;
	top: 10%;
}
a#simple-menu::after {
	content: "menu";
	font-size: 1em;
	font-weight: bold;
	color: #444;
	position: absolute;
	text-transform: uppercase;
	top: 25px;
}
/* slider */

#homeSlider {
	display: none;
}
div.nivo-caption {
	display: none !important;
}
/* tabbed content */
div#tab-container {
	margin-top: 0;
}
div#tab-container ul {
	margin: 0;
	padding: 0;
}
div#tab-container ul li {
	display: inline;
}
div#tab-container ul li a {
	display: inline-block;
	letter-spacing: 0.25em;
	text-align: center;
	width: 100%;
	background-color: #515151;
	padding: 1em 0;
}
div#tab-container ul li a:last-child {
	width: 100%;
}
div#tab-container ul li a span {
	position: relative;
	padding-left: 24px;
}
div#tab-container ul li a:hover, div#tab-container ul li a.active {
	background-color: #5FC6D6;
}
div#explore, div#learn, div#train, div#volunteer, div#work {
	height: auto;
	padding: 30px;
}
div.tab-detail h2 {
	width: 100%;
	float: none;
	font-size: 4em;
	margin-right: 0;
}
div.tab-detail p {
	width: 100%;
	float: nine;
	margin-right: 0;
}
div.tab-detail a {
	font-family: 'brandon_grotesquemedium';
	color: #FFF;
	display: inline-block;
	text-transform: uppercase;
	text-decoration: none;
	padding: 0.75em 1em;
	border: 1px solid #FFF;
	font-size: 1.7em;
	padding-right: 4em;
	position: relative;
}
div.tab-detail a:hover {
	background-color: #5FC6D6;
}
div.tab-detail a span::after {
	content: '\f054';
	font-family: FontAwesome;
	color: #FFF;
	position: absolute;
	right: 1em;
	top: 1em;
}
a.explore span::before {
	content: '\f024';
	font-family: FontAwesome;
	color: #FFF;
	position: absolute;
	left: 0;
	top: 3px;
}
a.learn span::before {
	content: '\f19d';
	font-family: FontAwesome;
	color: #FFF;
	position: absolute;
	left: 0;
	top: 3px;
}
a.train span::before {
	content: '\f135';
	font-family: FontAwesome;
	color: #FFF;
	position: absolute;
	left: 0;
	top: 3px;
}
a.volunteer span::before {
	content: '\f164';
	font-family: FontAwesome;
	color: #FFF;
	position: absolute;
	left: 0;
	top: 3px;
}
a.work span::before {
	content: '\f085';
	font-family: FontAwesome;
	color: #FFF;
	position: absolute;
	left: 0;
	top: 3px;
}
/* home page signposts */


div.signpost {
	width: 100%;
	height: auto;
	margin-right: 0;
	float: none;
	padding-bottom: 2em;
}
div.signpost-bg div.signpost:last-child {
	margin-right: 0;
}
div.signpost .inner {
	padding: 1.5em;
}
div.signpost-border-wrapper {
	width: 100%;
}
div.signpost-border {
	width: 100%;
	margin-right: 0;
	float: none;
}
div.signpost-border-wrapper div.signpost-border:last-child {
	margin-right: 0;
}
/* callout */

div.callout {
	width: auto;
	padding: 1.5em;
}
div.callout .left-col {
	width: 100%;
	float: none;
}
div.callout .right-col {
	width: 100%;
	float: none;
}
/* hide desktop menu */

#header #headerRight ul.menu {
	display: none;
}
.bottomSection {
	width: 92%;
	padding: 0 4%;
}
#homeSocial #fatBottomCol {
	padding: 0;
	width: 100%;
}
.news-title-bar {
	width: 100%;
	float: left;
	color: #FFF;
	margin-bottom: 2em;
}
.events-title-bar {
	width: 100%;
	float: right;
	color: #FFF;
	margin-bottom: 2em;
}
/* breadcrumb */

ul.breadcrumb {
	margin: 4%;
	float: left;
	width: 100%;
}
/* map */

div.map-wrapper {
	margin: 4% 0 8% 0;
}
div#imgmapdiv {
	display: none;
}
div.maptext {
	width: 100%;
	float: none;
}
/* footer */

#footerPadding {
	width: 100%;
	padding: 4% 0;
}
.MIFirstCol {
	width: 100%;
}
.MICol {
	width: 100%;
	margin-left: 0;
	border-left: none;
	padding-left: 0;
}
.MIendCol {
	margin-left: 0;
	border-left: none;
	padding-left: 0;
	width: 100%;
}
div.header-btns {
	width: 85%;
	margin: 0 auto;
	position: static;
}
div#imgmapdiv2 {
	display: none;
}
}

/* iPads (portrait) ----------- */
@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) and (orientation : portrait) {
div.nivo-caption {
	display: none !important;
}
div#admin-bar {
	display: none;
}
div.header-content-wrapper {
	width: 100%;
	margin: 0 auto;
	height: auto;
}
a.logo {
	margin: 4% 0 2% 4%;
	background-size: 70%;
}
/* search styles */

#header #headerRight .searchBox {
	width: 92%;
	margin: 3% 4%;
}
#header #headerRight .searchBox .leftSearch {
	width: 75%;
}
#header #headerRight .searchBox .rightSearch {
	width: 25%;
}
#searchQ {
	width: 100%!important;
	padding: 1em;
}
.search-submit {
	width: 100%;
	height: 66px;
	background-size: 20%;
}
div.content-wrapper {
	width: 92%;
	margin: 0 4%;
}
/* mobile nav */

a#simple-menu {
	display: block!important;
	width: 32px;
	height: 38px;
	background-image: url(../imgs/menu-icon.png);
	background-repeat: repeat-x;
	background-size: 21px 19px;
	z-index: 10000;
	position: absolute;
	float: none;
	right: 4%;
	top: 10%;
}
a#simple-menu::after {
	content: "menu";
	font-size: 1em;
	font-weight: bold;
	color: #444;
	position: absolute;
	text-transform: uppercase;
	top: 25px;
}
/* slider */

#homeSlider {
	display: none;
}
div.nivo-caption {
	display: none !important;
}
/* tabbed content */
div#tab-container {
	margin-top: 0;
}
div#tab-container ul {
	margin: 0;
	padding: 0;
}
div#tab-container ul li {
	display: inline;
}
div#tab-container ul li a {
	display: inline-block;
	letter-spacing: 0.25em;
	text-align: center;
	width: 100%;
	background-color: #515151;
	padding: 1em 0;
}
div#tab-container ul li a:last-child {
	width: 100%;
}
div#tab-container ul li a span {
	position: relative;
	padding-left: 24px;
}
div#tab-container ul li a:hover, div#tab-container ul li a.active {
	background-color: #5FC6D6;
}
div#explore, div#learn, div#train, div#volunteer, div#work {
	height: auto;
	padding: 30px;
}
div.tab-detail h2 {
	width: 100%;
	float: none;
	font-size: 4em;
	margin-right: 0;
}
div.tab-detail p {
	width: 100%;
	float: nine;
	margin-right: 0;
}
div.tab-detail a {
	font-family: 'brandon_grotesquemedium';
	color: #FFF;
	display: inline-block;
	text-transform: uppercase;
	text-decoration: none;
	padding: 0.75em 1em;
	border: 1px solid #FFF;
	font-size: 1.7em;
	padding-right: 4em;
	position: relative;
}
div.tab-detail a:hover {
	background-color: #5FC6D6;
}
div.tab-detail a span::after {
	content: '\f054';
	font-family: FontAwesome;
	color: #FFF;
	position: absolute;
	right: 1em;
	top: 1em;
}
a.explore span::before {
	content: '\f024';
	font-family: FontAwesome;
	color: #FFF;
	position: absolute;
	left: 0;
	top: 3px;
}
a.learn span::before {
	content: '\f19d';
	font-family: FontAwesome;
	color: #FFF;
	position: absolute;
	left: 0;
	top: 3px;
}
a.train span::before {
	content: '\f135';
	font-family: FontAwesome;
	color: #FFF;
	position: absolute;
	left: 0;
	top: 3px;
}
a.volunteer span::before {
	content: '\f164';
	font-family: FontAwesome;
	color: #FFF;
	position: absolute;
	left: 0;
	top: 3px;
}
a.work span::before {
	content: '\f085';
	font-family: FontAwesome;
	color: #FFF;
	position: absolute;
	left: 0;
	top: 3px;
}
/* home page signposts */


div.signpost {
	width: 100%;
	height: auto;
	margin-right: 0;
	float: none;
	padding-bottom: 2em;
}
div.signpost-bg div.signpost:last-child {
	margin-right: 0;
}
div.signpost .inner {
	padding: 1.5em;
}
div.signpost-border-wrapper {
	width: 100%;
}
div.signpost-border {
	width: 100%;
	margin-right: 0;
	float: none;
}
div.signpost-border-wrapper div.signpost-border:last-child {
	margin-right: 0;
}
/* callout */

div.callout {
	width: auto;
	padding: 1.5em;
}
div.callout .left-col {
	width: 100%;
	float: none;
}
div.callout .right-col {
	width: 100%;
	float: none;
}
/* hide desktop menu */

#header #headerRight ul.menu {
	display: none;
}
.bottomSection {
	width: 92%;
	padding: 0 4%;
}
#homeSocial #fatBottomCol {
	padding: 0;
	width: 100%;
}
.news-title-bar {
	width: 100%;
	float: left;
	color: #FFF;
	margin-bottom: 2em;
}
.events-title-bar {
	width: 100%;
	float: right;
	color: #FFF;
	margin-bottom: 2em;
}
/* breadcrumb */

ul.breadcrumb {
	margin: 4%;
	float: left;
	width: 100%;
}
/* map */

div.map-wrapper {
	margin: 4% 0 8% 0;
}
div#imgmapdiv {
	display: none;
}
div.maptext {
	width: 100%;
	float: none;
}
/* footer */

#footerPadding {
	width: 100%;
	padding: 4% 0;
}
.MIFirstCol {
	width: 100%;
}
.MICol {
	width: 100%;
	margin-left: 0;
	border-left: none;
	padding-left: 0;
}
.MIendCol {
	margin-left: 0;
	border-left: none;
	padding-left: 0;
	width: 100%;
}
div.header-btns {
	width: 85%;
	margin: 0 auto;
	position: static;
}
div#imgmapdiv2 {
	display: none;
}
}

/* NEW STYLES - HARRY - 16/10/2015 */
@media (max-width:600px){
	#centreContent #AZlinkBox {
	    width: 100%;
	    padding: 27px 0px 0 0px;
	    height: auto;
	    background: url(/imgs/site/azbg.png) 0px 0px;
	}
	#boxLinks {
		float:none;
		width:250px;
		margin:auto;
	}
	#boxLinks a {
		margin-right:10px;
		width:50px;
		line-height:50px;
		font-size:2.5em;
		margin-bottom:10px;
	}
	.vALink {
		width:250px;
		margin:auto;
		padding-bottom:5px;
	}
	#centreContent #extendedCenterCol {
		margin-left:0px;
	}
	#centreContent #extendedCenterCol .orgBox .obDetail {
		width:100%;
	}
}
