/* 
Theme Name:   	La Botte
Template:     	storefront
Description:  	La Botte Willoughby Theme
Version:      	1.0.0
License:      	GNU General Public License v2 or later
License URI:  	http://www.gnu.org/licenses/gpl-2.0.html
Text Domain:  	storefront
Tags:         	black, white, light, two-columns, left-sidebar, right-sidebar, responsive-layout, custom-background, custom-colors, custom-header, custom-menu, featured-images, full-width-template, threaded-comments, accessibility-ready
This theme, like WordPress, is licensed under the GPL.
Use it to make something cool, have fun, and share what you've learned with others.
Storefront is based on Underscores http://underscores.me/, (C) 2012-2014 Automattic, Inc.
Resetting and rebuilding styles have been helped along thanks to the fine work of
Eric Meyer http://meyerweb.com/eric/tools/css/reset/index.html
along with Nicolas Gallagher and Jonathan Neal http://necolas.github.com/normalize.css/ 
FontAwesome License: SIL Open Font License - http://scripts.sil.org/OFL
Images License: GNU General Public License v2 or later
*/
/* 
 * Add your own custom css below this text.
 */


/*=====================================================================
"Why do these even exist in the parent CSS Theme" Overrides
======================================================================*/
body, html{
	height: 100%;
	overflow-y: hidden;
}
.main-navigation ul.nav-menu>li:first-child{
	margin-left: 0;
}
.site, .site-main, .content-area{
	height: 100%;
	margin: 0;
}
.hentry {
    margin: 0 0 1em;
}
/*=====================================================================
La-Dee-Da Scrollbar
======================================================================
.pageContent::-webkit-scrollbar              {
    width: 7px;
    background: white;
}
.pageContent::-webkit-scrollbar-button       {

}
.pageContent::-webkit-scrollbar-track        {
    box-shadow: inset 0 0 6px rgba(0,0,0,0.3);

}
.pageContent::-webkit-scrollbar-track-piece  {

}
.pageContent::-webkit-scrollbar-thumb        {
    background: #ba9f6f;
    box-shadow: inset 0 0 6px rgba(0,0,0,0.5);

}
.pageContent::-webkit-scrollbar-corner       {

}
.pageContent::-webkit-resizer                {

}


/*=====================================================================
General Home Stuff
======================================================================*/
p{
    font-family: Muli;
}
.site-content{
	background: url("/files/2017/08/LaBotteBackground.jpg");
	background: url("/files/2017/09/BackgroundImage.jpg");
    background: linear-gradient(153deg, #5f5f5f, #2f2f2f);
	background-size: cover;
    height: 100%;
    overflow: auto;
}
.col-full{
	height: 100%;
    max-width: 100%;
    z-index: 15;
    position: relative;
}
.entry-content p a{
	color: white;
	text-decoration: underline;
}
/*=====================================================================
Food Menu
======================================================================*/
.fdm-section-header h3 {
    color: white;
    font-family: "ovo";
    display: inline-block;
    border-bottom: 1px solid #c6a77a;
}
li.fdm-section-header{
	border: none;
}
/*=====================================================================
Dimmi
======================================================================*/
.dimmi-button{
	position: fixed;
	right: 1%;
	bottom: 1%;
	z-index: 9999999;
}
/*=====================================================================
Facebook Posts / Icons
======================================================================*/
.fb_iframe_widget{

}

.fbIcon{
    display: inline-block;
    vertical-align: bottom;
}

div.cff-wrapper a{
	color: white;
}

.cff-page-name, #cff.cff-default-styles a{
	text-decoration: underline;
}
/*=====================================================================
Primary Menu Bar
======================================================================*/
.homeNavigation{
	background: rgba(0,0,0,.8);
    background: rgba(0, 0, 0, 0.75);
    border: 1px solid rgba(255, 255, 255, 0.8);
    border-top: none;
    border-bottom: none;
    max-width: 355px;
    width: 100%;
    height: 5%;
    padding: 2% 1% 0% 1%;
    display: flex;
    flex-direction: column;
    float: left;
}
.menuSection{
	position: relative;
}

.laBotteMenuLinks:before, .laBotteMenuLinks:after{
	content: "";
	position: absolute;
	left: 0;
	right: 0;
	margin: 0 auto;
	width: 75%;
    max-width: 300px;
	height: 1px;
    background: #c6a77a;
}
.laBotteMenuLinks:before{
	top: 10%;
}

.laBotteMenuLinks:after{
	bottom: 10%;
}
.laBotteMenuLinks p{
	line-height: 2.5em;
}
.laBotteLogoText{
}
.homeNavigation p{
    margin: 0;
    color: white;
    text-shadow: 0px 1px 2px rgba(192, 170, 133, 0.22);
}
.homeNavigation a{
    color: white;
    text-transform: uppercase;
    position: relative;
    font-size: 1.1em;
    transition: color .3s ease;
}
.mobileAnchor{
    height: 100%;
    display: none;
	
}
.address a{
	font-size: .9em;
	text-transform: none;
    text-decoration: underline;
}

.homeNavigation .address a:hover:before{
	width: 0%;
}

.laBotteMenuLinks .menu a:hover, .laBotteMenuLinks .menu li.current_page_item a{
    color: #ba9f6f;
}

.homeNavigation a:before{
	content: "";
	position: absolute;
	bottom: -1px;
	right: 0;
	left: 0;
	margin: 0 auto;
	width: 0%;
	height: 1px;
	background: white;
	transition: all .3s ease
}

.homeNavigation a:hover:before, .homeNavigation li.current_page_item a:before{
	width: 100%;
	background: #ba9f6f;
}
.homeNavigation h3{
    color: white;
    font-family: ovo;
    font-size: 1.2em;
}
.main-navigation ul li{
	clear: both;
	float: left;
}
.laBotteMenuLinks .menu{
	margin: 0;
}
.laBotteMenuLinks .menu a{
	color: white;
}
.laBotteMenuLinks .menu li{
	display: block;
	margin: 1em 0;
}

.openingHours, .address, footer p, .laBotteMenuLinks{
	text-align: center;
}
.openingHours p:nth-child(4), .openingHours p:nth-child(6){
	margin-top: .6em;
}
.openingHours p, footer p{
    font-size: .6em;
}
.menuSection{
	padding: 1em 0;
	overflow: auto;
}
.laBotteHeader{
	flex: 1;
}
.openingHoursLeft, .openingHoursRight{
	float: left;
	width: 50%;
	margin-top: 10%;
}

.openingHoursFull{
    width: 70%;
    text-align: center;
    margin: 0 auto;
}


/*=====================================================================
Main Div Blocks
======================================================================*/
.laBotteLogoWrap{
}
.laBotteMenuLinks{
	flex: 5;
    display: flex;
    justify-content: center;
    flex-direction: column;
    overflow: visible;
}
.openingHours{

}
.address{

}
.footer{
    flex: 0.2;
    overflow: visible;
}

/*=====================================================================
Main Page Content
======================================================================*/
.pageContent {
    background: rgba(0,0,0,.75);
    margin: 1% 0% 1% 1%;
    display: block;
    width: auto;
    float: left;
    max-width: 60%;
    color: white;
    max-height: 93%;
    padding: 1% 4% 1% 4%;
    border-radius: 10px;
    overflow: auto;
}
.pageContent h1{
	font-family: "ovo";
	color: white;
    width: auto;
    display: inline-block;
    border-bottom: 1px solid #c6a77a;
}
/*=====================================================================
Footer
======================================================================*/
footer{
	height: 100%;
	position: relative;
}

.homeNavigation footer p{
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    margin: auto;
}

/*=====================================================================
Gallery Page
======================================================================*/
.flexslider .slides li{
	display: none !important;
}
.flexslider .slides li.flex-active-slide{
	display: block !important;
}
/*=====================================================================
Background Images
======================================================================*/
.backgroundImages{
	position: fixed;
	width: 100%;
	height: 100%;
	z-index: 10;
}
.slides{
	list-style: none;
	margin: 0;
	padding: 0;
	height: 100%;
}
.slideImgs{
	display: none;
	height: 100%;
}
.slideImgs.display{
	display: block;
	animation: fadeInOut 7s;
}
.slideImgs.inactive{
}
.slides img{
    width: auto;
    height: auto;
    min-width: 100%;
    max-width: none;
    min-height: 100%;
    user-select: none;
}
#toggle-1{
	position: fixed;
    left: -1000px;
}

/*=====================================================================
@Keyframes
======================================================================*/
@keyframes fadeInOut{
	0%{opacity: .2;}
	15%{opacity: 1;}
	85%{opacity: 1;}
	100%{opacity: .2;}
}
@keyframes fadeOut{
	from{opacity: 0;}
	to{opacity: 1;}
}

/*=====================================================================
Media Query Overwrites
======================================================================*/

@media (max-width: 66.4989378333em){
	.col-full {
	    margin: 0;
	}

}

@media (min-width: 769px) and (min-height: 720px){
	.right-sidebar .content-area {
	    width: 100%;
	    margin: 0;
	}
	.homeNavigation{
		height: 100%;
	}
	.menuButton{
		display: none;
	}
	.mobileLogo{
		display: none;
	}
	
}

@media (min-height: 721px) and (max-height: 760px){
	.laBotteMenuLinks{
		padding: 0;
	}
}

@media (max-width: 769px), (max-height: 720px){

	.mobileAnchor{
	    display: block;
	}

	.mobileLogo{
		width: auto;
		height: 100%;
    	align-self: start;
	}
	.menuButton{
	    width: 40px;
	    height: 40px;
	    position: absolute;
	    right: 2%;
	    z-index: 9999999;
	    top: 0%;
	    cursor: pointer;
	    margin-top: 10px;
	}
	.menuButton:before, .menuButton:after{
		content: "";
		position: absolute;
   		width: 100%;
		height: 3px;
		border-radius: 4px;
		background: white;
		transition: all .4s ease;
	}
	.menuButton:before{
		top: 10%;
		transform: rotate(0deg);

	}
	.menuButton:after{
		bottom: 10%;
		transform: rotate(0deg);

	}
	.burgerPatty{
		position: absolute;
		width: 100%;
		height: 3px;
		background: white;
		border-radius: 4px;
		top: 0;
		bottom: 0;
		margin: auto 0;
		transform: translateX(0%);
		opacity: 1;
		transition: all .4s ease;
	}
	#toggle-1:checked ~ .menuButton{

	}
	#toggle-1:checked ~ .menuButton .burgerPatty{
		transform: translateX(-100%);
		opacity: 0;
	}

	#toggle-1:checked ~ .menuButton:before{
		top: 50%;
		transform: rotate(45deg);

	}
	#toggle-1:checked ~ .menuButton:after{
		bottom: 50%;
		transform: rotate(135deg);

	}

	#toggle-1:checked ~ .menuButton{
	}
	.laBotteLogo img{
		margin: 0 auto;
    	width: 60%;
    	max-width: 500px;
	}
	.pageContent{
    	max-width: none;
    	margin: 1%;
    	padding-bottom: 75px;
	}
	.col-full{
		max-width: 100%;
		height: auto;
		padding: 0;
	}
	#primary{
		width: 100%;
	}
	.slides img {
	    height: 100%;
	}
	.homeNavigation{
		width: 100%;
		max-width: 100%;
    	height: 60px;
    	padding: 5px;
    	border: none;
	}
	.homeNavigation div{
		display: none;
	}
	#toggle-1:checked ~ .homeNavigation{
		padding-top: 0%;
		height: 100%;
	}
	#toggle-1:checked ~ .homeNavigation div{
		display: block;
	}
	#toggle-1:checked ~ .homeNavigation .laBotteLogoWrap{
		
	}
	#toggle-1:checked ~ .homeNavigation .mobileLogo{
		display: none;
	}
	.menuSection{
		padding: .5em 0;
	}
	.laBotteMenuLinks .menu li {
	    margin: .5em 0;
	}
	.laBotteMenuLinks:before, .laBotteMenuLinks:after{
		display: none;
	}

}


@media (max-height: 800px){
	.laBotteMenuLinks:before{
		top: 0;
	}
	.laBotteMenuLinks:after{
		bottom: 0;
	}
}

/*=====================================================================
Extra CSS
======================================================================*/
.newsletter-page {
	border-radius: 5px;
	color: #fff;	
}


.newsletter-page input, textarea, option {
	font-size: 14px;
	letter-spacing: 3px;
	padding: 20px;
	margin: 2px auto;
	line-height: 11px;
	color: #fff; 
	background: transparent;
	border: #fff 2px solid;
}

.newsletter-page label {
	color: #fff; 
	width: 200px;
	text-align: left;
	text-transform: uppercase;
	letter-spacing: 2px;
	font-size: 12px;
	font-weight: 700;
	display: inline-block;
}

.newsletter-page input[type=submit] {
	width: 100%;
	max-width: 280px;
	font-size: 14px; 
	color: #fff; 
	text-transform: uppercase; 
	text-align: center;
	background: #ba9f6f; 
	border: 1px solid #ba9f6f; 
	letter-spacing: 4px;
	padding: 20px;
	margin-left: 202px;
}

.newsletter-page input[type=submit]:hover {
	color: #fff;  
	background: #90774b;
}

.form-news {
	margin: 2px auto;
	text-align: center;
	display: block;
}

.page-id-295 .entry-title {
	display: none;
}

.row {
    display: flex;
}

.column {
    flex: 50%;
    padding: 10px;
    height: 300px;
}

.spacer-menu {
	clear: both; 
	margin-top: -100px;
}

@media only screen and (max-width: 1280px) {
    .spacer-menu {
	clear: both; 
	margin-top: 0;
	}
}

.boxzilla.boxzilla-bottom-right {
	bottom: 100px !important;
}

.ui-datepicker-year { display:none }
