/*
 * jQuery FlexSlider v2.2.0
 * http://www.woothemes.com/flexslider/
 *
 * Copyright 2012 WooThemes
 * Free to use under the GPLv2 license.
 * http://www.gnu.org/licenses/gpl-2.0.html
 *
 * Contributing author: Tyler Smith (@mbmufffin)
 *
 * Changed by NetRelations
 */


/* =============================================================================
 * Browser resets
============================================================================= */
.flex-container a:active,
.slideshow a:active,
.flex-container a:focus,
.slideshow a:focus {
	outline:none;
}
.slides,
.flex-control-nav,
.flex-direction-nav {
	margin:0;
	padding:0;
	list-style:none;
}



/* =============================================================================
 * FlexSlider Necessary Styles
============================================================================= */


/* Hide the slides before the JS is loaded. Avoids image jumping
----------------------------------------------------------------------------- */
.slideshow .slides > li {
	display:none;
	-webkit-backface-visibility:hidden;
}
.slideshow .slides img {
	display:block;
	width:100%;
}


/* Slide dimensions and backgrounds
 * [1] Lower slides in IE < 9 because no MQ support
----------------------------------------------------------------------------- */
.slides > li {
	margin:0;
}

/*
 * Min-height on full-width slideshows
 */
.fullwidth .slides > li {
	min-height:500px;
	border-top-width:3px;
	border-top-style:solid;
	background-size:cover;
	background-repeat:no-repeat;

}
.slideshow--medium-height .slides > li,
.slideshow--medium-height .slides > li .text {
	min-height:400px;
	height:400px;

}
.slideshow--small-height .slides > li,
.slideshow--small-height .slides > li .text {
	min-height:300px;
	height:300px;

}
.slideshow--small-height .slides > li .text,
.slideshow--medium-height .slides > li .text {
	padding:20px 20px 20px;

}

.lt-ie9 .fullwidth .slides > li {
	min-height:400px; /* [1] */
}


/* Slide content
 * [1] Lower slides in IE < 9 because no MQ support
----------------------------------------------------------------------------- */
.slides .text {
	min-height:500px;
	width:370px;
	padding:60px 20px 20px;
	background-position:0 0, 0 100%;
	background-repeat:no-repeat;
	color:#fff;
}
.lt-ie9 .slides .text {
	min-height:400px; /* [1] */
}
.slides .text,
.slides .text > *:not(.button) {
	transition:all 400ms linear;
}
.slides h2 {
	margin-bottom:25px;
	color:#fff;
	font-size:50px;
	line-height:52px;
}
.slides h2 a,
.allrum .slides h2 a {
	color:inherit;
	text-decoration:none;
}
.slides h2 a:hover,
.slides h2 a:focus {
	text-decoration:underline;
}
.slides .intro {
	margin-bottom:30px;
	font-style:normal;
	font-size:18px;
	line-height:30px;
}
.slides .text .action-link {
	color:#fff;
}
.slides .text .action-link:after {
	background-position:-16px 0;
}


/* max-width:1400px
 * Make the slideshow lower
----------------------------------------------------------------------------- */
@media only screen and (max-width:1400px) {

	.fullwidth .slides > li,
	.slides .text {
		min-height:400px;
	}
	.slideshow--small-height .slides > li,
	.slideshow--small-height .slides > li .text {
		min-height:300px;
	}
	.slideshow--medium-height .slides > li,
	.slideshow--medium-height .slides > li .text {
		min-height:400px;
	}
	.slides .text {
		padding-top:20px;
	}
	.slides .intro {
		line-height:27px;
	}

} /* End media query */


/* max-width:780px
 * Reduce size of text and text container
----------------------------------------------------------------------------- */
@media only screen and (max-width:780px) {

	.slides .text {
		width:60%;
	}
	.slides h2 {
		margin-bottom:10px;
		font-size:36px;
		line-height:42px;
	}
	.slides .intro {
		margin-bottom:20px;
		font-size:16px;
		line-height:24px;
	}

} /* End media query */


/* max-width:520px
 * Let the text element cover the entire slide
 * [1] Make room for the direction navigation
----------------------------------------------------------------------------- */
@media only screen and (max-width:520px) {

	.slides .block-inner {
		padding:0;
	}
	.fullwidth .slides > li,
	.slides .text {
		min-height:250px;
	}
	.slides .text {
		width:auto;
		padding:10px 30px; /* [1] */
	}
	.slides h2 {
		font-size:26px;
		line-height:32px;
	}
	.slides .intro {
		margin-bottom:10px;
	}

	.slideshow--small-height .slides > li, .slideshow--small-height .slides > li .text {
		min-height:200px;
		height:200px;
	}

	.slideshow--medium-height .slides > li, .slideshow--medium-height .slides > li .text {
		min-height:250px;
		height:250px;
	}

} /* End media query */


/* Slide colour variations
 * [1] Temporary background-color that will be displayed until the background
 *     image is loaded (via JS).
 * [2] For browsers that don't handle rgba values.
 * [3] For browsers that handle rgba but not CSS gradients (such as IE9)
 * [4] Browsers that handle gradients and multiple background images.
 *     A linear gradient with the same start and end colours is placed on top
 *     of an image to make it look like the image has different colours.
----------------------------------------------------------------------------- */

/*
 * Green
 */
.slides .green {
	border-top-color:#93b479;
	background-color:rgba(147,180,121,0.6); /* [1] */
}
.slides .green .text {
	background-color:rgb(147,180,121); /* [2] */
	background-color:rgba(147,180,121,0.9); /* [3] */
}
#body:not(.ie) .slides .green .text {
	background-color:transparent;
	background-image:linear-gradient(rgba(147,180,121,0.9), rgba(147,180,121,0.9)),url(/gui/i/bear-teaser-bg.png); /* [4] */
}

/*
 * Brown
 */
.slides .brown {
	border-top-color:#a08571;
	background-color:rgba(160,133,113,0.6);
}
.slides .brown .text {
	background-color:rgb(160,133,113);
	background-color:rgba(160,133,113,0.9);
}
#body:not(.ie) .slides .brown .text {
	background-color:transparent;
	background-image:linear-gradient(rgba(160,133,113,0.9), rgba(160,133,113,0.9)),url(/gui/i/bear-teaser-bg.png);
}

/*
 * Blue
 */
.slides .blue {
	border-top-color:#679eb3;
	background-color:rgba(103,158,179,0.6);
}
.slides .blue .text {
	background-color:rgb(103,158,179);
	background-color:rgba(103,158,179,0.9);
}
#body:not(.ie) .slides .blue .text {
	background-color:transparent;
	background-image:linear-gradient(rgba(103,158,179,0.9), rgba(103,158,179,0.9)),url(/gui/i/bear-teaser-bg.png);
}

/*
 * Purple
 */
.slides .purple {
	border-top-color:#ba8d9c;
	background-color:rgba(186,141,156,0.6);
}
.slides .purple .text {
	background-color:rgb(186,141,156);
	background-color:rgba(186,141,156,0.9);
}
#body:not(.ie) .slides .purple .text {
	background-color:transparent;
	background-image:linear-gradient(rgba(186,141,156,0.9), rgba(186,141,156,0.9)),url(/gui/i/bear-teaser-bg.png);
}


/* No JS fallback
----------------------------------------------------------------------------- */
.no-js .slides > li:first-child {
	display:block;
}



/* =============================================================================
 * FlexSlider Theme
 * [1] Move the slideshow 3px upwards to cover the bottom border of the header
============================================================================= */
.slideshow {
	position:relative;
	background:#fff;
}
.slideshow.fullwidth {
	margin-top:-3px; /* [1] */
	margin-bottom:40px;
}
.flex-viewport {
	max-height:2000px;
	transition:all 1s ease;
}
.loading .flex-viewport {
	max-height:300px;
}


/* max-width:520px
 * Less margin
----------------------------------------------------------------------------- */
@media only screen and (max-width:520px) {

	.slideshow.fullwidth {
		margin-bottom:30px;
	}

} /* End media query */


/* Direction nav
----------------------------------------------------------------------------- */
.flex-direction-nav a {
	position:absolute;
	bottom:11px;
	z-index:10;
	width:16px;
	height:16px;
	background-image:url(/gui/i/circle-arrows.svg);
	text-decoration:none;
	text-indent:-9999px;
	opacity:0.8;
	cursor:pointer;
	transition:opacity 0.3s ease;
}
.lt-ie9 .flex-direction-nav a {
	background-image:url(/gui/i/circle-arrows.png);
}
.flex-direction-nav .flex-prev {
	left:20px;
}
.flex-direction-nav .flex-next {
	right:20px;
	background-position:-16px 0;
}
.slideshow .flex-direction-nav a:hover,
.slideshow .flex-direction-nav a:focus,
.slideshow:hover .flex-direction-nav a {
	opacity:1;
}
.flex-direction-nav .flex-disabled {
	opacity:0 !important;
	cursor:default;
}

/*
 * Fullwidth direction nav
 */
.fullwidth .flex-direction-nav a {
	top:50%;
	bottom:auto;
	width:50px;
	height:60px;
	overflow:hidden;
	margin:-30px 0 0;
	background-color:rgb(255,255,255);
	background-color:rgba(255,255,255,0.8);
	background-image:url(/gui/i/slider-arrows.svg);
	background-position:-80px 10px;
	background-repeat:no-repeat;
	color:rgb(0,0,0);
	color:rgba(0,0,0,0.8);
	text-shadow:1px 1px 0 rgba(255,255,255,0.3);
	opacity:0;
	transition:background-color opacity 0.3s ease;
}
.lt-ie9 .fullwidth .flex-direction-nav a {
	background-image:url(/gui/i/slider-arrows.png);
}
.fullwidth .flex-direction-nav .flex-prev {
	left:0;
}
.fullwidth .flex-direction-nav .flex-next {
	right:0;
	background-position:5px 10px;
}
.fullwidth .flex-direction-nav a:hover,
.fullwidth .flex-direction-nav a:focus,
.slideshow.fullwidth:hover .flex-prev,
.slideshow.fullwidth:hover .flex-next {
	background-color:rgb(255,255,255);
}


/* max-width:520px
 * Move control-nav below the slider
 * [1] Make the direction controls visible at all times
----------------------------------------------------------------------------- */
@media only screen and (max-width:520px) {

	.fullwidth .flex-direction-nav a {
		width:25px;
		height:30px;
		margin:-26px 0 0;
		background-color:rgb(255,255,255); /* [1] */
		background-position:-40px 50%;
		background-size:auto 20px;
		opacity:1; /* [1] */
	}
	.fullwidth .flex-direction-nav .flex-next {
		background-position:3px 50%;
	}


} /* End media query */


/* Control nav
----------------------------------------------------------------------------- */
.flex-control-nav {
	position:absolute;
	bottom:0;
	width:100%;
	background:rgb(147,180,120);
	background:rgba(147,180,120,0.6);
	line-height:40px;
	text-align:center;
}
.flex-control-nav li {
	display:inline-block;
	margin:0 5px;
}
.flex-control-paging li a {
	display:block;
	width:10px;
	height:10px;
	border:2px solid #fff;
	border-radius:50%;
	cursor:pointer;
}
.flex-control-paging li a:hover,
.flex-control-paging li a:focus {
	border-color:#4c4947;
	background:#93b478;
}
.flex-control-paging li a.flex-active {
	background:#fff;
	cursor:default;
}
.allrum .flex-control-nav {
	background-color:rgba(103, 158, 179);
	background-color:rgba(103, 158, 179, 0.6);
}

/*
 * Fullwidth control nav
 */
.fullwidth .flex-control-nav {
	bottom:20px;
	background:transparent;
	line-height:12px;
}
.fullwidth .flex-control-paging li a {
	width:12px;
	height:12px;
	border:none;
	background:#fff;
}
.lt-ie9 .fullwidth .flex-control-paging li a {
	border:2px solid #f5f4f3;
}
.fullwidth .flex-control-paging li a:hover,
.fullwidth .flex-control-paging li a:focus {
	background:#4c4947;
}
.fullwidth .flex-control-paging li a.flex-active {
	background:#93b478;
}
.allrum .fullwidth .flex-control-paging li a.flex-active {
	background-color:#679eb3;
}


/* max-width:520px
 * Move control-nav below the slider
----------------------------------------------------------------------------- */
@media only screen and (max-width:520px) {

	.fullwidth .flex-control-nav {
		position:static;
		padding-top:10px;
	}
	.fullwidth .flex-control-paging li a {
		background:#e4e3e2;
	}

} /* End media query */


/* print
 * Remove backgrounds when printing
----------------------------------------------------------------------------- */
@media print {


	/* Unfloat content and remove backgrounds
	----------------------------------------------------------------------------- */
	.slides > li {
		min-height:0 !important;
		background:transparent !important;
	}
	.fullwidth .slides > li {
		border-top-color:#000 !important;
	}
	.slides .block-inner {
		padding:0;
	}
	.slides .text {
		min-height:0;
		width:auto;
		padding-right:0;
		padding-left:0;
		background:transparent !important;
		color:inherit;
	}
	.slides h2 {
		color:inherit;
	}


	/* Hide flexslider controls and links
	----------------------------------------------------------------------------- */
	.flex-control-nav,
	.flex-direction-nav,
	.slides .text .action-link {
		display:none;
	}


} /* End media query */