@charset "UTF-8";

/*    
Theme Name: WebodyboardV2
Theme URI: http://www.sneakybadger.com/ 
Description: Webodyboard
Author: Jason Kempshall
Author URI: http://www.sneakybadger.com/ 
Version: 1.0 
*/  

@import url(font-awesome.min.css);
@import url("https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,400|Passion+One:400");


/* Reset */

	html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video {
		margin: 0;
		padding: 0;
		border: 0;
		font-size: 100%;
		font: inherit;
		vertical-align: baseline;
	}

	article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {
		display: block;
	}

	body {
		line-height: 1;
	}

	ol, ul {
		list-style: none;
	}

	blockquote, q {
		quotes: none;
	}

	blockquote:before, blockquote:after, q:before, q:after {
		content: '';
		content: none;
	}

	table {
		border-collapse: collapse;
		border-spacing: 0;
	}

	body {
		-webkit-text-size-adjust: none;
	}

/* Box Model */

	*, *:before, *:after {
		-moz-box-sizing: border-box;
		-webkit-box-sizing: border-box;
		box-sizing: border-box;
	}

/* Basic */

	@-ms-viewport {
		width: device-width;
	}

	body {
		-ms-overflow-style: scrollbar;
	}

	@media screen and (max-width: 480px) {

		html, body {
			min-width: 320px;
		}

	}

	body {
		background: #202024;
	}

		body.is-loading *, body.is-loading *:before, body.is-loading *:after {
			-moz-animation: none !important;
			-webkit-animation: none !important;
			-ms-animation: none !important;
			animation: none !important;
			-moz-transition: none !important;
			-webkit-transition: none !important;
			-ms-transition: none !important;
			transition: none !important;
		}

/* Type */
 
	body, input, select, textarea {
		color: rgba(255, 255, 255, 0.75);
		font-family: "Source Sans Pro", sans-serif;
		font-size: 14pt;
		font-weight: 300;
		line-height: 1.65;
	}

		@media screen and (max-width: 2200px) {

			body, input, select, textarea {
				font-size: 10.5pt;
			}

		}

		@media screen and (max-width: 1280px) {

			body, input, select, textarea {
				font-size: 10pt;
			}

		}
		
		
		@media screen and (max-width: 1175px) {

			body, input, select, textarea {
				font-size: 9.5pt;
			}

		}

       @media screen and (max-width: 1136px) {

			body, input, select, textarea {
				font-size: 10.5pt;
			}

		}
		

		@media screen and (max-width: 990px) {

			body, input, select, textarea {
				font-size: 9.5pt;
			}

		}
		
		
		@media screen and (max-width: 900px) {

			body, input, select, textarea {
				font-size: 11pt;
			}

		}
		

		@media screen and (max-width: 676px) {

			body, input, select, textarea {
				font-size: 10pt;
			}

		}
		
		@media screen and (max-width: 600px) {

			body, input, select, textarea {
				font-size: 8.5pt;
			}

		}

		@media screen and (max-width: 536px) {

			body, input, select, textarea {
				font-size: 12.0pt;
			}

		}

	a {
		-moz-transition: background-color 0.2s ease-in-out, color 0.2s ease-in-out;
		-webkit-transition: background-color 0.2s ease-in-out, color 0.2s ease-in-out;
		-ms-transition: background-color 0.2s ease-in-out, color 0.2s ease-in-out;
		transition: background-color 0.2s ease-in-out, color 0.2s ease-in-out;
		color: rgba(255, 255, 255, 0.75);
		text-decoration: none;
		
		outline: 0;
	}

		a:hover {
			color: #FFF;
			border: none;
		}

	strong, b {
		color: #fff;
		font-weight: 400;
	}

	em, i {
		font-style: italic;
	}

	p {
		margin: 0 0 2em 0;
	}

	h1, h2, h3, h4, h5, h6 {
		color: #fff;
		font-weight: 400;
		line-height: 1.5;
		margin: 0 0 1em 0;
	}

		h1 a, h2 a, h3 a, h4 a, h5 a, h6 a {
			color: inherit;
			text-decoration: none;
		}

	h2 {
		font-size: 1.75em;
	}

	h3 {
		font-size: 1.4em;
	}

	h4 {
		font-size: 1.0em;
	}

	h5 {
		font-size: 0.9em;
	}

	h6 {
		font-size: 0.7em;
	}

	sub {
		font-size: 0.8em;
		position: relative;
		top: 0.5em;
	}

	sup {
		font-size: 0.8em;
		position: relative;
		top: -0.5em;
	}

	blockquote {
		border-left: solid 4px rgba(144, 144, 144, 0.25);
		font-style: italic;
		margin: 0 0 2em 0;
		padding: 0.5em 0 0.5em 2em;
	}

	code {
		background: rgba(144, 144, 144, 0.075);
		border-radius: 4px;
		border: solid 1px rgba(144, 144, 144, 0.25);
		font-family: "Courier New", monospace;
		font-size: 0.9em;
		margin: 0 0.25em;
		padding: 0.25em 0.65em;
	}

	pre {
		-webkit-overflow-scrolling: touch;
		font-family: "Courier New", monospace;
		font-size: 0.9em;
		margin: 0 0 2em 0;
	}

		pre code {
			display: block;
			line-height: 1.75;
			padding: 1em 1.5em;
			overflow-x: auto;
		}

	hr {
		border: 0;
		border-bottom: solid 1px rgba(144, 144, 144, 0.25);
		margin: 2em 0;
	}

		hr.major {
			margin: 3em 0;
		}

	.align-left {
		text-align: left;
	}

	.align-center {
		text-align: center;
	}

	.align-right {
		text-align: right;
	}



/* Box */

	.thumbnails {
		display: -moz-flex;
		display: -webkit-flex;
		display: -ms-flex;
		display: flex;
		-moz-align-items: stretch;
		-webkit-align-items: stretch;
		-ms-align-items: stretch;
		align-items: stretch;
		-moz-justify-content: center;
		-webkit-justify-content: center;
		-ms-justify-content: center;
		justify-content: center;
		-moz-flex-wrap: wrap;
		-webkit-flex-wrap: wrap;
		-ms-flex-wrap: wrap;
		flex-wrap: wrap;
		
	}

		.thumbnails .box {
			margin: 0 1em 2em 1em;
			width: 25%;
		}

			@media screen and (max-width: 2200px) {

				.thumbnails .box {
					width: 22%;
				}

			}

			@media screen and (max-width: 1136px) {

				.thumbnails .box {
					width: 28%;
				}
				

			}
			
			@media screen and (max-width: 900px) {

				.thumbnails .box {
					width: 43%;
				}
				

			}			
				@media screen and (max-width: 536px) {

				.thumbnails .box {
					width: 100%;
				}
				
				}


/* Box */

	.box {
		border-radius: 4px;
		margin-bottom: 2em;
		background: #2c2c32;
		text-align: center;
	}

		.box > :last-child,
		.box > :last-child > :last-child,
		.box > :last-child > :last-child > :last-child {
			margin-bottom: 0;
			
		}

		.box .image.fit {
			margin: 0;
		}

		.box .image img {
			border-radius: 4px 4px 0 0;
		}

		.box .inner {
		margin: 0 0 1em 0;
			padding: 1.5em;
			height: 15em !important;
			width: 100% !important;
	
	
		}
		
		
		/* Stockalper */ 
		
			.box .inner2 {
		margin: 0 0 0em 0;
			padding: 0.5em 1em 1em 1em;
			height: 15em !important;
			width: 100% !important;
	
	
		}
		
		/* END Stockalper */ 
		


			@media screen and (max-width: 536px) {

				.box .inner {
					padding: 1em;
					height: 12em !important;
				}

			}

			@media screen and (max-width: 436px) {

				.box .inner {
					padding: 1em;
					height: 14em !important;
				}

			}

		.box.alt {
			border: 0;
			border-radius: 0;
			padding: 0;
		}
		
		.box h3 {
		margin: 0.6em 0em 0em 0em;
		display: inline-block;
	}
	
			.box p {
		margin: 0.5em 0em 0em 0em;
		
	}


.post-details{
		text-decoration: none;
		color: #999999 !important;
		display: inline-block;
		text-align: left;
		font-weight: 400;
 
 padding: 0em 0em 0em 0em;
 margin: 1em 0em 0em 1.5em;
 float: left;
 font-size: 0.75em;
 position:relative;
}



.post-details2 {
		text-decoration: none;
		color: #999999 !important;
		display: inline-block;
		font-weight: 400;
		white-space: nowrap;
        padding: 0 0.5em 0 2em;
        margin: 1em 1.2em 0em 0;
        font-size: 0.75em;
        float: right;
        position:relative;
}

.post-details2:after {
   position: absolute;
  font-family: 'FontAwesome';
  top: 0;
  left: 0.5em;
  content: "\f06e";

  
  }
  
  
/* inner post */ 

.innerheader {
   width: 100%;
  max-width: 1700px;
  padding: 0 3% 0 3%;
  margin: 0 auto 0 auto;
  position: relative;
  display: block;
  
}

@media screen and (max-width: 836px) {
.innerheader {
  font-size: 0.8em;
}
}

@media screen and (max-width: 536px) {
.innerheader {
  font-size: 0.6em;
}
}

@media screen and (max-width: 436px) {
.innerheader {
  font-size: 0.5em;
}
}

.innerheader img {
 float: left;
 width: 5em;
 height: 5em;
 margin: 0 0 1em 1em;
 position: relative;
 border-radius: 50%;
 border: 0;
 overflow: hidden;
  border: solid 3px transparent;
  background-image: linear-gradient(rgba(119, 201, 217, 1), rgba(236, 120, 142, 1)), linear-gradient(180deg, #77c9d9, #ec788e);
  background-origin: border-box;
  background-clip: content-box, border-box;
  box-shadow: 2px 1000px 1px #fff inset;
}




.headertext{
  width: 80%;
    position: relative;
    
  padding: 0em 0em 0em 0em;
  display:inline-block;
  margin: 0em 0em 1em 2em;

  
}

@media screen and (max-width: 536px) {
.headertext {
  margin: -0.3em 0em 1em 2em;
}
}


.innerheader h1 {
 margin: 0;
  float: left;
  font-size: 2.5em;
  padding: 0;
  clear: both;
}

.pub-date{
 font-size: 0.8em;
  color: #999999;
  margin: -0.1em 0em 0em 0em;
  padding: 0em;
  float: left;
  position: relative;
  border-bottom: 1px dotted;
  clear: both;
}

@media screen and (max-width: 536px) {
.pub-date {
  font-size: 1em;
}
}

.innerpost {
  width: 100%;
  max-width: 1700px;
  padding: 0 3% 0 3%;
  margin: 0 auto 0 auto;
  position: relative;
  display: block;
  clear: both;
  
}


.innerpost h1 {
  font-size: 1.3em;
  padding-top: 0em;
  margin: 1.5em 0em 0.5em 1.3em;
  position: relative;
  display: inline-block;
   border-bottom: 1px dotted; 
}

@media screen and (max-width: 736px) {
.innerpost h1 {
 margin: 1.5em 0.5em 0.7em 0.5em;
 font-size: 1em;
}
}

.innerpost p a {
  border-bottom: 1px dotted;
  
}

.innerpost p {
  font-size: 15px;
  margin: 0em 1.5em 1.3em 1.5em;
  max-width: 1000px;
  
}
@media screen and (max-width: 536px) {
.innerpost p {
  margin: 0em 0.5em 1.3em 0.5em;

 } 
}

.innerpost img{
  width: 100%;
  height: 100%;
  padding: 0 0 0 0;
  margin: 1.5em 0em 0em 0em;
  position: relative;
}

.innerpost a:hover img{
            -moz-transition: opacity 500ms ease;
			-webkit-transition: opacity 500ms ease;
			-ms-transition: opacity 500ms ease;
			transition: opacity 500ms ease;
 		
			color: #202024 !important;
			cursor: default;
			opacity: 0.75;

}




.innerpostvideo {
	position: relative;
	padding-bottom: 56.25%;
	padding-top: 0px;
	height: 0;
	margin: 1em 0em 0em 0em;
	overflow: hidden;
	
}
/***
* @author Brad Dalton - WP Sites
* @link http://wpsites.net/wordpress-tips/embed-videos-responsive/
***/
.innerpostvideo iframe,  
.innerpostvideo object,  
.innerpostvideo embed {
	position: absolute;
	padding: 2% 2% 2% 2%;
	border-radius: 15px;
	border: 0;
	background-color: #242424;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

@media screen and (max-width: 536px) {
.innerpostvideo iframe,  
.innerpostvideo object,  
.innerpostvideo embed {
	padding: 1% 1% 1% 1%;
}
}



.morefrom {
display: inline-block;
margin: 1.5em 0em 1em 1.5em;
width: 100%;
}

.morefrom p {
    color: #ffffff;
    margin: 0em 1em 0em 0em;
    display: inline-block;
	background-color: #d96b80; 
	border-radius: 5px;
	padding: 0.1em 0.8em 0.1em 0.5em;
	
}


.morefrom p:after {
  font-family: 'FontAwesome';
  content: "\f0a9";
  color: #ffffff;
  right: -0.4em;
  position: relative;
  }

.morefrom a {
	background-color: #333333; 
		border-radius: 8px;
		margin: 1em 1em 0em 0em;
		padding: 0.2em 0.6em 0.2em 0.6em;
		display: inline-block;
}

.morefrom a:hover {
	background-color: #73c9da; 
}


@media screen and (max-width: 536px) {
.morefrom {
 margin: 1em 0em 0.5em 0.5em;
 }
}

@media screen and (max-width: 536px) {
.morefrom p {
 font-size: 0.72em;
 }
}

@media screen and (max-width: 536px) {
.morefrom a {
 font-size: 0.72em;
 }
}	
	
/* Pagenumbers */


	.pn-wrap {
		margin-bottom: 2em;
		background: #none;
		text-align: center;
		width: 100%;
		float:left;
		display: inline-block;
	}


.navigation ul {
margin: 2.0em 0.0em 2.0em 0.0em;
}

		
.navigation li a,
.navigation li a:hover,
.navigation li.active a,
.navigation li.disabled {
	padding: 0;
	margin: 0;
	border: none;
	text-decoration: none;
	font-weight: normal;
	font-style: normal;
	list-style: none;
	text-transform: none;
	text-indent: 0px;
	font-variant: normal;
	text-align: left;
	line-height: 12px;
	letter-spacing: 0px;
	word-spacing: 0px;
}
 
.navigation li {
    display: inline;
 padding: 0.0em 0.0em 0.0em 0.0em;
 margin: 0.0em 0.0em 0.0em 0.0em;
}
 
.navigation li a,
.navigation li a:hover,
.navigation li.active a,
.navigation li.disabled {
   		-moz-appearance: none;
		-webkit-appearance: none;
		-ms-appearance: none;
		appearance: none;
		-moz-transition: background-color 0.2s ease-in-out, color 0.2s ease-in-out;
		-webkit-transition: background-color 0.2s ease-in-out, color 0.2s ease-in-out;
		-ms-transition: background-color 0.2s ease-in-out, color 0.2s ease-in-out;
		transition: background-color 0.2s ease-in-out, color 0.2s ease-in-out;
		background-color: #333333; 
		border-radius: 15px;
		border: 0;
		color: #999999 !important;
		cursor: pointer;
		display: inline-block;
		font-weight: 400;
		text-align: center;
		text-decoration: none;
		white-space: nowrap;
	    padding: 0.4em 0.5em 0.4em 0.5em;
	    margin: 0.0em 0.3em 0.0em 0.3em;
}
 
.navigation li a:hover,
.navigation li.active a {
    		-moz-appearance: none;
		-webkit-appearance: none;
		-ms-appearance: none;
		appearance: none;
		-moz-transition: background-color 0.2s ease-in-out, color 0.2s ease-in-out;
		-webkit-transition: background-color 0.2s ease-in-out, color 0.2s ease-in-out;
		-ms-transition: background-color 0.2s ease-in-out, color 0.2s ease-in-out;
		transition: background-color 0.2s ease-in-out, color 0.2s ease-in-out;
		background-color: #d96b80; 
		border-radius: 15px;
		border: 0;
		color: #ffffff !important;
		cursor: pointer;
		display: inline-block;
		font-weight: 400;
		text-align: center;
		text-decoration: none;
		white-space: nowrap;
		
}


			@media screen and (min-width: 700px) {

				.navigation li {
					font-size: 16px;
				}
		}


			@media screen and (max-width: 650px) {

				.navigation li {
					font-size: 14px;
				}
		}

			@media screen and (max-width: 550px) {

				.navigation li {
					font-size: 13px;
				}
		}
		
			@media screen and (max-width: 415px) {

				.navigation li {
					font-size: 10.5px;
				}
		}
		
					@media screen and (max-width: 380px) {

				.navigation ul {
					font-size: 10px;
				}
		}
		
		
					@media screen and (max-width: 650px) {

				.navigation ul {
					margin: 0.5em 0.0em 1.0em 0.0em;
				}
		}
		
			@media screen and (max-width: 415px) {

				.navigation ul {
					margin: 0.5em 0.0em 1.0em 0.0em;
				}
		}
		
					@media screen and (max-width: 380px) {

				.navigation ul {
					 margin: 0.5em 0.0em 1.0em 0.0em;
				}
		}

/* Icon */

	.icon {
		text-decoration: none;
		border-bottom: none;
		position: relative;
	}

		.icon:before {
			-moz-osx-font-smoothing: grayscale;
			-webkit-font-smoothing: antialiased;
			font-family: FontAwesome;
			font-style: normal;
			font-weight: normal;
			text-transform: none !important;
		}

		.icon > .label {
			display: none;
		}

/* Image */

	.image {
		border-radius: 4px;
		border: 0;
		display: inline-block;
		position: relative;
	}

		.image img {
			border-radius: 4px;
			display: block;
		}

		.image.left, .image.right {
			max-width: 40%;
		}

			.image.left img, .image.right img {
				width: 100%;
			}

		.image.left {
			float: left;
			padding: 0 1.5em 1em 0;
			top: 0.25em;
		}

		.image.right {
			float: right;
			padding: 0 0 1em 1.5em;
			top: 0.25em;
		}

		.image.fit {
			display: block;
			margin: 0 0 2em 0;
			width: 100%;
		}

			.image.fit img {
				width: 100%;
				height: 100%;
			}

		.image.main {
			display: block;
			margin: 0 0 3em 0;
			width: 100%;
		}

			.image.main img {
				width: 100%;
			}

/* List */

	ol {
		list-style: decimal;
		margin: 0 0 2em 0;
		padding-left: 1.25em;
	}

		ol li {
			padding-left: 0.25em;
		}

	ul {
		list-style: disc;
		margin: 0 0 2em 0;
		padding-left: 1em;
	}

		ul li {
			padding-left: 0.5em;
		}

		ul.alt {
			list-style: none;
			padding-left: 0;
		}

			ul.alt li {
				border-top: solid 1px rgba(144, 144, 144, 0.25);
				padding: 0.5em 0;
			}

				ul.alt li:first-child {
					border-top: 0;
					padding-top: 0;
				}

		ul.icons {
			cursor: default;
			list-style: none;
			padding-left: 0;
			margin: 1em 0 0.7em 0;
			display: inline-block;
		}

			ul.icons li {
				display: inline-block;
				text-align: center;
				padding-left: 0;
				padding-right: 0.8em;
			}

				ul.icons li a {
					display: block;
					border-radius: 100%;
					margin: 0;
					padding: 0.5em;
					border: solid 1px rgba(144, 144, 144, 0.25);
					color: rgba(144, 144, 144, 0.25);
				}

					ul.icons li a:before {
						font-size: 1.4em;
						display: block;
						width: 1.4em;
						height: 1.4em;
						line-height: 1.4em;
					}

					ul.icons li a:hover {
						background-color: #202024;
						color: #FFF;
					}

				ul.icons li:last-child {
					padding-right: 0;
				}

		ul.actions {
			cursor: default;
			list-style: none;
			padding-left: 0;
		}

			ul.actions li {
				display: inline-block;
				padding: 0 1em 0 0;
				vertical-align: middle;
			}

				ul.actions li:last-child {
					padding-right: 0;
				}

			ul.actions.small li {
				padding: 0 0.5em 0 0;
			}

			ul.actions.vertical li {
				display: block;
				padding: 1em 0 0 0;
			}

				ul.actions.vertical li:first-child {
					padding-top: 0;
				}

				ul.actions.vertical li > * {
					margin-bottom: 0;
				}

			ul.actions.vertical.small li {
				padding: 0.5em 0 0 0;
			}

				ul.actions.vertical.small li:first-child {
					padding-top: 0;
				}

			ul.actions.fit {
				display: table;
				margin-left: -1em;
				padding: 0;
				table-layout: fixed;
				width: calc(100% + 1em);
			}

				ul.actions.fit li {
					display: table-cell;
					padding: 0 0 0 1em;
				}

					ul.actions.fit li > * {
						margin-bottom: 0;
					}

				ul.actions.fit.small {
					margin-left: -0.5em;
					width: calc(100% + 0.5em);
				}

					ul.actions.fit.small li {
						padding: 0 0 0 0.5em;
					}

			@media screen and (max-width: 480px) {

				ul.actions {
					margin: 0 0 2em 0;
				}

					ul.actions li {
						padding: 1em 0 0 0;
						display: block;
						text-align: center;
						width: 100%;
					}

						ul.actions li:first-child {
							padding-top: 0;
						}

						ul.actions li > * {
							width: 100%;
							margin: 0 !important;
						}

							ul.actions li > *.icon:before {
								margin-left: -2em;
							}

					ul.actions.small li {
						padding: 0.5em 0 0 0;
					}

						ul.actions.small li:first-child {
							padding-top: 0;
						}

			}

	dl {
		margin: 0 0 2em 0;
	}

		dl dt {
			display: block;
			font-weight: 400;
			margin: 0 0 1em 0;
		}

		dl dd {
			margin-left: 2em;
		}


/* Button */

	input[type="submit"],
	input[type="reset"],
	input[type="button"],
	button,
	.button {
		-moz-appearance: none;
		-webkit-appearance: none;
		-ms-appearance: none;
		appearance: none;
		-moz-transition: background-color 0.2s ease-in-out, color 0.2s ease-in-out;
		-webkit-transition: background-color 0.2s ease-in-out, color 0.2s ease-in-out;
		-ms-transition: background-color 0.2s ease-in-out, color 0.2s ease-in-out;
		transition: background-color 0.2s ease-in-out, color 0.2s ease-in-out;
		background-color: #d96b80; 
		border-radius: 4px;
		border: 0;
		color: #ffffff !important;
		cursor: pointer;
		display: inline-block;
		font-weight: 400;
		height: 2.85em;
		line-height: 2.95em;
		padding: 0 1.5em;
		text-align: center;
		text-decoration: none;
		white-space: nowrap;
		
	}

		input[type="submit"]:hover,
		input[type="reset"]:hover,
		input[type="button"]:hover,
		button:hover,
		.button:hover {
			background-color: #ee778d;
		}

		input[type="submit"]:active,
		input[type="reset"]:active,
		input[type="button"]:active,
		button:active,
		.button:active {
			background-color: #ee778d;
		}

		input[type="submit"].icon,
		input[type="reset"].icon,
		input[type="button"].icon,
		button.icon,
		.button.icon {
			padding-left: 1.35em;
		}

			input[type="submit"].icon:before,
			input[type="reset"].icon:before,
			input[type="button"].icon:before,
			button.icon:before,
			.button.icon:before {
				margin-right: 0.5em;
			}

		input[type="submit"].fit,
		input[type="reset"].fit,
		input[type="button"].fit,
		button.fit,
		.button.fit {
			display: block;
			margin: 0 auto 1em auto;
			width: 80%;
			
		}

		input[type="submit"].small,
		input[type="reset"].small,
		input[type="button"].small,
		button.small,
		.button.small {
			font-size: 0.8em;
		}

		input[type="submit"].big,
		input[type="reset"].big,
		input[type="button"].big,
		button.big,
		.button.big {
			font-size: 1.35em;
		}

		input[type="submit"].disabled, input[type="submit"]:disabled,
		input[type="reset"].disabled,
		input[type="reset"]:disabled,
		input[type="button"].disabled,
		input[type="button"]:disabled,
		button.disabled,
		button:disabled,
		.button.disabled,
		.button:disabled {
			background-color: rgba(255, 255, 255, 0.75) !important;
			box-shadow: inset 0 -0.15em 0 0 rgba(0, 0, 0, 0.15);
			color: #202024 !important;
			cursor: default;
			opacity: 0.25;
		}
		
		
.inner .box:nth-child(1) .button, /* Start alternate colour 1 */
.inner .box:nth-child(4) .button,
.inner .box:nth-child(7) .button,
.inner .box:nth-child(10) .button {
	background-color: #69b8c8;
}

.inner .box:nth-child(1) .button:hover, 
.inner .box:nth-child(4) .button:hover,
.inner .box:nth-child(7) .button:hover,
.inner .box:nth-child(10) .button:hover {
	background-color: #73c9da;
}

.inner .box:nth-child(1) .button:active, 
.inner .box:nth-child(4) .button:active,
.inner .box:nth-child(7) .button:active,
.inner .box:nth-child(10) .button:active {
	background-color: #73c9da;
}


.inner .box:nth-child(2) .button, /* Start alternate colour 2 */
.inner .box:nth-child(5) .button,
.inner .box:nth-child(8) .button,
.inner .box:nth-child(11) .button {
	background-color: #79586e;
}

.inner .box:nth-child(2) .button:hover, 
.inner .box:nth-child(5) .button:hover,
.inner .box:nth-child(8) .button:hover,
.inner .box:nth-child(11) .button:hover {
	background-color: #916d85;
}

.inner .box:nth-child(2) .button:active, 
.inner .box:nth-child(5) .button:active,
.inner .box:nth-child(8) .button:active,
.inner .box:nth-child(11) .button:active {
	background-color: #916d85;
}



		@media screen and (max-width: 480px) {

			input[type="submit"],
			input[type="reset"],
			input[type="button"],
			button,
			.button {
				padding: 0;
			}

		}
		
		
/* Main menu and search top */




/* Add a black background color to the top navigation */
.topnav {
  background-color: #202024;
  overflow: hidden;
   position: fixed;
 top: 0;
 width: 100%;
 z-index: 3;
 border-bottom: 1px solid;
 border-color: #3b3b43;
}



@media screen and (max-width: 650px) {
.dropfix {
  background-color: #202024;
  overflow: hidden;
   position: fixed;
 top: 0;
 width: 100%;
 height: 2.75em;
 z-index: 2;
 border-bottom: 1px solid;
 border-color: #3b3b43;
 font-size: 14px;
}
}

@media screen and (max-width: 750px) {
.dropfix {
 font-size: 15px;
}
}



/* Style the links inside the navigation bar */
.topnav a {
  float: left;
  display: block;
  color: #f2f2f2;
  text-align: center;
  padding: 8px 8px;
  text-decoration: none;
  border: none;
  font-size: 15px;
}

@media screen and (max-width: 770px) {
.topnav a {
  float: left;
  display: block;
  color: #f2f2f2;
  text-align: center;
  padding: 7px 7px;
  text-decoration: none;
  border: none;
  font-size: 14px;
}
}

@media screen and (max-width: 680px) {
.topnav a {
  float: left;
  display: block;
  color: #f2f2f2;
  text-align: center;
  padding: 9px 6px;
  text-decoration: none;
  border: none;
  font-size: 14px;
}
}

@media screen and (max-width: 650px) {
.topnav a:not(:first-child) {
   border-top: 1px solid;
   border-right: 1px solid;
 border-color: #3b3b43;
}
}

.responsive {
display: -moz-flex;
width: 50%;
}




/* Change the color of links on hover */
.topnav a:hover {
  background-color: #111111;
  color: #ddd;
  
}


@media screen and (max-width: 650px) {
.topnav a:hover:not(:first-child):not(:last-child):after {
  font-family: 'FontAwesome';
  content: "\f0a8";
  color: #333333;
  left: 2.4em;
  position: relative;
  }
  }
  

/* Add an active class to highlight the current page */
.topnav a.active {
  background-color: #4CAF50;
  color: white;
}

/* Hide the link that should open and close the topnav on small screens */
.topnav .icon {
  display: none;
}


/* When the screen is less than 650 pixels wide, hide all links, except for the first one ("Home"). Show the link that contains should open and close the topnav (.icon) */
@media screen and (max-width: 650px) {
  .topnav a:not(:first-child) {display: none;}
  .topnav a.icon {
    float: left;
    display: block;
    border: 0;
  }
}

/* The "responsive" class is added to the topnav with JavaScript when the user clicks on the icon. This class makes the topnav look good on small screens (display the links vertically instead of horizontally) */
@media screen and (max-width: 650px) {
  .topnav.responsive {position: fixed;}
  .topnav.responsive a.icon {
    position: fixed;
    left: 29.5px;
    top: 0;
    
  }
  .topnav.responsive a {
    float: none;
    display: block;
    text-align: left;
    
  }
}


	
		form {
		margin: 0 0 0em 0;
		
	}

	label {
		color: #fff;
		display: block;
		font-size: 0.9em;
		font-weight: 400;
		margin: 0 0 0em 0;
	}
	
	input[type="submit"],
    .btn {
	 margin: 0 0 0 -2.6em;
	 background: none;
	 color: rgba(144, 144, 144, 0.25);
	}

.select-wrapper-top input[type="text"],
	select,
	textarea {
		-moz-appearance: none;
		-webkit-appearance: none;
		-ms-appearance: none;
		appearance: none;
		background: rgba(144, 144, 144, 0.075);
		border-radius: 4px;
		border: none;
		border: solid 1px rgba(144, 144, 144, 0.25);
		color: inherit;
		margin: 5px -20px 0px 0px;
		outline: 0;
		padding: 0 1em;
		width: 200px;
		height: 28px;
		

	}
	
	

	
	
		@media screen and (max-width: 750px) {
	.select-wrapper-top input[type="text"],
	select,
	textarea {
		-moz-appearance: none;
		-webkit-appearance: none;
		-ms-appearance: none;
		appearance: none;
		background: rgba(144, 144, 144, 0.075);
		border-radius: 4px;
		border: none;
		border: solid 1px rgba(144, 144, 144, 0.25);
		color: inherit;
		margin: 5px -18px 0px 0px;
		outline: 0;
		padding: 0 1em;
		width: 170px;
		height: 24px;
		}
		

	}
	
			@media screen and (max-width: 700px) {
	.select-wrapper-top input[type="text"],
	select,
	textarea {
		-moz-appearance: none;
		-webkit-appearance: none;
		-ms-appearance: none;
		appearance: none;
		background: rgba(144, 144, 144, 0.075);
		border-radius: 4px;
		border: none;
		border: solid 1px rgba(144, 144, 144, 0.25);
		color: inherit;
		margin: 5px -18px 0px 0px;
		outline: 0;
		padding: 0 1em;
		width: 150px;
		height: 28px;
		font-size: 16px;
		}
		

	}
	
			@media screen and (max-width: 650px) {
	.select-wrapper-top input[type="text"],
	select,
	textarea {
		-moz-appearance: none;
		-webkit-appearance: none;
		-ms-appearance: none;
		appearance: none;
		background: rgba(144, 144, 144, 0.075);
		border-radius: 4px;
		border: none;
		border: solid 1px rgba(144, 144, 144, 0.25);
		color: inherit;
		margin: 5px -18px 0px 0px;
		outline: 0;
		padding: 0 1em;
		width: 200px;
		height: 28px;
		font-size: 16px;
		}
		

	}
	
	
	
	
	@media screen and (max-width: 480px) {
	.select-wrapper-top input[type="text"],
	select,
	textarea {
		-moz-appearance: none;
		-webkit-appearance: none;
		-ms-appearance: none;
		appearance: none;
		background: rgba(144, 144, 144, 0.075);
		border-radius: 4px;
		border: none;
		border: solid 1px rgba(144, 144, 144, 0.25);
		color: inherit;
		margin: 2px 0px 0px 0px;
		outline: 0;
		padding: 0 1em;
		width: 180px;
		height: 28px;
		font-size: 16px;
		}
		

	}
	

	

	 .select-wrapper-top {
	 margin: 0px auto 0px auto;
		text-decoration: none;
		display: block;
		z-index: 4;
		position: fixed;
		top:1px;
		right:6px;
	}



		@media screen and (max-width: 850px) {
		 .select-wrapper-top {
	 margin: 0px auto 0px auto;
		text-decoration: none;
		display: block;
		z-index: 4;
		position: fixed;
		top:0px;
		right:1px;
		
	}
	}


		@media screen and (max-width: 650px) {
		 .select-wrapper-top {
	 margin: 0px auto 0px auto;
		text-decoration: none;
		display: block;
		z-index: 4;
		position: fixed;
		top:1px;
		right:1px;
		
	}
	}

	
		@media screen and (max-width: 480px) {
		 .select-wrapper-top {
	 margin: 0px auto 0px auto;
		text-decoration: none;
		display: block;
		z-index: 4;
		position: fixed;
		top:4px;
		right:1px;
		
	}
	}


		.select-wrapper-top select::-ms-expand {
			display: none;
		}


/* Banner */

	#banner {
		-moz-align-items: center;
		-webkit-align-items: center;
		-ms-align-items: center;
		align-items: center;
		display: -moz-flex;
		display: -webkit-flex;
		display: -ms-flex;
		display: flex;
		-moz-justify-content: center;
		-webkit-justify-content: center;
		-ms-justify-content: center;
		justify-content: center;
		padding: 0em 0em 0em 0em;
		border-top: 0;
		position: relative;
		text-align: center;
		height: 100%;
		display: block;
		
		
	}


		#banner h1 {
			color: #fff;
			font-weight: 400;
			font-family: Helvetica;
			margin: 0 10px 0 0;
			float:left;
			font-size: 2em;
		}


		#banner p {
			color: rgba(255, 255, 255, 0.85);
			font-size: 1.4em;
			font-weight: 300;
			float:left;
		}

			@media screen and (max-width: 980px) {

				#banner p {
					font-size: 1.5em;
				}

			}

			@media screen and (max-width: 550px) {

				#banner p {
					font-size: 1.0em;
				}

			}

		#banner a {
			color: rgba(255, 255, 255, 0.75);
			text-decoration: none;
			
		
		}
			

			#banner a:hover {
				color: #FFF;
				
			}



		@media screen and (max-width: 980px) {

			#banner br {
				display: none;
			}

		}

		@media screen and (max-width: 736px) {

			#banner {
				min-height: 0;
				padding: 0;
			}

				#banner br {
					display: none;
				}

		}

		
		
		.bannercontent {
			-moz-transition: opacity 1200ms ease;
			-webkit-transition: opacity 1200ms ease;
			-ms-transition: opacity 1200ms ease;
			transition: opacity 1200ms ease;
			padding: 5em 0 1.2em 0;
			overflow: auto;
		    border-top: 0;
		    text-align: center;
			background-color: #2c2c32;
			display: block;
			height: auto;
			opacity: 1;
			position: relative;
			
			width: 100%;
		}
		
		body.is-loading .bannercontent {
			opacity: 0;	
		}
		
		
		
		
		.logo{
		 float: left;
		 padding: 0 0 0 6em;
		}
		
		.logo a  {
			border: none;
					
		}
		
		.logo img {
			width: 12.3em;
					
		}		
		
		.headerdetails{
		text-align: left;
		float: left;
		display: block;
		width: 100%;
		max-width: 600px;
		height: auto;
		margin: 1.1em 0 0 2.5em;
		padding: 0.4em 0 0 1.4em;
		 
		}	
		
		
		.videocount {
		 font-style: italic;
		 font-weight: 600;
		 padding: 0px;
		margin: 6px 0 0 0px;
		}
		
		.tagline {
		padding: 0px;
		margin: 0px;
		font-style: italic;
		
		}
		
		.total {
		 color: #7cd4e5;
		 font-size: 1em;
		 
		
		}
		
		
		
		/* Mobile header */
		
				@media screen and (max-width: 901px) {
				.headerdetails{
				float: none;
				text-align: center;
				margin: 0 auto 0 auto;
				padding: 0;
				width: 85%;
				max-width: none;
				text-align: center;
		}	
		}
		
		
		@media screen and (max-width: 901px) {
		.videocount {
		 font-style: italic;
		 font-weight: 600;
		 padding: 0px;
		 width: 100%;
		margin: 0;
		text-align: center;
		}
		}
		
		
		@media screen and (max-width: 901px) {
		.logo {
		 float: none;
		 text-align: center;
		 margin: 0 0 0.5em 0;
		 padding: 0;
		}
		}
		@media screen and (max-width: 501px) {
			.logo img {
			width: 8.3em;
					
		}
		}
		
		
		@media screen and (max-width: 901px) {
        #banner h1 {
					font-size: 1.1em;
					float: none;
					text-align: center;
					 margin: 0;
		             padding: 0;
		  }

		  }
		


@media screen and (max-width: 901px) {
        .tagline {
		padding: 0 1em 0 1em;
		margin: 0 auto 0 auto !important;
		font-style: italic;
		text-align: center !important;
		font-size: 1.2em !important;
		width: 100%;
		}
		}
		
		
		@media screen and (max-width: 853px) {
        .tagline {
		padding: 0 4em 0 4em;
		margin: 0 auto 0 auto !important;
		font-style: italic;
		text-align: center !important;
		font-size: 1.2em !important;
		width: 100%;
		}
		}
		
		
				@media screen and (max-width: 690px) {
        .tagline {
		padding: 0 1em 0 1em;
		margin: 0 auto 0 auto !important;
		font-style: italic;
		text-align: center !important;
		font-size: 1.1em !important;
		width: 100%;
		}
		}
		
		@media screen and (max-width: 599px) {
        .tagline {
		padding: 0 1em 0 1em;
		margin: 0 auto 0 auto !important;
		font-style: italic;
		text-align: center !important;
		font-size: 1.3em !important;
		width: 100%;
		}
		}
		

		@media screen and (max-width: 539px) {
        .tagline {
		padding: 0 1em 0 1em;
		margin: 0 auto 0 auto !important;
		font-style: italic;
		text-align: center !important;
		font-size: 1em !important;
		width: 100%;
		}
		}		
		
		@media screen and (max-width: 500px) {
        .tagline {
		padding: 0 1em 0 1em;
		margin: 0 auto 0 auto !important;
		font-style: italic;
		text-align: center !important;
		font-size: 0.9em !important;
		width: 100%;
		}
		}
		

			@media screen and (max-width: 901px) {
					ul.icons li a:before {
						font-size: 1.2em;
						display: block;
						width: 1.2em;
						height: 1.2em;
						line-height: 1.2em;
					}
					}

			@media screen and (max-width: 700px) {
					ul.icons li a:before {
						font-size: 1.1em;
						display: block;
						width: 1.1em;
						height: 1.1em;
						line-height: 1.1em;
					}
					}

			
				

/* Main */

	#main {
		padding: 2.5em 0 2em 0;
		position: relative;
		overflow: hidden;
	}

		@media screen and (max-width: 736px) {

			#main {
				padding: 2em 0 1em 0;
			}

		}

		#main .inner {
			width: 100%;
			max-width: 100em;
			margin: 0 auto;
			position: relative;
		}

			@media screen and (max-width: 480px) {

				#main .inner {
					width: 95%;
				}

			}

/* Footer */

	#footer {
		padding: 4em 0 2em 0;
		background-color: #1b1b1f;
		text-align: center;
	}
	
	#footer h2{
		margin: 1.5em 0 0.5em 0;
	}

		#footer .inner {
			width: 50%;
			margin: 0 auto;
		}

			@media screen and (max-width: 980px) {

				#footer .inner {
					width: 75%;
				}

			}

			@media screen and (max-width: 480px) {

				#footer .inner {
					width: 90%;
				} 

			}

		#footer .copyright {
			color: rgba(255, 255, 255, 0.5);
			font-size: 0.9em;
			margin: 0em auto 2em auto;
			padding: 0;
			text-align: center;
		}


     .copyright a {
      border-bottom: 1px dotted;
     }
     
     
		@media screen and (max-width: 736px) { 

			#footer {
				padding: 3em 0 1em 0;
			}

		}
		
		.footlink {
		 border-bottom: 1px dotted; 
		}
		
		
			#footer .more {
			background-image: url("images/arrow1.png");
			background-position: center 1.30em;
			background-repeat: no-repeat;
			background-size: auto;
			border: 1px solid #333333;
			border-radius: 100%;
			color: rgba(255, 255, 255, 0.75);
			display: block;
			height: 4em;
	        white-space: nowrap;
			width: 4em;
			z-index: 2;
			margin: 0 auto 3em auto;
			padding: 0;
		}
		
		#footer .more p {
		 margin: 5.2em 0em 0em 0em;
		 padding: 0;
		 font-size: 0.8em;
		 }
		

			#footer .more:hover {
				background-color: rgba(255, 255, 255, 0.1);
				border: 1px solid #999999;
				color: #FFF;
			}
		
		
/* Search */

.Search-results {
 text-align: center;
  margin: -20px 0 20px 0;
  color: #fff;
  font-weight: 400;
  font-size: 1.7em;
  line-height: 1.5;
}

.error {
border-radius: 4px;
padding: 0.7em;
background: #2c2c32;
 margin: 0.7em auto 2em auto;
 text-align: center !important;
 font-size: 1.2em;
}



	form {
		margin: 0 0 0em 0;
	}

	label {
		color: #fff;
		display: block;
		font-size: 0.9em;
		font-weight: 400;
		margin: 0 0 0em 0;
	}
	
	input[type="submit"],
    .btn {
	 margin: 0 0 0 -2.6em;
	 background: none;
	 color: rgba(144, 144, 144, 0.25);
	}
	
	input[type="submit"],
    .btn:hover {
	 margin: 0 0 0 -2.6em;
	 background: none;
	 color: rgba(144, 144, 144, 0.25);
	 background-color: none;
	}
	
		input[type="submit"],
    .fa-search-plus:hover {
	 color: #ee778d;
	 
	}
	
	

	

input[type="text"],
	input[type="password"],
	input[type="email"],
	input[type="tel"],
	select,
	textarea {
		-moz-appearance: none;
		-webkit-appearance: none;
		-ms-appearance: none;
		appearance: none;
		background: rgba(144, 144, 144, 0.075);
		border-radius: 4px;
		border: none;
		border: solid 1px rgba(144, 144, 144, 0.25);
		color: inherit;
		margin: 0px -20px 0px 0px;
		outline: 0;
		padding: 0 1em;
		width: 250px;
		

	}
	
	@media screen and (max-width: 480px) {
		input[type="text"],
	input[type="password"],
	input[type="email"],
	input[type="tel"],
	select,
	textarea {
		-moz-appearance: none;
		-webkit-appearance: none;
		-ms-appearance: none;
		appearance: none;
		background: rgba(144, 144, 144, 0.075);
		border-radius: 4px;
		border: none;
		border: solid 1px rgba(144, 144, 144, 0.25);
		color: inherit;
		margin: 0px 0px 0px 0px;
		outline: 0;
		padding: 0 1em;
		width: 250px;
		}
		

	}

		input[type="text"]:invalid,
		input[type="password"]:invalid,
		input[type="email"]:invalid,
		input[type="tel"]:invalid,
		select:invalid,
		textarea:invalid {
			box-shadow: none;
		}

		input[type="text"]:focus,
		input[type="password"]:focus,
		input[type="email"]:focus,
		input[type="tel"]:focus,
		select:focus,
		textarea:focus {
			border-color: #ff8686;
			box-shadow: 0 0 0 1px #ff8686;
		}

	.select-wrapper {
	width: 100%;
	 margin: 0px auto 0px auto;
		text-decoration: none;
		display: block;
		position: relative;
	}


		.select-wrapper select::-ms-expand {
			display: none;
		}

	input[type="text"],
	input[type="password"],
	input[type="email"],
	select {
		height: 2.75em;
	}

	textarea {
		padding: 0.75em 1em;
	}

	input[type="checkbox"],
	input[type="radio"] {
		-moz-appearance: none;
		-webkit-appearance: none;
		-ms-appearance: none;
		appearance: none;
		display: block;
		float: left;
		margin-right: -2em;
		opacity: 0;
		width: 1em;
		z-index: -1;
	}

		input[type="checkbox"] + label,
		input[type="radio"] + label {
			text-decoration: none;
			color: rgba(255, 255, 255, 0.75);
			cursor: pointer;
			display: inline-block;
			font-size: 1em;
			font-weight: 300;
			padding-left: 2.4em;
			padding-right: 0.75em;
			position: relative;
		}

			input[type="checkbox"] + label:before,
			input[type="radio"] + label:before {
				-moz-osx-font-smoothing: grayscale;
				-webkit-font-smoothing: antialiased;
				font-family: FontAwesome;
				font-style: normal;
				font-weight: normal;
				text-transform: none !important;
			}

			input[type="checkbox"] + label:before,
			input[type="radio"] + label:before {
				background: rgba(144, 144, 144, 0.075);
				border-radius: 4px;
				border: solid 1px rgba(144, 144, 144, 0.25);
				content: '';
				display: inline-block;
				height: 1.65em;
				left: 0;
				line-height: 1.58125em;
				position: absolute;
				text-align: center;
				top: 0;
				width: 1.65em;
			}

		input[type="checkbox"]:checked + label:before,
		input[type="radio"]:checked + label:before {
			background: #ff8686;
			border-color: #ff8686;
			color: #ffffff;
			content: '\f00c';
		}

		input[type="checkbox"]:focus + label:before,
		input[type="radio"]:focus + label:before {
			border-color: #ff8686;
			box-shadow: 0 0 0 1px #ff8686;
		}

	input[type="checkbox"] + label:before {
		border-radius: 4px;
	}

	input[type="radio"] + label:before {
		border-radius: 100%;
	}

	::-webkit-input-placeholder {
		color: rgba(255, 255, 255, 0.5) !important;
		opacity: 1.0;
	}

	:-moz-placeholder {
		color: rgba(255, 255, 255, 0.5) !important;
		opacity: 1.0;
	}

	::-moz-placeholder {
		color: rgba(255, 255, 255, 0.5) !important;
		opacity: 1.0;
	}

	:-ms-input-placeholder {
		color: rgba(255, 255, 255, 0.5) !important;
		opacity: 1.0;
	}

	.formerize-placeholder {
		color: rgba(255, 255, 255, 0.5) !important;
		opacity: 1.0;
	}
	
	

	

/* Big Menu */	


.fullmenu {
  width: 100%;
  max-width: 1700px;
  padding: 0 3% 0 3%;
  margin: 0 auto 0 auto;
  position: relative;
  display: block;
  clear: both;
  
}

@media screen and (max-width: 536px) {
.fullmenu {
  font-size: 0.9em;

 } 
}



.fullmenu h1 {
  font-size: 1.3em;
  padding-top: 0em;
  margin: 1.5em 0em 0.5em 1.3em;
  position: relative;
  display: inline-block;
   border-bottom: 1px dotted; 
}

@media screen and (max-width: 536px) {
.fullmenu h1 {
 margin: 1.5em 0.5em 0.5em 0.5em;
}
}

.fullmenu p a {
  border-bottom: 1px dotted;
  
}

.fullmenu p {
  font-size: 15px;
  margin: 0em 1.5em 1.3em 1.5em;
  max-width: 1000px;
  
}
@media screen and (max-width: 536px) {
.fullmenu p {
  margin: 0em 0.5em 1.3em 0.5em;

 } 
}

.fullmenu img{
  width: 100%;
  height: 100%;
  padding: 0 0 0 0;
  margin: 1.5em 0em 0em 0em;
  position: relative;
}

.fullmenu a:hover img{
            -moz-transition: opacity 500ms ease;
			-webkit-transition: opacity 500ms ease;
			-ms-transition: opacity 500ms ease;
			transition: opacity 500ms ease;
			color: #202024 !important;
			cursor: pointer;
			opacity: 0.75;

}


.showthumbinpostmenu {
display: inline-block;
width: 100%;
background-color: #222222;
border-radius: 8px;
margin: 0em 0em 2em 0em;
}

.showthumbinpostmenu a {
display: inline-block;
font-size: 0.85em;
}


.showthumbinpostmenu a img {
 width: 5em;
 font-size: 1.2em;
 height: 5em;
 margin: 0em 0em 0em 0em;
 position: relative;
 border-radius: 50%;
 border: 0;
 overflow: hidden;
 border: solid 3px transparent;
  background-image: linear-gradient(rgba(119, 201, 217, 1), rgba(236, 120, 142, 1)), linear-gradient(180deg, #77c9d9, #ec788e);
  background-origin: border-box;
  background-clip: content-box, border-box;
  box-shadow: 2px 1000px 1px #fff inset;
}

.thumbholder{
 float: left;
 width: 7em;
 height: 5em;
 margin: 1.75em 0em 2.5em 0.8em;
 position: relative;
 text-align: center;
}

.thumbholder a img{
 display: inline-block;
 margin: 0em auto 0em auto;
}


.straightlist {
 display: inline-block;
 background-color: #222222;
 border-radius: 8px;
 font-size: 1em;
}

.straightlist a:hover {
 text-decoration: underline;
}

.straightlist ul li {
 display: inline-block;
 text-decoration: none;
 margin: 1em 0.7em 0em 0em;
 padding: 0.1em 0.5em 0.1em 0.5em;
 background-color: #333333;
 border-radius: 8px;
 font-size: 1em;
 cursor: pointer;
}




/* tabs */

/* Style the tab */
.tab {
  overflow: hidden;

}

/* Style the buttons inside the tab */
.tab button {
  margin: 1em;
  padding: 0em 1em 0em 1em;
  background-color: #2c2c32;
  border: none;

}

/* Change background color of buttons on hover */
.tab button:hover {
  background-color: #d76c81;
  border: none;
}

.tab button:focus {outline:0;}

/* Create an active/current tablink class */
.tab button.active {
  background-color: #d76c81;
  border: none;
  
}

/* Style the tab content */
.tabcontent {
  display: none;
  float: left;
  width: 100%;
background-color: #222222;
border-radius: 8px;
margin: 0em 0em 3em 0em;
  animation: fadeEffect 2s; /* Fading effect takes 1 second */
}

/* Go from zero to full opacity */
@keyframes fadeEffect {
  from {opacity: 0;}
  to {opacity: 1;}
}

/* tabbed thumbs */
.tabcontent a {
display: inline-block;
font-size: 0.85em;
}

.tabcontent a img {
 width: 5em;
 font-size: 1.2em;
 height: 5em;
 margin: 0em 0em 0em 0em;
 position: relative;
 border-radius: 50%;
 border: 0;
 overflow: hidden;
 border: solid 3px transparent;
  background-image: linear-gradient(rgba(119, 201, 217, 1), rgba(236, 120, 142, 1)), linear-gradient(180deg, #77c9d9, #ec788e);
  background-origin: border-box;
  background-clip: content-box, border-box;
  box-shadow: 2px 1000px 1px #fff inset;
}


/* SHOP */

.innerheadershop {
   width: 100%;
  max-width: 1300px;
  padding: 0 0 0 0;
  margin: 0 auto 0 auto;
  position: relative;
  display: block;
}



@media screen and (max-width: 1390px) {
.innerheadershop {
  padding: 0% 0% 0% 2%;
}
}

@media screen and (max-width: 1325px) {
.innerheadershop {
  padding: 0% 0% 0% 3%;
}
}

@media screen and (max-width: 836px) {
.innerheadershop {
  font-size: 1em;
}
}

@media screen and (max-width: 700px) {
.innerheadershop {
  font-size: 1.1em;
}
}

@media screen and (max-width: 536px) {
.innerheadershop {
  font-size: 0.6em;
}
}
@media screen and (max-width: 480px) {
.innerheadershop {
  font-size: 0.5em;
  padding: 0% 0% 0% 6%;
}
}


@media screen and (max-width: 436px) {
.innerheadershop {
  font-size: 0.5em;
  padding: 0% 0% 0% 3%;
}
}

.innerheadershop h1 {
  margin: 0em;
  font-size: 2em;
  padding: 0em;
  clear: both;
  border-bottom: 1px dotted;
  display: inline;
}

@media screen and (max-width: 700px) {
 .innerheadershop h1 {
  font-size: 1.6em;
}
}

@media screen and (max-width: 550px) {
 .innerheadershop h1 {
  font-size: 2em;
}
}

@media screen and (max-width: 436px) {
 .innerheadershop h1 {
  margin: 0em 0em 0em 1em;
  font-size: 2.5em;
}
}

.headertextshop{
  width: 90%;
    position: relative;
  padding: 0em 0em 0em 0em;
  display:inline-block;
  margin: 0em 0em 2em 0em; 
}

@media screen and (max-width: 536px) {
.headertextshop {
  margin: 0% 0% 5% 0%;
  font-size: 1.4em;
}
}
@media screen and (max-width: 436px) {
.headertextshop {
  margin: 0% 0% 7% 4%;
  font-size: 2em;
}
}

.headertextshop p{
  margin: 1em 0em 0em 0em;
  padding: 0; 
}

.thumbnailsshop {
		display: -moz-flex;
		display: -webkit-flex;
		display: -ms-flex;
		display: flex;
		-moz-align-items: stretch;
		-webkit-align-items: stretch;
		-ms-align-items: stretch;
		align-items: stretch;
		-moz-justify-content: center;
		-webkit-justify-content: center;
		-ms-justify-content: center;
		justify-content: center;
		-moz-flex-wrap: wrap;
		-webkit-flex-wrap: wrap;
		-ms-flex-wrap: wrap;
		flex-wrap: wrap;
		
	}

		.thumbnailsshop .box {
			margin: 0 1em 2em 1em;
			width: 30%;
		}

			@media screen and (max-width: 2200px) {

				.thumbnailsshop .box {
					width: 30%;
				}

			}

			@media screen and (max-width: 1136px) {

				.thumbnailsshop .box {
					width: 30%;
				}
				

			}
			
			@media screen and (max-width: 900px) {

				.thumbnailsshop .box {
					width: 29%;
				}
				

			}			
				@media screen and (max-width: 615px) {

				.thumbnailsshop .box {
					width: 100%;
				}
				
				}




/* ads */	

	
.example_responsive_1 { width:100%;height:200px !important; }
@media(max-width: 500px) { .example_responsive_1 { width: 100%; height: 40px; } }
@media(max-width: 800px) { .example_responsive_1 { width: 100%; height: 90px; } }
	
	
	.footer-banner{
		margin: 1em 0em 1em 0em;
		text-align: center;
		width: 100%;
		display: block;
		
	}
	
	.footer-banner-static-desktop {	
	  margin: 0em auto 1em auto;
		text-align: center;
		width: 100%;
		max-width: 1240px;
		display: block;
	}
	
	@media screen and (max-width: 550px) {
	.footer-banner-static-desktop {	
		display: none;
	}
	}
	
		.footer-banner-static-mobile {	
	  margin: 0em auto 1em auto;
		text-align: center;
		width: 100%;
		max-width: 550px;
		display: block;
	}
	
	@media screen and (min-width: 550px) {
	.footer-banner-static-mobile {	
		display: none;
	}
	}
		
	
	
	
	.inserted { display:block; width: 80%; margin: 0em 0em 2em 0em; padding: 0em 0.9em 0em 0.9em; text-align: center; }
@media (min-width: 537px) { .inserted { display: none; } }