/*
Theme Name: Kings Legend
Version: 1.0
Theme URI: http://www.lemon.nl
Description: 
Author: Roeland ten Holder | Lemon
Author URI: roeland@lemon.nl
*/

/*********** RESET ***********/
body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, form, fieldset, input, p, blockquote th, td { margin: 0; padding: 0; -webkit-tap-highlight-color: rgba(0,0,0,0); }
table, thead, tbody, tfoot, tr, th, td { width: auto; height: auto; margin: 0; padding: 0; border: none; border-collapse: inherit; border-spacing: 0; border-color: inherit; vertical-align: inherit; text-align: left; font-weight: inherit; -webkit-border-horizontal-spacing: 0; -webkit-border-vertical-spacing: 0; }
h1, h2, h3, h4, h5, h6 { font-size: 100%; }
ul 		 { list-style-type: none; }
li		 { list-style-type: none; }
p > ul > li	{ list-style-type: disc; }
p > ol > li	{ list-style-type: decimal; }
ol 		 { margin-left: 20px; margin-bottom: 10px; }
img 	 { border: 0 !important; outline: none; }
html 	 { margin: 0; height: 100%; }
a	 		 { outline: none; border: none; -webkit-tap-highlight-color: rgba(0,0,0,0);}
button { outline: none; border: none; -webkit-tap-highlight-color: rgba(0,0,0,0);}
:focus { outline: none;}
input  { -moz-border-radius: 0; -webkit-border-radius: 0; outline: none; }
.clear:after { content: "."; display: block; clear: both; visibility: hidden; line-height: 0; height: 0; }
.clear { display: block; pointer-events: none; }
html[xmlns] .clear { display: block; }
* html .clear { height: 1%; }
div { position: relative; }

.border {
	border: 1px solid white;
	min-height: 20px;
}

/*********** BOOTSTRAP RESET ***********/
* { -webkit-border-radius: 0 !important; -moz-border-radius: 0 !important; border-radius: 0 !important; -webkit-box-shadow: 0 !important; -moz-box-shadow: 0 !important; box-shadow: 0 !important; }
body { padding-top: 50px; }
.admin-bar body { padding-top: 82px; } /* +32px */
.navbar-fixed-top { top: 0; } /* normal bootstrap */
.admin-bar .navbar-fixed-top { top: 32px; } /* +32px */

/*********** FONTS / BASICS ***********/
h1							{	font: normal 700 38px/50px 'Merriweather', Arial, Helvetica, Verdana, sans-serif; color: #111111; padding: 0 40px 0; margin: 0 auto 40px; max-width: 90%; text-align: center; }
h1 a						{ text-decoration: none; }
h2							{	font: normal 700 38px/50px 'Merriweather', Arial, Helvetica, Verdana, sans-serif; color: #111111; padding: 0 40px 5px; }
h3 							{	font: normal 700 24px/36px 'Merriweather', Arial, Helvetica, Verdana, sans-serif; color: #111111; padding: 0 0 10px 0; }
h4 							{	font: normal 700 20px/30px 'Merriweather', Arial, Helvetica, Verdana, sans-serif; color: #111111; padding: 0 0 10px 0; }
h5 							{	font: normal 700 18px/28px 'Merriweather', Arial, Helvetica, Verdana, sans-serif; color: #111111; padding: 0 0 10px 0; }
h6 							{	font: normal 700 16px/22px 'Merriweather', Arial, Helvetica, Verdana, sans-serif; color: #111111; padding: 0 0 5px 0; }
body 						{ font: normal 300 16px/22px 'Merriweather', Arial, Helvetica, Verdana, sans-serif; color: #111111; background: #f2f2f2; }
.small,.small a { font: normal normal 12px/16px Arial, Helvetica, Verdana, sans-serif; color: #333333; text-align: left; }
.date 					{ font: normal normal 12px/16px Arial, Helvetica, Verdana, sans-serif; color: #333333; }

@font-face{ 
	font-family: 'BaufraBold';
	src: url('/webfonts/the_northern_block_-_baufra_bold-webfont.woff') format('woff'),
			 url('/webfonts/the_northern_block_-_baufra_bold-webfont.ttf') format('truetype');
}

@font-face {
	font-family: 'BaufraRegular';
	src: url('/webfonts/the_northern_block_-_baufra_regular-webfont.woff') format('woff'),
			 url('/webfonts/the_northern_block_-_baufra_regular-webfont.ttf') format('truetype');
}

@font-face {
	font-family: 'BaufraLight';
	src: url('/webfonts/the_northern_block_-_baufra_light-webfont.woff') format('woff'),
			 url('/webfonts/the_northern_block_-_baufra_light-webfont.ttf') format('truetype');
}

.small a 				{ padding: 0px;}
.right 					{ float: right; }
.left 					{ float: left; }
.hidden					{ display: none; }
.content ul li 	{ list-style-type: disc; margin-left: 1.2em;}
.content ol li 	{ list-style-type: decimal; margin-left: 1.2em;}
.content ul,
.content ol 		{ padding-bottom: 1.5em; }
.justify				{ text-align: justify; }
a								{ color: #111111; text-decoration: underline; }
a:hover					{ color: #333333; text-decoration: underline; }
.pull-left.gap,
.alignleft 			{ float: left !important; text-align: left; margin: 4px 20px 20px 0; }
.pull-right.gap,
.alignright 		{ float: right !important; text-align: left; margin: 4px 0 20px 20px; }
.aligncenter		{ display: block; text-align: center; margin: 0 auto; }
.textleft 			{ text-align: left; }
.textright 			{ text-align: right; }
.center					{ text-align: center; margin: 0 auto; }
.hover:hover 		{ opacity: 0.8; cursor: pointer; }
.content p 			{ margin-bottom: 24px; }
p:last-child 		{ margin-bottom: 20px; }
.signal p 			{ color: #000000; }
hr							{ border-color: #111111; width: 100%; max-width: 600px; margin: 20px auto 40px; }
img							{ padding: 0 !important; max-width: 100%; height: auto; }
.tops 					{ margin-top: 50px !important; }
.bottoms 				{ margin-bottom: 50px !important; }

.nopadding			{ padding: 0 !important; }
.nomargin				{ margin: 0 !important; }


/*********** CONTAINERS ***********/

.navbar {
	background: #f2f2f2;
	border-bottom: solid 1px #dddddd;
}

.container {
	width: 100%;
	max-width: 960px;
	margin: 0 auto;
}

.fullcontainer {
	width: 100%;
	margin: 0 auto;
}

.widthcontainer {
	width: 94%;
	max-width: 1160px;
	margin: 0 auto;
}

.page {
	position:	relative;
	width: 100%;
	margin: 0;
}

.header-extra-margin {
	height: 25px;
}



.home .first-container .row {
	margin: 0 auto;
	max-width: 90%;
}



/*********** NAVBAR ***********/

.navbar {
	padding-left: 50px;
	padding-right: 50px;
}

.shield {
	width: 30px;
	height: 30px;
	margin: 10px 15px 10px 0;
	float: left;
}


.navbar li a {
	font: normal 700 16px/20px 'Merriweather', Arial, Helvetica, Verdana, sans-serif;
	color: #111111;
	text-decoration: none;
	padding: 15px 20px;
	float: left;
}

#responsive-menu-container li.responsive-menu-item a {
	font: normal 700 16px/20px 'Merriweather', Arial, Helvetica, Verdana, sans-serif;
}


.navbar a:hover {
	color: #cc3333;
}

.navbar-social {
	float: right;
}

.navbar-social a {
	font-size: 20px;
	line-height: 20px;
	color: #333366;
	text-decoration: none;
	padding: 15px 0px 10px 15px;
	float: left;
}





/*********** HEADER ***********/

#eventmap,
.imageheader {
	width: 100%;
	height: 400px;
	margin: 0 auto;
	background-color: #c1d3e4;
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center center;
	text-align: center;
	border-bottom: solid 1px #dddddd;
}



/*********** INTRO ***********/

.swoosh {
	position: absolute;
	display: table;
	top: 51px;
	width: 100%;
	height: calc(100vh - 51px);
	background-size: cover;
	background-position: center center;
}

.swoosh .content {
	display: table-cell;
  vertical-align: middle;
  padding-bottom: 60px;
}

.swoosh h1 {
	color: #ffffff;
}

.swoosh .btn {
	background: #ffffff;
	color: #333333;
	border-color: #ffffff;
	margin-right: 30px;
	padding: 10px 30px;
	text-transform: uppercase;
}

.swoosh .btn:hover {
	color: #333333;
}

.shiptracker {
	position: absolute;
	right: 50px;
	bottom: 40px;
	color: #ffffff;
}

.shiptracker .vessellocation {
	width: 206px;
	height: 206px;
	border-radius: 103px;
	overflow: hidden;
	background-position: center center;
	background-repeat: no-repeat;
	margin-bottom: 15px;
}

.shiptracker h4 {
	color: #ffffff;
}

.shiptracker p {
	margin-bottom: 10px;
}

#video {
	position: fixed;
	right: 0;
	bottom: 0;
	min-width: 100%; 
	min-height: 100%;
}

.vessellocation {
	width: 206px;
	height: 206px;
	border-radius: 103px !important;
	overflow: hidden;
	background-position: center center;
	background-repeat: no-repeat;
}

.vesselpin {
	position: absolute;
	top: 57px;
	left: 86px;
	width: 50px;
	height: auto;
}



/*********** FOOTER ***********/

.fullcontainer.footer {
	background: #f2f2f2 url('images/swoosh_footer.png') no-repeat center bottom;
	min-height: 500px;
	padding: 50px 0 0;
}

.footer h3 {
	margin: 0 0 10px;
}


.footer .logo {
	margin: 150px 0;
}



/*********** ELEMENTS ***********/

.logo {
	width: 650px;
	height: auto;
	margin: 30px 0 50px;
}


.btn { 
	font: normal normal 15px/20px 'BaufraBold', Arial, Helvetica, Verdana, sans-serif;
	border-radius: 0px;
	text-shadow: none;
	box-shadow: none;
	-webkit-box-shadow: none;
	padding: 3px 25px 4px;
	color: #ffffff;
	border-color: #cc3333;
	background: #cc3333;
	text-decoration: none;
	margin: 0 5px 10px;
}


.btn:hover {
	color: #ffffff;
	opacity: 0.8;
}

.btn:focus {
	color: #ffffff;
}


.page-item .content,
.blog-item .content {
	padding: 15px;
}

.widthcontainer .img-thumbnail {
	width: calc(100% + 30px);
	height: 280px;
	padding: 0;
	background-color: #ccc;
	background-size: cover;
	background-position: center center;
	border: none;
}

.widthcontainer .img-thumbnail.columns {
	height: 400px;
}

.blog {
	margin-bottom: 100px;
}

.blog-item {
	padding-left: 5px;
	padding-right: 5px;
}

.blog-item .content  {
	background: #ffffff;
	padding: 15px;
	min-height: 395px;
	text-align: left;
}





/*********** EVENTS ***********/

/* Backend, ook in admin css */
#event_cost,
#event_url,
#event_tribe_organizer,
#event_tribe_venue {
	display: none !important;
}


/* .tribe-events-page-title, */
.tribe-events-header,
.tribe-events-back,
.single-tribe_events .h1_container, 
.events-list .h1_container, 
.tribe-bar-disabled,
.tribe-events-list-separator-month,  /* months in list view  */
.tribe-events-cal-links, /* google buttons */
.tribe-events-ical,	/* eport events button */
.tribe-bar-filters,  /* filter boven (o.a.) list view */
.tribe-events-list-widget .widgettitle,
.single-tribe_events .tribe-events-event-meta,
#tribe-events-footer .tribe-events-sub-nav

{
	display: none !important;
}


.tribe-events-list h2.tribe-events-page-title {
	margin: 20px auto 0px;
}



/* LIST VIEW */
#tribe-events-content-wrapper .type-tribe_events {
	text-align: center;
	border-right: 1px solid #000;
	min-height: 360px;
	padding-left: 5px !important;
	padding-right: 5px !important;
	margin-bottom: 15px !important;
}

#tribe-events-content-wrapper .type-tribe_events a {
	text-decoration: none;
}



#tribe-events-content-wrapper .col-md-3:nth-of-type(1),
#tribe-events-content-wrapper .col-md-3:nth-of-type(5),
#tribe-events-content-wrapper .col-md-3:nth-of-type(9),
#tribe-events-content-wrapper .col-md-3:nth-of-type(13),
#tribe-events-content-wrapper .col-md-3:nth-of-type(18) {
	border-left: 1px solid #000;
}



.lmn-event-cats {
	text-align: center;
	font: normal 700 14px/18px 'Merriweather', Arial, Helvetica, Verdana, sans-serif;
	padding: 0 0 30px;
}

.lmn-event-cats a {
	margin: 0 0 0 20px;
}

.lmn-event-header {
	width: 100%;
	height: 130px;
	background-color: #ccc;
	background-size: cover;
	background-position: center center;
}

.lmn-event-category {
	margin: 0 auto;
	font: normal 400 14px/18px 'Merriweather', Arial, Helvetica, Verdana, sans-serif;
	padding: 10px 0;
}

.lmn-event-category-icon {
	position: relative;
	display: inline-block;
	width: 25px;
	height: 25px;
	margin: 0 5px 1px 0;
	vertical-align: middle;
	background-repeat: no-repeat;
	background-size: 100px 50px;
	background-position: 0 0;
	background-image: url('images/icons_events.png');
}

.lmn-event-category-icon.cruising 	{ background-position: -25px 0; }
.lmn-event-category-icon.racing 		{ background-position: -50px 0; }
.lmn-event-category-icon.companies 	{ background-position: -75px 0; }

.type-tribe_events a:hover .lmn-event-category-icon.cruising 	{ background-position: -25px -25px; }
.type-tribe_events a:hover .lmn-event-category-icon.racing 		{ background-position: -50px -25px; }
.type-tribe_events a:hover .lmn-event-category-icon.companies { background-position: -75px -25px; }

.tribe-events-category-cruising

h4.tribe-event-title,
.tribe-events-list .type-tribe_events h2,
.tribe-events-list-event-title {
	font: normal 700 22px/30px 'Merriweather', Arial, Helvetica, Verdana, sans-serif;
	color: #111111;
	padding: 0 5px 0 5px;
}


.lmn-event-booked {
	font: normal normal 13px/20px 'BaufraBold', Arial, Helvetica, Verdana, sans-serif;
	color: #ffffff;
	background: #cc3333;
	width: 100%;
	padding: 3px;
	margin: 0 0 5px 0;
}

.tribe-events-schedule,
.tribe-events-schedule h2,
.tribe-events-loop .tribe-events-event-meta,
.tribe-event-date-start,
.tribe-event-date-end {
	text-align: center;
	font: normal 700 16px/20px 'Merriweather', Arial, Helvetica, Verdana, sans-serif;
}

/* To get same margin in widget view as list view */
.tribe-event-duration {
	margin-bottom: 15px;
}


.lmn-event-location {
	text-align: left;
	display: inline-block;
	margin: 10px 0 5px;
}

.lmn-event-location img {
	width: 25px;
	height: auto;
	margin-top: -3px;
}

.lmn-event-location h3 {
	font: normal 700 14px/18px 'Merriweather', Arial, Helvetica, Verdana, sans-serif;
}


.type-tribe_events a:hover .tribe-events-list .type-tribe_events h2,
.type-tribe_events a:hover .tribe-events-list-event-title,
.type-tribe_events a:hover .lmn-event-location h3,
.type-tribe_events a:hover .tribe-event-title,
.type-tribe_events a:hover {
	color: #cc3333;
}




/* next / prev / all */


.lmn-back,
.lmn-prev,
.lmn-next {
	display: inline-block;
	vertical-align: top;
}



.lmn-back,
.single-tribe_events #tribe-events-header li {
	width: 15%;
	
}

.lmn-prev,
.lmn-next,
.single-tribe_events #tribe-events-header li.tribe-events-nav-previous,
.single-tribe_events #tribe-events-header li.tribe-events-nav-next {
	width: 40%;
}


/* Event detail page */


#tribe-events-content h1 {
	margin: 0 auto;
}








/*********** RESPONSIVE ***********/
.desktop 	{ display: block; }
.mobile, .mobilebut	{ display: none; }

@media all and (max-width: 800px) {
	
	.widthcontainer {
    width: 90%;
  }
	.menu-wrapper,
	.shiptracker,
	
	
	.desktop 	{ display: none; }
	
	
	.mobile 	{ display: block; }
	
	
	
	
	h1							{	font: normal 700 24px/30px 'Merriweather', Arial, Helvetica, Verdana, sans-serif; color: #111111; padding: 0 40px 0; margin: 0 auto 40px; max-width: 90%; text-align: center; }
	h1 a						{ text-decoration: none; }
	h2							{	font: normal 700 24px/30px 'Merriweather', Arial, Helvetica, Verdana, sans-serif; color: #111111; padding: 0 40px 5px; }
	h3 							{	font: normal 700 16px/22px 'Merriweather', Arial, Helvetica, Verdana, sans-serif; color: #111111; padding: 0 0 10px 0; }
	h4 							{	font: normal 700 16px/22px 'Merriweather', Arial, Helvetica, Verdana, sans-serif; color: #111111; padding: 0 0 10px 0; }
	h5 							{	font: normal 700 16px/22px 'Merriweather', Arial, Helvetica, Verdana, sans-serif; color: #111111; padding: 0 0 10px 0; }
	h6 							{	font: normal 700 16px/22px 'Merriweather', Arial, Helvetica, Verdana, sans-serif; color: #111111; padding: 0 0 5px 0; }
	body 						{ font: normal 300 16px/22px 'Merriweather', Arial, Helvetica, Verdana, sans-serif; color: #111111; background: #f2f2f2; }
	.small,.small a { font: normal normal 12px/16px Arial, Helvetica, Verdana, sans-serif; color: #333333; text-align: left; }
	
	.navbar {
    padding-left: 15px;
    padding-right: 15px;
	}
	
	
	#tribe-events-content-wrapper .type-tribe_events,
	#tribe-events-content-wrapper .col-md-3:nth-of-type(1),
	#tribe-events-content-wrapper .col-md-3:nth-of-type(5),
	#tribe-events-content-wrapper .col-md-3:nth-of-type(9),
	#tribe-events-content-wrapper .col-md-3:nth-of-type(13),
	#tribe-events-content-wrapper .col-md-3:nth-of-type(18) {
		border: none !important;
	}

	
	button#responsive-menu-button {
		left: 48px !important;
	}
}

@media all and (max-width: 480px) {
	
	
	.shiptracker {
		display: none;
		
	}
} 