/**
 * @Author: Alexander Harms <alexander>
 * @Email:  lexs.org@gmail.com
 * @Filename: template.css
 * @Last modified by:   alexander
 * @License: my own
 * @Copyright: Alexander Harms
 */



@charset "UTF-8";

/* <--- Fonts ---> */
@font-face {
    font-family: 'Roboto';
    font-style: normal;
    font-weight: 300;
    src: local('Roboto Light'), local('Roboto-Light'), url("../fonts/google_fonts/Hgo13k-tfSpn0qi1SFdUfT8E0i7KZn-EPnyo3HZu7kw.woff") format('woff');
}

@font-face {
    font-family: 'Roboto';
    font-style: normal;
    font-weight: 400;
    src: local('Roboto'), local('Roboto-Regular'), url("../fonts/google_fonts/2UX7WLTfW3W8TclTUvlFyQ.woff") format('woff');
}

@font-face {
    font-family: 'Roboto';
    font-style: normal;
    font-weight: 500;
    src: local('Roboto Medium'), local('Roboto-Medium'), url("../fonts/google_fonts/RxZJdnzeo3R5zSexge8UUT8E0i7KZn-EPnyo3HZu7kw.woff") format('woff');
}

@font-face {
    font-family: 'Roboto';
    font-style: normal;
    font-weight: 700;
    src: local('Roboto Bold'), local('Roboto-Bold'), url("../fonts/google_fonts/d-6IYplOFocCacKzxwXSOD8E0i7KZn-EPnyo3HZu7kw.woff") format('woff');
}

@font-face {
    font-family: 'Roboto';
    font-style: italic;
    font-weight: 300;
    src: local('Roboto Light Italic'), local('Roboto-LightItalic'), url("../fonts/google_fonts/7m8l7TlFO-S3VkhHuR0at4bN6UDyHWBl620a-IRfuBk.woff") format('woff');
}

@font-face {
    font-family: 'Roboto';
    font-style: italic;
    font-weight: 400;
    src: local('Roboto Italic'), local('Roboto-Italic'), url("../fonts/google_fonts/1pO9eUAp8pSF8VnRTP3xnvesZW2xOQ-xsNqO47m55DA.woff") format('woff');
}

@font-face {
    font-family: 'Roboto';
    font-style: italic;
    font-weight: 500;
    src: local('Roboto Medium Italic'), local('Roboto-MediumItalic'), url("../fonts/google_fonts/OLffGBTaF0XFOW1gnuHF0YbN6UDyHWBl620a-IRfuBk.woff") format('woff');
}

@font-face {
    font-family: 'Roboto';
    font-style: italic;
    font-weight: 700;
    src: local('Roboto Bold Italic'), local('Roboto-BoldItalic'), url("../fonts/google_fonts/t6Nd4cfPRhZP44Q5QAjcC4bN6UDyHWBl620a-IRfuBk.woff") format('woff');
}

/* <--- Fonts: Bebas ---> */
@font-face {
    font-family: 'Bebas';
    font-weight: normal;
    font-style: normal;
    src: url("../fonts/BebasNeue-webfont.eot");
    src: url("../fonts/BebasNeue-webfont.eot?#iefix") format("eot"), url("../fonts/BebasNeue-webfont.woff") format("woff"), url("../fonts/BebasNeue-webfont.ttf") format("truetype");
}

/* <-- Fonts: Arial Black ---> */
@font-face {
    font-family: 'Arial Black';
    font-weight: normal;
    font-style: normal;
    src: local('Arial Black'), local('ArialBlack-Regular'), url("../fonts/ArialBlack-webfont.woff") format("woff"), url("../fonts/ArialBlack-webfont.ttf") format("truetype");
}

/* <--- Template ---> */
* {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}

html {
	height: 100%;
}

body {
	height: 100%;
    background: #FAFAFA;
    color: #424242;
    font-family: 'Roboto', Arial, Verdana, Helvetica;
    font-size: 16px;
    line-height: 1.5;
}

/* <--- Lables, Inputs, Textareas, Buttons, Selectbox ---> */
label {
	cursor: pointer;
}

input[type=submit], button, .btn, .button {
	height: 32px;
	padding: 0 2rem;
	background: #99BD00;
	color: #FFF;
	font-family: 'Roboto', Arial, Verdana, Helvetica;
	font-size: 1rem;
	line-height: 32px;
	text-transform: uppercase;
	letter-spacing: 0.5px;
	display: inline-block;
	border: none;
	cursor: pointer;
	-webkit-transition: all 0.2s ease;
	-moz-transition: all 0.2s ease;
	-o-transition: all 0.2s ease;
	transition: all 0.2s ease;
	-webkit-border-radius: 2px;
	-moz-border-radius: 2px;
	border-radius: 2px;
	-webkit-box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.16), 0 2px 10px 0 rgba(0, 0, 0, 0.12);
    -moz-box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.16), 0 2px 10px 0 rgba(0, 0, 0, 0.12);
    box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.16), 0 2px 10px 0 rgba(0, 0, 0, 0.12);
    /* Hack for apple faggots */
    -webkit-appearance: none;
}

input[type=submit]:hover, button:hover, .btn:hover, .button:hover {
	background: #424242;
	color: #FFF;
	-webkit-box-shadow: 0 5px 11px 0 rgba(0, 0, 0, 0.18), 0 4px 15px 0 rgba(0, 0, 0, 0.15);
	-moz-box-shadow: 0 5px 11px 0 rgba(0, 0, 0, 0.18), 0 4px 15px 0 rgba(0, 0, 0, 0.15);
	box-shadow: 0 5px 11px 0 rgba(0, 0, 0, 0.18), 0 4px 15px 0 rgba(0, 0, 0, 0.15);
}

input[type=text], input[type=password], input[type=color],
input[type=date], input[type=datetime], input[type=datetime-local],
input[type=email], input[type=month], input[type=number],
input[type=range], input[type=search], input[type=tel],
input[type=time], input[type=url], input[type=week], textarea, select {
	margin: 0;
	padding: 8px;
	background: #EEE;
	color: #616161;
	font-family: 'Roboto', Arial, Verdana, Helvetica;
	font-size: 0.9rem;
	border: 1px solid #E0E0E0;
	-webkit-transition: all 0.2s ease;
	-moz-transition: all 0.2s ease;
	-o-transition: all 0.2s ease;
	transition: all 0.2s ease;
	-webkit-border-radius: 2px;
	-moz-border-radius: 2px;
	border-radius: 2px;
	-webkit-box-shadow: none;
	-moz-box-shadow: none;
	box-shadow: none;
    /* Hack for apple faggots */
    -webkit-appearance: none;
}

select {
	padding: 8px 0;
}

textarea {
	min-width: 128px;
	min-height: 128px;
}

input[type=text]:hover, input[type=password]:hover,
input[type=color]:hover, input[type=date]:hover,
input[type=datetime]:hover, input[type=datetime-local]:hover,
input[type=email]:hover, input[type=month]:hover,
input[type=number]:hover, input[type=range]:hover,
input[type=search]:hover, input[type=tel]:hover,
input[type=time]:hover, input[type=url]:hover,
input[type=week]:hover, textarea:hover, select:hover {
	border-color: #BDBDBD;
}

input[type=text]:focus, input[type=password]:focus,
input[type=color]:focus, input[type=date]:focus,
input[type=datetime]:focus, input[type=datetime-local]:focus,
input[type=email]:focus, input[type=month]:focus,
input[type=number]:focus, input[type=range]:focus,
input[type=search]:focus, input[type=tel]:focus,
input[type=time]:focus, input[type=url]:focus,
input[type=week]:focus, textarea:focus, select:focus {
	background: #FAFAFA;
	color: #212121;
	border-color: #BDBDBD;
}

input[type=checkbox], input[type=radio] {
	top: 2px;
	position: relative;
}

/* <--- Images ---> */
img {
    max-width: 100%;
    height: auto;
    max-height: 100%;
    display: block; /* Remove whitespace below image */
}

/* <--- Heading ---> */
h1, h2, h3, h4, h5, h6 {
    font-weight: normal;
}

h1 a, h2 a, h3 a, h4 a, h5 a, h6 a {
    font-weight: inherit;
}

h1 {
    margin: 0 0 0.9em;
    font-size: 2.25em;
}

h2 {
    margin: 0 0 0.8em;
    font-size: 2em;
}

h3 {
    margin: 0 0 0.7em;
    font-size: 1.75em;
}

h4 {
    margin: 0 0 0.6em;
    font-size: 1.5em;
}

h5 {
    margin: 0 0 0.5em;
    font-size: 1.25em;
}

h6 {
    margin: 0 0 0.4em;
    font-size: 1em;
}

/* <--- Text styles ---> */
em, .italic {
    font-style: italic;
}

strong, .bold {
    font-weight: bold;
}

small, .small {
    font-size: 0.75em;
}

sup {
    top: -0.35em;
    font-size: 0.65em;
    line-height: 1em;
    display: inline-block;
    position: relative;
}

/* <--- Paragraph ---> */
p {
    padding: 0 0 1em;
}

/* <--- Tables ---> */
table {
	width: 100%;
	margin: 0 0 1em;
	text-align: left;
}

/* <--- Links ---> */
a {
	color: #99BD00;
	text-decoration: none;
	-webkit-transition: all 0.2s ease;
	-moz-transition: all 0.2s ease;
	-o-transition: all 0.2s ease;
	transition: all 0.2s ease;
}

a:hover {
	color: #424242;
}

/* <--- Others ---> */
hr {
	margin: 16px 0;
	border-width: 0 0 1px;
	border-style: solid;
	border-color: #E0E0E0;
}

/* <--- Cookie info box ---> */
body > .alert-info {
	top: 0;
	left: 0;
	width: 100%;
	padding: 16px 24px;
	background: #99BD00;
	color: #FFF;
	font-size: 12px;
	position: fixed;
	z-index: 150;
    -webkit-box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.16), 0 2px 10px 0 rgba(0, 0, 0, 0.12);
	-moz-box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.16), 0 2px 10px 0 rgba(0, 0, 0, 0.12);
	box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.16), 0 2px 10px 0 rgba(0, 0, 0, 0.12);
}

body > .alert-info .close {
	top: 16px;
	right: 16px;
    width: 28px;
    height: 28px;
    background: rgba(255, 255, 255, 0.1);
	color: #FFF;
	font-size: 20px;
	font-style: normal;
    text-align: center;
	line-height: 28px;
	position: absolute;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    border-radius: 50%;
}

body > .alert-info h4 {
	margin: 0 0 8px;
	font-weight: bold;
}

body > .alert-info p {
	padding: 0;
}

body > .alert-info a {
	color: #FFF;
	font-weight: bold;
	font-style: italic;
}

body > .alert-info a:hover {
	color: #303032;
}

/* <--- Intro ---> */
#intro {
    height: 100%;
    background-color: #EEE;
	background-image: url("../images/noise.png"), url("../images/intro.jpg");
	background-repeat: repeat, no-repeat;
	background-attachment: scroll;
	background-position: top left, center;
	background-size: auto, cover;
	color: #FFF;
	font-family: 'Bebas', 'Roboto', Arial, Helvetica;
    position: relative;
    z-index: 1;
}

/* <--- Main intro container ---> */
#intro .container {
	top: 50%;
	left: 50%;
	text-align: center;
	position: absolute;
	-webkit-transform: translate(-50%, -50%);
	-moz-transform: translate(-50%, -50%);
	-ms-transform: translate(-50%, -50%);
	-o-transform: translate(-50%, -50%);
	transform: translate(-50%, -50%);
}

/* <--- Logo ---> */
#intro .container .logo {
	font-family: 'Arial Black', Arial, Helvetica, Verdana;
	text-shadow: 0 0 12px #000;
}

#intro .container .logo h1 {
	margin: 0;
	font-size: 68px;
	line-height: 80px;
}

#intro .container .logo h1 a {
	color: #FFF;
	position: relative;
}

#intro .container .logo h1 a:hover,
#intro .container .logo h2 a:hover {
	color: inherit;
}

#intro .container .logo h1 sup {
	top: 8px;
	margin-left: 4px;
	color: #99BD00;
	font-family: Arial;
	font-size: 24px;
	position: absolute;
}

#intro .container .logo h1 .subtitle {
	margin: 0;
	color: #99BD00;
	font-size: 24px;
	line-height: 32px;
	display: block;
}

/* <--- Call to Action ---> */
#intro .container .call-to-action {
    width: 576px;
    /*height: 50px; /*Andrej*/
	margin: 0 0 0; /* 32 0 0 Andrej */
    padding: 8px;
    background: rgba(48, 48, 50, 0.9);
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;
    -webkit-box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.16), 0 2px 10px 0 rgba(0, 0, 0, 0.12);
    -moz-box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.16), 0 2px 10px 0 rgba(0, 0, 0, 0.12);
    box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.16), 0 2px 10px 0 rgba(0, 0, 0, 0.12);
}

#intro .container .call-to-action .d21Container {
    height: 96px;
    font-family: 'Roboto', Arial, Verdana, Helvetica;
    font-size: 16px;
    font-weight: normal;
}

#intro .container .call-to-action .d21Container > div {
    width: 152px;
    height: 56px;
    margin: 0;
    text-align: left;
    display: inline-block;
    vertical-align: top;
}

#intro .container .call-to-action .d21Container .d21Header,
#intro .container .call-to-action .d21Container .d21Cal {
    display: none;
}

#intro .container .call-to-action .d21Container .d21Col {
    float: none;
}

#intro .container .call-to-action .d21Container .d21Col input {
    width: 100%;
    height: 32px;
    margin: 0;
	padding: 8px;
	background: #EEE;
	color: #616161;
	font-family: 'Roboto', Arial, Verdana, Helvetica;
	font-size: 0.9rem;
	border: 1px solid #E0E0E0;
	-webkit-transition: all 0.2s ease;
	-moz-transition: all 0.2s ease;
	-o-transition: all 0.2s ease;
	transition: all 0.2s ease;
	-webkit-border-radius: 2px;
	-moz-border-radius: 2px;
	border-radius: 2px;
	-webkit-box-shadow: none;
	-moz-box-shadow: none;
	box-shadow: none;
}

#intro .container .call-to-action .d21Container .d21Col input:hover {
	border-color: #BDBDBD;
}

#intro .container .call-to-action .d21Container .d21Col input:focus {
    background: #FAFAFA;
	color: #212121;
	border-color: #BDBDBD;
}

#intro .container .call-to-action .d21Container .d21CheckIn,
#intro .container .call-to-action .d21Container .d21CheckOut {
    width: auto;
    height: 24px;
    padding: 0;
    font-size: 12px;
    text-transform: uppercase;
    text-indent: -4px;
    line-height: 24px;
    letter-spacing: 1px;
    float: none;
}

#intro .container .call-to-action .d21Container .d21Row3 > div {
    margin: 0;
    padding: 24px 0 0;
    display: inline-block;
    float: none;
}

#intro .container .call-to-action .d21Container .d21Row3 .d21Count {
    width: 40px;
}

#intro .container .call-to-action .d21Container .d21Row3 .d21Row4 {
    width: 108px;
}

#intro .container .call-to-action .d21Container .d21Row3 select {
    width: 100%;
    height: 32px;
    margin: 0;
    padding: 0;
    font-family: 'Roboto', Arial, Verdana, Helvetica;
	font-size: 0.9rem;
	border: 1px solid #E0E0E0;
}

#intro .container .call-to-action .d21Container .d21Row5 {
    width: 88px;
}

#intro .container .call-to-action .d21Container .d21Row5 input {
    width: 100%;
    height: 32px;
    margin: 24px 0 0;
    padding: 0;
    background: #99BD00;
    color: #FFF;
    font-size: 12px;
    text-transform: uppercase;
    letter-spacing: 1px;
    border: none;
    cursor: pointer;
    -webkit-transition: background 0.2s ease;
    -moz-transition: background 0.2s ease;
    -ms-transition: background 0.2s ease;
    -o-transition: background 0.2s ease;
    transition: background 0.3s ease;
    -webkit-border-radius: 2px;
    -moz-border-radius: 2px;
    border-radius: 2px;
    -webkit-box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.16), 0 2px 10px 0 rgba(0, 0, 0, 0.12);
    -moz-box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.16), 0 2px 10px 0 rgba(0, 0, 0, 0.12);
    box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.16), 0 2px 10px 0 rgba(0, 0, 0, 0.12);
}

#intro .container .call-to-action .d21Container .d21Row5 input:hover {
    background: #424242;
}

#intro .container .call-to-action .d21Container .d21Row6 {
    right: 0;
    bottom: 0;
    width: auto;
    height: 24px;
    line-height: 24px;
    position: absolute;
    display: none;
}

#intro .container .call-to-action .d21Container .d21Row6 a {
    font-size: 12px;
    text-transform: uppercase;
    letter-spacing: 1px;
}

#intro .container .call-to-action .d21Container .d21Row6 a:hover {
    color: #FFF;
}

/* <--- Call to action - Calendar ---> */
#intro .call-to-action #scw {
    top: 32px !important;
    width: 224px;
    margin: 0;
    background: #FAFAFA;
    font-family: 'Roboto', Arial, Verdana, Helvetica;
    border: none;
    -webkit-border-radius: 2px;
    -moz-border-radius: 2px;
    border-radius: 2px;
    -webkit-box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.16), 0 2px 10px 0 rgba(0, 0, 0, 0.12);
    -moz-box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.16), 0 2px 10px 0 rgba(0, 0, 0, 0.12);
    box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.16), 0 2px 10px 0 rgba(0, 0, 0, 0.12);
    -webkit-transform: translate(-100%, -50%);
    -moz-transform: translate(-100%, -50%);
    -ms-transform: translate(-100%, -50%);
    -o-transform: translate(-100%, -50%);
    transform: translate(-100%, -50%);
}

#intro .call-to-action #scw .scw {
    padding: 0;
}

#intro .call-to-action #scw .scw table {
    margin: 0;
}

#intro .call-to-action #scw .scw table td.scwHead:first-child,
#intro .call-to-action #scw .scw table td.scwHead:last-child {
    width: 32px;
    height: 48px;
    position: relative;
    vertical-align: top;
}

#intro .call-to-action #scw .scw table td.scwHead #scwHeadLeft,
#intro .call-to-action #scw .scw table td.scwHead #scwHeadRight {
    width: 24px;
    height: 40px;
    margin: 4px;
    background: #99BD00;
    color: #FFF;
    font-family: 'Roboto', Arial, Verdana, Helvetica;
    font-size: 16px;
    border: none;
    cursor: pointer;
    -webkit-transition: background 0.2s ease;
    -moz-transition: background 0.2s ease;
    -o-transition: background 0.2s ease;
    transition: background 0.2s ease;
}

#intro .call-to-action #scw .scw table td.scwHead #scwHeadLeft:hover,
#intro .call-to-action #scw .scw table td.scwHead #scwHeadRight:hover {
    background: #424242;
}

#intro .call-to-action #scw .scw table td.scwHead #scwMonths,
#intro .call-to-action #scw .scw table td.scwHead #scwYears {
    width: 72px;
    height: 40px;
    margin: 4px;
    padding: 0;
}

#intro .call-to-action #scw .scw table.scwCells {
    width: 100%;
    margin: 8px 0 0;
    font-family: 'Roboto', Arial, Verdana, Helvetica;
    font-size: 12px;
    text-align: center;
}

#intro .call-to-action #scw .scw table.scwCells thead {
    display: none;
}

#intro .call-to-action #scw .scw table.scwCells #scwCells tr td {
    width: 32px;
    height: 32px;
    padding: 0;
    color: #424242;
    font-weight: normal;
    line-height: 32px;
    border: none;
}

#intro .call-to-action #scw .scw table.scwCells #scwCells tr td.scwCellsExMonth {
    background: #BDBDBD;
    color: #757575;
}

#intro .call-to-action #scw .scw table.scwCells #scwCells tr td.scwCells {
    background: none;
    color: #424242;
}

#intro .call-to-action #scw .scw table.scwCells #scwCells tr td.scwCellsWeekend {
    background: #E0E0E0;
    color: #424242;
}

#intro .call-to-action #scw .scw table.scwCells #scwCells tr td.scwCells:hover,
#intro .call-to-action #scw .scw table.scwCells #scwCells tr td.scwCellsWeekend:hover {
    background: #424242;
    color: #FFF;
}

#intro .call-to-action #scw .scw table.scwCells #scwCells tr td.scwInputDate {
    background: #99BD00;
    color: #FFF;
}

/* <--- Language switcher ---> */
#intro .container .call-to-action .languageSwitcher {
    bottom: 8px;
    left: 8px;
    position: absolute;
}

#intro .container .call-to-action .languageSwitcher li {
	margin: 0 4px 0 0;
    display: inline-block;
}

#intro .container .call-to-action .languageSwitcher li a {
	width: 40px;
	height: 20px;
	margin: 0;
	background-color: #303032;
	background-position: center;
	background-repeat: no-repeat;
	background-size: cover;
	display: block;
	-webkit-border-radius: 2px;
	-moz-border-radius: 2px;
	border-radius: 2px;
	-webkit-box-shadow: inset 0 0 8px #000;
	-moz-box-shadow: inset 0 0 8px #000;
	box-shadow: inset 0 0 8px #000;
}

#intro .container .call-to-action .languageSwitcher li:nth-child(1) a {
	background-image: url(../images/noise.png), url(../images/languages/germany.svg);
}

#intro .container .call-to-action .languageSwitcher li.lang-active:nth-child(1) a,
#intro .container .call-to-action .languageSwitcher li:nth-child(1):hover a {
	background-image: url(../images/languages/germany.svg);
	-webkit-box-shadow: inset 0 0 4px #000;
	-moz-box-shadow: inset 0 0 4px #000;
	box-shadow: inset 0 0 4px #000;
}

#intro .container .call-to-action .languageSwitcher li:nth-child(2) a {
	background-image: url(../images/noise.png), url(../images/languages/union-jack.svg);
}

#intro .container .call-to-action .languageSwitcher li.lang-active:nth-child(2) a,
#intro .container .call-to-action .languageSwitcher li:nth-child(2):hover a {
	background-image: url(../images/languages/union-jack.svg);
	-webkit-box-shadow: inset 0 0 4px #000;
	-moz-box-shadow: inset 0 0 4px #000;
	box-shadow: inset 0 0 4px #000;
}

#intro .container .call-to-action .languageSwitcher li img {
	display: none;
}


/* <--- Price ---> */
#intro .container .price {
	bottom: 50%;
	left: 0;
	width: 152px;
	position: absolute;
	-webkit-transform: translate(-88px, 48px) rotate(-25deg);
	-moz-transform: translate(-88px, 48px) rotate(-25deg);
	-ms-transform: translate(-88px, 48px) rotate(-25deg);
	-o-transform: translate(-88px, 48px) rotate(-25deg);
	transform: translate(-88px, 48px) rotate(-25deg);
}

/* WAZ */
#intro .waz {
    top: 8px;
    right: 8px;
    position: absolute;
}

#intro .waz .logo {
    width: 128px;
    height: 128px;
    position: relative;
    overflow: hidden;
}

#intro .waz .logo img {
    top: 0;
    left: 0;
    width: 128px;
    height: 128px;
    position: absolute;
    z-index: 0;
}

#intro .waz .logo img.hover {
    opacity: 0;
    z-index: 1;
    -webkit-transition: opacity 0.2s ease;
    -moz-transition: opacity 0.2s ease;
    -o-transition: opacity 0.2s ease;
    transition: opacity 0.2s ease;
}

#intro .waz:hover .logo img.hover {
    opacity: 1;
}

#intro .waz p {
    color: #FFF;
    font-size: 20px;
    line-height: 24px;
    text-align: center;
}

#intro .waz:hover p {
    color: #FFF;
}

#intro .waz p span {
    color: #656565;
    -webkit-transition: color 0.2s ease;
    -moz-transition: color 0.2s ease;
    -o-transition: color 0.2s ease;
    transition: color 0.2s ease;

}

#intro .waz p sub {
    color: #656565;
    display: block;
    -webkit-transition: color 0.2s ease;
    -moz-transition: color 0.2s ease;
    -o-transition: color 0.2s ease;
    transition: color 0.2s ease;
}

#intro .waz:hover p span, #intro .waz:hover p sub {
    color: #FF008C;
}

/* <--- Main menu ---> */
#mainMenu {
	top: -64px;
	height: 0;
	position: relative;
	z-index: 100;
}

#mainMenu.sticky {
	top: 0;
	left: 0;
	width: 100%;
	height: 64px;
	position: fixed;
	-webkit-box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.16), 0 2px 10px 0 rgba(0, 0, 0, 0.12);
	-moz-box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.16), 0 2px 10px 0 rgba(0, 0, 0, 0.12);
	box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.16), 0 2px 10px 0 rgba(0, 0, 0, 0.12);
}

#mainMenu > nav {
    height: 64px;
	background: rgba(48, 48, 50, 0.95);
	text-align: center;
    overflow: hidden;
}

#mainMenu .logo {
    width: 0;
    height: 64px;
    opacity: 0;
    overflow: hidden;
    float: left;
    -webkit-transition: all 0.2s ease;
    -moz-transition: all 0.2s ease;
    -o-transition: all 0.2s ease;
    transition: all 0.2s ease;
}

#mainMenu.sticky .logo {
    width: 154px;
    opacity: 1;
}

#mainMenu .logo h1 {
    margin: 0;
}

#mainMenu .logo h1 a {
    color: #FFF;
    padding: 0 8px;
    font-family: "Arial Black", Arial, Helvetica, Verdana;
    font-size: 24px;
    line-height: 64px;
    text-align: center;
    text-shadow: 1px 1px 1px #000;
    position: relative;
}

#mainMenu .logo h1 a sup {
    top: 0;
    right: 4px;
    font-family: Arial;
    font-size: 14px;
    position: absolute;
}

#mainMenu > nav > .mobileMenuButton {
	width: 64px;
	height: 64px;
	color: #99BD00;
	font-size: 32px;
	text-align: center;
	line-height: 64px;
	display: none;
	cursor: pointer;
}

#mainMenu > nav > .mobileMenuButton:hover {
	color: #FFF;
}

#mainMenu > nav > ul {
	margin: 0;
	padding: 0;
    float: right;
}

#mainMenu > nav > ul li {
	display: inline-block;
}

#mainMenu > nav > ul li a {
	height: 64px;
	padding: 0 20px;
	color: #99BD00;
	font-family: 'Bebas', 'Roboto', Arial, Verdana, Helvetica;
	font-size: 20px;
	line-height: 64px;
	letter-spacing: 2px;
	display: block;
}

#mainMenu > nav > ul li a.active,
#mainMenu > nav > ul li a:hover {
	color: #FFF;
}

#mainMenu > nav > ul li a.mobile {
	display: none;
}

#mainMenu > nav > ul li a.waz {
	width: 168px;
	height: 192px;
	margin: 0 auto;
	padding: 128px 0 0;
	background-image: url(../images/waz-logo-uhr-hover.png);
	background-position: center 0;
	background-repeat: no-repeat;
	background-size: 128px;
	text-align: center;
	line-height: 32px;
	border: none;
}

/* <--- Mobile booking ---> */
#mobileBooking {
    padding: 16px;
    position: relative;
    display: none;
}

#mobileBooking .row {
    margin: 0 0 24px;
}

#mobileBooking .row label {
    margin: 0 0 8px;
    text-align: center;
    text-transform: uppercase;
    letter-spacing: 4px;
    display: block;
}

#mobileBooking .row label .info {
    margin: 0 0 0 8px;
    color: #757575;
    font-size: 12px;
    letter-spacing: 0;
}

#mobileBooking .row input[type=date] {
    width: 100%;
}

#mobileBooking #d21CountMobile {
    width: 15%;
    text-align: center;
}

#mobileBooking #d21RoomMobile {
    width: calc(85% - 8px);
    float: right;
}

/* <--- Main content ---> */
main {
	background: #FFF;
}

main ul {
	padding: 0 0 1em 32px;
	list-style: disc outside;
}

/* <--- Content: Blog items ---> */
main .blog section {
	clear: both;
	position: relative;
}

main .blog section .item-image {
	height: 320px;
	position: relative;
}

main .blog section .item-image.parallax-image-container {
	background-attachment: fixed; /* fixed */
	background-position: center;
	background-size: cover;
}

.andrej-test {
	color: yellow;
}

@media (max-device-width: 1100px){

	main .blog section .item-image.parallax-image-container {
		background-attachment: scroll; 
		background-position: center;
		background-size: cover;
	}

	.andrej-test {
		color: red;
	}
}



/*
@media only screen and (max-width: 1024px) {
    background-attachment: scroll; 
}
*/
/*
@supports (overflow:-webkit-marquee) and (justify-content:inherit)  { 

@media screen and (-webkit-min-device-pixel-ratio:0) {
	background-attachment: scroll; 
}
*/
main .blog section .item-image p {
	top: 50%;
	left: 50%;
	height: 48px;
	padding: 0 16px;
	background: #303032;
	color: #FF008C; /*Pink*/
	font-family: 'Bebas', 'Roboto', Arial, Verdana, Helvetica;
	font-size: 24px;
	line-height: 48px;
	letter-spacing: 3px;
	position: absolute;
	-webkit-border-radius: 4px;
	-moz-border-radius: 4px;
	border-radius: 4px;
	-webkit-box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.16), 0 2px 10px 0 rgba(0, 0, 0, 0.12);
	-moz-box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.16), 0 2px 10px 0 rgba(0, 0, 0, 0.12);
	box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.16), 0 2px 10px 0 rgba(0, 0, 0, 0.12);
	-webkit-transform: translate(-50%, -50%);
	-moz-transform: translate(-50%, -50%);
	-ms-transform: translate(-50%, -50%);
	-o-transform: translate(-50%, -50%);
	transform: translate(-50%, -50%);
}

main .blog section .page-header h2 {
	margin: 0;
	padding: 32px 32px 0;
	color: #cd7f32; /*bronze*/
	font-family: 'Bebas', 'Roboto', Arial, Verdana, Helvetica;
	letter-spacing: 1.5px;
}

main .blog section .icons {
	top: 352px;
	right: 32px;
	position: absolute;
}

main .blog section article {
	padding: 32px 32px 64px;
	position: relative;
}

main .blog section article:after {
	content: '';
	clear: both;
	display: block;
}

/* <--- Content: Features ---> */
main .blog section .aappartel-icons {
	text-align: center;
}

main .blog section .aappartel-icons > div {
	width: 168px;
	height: 64px;
	background-position: left center;
	background-repeat: no-repeat;
	background-size: 32px auto;
	color: #424242;
	font-family: 'Bebas', 'Roboto', Arial, Verdana, Helvetica;
	font-size: 20px;
	text-align: left;
	line-height: 1;
	position: relative;
	display: inline-block;
}

main .blog section .aappartel-icons > div > span {
	top: 50%;
	left: 48px;
	position: absolute;
	-webkit-transform: translateY(-50%);
	-moz-transform: translateY(-50%);
	-ms-transform: translateY(-50%);
	-o-transform: translateY(-50%);
	transform: translateY(-50%);
}

main .blog section .aappartel-icons > div > span .subtitle {
	font-size: 16px;
	display: block;
}

/* <--- Content: Rooms ---> */
main .blog section .aapp-rooms {
	padding: 0;
	text-align: center;
	list-style: none;
}

main .blog section .aapp-rooms li {
	width: 296px;
	margin: 0 24px;
	background: #303032;
	color: #FFF;
	font-family: 'Bebas', 'Roboto', Arial, Verdana, Helvetica;
	font-size: 20px;
	letter-spacing: 1px;
    position: relative;
	display: inline-block;
	overflow: hidden;
	-webkit-border-radius: 16px;
	-moz-border-radius: 16px;
	border-radius: 16px;
	-webkit-box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.16), 0 2px 10px 0 rgba(0, 0, 0, 0.12);
	-moz-box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.16), 0 2px 10px 0 rgba(0, 0, 0, 0.12);
	box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.16), 0 2px 10px 0 rgba(0, 0, 0, 0.12);
}

main .blog section .aapp-rooms li .image {
	height: 256px;
	margin: 0 0 8px;
	background-position: center;
	background-size: cover;
	cursor: pointer;
}

main .blog section .aapp-rooms li h4 {
	margin: 0;
	padding: 8px 0;
	color: #FF008C;
	font-size: 24px;
	letter-spacing: 3px;
	position: relative;
}

main .blog section .aapp-rooms li:last-child a:last-child {
	right: 8px;
    bottom: 8px;
    width: 20px;
    height: 20px;
	color: #99BD00;
	font-size: 20px;
    line-height: 1;
	position: absolute;
	cursor: pointer;
	-webkit-transition: color 0.2s ease;
	-moz-transition: color 0.2s ease;
	-o-transition: color 0.2s ease;
	transition: color 0.2s ease;
}

main .blog section .aapp-rooms li:last-child a:last-child:hover {
	color: #FFF;
}

main .blog section .aapp-rooms li p {
	padding: 0 0 16px;
	color: #FFF;
}

/* <--- Content: Price ---> */
main .blog section .the-price-is-hot {
	position: relative;
}

main .blog section .price-button {
	top: 50%;
	right: 0;
	width: 256px;
	background: #303032;
	position: absolute;
	overflow: hidden;
	-webkit-transition: background 0.2s ease;
	-moz-transition: background 0.2s ease;
	-o-transition: background 0.2s ease;
	transition: background 0.2s ease;
	-webkit-border-radius: 16px;
	-moz-border-radius: 16px;
	border-radius: 16px;
	-webkit-box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.16), 0 2px 10px 0 rgba(0, 0, 0, 0.12);
	-moz-box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.16), 0 2px 10px 0 rgba(0, 0, 0, 0.12);
	box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.16), 0 2px 10px 0 rgba(0, 0, 0, 0.12);
	-webkit-transform: translateY(-50%);
	-moz-transform: translateY(-50%);
	-ms-transform: translateY(-50%);
	-o-transform: translateY(-50%);
	transform: translateY(-50%);
}

main .blog section .price-button:hover {
	background: #99BD00;
}

main .blog section .price-button .aapp-icon {
	width: 100%;
	height: 192px;
	background-color: #CD7F32;
	background-position: center;
	background-repeat: no-repeat;
	text-indent: -9999px;
}

main .blog section .price-button strong {
	height: 72px;
	padding: 0;
	color: #FF008C;
	font-family: 'Bebas', 'Roboto', Arial, Verdana, Helvetica;
	font-size: 20px;
	font-weight: normal;
	text-align: center;
	line-height: 72px;
	letter-spacing: 2px;
	position: relative;
	display: block;
}

main .blog section .price-button strong span {
	top: 50%;
	width: 100%;
	display: block;
	position: absolute;
	-webkit-transform: translateY(-50%);
	-moz-transform: translateY(-50%);
	-ms-transform: translateY(-50%);
	-o-transform: translateY(-50%);
	transform: translateY(-50%);
}

/* <--- Content: Service ---> */
main .blog section .aapp-services {
	padding: 0;
	text-align: center;
}

main .blog section .aapp-services li {
	width: 256px;
	margin: 16px;
	background: #303032;
	display: inline-block;
	overflow: hidden;
	list-style: none;
	-webkit-transition: background 0.2s ease;
	-moz-transition: background 0.2s ease;
	-o-transition: background 0.2s ease;
	transition: background 0.2s ease;
	-webkit-border-radius: 16px;
	-moz-border-radius: 16px;
	border-radius: 16px;
	-webkit-box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.16), 0 2px 10px 0 rgba(0, 0, 0, 0.12);
	-moz-box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.16), 0 2px 10px 0 rgba(0, 0, 0, 0.12);
	box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.16), 0 2px 10px 0 rgba(0, 0, 0, 0.12);
}

main .blog section .aapp-services li:hover {
	background: #99BD00;
}

main .blog section .aapp-services li a {
	display: block;
}

main .blog section .aapp-services li .aapp-icon {
	width: 100%;
	height: 192px;
	background-color: #CD7F32;
	background-position: center;
	background-repeat: no-repeat;
	text-indent: -9999px;
	display: inline-block;
}

main .blog section .aapp-services li strong {
	height: 72px;
	padding: 0;
	color: #FF008C;
	font-family: 'Bebas', 'Roboto', Arial, Verdana, Helvetica;
	font-size: 20px;
	font-weight: normal;
	line-height: 28px;
	letter-spacing: 2px;
	position: relative;
	display: block;
}

main .blog section .aapp-services li strong span {
	top: 50%;
	width: 100%;
	display: block;
	position: absolute;
	-webkit-transform: translateY(-50%);
	-moz-transform: translateY(-50%);
	-ms-transform: translateY(-50%);
	-o-transform: translateY(-50%);
	transform: translateY(-50%);
}

/* <--- Content: Contact ---> */
#leading-4 article {
	padding: 0;
}

main .findUs {
	padding: 32px;
	font-size: 18px;
	font-weight: bold;
	line-height: 48px;
	text-transform: uppercase;
	position: relative;
}

main .findUs p {
	padding: 0 0 1em 56px;
	position: relative;
}

main .findUs a {
	color: #424242;
}

main .findUs a:hover {
	color: #99BD00;
}

main .findUs .fa {
	left: 0;
	width: 40px;
	height: 40px;
	background: rgba(153, 189, 0, 0.2);
	color: #99BD00;
	font-size: 24px;
	text-align: center;
	line-height: 40px;
	position: absolute;
	border: 1px solid #99BD00;
	-webkit-transition: background 0.2s ease;
	-moz-transition: background 0.2s ease;
	-o-transition: background 0.2s ease;
	transition: background 0.2s ease;
	-webkit-border-radius: 50%;
	-moz-border-radius: 50%;
	border-radius: 50%;
}

main .findUs > p:hover .fa {
	background: rgba(153, 189, 0, 0);
}
main .findUs .fa-external-link {
	top: -8px;
	width: 8px;
	height: 8px;
	margin: 0 0 0 4px;
	background: none;
	color: #1976D2;
	font-size: 8px;
	line-height: 8px;
	position: relative;
	border: none;
	-webkit-transition: none;
	-moz-transition: none;
	-o-transition: none;
	transition: none;
	-webkit-border-radius: 0;
	-moz-border-radius: 0;
	border-radius: 0;
}

main .findUs .rating {
	top: 50%;
	right: 32px;
	width: 256px;
	background: #303032;
	color: #FFF;
	text-align: center;
	position: absolute;
	overflow: hidden;
	-webkit-transition: background 0.2s ease;
	-moz-transition: background 0.2s ease;
	-o-transition: background 0.2s ease;
	transition: background 0.2s ease;
	-webkit-border-radius: 16px;
	-moz-border-radius: 16px;
	border-radius: 16px;
	-webkit-box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.16), 0 2px 10px 0 rgba(0, 0, 0, 0.12);
	-moz-box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.16), 0 2px 10px 0 rgba(0, 0, 0, 0.12);
	box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.16), 0 2px 10px 0 rgba(0, 0, 0, 0.12);
	-webkit-transform: translateY(-50%);
	-moz-transform: translateY(-50%);
	-ms-transform: translateY(-50%);
	-o-transform: translateY(-50%);
	transform: translateY(-50%);
}

main .findUs .rating:hover {
	background: #99BD00;
}

main .findUs .rating .aapp-icon {
	width: 100%;
	height: 192px;
	background-color: #CD7F32;
	background-position: center;
	background-repeat: no-repeat;
	display: block;
}

main .findUs .rating strong {
	height: 72px;
	padding: 0;
	color: #FF008C;
	font-family: 'Bebas', 'Roboto', Arial, Verdana, Helvetica;
	font-size: 20px;
	font-weight: normal;
	line-height: 28px;
	letter-spacing: 2px;
	position: relative;
	display: block;
}

main .findUs .rating strong span {
	top: 50%;
	width: 100%;
	display: block;
	position: absolute;
	-webkit-transform: translateY(-50%);
	-moz-transform: translateY(-50%);
	-ms-transform: translateY(-50%);
	-o-transform: translateY(-50%);
	transform: translateY(-50%);
}
main .findUs .ariana {
	top: 50%;
	right: 320px;
	width: 256px;
	background: #303032;
	color: #FFF;
	text-align: center;
	position: absolute;
	overflow: hidden;
	-webkit-transition: background 0.2s ease;
	-moz-transition: background 0.2s ease;
	-o-transition: background 0.2s ease;
	transition: background 0.2s ease;
	-webkit-border-radius: 16px;
	-moz-border-radius: 16px;
	border-radius: 16px;
	-webkit-box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.16), 0 2px 10px 0 rgba(0, 0, 0, 0.12);
	-moz-box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.16), 0 2px 10px 0 rgba(0, 0, 0, 0.12);
	box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.16), 0 2px 10px 0 rgba(0, 0, 0, 0.12);
	-webkit-transform: translateY(-50%);
	-moz-transform: translateY(-50%);
	-ms-transform: translateY(-50%);
	-o-transform: translateY(-50%);
	transform: translateY(-50%);
}

main .findUs .ariana:hover {
	background: #99BD00;
}

main .findUs .ariana .aapp-icon {
	width: 100%;
	height: 192px;
	background-color: #CD7F32;
	background-position: center;
	background-repeat: no-repeat;
	display: block;
}

main .findUs .ariana strong {
	height: 72px;
	padding: 0;
	color: #FF008C;
	font-family: 'Bebas', 'Roboto', Arial, Verdana, Helvetica;
	font-size: 20px;
	font-weight: normal;
	line-height: 28px;
	letter-spacing: 2px;
	position: relative;
	display: block;
}

main .findUs .ariana strong span {
	top: 50%;
	width: 100%;
	display: block;
	position: absolute;
	-webkit-transform: translateY(-50%);
	-moz-transform: translateY(-50%);
	-ms-transform: translateY(-50%);
	-o-transform: translateY(-50%);
	transform: translateY(-50%);
}
/* <--- Content: Contact - Google maps ---> */
#map-canvas {
	width: 100%;
	height: 384px;
	border-width: 1px 0;
	border-style: solid;
	border-color: #424242;
	-webkit-border-radius: 2px;
	-moz-border-radius: 2px;
	border-radius: 2px;
}

#map-canvas img {
	max-height: inherit;
}

/* <--- Content: Gallery ---> */
#leading-5 article {
	padding: 32px 0 0;
}

.aapp-square-gallery .cycle-slide .aapp-slide {
	height: 384px;
	background-position: center;
	background-size: cover;
	cursor: pointer;
}

/* <--- Content: Contact (form) ---> */
#contact-form label {
	padding: 8px 0;
	font-family: 'Roboto', Arial, Verdana, Helvetica;
	display: block;
}

#contact-form legend {
	width: 100%;
	font-family: 'Bebas', 'Roboto', Arial, Verdana, Helvetica;
	font-size: 20px;
	text-align: center;
	line-height: 64px;
	letter-spacing: 1.5px;
}

#jform_contact_email_copy-lbl {
	display: inline-block !important;
}

#contact-form button {
	font-family: 'Bebas', 'Roboto', Arial, Verdana, Helvetica;
	font-size: 20px;
	letter-spacing: 1.5px;
}

/* <--- Editor ---> */
main .edit {
	padding: 0 32px;
}

main .edit .btn-toolbar {
	margin: 0;
	padding: 32px 0 16px;
}

main .edit .btn-toolbar .btn-group + .btn-group {
	margin: 0 0 0 8px;
}

main .edit .btn-toolbar button {
	font-family: 'Bebas', 'Roboto', Arial, Verdana, Helvetica;
	font-size: 20px;
	letter-spacing: 1px;
	-webkit-border-radius: 2px !important;
	-moz-border-radius: 2px !important;
	border-radius: 2px !important;
}

main .edit .btn-toolbar button > span, main .edit .btn-toolbar button > i {
	width: auto;
	height: 32px;
	padding: 0 4px 0 0;
	font-size: 16px;
	line-height: 32px;
}

main .edit fieldset {
	padding: 16px 0 32px;
}

main .edit fieldset .nav-tabs {
	padding: 0;
	list-style: none;
}

main .edit fieldset .nav-tabs > li {
	margin: 0 -3px 0 0;
	padding: 4px 2rem;
	background: #303032;
	font-family: 'Bebas', 'Roboto', Arial, Verdana, Helvetica;
	font-size: 20px;
	letter-spacing: 1px;
	display: inline-block;
	cursor: pointer;
	-webkit-border-radius: 4px 4px 0 0;
	-moz-border-radius: 4px 4px 0 0;
	border-radius: 4px 4px 0 0;
}

main .edit fieldset .nav-tabs > li.active > a, main .edit fieldset .nav-tabs > li:hover > a {
	color: #FFF;
}

main .edit fieldset .tab-content {
	padding: 16px;
	position: relative;
	border: 1px solid #303032;
}

main .edit fieldset .tab-content .tab-pane {
	display: none;
}

main .edit fieldset .tab-content .tab-pane.active {
	display: block;
}

main .edit fieldset .tab-content .control-group {
	margin: 0 0 8px;
	position: relative;
}

main .edit fieldset .tab-content .control-group > div {
	display: inline-block;
}

main .edit fieldset .tab-content .control-group .control-label {
	width: 256px;
}

main .edit fieldset .tab-content .controls input,
main .edit fieldset .tab-content .controls select {
	width: 256px;
}

main .edit fieldset .tab-content .btn-toolbar {
	padding: 16px 0 0;
	float: none;
}

main .edit fieldset .tab-content .btn-toolbar a {
	font-family: 'Bebas', 'Roboto', Arial, Verdana, Helvetica;
	font-size: 20px;
	letter-spacing: 1px;
}

main .edit fieldset .tab-content .btn-toolbar a > i {
	width: auto;
	height: 32px;
	padding: 0 4px 0 0;
	font-size: 16px;
	line-height: 32px;
}

main .edit fieldset .tab-content .media-preview {
	top: 50%;
	left: 240px;
	display: inline-block;
	position: absolute;
	-webkit-transform: translateY(-50%);
	-moz-transform: translateY(-50%);
	-ms-transform: translateY(-50%);
	-o-transform: translateY(-50%);
	transform: translateY(-50%);
}

main .edit fieldset .tab-content .media-preview > span > i {
	width: auto;
}

main .edit #images .input-prepend .modal.btn,
main .edit #images .input-prepend .btn.hasTooltip {
	margin: 0 4px;
}

main .edit #images .input-prepend .modal.btn {
	font-family: 'Bebas', 'Roboto', Arial, Verdana, Helvetica;
	font-size: 16px;
	letter-spacing: 1px;
}

main .edit #images .input-prepend .btn.hasTooltip {
	font-size: 12px;
	position: relative;
	vertical-align: middle;
}

/* <--- Content: Sign in ---> */
#colorbox #login-form > ul {
	padding: 32px 0 16px;
	list-style: none;
}

/* <--- Footer ---> */
footer {
	background: #303032;
	color: #FFF;
	font-family: 'Bebas', 'Roboto', Arial, Verdana, Helvetica;
	font-size: 18px;
	letter-spacing: 1px;
}

footer a:hover {
	color: #FFF;
}

/* <--- Copyright ---> */
#copyright {
	height: 56px;
    padding: 0 24px;
    line-height: 56px;
    float: left;
}

/* <--- Footer menu ---> */
#footerMenu {
    height: 56px;
    padding: 0 24px;
    line-height: 56px;
    float: right;
}

#footerMenu li {
	display: inline-block;
}

#footerMenu li a {
	padding: 0 8px;
	display: block;
}

/* Friends */
#friends {
    clear: both;
    padding: 8px 0;
    text-align: center;
}

#friends ul li {
    display: inline-block;
    vertical-align: middle;
}

#friends ul li a {
    width: 80px;
    height: 80px;
    position: relative;
    display: block;
}

#friends ul li a img {
    top: 0;
    left: 0;
    position: absolute;
    opacity: 1;
    -webkit-transition: opacity 0s ease;
    -moz-transition: opacity 0s ease;
    -o-transition: opacity 0s ease;
    transition: opacity 0s ease;
}

#friends ul li a:hover img {
    opacity: 0;
    -webkit-transition: opacity 0.2s ease 0.2s;
    -moz-transition: opacity 0.2s ease 0.2s;
    -o-transition: opacity 0.2s ease 0.2s;
    transition: opacity 0.2s ease 0.2s;
}

#friends ul li a img.hover {
    opacity: 0;
    z-index: 1;
    -webkit-transition: opacity 0.2s ease;
    -moz-transition: opacity 0.2s ease;
    -o-transition: opacity 0.2s ease;
    transition: opacity 0.2s ease;
}

#friends ul li a:hover img.hover {
    opacity: 1;
}

#friends ul li.aapp a {
    width: auto;
    height: 80px;
    padding: 12px 16px;
    color: #FFF;
    font-family: 'Arial Black', Arial;
    font-size: 28px;
    line-height: 28px;
}

#friends ul li.aapp a span {
    color: #656565;
    -webkit-transition: color 0.2s ease;
    -moz-transition: color 0.2s ease;
    -o-transition: color 0.2s ease;
    transition: color 0.2s ease;
}

#friends ul li.aapp a:hover span {
    color: #99BD00;
}

#friends ul li.aapp a .subtitle {
    font-size: 12px;
    letter-spacing: 0;
    display: block;
}

#friends ul li.waz {
    padding-right: 16px;
}

#friends ul li.waz a {
    width: auto;
}

#friends ul li.waz a .img {
    width: 80px;
    height: 80px;
    position: relative;
    display: inline-block;
}

#friends ul li.waz a .text {
    height: 80px;
    padding: 20px 0;
    color: #FFF;
    line-height: 20px;
    display: inline-block;
    vertical-align: top;
}

#friends ul li.waz a .text span {
    color: #656565;
    -webkit-transition: color 0.2s ease;
    -moz-transition: color 0.2s ease;
    -o-transition: color 0.2s ease;
    transition: color 0.2s ease;
}

#friends ul li.waz a:hover .text span {
    color: #FF008C;
}

#friends ul li.waz a .text .subtitle {
    display: block;
}

#friends ul li.offfice a {
    width: 200px;
}

/* <--- NoNumber's Modal ---> */
#colorbox.complete {
	border: none;
	-webkit-border-radius: 2px;
	-moz-border-radius: 2px;
	border-radius: 2px;
	-webkit-box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.16), 0 2px 10px 0 rgba(0, 0, 0, 0.12);
    -moz-box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.16), 0 2px 10px 0 rgba(0, 0, 0, 0.12);
    box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.16), 0 2px 10px 0 rgba(0, 0, 0, 0.12);
}

#colorbox #cboxTitle {
	height: 56px !important;
	padding: 16px;
	color: #616161;
	font-family: 'Roboto', Arial, Verdana, Helvetica;
	font-size: 16px;
	font-weight: normal;
	text-transform: uppercase;
	line-height: 24px;
	border-bottom: 1px solid rgba(0, 0, 0, 0.1);
}

#colorbox #cboxLoadedContent {
	margin-top: 57px !important;
	padding: 16px;
}

#colorbox #cboxCurrent {
	padding: 16px;
	font-size: 12px;
	font-weight: normal;
	line-height: 20px;
	border: none;
	border-radius: 2px 0;
	-webkit-box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.16), 0 2px 10px 0 rgba(0, 0, 0, 0.12);
    -moz-box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.16), 0 2px 10px 0 rgba(0, 0, 0, 0.12);
    box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.16), 0 2px 10px 0 rgba(0, 0, 0, 0.12);
}

#colorbox #cboxNext {
	padding: 0;
	-webkit-border-radius: 2px 0 0 2px;
	-moz-border-radius: 2px 0 0 2px;
	border-radius: 2px 0 0 2px;
	-webkit-box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.16), 0 2px 10px 0 rgba(0, 0, 0, 0.12);
    -moz-box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.16), 0 2px 10px 0 rgba(0, 0, 0, 0.12);
    box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.16), 0 2px 10px 0 rgba(0, 0, 0, 0.12);
}

#colorbox #cboxPrevious {
	padding: 0;
	-webkit-border-radius: 0 2px 2px 0;
	-moz-border-radius: 0 2px 2px 0;
	border-radius: 0 2px 2px 0;
	-webkit-box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.16), 0 2px 10px 0 rgba(0, 0, 0, 0.12);
    -moz-box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.16), 0 2px 10px 0 rgba(0, 0, 0, 0.12);
    box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.16), 0 2px 10px 0 rgba(0, 0, 0, 0.12);
}

#colorbox #cboxClose {
	top: 20px;
	right: 16px;
	width: 16px;
	height: 16px;
	background-position: -95px 1px;
	padding: 0;
	-webkit-border-radius: 0;
	-moz-border-radius: 0;
	border-radius: 0;
	-webkit-box-shadow: none;
	-moz-box-shadow: none;
	box-shadow: none;
}

#colorbox table {
	width: 100%;
	font-size: 0.9em;
	text-align: left;
	line-height: 24px;
}

#colorbox table thead {
	font-weight: bold;
	border-bottom: 1px solid #BDBDBD;
}

#colorbox table th, #colorbox table td {
	padding: 8px 0;
	vertical-align: bottom;
}

#colorbox table tbody tr:nth-child(odd) {
	background: #EEE;
}

#colorbox .page-header h1 {
	display: none;
}

#colorbox ul {
	padding: 0 0 1em 40px;
	list-style: disc outside;
}

#colorbox input[type=text], #colorbox input[type=password],
#colorbox input[type=email], #colorbox textarea {
	 width: 100%;
	 margin-bottom: 8px;
	 padding: 8px;
}

/* <--- General classes ---> */
.text-green {
	color: #99BD00;
}

.no-display {
	display: none !important;
}

/* <--- Icons ---> */
.aapp-icon-bathtub {
	background-image: url(../images/icons/bathtub.png);
}

.aapp-icon-bed {
	background-image: url(../images/icons/bed.png);
}

.aapp-icon-breakfast {
	background-image: url(../images/icons/breakfast.png);
}

.aapp-icon-cleaner {
	background-image: url(../images/icons/cleaner.png);
}

.aapp-icon-coffee-machine {
	background-image: url(../images/icons/coffee-machine.png);
}

.aapp-icon-cooker {
	background-image: url(../images/icons/cooker.png);
}

.aapp-icon-dog {
	background-image: url(../images/icons/dog.png);
}

.aapp-icon-fridge {
	background-image: url(../images/icons/fridge.png);
}

.aapp-icon-hair-dryer {
	background-image: url(../images/icons/hair-dryer.png);
}

.aapp-icon-internet {
	background-image: url(../images/icons/internet.png);
}

.aapp-icon-inventory {
	background-image: url(../images/icons/inventory.png);
}

.aapp-icon-kitchen {
	background-image: url(../images/icons/kitchen.png);
}
.aapp-icon-safe {
	background-image: url(../images/icons/safe.png);
}

.aapp-icon-microwave {
	background-image: url(../images/icons/microwave.png);
}

.aapp-icon-price {
	background-image: url(../images/icons/price.png);
}

.aapp-icon-rating {
	background-image: url(../images/icons/rating.png);
}
.aapp-icon-ariana {
	background-image: url(../images/icons/ariana.png);
}
.aapp-icon-checkin {
	background-image: url(../images/icons/checkin.png);
}
.aapp-icon-receptionist {
	background-image: url(../images/icons/receptionist.png);
}

.aapp-icon-shower {
	background-image: url(../images/icons/shower.png);
}

.aapp-icon-television {
	background-image: url(../images/icons/television.png);
}

.aapp-icon-terrace {
	background-image: url(../images/icons/terrace.png);
}

.aapp-icon-toaster {
	background-image: url(../images/icons/toaster.png);
}

.aapp-icon-towel {
	background-image: url(../images/icons/towel.png);
}

.aapp-icon-washing-machine {
	background-image: url(../images/icons/washing-machine.png);
}

.aapp-icon-water-heater {
	background-image: url(../images/icons/water-heater.png);
}

/* <--- Media queries ---> */
@media screen and (max-width: 1280px)
{
	main .blog section .icons {
		top: 288px;
	}

	main .blog section .aapp-rooms li {
		width: 33%;
		margin: 0;
		-webkit-border-radius: 8px;
		-moz-border-radius: 8px;
		border-radius: 8px;
	}

	main .blog section .the-price-is-hot ul {
		width: calc(100% - 256px);
		float: left;
	}

	main .blog section .the-price-is-hot .price-button {
		position: relative;
		float: right;
		-webkit-transform: unset;
		-moz-transform: unset;
		-ms-transform: unset;
		-o-transform: unset;
		transform: unset;
	}

	main .blog section .aapp-services li {
		width: 33%;
		margin: 8px 0;
		-webkit-border-radius: 8px;
		-moz-border-radius: 8px;
		border-radius: 8px;
	}
}

@media screen and (max-width: 1024px)
{
	#intro .container .logo h1 {
		font-size: 48px;
		line-height: 64px;
	}

	#intro .container .logo h1 .subtitle {
		font-size: 16px;
		line-height: 24px;
	}

    #intro .container .price {
		display: none;
	}

    #intro .container .call-to-action {
        display: none;
    }

    #mobileBooking {
        display: block;
    }

	#intro .container .call-to-action p .btn {
		height: 40px;
		font-size: 20px;
		line-height: 40px;
	}

    #mainMenu .logo {
        float: right;
    }

	#mainMenu nav {
		text-align: left;
	}

	#mainMenu nav .mobileMenuButton {
		display: inline-block;
	}

    #mainMenu nav .mobileMenuButton.active {
		margin-left: 35%;
	}

	#mainMenu.sticky nav .mobileMenuButton.active {
		margin-left: 35%;
	}

	#mainMenu nav ul {
		top: 0;
		left: 0;
		width: 35%;
		height: 100%;
		background: #99BD00;
		display: none;
		position: fixed;
		overflow-y: auto;
		z-index: 1000;
		-webkit-box-shadow: inset 0 2px 5px 0 rgba(0, 0, 0, 0.16), inset 0 2px 10px 0 rgba(0, 0, 0, 0.12);
		-moz-box-shadow: inset 0 2px 5px 0 rgba(0, 0, 0, 0.16), inset 0 2px 10px 0 rgba(0, 0, 0, 0.12);
		box-shadow: inset 0 2px 5px 0 rgba(0, 0, 0, 0.16), inset 0 2px 10px 0 rgba(0, 0, 0, 0.12);
	}

	#mainMenu nav ul.active {
		display: block;
	}

	#mainMenu nav ul li {
		display: block;
	}

	#mainMenu nav ul li a {
		color: #FFF;
		border-width: 0 0 1px;
		border-style: solid;
		border-color: rgba(0, 0, 0, 0.1);
	}

	#mainMenu nav ul li a.active,
	#mainMenu nav ul li a:hover {
		color: #303032;
	}

	main .blog section .item-image {
		height: 256px;
	}

	main .blog section .item-image.parallax-image-container {
		background-attachment: scroll;
	}

	main .blog section .aapp-rooms li {
		width: 30%;
        margin: 0 0 8px;
	}

	main .blog section .aapp-rooms li .image {
		height: 144px;
	}

	main .blog section .the-price-is-hot ul {
		width: 100%;
		float: none;
	}

	main .blog section .the-price-is-hot .price-button {
		left: 50%;
		margin-top: 32px;
		float: none;
		-webkit-transform: translateX(-50%);
		-moz-transform: translateX(-50%);
		-ms-transform: translateX(-50%);
		-o-transform: translateX(-50%);
		transform: translateX(-50%);
	}

	main .blog section .aapp-services li {
		width: 30%;
	}

	main .blog section .aapp-services li .aapp-icon {
		height: 144px;
		background-size: 96px;
	}

	main .findUs .rating {
		left: 50%;
		margin-top: 32px;
		position: relative;
		-webkit-transform: translateX(-50%);
		-moz-transform: translateX(-50%);
		-ms-transform: translateX(-50%);
		-o-transform: translateX(-50%);
		transform: translateX(-50%);
	}
  main .findUs .ariana {
		left: 50%;
		margin-top: 32px;
		position: relative;
		-webkit-transform: translateX(-50%);
		-moz-transform: translateX(-50%);
		-ms-transform: translateX(-50%);
		-o-transform: translateX(-50%);
		transform: translateX(-50%);
	}

	#map-canvas {
		height: 320px;
	}
}

@media screen and (max-width: 800px)
{
    #intro .waz {
        display: none;
    }

	#mainMenu nav .mobileMenuButton.active {
		margin-left: 40%;
	}

	#mainMenu.sticky nav .mobileMenuButton.active {
		margin-left: 40%;
	}

	#mainMenu nav ul {
		width: 40%;
	}

	#mainMenu nav ul li a.mobile {
		display: block;
	}

	main .blog section .page-header h2 {
		padding: 16px;
	}

	main .blog section article {
		padding: 16px 16px 32px;
	}

	main .blog section .aapp-rooms li {
		width: 45%;
	}

	main .blog section .aapp-rooms li .image {
		height: 192px;
	}

	main .blog section .aapp-services li {
		width: 45%;
	}

	main .blog section .aapp-services li .aapp-icon {
		height: 192px;
		background-size: auto;
	}

	main .findUs {
		padding: 16px;
		font-size: 16px;
	}

	#map-canvas {
		height: 256px;
	}

    #friends ul li a, #friends ul li.waz a .img {
        width: 72px;
        height: 72px;
    }

    #friends ul li.waz a .text {
        padding: 16px 0;
    }
}

@media screen and (max-width: 600px)
{
	main .blog section .aapp-rooms li,
	main .blog section .the-price-is-hot .price-button,
	main .blog section .aapp-services li,
	main .findUs .rating {
		width: 100%;
		max-width: 256px;
	}
  main .findUs .ariana {
		width: 100%;
		max-width: 256px;
	}

	#mainMenu nav .mobileMenuButton.active {
		margin-left: 50%;
	}

	#mainMenu.sticky nav .mobileMenuButton.active {
		margin-left: 50%;
	}

	#mainMenu nav ul {
		width: 50%;
	}

    main .blog section .aappartel-icons > div {
		width: 45%;
	}

    #leading-5 .aapp-square-gallery {
		display: none;
	}

	#leading-5 .moduletable:after {
		content: 'The gallery is only available on desktop mode!';
		padding-bottom: 32px;
		color: #616161;
		font-style: italic;
		text-align: center;
		display: block;
	}

    #copyright, #footerMenu {
        height: 48px;
        text-align: center;
        line-height: 48px;
        float: none;
    }
}

@media screen and (max-width: 512px)
{
    #mainMenu .logo {
        display: none;
    }
}

@media screen and (max-width: 480px)
{
	#mainMenu nav .mobileMenuButton.active {
		margin-left: 65%;
	}

	#mainMenu.sticky nav .mobileMenuButton.active {
		margin-left: 65%;
	}

	#mainMenu nav ul {
		width: 65%;
	}
}

@media screen and (max-width: 400px)
{
    main .blog section .aappartel-icons > div {
    	font-size: 16px;
    }

    main .blog section .aappartel-icons > div > span {
    	left: 40px;
    }
}

/*  Andrej Dick Korrektur  */

/* für Werbung auf erste Seite */

.beispielbox {
        position: absolute;
        top: -130px;
        left: 5px;
        width: 298px;
        height: 130px;
        border:1px solid black;
        background:#4D3B2F;
        text-align:center;
        line-height: 20px;
        transform: rotate(30deg);
		font-weight: normal;
        color: #FF008C;
        border-radius: 20px;
    }

.schreiben {
        position: absolute;
        top: 60px;
        left: 5px;
        width: 280px;
        height: 22px;
        border:1px solid black;
        background:white;
        text-align:center;
        line-height: 20px;
        font-weight: normal;
        color: #88841B;
        border-radius: 20px;
    }

.anrufen {
        position: absolute;
        top: 90px;
        left: 5px;
        width: 280px;
        height: 22px;
        border:1px solid black;
        background:white;
        text-align:center;
        line-height: 20px;
        font-weight: normal;
        color: #88841B;
        border-radius: 20px;
    }

.drehpunkt {
        position: absolute;
        top: 70px;
        left: 15px;
        width: 110px;
        height: 110px;
    }

/* Sprach-Umschalter */

.sprache li {
    display: inline-block;
}

.sprache img {
    height: 20px;
    width: 40px;
}

@media screen and (max-width: 3000px)
{
    #jahnplatz img {
		position: absolute;
		height: auto;
		top: -130px;
    }
}

@media screen and (max-width: 1024px)
{
    #jahnplatz img {
		position: absolute;
		height: 100px;
		top: -80px;
    }
}