﻿  h1,
 h2 {
     color: #5e8d6b
 }
 
 .cont-teaser>ul,
 .main-navi {
     list-style-type: none
 }
 
 *,
 :after,
 :before {
     box-sizing: border-box
 }
 
 blockquote,
 body,
 h1,
 h2,
 h3,
 h4,
 html,
 p {
     margin: 0;
     padding: 0
 }
 
 body,
 html {
     color: #444;
     height: 100%;
     margin: 0;
     font-family: -apple-system, ".SFNSText-Regular", Roboto, "Segoe UI", Oxygen, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
     letter-spacing: 0;
     font-weight: 400;
     font-style: normal;
     font-size: 16px;
     line-height: 1.55;
     text-rendering: optimizeLegibility;
     -webkit-font-smoothing: antialiased;
     -moz-osx-font-smoothing: grayscale;
     -moz-font-feature-settings: liga on
 }
 
 h1 {
     font-size: 1.8rem;
     font-weight: 300;
     margin: 0 0 25px;
     line-height: 1.2
 }
 
 h2 {
     font-size: 1.6rem;
     font-weight: 300;
     margin: 40px 0 25px;
     line-height: 1.2
 }
 
 h3,
 h4 {
     font-size: 1.2rem;
     font-weight: 300;
     line-height: 1.2;
     color: #5e8d6b
 }
 
 h3 {
     margin-top: 20px
 }
 
 h4 {
     margin-top: 15px
 }
 
 a {
     color: #5e8d6b;
     text-decoration: none;
     border-bottom: 1px dashed #5e8d6b;
     padding-bottom: 3px
 }
 
 a:hover {
     text-decoration: none;
     border-bottom: 1px solid #5e8d6b
 }

.nav li {
    color: #fff;
}

nav a {
    color: #fff;
    border-bottom: 1px dashed #fff;
}

nav a:hover {
  	color: #fff;
    border-bottom: 1px solid #fff;
}
 
.active {
    border-bottom: none;
    font-weight: bold;
}

blockquote {
     border-left: 10px solid #B1B38C;
     padding: 5px 10px;
     margin-left: 40px
 }
 
 .mobile-hide,
 .tablet-hide {
     display: inline
 }
 
 .text-input {
     padding: 5px;
     font-size: 110%;
     width: 100%
 }
 
.button,
 button,
 input[type=submit] {
     padding: .3em .8em;
     background: #9DB386;
     color: #fff;
     font-size: 1em;
     letter-spacing: 1px;
     cursor: pointer;
     display: inline-block;
     border-radius: 4px;
     border: 1px solid #9DB386;
    	min-width:65px;
 }
  
 a.button {
     background: rgba(157, 179, 134, 0.7);
     color: #4f4f4f;
     font-size: 1em;
     letter-spacing: 1px;
     display: inline-block;
     margin: 3px 2px;
     border-radius: 4px;
     border: 1px solid #9DB386;
     cursor: pointer;
  	min-width:65px;
 }
  
 a.button-folder {
     background: rgba(157, 179, 134, 0.7);
  	background-image: URL("/Cms_Data/Sites/info/Themes/Default/images/ic_folder_open_white_18dp_2x.png");
  	background-repeat: no-repeat;
     color: #4f4f4f;
     font-size: 1em;
     letter-spacing: 1px;
     display: inline-block;
     margin: 3px 2px 15px 2px;
     border-radius: 4px;
     border: 1px solid #9DB386;
     cursor: pointer;
	min-width: 180px;
    text-align: right;
    min-height: 37px;
    padding-right: 10px;
  padding-top: 5px;
 }



 .button,
 .button--selected {
     padding: .3em 0;
     text-align: center;
     width: 55px
 }
 
 .button:hover,
 button:hover,
 input[type=submit]:hover {
     background: rgba(157, 179, 134, .7);
     color: #fff;
     border: 1px solid #fff;
 }
 
 .button--selected {
     background: rgba(157, 179, 134, .2);
     color: #4f4f4f;
     font-size: 1em;
     letter-spacing: 1px;
     display: inline-block;
     margin: 3px 2px;
     border-radius: 4px;
     border: 1px solid #9DB386;
     cursor: default;
     	min-width:65px;
}
 
 .footer,
 .main,
 .services {
     color: #FFF;
     padding: 8px
 }
 
 .services {
     background: #4f4f4f;
     font-weight: 400;
     padding-left: 20px;
     padding-right: 20px;
     font-size: .8rem;
     height: 39px
 }
 
 .services-address {
     float: left;
     width: 70%;
     font-size: .95rem
 }
 
 .services-links {
     float: right;
     width: 30%;
     text-align: right;
     font-size: .95rem
 }
 
 .services-links--link {
     padding-left: 4px;
     padding-right: 4px
 }
 
 .services a {
     color: #fff;
     border-bottom: 0
 }
 
 .services a:hover {
     border-bottom: 1px solid #fff
 }
 
 .navigation {
    background-color: #4f4f4f;
  	width: 100%;
    min-height: 50px;
  	padding: 10px 20px;
 }
 
 .nav-item {
	padding:0px 15px;
  	text-align:center;
  	float:left;
 }
 
 .nav-item-right {
	padding:0px 15px;
  	float:right;
  	text-align:right;
 }
 
 .nav-sign-out {
	width:150px;
  	float:right;
  	text-align:right;  
    top: 0px;
    position: relative;
    right: 0px;
}
 
 .nav-sign-in {
	padding: .3em .8em;
  	background: #9DB386;
  	color: #fff;
  	font-size: 1em;
  	letter-spacing: 1px;
  	cursor: pointer;
  	display: inline-block;
  	border-radius: 4px;
  	border: 1px solid #9DB386; 
    top: 0px;
    position: relative;
    right: 0px;
}
 
 .main-navi {
     margin: 0;
     padding: 0;
     overflow: hidden
 }
 
 .main-navi-item,
 .main-navi-item--last {
     float: left
 }
 
 .main-navi-item a,
 .main-navi-item--last a {
     display: block;
     color: #857977;
     text-align: center;
     padding: 10px 20px;
     text-decoration: none;
     border-bottom: 0;
     border-right: 1px solid #857977
 }
 
 .cont,
 .footer {
     display: -webkit-flex
 }
 
 .main-navi-item--last a {
     border-right: 0
 }
 
 .main-navi-item a:hover:not(.navi-item-active),
 .main-navi-item--last a:hover:not(.navi-item-active) {
     background-color: #B1B38C;
     color: #FFF
 }
 
 .main-navi-item-active {
     background-color: #4CAF50
 }
 
 .badge {
	border: 1px solid green; 
  	border-radius: 19px; 
  	margin: 10px; 
  	padding: 7px; 
  	background-color: lightgoldenrodyellow; 
  	position: relative; 
  	top: -20px; 
  	left: -40px;
  	font-size:0.8rem;
 }

 .footer {
     background: #4f4f4f;
     display: -webkit-box;
     display: -moz-box;
     display: -ms-flexbox;
     display: flex;
     padding: 10px 45px;
     font-size: .9rem
 }
 
 .footer-item {
     flex-grow: 1;
     padding: 10px;
     margin-right: 10px;
     width: 33.3%
 }
 
 .footer-item--p {
     color: #fff;
     padding-bottom: 5px;
     text-align: center
 }
 
 .footer-item a {
     color: #B3CF95;
     border-bottom: 1px dashed #9db386;
     line-height: 25px
 }
 
 .footer-item a:hover {
     border-bottom: 1px solid #9db386
 }
 
 .footer-item h4 {
     color: #B3CF95;
     font-size: 1.2rem;
     font-weight: 300;
     line-height: 1.2;
     margin-top: 0;
     text-align: center;
     padding-bottom: 10px
 }
 
 .sidebar {
     float: right;
     width: 250px;
     background-color: gray
 }
 
 .headline {
     max-height: 468px;
     overflow: hidden;
     clear: both
 }
 
 .headline img {
     display: block;
     width: 100%;
     max-width: 100%;
     height: auto!important;
     -ms-interpolation-mode: bicubic
 }
 
 .cont {
  	clear:both;
     display: -webkit-box;
     display: -moz-box;
     display: -ms-flexbox;
     display: flex;
     -webkit-flex-wrap: wrap;
     -ms-flex-wrap: wrap;
     flex-wrap: wrap;
     padding: 0 50px 20px 50px;
     margin: 0 auto;
     list-style: none;
     max-width: 1300px
 }
 
 .cont-main {
     flex-grow: 1;
     width: 100px
 }
 
 .cont-main li {
     padding-bottom: 15px
 }
 
 .cont-teaser {
     -webkit-flex: none!important;
     -ms-flex: none!important;
     flex: none!important;
     color: #444;
     margin-left: 70px;
     margin-top: 70px;
     width: 300px!important
 }
 
 .cont-teaser>ul li {
     margin-left: -25px;
     padding-bottom: 5px
 }
 
 .cont-teaser>ul li a {
     font-size: .95rem;
     color: #000;
     border-bottom: 1px dashed #000
 }
 
 .cont-teaser-box,
 .cont-teaser-box--small {
     background-color: #6eb77b;
     padding: 35px;
     font-size: .9rem;
     margin-bottom: 50px;
     border-radius: 8px;
     text-align: center
 }
 
 .cont-teaser>ul li a:hover {
     border-bottom: 1px solid #000
 }
 
 .cont-teaser-box {
     color: #fff;
     min-height: 300px
 }
 
 .cont-teaser-box--small {
     color: #fff;
     min-height: 220px
 }
 
 #menu,
 #menu>ul,
 #menu>ul>li {
     min-height: 60px
 }
 
 .cont-teaser-box a,
 .cont-teaser-box--small a {
     color: #fff;
     border-bottom: 1px dashed #fff;
     padding-bottom: 3px;
     line-height: 35px
 }
 
 .cont-teaser-box a:hover,
 .cont-teaser-box--small a:hover {
     border-bottom: 1px solid #fff
 }
 
 .cont-teaser-box h3,
 .cont-teaser-box--small h3 {
     color: #fff;
     font-size: 1.3rem;
     margin-top: 0;
     padding-bottom: 10px
 }
 
 .article-link,
 .article-link:hover,
 .articledetail {
     color: #000
 }
 
 .cont-image-container {
     display: -webkit-flex;
     display: flex;
     -webkit-flex-wrap: wrap;
     flex-wrap: wrap
 }
 
 .cont-image-box {
   /*  width: 100%;  */
     background-color: #F5F5ED;
     border: 1px solid #F5F5ED;
     border-radius: 5px;
     padding: 10px 15px;
     margin: 20px 20px;
 }
 
 .article,
 .articledetail {
     padding: 18px;
     max-width: 920px
 }
 
 .cont-image-box:hover {
     cursor: pointer;
     border: 1px solid #5E8D6C
 }
 
 .cont-image-box--left {
     width: 21%;
     float: left
 }
 
 .cont-image-box--right {
     width: 79%;
     float: left
 }
 
 .md-close-x,
 .paging--right {
     float: right
 }
 
 .article {
     border-bottom: 1px solid #DDD
 }
 
 .articledetail li {
     padding-bottom: 7px
 }
 
 .article-more:hover,
 .article:hover,
 .cont-top:hover {
     background-color: #fbfbf6
 }
 
 .article-info {
     font-size: .75rem;
     margin: 0;
     color: #857977
 }
 
 .article-more {
     padding-top: 10px
 }
 
 .article-more--link {
     color: #857977;
     border-bottom: 1px dashed #857977
 }
 
 .article-more--link:hover {
     color: #6f7888;
     border-bottom: 1px solid #6f7888
 }
 
 .article-headline {
     font-weight: 600;
     letter-spacing: .02em;
     padding-bottom: 15px;
     padding-top: 5px
 }
 
 .article-content {
     padding-bottom: 30px
 }
 
 .article-content li {
     padding-bottom: 8px
 }
 
 .article-fakten {
     font-size: .9rem
 }
 
 .md-content h2,
 .md-content h3 {
     font-size: 1.4em;
     font-weight: 300
 }
 
 .article-fakten td:first-child {
     padding-right: 25px
 }
 
 .article-fakten td:nth-child(2) {
     font-weight: 600;
     padding-left: 5px;
     padding-right: 5px;
     text-align: center
 }
 
 .article-fakten td {
     padding-top: 5px;
     padding-bottom: 5px;
     border-bottom: 1px solid #E5E5E5
 }
 
 .analyseGreen {
     background-color: #009a2d;
     color: #fff
 }
 
 .analyseRed {
     background-color: #dd4b39;
     color: #fff
 }
 
 .analyseOrange {
     background-color: #fda100;
     color: #fff
 }
 
 .paging {
     margin-top: 10px
 }
 
 .paging-btn {
     display: inline-block;
     color: #fff;
     text-align: center;
     text-decoration: none;
     background: #B1B38C;
     padding: 10px 15px;
     border: 0
 }
 
 .paging-btn:hover {
     background: #858977
 }
 
 .md-modal {
     position: fixed;
     top: 50%;
     left: 50%;
     width: 70%;
     max-width: 800px;
     min-width: 320px;
     max-height: 80%;
     z-index: 2000;
     display: none;
     overflow: auto;
     -webkit-backface-visibility: hidden;
     -moz-backface-visibility: hidden;
     backface-visibility: hidden;
     -webkit-transform: translateX(-50%) translateY(-50%);
     -moz-transform: translateX(-50%) translateY(-50%);
     -ms-transform: translateX(-50%) translateY(-50%);
     transform: translateX(-50%) translateY(-50%)
 }
 
 .md-show {
     display: block
 }
 
 .md-overlay {
     position: fixed;
     width: 100%;
     height: 100%;
     visibility: hidden;
     top: 0;
     left: 0;
     z-index: 1000;
     opacity: 0;
     background: rgba(157, 179, 134, .8);
     -webkit-transition: all .3s;
     -moz-transition: all .3s;
     transition: all .3s
 }
 
 #menu,
 .md-close-x,
 .md-content {
     position: relative
 }
 
 .md-show~.md-overlay {
     opacity: 1;
     visibility: visible
 }
 
 .md-content {
     color: #444;
     background: #fff;
     border-radius: 8px;
     margin: 0 auto
 }
 
 .md-content h2 {
     margin: 0;
     padding: .4em .4em .4em 0
 }
 
 .md-content h3 {
     margin: 0;
     padding: .4em .4em .4em 25px;
     text-align: center;
     opacity: .8;
     background: #F5F5F5;
     color: #5e8d6b;
     border-radius: 8px 8px 0 0
 }
 
 .md-content>div {
     padding: 15px 40px 30px;
     margin: 0;
     font-weight: 300;
     font-size: .95rem
 }
 
 .md-content>div p {
     margin: 0;
     padding: 5px 0
 }
 
 .md-content>div ul {
     margin: 0;
     padding: 0 0 10px 20px;
     list-style-type: square
 }
 
 .md-content>div ul li {
     padding: 3px 0
 }
 
 .md-close-x {
     z-index: 100;
     right: 15px;
     top: 10px;
     color: #D3D3D3;
     border: 1px solid #e1e1e1;
     border-radius: 8px;
     padding: 1px 7px
 }
 
 .md-close-x:hover {
     cursor: pointer;
     border: 1px solid #5E8D6C;
     border-radius: 8px;
     color: #5E8D6C
 }
 
 .md-content button {
     display: block;
     margin: 0 auto;
     font-size: .8em
 }
 
 .md-effect-1 .md-content {
     -webkit-transform: scale(.7);
     -moz-transform: scale(.7);
     -ms-transform: scale(.7);
     transform: scale(.7);
     opacity: 0;
     -webkit-transition: all .3s;
     -moz-transition: all .3s;
     transition: all .3s
 }
 
 .md-show.md-effect-1 .md-content {
     -webkit-transform: scale(1);
     -moz-transform: scale(1);
     -ms-transform: scale(1);
     transform: scale(1);
     opacity: 1
 }
 
 .form-label {
     clear: both;
     float: left;
     width: 180px;
     text-align: right;
     padding-right: 10px;
     margin-top: 15px
 }
 
 .form-field {
     margin-top: 10px;
     float: left;
     width: 400px
 }
 
 @media screen and (min-width:321px) and (max-width:768px) {
     .md-modal {
         left: 50%;
         width: 80%
     }
 }
 
 @media only screen and (max-width:1024px) {
     .footer-item--p {
         padding-top: 8px;
         font-size: .98rem
     }
 }
 
 @media only screen and (max-width:1000px) {
     .tablet-hide {
         display: none
     }
     .services-address {
         width: 35%
     }
     .services-links {
         width: 60%
     }
 }
 
 @media only screen and (max-width:768px) {
     .cont-teaser,
     blockquote {
         margin-left: 0
     }
     body,
     html {
         font-size: 1rem
     }
     h1 {
         font-size: 1.6rem
     }
     h2 {
         font-size: 1.4rem
     }
     blockquote,
     p {
         font-size: 1.05rem
     }
     p {
         line-height: 1.6rem
     }
     .navigation {
         padding-left: 0;
         height: 0
     }
     .main-navi-item,
     .main-navi-item--last {
         width: 33.3%
     }
     .main-navi-item a,
     .main-navi-item--last a {
         padding: 15px 0;
         font-size: 1.1rem
     }
     .main-navi-item--last {
         display: none
     }
     .footer {
         display: block
     }
     .cont {
         padding: 10px
     }
     .cont-top {
         padding: 0 10px 20px
     }
     .article {
         padding: 18px 10px
     }
     .article-more--link {
         font-size: 1.1rem
     }
     .cont-main,
     .cont-teaser,
     .footer-item,
     .footer-item-last {
         width: 100%
     }
     .cont-main {
         padding: 10px
     }
     .cont-teaser {
         width: 100%!important;
         margin-top: 10px
     }
     .form-field,
     .form-label {
         width: 100%;
         margin-top: 5px
     }
     .cont-teaser>ul li {
         padding-bottom: 18px
     }
     .cont-image-container {
         justify-content: center
     }
     .cont-teaser-box {
         font-size: 1.05rem;
         line-height: 25px
     }
     .cont-teaser-box a {
         padding-bottom: 3px;
         font-size: 1.05rem;
         line-height: 40px
     }
     .cont-teaser-box h3 {
         font-size: 1.3rem;
         padding-bottom: 20px
     }
     .footer-item {
         margin-right: 0;
         margin-top: 5px;
         text-align: center
     }
     .form-label {
         clear: both;
         text-align: left
     }
     .form-field {
         clear: both
     }
 }
 
 @media only screen and (max-width:600px) {
     .cont-image-box--left,
     .mobile-hide {
         display: none
     }
     .services-address {
         width: 0
     }
     .services-links {
         width: 95%
     }
     .cont-main {
         padding: 0
     }
     .md-content-img {
         width: 100%
     }
     .cont-image-box--right {
         width: 100%;
         float: left
     }
 }
 
 #menu,
 #menu ul li .drop-down li:hover>.drop-down,
 #menu>ul>li:hover .drop-down {
     display: block
 }
 
 @media only screen and (max-width:320px) {
     .main-navi-item {
         width: 30.5%
     }
     .main-navi-item:nth-child(1) {
         width: 39%
     }
     .md-modal {
         left: 50%;
         width: 90%
     }
 }
 
 #menu a,
 #menu h2,
 #menu img,
 #menu li,
 #menu p,
 #menu ul {
     margin: 0;
     padding: 0;
     display: block;
     line-height: normal;
     text-decoration: none;
     list-style: none;
     -webkit-box-sizing: border-box;
     -moz-box-sizing: border-box;
     box-sizing: border-box
 }
 
 #menu {
     margin: 0 auto;
     padding: 0 33px;
     z-index: 999;
     font-size: 1em;
     max-width: 1300px;
     min-width: 180px
 }
 
 #menu>ul {
     float: left;
     width: 100%;
     background-color: #FFF
 }
 
 #menu>ul>li {
     float: left;
     line-height: 60px;
     margin-top: 42px;
     text-transform: uppercase
 }
 
 #menu>ul>li>a {
     line-height: 64px;
     color: #444;
     text-align: center;
     width: 100%;
     padding-left: 25px;
     padding-right: 25px;
     font-size: .95rem;
     font-weight: 500;
     border: none
 }
 
 #menu>ul>.title>a {
     text-transform: uppercase;
     font-size: 1.4em;
     line-height: 60px;
     padding-left: 20px;
     text-align: left;
     padding-right: 20px;
     border: none
 }
 
 #menu>ul>.title {
     border-left: none;
     min-width: 20%;
     padding-top: 13px;
     margin-top: 0
 }
 
 #menu ul .reservation {
     min-width: 6%;
     text-align: center;
     cursor: pointer;
     float: right;
     padding-left: 10px;
     padding-right: 25px;
     position: relative
 }
 
 #menu ul .reservation a {
     padding: 15px 7px;
     border: 1px solid #444;
     border-radius: 2px;
     margin-top: 15px;
     line-height: 0
 }
 
 #menu>ul>li:hover>a {
     background: #fff;
     color: #5e8d6b;
     transition: background .3s linear 0s, color .3s linear 0s;
     -moz-transition: background .3s linear 0s, color .3s linear 0s;
     -ms-transition: background .3s linear 0s, color .3s linear 0s;
     -o-transition: background .3s linear 0s, color .3s linear 0s;
     -webkit-transition: background .3s linear 0s, color .3s linear 0s
 }
 
 #menu>ul>.title:hover>a {
     background: inherit;
     color: inherit!important
 }
 
 #menu .drop-down {
     position: absolute;
     background: #fff;
     z-index: 999;
     margin-left: 0;
     margin-top: -10px;
     float: left;
     width: 280px;
     border: 1px solid #648835;
     border-top: 0;
     padding-top: 20px;
     padding-bottom: 10px;
     border-bottom: 1px solid;
     border-bottom-color: #648835;
     border-radius: 0 0 6px 6px
 }
 
 #menu .drop-down .drop-down {
     border-top: 1px solid rgba(0, 0, 0, .1)
 }
 
 #menu .drop-down li {
     float: left;
     width: 100%;
     position: relative
 }
 
 #menu .drop-down li a {
     color: #444;
     font-size: .95rem;
     text-align: left;
     padding: 5px 20px 10px 23px;
     background-color: #fff;
     border: none;
     text-transform: none;
     transition: color .2s linear 0s, padding-left .2s linear 0s;
     -moz-transition: color .2s linear 0s, padding-left .2s linear 0s;
     -ms-transition: color .2s linear 0s, padding-left .2s linear 0s;
     -o-transition: color .2s linear 0s, padding-left .2s linear 0s;
     -webkit-transition: color .2s linear 0s, padding-left .2s linear 0s;
     border-bottom: 1px solid #fff
 }
 
 #menu .drop-down li:hover>a {
     font-weight: 600
 }
 
 #menu>ul>li .drop-down.hover-fade {
     display: none
 }
 
 #menu>ul>li .drop-down li:hover>.drop-down.hover-fade,
 #menu>ul>li:hover>.drop-down.hover-fade {
     display: block;
     animation: hover-fade .3s linear 0s forwards;
     -moz-animation: hover-fade .3s linear 0s forwards;
     -ms-animation: hover-fade .3s linear 0s forwards;
     -o-animation: hover-fade .3s linear 0s forwards;
     -webkit-animation: hover-fade .3s linear 0s forwards
 }
 
 @keyframes hover-fade {
     0% {
         opacity: 0
     }
     100% {
         opacity: 1
     }
 }
 
 @-moz-keyframes hover-fade {
     0% {
         opacity: 0
     }
     100% {
         opacity: 1
     }
 }
 
 @-ms-keyframes hover-fade {
     0% {
         opacity: 0
     }
     100% {
         opacity: 1
     }
 }
 
 @-o-keyframes hover-fade {
     0% {
         opacity: 0
     }
     100% {
         opacity: 1
     }
 }
 
 @-webkit-keyframes hover-fade {
     0% {
         opacity: 0
     }
     100% {
         opacity: 1
     }
 }
 
 #menu>ul>li .drop-down.hover-zoom {
     display: none
 }
 
 #menu>ul>li .drop-down li:hover>.drop-down.hover-zoom,
 #menu>ul>li:hover>.drop-down.hover-zoom {
     display: block;
     animation: hover-zoom .2s linear 0s forwards;
     -moz-animation: hover-zoom .2s linear 0s forwards;
     -ms-animation: hover-zoom .2s linear 0s forwards;
     -o-animation: hover-zoom .2s linear 0s forwards;
     -webkit-animation: hover-zoom .2s linear 0s forwards
 }
 
 @keyframes hover-zoom {
     0% {
         opacity: 0;
         transform: scale(.8, .8)
     }
     100% {
         opacity: 1;
         transform: scale(1, 1)
     }
 }
 
 @-moz-keyframes hover-zoom {
     0% {
         opacity: 0;
         -moz-transform: scale(.8, .8)
     }
     100% {
         opacity: 1;
         -moz-transform: scale(1, 1)
     }
 }
 
 @-ms-keyframes hover-zoom {
     0% {
         opacity: 0;
         -ms-transform: scale(.8, .8)
     }
     100% {
         opacity: 1;
         -ms-transform: scale(1, 1)
     }
 }
 
 @-o-keyframes hover-zoom {
     0% {
         opacity: 0;
         -o-transform: scale(.8, .8)
     }
     100% {
         opacity: 1;
         -o-transform: scale(1, 1)
     }
 }
 
 @-webkit-keyframes hover-zoom {
     0% {
         opacity: 0;
         -webkit-transform: scale(.8, .8)
     }
     100% {
         opacity: 1;
         -webkit-transform: scale(1, 1)
     }
 }
 
 #menu>ul>li .drop-down.hover-expand {
     display: none
 }
 
 #menu>ul>li .drop-down li:hover>.drop-down.hover-expand,
 #menu>ul>li:hover>.drop-down.hover-expand {
     display: block;
     animation: hover-expand .2s linear 0s forwards;
     -moz-animation: hover-expand .2s linear 0s forwards;
     -ms-animation: hover-expand .2s linear 0s forwards;
     -o-animation: hover-expand .2s linear 0s forwards;
     -webkit-animation: hover-expand .2s linear 0s forwards
 }
 
 @keyframes hover-expand {
     0% {
         opacity: 0;
         transform: rotateY(90deg)
     }
     100% {
         opacity: 1;
         transform: rotateY(0)
     }
 }
 
 @-moz-keyframes hover-expand {
     0% {
         opacity: 0;
         -moz-transform: rotateY(90deg)
     }
     100% {
         opacity: 1;
         -moz-transform: rotateY(0)
     }
 }
 
 @-ms-keyframes hover-expand {
     0% {
         opacity: 0;
         -ms-transform: rotateY(90deg)
     }
     100% {
         opacity: 1;
         -ms-transform: rotateY(0)
     }
 }
 
 @-o-keyframes hover-expand {
     0% {
         opacity: 0;
         -o-transform: rotateY(90deg)
     }
     100% {
         opacity: 1;
         -o-transform: rotateY(0)
     }
 }
 
 @-webkit-keyframes hover-expand {
     0% {
         opacity: 0;
         -webkit-transform: rotateY(90deg)
     }
     100% {
         opacity: 1;
         -webkit-transform: rotateY(0)
     }
 }
 
 #menu .drop-down li i {
     position: absolute;
     z-index: 999;
     top: 0;
     right: 20px;
     bottom: 0;
     height: 16px;
     margin: auto;
     color: #555658
 }
 
 #menu .drop-down .drop-down {
     left: 100%;
     top: -10px;
     width: 150px
 }
 
 #menu .drop-down.one-column {
     width: 230px
 }
 
 #menu .drop-down .drop-down.one-column {
     width: 200px
 }
 
 #menu .drop-down.two-column {
     width: 450px
 }
 
 #menu .drop-down.two-column ul {
     float: left;
     width: 220px;
     margin: 0;
     padding: 0
 }
 
 #menu .drop-down.three-column {
     width: 670px
 }
 
 #menu .drop-down.three-column ul {
     float: left;
     width: 220px;
     margin: 0;
     padding: 0
 }
 
 #menu .drop-down.full-width {
     width: 100%;
     margin-left: 0;
     left: 0;
     -webkit-box-sizing: border-box;
     -moz-box-sizing: border-box;
     box-sizing: border-box
 }
 
 #menu .drop-down.full-width ul {
     float: left;
     width: 33%;
     cursor: default
 }
 
 #menu .drop-down.full-width ul li {
     margin: 0;
     padding: 10px 0;
     float: left;
     width: 100%
 }
 
 #menu .drop-down.full-width ul li a {
     margin: 0 10%;
     border: 0;
     padding: 0;
     float: left;
     transition: text-indent .2s linear 0s;
     -moz-transition: text-indent .2s linear 0s;
     -ms-transition: text-indent .2s linear 0s;
     -o-transition: text-indent .2s linear 0s;
     -webkit-transition: text-indent .2s linear 0s
 }
 
 #menu .drop-down.full-width ul li:hover a {
     text-indent: 5px
 }
 
 #menu .drop-down.full-width ul li p {
     margin: 0;
     padding: 10px 10px 10px 11%;
     float: left;
     width: 100%;
     clear: both;
     font-size: .9em;
     color: #949598
 }
 
 #menu .drop-down.social-bar {
     width: 200px
 }
 
 #menu hr {
     margin: 0;
     padding: 0;
     display: block
 }
 
 #menu img {
     height: 70px;
     float: left
 }
 
 #menu img:hover {
     opacity: .8
 }
 
 #menu h2 {
     color: #535456;
     font-size: 1.2em;
     font-weight: 400;
     margin: 0;
     padding: 15px 5px 10px 10%
 }
 
 #menu>input,
 #menu>label {
     display: none
 }
 
 @media screen and (min-width:768px) and (max-width:1000px) {
     #menu>ul>.title {
         width: 100%
     }
     #menu>ul>li>a {
         line-height: 50px
     }
     #menu>ul>li {
         min-height: 0
     }
     #menu ul .reservation a {
         margin-top: 9px
     }
 }
 
 @media screen and (width:768px) {
     #menu ul .reservation a {
         margin-top: -85px
     }
     #menu ul .reservation {
         padding-right: 13px
     }
 }
 
 @media screen and (max-width:1220px) {
     #menu {
         padding: 0 5px;
         max-width: 1200px
     }
     #menu>ul>li>a {
         padding-left: 12px;
         padding-right: 12px;
    	font-size:85%;
     }
     #menu .drop-down {
         width: 260px
     }
     #menu .drop-down li a {
         font-size: .98rem;
         padding: 5px 20px 13px 23px
     }
 }
 
 @media screen and (max-width:1000px) {
     #menu>ul>li {
         margin-top: 0
     }
 }
 
 @media screen and (max-width:767px) {
     #menu>ul>li:nth-child(2n+3) {
         display: none
     }
     #menu img {
         height: 55px;
         float: left
     }
     #menu>ul>li {
         width: 100%;
         border-left: none!important;
         border-right: none!important;
         border-bottom: 1px solid;
         border-bottom-color: rgba(194, 194, 194, 1)
     }
     #menu>ul>.login-form:hover,
     #menu>ul>.search-bar:hover,
     #menu>ul>li:hover>a {
         color: #000!important
     }
     #menu>ul>.title {
         padding-top: 0
     }
     #menu>ul>.title a {
         text-align: center
     }
     #menu .drop-down {
         width: 97%
     }
     #menu .drop-down.full-width {
         left: 0!important
     }
     #menu .drop-down .drop-down,
     #menu .drop-down.full-width,
     #menu .drop-down.one-column,
     #menu .drop-down.three-column,
     #menu .drop-down.two-column,
     #menu .login-form ul {
         width: 100%!important;
         display: block!important;
         position: relative;
         left: 0;
         transform: scale(1, 1), rotateY(90deg);
         -moz-transform: scale(1, 1), rotateY(90deg);
         -ms-transform: scale(1, 1), rotateY(90deg);
         -o-transform: scale(1, 1), rotateY(90deg);
         -webkit-transform: scale(1, 1), rotateY(90deg)
     }
     #menu .drop-down .drop-down {
         border: 0;
         border-top: 1px solid #e8e8e8;
         border-bottom: 1px solid #e8e8e8;
         top: 0;
         padding: 0
     }
     #menu .drop-down .drop-down.one-column {
         padding-left: 20px
     }
     #menu>ul>li .drop-down.hover-expand,
     #menu>ul>li .drop-down.hover-fade,
     #menu>ul>li .drop-down.hover-zoom {
         display: none
     }
     #menu>ul>li .drop-down li:hover>.drop-down.hover-expand,
     #menu>ul>li .drop-down li:hover>.drop-down.hover-fade,
     #menu>ul>li .drop-down li:hover>.drop-down.hover-zoom,
     #menu>ul>li:hover>.drop-down.hover-expand,
     #menu>ul>li:hover>.drop-down.hover-fade,
     #menu>ul>li:hover>.drop-down.hover-zoom {
         display: block
     }
     #menu>ul>.login-form:hover,
     #menu>ul>li:hover>a {
         color: #000;
         background: inherit
     }
     #menu ul .login-form,
     #menu ul .search-bar {
         margin: 0;
         padding: 0
     }
     #menu ul .login-form label {
         text-align: left;
         text-indent: 10px
     }
     #menu ul .login-form table td {
         cursor: default
     }
     #menu .drop-down.full-width ul,
     #menu .drop-down.two-column ul {
         width: 50%
     }
     #menu .drop-down.three-column ul {
         width: 33.3333%
     }
     #menu .drop-down.one-column a,
     #menu .drop-down.three-column a,
     #menu .drop-down.two-column a {
         width: auto;
         float: left
     }
     #menu .drop-down li .fa.fa-angle-right {
         position: relative;
         z-index: 9999;
         right: 0;
         float: right;
         height: auto;
         color: #555658;
         padding: 0;
         margin: 0 17px 0 0;
         display: block;
         line-height: 38px;
         transform: rotate(90deg);
         -webkit-transform: rotate(90deg);
         -ms-transform: rotate(90deg);
         -moz-transform: rotate(90deg);
         -o-transform: rotate(90deg)
     }
     #menu .drop-down li a {
         padding-bottom: 12px
     }
     #menu #mobile-button {
         position: absolute;
         display: none
     }
     #menu>ul {
         height: 60px;
         overflow: hidden
     }
     #menu #mobile-button:checked+ul {
         height: auto;
         overflow: visible
     }
     #menu>label {
         width: 80px;
         height: 60px;
         background-color: #9DB386;
         display: block;
         margin: 0;
         padding: 0;
         position: absolute;
         top: 0;
         left: 0;
         text-align: center;
         line-height: 60px;
         font-size: 1.2em;
         font-weight: 500;
         color: #fff;
         cursor: pointer
     }
     #menu>label i {
         -ms-user-select: none;
         -moz-user-select: none;
         -o-user-select: none;
         -webkit-user-select: none
     }
     #menu ul .title {
         padding-left: 70px
     }
     #menu .collapse .drop-down .drop-down,
     #menu .collapse .drop-down.full-width,
     #menu .collapse .drop-down.one-column,
     #menu .collapse .drop-down.three-column,
     #menu .collapse .drop-down.two-column,
     #menu .collapse .login-form ul {
         width: 100%!important;
         display: none!important;
         position: relative;
         left: 0;
         transform: scale(1, 1), rotateY(90deg);
         -moz-transform: scale(1, 1), rotateY(90deg);
         -ms-transform: scale(1, 1), rotateY(90deg);
         -o-transform: scale(1, 1), rotateY(90deg);
         -webkit-transform: scale(1, 1), rotateY(90deg)
     }
     #menu>.collapse>li .drop-down li:hover>.drop-down.hover-expand,
     #menu>.collapse>li .drop-down li:hover>.drop-down.hover-fade,
     #menu>.collapse>li .drop-down li:hover>.drop-down.hover-zoom,
     #menu>.collapse>li:hover>.drop-down.hover-expand,
     #menu>.collapse>li:hover>.drop-down.hover-fade,
     #menu>.collapse>li:hover>.drop-down.hover-zoom {
         display: block!important;
         animation: hover-fade .2s linear 0s forwards;
         -moz-animation: hover-fade .2s linear 0s forwards;
         -ms-animation: hover-fade .2s linear 0s forwards;
         -o-animation: hover-fade .2s linear 0s forwards;
         -webkit-animation: hover-fade .2s linear 0s forwards
     }
     @keyframes hover-fade {
         0% {
             opacity: 0
         }
         100% {
             opacity: 1
         }
     }
     @-moz-keyframes hover-fade {
         0% {
             opacity: 0
         }
         100% {
             opacity: 1
         }
     }
     @-ms-keyframes hover-fade {
         0% {
             opacity: 0
         }
         100% {
             opacity: 1
         }
     }
     @-o-keyframes hover-fade {
         0% {
             opacity: 0
         }
         100% {
             opacity: 1
         }
     }
     @-webkit-keyframes hover-fade {
         0% {
             opacity: 0
         }
         100% {
             opacity: 1
         }
     }
 }
 
 @media screen and (max-width:420px) {
   
  h2 {
  	margin-top: 0;
  }
  
  .navigation {
    background-color: #4f4f4f;
    width: 100%;
    min-height: 200px;
    padding: 10px 20px;
  }
     
  .nav-item,
  .nav-item-right {
    width: 100%;
    line-height: 35px;
  }  
 
  .nav-sign-in,
  .nav-sign-out {
	padding: .0em .5em;
    top: -30px;
    position: relative;
    right: -20px;
  }
  
     #menu .drop-down.full-width ul,
     #menu .drop-down.three-column ul,
     #menu .drop-down.two-column ul,
     #menu img {
         width: 100%
     }
     #menu ul .title {
         padding-left: 0;
         text-indent: 60px
     }
     #menu img {
         float: left;
         padding-left: 65px;
         padding-top: 4px
     }
     #menu h2 {
         padding-left: 15px
     }
     #menu ul .reservation {
         padding-right: 10px
     }
 }