/*
	
Theme Name: Hotel Schlüssel
Theme URI: http://webgearing.com
Description: based on the Starkers Theme.
Version: 1.0
Author: Andris Linz @ webgearing ag
Author URI: http://webgearing.com

*/
/* COLORS 
	
	gold: 	#b2935a
	
*/


/* ------------------------- RESET ------------------------- */
body, html, h1, h2, h3, h4, h5, h6, p, ul, li, ol, img, fieldset { margin:0; padding:0; border:0; }
ul, li, ol { list-style:none; }
:focus { outline:none; }

/* ------------------------- UTILITIES ------------------------- */

.clear { clear:both; height:0;}
.floatLeft { float:left; }
.floatRight { float:right; }

/* ------------------------- MAIN-STYLES ------------------------- */
body {font-family: 'Lato', Helvetica, Arial, sans-serif; letter-spacing:.08em;  color:#333; background:#fff;}

/* BUTTON */
.button {padding:10px 20px !important; background:#b2935a !important; text-transform:uppercase !important; font-size:14px !important; border:#b2935a 2px solid !important; font-weight:normal !important; box-shadow:0px 1px 1px 0px rgba(0,0,0,0.4) !important;}
.button span, .button {color:#fff !important;}
.button:hover, .button:hover {cursor:pointer !important; background:transparent !important;  }
.button:hover span, .button:hover {color:#b2935a !important;}

/*.button-weiss {padding:10px 20px !important; background:#fff !important; text-transform:uppercase !important; font-size:14px !important; border:#fff 2px solid !important; font-weight:normal !important;}

.button-weiss span, .button-weiss {color:#b2935a !important;}

.button-weiss:hover, .button-weiss:hover {cursor:pointer !important; background:transparent !important;  }

.button-weiss:hover span, .button-weiss:hover {color:#fff !important;}*/
.button-weiss {padding:10px 20px !important; background:#fff !important; text-transform:uppercase !important; font-size:14px !important; border:#fff 2px solid !important; font-weight:normal !important; box-shadow:0px 1px 1px 0px rgba(0,0,0,0.4);}
.button-weiss span, .button-weiss {color:#000 !important;}
.button-weiss:hover, .button-weiss:hover {cursor:pointer !important; background:#000 !important; border:#000 2px solid !important;}
.button-weiss:hover span, .button-weiss:hover {color:#fff !important;}

/* ------------------------- TYPO ------------------------- */
h1	{font-size:38px; font-weight:700; line-height:48x; margin:0 0 30px 0; font-family: 'Playfair Display', Times, Georgia, serif; }
h2 	{font-size:32px; font-weight:700; line-height:42px; margin:0 0 8px 0; font-family: 'Playfair Display', Times, Georgia, serif; }
h3 	{font-size:26px; font-weight:700; line-height:34px; margin:0 0 8px 0; font-family: 'Playfair Display', Times, Georgia, serif; }
h4 	{font-size:20px; font-weight:700; line-height:28px; margin:0 0 20px 0; font-family: 'Playfair Display', Times, Georgia, serif; }
h5 	{font-size:20px; font-weight:700; line-height:30px; margin:0 0 20px 0;}
h6 	{font-size:20px; font-weight:300; line-height:30px; margin:0 0 20px 0;}
p 	{font-size:16px; line-height:24px; font-weight:300; margin:0 0 13px 0; letter-spacing:.06em;}
p strong {font-weight:700;}
a 	{text-decoration:none; color:#b2935a; transition: all ease 0.3s;}
a:hover {text-decoration:none; color:#7e7e7e; transition: all ease 0.3s;}
hr {border:none; border-bottom:#dd3333 1px solid; height:1px; background:transparent; margin:0 0 13px 0; width:33%; min-width:150px;}
ul {margin:0 0 0 15px;}
ul li {list-style:square; padding:0 0 0 5px; margin:0 0 5px 0;}

/* ------------------------- HEADER ------------------------- */
header {width:calc(100% - 104px); padding:0 52px; background:#fff;}

/*header .inner {width:1024px; margin:0 auto;}*/

/* LOGO AREA */

#logo-area {float:left; width:auto;}
#logo-area img {height:150px; width:auto;}
#logo-area .widget-container {margin:0; padding:26px 0;}

/* MENU AREA */

#menu-area {height:150px; width:auto; float:right; text-align:right; padding:26px 0;}

#topheader-area {background:#b2935a; color:#fff; padding-top:13px;}

#topheader-area a {color:#fff;}

#topheader-area .inner {padding:0 26px; width:calc(100% - 52px);}


#topheader-area p, #topheader-area p a {font-size:12px;}

/* ------------------------- NAVIGATION ------------------------- */

#nav_menu-2 {height:150px; position:relative; }
#nav_menu-2 li {display:inline-block; line-height:150px; position:relative;}
#nav_menu-2 li a {color:#b2935a; font-size:16px; transition: all ease 0.3s; padding:0 0 0 26px; font-weight:700;}
#nav_menu-2 li.menu-item-has-children a {padding:0 13px 0 26px; margin:0 13px 0 0;}
#nav_menu-2 li a:hover {color:#333; transition: all ease 0.3s;}
#nav_menu-2 li.current-menu-item a, #nav_menu-2 li.current-menu-ancestor > a {color:#333; transition: all ease 0.3s;}
#nav_menu-2 li.menu-item-has-children a:after {position:absolute; right:0; top:70px; content: "\f107"; display: inline-block; font-family: FontAwesome; font-style: normal; font-weight: 900; line-height: 1; color:#bfbfbf; }
#nav_menu-2 .sub-menu {display:none; transition: all ease 0.3s; background:#fff;}
#nav_menu-2 li.menu-item-has-children:hover .sub-menu {display:block; transition: all ease 0.3s; position:absolute; top:100px; width:auto; z-index:999; box-shadow:rgba(0,0,0,0.16) 2px 2px 2px;}
#nav_menu-2 li.menu-item-has-children:hover .sub-menu li {display:block; line-height:50px; width:auto; min-width:300px; text-align:left;}
#nav_menu-2 li.menu-item-has-children .sub-menu li a:after {content: "";}
#nav_menu-2 .menu-item-wpml-ls-2-de a {padding:15px 0 15px 20px !important;}
#nav_menu-2 .menu-item-wpml-ls-2-en a {padding:0;}
#nav_menu-2 .menu-item-wpml-ls-2-de a:after {content:"/"; color:#b2935a; font-weight:400; padding:0 0 0 15px;}

#menu-sprachwahl li, #menu-sprachwahl-en li {display:inline-block; position:relative;}
#menu-sprachwahl li.wpml-ls-current-language a, #menu-sprachwahl-en li.wpml-ls-current-language a {color:#fff; font-size:12px; transition: all ease 0.3s;  font-weight:700;}

#menu-sprachwahl li a, #menu-sprachwahl-en li a {color:#ddd; padding:0 0 0 26px; font-size:12px;}

#menu-sprachwahl .menu-item-wpml-ls-7-de a, #menu-sprachwahl-en .menu-item-wpml-ls-7-de a {padding:15px 0 15px 20px !important;}
#menu-sprachwahl .menu-item-wpml-ls-7-en a, #menu-sprachwahl-en .menu-item-wpml-ls-7-en a {padding:0;}
#menu-sprachwahl .menu-item-wpml-ls-7-de a:after, #menu-sprachwahl-en .menu-item-wpml-ls-7-de a:after {content:"/"; color:#fff; font-weight:400; padding:0 0 0 15px;}




#mobile-toggle {display:none; height:152px;}
#mobile-close {float:right; line-height:152px;}
#overlay-menu {position:fixed; top:0; left:0; bottom:0; right:0; background:#fff; display:none; z-index:999999; overflow:scroll; padding:0 26px;}

#overlay-menu #menu-mobile, #overlay-menu #menu-mobile-en {margin:0;}
#overlay-menu #menu-mobile li, #overlay-menu #menu-mobile-en li {list-style:none;}
#overlay-menu #menu-mobile li a, #overlay-menu #menu-mobile-en li a {display:block; line-height:52px; border-bottom:#999 1px solid; color:#b2935a; width:100%; position:relative;}
#overlay-menu #menu-mobile li a:hover, #overlay-menu #menu-mobile-en li a:hover {color:#333;}
#overlay-menu #menu-mobile li.menu-item-has-children a:after, #overlay-menu #menu-mobile-en li.menu-item-has-children a:after {position:absolute; right: 10px; top: 50%; margin-top: -6px; content: "\f107"; display: inline-block; font-family: FontAwesome; font-style: normal; font-weight: 900; line-height: 1; color:#b2935a; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale;}
#overlay-menu #menu-mobile li.menu-item-has-children .sub-menu li a:after, #overlay-menu #menu-mobile-en li.menu-item-has-children .sub-menu li a:after {content:"";}
#overlay-menu #menu-mobile li.menu-item-has-children .sub-menu, #overlay-menu #menu-mobile-en li.menu-item-has-children .sub-menu {display:none;}
#overlay-menu #menu-mobile li.menu-item-has-children .sub-menu.active, #overlay-menu #menu-mobile-en li.menu-item-has-children .sub-menu.active {display:block;}
#overlay-menu #menu-mobile li.wpml-ls-item, #overlay-menu #menu-mobile-en li.wpml-ls-item {display:inline-block;}
#overlay-menu #menu-mobile li.wpml-ls-item a, #overlay-menu #menu-mobile-en li.wpml-ls-item a {border:none;}
#menu-item-wpml-ls-3-de a:after {content:"/"; color:#b2935a; font-weight:400; padding:0 0 0 10px; margin:0 10px;}
/* ------------------------- MAIN ------------------------- */

#main {width:1024px; padding:0; margin:0 auto; min-height:600px;}
#main.ohneSlider {padding:60px 0;}

/* ------------------------- HOME ------------------------- */

/* ------------------------- FORMULAR ------------------------- */
input[type="text"], input[type="email"] {padding:10px; line-height:18px; border:#333 1px solid; background:#fff; color:#333; margin:0 0 10px 0; width:calc(100% - 20px);}
textarea {border:#333 1px solid; padding:10px; height:100px; font-family:Arial, Helvetica, sans-serif; font-size:12px; line-height:24px; margin:0 0 10px 0; background:#fff; color:#333; width:calc(100% - 20px);}
label {color:#333; padding:0 5px; margin:0 0 10px 0; font-weight:400; display:block;}
input[type="button"] {font-family:"AkkuratRegular", "Helvetica Neue", Helvetica, Arial, sans-serif; color:#333; background:#fff; border:#333 1px solid; padding:10px 20px; font-size:12px; line-height:18px; text-transform:uppercase; letter-spacing:.08em; transition: all ease 0.3s;}
input[type="button"]:hover {background:#333; color:#fff; border:#333 1px solid; transition: all ease 0.3s; cursor:pointer;}
.nf-before-form-content {margin:0 0 20px 0;}
select { color:#329bfd; border:none; overflow: hidden; background: url(images/arrowdown.png) no-repeat right #efefef; width:calc(100% - 15px); padding:10px;}
.nf-error-msg {color:#329bfd !important; background:#efefef; padding:10px;}
.nf-form-title h3 {font-size:42px; font-weight:900; line-height:52px; margin:0 0 30px 0; text-transform:uppercase;}
.nf-form-fields-required {font-size:16px; line-height:22px; font-weight:300; margin:0 0 13px 0; letter-spacing:.06em;}
/* ------------------------- PAGE ------------------------- 

.so-widget-sow-image h3.widget-title {padding:26px 0 0 0; margin:0; font-size:16px; text-transform:uppercase;}

h3.widget-title, .footer-img h3.widget-title {font-size:28px; font-weight:400; line-height:38px; margin:0 0 30px 0; padding:0; text-transform:none;}

.rev_slider span {letter-spacing:.05em !important;}*/
/* ------------------------- ACCORDION ------------------------- */
.panel {margin:0 0 5px 0;}
.panel_titel {display:block; background:#efefef; padding:10px; color:#329bfd; font-weight:700; text-transform:uppercase;}
.panel_titel:hover {cursor:pointer; color:#efefef; background:#329bfd;}
.panel_titel.current {color:#efefef; background:#329bfd;}
.panel_inhalt {padding:10px;}
.panel_inhalt img {width:calc(100% - 20px); height:auto;}

/* ------------------------- AKTUELL ------------------------- */

.aktuell-container {overflow:hidden;}
.aktuell {width:100%; border-bottom:#333 1px solid; margin:0 0 30px 0; padding:0 0 30px 0;}
.aktuell-bild {width:calc(50% - 15px); margin:0 15px 0 0; float:left;}
.aktuell-bild img {width:100%; height:auto;}
.aktuell-titel {width:calc(50% - 15px); margin:0 0 0 15px; float:left;}
h1.tp-caption {font-size:38px !important; font-weight:700 !important; line-height:44px !important; }
.aktuell-titel p > a.button {display:inline-block; margin:13px 0 0 0;}

/* ------------------------- PORTFOLIO ------------------------- */

/* LISTE */
#portfolio {width:100%; padding:0; margin:0 auto;}
.portfolio-item {width:calc(33% - 26px); margin:26px 13px 0 13px; display:inline-block; position:relative; vertical-align:middle;}
.portfolio-item .content {padding:52px 26px; color:#fff; opacity:0; transition: all ease 0.3s; background:rgba(0, 0, 0, 0.6); min-height:300px; position:relative; height:100%;}
.portfolio-item .content a {width:100%; height:100%; display:inline-block;}
.portfolio-item .content h3 {color:#fff; letter-spacing:.08em; margin:0 0 13px 0; font-size:16px; line-height:26px; font-weight:300; position:relative; left: -26px; transition: all ease 0.5s;}
.portfolio-item .content h2 {color:#fff; letter-spacing:.04em; margin:0; font-size:32px; line-height:38px; position:relative; right: -26px; transition: all ease 0.5s;}
.portfolio-item:hover .content {opacity:1; transition: all ease 0.3s;}
.portfolio-item:hover .content h3 {left:0;}
.portfolio-item:hover .content h2 {right:0;}
.sow-features-feature ul li {list-style:none;}

/* ------------------------- BOOKING ROW ------------------------- */

#bookingrow {box-shadow: 1px 1px 3px rgba(0,0,0,0.3);}

/* ------------------------- GALLERY ------------------------- */

.gallery .gallery-caption {display:none;}
.gallery dt {float:left; margin:0 10px 10px 0;}

/* ------------------------- FOOTER ------------------------- */

footer {background:#b2935a; padding:30px 0; color:#fff; width:100%;}
footer .inner {width:1024px; margin:0 auto;}
#first-footer-widget-area {width:100%; margin:0;}
footer a {color:#fff;}
footer a:hover {color:#333;}

/* ----- RESPONSIVE TABLET STYLES ----- */

@media screen and (max-width: 1290px) { 
	header .inner {width:calc(100% - 80px); margin:0 40px;}
	#main {width:calc(100% - 80px); padding:0 40px; margin:0 auto; min-height:500px;}
	footer .inner {width:calc(100% - 80px);}
	h1.tp-caption {font-size:24px !important; font-weight:700 !important; line-height:32px !important; }
	#menu-area {display:none;}
	#topheader-area {display:none;}
	/*header {height:90px;}*/
	#mobile-toggle {display:block; float:right; line-height:152px;}
	#mobile-toggle:hover {cursor:pointer;}
	.portfolio-item {width:calc(50% - 29px); margin:26px 13px 0 13px; display:inline-block; position:relative; vertical-align:middle;}
}

/* ----- RESPONSIVE MOBILE STYLES ----- */

@media screen and (max-width: 687px) { 
	header .inner {width:calc(100% - 52px); margin:0 auto;}
	#logo-area {width:170px;}
	#logo-area img {height:100px; width:auto;}
	#menu-area {width:calc(100% - 170px); margin:0 auto; padding:0;}
	#main {width:calc(100% - 40px); padding:0 20px; margin:0 auto; min-height:500px;}
	h1 {font-size:32px; font-weight:700; line-height:40px; margin:0 0 30px 0; hyphens:auto;}
	h2 {font-size:24px; font-weight:400; line-height:30px; margin:0 0 30px 0;}
	h3 {font-size:18px; font-weight:400; line-height:26px; margin:0 0 24px 0;}
	h4 {font-size:16px; font-weight:400; line-height:24px; margin:0 0 24px 0; text-transform:uppercase;}
	/*p {font-size:14px; line-height:22px; margin:0 0 22px 0; letter-spacing:.06em;}*/
	footer .inner {width:calc(100% - 40px); margin:0 auto;}
	.portfolio-item {width:100%; margin:26px 13px 0 13px; display:inline-block; position:relative; vertical-align:middle;}
	.aktuell-bild {width:100%; clear:both; margin:0 0 30px 0;}
	.aktuell-titel {width:100%; clear:both;}
	h1.tp-caption {font-size:18px !important; font-weight:700 !important; line-height:24px !important; }
}



/*Design bookingmask*/
.SIHOTWeb .panel,
.SIHOTWeb .s_stepContent,
.SIHOTWeb .panel-default .panel-heading,
.SIHOTWeb .k-autocomplete.k-state-default,
.SIHOTWeb .k-picker-wrap.k-state-default,
.SIHOTWeb .k-numeric-wrap.k-state-default,
.SIHOTWeb .k-dropdown-wrap.k-state-default,
.SIHOTWeb .list-group > li,
.SIHOTWeb .s_panelWrapper,
.SIHOTWeb .s_conf_container,
.SIHOTWeb .k-content,
.SIHOTWeb .k-calendar th,
.SIHOTWeb .k-header,
.SIHOTWeb .k-group,
.k-link.k-state-disabled,
/*.k-list-scroller,*/
.SIHOTWeb .k-list-container{
    background-color: #f4f4f4;
}

.SIHOTWeb .s_stepContent,
.SIHOTWeb .panel-default .panel-heading{
    color:#000;
}
                                
.SIHOTWeb .panel-default .panel-heading{
    border-bottom: 2px solid #000;
}

.SIHOTWeb .s_panelButton{
    border:1px solid #000;
}

.SIHOTWeb .panelSelected {
    background-color: #f4f4f4 !important;
    border-color: #b2935a;
}

.SIHOTWeb .s_stepContent_equals,
.SIHOTWeb .panelSelected .s_ratePanelHeader,
.SIHOTWeb .panelSelected .s_roomPanelHeader,
.SIHOTWeb .panelSelected .s_ratePanelPrice,
.SIHOTWeb .panelSelected .s_roomPanelPrice,
.SIHOTWeb .panelSelected .s_panelComment,
.SIHOTWeb a,
.SIHOTWeb a:hover{
    color: #b2935a;
}

.SIHOTWeb .s_ratePanelHeader,
.SIHOTWeb .s_roomPanelHeader,
.SIHOTWeb .s_ratePanelPrice,
.SIHOTWeb .s_roomPanelPrice,
.SIHOTWeb .s_panelComment,
.SIHOTWeb .k-dropdown .k-input,
.SIHOTWeb .k-menu .k-popup,
.SIHOTWeb .k-multiselect .k-button,
.SIHOTWeb .k-multiselect .k-button:hover,
.SIHOTWeb .k-dropdown .k-state-hover .k-input,
.SIHOTWeb .k-dropdown .k-state-focused .k-input,
.SIHOTWeb .k-button.s_addRoomBtn,
.SIHOTWeb .availCalendarDate,
.SIHOTWeb,
.SIHOTWeb .k-calendar .k-link.k-nav-fast,
.SIHOTWeb .k-content,
.SIHOTWeb .k-calendar .k-link{
    color: #000;
}

.SIHOTWeb .k-input,
.SIHOTWeb input.k-textbox,
.SIHOTWeb textarea.k-textbox,
.SIHOTWeb input.k-textbox:hover,
.SIHOTWeb textarea.k-textbox:hover,
.SIHOTWeb .k-textbox > input,
.SIHOTWeb .k-multiselect-wrap,
.SIHOTWeb .k-state-default > .k-select,
.SIHOTWeb .availCalendarInOtherMonth,
.SIHOTWeb .availCalendarDayActive,
.SIHOTWeb .availCalendarDayCurrent,
.SIHOTWeb .availCalendarDayIncative,
.SIHOTWeb .s_calendarBtn{
    background-color:#f4f4f4;
    color:#000;
    border:1px solid #000 !important;
}

.SIHOTWeb .k-autocomplete .k-input,
.SIHOTWeb .k-dropdown-wrap .k-input,
.SIHOTWeb .k-numeric-wrap .k-input,
.SIHOTWeb .k-picker-wrap .k-input,
.SIHOTWeb .k-selectbox .k-input,
.SIHOTWeb .k-textbox > input{
    padding: .187em 0;
}

.SIHOTWeb .s_addRoomBtn{
    background-color:#f4f4f4;
    border:1px solid #000;
}

.SIHOTWeb .k-button.s_addRoomBtn:hover{
    color: #b2935a;
    background-color:#f4f4f4;
    border:1px solid #000;
}

.SIHOTWeb .k-button:hover{
    color: #b2935a;
    background-color: inherit;
    border:1px solid #b2935a;
}

/*.SIHOTWeb .k-list-container{
    background-color: #878786;
}*/

.SIHOTWeb .k-checkbox-label:before,
.SIHOTWeb .k-radio-label:before{
    background-color: #f4f4f4;
    border-color: #b2935a;
}

.SIHOTWeb .k-checkbox:checked + .k-checkbox-label:before{
    background-color: #b2935a;
    border-color: #b2935a;
}

.SIHOTWeb .availCalendarDaySelected,
.SIHOTWeb .k-state-selected,
.SIHOTWeb .k-list > .k-state-selected,
.SIHOTWeb .k-state-hover,
.SIHOTWeb .k-list > .k-state-hover,
.SIHOTWeb .k-radio:checked + .k-radio-label:after,
.k-weekend k-state-selected .k-state-focused .k-state-hover,
.SIHOTWeb .k-calendar .k-nav-fast.k-state-hover,
.SIHOTWeb .k-calendar td.k-state-selected.k-state-hover,
.SIHOTWeb .k-calendar .k-today,
.SIHOTWeb .k-state-hover,
.SIHOTWeb .k-state-hover:hover{
    background-color: #b2935a;
}

.SIHOTWeb .availCalendarNotBookable {
    background-color: #e60f14;
}

.SIHOTWeb .text-center{
    color: #000 !important;
}

.SIHOTWeb .s_continue_btn,
.SIHOTWeb .s_book_btn,
.SIHOTWeb .s_back_btn{
    background-color: #b2935a;
    border: none;
}

.SIHOTWeb .k-list-container,
.SIHOTWeb .k-calendar-container.k-group{
    border-color: #000;
    color: #000;
}

.SIHOTWeb .k-state-focused.k-state-selected,
.SIHOTWeb .k-list > .k-state-focused.k-state-selected,
.SIHOTWeb .k-listview > .k-state-focused.k-state-selected,
.SIHOTWeb td.k-state-focused.k-state-selected{
    box-shadow: inset 0 0 3px 1px #b2935a;
}

.SIHOTWeb .s_conf_divider{
    background-color: #000;
}

.SIHOTWeb .k-calendar .k-content.k-month .k-today{
    background-color:#f4f4f4;
}

.SIHOTWeb .k-calendar td.k-state-focused,
.SIHOTWeb .k-calendar td.k-state-focused.k-state-selected{
    box-shadow: inset 0 0 0 1px #000;
}