body,form,figure{margin:0;padding:0}img{border:0}header,footer,nav,section,aside,article,figure,figcaption{display:block}body{font-size:100.01%}select,input,textarea{font-size:99%}#container,.inside{position:relative}#main,#left,#right{float:left;position:relative}#main{width:100%}#left{margin-left:-100%}#right{margin-right:-100%}#footer{clear:both}#main .inside{min-height:1px}.ce_gallery>ul,.content-gallery>ul{margin:0;padding:0;overflow:hidden;list-style:none}.ce_gallery>ul li,.content-gallery>ul li{float:left}.ce_gallery>ul li.col_first,.content-gallery>ul li.col_first{clear:left}.float_left,.media--left>figure{float:left}.float_right,.media--right>figure{float:right}.block{overflow:hidden}.media{display:flow-root}.clear,#clear{height:.1px;font-size:.1px;line-height:.1px;clear:both}.invisible{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px}.custom{display:block}#container:after,.custom:after{content:"";display:table;clear:both}
@media (max-width:767px){#wrapper{margin:0;width:auto}#container{padding-left:0;padding-right:0}#main,#left,#right{float:none;width:auto}#left{right:0;margin-left:0}#right{margin-right:0}}img{max-width:100%;height:auto}.audio_container audio{max-width:100%}.video_container video{max-width:100%;height:auto}.aspect,.responsive{position:relative;height:0}.aspect iframe,.responsive iframe{position:absolute;top:0;left:0;width:100%;height:100%}.aspect--16\:9,.responsive.ratio-169{padding-bottom:56.25%}.aspect--16\:10,.responsive.ratio-1610{padding-bottom:62.5%}.aspect--21\:9,.responsive.ratio-219{padding-bottom:42.8571%}.aspect--4\:3,.responsive.ratio-43{padding-bottom:75%}.aspect--3\:2,.responsive.ratio-32{padding-bottom:66.6666%}
#colorbox,#cboxOverlay,#cboxWrapper{position:absolute;top:0;left:0;z-index:9999;overflow:hidden;-webkit-transform:translate3d(0,0,0)}#cboxWrapper{max-width:none}#cboxOverlay{position:fixed;width:100%;height:100%}#cboxMiddleLeft,#cboxBottomLeft{clear:left}#cboxContent{position:relative}#cboxLoadedContent{overflow:auto;-webkit-overflow-scrolling:touch}#cboxTitle{margin:0}#cboxLoadingOverlay,#cboxLoadingGraphic{position:absolute;top:0;left:0;width:100%;height:100%}#cboxPrevious,#cboxNext,#cboxClose,#cboxSlideshow{cursor:pointer}.cboxPhoto{float:left;margin:auto;border:0;display:block;max-width:none;-ms-interpolation-mode:bicubic}.cboxIframe{width:100%;height:100%;display:block;border:0;padding:0;margin:0}#colorbox,#cboxContent,#cboxLoadedContent{box-sizing:content-box;-moz-box-sizing:content-box;-webkit-box-sizing:content-box}#cboxOverlay{background:#000;opacity:.9;filter:alpha(opacity = 90)}#colorbox{outline:0}#cboxContent{margin-top:20px;background:#000}.cboxIframe{background:#fff}#cboxError{padding:50px;border:1px solid #ccc}#cboxLoadedContent{border:5px solid #000;background:#fff}#cboxTitle{position:absolute;top:-20px;left:0;color:#ccc}#cboxCurrent{position:absolute;top:-20px;right:0;color:#ccc}#cboxLoadingGraphic{background:url(../../assets/colorbox/images/loading.gif) no-repeat center center}#cboxPrevious,#cboxNext,#cboxSlideshow,#cboxClose{border:0;padding:0;margin:0;overflow:visible;width:auto;background:0 0}#cboxPrevious:active,#cboxNext:active,#cboxSlideshow:active,#cboxClose:active{outline:0}#cboxSlideshow{position:absolute;top:-20px;right:90px;color:#fff}#cboxPrevious{position:absolute;top:50%;left:5px;margin-top:-32px;background:url(../../assets/colorbox/images/controls.png) no-repeat top left;width:28px;height:65px;text-indent:-9999px}#cboxPrevious:hover{background-position:bottom left}#cboxNext{position:absolute;top:50%;right:5px;margin-top:-32px;background:url(../../assets/colorbox/images/controls.png) no-repeat top right;width:28px;height:65px;text-indent:-9999px}#cboxNext:hover{background-position:bottom right}#cboxClose{position:absolute;top:5px;right:5px;display:block;background:url(../../assets/colorbox/images/controls.png) no-repeat top center;width:38px;height:19px;text-indent:-9999px}#cboxClose:hover{background-position:bottom center}
#mbOverlay{position:fixed;z-index:9998;top:0;left:0;width:100%;height:150%;background-color:#000;cursor:pointer}#mbOverlay.mbOverlayOpaque{background:url(../../assets/mediabox/images/80.png)}#mbOverlay.mbOverlayAbsolute{position:absolute}#mbOverlay.mbMobile{position:absolute;background-color:transparent}#mbBottom.mbMobile{line-height:24px;font-size:16px}#mbCenter{position:absolute;z-index:9999;left:50%;padding:10px;background-color:#000;-webkit-border-radius:10px;-khtml-border-radius:10px;-moz-border-radius:10px;border-radius:10px;filter:progid:DXImageTransform.Microsoft.Shadow(Strength=5, Direction=180, Color='#000000');-ms-filter:"progid:DXImageTransform.Microsoft.Shadow(Strength=5, Direction=180, Color='#000000')";-webkit-box-shadow:0 5px 20px rgba(0,0,0,.5);-khtml-box-shadow:0 5px 20px rgba(0,0,0,.5);-moz-box-shadow:0 5px 20px rgba(0,0,0,.5);box-shadow:0 5px 20px rgba(0,0,0,.5)}#mbCenter.mbLoading{background:#000 url(../../assets/mediabox/images/loading-dark.gif) no-repeat center;-webkit-box-shadow:none;-khtml-box-shadow:none;-moz-box-shadow:none;box-shadow:none}#mbMedia{position:relative;left:0;top:0;font-family:Myriad,Verdana,Arial,Helvetica,sans-serif;line-height:20px;font-size:12px;color:#fff;text-align:left;background-position:center center;background-repeat:no-repeat}#mbBottom{line-height:20px;font-size:12px;font-family:Myriad,Verdana,Arial,Helvetica,sans-serif;text-align:left;color:#999;min-height:20px;padding:10px 0 0}#mbTitle,#mbPrevLink,#mbNextLink,#mbCloseLink{display:inline;color:#fff;font-weight:700}#mbNumber{display:inline;color:#999;font-size:.8em;margin:auto 10px}#mbCaption{display:block;color:#999;line-height:1.6em;font-size:.8em}#mbPrevLink,#mbNextLink,#mbCloseLink{float:right;outline:0;margin:0 0 0 10px;font-weight:400}#mbPrevLink b,#mbNextLink b,#mbCloseLink b{color:#eee;font-weight:700;text-decoration:underline}#mbPrevLink big,#mbNextLink big,#mbCloseLink big{color:#eee;font-size:1.4em;font-weight:700}#mbBottom a,#mbBottom a:link,#mbBottom a:visited{text-decoration:none;color:#ddd}#mbBottom a:hover,#mbBottom a:active{text-decoration:underline;color:#fff}#mbError{position:relative;font-family:Myriad,Verdana,Arial,Helvetica,sans-serif;line-height:20px;font-size:12px;color:#fff;text-align:center;border:10px solid #700;padding:10px 10px 10px;margin:20px;-webkit-border-radius:5px;-khtml-border-radius:5px;-moz-border-radius:5px;border-radius:5px}#mbError a,#mbError a:link,#mbError a:visited,#mbError a:hover,#mbError a:active{color:#d00;font-weight:700;text-decoration:underline}
/*No IE-support*/
.no-support{
  overflow: hidden;
  height: 100vh;
  -ms-scroll-limit: 0 0 0 0;
  -ms-overflow-style: none;
 }

 .no-support:before{
  content: '';
  position: absolute;
  width: 100%;
  height: 100vh;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  background-color: rgba(18, 21, 23, 0.9);
  z-index: 999999;
 }

 .ie-error{
  position: absolute;
  top: 25px;
  z-index: 999999;
  display: -ms-flexbox;
  display: flex;
  justify-content: center;
  width: 100%;
 }

 .ie-error > div{
  color: #FFF;
  width: 100%;
  pointer-events: auto;
  background-color: #000;
  background-clip: padding-box;
  border: 1px solid rgba(0,0,0,.2);
  border-radius: .3rem;
  outline: 0;
  max-width: 500px;
  text-align: center;
  padding: 25px;
  font-size: 24px;
 }

 .ie-error > div a{
  display: block;
  text-align: center;
  margin: 25px;
 }

 @font-face {
  font-family: 'Motiva Sans'; /* Gewünschter Name */
  src: url('/files/layout/fonts/MotivaSansRegular.eot');
            /* für IE9 */
  src: url('/files/layout/fonts/MotivaSansRegular.woff') 
            format('woff'), 
           /* für moderne Browser */
       url('/files/layout/fonts/MotivaSansRegular.ttf') 
            format('truetype');
          /* für Safari, Android, iOS */
 }
 @font-face {
  font-family: 'Motiva Sans Thin'; /* Gewünschter Name */
  src: url('/files/layout/fonts/MotivaSansThin.eot');
            /* für IE9 */
  src: url('/files/layout/fonts/MotivaSansThin.woff') 
            format('woff'), 
           /* für moderne Browser */
       url('/files/layout/fonts/MotivaSansThin.ttf') 
            format('truetype');
          /* für Safari, Android, iOS */
 }
 @font-face {
  font-family: 'Salamat'; /* Gewünschter Name */
  src: url('/files/layout/fonts/Salamat.eot');
            /* für IE9 */
  src: url('/files/layout/fonts/Salamat.woff') 
            format('woff'), 
           /* für moderne Browser */
       url('/files/layout/fonts/Salamat.ttf') 
            format('truetype');
          /* für Safari, Android, iOS */
 }



/*Allgemeines*/
html{
  overflow-x: hidden;
  padding-bottom: 0px;
  height: auto;
  min-height: auto;
}

body {
  font-family: 'Motiva Sans';
  font-weight: 400;
  font-style: normal;
  color: #36322E;
  background-image: url('/files/bilder/texture_paper.jpg');
  background-repeat: no-repeat;
  background-size: cover;
  margin: 0;
  padding: 0;
  width: 100%;
  font-size: 16px;
  max-width: 1920px;
  margin: auto;
}

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

button{
  font-family: 'Motiva Sans';
}
h1 {
  font-family: 'Salamat', sans-serif;
} 
h2, h3 {
  font-family: 'Motiva Sans Light', sans-serif; 
}
h3 {
  color: #9EC213;
  text-align: center;
  font-size: 30px;
}
.widget.error{
  border: 1px solid #394348;
  border-radius: 5px;
  padding: 5px;
}

.widget.error p.error{
  color: #394348;
  margin-top: 0;
}

/*Inputs, Checkboxes*/
/*Checkbox etc.*/
.formbody{
  position: relative;
}

select {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  border:none;
  border-radius: 0;
  min-width: 100px;
  background-color:white;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12.235' height='6.996' viewBox='0 0 12.235 6.996'%3E%3Cpath id='Icon_ionic-ios-arrow-down' data-name='Icon ionic-ios-arrow-down' d='M12.307,16.133l4.626-4.63a.871.871,0,0,1,1.235,0,.882.882,0,0,1,0,1.239l-5.242,5.246a.873.873,0,0,1-1.206.025L6.442,12.746a.875.875,0,0,1,1.235-1.239Z' transform='translate(-6.188 -11.246)' fill='%23394348'/%3E%3C/svg%3E");
  background-position: right 10px center;
  background-repeat: no-repeat;
  padding: .75em 1em .5em 1em;
  color: #394348;
	cursor: pointer;
	-webkit-transition: all 0.3s ease-in-out;
  -moz-transition: all 0.3s ease-in-out;
  -o-transition: all 0.3s ease-in-out;
}
select::-ms-expand {
  display:none;
}

option {
    background: #fff;
    border-top: 1px solid #444;
    padding: .3em 1em .3em 1em;
}
/* remove standard-styles */
input {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  border:none;
  border-radius: 0;
  font-size: 16px;
  width: 100%
} 

/*Navigation*/
#header{
  background-color: rgba(18, 21, 23);
  width: 100%;
  position: fixed;
  z-index: 1100;
  box-shadow: 0 3px 6px rgb(0 0 0 / 25%);
  height: 70px;
}

#header *{
  color: #FFF;
  overflow: visible;
}

#header > .inside{
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  position: relative;
  width: 100%;
}
#header .ce_image {
  margin-left: 100px;
  background-color: #fff;
  width: 200px;
  padding: 60px 25px 15px;
  box-shadow: 0 3px 6px rgb(0 0 0 / 25%);
}
#header .mod_navigation {
  margin-right: 100px;
}
/* Footer */
#footer{
  position: relative;
}

#footer .footer_grey {
  background-color: rgba(18, 21, 23);
  color: #fff;
  display: flex;
  flex-direction: row;
  padding: 25px 100px;
  justify-content: space-between;
}
#footer .footer_grey .ce_image {
  display: flex;
  flex-direction: column;
  justify-content: center;
  width: 200px;
}
#footer .footerlinks {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  grid-column-gap: 20px;
}
#footer .footer_grey p {
  margin-bottom: 0;
  padding: 10px 0;
}

/*Hauptteil*/
#main>.inside{
  min-height: 0px;
  display: flex;
  flex-direction: column;
}
img {
  display: block;
}
p {
  font-size: 16px;
  margin: 0;
  margin-bottom: 30px;
}
#headerimage {
  width: 100vw;
  height: calc(100vh);
}
#headerimage #article-12 img {
  object-position: top;
}
#headerimage img {
  height: 100vh;
  object-fit: cover;
  width: 100%;
}
.headerimage img {
  display: block;
  width: 100%;
  min-height: 500px;
}
#article-1 .ce_image img {
  width: 100vw;
}
.mod_rocksolid_slider .rsts-nav {
  left: 0;
  right: 0;
}
.mod_rocksolid_slider .rsts-nav ul {
  display: flex;
  flex-direction: row;
  justify-content: center;
}
.mod_rocksolid_slider.rsts-skin-default .rsts-nav-bullets a {
  width: 20px;
  height: 20px;
  border: 0px solid transparent;
  box-shadow: none;
  -webkit-box-shadow: none;
  -moz-box-shadow: none;
  background-color: #fff;
}
.mod_rocksolid_slider.rsts-skin-default .rsts-nav-bullets a.active,
.mod_rocksolid_slider.rsts-skin-default .rsts-nav-bullets a:hover {
  background-color: rgba(18, 21, 23);
}


.mod_navigation{
  width: 100%;
}
.mod_navigation ul{
  display:flex;
  justify-content: space-evenly;
}
.mod_navigation li{
  display: block;
}
a {
  text-decoration: none;
  color: #FFF;
}
.greytext_ueberschrift {
  margin: 100px 10%;
  background-color: rgb(18 21 23 / 84%);
  color: #fff;
  padding: 50px;
  text-align: center;

}
.greytext_ueberschrift h1 {
  font-size: 55px;
  line-height: 55px;
  margin-top: 0;
  font-weight: normal;
}
.link_oberstdorf,
.link_kontakt {
  position: absolute;
  top: 25px;
  right: 5%;
}




.greenbutton a {
  padding: 10px 20px;
  font-weight: bold;
  background-color: #9EC213;
  border-radius: 4px;
  width: 150px;
  display: block;
  position: absolute;
  left: calc((100% - 150px) / 2);
  margin-top: 30px;
}
.greytext_home_unterkunft {
 width: 100%;
  position: absolute;
  margin: 0px 10%;
  margin-top: -200px;
  background-color: rgb(18 21 23 / 84%);
  color: #fff;
  padding: 50px;
  text-align: center;
  width: calc(80% - 100px);
}
.row_unterkunft {
  display: flex;
  flex-direction: row;
  justify-content: space-evenly;
  padding-top: 40px;
}
.row_unterkunft .row {
  display: flex;
  flex-direction: column;
  justify-content: center;
   align-items:center;
}
.row_unterkunft .row p:nth-child(1) {
  height: 84px;
  display: flex;
}
.row_unterkunft .row p:nth-child(1) a {
  margin-top: auto;
}
.row_unterkunft .row .greenbutton {
  margin-top: auto;
}
.row_unterkunft .row .greenbutton a {
  position: relative;
  margin-left: auto;
  margin-top: 0;
  left: 0;
  margin-right: auto;
}
.greytext_galerie {
  margin: 50px 10%;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  grid-gap: 15px;
}
.greytext_galerie .ce_text {
  grid-column: 1;
  padding: 20px;
  background-color: rgb(18 21 23 / 84%);
  color: #fff;
}

.greytext_galerie .ce_gallery {
  grid-column: 2 / 4;
}
.greytext_galerie .ce_form {
  grid-column: 2 / 4;
}
.ce_gallery ul li figure {
  height: 100%;
}
.ce_gallery ul li img {
  height: 100%;
  object-fit: cover;
}
.semmeldienst {
  margin: 0 10%;
}
.semmeldienst figure img{
  height: 150px;
  object-fit: cover;
}
 .semmeldienst .text{
  padding: 20px;
  background-color: rgb(18 21 23 / 84%);
  color: #fff;
  margin: 0;
}
.semmeldienst .greenbutton {
  position: relative;
  margin-left: auto;
  margin-right: auto;
  width: max-content;
}
.preise {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  grid-gap: 25px;
  margin: 50px 10%;
}
.preise h3 {
  text-align: left;
}
.preise table tr:nth-child(3) td:nth-child(1) {
  vertical-align: top;
}
#gastgeber_galerie ul,
#rubihorn_galerie ul,
#widderstein_galerie ul,
#hoernerblick_galerie ul,
#zimmer_galerie ul{
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  grid-gap: 15px;

}
#gastgeber_galerie ul li:nth-child(1) {
  grid-row: 1;
  grid-column: 1;
}
#gastgeber_galerie ul li:nth-child(2) {
  grid-row: 1 / 3 ;
  grid-column: 2;
}
#gastgeber_galerie ul li:nth-child(3) {
  grid-row: 2 / 4;
  grid-column: 1;
}
#gastgeber_galerie ul li:nth-child(4) {
  grid-row: 3;
  grid-column: 2;
}
#gastgeber_galerie ul li:nth-child(8) {
  grid-row: 5 / 7;
  grid-column: 2;
}
#rubihorn_galerie ul li:nth-child(1) {
  grid-row: 1;
  grid-column: 1;
}
#rubihorn_galerie ul li:nth-child(2) {
  grid-row: 1 / 3;
  grid-column: 2;
}
#rubihorn_galerie ul li:nth-child(3) {
  grid-row: 4;
  grid-column: 1;
}
#rubihorn_galerie ul li:nth-child(4) {
  grid-row: 5;
  grid-column: 1;
}
#rubihorn_galerie ul li:nth-child(5) {
  grid-row: 3;
  grid-column: 2;
}
#rubihorn_galerie ul li:nth-child(6) {
  grid-row: 2 / 4;
  grid-column: 1;
}
#rubihorn_galerie ul li:nth-child(7) {
  grid-row: 4 / 6;
  grid-column: 2;
}
#widderstein_galerie ul li:nth-child(1) {
  grid-row: 1;
  grid-column: 1;
}
#widderstein_galerie ul li:nth-child(2) {
  grid-row: 1 / 3;
  grid-column: 2;
}
#widderstein_galerie ul li:nth-child(3) {
  grid-row: 2;
  grid-column: 1;
}
#widderstein_galerie ul li:nth-child(4) {
  grid-row: 3;
  grid-column: 1;
}
#widderstein_galerie ul li:nth-child(5) {
  grid-row: 3;
  grid-column: 2;
}
#widderstein_galerie ul li:nth-child(6) {
  grid-row: 4;
  grid-column: 2;
}
#widderstein_galerie ul li:nth-child(7) {
  grid-row: 5;
  grid-column: 2;
}
#widderstein_galerie ul li:nth-child(8) {
  grid-row: 4 / 6;
  grid-column: 1;
}
#hoernerblick_galerie ul li:nth-child(1) {
  grid-row: 1;
  grid-column: 1;
}
#hoernerblick_galerie ul li:nth-child(2) {
  grid-row: 1 / 3;
  grid-column: 2;
}
#hoernerblick_galerie ul li:nth-child(3) {
  grid-row: 2 / 4;
  grid-column: 1;
}
#hoernerblick_galerie ul li:nth-child(4) {
  grid-row: 3;
  grid-column: 2;
}
#zimmer_galerie.stitzel ul li:nth-child(1) {
  grid-row: 1;
  grid-column: 1;
}
#zimmer_galerie.stitzel ul li:nth-child(2) {
  grid-row: 1 / 3;
  grid-column: 2;
}
#zimmer_galerie.stitzel ul li:nth-child(3) {
  grid-row: 2 / 4;
  grid-column: 1;
}
#zimmer_galerie.stitzel ul li:nth-child(4) {
  grid-row: 3;
  grid-column: 2;
}
#zimmer_galerie.sonnenkopf ul li:nth-child(1) {
  grid-row: 1;
  grid-column: 1;
}
#zimmer_galerie.sonnenkopf ul li:nth-child(2) {
  grid-row: 3;
  grid-column: 2;
}
#zimmer_galerie.sonnenkopf ul li:nth-child(3) {
  grid-row: 2 / 4;
  grid-column: 1;
}
#zimmer_galerie.sonnenkopf ul li:nth-child(4) {
  grid-row: 1 / 3;
  grid-column: 2;
}



#sommer_galerie ul,
#winter_galerie ul,
#heimat_galerie ul,
#stadt_galerie ul,
#burgen_galerie ul {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  grid-gap: 15px;
  margin: 50px 10%;
}
#sommer_galerie ul li:nth-child(3),
#winter_galerie ul li:nth-child(3),
#heimat_galerie ul li:nth-child(3) {
  grid-row: 1 / 3;
  grid-column: 3;
}
#sommer_galerie ul li:nth-child(4),
#winter_galerie ul li:nth-child(4),
#heimat_galerie ul li:nth-child(4) {
  grid-row: 2 / 4;
  grid-column: 1;
}
#sommer_galerie ul li:nth-child(5),
#winter_galerie ul li:nth-child(5),
#heimat_galerie ul li:nth-child(5) {
  grid-row: 2 / 4;
  grid-column: 2;
}
#sommer_galerie ul li:nth-child(9),
#winter_galerie ul li:nth-child(9) {
  grid-row: 4 / 6;
  grid-column: 3;
}
#sommer_galerie ul li:nth-child(10),
#winter_galerie ul li:nth-child(10) {
  grid-row: 5 / 7;
  grid-column: 1;
}
#sommer_galerie ul li:nth-child(11),
#winter_galerie ul li:nth-child(11) {
  grid-row: 5 / 7;
  grid-column: 2;
}
#stadt_galerie ul li:nth-child(1),
#burgen_galerie ul li:nth-child(1) {
  grid-row: 1;
  grid-column: 1 / 3;
}
#stadt_galerie ul li:nth-child(3),
#burgen_galerie ul li:nth-child(3) {
  grid-row: 2 / 4;
  grid-column: 1;
}
#stadt_galerie ul li:nth-child(4),
#burgen_galerie ul li:nth-child(4) {
  grid-row: 2 / 4;
  grid-column: 2;
}
.buttonreihe {
  display: flex;
  flex-direction: row;
  justify-content: space-evenly;
  position: absolute;
  width: calc(80% - 100px)
}
.buttonreihe .greenbutton a{
    margin-left: 0;
    position: relative;
    display: block;
}
.buttonreihe .greybutton,
.buttonreihe .greenbutton {
  margin: 0;
}
.buttonreihe .greybutton a {
  padding: 10px 20px;
  font-weight: bold;
  background-color: #BEAB91;
  border-radius: 4px;
  width: 150px;
  margin-top: 30px;
  display: block;
}
.reisereihe .greenbutton a {
  margin-left: 0;
  position: relative;
  width: max-content;
  color: #fff;
  margin-left: auto;
  margin-right: auto;
}
.zimmerbeschreibung {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  grid-gap: 10px
}
.zimmerbeschreibung p {
  font-size: 12px;
  margin-bottom: 10px;
}
.zimmerbeschreibung strong {
  font-size: 16px;
}
.ce_form .widget-text {
  background-color: rgb(18 21 23 / 84%);
  color: #fff;
  padding: 20px;
  display: flex;
  margin-bottom: 5px;
}
.ce_form .widget-text label {
  width: 175px;
  margin-top: auto;
  margin-bottom: auto;
}
.ce_form input[type="text"],
.ce_form input[type="email"],
.ce_form input[type="tel"] {
  padding: 10px;
}
.ce_form .message.ajaxform p {
  text-align: center;
}
.ce_form .message.ajaxconfirm h3 {
  font-family: 'Salamat';
  color: rgb(18 21 23)
}
fieldset {
  background-color: rgb(18 21 23 / 84%);
  color: #fff;
  padding: 20px;
  display: flex;
  margin-bottom: 5px;
  border: 0px solid black;
  margin-left: 0;
  margin-right: 0;
}
fieldset .widget-explanation {
  display: flex;
    flex-direction: column;
    justify-content: center;
}
fieldset .widget-explanation p {
  width: 135px;
  margin-top: auto;
  margin-bottom: auto;
}
fieldset .widget-text.widget-calendar {
  background-color: transparent;
  padding: 0;
  width: 50%;
}
fieldset .widget-text.widget-calendar #ctrl_7_wrapper,
fieldset .widget-text.widget-calendar #ctrl_8_wrapper {
  display: flex;
  flex-direction: row;
  width: 100%;
}
fieldset .widget-text.widget-calendar #ctrl_7_wrapper {
  padding-right: 10px;
}
fieldset .widget-text.widget-calendar #ctrl_8_wrapper {
  margin-left: 10px;
}
fieldset .widget-text.widget-calendar a.input-button {
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding-left: 5px;
}
fieldset .widget-text.widget-calendar a.input-button svg path {
  fill: #fff;
}
.flatpickr-months .flatpickr-month,
span.flatpickr-weekday,
.flatpickr-current-month .flatpickr-monthDropdown-months,
.flatpickr-weekdays,
.flatpickr-day.selected, .flatpickr-day.startRange, 
.flatpickr-day.endRange, .flatpickr-day.selected.inRange, 
.flatpickr-day.startRange.inRange, .flatpickr-day.endRange.inRange, 
.flatpickr-day.selected:focus, .flatpickr-day.startRange:focus, 
.flatpickr-day.endRange:focus, .flatpickr-day.selected:hover, 
.flatpickr-day.startRange:hover, .flatpickr-day.endRange:hover, 
.flatpickr-day.selected.prevMonthDay, .flatpickr-day.startRange.prevMonthDay, 
.flatpickr-day.endRange.prevMonthDay, .flatpickr-day.selected.nextMonthDay, 
.flatpickr-day.startRange.nextMonthDay,
 .flatpickr-day.endRange.nextMonthDay,
 .flatpickr-current-month .flatpickr-monthDropdown-months .flatpickr-monthDropdown-month {
  background-color: #9EC213;
}
.flatpickr-current-month .flatpickr-monthDropdown-months .flatpickr-monthDropdown-month:hover {
  background-color: rgb(18 21 23 / 84%);
}
.flatpickr-calendar.arrowTop:before {
  border-bottom-color: #9EC213;
}
.widget-textarea {
  background-color: rgb(18 21 23 / 84%);
  margin-bottom: 5px;
  color: #fff;
  padding: 20px;
  display: flex;
}
.widget-textarea label {
  width: 135px;
  margin-top: auto;
  margin-bottom: auto;
}
.widget-textarea textarea {
  width: calc(100% - 135px);
}
.ce_form button.greenbutton {
  position: relative;
  width: 100%;
  margin: 0;
  border: none;
  color: #fff;
  background-color:#9EC213;
  cursor: pointer;
  font-size: 16px;
  padding: 20px;
}
.ce_form .widget-submit.greenbutton {
  padding: 0;
  background-color: transparent;
  position: relative;
  width: auto;
  margin: 0;
}
input[type="checkbox"] {
  content: ' ';
  display: inline-flex;
  flex-direction: column;
  justify-content: center;
  width: 22px;
  height: 22px;
  position: relative;
  top: 2px;
  border: 2px solid #9EC213;
  background: white;
  margin-right: 5px;
  box-shadow: inset 0 1px 1px 0 rgb(0 0 0 / 10%);
  text-align: center;
  margin: 0;
  object-fit: scale-down;
}
input[type="checkbox"]:checked {
  box-shadow: inset 0 0 0 2px white;
  content: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='15.141' height='11.595' viewBox='0 0 15.141 11.595'%3E%3Cpath id='Pfad_99' data-name='Pfad 99' d='M25.566,13.563l-1.237-1.273a.266.266,0,0,0-.2-.084h0a.255.255,0,0,0-.2.084l-8.578,8.641L12.234,17.81a.272.272,0,0,0-.394,0l-1.252,1.252a.28.28,0,0,0,0,.4L14.527,23.4a1.245,1.245,0,0,0,.823.4,1.3,1.3,0,0,0,.816-.387h.007l9.4-9.45A.3.3,0,0,0,25.566,13.563Z' transform='translate(-10.505 -12.206)' fill='%239EC213'/%3E%3C/svg%3E%0A");
  }
.widget-select {
  width: calc(50% - 77px);
  display: flex;
}
.widget-select label {
  width: 100px;
  margin-top: auto;
  margin-bottom: auto;
}
.widget-select select {
  width: calc(100% - 100px);
}
.ce_form fieldset .widget-select:nth-child(3)  {
  margin-left: 20px;
}
#article-1 {
  margin-bottom: 400px;
}
#article-41 {
  margin-top: 100px;
  margin-left: auto;
  margin-right: auto;
  margin-bottom: -100px;
}
#article-41 h1 {
  text-align: center;
}
.preise .greenbutton a {
  margin-left: 0;
  position: relative;
  width: max-content;
  color: #fff;
  left: 0;
}
.preise table {
  border-color: transparent;
  background-color: rgb(18 21 23 / 84%);
  color: #fff;
}
.preise table td {
  padding: 5px;
}

.preise table{
	background-color: transparent;
  color: #36322E;
}

.preise table tr td:nth-child(1) {
	width: 10% !important;
}
#popup {
  position: absolute;
  top: 0;
}
#popup .popup {
  display: none;
  height: 100vh;
  flex-direction: column;
  justify-content: center;
  z-index: 1000; 
}
#popup .popup .ce_image {
  width: 75%;
  height: 30vh;
  object-fit: cover;
  margin-left: auto;
  margin-right: auto;
}
#popup .popup .ce_text {
  width: calc(75% - 100px);
  background-color:rgba(18, 21, 23);
  color: #fff;
  margin-left: auto;
  margin-right: auto;
  text-align: center;
  padding: 50px;
}
#popup .greenbutton {
  position: relative;
  width: max-content;
  margin-left: auto;
  margin-right: auto;
}
#popup .close {
  content: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='45.584' height='45.584' viewBox='0 0 45.584 45.584'%3E%3Cg id='Gruppe_45' data-name='Gruppe 45' transform='translate(-359.708 -38.708)'%3E%3Cpath id='Pfad_112' data-name='Pfad 112' d='M3.771.028,52.794.386a3.838,3.838,0,0,1,3.8,3.8,3.705,3.705,0,0,1-3.743,3.743L3.826,7.57a3.838,3.838,0,0,1-3.8-3.8A3.705,3.705,0,0,1,3.771.028Z' transform='translate(365.294 38.669) rotate(45)' fill='%239EC213'/%3E%3Cpath id='Pfad_113' data-name='Pfad 113' d='M3.771-.028,52.794-.386a3.705,3.705,0,0,1,3.743,3.743,3.838,3.838,0,0,1-3.8,3.8L3.716,7.515A3.705,3.705,0,0,1-.028,3.771,3.838,3.838,0,0,1,3.771-.028Z' transform='translate(360 78.959) rotate(-45)' fill='%239EC213'/%3E%3C/g%3E%3C/svg%3E%0A");
  position: fixed;
  width: 30px;
  height: 30px;
  left: 85%;
  z-index: 10;
  cursor: pointer;
  margin-left: 40px;
    margin-top: 10px;
}
#article-8,
#article-9 {
  margin: 100px 10%;
}
#article-8 h1,
#article-9 h1 {
  font-size: 2.5em;
  text-align: center;
  word-break: break-word;
}
#article-8 a,
#article-9 a {
  color: #36322E;
  text-decoration: underline;
}

#article-10,
#article-11  {
  margin: 150px 10%;
  margin-bottom: 0;
  text-align: center; 
}
#article-10 h1,
#article-11 h1 {
  font-size: 3em;
  margin: 0;
}
#article-10 a,
#article-11 a {
  padding: 10px 20px;
  font-weight: bold;
  background-color: #9EC213;
  border-radius: 4px;
  width: 150px;
}


@media (max-width: 1550px){
  #article-41 {
    margin-top: 200px;
  }
  .link_kontakt {
    top: 0;
  }
}
@media (max-width: 1350px){
  .buttonreihe .greenbutton a,
  .buttonreihe .greybutton a {
    width: 100px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    height: 38px;
  }
}
@media (max-width: 1300px){
  #header .ce_image {
    margin-left: 50px;
    padding: 40px 25px 20px;
  }
  #header .ce_image {
    width: 125px;
    z-index: 1000;
  }
  #header .mod_navigation {
    margin-right: 50px;
  }
  .mod_navigation ul {
    justify-content: space-between;
    padding-left: 20px;
  }
  #footer .footer_grey {
    padding: 25px 50px;
  }
}
@media (max-width: 1200px){
  .link_oberstdorf {
    top: 50px;
  }
  .link_oberstdorf img,
  .link_kontakt img {
    width: 150px;
    height: 150px;
  }
  #article-41 {
    margin-top: 150px;
  }
}
@media (min-width: 1050px){
 .hamburger-desktop.hamburger--squeeze {
   display: none !important;
 }
 
}
@media (max-width: 1050px){
  .link_oberstdorf {
    top: 25px;
  }
  .link_oberstdorf img,
  .link_kontakt img {
    width: 100px;
    height: 100px;
  }
  .link_kontakt {
    position: relative;
    margin-top: -40px;
    right: auto;
  }
  .link_kontakt p {
    margin-bottom: 0;
  }
  .link_kontakt p a {
    display: flex;
    justify-content: center;
  }
  #article-41 {
    margin-top: 100px;
  }
  #header > .inside {
    justify-content: space-between;
  }
  #header .mod_navigation{
    position: absolute;
    top: -999px;
    background-color: rgb(18 21 23 / 84%);
    z-index: 999;
    left: 0;
    right: 0;
    height: auto;
  }
  #header .mod_navigation.open {
    top: 70px;
    height: calc(100vh - 70px);
  }
  #header .mod_navigation ul {
    display: flex;
    flex-direction: column;
    width: 100%;
    padding: 0;
    margin: 0;
    align-items: center;
    justify-content: space-evenly;
    height: 100%;
  }
  #header .mod_navigation ul li {
    justify-content: flex-start;
    padding: 10px 0;
  }
  #header.active .ce_image {
    margin-left: calc((100% - 125px - 64px) / 2);
  }
  #headerimage,
  #headerimage img {
    height: 50vh;
  }
  .greytext_ueberschrift {
    margin: 50px 10%;
  }
  .greytext_galerie {
    display: flex;
    flex-direction: column;
  }
  .preise {
    display: flex;
    flex-direction: column;
  }
  .buttonreihe{
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    grid-gap: 15px;
    position: relative;
    width: auto;
  }
  .buttonreihe .greenbutton a,
  .buttonreihe .greybutton a{
    width: 150px;
    margin: 0 auto;
    left: auto;
  }
  #sommer_galerie ul, #winter_galerie ul, #heimat_galerie ul, #stadt_galerie ul, #burgen_galerie ul {
    grid-template-columns: repeat(2, 1fr);
  }
  #sommer_galerie ul li:nth-child(3), #winter_galerie ul li:nth-child(3), #heimat_galerie ul li:nth-child(3) {
    grid-row: 4 / 6;
    grid-column: 1;
  }
  #sommer_galerie ul li:nth-child(4), #winter_galerie ul li:nth-child(4), #heimat_galerie ul li:nth-child(4) {
    grid-row: 2 / 3;
    grid-column: 1 ;
  }
  #sommer_galerie ul li:nth-child(5), #winter_galerie ul li:nth-child(5), #heimat_galerie ul li:nth-child(5) {
    grid-row: 2 / 3;
    grid-column: 2;
  }
  #sommer_galerie ul li:nth-child(6), #winter_galerie ul li:nth-child(6), #heimat_galerie ul li:nth-child(6) {
    grid-row: 4;
    grid-column: 2;
  }
  #sommer_galerie ul li:nth-child(7), #winter_galerie ul li:nth-child(7), #heimat_galerie ul li:nth-child(7) {
    grid-row: 7;
    grid-column: 1;
  }
  #sommer_galerie ul li:nth-child(8), #winter_galerie ul li:nth-child(8), #heimat_galerie ul li:nth-child(8) {
    grid-row: 7;
    grid-column: 2;
  }
  #sommer_galerie ul li:nth-child(9), #winter_galerie ul li:nth-child(9), #heimat_galerie ul li:nth-child(9) {
    grid-row: 5 / 7;
    grid-column: 2;
  }
  #sommer_galerie ul li:nth-child(10), #winter_galerie ul li:nth-child(10), #heimat_galerie ul li:nth-child(10) {
    grid-row: 8 / 10;
    grid-column: 1;
  }
  #sommer_galerie ul li:nth-child(11), #winter_galerie ul li:nth-child(11), #heimat_galerie ul li:nth-child(11) {
    grid-row: 8 / 10;
    grid-column: 2;
  }
  #sommer_galerie ul li:nth-child(12), #winter_galerie ul li:nth-child(12), #heimat_galerie ul li:nth-child(12) {
    grid-row: 6;
    grid-column: 1;
  }
  #stadt_galerie ul li:nth-child(2), #burgen_galerie ul li:nth-child(2) {
    grid-row: 4 / 6;
    grid-column: 1;
  }
  #stadt_galerie ul li:nth-child(5), #burgen_galerie ul li:nth-child(5) {
    grid-row: 4;
    grid-column: 2;
  }
  #stadt_galerie ul li:nth-child(6), #burgen_galerie ul li:nth-child(6) {
    grid-row: 5;
    grid-column: 2;
  }
  #footer .footer_grey {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    grid-gap: 25px;
  }
  #footer .footerlinks {
    grid-column: 1 / 4;
    grid-row: 2;
    width: 550px;
    margin-left: auto;
    margin-right: auto;
  }
  #footer .footer_grey .ce_image {
    margin-left: auto;
  }
  #footer .footer_grey .ce_text:not(.footerlinks) {
    grid-column: 2 / 4;
  }
  .semmeldienst {
    margin: 0 10%;
  }
  #article-21 .greytext_ueberschrift,
  #article-22 .greytext_ueberschrift,
  #article-23 .greytext_ueberschrift,
  #article-38 .greytext_ueberschrift,
  #article-40 .greytext_ueberschrift {
    margin-top: 100px;
  }
  #article-41 iframe {
    width: 100% !important;
    aspect-ratio: 2 / 1;
  }
}
@media (max-width: 925px) {
  p {
    font-size: 14px;
  }
  .greytext_ueberschrift h1 {
    font-size: 40px;
    word-break: break-word;
  }
  fieldset {
    flex-direction: column;
  }
  fieldset .widget-select {
    margin-left: 0 !important;
    margin-top: 25px;
    width: auto;
  }
  fieldset .widget-explanation p {
    font-size: 16px;
  }
  fieldset .widget-text.widget-calendar {
    margin-top: 25px;
    width: auto;
  }
  fieldset .widget-text.widget-calendar #ctrl_8_wrapper {
    margin-left: 0
  }
  fieldset .widget-text.widget-calendar #ctrl_7_wrapper {
    padding-right: 0;
  }
}
@media (max-width: 900px) {
  .buttonreihe{
    grid-template-columns: repeat(2, 1fr);
  }

}

@media (max-width: 650px) {
  .row_unterkunft {
    flex-direction: column;
    padding-top: 0;
  }
  .row_unterkunft .row  p {
    margin-bottom: 0;
  }
  .row_unterkunft .row  p img{
    margin-left: auto;
    margin-right: auto;
  }
  .row_unterkunft .row .greenbutton {
    margin-bottom: 25px;
    margin-top: 10px
  }
  .row_unterkunft .row .greenbutton a {
    margin-right: auto;
    left: auto;
  }
  #article-1 {
    margin-bottom: 550px;
  }
  .buttonreihe {
    grid-template-columns: repeat(1, 1fr);
  }
  .widget-textarea {
    flex-direction: column;
  }
  .widget-textarea textarea {
    width: auto;
    margin-top: 25px;
  }
  #footer .footer_grey{
    display: flex;
    flex-direction: column;
  }
  #footer .footer_grey .ce_image {
    margin-right: auto;
  }
  #footer .footer_grey .ce_text:not(.footerlinks) {
    text-align: center;
  }
  #footer .footer_grey .footerlinks {
    width: auto;
  }
  .link_oberstdorf {
    top: -75px;
  }
  .link_oberstdorf img {
    width: 100px;
    height: 100px;
  }
}
@media (max-width: 500px) {
  #gastgeber_galerie ul, 
  #rubihorn_galerie ul, 
  #widderstein_galerie ul, 
  #hoernerblick_galerie ul,
  #zimmer_galerie ul,
  #sommer_galerie ul, 
  #winter_galerie ul, 
  #heimat_galerie ul, 
  #stadt_galerie ul, 
  #burgen_galerie ul {
    display: flex;
    flex-direction: column;
  }
  #footer .footer_grey .footerlinks {
    grid-template-columns: repeat(2, 1fr);
  }
  .greytext_ueberschrift {
    margin: 50px 5%;
    padding: 25px;
  }
  .greytext_ueberschrift .greenbutton a {
    position: relative;
    left: auto;
    margin-left: auto;
    margin-right: auto;
  }
  .greytext_home_unterkunft {
    margin: 0 5%;
    padding: 25px;
    width: calc(90% - 50px);
    margin-top: -200px;
  }
  #footer .footer_grey {
    padding: 25px;
  }
  .greytext_galerie,
  .preise,
  #sommer_galerie ul, #winter_galerie ul, #heimat_galerie ul, #stadt_galerie ul, #burgen_galerie ul {
    margin: 50px 5%;
  }
  .semmeldienst {
    margin: 0 5%;
}
}


.hamburger {
  /* position: absolute; */
  right: 15px;
  font: inherit;
  display: inline-block;
  overflow: visible;
  margin: 1em;
  padding: 0;
  cursor: pointer;
  transition-timing-function: linear;
  transition-duration: .15s;
  transition-property: opacity, filter;
  text-transform: none;
  color: inherit;
  border: 0;
  background-color: transparent;
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -khtml-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

.hamburger *{
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -khtml-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

.hamburger.is-active .hamburger-inner,
.hamburger.is-active .hamburger-inner:after,
.hamburger.is-active .hamburger-inner:before {
  background-color: #FFF;
}

.hamburger-box {
  position: relative;
  display: inline-block;
  width: 32px;
  height: 24px;
}

.hamburger-inner {
  top: 50%;
  display: block;
  margin-top: -2px
}

.hamburger-inner,
.hamburger-inner:after,
.hamburger-inner:before {
  position: absolute;
  width: 32px;
  height: 2px;
  transition-timing-function: ease;
  transition-duration: .15s;
  transition-property: transform;
  background-color: #FFF;
}

.hamburger-inner:after,
.hamburger-inner:before {
  display: block;
  content: ""
}

.hamburger-inner:before {
  top: -10px
}

.hamburger-inner:after {
  bottom: -10px
}

.hamburger--3dx .hamburger-box {
  perspective: 80px
}

.hamburger--3dx .hamburger-inner {
  transition: transform .15s cubic-bezier(.645, .045, .355, 1), background-color 0s cubic-bezier(.645, .045, .355, 1) .1s
}

.hamburger--3dx .hamburger-inner:after,
.hamburger--3dx .hamburger-inner:before {
  transition: transform 0s cubic-bezier(.645, .045, .355, 1) .1s
}

.hamburger--3dx.is-active .hamburger-inner {
  transform: rotateY(180deg);
  background-color: transparent !important
}

.hamburger--3dx.is-active .hamburger-inner:before {
  transform: translate3d(0, 10px, 0) rotate(45deg)
}

.hamburger--3dx.is-active .hamburger-inner:after {
  transform: translate3d(0, -10px, 0) rotate(-45deg)
}

.hamburger--3dx-r .hamburger-box {
  perspective: 80px
}

.hamburger--3dx-r .hamburger-inner {
  transition: transform .15s cubic-bezier(.645, .045, .355, 1), background-color 0s cubic-bezier(.645, .045, .355, 1) .1s
}

.hamburger--3dx-r .hamburger-inner:after,
.hamburger--3dx-r .hamburger-inner:before {
  transition: transform 0s cubic-bezier(.645, .045, .355, 1) .1s
}

.hamburger--3dx-r.is-active .hamburger-inner {
  transform: rotateY(-180deg);
  background-color: transparent !important
}

.hamburger--3dx-r.is-active .hamburger-inner:before {
  transform: translate3d(0, 10px, 0) rotate(45deg)
}

.hamburger--3dx-r.is-active .hamburger-inner:after {
  transform: translate3d(0, -10px, 0) rotate(-45deg)
}

.hamburger--3dy .hamburger-box {
  perspective: 80px
}

.hamburger--3dy .hamburger-inner {
  transition: transform .15s cubic-bezier(.645, .045, .355, 1), background-color 0s cubic-bezier(.645, .045, .355, 1) .1s
}

.hamburger--3dy .hamburger-inner:after,
.hamburger--3dy .hamburger-inner:before {
  transition: transform 0s cubic-bezier(.645, .045, .355, 1) .1s
}

.hamburger--3dy.is-active .hamburger-inner {
  transform: rotateX(-180deg);
  background-color: transparent !important
}

.hamburger--3dy.is-active .hamburger-inner:before {
  transform: translate3d(0, 10px, 0) rotate(45deg)
}

.hamburger--3dy.is-active .hamburger-inner:after {
  transform: translate3d(0, -10px, 0) rotate(-45deg)
}

.hamburger--3dy-r .hamburger-box {
  perspective: 80px
}

.hamburger--3dy-r .hamburger-inner {
  transition: transform .15s cubic-bezier(.645, .045, .355, 1), background-color 0s cubic-bezier(.645, .045, .355, 1) .1s
}

.hamburger--3dy-r .hamburger-inner:after,
.hamburger--3dy-r .hamburger-inner:before {
  transition: transform 0s cubic-bezier(.645, .045, .355, 1) .1s
}

.hamburger--3dy-r.is-active .hamburger-inner {
  transform: rotateX(180deg);
  background-color: transparent !important
}

.hamburger--3dy-r.is-active .hamburger-inner:before {
  transform: translate3d(0, 10px, 0) rotate(45deg)
}

.hamburger--3dy-r.is-active .hamburger-inner:after {
  transform: translate3d(0, -10px, 0) rotate(-45deg)
}

.hamburger--3dxy .hamburger-box {
  perspective: 80px
}

.hamburger--3dxy .hamburger-inner {
  transition: transform .15s cubic-bezier(.645, .045, .355, 1), background-color 0s cubic-bezier(.645, .045, .355, 1) .1s
}

.hamburger--3dxy .hamburger-inner:after,
.hamburger--3dxy .hamburger-inner:before {
  transition: transform 0s cubic-bezier(.645, .045, .355, 1) .1s
}

.hamburger--3dxy.is-active .hamburger-inner {
  transform: rotateX(180deg) rotateY(180deg);
  background-color: transparent !important
}

.hamburger--3dxy.is-active .hamburger-inner:before {
  transform: translate3d(0, 10px, 0) rotate(45deg)
}

.hamburger--3dxy.is-active .hamburger-inner:after {
  transform: translate3d(0, -10px, 0) rotate(-45deg)
}

.hamburger--3dxy-r .hamburger-box {
  perspective: 80px
}

.hamburger--3dxy-r .hamburger-inner {
  transition: transform .15s cubic-bezier(.645, .045, .355, 1), background-color 0s cubic-bezier(.645, .045, .355, 1) .1s
}

.hamburger--3dxy-r .hamburger-inner:after,
.hamburger--3dxy-r .hamburger-inner:before {
  transition: transform 0s cubic-bezier(.645, .045, .355, 1) .1s
}

.hamburger--3dxy-r.is-active .hamburger-inner {
  transform: rotateX(180deg) rotateY(180deg) rotate(-180deg);
  background-color: transparent !important
}

.hamburger--3dxy-r.is-active .hamburger-inner:before {
  transform: translate3d(0, 10px, 0) rotate(45deg)
}

.hamburger--3dxy-r.is-active .hamburger-inner:after {
  transform: translate3d(0, -10px, 0) rotate(-45deg)
}

.hamburger--arrow.is-active .hamburger-inner:before {
  transform: translate3d(-8px, 0, 0) rotate(-45deg) scaleX(.7)
}

.hamburger--arrow.is-active .hamburger-inner:after {
  transform: translate3d(-8px, 0, 0) rotate(45deg) scaleX(.7)
}

.hamburger--arrow-r.is-active .hamburger-inner:before {
  transform: translate3d(8px, 0, 0) rotate(45deg) scaleX(.7)
}

.hamburger--arrow-r.is-active .hamburger-inner:after {
  transform: translate3d(8px, 0, 0) rotate(-45deg) scaleX(.7)
}

.hamburger--arrowalt .hamburger-inner:before {
  transition: top .1s ease .1s, transform .1s cubic-bezier(.165, .84, .44, 1)
}

.hamburger--arrowalt .hamburger-inner:after {
  transition: bottom .1s ease .1s, transform .1s cubic-bezier(.165, .84, .44, 1)
}

.hamburger--arrowalt.is-active .hamburger-inner:before {
  top: 0;
  transition: top .1s ease, transform .1s cubic-bezier(.895, .03, .685, .22) .1s;
  transform: translate3d(-8px, -10px, 0) rotate(-45deg) scaleX(.7)
}

.hamburger--arrowalt.is-active .hamburger-inner:after {
  bottom: 0;
  transition: bottom .1s ease, transform .1s cubic-bezier(.895, .03, .685, .22) .1s;
  transform: translate3d(-8px, 10px, 0) rotate(45deg) scaleX(.7)
}

.hamburger--arrowalt-r .hamburger-inner:before {
  transition: top .1s ease .1s, transform .1s cubic-bezier(.165, .84, .44, 1)
}

.hamburger--arrowalt-r .hamburger-inner:after {
  transition: bottom .1s ease .1s, transform .1s cubic-bezier(.165, .84, .44, 1)
}

.hamburger--arrowalt-r.is-active .hamburger-inner:before {
  top: 0;
  transition: top .1s ease, transform .1s cubic-bezier(.895, .03, .685, .22) .1s;
  transform: translate3d(8px, -10px, 0) rotate(45deg) scaleX(.7)
}

.hamburger--arrowalt-r.is-active .hamburger-inner:after {
  bottom: 0;
  transition: bottom .1s ease, transform .1s cubic-bezier(.895, .03, .685, .22) .1s;
  transform: translate3d(8px, 10px, 0) rotate(-45deg) scaleX(.7)
}

.hamburger--arrowturn.is-active .hamburger-inner {
  transform: rotate(-180deg)
}

.hamburger--arrowturn.is-active .hamburger-inner:before {
  transform: translate3d(8px, 0, 0) rotate(45deg) scaleX(.7)
}

.hamburger--arrowturn.is-active .hamburger-inner:after {
  transform: translate3d(8px, 0, 0) rotate(-45deg) scaleX(.7)
}

.hamburger--arrowturn-r.is-active .hamburger-inner {
  transform: rotate(-180deg)
}

.hamburger--arrowturn-r.is-active .hamburger-inner:before {
  transform: translate3d(-8px, 0, 0) rotate(-45deg) scaleX(.7)
}

.hamburger--arrowturn-r.is-active .hamburger-inner:after {
  transform: translate3d(-8px, 0, 0) rotate(45deg) scaleX(.7)
}

.hamburger--boring .hamburger-inner,
.hamburger--boring .hamburger-inner:after,
.hamburger--boring .hamburger-inner:before {
  transition-property: none
}

.hamburger--boring.is-active .hamburger-inner {
  transform: rotate(45deg)
}

.hamburger--boring.is-active .hamburger-inner:before {
  top: 0;
  opacity: 0
}

.hamburger--boring.is-active .hamburger-inner:after {
  bottom: 0;
  transform: rotate(-90deg)
}

.hamburger--collapse .hamburger-inner {
  top: auto;
  bottom: 0;
  transition-delay: .13s;
  transition-timing-function: cubic-bezier(.55, .055, .675, .19);
  transition-duration: .13s
}

.hamburger--collapse .hamburger-inner:after {
  top: -20px;
  transition: top .2s cubic-bezier(.33333, .66667, .66667, 1) .2s, opacity .1s linear
}

.hamburger--collapse .hamburger-inner:before {
  transition: top .12s cubic-bezier(.33333, .66667, .66667, 1) .2s, transform .13s cubic-bezier(.55, .055, .675, .19)
}

.hamburger--collapse.is-active .hamburger-inner {
  transition-delay: .22s;
  transition-timing-function: cubic-bezier(.215, .61, .355, 1);
  transform: translate3d(0, -10px, 0) rotate(-45deg)
}

.hamburger--collapse.is-active .hamburger-inner:after {
  top: 0;
  transition: top .2s cubic-bezier(.33333, 0, .66667, .33333), opacity .1s linear .22s;
  opacity: 0
}

.hamburger--collapse.is-active .hamburger-inner:before {
  top: 0;
  transition: top .1s cubic-bezier(.33333, 0, .66667, .33333) .16s, transform .13s cubic-bezier(.215, .61, .355, 1) .25s;
  transform: rotate(-90deg)
}

.hamburger--collapse-r .hamburger-inner {
  top: auto;
  bottom: 0;
  transition-delay: .13s;
  transition-timing-function: cubic-bezier(.55, .055, .675, .19);
  transition-duration: .13s
}

.hamburger--collapse-r .hamburger-inner:after {
  top: -20px;
  transition: top .2s cubic-bezier(.33333, .66667, .66667, 1) .2s, opacity .1s linear
}

.hamburger--collapse-r .hamburger-inner:before {
  transition: top .12s cubic-bezier(.33333, .66667, .66667, 1) .2s, transform .13s cubic-bezier(.55, .055, .675, .19)
}

.hamburger--collapse-r.is-active .hamburger-inner {
  transition-delay: .22s;
  transition-timing-function: cubic-bezier(.215, .61, .355, 1);
  transform: translate3d(0, -10px, 0) rotate(45deg)
}

.hamburger--collapse-r.is-active .hamburger-inner:after {
  top: 0;
  transition: top .2s cubic-bezier(.33333, 0, .66667, .33333), opacity .1s linear .22s;
  opacity: 0
}

.hamburger--collapse-r.is-active .hamburger-inner:before {
  top: 0;
  transition: top .1s cubic-bezier(.33333, 0, .66667, .33333) .16s, transform .13s cubic-bezier(.215, .61, .355, 1) .25s;
  transform: rotate(90deg)
}

.hamburger--elastic .hamburger-inner {
  top: 2px;
  transition-timing-function: cubic-bezier(.68, -.55, .265, 1.55);
  transition-duration: .275s
}

.hamburger--elastic .hamburger-inner:before {
  top: 10px;
  transition: opacity .125s ease .275s
}

.hamburger--elastic .hamburger-inner:after {
  top: 20px;
  transition: transform .275s cubic-bezier(.68, -.55, .265, 1.55)
}

.hamburger--elastic.is-active .hamburger-inner {
  transition-delay: 75ms;
  transform: translate3d(0, 10px, 0) rotate(135deg)
}

.hamburger--elastic.is-active .hamburger-inner:before {
  transition-delay: 0s;
  opacity: 0
}

.hamburger--elastic.is-active .hamburger-inner:after {
  transition-delay: 75ms;
  transform: translate3d(0, -20px, 0) rotate(-270deg)
}

.hamburger--elastic-r .hamburger-inner {
  top: 2px;
  transition-timing-function: cubic-bezier(.68, -.55, .265, 1.55);
  transition-duration: .275s
}

.hamburger--elastic-r .hamburger-inner:before {
  top: 10px;
  transition: opacity .125s ease .275s
}

.hamburger--elastic-r .hamburger-inner:after {
  top: 20px;
  transition: transform .275s cubic-bezier(.68, -.55, .265, 1.55)
}

.hamburger--elastic-r.is-active .hamburger-inner {
  transition-delay: 75ms;
  transform: translate3d(0, 10px, 0) rotate(-135deg)
}

.hamburger--elastic-r.is-active .hamburger-inner:before {
  transition-delay: 0s;
  opacity: 0
}

.hamburger--elastic-r.is-active .hamburger-inner:after {
  transition-delay: 75ms;
  transform: translate3d(0, -20px, 0) rotate(270deg)
}

.hamburger--emphatic {
  overflow: hidden
}

.hamburger--emphatic .hamburger-inner {
  transition: background-color .125s ease-in .175s
}

.hamburger--emphatic .hamburger-inner:before {
  left: 0;
  transition: transform .125s cubic-bezier(.6, .04, .98, .335), top .05s linear .125s, left .125s ease-in .175s
}

.hamburger--emphatic .hamburger-inner:after {
  top: 10px;
  right: 0;
  transition: transform .125s cubic-bezier(.6, .04, .98, .335), top .05s linear .125s, right .125s ease-in .175s
}

.hamburger--emphatic.is-active .hamburger-inner {
  transition-delay: 0s;
  transition-timing-function: ease-out;
  background-color: transparent !important
}

.hamburger--emphatic.is-active .hamburger-inner:before {
  top: -80px;
  left: -80px;
  transition: left .125s ease-out, top .05s linear .125s, transform .125s cubic-bezier(.075, .82, .165, 1) .175s;
  transform: translate3d(80px, 80px, 0) rotate(45deg)
}

.hamburger--emphatic.is-active .hamburger-inner:after {
  top: -80px;
  right: -80px;
  transition: right .125s ease-out, top .05s linear .125s, transform .125s cubic-bezier(.075, .82, .165, 1) .175s;
  transform: translate3d(-80px, 80px, 0) rotate(-45deg)
}

.hamburger--emphatic-r {
  overflow: hidden
}

.hamburger--emphatic-r .hamburger-inner {
  transition: background-color .125s ease-in .175s
}

.hamburger--emphatic-r .hamburger-inner:before {
  left: 0;
  transition: transform .125s cubic-bezier(.6, .04, .98, .335), top .05s linear .125s, left .125s ease-in .175s
}

.hamburger--emphatic-r .hamburger-inner:after {
  top: 10px;
  right: 0;
  transition: transform .125s cubic-bezier(.6, .04, .98, .335), top .05s linear .125s, right .125s ease-in .175s
}

.hamburger--emphatic-r.is-active .hamburger-inner {
  transition-delay: 0s;
  transition-timing-function: ease-out;
  background-color: transparent !important
}

.hamburger--emphatic-r.is-active .hamburger-inner:before {
  top: 80px;
  left: -80px;
  transition: left .125s ease-out, top .05s linear .125s, transform .125s cubic-bezier(.075, .82, .165, 1) .175s;
  transform: translate3d(80px, -80px, 0) rotate(-45deg)
}

.hamburger--emphatic-r.is-active .hamburger-inner:after {
  top: 80px;
  right: -80px;
  transition: right .125s ease-out, top .05s linear .125s, transform .125s cubic-bezier(.075, .82, .165, 1) .175s;
  transform: translate3d(-80px, -80px, 0) rotate(45deg)
}

.hamburger--minus .hamburger-inner:after,
.hamburger--minus .hamburger-inner:before {
  transition: bottom .08s ease-out 0s, top .08s ease-out 0s, opacity 0s linear
}

.hamburger--minus.is-active .hamburger-inner:after,
.hamburger--minus.is-active .hamburger-inner:before {
  transition: bottom .08s ease-out, top .08s ease-out, opacity 0s linear .08s;
  opacity: 0
}

.hamburger--minus.is-active .hamburger-inner:before {
  top: 0
}

.hamburger--minus.is-active .hamburger-inner:after {
  bottom: 0
}

.hamburger--slider .hamburger-inner {
  top: 2px
}

.hamburger--slider .hamburger-inner:before {
  top: 10px;
  transition-timing-function: ease;
  transition-duration: .15s;
  transition-property: transform, opacity
}

.hamburger--slider .hamburger-inner:after {
  top: 20px
}

.hamburger--slider.is-active .hamburger-inner {
  transform: translate3d(0, 10px, 0) rotate(45deg)
}

.hamburger--slider.is-active .hamburger-inner:before {
  transform: rotate(-45deg) translate3d(-5.71429px, -6px, 0);
  opacity: 0
}

.hamburger--slider.is-active .hamburger-inner:after {
  transform: translate3d(0, -20px, 0) rotate(-90deg)
}

.hamburger--slider-r .hamburger-inner {
  top: 2px
}

.hamburger--slider-r .hamburger-inner:before {
  top: 10px;
  transition-timing-function: ease;
  transition-duration: .15s;
  transition-property: transform, opacity
}

.hamburger--slider-r .hamburger-inner:after {
  top: 20px
}

.hamburger--slider-r.is-active .hamburger-inner {
  transform: translate3d(0, 10px, 0) rotate(-45deg)
}

.hamburger--slider-r.is-active .hamburger-inner:before {
  transform: rotate(45deg) translate3d(5.71429px, -6px, 0);
  opacity: 0
}

.hamburger--slider-r.is-active .hamburger-inner:after {
  transform: translate3d(0, -20px, 0) rotate(90deg)
}

.hamburger--spin .hamburger-inner {
  transition-timing-function: cubic-bezier(.55, .055, .675, .19);
  transition-duration: .22s
}

.hamburger--spin .hamburger-inner:before {
  transition: top .1s ease-in .25s, opacity .1s ease-in
}

.hamburger--spin .hamburger-inner:after {
  transition: bottom .1s ease-in .25s, transform .22s cubic-bezier(.55, .055, .675, .19)
}

.hamburger--spin.is-active .hamburger-inner {
  transition-delay: .12s;
  transition-timing-function: cubic-bezier(.215, .61, .355, 1);
  transform: rotate(225deg)
}

.hamburger--spin.is-active .hamburger-inner:before {
  top: 0;
  transition: top .1s ease-out, opacity .1s ease-out .12s;
  opacity: 0
}

.hamburger--spin.is-active .hamburger-inner:after {
  bottom: 0;
  transition: bottom .1s ease-out, transform .22s cubic-bezier(.215, .61, .355, 1) .12s;
  transform: rotate(-90deg)
}

.hamburger--spin-r .hamburger-inner {
  transition-timing-function: cubic-bezier(.55, .055, .675, .19);
  transition-duration: .22s
}

.hamburger--spin-r .hamburger-inner:before {
  transition: top .1s ease-in .25s, opacity .1s ease-in
}

.hamburger--spin-r .hamburger-inner:after {
  transition: bottom .1s ease-in .25s, transform .22s cubic-bezier(.55, .055, .675, .19)
}

.hamburger--spin-r.is-active .hamburger-inner {
  transition-delay: .12s;
  transition-timing-function: cubic-bezier(.215, .61, .355, 1);
  transform: rotate(-225deg)
}

.hamburger--spin-r.is-active .hamburger-inner:before {
  top: 0;
  transition: top .1s ease-out, opacity .1s ease-out .12s;
  opacity: 0
}

.hamburger--spin-r.is-active .hamburger-inner:after {
  bottom: 0;
  transition: bottom .1s ease-out, transform .22s cubic-bezier(.215, .61, .355, 1) .12s;
  transform: rotate(90deg)
}

.hamburger--spring .hamburger-inner {
  top: 2px;
  transition: background-color 0s linear .13s
}

.hamburger--spring .hamburger-inner:before {
  top: 10px;
  transition: top .1s cubic-bezier(.33333, .66667, .66667, 1) .2s, transform .13s cubic-bezier(.55, .055, .675, .19)
}

.hamburger--spring .hamburger-inner:after {
  top: 20px;
  transition: top .2s cubic-bezier(.33333, .66667, .66667, 1) .2s, transform .13s cubic-bezier(.55, .055, .675, .19)
}

.hamburger--spring.is-active .hamburger-inner {
  transition-delay: .22s;
  background-color: transparent !important
}

.hamburger--spring.is-active .hamburger-inner:before {
  top: 0;
  transition: top .1s cubic-bezier(.33333, 0, .66667, .33333) .15s, transform .13s cubic-bezier(.215, .61, .355, 1) .22s;
  transform: translate3d(0, 10px, 0) rotate(45deg)
}

.hamburger--spring.is-active .hamburger-inner:after {
  top: 0;
  transition: top .2s cubic-bezier(.33333, 0, .66667, .33333), transform .13s cubic-bezier(.215, .61, .355, 1) .22s;
  transform: translate3d(0, 10px, 0) rotate(-45deg)
}

.hamburger--spring-r .hamburger-inner {
  top: auto;
  bottom: 0;
  transition-delay: 0s;
  transition-timing-function: cubic-bezier(.55, .055, .675, .19);
  transition-duration: .13s
}

.hamburger--spring-r .hamburger-inner:after {
  top: -20px;
  transition: top .2s cubic-bezier(.33333, .66667, .66667, 1) .2s, opacity 0s linear
}

.hamburger--spring-r .hamburger-inner:before {
  transition: top .1s cubic-bezier(.33333, .66667, .66667, 1) .2s, transform .13s cubic-bezier(.55, .055, .675, .19)
}

.hamburger--spring-r.is-active .hamburger-inner {
  transition-delay: .22s;
  transition-timing-function: cubic-bezier(.215, .61, .355, 1);
  transform: translate3d(0, -10px, 0) rotate(-45deg)
}

.hamburger--spring-r.is-active .hamburger-inner:after {
  top: 0;
  transition: top .2s cubic-bezier(.33333, 0, .66667, .33333), opacity 0s linear .22s;
  opacity: 0
}

.hamburger--spring-r.is-active .hamburger-inner:before {
  top: 0;
  transition: top .1s cubic-bezier(.33333, 0, .66667, .33333) .15s, transform .13s cubic-bezier(.215, .61, .355, 1) .22s;
  transform: rotate(90deg)
}

.hamburger--stand .hamburger-inner {
  transition: transform 75ms cubic-bezier(.55, .055, .675, .19) .15s, background-color 0s linear 75ms
}

.hamburger--stand .hamburger-inner:before {
  transition: top 75ms ease-in 75ms, transform 75ms cubic-bezier(.55, .055, .675, .19) 0s
}

.hamburger--stand .hamburger-inner:after {
  transition: bottom 75ms ease-in 75ms, transform 75ms cubic-bezier(.55, .055, .675, .19) 0s
}

.hamburger--stand.is-active .hamburger-inner {
  transition: transform 75ms cubic-bezier(.215, .61, .355, 1) 0s, background-color 0s linear .15s;
  transform: rotate(90deg);
  background-color: transparent !important
}

.hamburger--stand.is-active .hamburger-inner:before {
  top: 0;
  transition: top 75ms ease-out .1s, transform 75ms cubic-bezier(.215, .61, .355, 1) .15s;
  transform: rotate(-45deg)
}

.hamburger--stand.is-active .hamburger-inner:after {
  bottom: 0;
  transition: bottom 75ms ease-out .1s, transform 75ms cubic-bezier(.215, .61, .355, 1) .15s;
  transform: rotate(45deg)
}

.hamburger--stand-r .hamburger-inner {
  transition: transform 75ms cubic-bezier(.55, .055, .675, .19) .15s, background-color 0s linear 75ms
}

.hamburger--stand-r .hamburger-inner:before {
  transition: top 75ms ease-in 75ms, transform 75ms cubic-bezier(.55, .055, .675, .19) 0s
}

.hamburger--stand-r .hamburger-inner:after {
  transition: bottom 75ms ease-in 75ms, transform 75ms cubic-bezier(.55, .055, .675, .19) 0s
}

.hamburger--stand-r.is-active .hamburger-inner {
  transition: transform 75ms cubic-bezier(.215, .61, .355, 1) 0s, background-color 0s linear .15s;
  transform: rotate(-90deg);
  background-color: transparent !important
}

.hamburger--stand-r.is-active .hamburger-inner:before {
  top: 0;
  transition: top 75ms ease-out .1s, transform 75ms cubic-bezier(.215, .61, .355, 1) .15s;
  transform: rotate(-45deg)
}

.hamburger--stand-r.is-active .hamburger-inner:after {
  bottom: 0;
  transition: bottom 75ms ease-out .1s, transform 75ms cubic-bezier(.215, .61, .355, 1) .15s;
  transform: rotate(45deg)
}

.hamburger--squeeze .hamburger-inner {
  transition-timing-function: cubic-bezier(.55, .055, .675, .19);
  transition-duration: 75ms
}

.hamburger--squeeze .hamburger-inner:before {
  transition: top 75ms ease .12s, opacity 75ms ease
}

.hamburger--squeeze .hamburger-inner:after {
  transition: bottom 75ms ease .12s, transform 75ms cubic-bezier(.55, .055, .675, .19)
}

.hamburger--squeeze.is-active .hamburger-inner {
  transition-delay: .12s;
  transition-timing-function: cubic-bezier(.215, .61, .355, 1);
  transform: rotate(45deg)
}

.hamburger--squeeze.is-active .hamburger-inner:before {
  top: 0;
  transition: top 75ms ease, opacity 75ms ease .12s;
  opacity: 0
}

.hamburger--squeeze.is-active .hamburger-inner:after {
  bottom: 0;
  transition: bottom 75ms ease, transform 75ms cubic-bezier(.215, .61, .355, 1) .12s;
  transform: rotate(-90deg)
}

.hamburger--vortex .hamburger-inner {
  transition-timing-function: cubic-bezier(.19, 1, .22, 1);
  transition-duration: .2s
}

.hamburger--vortex .hamburger-inner:after,
.hamburger--vortex .hamburger-inner:before {
  transition-delay: .1s;
  transition-timing-function: linear;
  transition-duration: 0s
}

.hamburger--vortex .hamburger-inner:before {
  transition-property: top, opacity
}

.hamburger--vortex .hamburger-inner:after {
  transition-property: bottom, transform
}

.hamburger--vortex.is-active .hamburger-inner {
  transition-timing-function: cubic-bezier(.19, 1, .22, 1);
  transform: rotate(765deg)
}

.hamburger--vortex.is-active .hamburger-inner:after,
.hamburger--vortex.is-active .hamburger-inner:before {
  transition-delay: 0s
}

.hamburger--vortex.is-active .hamburger-inner:before {
  top: 0;
  opacity: 0
}

.hamburger--vortex.is-active .hamburger-inner:after {
  bottom: 0;
  transform: rotate(90deg)
}

.hamburger--vortex-r .hamburger-inner {
  transition-timing-function: cubic-bezier(.19, 1, .22, 1);
  transition-duration: .2s
}

.hamburger--vortex-r .hamburger-inner:after,
.hamburger--vortex-r .hamburger-inner:before {
  transition-delay: .1s;
  transition-timing-function: linear;
  transition-duration: 0s
}

.hamburger--vortex-r .hamburger-inner:before {
  transition-property: top, opacity
}

.hamburger--vortex-r .hamburger-inner:after {
  transition-property: bottom, transform
}

.hamburger--vortex-r.is-active .hamburger-inner {
  transition-timing-function: cubic-bezier(.19, 1, .22, 1);
  transform: rotate(-765deg)
}

.hamburger--vortex-r.is-active .hamburger-inner:after,
.hamburger--vortex-r.is-active .hamburger-inner:before {
  transition-delay: 0s
}

.hamburger--vortex-r.is-active .hamburger-inner:before {
  top: 0;
  opacity: 0
}

.hamburger--vortex-r.is-active .hamburger-inner:after {
  bottom: 0;
  transform: rotate(-90deg)
}

.hamburger--header {
  margin-right: -5px;
  padding-right: 0;
  padding-left: 5px;
  cursor: default;
  vertical-align: middle
}

.hamburger--header .hamburger-inner,
.hamburger--header .hamburger-inner:after,
.hamburger--header .hamburger-inner:before,
.hamburger--header.is-active .hamburger-inner,
.hamburger--header.is-active .hamburger-inner:after,
.hamburger--header.is-active .hamburger-inner:before {
  background-color: #222
}

.hamburger--header.hamburger--elastic .hamburger-inner,
.hamburger--header.hamburger--slider .hamburger-inner {
  top: 2px
}

.hamburger--header:hover {
  opacity: 1
}

.hamburger-wrap {
  text-align: center
}

.hamburger--accessible {
  display: inline-block
}

.hamburger--accessible .hamburger-box {
  display: inline-block;
  vertical-align: middle
}

.hamburger--accessible .hamburger-inner,
.hamburger--accessible .hamburger-inner:after,
.hamburger--accessible .hamburger-inner:before,
.hamburger--accessible.is-active .hamburger-inner,
.hamburger--accessible.is-active .hamburger-inner:after,
.hamburger--accessible.is-active .hamburger-inner:before {
  background-color: #222
}

.hamburger-label {
  font-weight: 600;
  display: inline-block;
  margin-left: 5px;
  vertical-align: middle;
  text-transform: uppercase
}

.hamburger-label-hidden {
  display: none
}

.name {
  font-size: .8em;
  font-weight: 600;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  padding-top: 1.25em;
  padding-top: 2em;
  color: #1A1A1A
}

.information-directions {
  font-size: 14px;
  width: 100%
}

.browsers,
.types {
  padding-left: 0;
  list-style: none
}

.browsers li,
.types li {
  margin-bottom: .25em
}

.browsers {
  padding-left: 1em;
  column-count: 2
}

.hint {
  display: none;
  margin-bottom: 1em
}

.hint.is-visible {
  display: block
}

@media only screen and (min-width:320px) {
  .browsers {
    column-count: 2
  }
}

@media only screen and (min-width:480px) {
  .types {
    column-count: 2
  }

  .browsers {
    column-count: 3
  }
}

@media only screen and (min-width:632px) {
  .information-directions {
    font-size: 15px
  }
}

#carbonads {
  padding-top: 20px;
  padding-bottom: 32px
}

#carbonads a {
  text-decoration: none
}

#carbonads>span {
  position: relative;
  display: block;
  width: 100%;
  max-width: 300px;
  margin-right: auto;
  margin-left: auto
}

.carbon-wrap {
  position: relative;
  display: table;
  width: 100%
}

.carbon-img,
.carbon-text {
  display: table-cell;
  text-align: left;
  vertical-align: middle
}

.carbon-img {
  background-color: #1A1A1A
}

.carbon-img img {
  display: block
}

.carbon-text {
  font-size: 12px;
  line-height: 1.2;
  padding-left: 15px
}

.carbon-poweredby {
  font-size: 11px;
  position: absolute;
  bottom: -20px;
  left: 0;
  width: 130px;
  text-align: center;
  color: #999
}

@media only screen and (min-width:1280px) {
  #carbonads {
    position: absolute;
    top: 45px;
    right: 30px;
    padding-top: 0;
    padding-bottom: 0
  }
}