/* GOOGLE FONT */
@font-face {
	font-family: 'Raleway';
	font-style: normal;
	font-weight: 400;
	font-display: swap; /* avoid FOIT */
	src: local('Raleway'), local('Raleway-Regular'), url(https://fonts.gstatic.com/s/raleway/v12/1Ptug8zYS_SKggPNyC0IT4ttDfA.woff2) format('woff2'), url(https://fonts.gstatic.com/s/raleway/v11/cIFypx4yrWPDz3zOxk7hIQLUuEpTyoUstqEm5AMlJo4.woff) format('woff');
}
@font-face {
	font-family: 'Raleway';
	font-style: normal;
	font-weight: 700;
	font-display: swap; /* avoid FOIT */
	src: local('Raleway Bold'), local('Raleway-Bold'), url(https://fonts.gstatic.com/s/raleway/v12/1Ptrg8zYS_SKggPNwJYtWqZPANqczVs.woff2) format('woff2'), url(https://fonts.gstatic.com/s/raleway/v12/1Ptrg8zYS_SKggPNwJYtWqZPBg.woff) format('woff');
}

/*********************************************************************/
/******** RAHOITU STYLES ETC BELOW THIS LINE **************************/
/*********************************************************************/
/* GENERAL STYLING */
html { position: relative; min-height: 100%; }
body { background-color: #ecf0f4; font-family: 'Raleway', sans-serif; font-size: 16px; }
.shadow { box-shadow: 0px 2px 5px 0px rgba(50, 50, 50, 0.36); }
.corners { border-radius: 2px; }
.h1, .h2, .h3, .h4, .h5, .h6, h1, h2, h3, h4, h5, h6 { line-height: 1.5; text-transform: uppercase; }
p { color: #262b37; line-height: 1.8; }
li { line-height: 1.6; }
a, a:hover, a:visited, a:link { text-decoration: none; }
.btn { border-radius: 0; padding: 2px 12px; }
.btn-gold { color: white; background-color: #d5b85f; border-color: #d4b453; }
.btn-gold:hover { color: white; background-color: #d4b453; text-decoration: none; }
.btn-red { color: white; background-color: #f00; border-color: #e00; }
.btn-red:hover { color: white; background-color: #e00; text-decoration: none; }
.btn-black { color: white; background-color: black; border-color: black; }
.btn-black:hover { color: white; background-color: #222; text-decoration: none; }
.bg-gold { color: white; background-color: #d5b85f; }
.bg-darkblue { color: white !important; background-color: #262b37; }
.divider { background-color: #262b37; margin-left: auto; margin-right: auto; height: 1px; width: 100%; opacity: 0.2; }
.close, .close:hover { color: white; opacity: 1; }
.panel-group .panel+.panel { margin-top: 10px; }
.form-control { border-radius: 0; }
select { border-radius: 0; -webkit-appearance: none; appearance: none; }
.well { border-radius: 0; margin-bottom: 0; background: white; border: 0; box-shadow: 0px 2px 5px 0px rgba(50, 50, 50, 0.36); }

.nav-pills>li.active>a, .nav-pills>li.active>a:focus, .nav-pills>li.active>a:hover { background-color: black; }
.nav-pills a { color: black; }

/* GOLDEN STRIPE ABOVE THE HEADER */
#top_stripe { background: #d5b85f; /*height: 15px;*/ }

/* THE HEADER AND THE NAV */
#header { width: 100%; position: fixed; background: white; border-bottom: 1px solid #262b37; z-index: 500; top: 0; }
/*#header::after { content: ""; background: url("/img/xmax_top.jpg") no-repeat white; background-size: cover; background-position: left center; top: 0; left: 0; right: 0; bottom: 0; position: absolute; z-index: -1; opacity: 1; }*/
/*#header::after { content: ""; background: url("/img/header_background.jpg") no-repeat white; background-size: cover; background-position: left center; top: 0; left: 0; right: 0; bottom: 0; position: absolute; z-index: -1; opacity: 1; }*/

/* Right slide-in menu */
#right-menu { display: none; background: white; padding: 15px; right: 0; position: fixed; z-index: 500; }
#right-menu a, #right-menu a:link, #right-menu a:visited, #right-menu a:hover { color: black; border-radius: 0; margin-top: 5px; }
#right-menu .nav-stacked>li+li { margin-top: 5px; }
#right-menu .nav-pills>li.active>a, #right-menu .nav-pills>li.active>a:focus, #right-menu .nav-pills>li.active>a:hover { color: white; background-color: #d5b85f; border-radius: 0; }
#right-menu .fa { width: 16px; margin-right: 5px; } /* align text and add some spacing */

/* STYLES FOR THE FOOTER */
#footer { background-color: #262b37; margin-top: 20px; padding-top: 10px; width: 100%; color: white; }
#footer p { margin: 11px 0; line-height: 1.5; }
#footer a, #footer a:hover, #footer a:visited, #footer a:link { color: #d5b85f; }
#footer a:hover { text-decoration: underline; }

/* OFFER STYLES */
#filters { width: 100%; background-color: white; table-layout: fixed; margin-bottom: 15px; font-size: 11px; }
#filters tr { height: 50px; }
#filters td { cursor: pointer; text-align: center; vertical-align: middle; border-right: 1px solid #eee; }
#filters td:hover { background-color: #eee; }
.offer { background-color: white; margin-bottom: 30px; padding: 5px; }
.offer table { width: 100%; table-layout: fixed; }
.offer table tr { height: 100%; height: 50px; }
.offer table td { padding: 0 5px 0 5px; text-align: center; vertical-align: middle; /*border-right: 1px solid #eee;*/ }
#offers .accepted { background-color: #dfffdd !important; }
#offers small { font-size: 10px; }
.badge-flag { color: white; background: #7abcff; background: linear-gradient(to bottom, #7abcff 0%,#60abf8 16%,#4096ee 100%); padding: 3px; font-size: 10px; border-radius: 0px 200px 200px 0px; border: 0px solid #000000; }

/* SLIDERS */
.noUi-origin { background-color: white !important; }
.noUi-base { background-color: #d5b85f; }
.noUi-horizontal { height: 10px; border-radius: 0; }
.noUi-horizontal .noUi-handle { background: url('/img/slider_handle.jpg') #f3c17d no-repeat; border-radius: 20px; width: 30px; height: 30px; top: -10px; cursor: pointer; }
.noUi-handle:after { display: none; }
.noUi-handle:before { background-color: transparent; height: auto; width: auto; background: none; font-weight: bold; left: 9px; top: 4px; font-style: italic; }
.noUi-horizontal.noUi-extended { padding-right: 32px; }
.noUi-horizontal.noUi-extended .noUi-handle { left: -1px; }
.noUi-horizontal.noUi-extended .noUi-origin { right: -32px; }
.noUi-value-horizontal { margin-top: 3px; }

/* ARTICLES */
.article-well { margin-bottom: 10px; }
.article-well a { word-break: break-word; }
.article-well img { margin-bottom: 10px; }
.article-headline { font-weight: bold; margin-bottom: 10px; }
.article-separator { margin: 5px 0; }

/* MOBILE STYLING */
@media (max-width: 768px) {

	.slider-group { margin-bottom: 50px; }

	.badge-flag { color: white; background: #7abcff; background: linear-gradient(to bottom, #7abcff 0%,#60abf8 16%,#4096ee 100%); padding: 3px; font-size: 10px; border-top-left-radius: 90px; border-top-right-radius: 5px; border-bottom-right-radius: 5px; border-bottom-left-radius: 90px; }
	.offer { margin-bottom: 15px; }

	body { margin-top: 60px; }
	.divider { margin-top: 20px; margin-bottom: 20px; }

	/* THE HEADER AND THE NAV */
	#header { height: 60px !important; }
	#header table { height: 60px; }
	#header .scroll { display: block !important; }

	/* Right slide-in menu */
	#right-menu { width: 0; height: 100%; top: 60px !important; padding-top: 10px; }

	.article-well { padding: 10px; margin: 0 -7px 7px; }
	.article-form { margin-right: -10px; margin-left: -10px; }

}
/* SMALL MOBILE (e.g. iPhone 5/SE) */
@media (max-device-width: 320px) {

	/* decrease height of menu bullet points so whole menu will fit on screen */
	#right-menu { padding-top: 5px; padding-bottom: 5px; }
	#right-menu .nav > li > a { padding: 5px 15px; }

}

/* DESKTOP SPECIFIC STYLING */
@media (min-width: 769px) {

	.slider-group { margin-bottom: 70px; }

	body { margin-top: 85px; }
	.divider { margin-top: 40px; margin-bottom: 40px; }

	/* DECREASE MARGIN TO ALIGN HORIZONTALLY WITH PICTURE */
	.frontpage-headline { margin-top: -8px; }

	/* THE HEADER AND THE NAV */
	#header { height: 85px; }
	#header .scroll { display: none; }

	/* Right slide-in menu */
	#right-menu { width: 0px; height: 100%; }

}