/*
Theme Name: metafox
Author: Sebastian Falk
Description: A small and easy responsive Layout
Tags: responsive, blank
*/

/* latin-ext */
@font-face {
  font-family: 'Kaushan Script';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(fonts/vm8vdRfvXFLG3OLnsO15WYS5DG72wNJHMw.woff2) format('woff2');
  unicode-range: U+0100-02AF, U+0304, U+0308, U+0329, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Kaushan Script';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(fonts/vm8vdRfvXFLG3OLnsO15WYS5DG74wNI.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* cyrillic-ext */
@font-face {
  font-family: 'Ubuntu';
  font-style: normal;
  font-weight: 300;
  font-display: swap;
  src: url(fonts/4iCv6KVjbNBYlgoC1CzjvWyNL4U.woff2) format('woff2');
  unicode-range: U+0460-052F, U+1C80-1C88, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
/* cyrillic */
@font-face {
  font-family: 'Ubuntu';
  font-style: normal;
  font-weight: 300;
  font-display: swap;
  src: url(fonts/4iCv6KVjbNBYlgoC1CzjtGyNL4U.woff2) format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* greek-ext */
@font-face {
  font-family: 'Ubuntu';
  font-style: normal;
  font-weight: 300;
  font-display: swap;
  src: url(fonts/4iCv6KVjbNBYlgoC1CzjvGyNL4U.woff2) format('woff2');
  unicode-range: U+1F00-1FFF;
}
/* greek */
@font-face {
  font-family: 'Ubuntu';
  font-style: normal;
  font-weight: 300;
  font-display: swap;
  src: url(fonts/4iCv6KVjbNBYlgoC1Czjs2yNL4U.woff2) format('woff2');
  unicode-range: U+0370-03FF;
}
/* latin-ext */
@font-face {
  font-family: 'Ubuntu';
  font-style: normal;
  font-weight: 300;
  font-display: swap;
  src: url(fonts/4iCv6KVjbNBYlgoC1CzjvmyNL4U.woff2) format('woff2');
  unicode-range: U+0100-02AF, U+0304, U+0308, U+0329, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Ubuntu';
  font-style: normal;
  font-weight: 300;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/ubuntu/v20/4iCv6KVjbNBYlgoC1CzjsGyN.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}


/* PRESETS */
* {margin: 0; padding: 0; position: relative; outline: none;}
html, body {height: 100%;}
ul, li {list-style: none;}
img, iframe {max-width: 100%; height: auto; border: 0;}
a, a:hover, a:active, a:focus, a:visited {text-decoration: none; outline: none;}
.hidden {display: none;}
.mobil {display: none;}
.clear {float: none; clear: both;}
a img {outline: none;}

/* TYPO */
h1, h2.as-h1 {font-size: 1.5em; margin-bottom: 0.5em; color: #3b7179; font-weight: bold; line-height: 1.25em; text-align: center; background-color: initial; padding: 0;}
h2 {font-size: 1.25em; margin-bottom: 0.5em; line-height: 1.25em; text-align: center; background-color: #3b7179; color: #fff; padding: 0.5em;}
h3 {font-size: 1em; margin-bottom: 0.5em; color: #3b7179; line-height: 1.25em; text-align: center;}
h4 {font-size: 1em; margin-bottom: 0.25em; color: #3b7179; line-height: 1.25em;}
h5 {font-size: 1em; margin-bottom: 0.25em; color: #3b7179; line-height: 1.25em;}
h6 {font-size: 1em; margin-bottom: 0.25em; color: #3b7179; line-height: 1.25em;}

/* BODY */
body, .wpcf7-textarea {font-family: 'Ubuntu', sans-serif;}
body {background-color: #588e96;}

/* STYLER */
#page-wrapper .the-content .col2 {float: left; width: 47%; color: #274a73; margin-bottom: 1em;}
#page-wrapper .the-content .col2.last {float: right; margin-right: 0;}
#page-wrapper .the-content .col2 i {width: 1.5em; text-align: center;}
#page-wrapper .the-content .col3 {float: left; width: 32.65%; margin-right: 1%; color: #274a73; margin-bottom: 1em;}
#page-wrapper .the-content .col3.last {float: right; margin-right: 0;}
#page-wrapper .the-content .col3 h2 {text-align: center;}
#page-wrapper .the-content .col3 h3 {background-color: #e6e3d7; padding: 0.5em; }
#page-wrapper .the-content ul {margin-left: 1em; margin-bottom: 1.5em;}
#page-wrapper .the-content ul li {list-style: disc; color: #333; margin-bottom: 0.5em; font-size: 1em;}
#page-wrapper .the-content ul li a {margin-bottom: 1em;}
#page-wrapper .the-content ol li {clear: both; float: none; margin-bottom: 1em; color: #274a73;}
#page-wrapper .the-content p {line-height: 1.75em; margin-bottom: 1em; font-size: 1em; color: #333;}
#page-wrapper .the-content a {color: #333; border-bottom: 1px dotted #3b7179;}
#page-wrapper .the-content table {color: #333; margin-bottom: 1.5em; font-size: 1em;}
#page-wrapper .the-content table tr td {padding-right: 0.5em;}
#page-wrapper .the-content a.cboxElement {color: initial; border-bottom: none;}
#page-wrapper .the-content hr {border: none; border-bottom: 1px solid #333; margin-bottom: 1.5em; margin-top: 0.5em;}

/* HEADER */
#header-wrapper {background-color: #588E96; width: 100%; position: relative; box-shadow: 0.125em 0.125em 0.5em #333; z-index: 999;}
#header-wrapper .header-wrapper-inner {width: 60em; margin: 0 auto; position: relative; height: 8.5em;}
#header-wrapper .logo-wrapper {position: absolute; bottom: -3em; z-index: 9999; left: -4em;}
#header-wrapper .logo {width: 14em; height: auto; display: block;}
.phone {position: absolute;	right: 0.5em; top: 1em;	font-size: 1.125em; text-align: right; color: #002F37; border: 1px solid; padding: 0.25em;}
.phone a {color: #002F37;}
.search {position: absolute; right: 0.5em; top: 1em;}
.search input {border: 1px solid #333; padding: 0.5em; width: 16em;}
.search #searchsubmit {background-color: #3b7179; color: #fff; padding: 0.5em 1em; cursor: pointer; width: 6em; transition: 0.5s ease background-color;}
.search #searchsubmit:hover, .search #searchsubmit:active, .search #searchsubmit:focus {background-color: #0B4149;}
.screen-reader-text {display: none;}

/* HEADER-NAVIGATION */
#header-navigation-wrapper {position: absolute; overflow: hidden; height: 2em; bottom: 0; right: 0em;}
ul.header-navigation li {float: left; margin-right: 1em;}
ul.header-navigation li:last-child {margin-right: 0;}
ul.header-navigation li.page_item a {float: left; margin-right: 0.5em; font-size: 1.125em;	color: #002F37; font-weight: bold;}
ul.header-navigation li.page_item.current_page_item a, ul.header-navigation li.current_page_parent a, ul.header-navigation li.page_item a:hover, ul.header-navigation li.page_item a:active, ul.header-navigation li.page_item a:focus {color: #fff;}
ul.header-navigation ul.children {display: none;}

/* PAGE-AREA */
#page {background-color: #7fb5bd;}
#page-wrapper {width: 60em; margin: 0 auto; background-color: #aae0e8;}
#page-wrapper .the-sidebar {float: left; width: 16.5em; padding: 2em;}
#page-wrapper .the-sidebar h3 {text-transform: uppercase;}
#page-wrapper .the-sidebar img {margin-bottom: 1em; padding: 0.25em; border: 1px solid #999; box-shadow: 0.125em 0.25em 0.5em #cecece; transition: ease 0.5s box-shadow; width: 100%; height: auto;}
#page-wrapper .the-sidebar img:hover {box-shadow: none;}
#page-wrapper .the-content {float: right; width: 39.5em;}
#page-wrapper .the-content .the-text {padding: 2em; padding-bottom: 1em;}
#page-wrapper .thumbnail-wrapper {padding: 0.5em; padding-bottom: 0.25em; border: solid 1px #999; box-shadow: 0.125em 0.25em 0.5em #cecece; margin-bottom: 1em;}
.action-button {margin-top: 1em; padding: 1em; display: block; text-align: center; background-color: #3b7179; color: #fff !important; width: 15.125em; transition: ease 0.5s background-color; cursor: pointer;}
.action-button:hover, .action-button:active, .action-button:focus {background-color: #588e96;}

/* SIDEBAR */
ul.sidebar-navigation li.page_item a {background-color: #00a1d3; color: #fff; padding: 0.5em; display: block; margin-bottom: 0.5em;}
ul.sidebar-navigation li.page_item.current_page_item a, ul.sidebar-navigation li.page_item a:hover, ul.sidebar-navigation li.page_item a:active, ul.sidebar-navigation li.page_item a:focus {background-color: #7a964e;}

/* SLIDER-AREA */
#slider {width: 60em; margin: 0 auto; margin-bottom: 1em;}
#slider-wrapper {overflow: hidden; height: 18.75em;}
#futionslider_436 .rp-title {background: initial !important; opacity: 1 !important; font-family: 'Kaushan Script', cursive !important; font-size: 2.25em !important; color: #ffffff; line-height: 1.5em !important; top: initial !important; margin-left: initial !important; bottom: 0.5em !important; right: 0.5em !important; text-shadow: 1px 2px 3px #000;}
.rslides_nav {opacity: 0.35 !important;}
.rslides_nav:hover {opacity: 1 !important;}

/* GALLERY-AREA */
.ngg-galleryoverview {margin-top: 0 !important; margin-bottom: 1em !important;}

/* BELEGUNGSPLAN */
.day-wrapper {float: left; width: 12.25%; margin-right: 1%; font-size: 0.75em; margin-bottom: 1em; text-align: center; padding: 0.5%; position: relative;}
.day-wrapper.half-day {background-image: url('images/anreisetag.jpg'); background-size: 100% 100%; background-repeat: no-repeat;}
.day-wrapper .fa {position: absolute; top: -0.35em; right: -0.35em; background-color: #fff; border-radius: 1em;}
.month-wrapper .fa {position: absolute; right: 1em;}
.month-wrapper {display: block; background-color: #3b7179; color: #fff; padding: 0.5em; text-align: center; margin-bottom: 1em; cursor: pointer; position: relative;}

.day-wrapper .fa.add-booking-half {top: 2.875em;}


/* FORMS & ADDITIONAL */
#page-wrapper .the-content .booking-fomular .col2 {color: #333;}
#page-wrapper .the-content .booking-fomular {color: #333;}
#page-wrapper .the-content .booking-fomular input {width: 100%; padding: 0.5em 0; border: 1px solid #999; background-color: #fff; margin-top: 0.25em; margin-bottom: 1em;}
#page-wrapper .the-content .booking-fomular textarea {width: 100%; padding: 0.5em 0; border: 1px solid #999; background-color: #fff; margin-top: 0.25em; margin-bottom: 1em; height: 10em;}
#page-wrapper .the-content .booking-fomular .error-message {background-color: #ff0000; color: #fff; padding: 0.25em 1em; font-weight: bold;}
#page-wrapper .the-content .booking-fomular .message-green {background-color: #5eaf2b; color: #fff; padding: 0.25em 1em; font-weight: bold;}
#page-wrapper .the-content .booking-fomular .message-grey {background-color: #999; color: #fff; padding: 0.25em 1em; font-weight: bold;}
#page-wrapper .the-content .booking-fomular table tr {margin-bottom: 1em;}
#page-wrapper .the-content .booking-fomular table tr td {padding-right: 1em; padding-bottom: 1em;}

.month {display: none;}

/* FOOTER */
#footer-wrapper {background-color: #588e96;}
#footer {margin: 0 auto; width: 60em; }
#footer-inner {padding: 2em; color: #fff}
#footer-inner a {color: #fff}
ul.footer-navigation {float: left; }
ul.footer-navigation li {float: left; margin-right: 1em;}
.copyright {float: right;}

/* SPECIALS */
.datenschutz h3 {text-align: left;}
body.buchen #page-wrapper .the-content .col2 {margin-bottom: 0;}
#cboxCurrent {display: none !important;}

.info-message {background-color: #3b7179; padding: 0.5em 1em; margin-bottom: 1em;}
.info-message p {color: #fff !important;}
.info-message h3 {color: #fff !important;}
.info-message a {color: #fff !important;}

/* MOBIL PRESETS */
.mobil {display: none;}
#mobil-navigation-top {text-align: center; background-color: #3b7179;}
#mobil-navigation-top a {color: #fff; display: inline-block; font-size: 1.75em; margin: 0 0.125em; padding: 0.5em;}
#mobil-navigation-bottom h2 {color: #fff; background-color: #3b7179; font-size: 1.25em; text-transform: uppercase; padding: 1em; text-align: center; margin-top: 0; margin-bottom: 0;}
#to-top-button {text-align: center; background-color: #3b7179;}
#to-top-button a {color: #fff; display: inline-block; font-size: 1.75em; margin: 0 0.125em;	padding: 0.5em;}
#mobil-navigation-bottom ul.navigation li.page_item a {padding: 1em 2em; background-color: #80b6be; color: #fff; display: block; border-bottom: 1px solid #004972;}
#mobil-navigation-bottom ul.navigation li.current_page_item a, #mobil-navigation-bottom ul.navigation li.page_item a:hover, #mobil-navigation-bottom ul.navigation li.page_item a:active, #mobil-navigation-bottom ul.navigation li.page_item a:focus {background-color: #588e96;}
#mobil-navigation-bottom ul.navigation ul.children li a {font-size: 0.875em; padding-left: 3em; background-color: #21c2f3;}

@media only screen and (min-width : 12.5em) and (max-width : 60em)
{
	body {font-size: 100%;}
	/* HIDE INS */
	.mobil {display: block;}
	
	/* HIDE OUTS */
	#header-navigation-wrapper {display: none;}
	#footer-wrapper {display: none;}
	.search, .phone {display: none;}
	.datenschutzerklaerung .the-sidebar {display: none;}
	.haftungsausschluss .the-sidebar {display: none;}
	.impressum .the-sidebar {display: none;}
	.the-sidebar {display: none;}
	
	/* RESETS */
	#header-wrapper {position: relative; box-shadow: none;}
	#header-wrapper .header-wrapper-inner {width: auto; height: auto;}
	#header-wrapper .logo-wrapper {position: relative; bottom: initial; z-index: initial; left: initial; text-align: center; margin: 0 auto;}
	#header-wrapper .logo {max-width: 80%; height: auto; display: block; margin: 0 auto; padding: 2em;}
	
	#page {padding: 0;}
	#slider-wrapper {display: none;}
	
	#page-wrapper {width: auto;}
	#page-wrapper .the-content, #page-wrapper .the-sidebar {float: none; width: auto; padding: 0;}
	#page-wrapper .the-sidebar {padding: 2em;}
	.action-button {width: auto;}
	
	#page-wrapper .the-content .col3, #page-wrapper .the-content .col3.last, #page-wrapper .the-content .col2, #page-wrapper .the-content .col2.last {float: none; width: auto; margin: 0 auto; margin-bottom: 1em;}
	
	.day-wrapper {font-size: 0.5em;}
	#page-wrapper .the-content img {max-width: 100%; width: 100%; height: auto; display: block;}
	
}