/*
Template Name: Full Width
Description: Template designed for integration with Peoples Republic theme.
Author: i-Aspect
Version: 1.0
*/
/******************************************************************
Site Name: Peoples Republic
Author: i-Aspect

Stylesheet: Mixins & Constants Stylesheet
******************************************************************/
/*********************
CLEARFIXIN'
*********************/
.clearfix {
	zoom: 1;
}
.clearfix:before, .clearfix:after {
	content: "";
	display: table;
}
.clearfix:after {
	clear: both;
}

/*********************
TOOLS
*********************/
* {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}

/*********************
COLORS
*********************/
/*********************
TYPOGRAPHY
*********************/
/*
use the best ampersand
http://simplebits.com/notebook/2008/08/14/ampersands-2/
*/
span.amp {
	font-family: Baskerville,'Goudy Old Style',Palatino,'Book Antiqua',serif !important;
	font-style: italic;
}

.text-left {
	text-align: left;
}

.text-center {
	text-align: center;
}

.text-right {
	text-align: right;
}

.alert-help, .alert-info, .alert-error, .alert-success {
	margin: 10px;
	padding: 5px 18px;
	border: 1px solid;
}

.alert-help {
	border-color: #e8dc59;
	background: #ebe16f;
}

.alert-info {
	border-color: #bfe4f4;
	background: #d5edf8;
}

.alert-error {
	border-color: #f8cdce;
	background: #fbe3e4;
}

.alert-success {
	border-color: #deeaae;
	background: #e6efc2;
}

/*********************
BUTTONS
*********************/
.button, .button:visited {
	font-family: Arial, sans-serif;
	border: 1px solid #bd0000;
	border-top-color: #db0000;
	border-left-color: #db0000;
	padding: 4px 12px;
	color: white;
	display: inline-block;
	font-size: 11px;
	font-size: 1.1rem;
	font-weight: bold;
	text-decoration: none;
	text-shadow: 0 1px rgba(0, 0, 0, 0.5);
	cursor: pointer;
	margin-bottom: 20px;
	line-height: 21px;
	-webkit-border-radius: 4px;
	-moz-border-radius: 4px;
	-ms-border-radius: 4px;
	-o-border-radius: 4px;
	border-radius: 4px;
	background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #ff0000), color-stop(100%, #e60000));
	background-image: -webkit-linear-gradient(#ff0000, #e60000);
	background-image: -moz-linear-gradient(#ff0000, #e60000);
	background-image: -o-linear-gradient(#ff0000, #e60000);
	background-image: linear-gradient(#ff0000, #e60000);
}
.button.grey, .button:visited.grey {
	border: 1px solid #595959;
	border-top-color: dimgrey;
	border-left-color: dimgrey;
	background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #949494), color-stop(100%, #545454));
	background-image: -webkit-linear-gradient(#949494, #545454);
	background-image: -moz-linear-gradient(#949494, #545454);
	background-image: -o-linear-gradient(#949494, #545454);
	background-image: linear-gradient(#949494, #545454);
}
.button.grey:hover, .button.grey:focus, .button:visited.grey:hover, .button:visited.grey:focus {
	color: white;
	border: 1px solid #404040;
	border-top-color: #4f4f4f;
	border-left-color: #4f4f4f;
	background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #a1a1a1), color-stop(100%, #6e6e6e));
	background-image: -webkit-linear-gradient(#a1a1a1, #6e6e6e);
	background-image: -moz-linear-gradient(#a1a1a1, #6e6e6e);
	background-image: -o-linear-gradient(#a1a1a1, #6e6e6e);
	background-image: linear-gradient(#a1a1a1, #6e6e6e);
}
.button.grey:active, .button:visited.grey:active {
	background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #878787), color-stop(100%, #a1a1a1));
	background-image: -webkit-linear-gradient(#878787, #a1a1a1);
	background-image: -moz-linear-gradient(#878787, #a1a1a1);
	background-image: -o-linear-gradient(#878787, #a1a1a1);
	background-image: linear-gradient(#878787, #a1a1a1);
}
.button:hover, .button:focus, .button:visited:hover, .button:visited:focus {
	color: white;
	border: 1px solid #bd0000;
	border-top-color: #990000;
	border-left-color: #990000;
	background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #e60000), color-stop(100%, #cc0000));
	background-image: -webkit-linear-gradient(#e60000, #cc0000);
	background-image: -moz-linear-gradient(#e60000, #cc0000);
	background-image: -o-linear-gradient(#e60000, #cc0000);
	background-image: linear-gradient(#e60000, #cc0000);
}
.button:active, .button:visited:active {
	background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #e60000), color-stop(100%, #ff0000));
	background-image: -webkit-linear-gradient(#e60000, #ff0000);
	background-image: -moz-linear-gradient(#e60000, #ff0000);
	background-image: -o-linear-gradient(#e60000, #ff0000);
	background-image: linear-gradient(#e60000, #ff0000);
}

#content .slidebutton {
	font-size: 12px;
	font-size: 1.2rem;
	margin:-50px 0 0 18px;

}
#content .ts-fullwidth-link {
	font-size: 14px;
	font-size: 1.4rem;
}
#content .ts-fullwidth-desciption {
	font-size: 14px;
	font-size: 1.4rem;
}

#slide-container {
	width: 100%;
	background: black;
	position: relative;
}

.ts-fullwidth {
	width: 100%;
	max-width: 1400px;
	margin: 0 auto;
	height: 390px;
	text-shadow: 0px 1px 1px black;
	position: relative;
	background: black;
}

.ts-fullwidth-slide {
	background-size: cover;
	background-color: #ececec;
	background-position: center;
	list-style: none;
	margin: 0 auto !important;
	width: 100%;
	max-width: 1400px;
	height: 390px;
	position: absolute;
}

.ts-fullwidth-link {
	position: relative;
	display: block;
	width: 40%;
	color: white !important;
	text-decoration: none;
}
.ts-fullwidth-link:hover {
	text-decoration: none;
}
.ts-fullwidth-link .slidebutton {
	display: block;
	float: left;
	color: #2b2b2b;
	background:#ddd; /* for IE */	
	font-weight: bold;
	text-shadow: 0px 1px 1px #dadada;
	padding: 6px 22px;
	margin-top: 24px;
	-webkit-box-shadow: 0px 1px 3px black;
	-moz-box-shadow: 0px 1px 3px black;
	box-shadow: 0px 1px 3px black;
	background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #dfdfdf), color-stop(100%, #959595));
	background-image: -webkit-linear-gradient(#dfdfdf, #959595);
	background-image: -moz-linear-gradient(#dfdfdf, #959595);
	background-image: -o-linear-gradient(#dfdfdf, #959595);
	background-image: linear-gradient(#dfdfdf, #959595);
	-webkit-border-radius: 3px 3px;
	-moz-border-radius: 3px / 3px;
	border-radius: 3px / 3px;

}
.ts-fullwidth-link .slidebutton:hover {
	background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #ffffff), color-stop(100%, #959595));
	background-image: -webkit-linear-gradient(#ffffff, #959595);
	background-image: -moz-linear-gradient(#ffffff, #959595);
	background-image: -o-linear-gradient(#ffffff, #959595);
	background-image: linear-gradient(#ffffff, #959595);
}
.ts-fullwidth-link .slidebutton:active {
	background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #959595), color-stop(100%, #ffffff));
	background-image: -webkit-linear-gradient(#959595, #ffffff);
	background-image: -moz-linear-gradient(#959595, #ffffff);
	background-image: -o-linear-gradient(#959595, #ffffff);
	background-image: linear-gradient(#959595, #ffffff);
}

.ts-fullwidth-overlay {
	padding: 20px 20px 60px 20px;
	background: rgba(0, 0, 0, 0.5);
}
.ts-fullwidth-overlay .ts-fullwidth-title {
	color: inherit !important;
	font-size: 26px;
	font-size: 2.6rem;
	font-weight: normal;
	line-height: 24px !important;
	text-shadow: 0px 1px 1px black;
	margin: 0 0 14px !important;
}

.ts-fullwidth-description {
	color: inherit !important;
	line-height: 1.714285714;
	margin: 0 !important;
}

.slide-wrap {
	width: 100%;
	min-width: 1px;
	margin: 0 auto;
	text-align: center;
	line-height: 0;
	position: absolute;
	bottom: 0;
	z-index: 300;
}

#per-slide-template {
	display: inline-block;
	overflow: hidden;
	min-width: 1px;
	margin: 0 auto;
}
#per-slide-template a {
	float: left;
	color: white;
	font-size: 12px;
	font-size: 1.2rem;
	font-weight: bold;
	line-height: 1.5;
	text-decoration: none;
	text-shadow: 0px -1px 1px rgba(0, 0, 0, 0.7);
	padding: 15px 30px;
	margin-left: 1px;
	background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, rgba(58, 58, 58, 0.9)), color-stop(100%, rgba(27, 27, 27, 0.9)));
	background-image: -webkit-linear-gradient(rgba(58, 58, 58, 0.9), rgba(27, 27, 27, 0.9));
	background-image: -moz-linear-gradient(rgba(58, 58, 58, 0.9), rgba(27, 27, 27, 0.9));
	background-image: -o-linear-gradient(rgba(58, 58, 58, 0.9), rgba(27, 27, 27, 0.9));
	background-image: linear-gradient(rgba(58, 58, 58, 0.9), rgba(27, 27, 27, 0.9));
}
#per-slide-template a:hover {
	background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, rgba(70, 70, 70, 0.9)), color-stop(100%, rgba(27, 27, 27, 0.9)));
	background-image: -webkit-linear-gradient(rgba(70, 70, 70, 0.9), rgba(27, 27, 27, 0.9));
	background-image: -moz-linear-gradient(rgba(70, 70, 70, 0.9), rgba(27, 27, 27, 0.9));
	background-image: -o-linear-gradient(rgba(70, 70, 70, 0.9), rgba(27, 27, 27, 0.9));
	background-image: linear-gradient(rgba(70, 70, 70, 0.9), rgba(27, 27, 27, 0.9));
}
#per-slide-template a:active {
	background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, rgba(0, 0, 0, 0.9)), color-stop(100%, rgba(29, 29, 29, 0.9)));
	background-image: -webkit-linear-gradient(rgba(0, 0, 0, 0.9), rgba(29, 29, 29, 0.9));
	background-image: -moz-linear-gradient(rgba(0, 0, 0, 0.9), rgba(29, 29, 29, 0.9));
	background-image: -o-linear-gradient(rgba(0, 0, 0, 0.9), rgba(29, 29, 29, 0.9));
	background-image: linear-gradient(rgba(0, 0, 0, 0.9), rgba(29, 29, 29, 0.9));
}
#per-slide-template a:first-child {
	margin-left: 0;
}
#per-slide-template a.cycle-pager-active {
	color: #f78f20;
	background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, rgba(0, 0, 0, 0.9)), color-stop(100%, rgba(29, 29, 29, 0.9)));
	background-image: -webkit-linear-gradient(rgba(0, 0, 0, 0.9), rgba(29, 29, 29, 0.9));
	background-image: -moz-linear-gradient(rgba(0, 0, 0, 0.9), rgba(29, 29, 29, 0.9));
	background-image: -o-linear-gradient(rgba(0, 0, 0, 0.9), rgba(29, 29, 29, 0.9));
	background-image: linear-gradient(rgba(0, 0, 0, 0.9), rgba(29, 29, 29, 0.9));
}
#per-slide-template a.cycle-pager-active:hover {
	background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, rgba(0, 0, 0, 0.9)), color-stop(100%, rgba(40, 40, 40, 0.9)));
	background-image: -webkit-linear-gradient(rgba(0, 0, 0, 0.9), rgba(40, 40, 40, 0.9));
	background-image: -moz-linear-gradient(rgba(0, 0, 0, 0.9), rgba(40, 40, 40, 0.9));
	background-image: -o-linear-gradient(rgba(0, 0, 0, 0.9), rgba(40, 40, 40, 0.9));
	background-image: linear-gradient(rgba(0, 0, 0, 0.9), rgba(40, 40, 40, 0.9));
}
