/*
* Skeleton V1.2
* Copyright 2011, Dave Gamache
* www.getskeleton.com
* Free to use under the MIT license.
* http://www.opensource.org/licenses/mit-license.php
* 6/20/2012
*/

/* Table of Content
==================================================
	#Site Styles
	#Page Styles
	#Media Queries
	#Font-Face */

/* #Site Styles
================================================== */


body{
    background-image: url('/templates/images/schriftzug.png');
    background-repeat: no-repeat;
    background-position: center 533px;
    font-family: Helvetica, Verdana, sans-serif;
    color: #57585a;
    font-size: 12px;
    line-height: 20px;
    letter-spacing: 1px;
    word-spacing: 1px;
    /*text-align: justify;*/
}

#left {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    padding-right: 15px;
}


#seitenbilder.slider,
#seitenbilder.slider img {
    float: left;
    width: 700px !important;
    max-width: none;
}

#metalist {
    float: left;
    width: 100%;
    margin-top: 15px;
    margin-bottom: 53px;
    text-transform: uppercase;
}

.meta {
    float: left;
    margin-bottom: 0px;
}
.meta.pos_0{
    margin-right: 58px;
}
.meta.pos_1{
    margin-right: 40px;
}
.meta.pos_100 a{
    color: #1d3e92;
}

.topinfo_1, .topinfo_2 {
    float: left;
    width: 50%;
}

.thumb {
    float: left;
    width: 50px;
    height: 50px;
    margin-right: 4px;
    overflow: hidden;
    margin-bottom: 4px;
    background-color: #E0E4EF;
    text-align: center;
}

.galery_img.pos_1 {
    float: left;
    max-width: 320px;
    width: 100%;
    margin-bottom: 4px;
}

.thumb.pos_7,
.thumb.pos_14,
.thumb.pos_21,
.thumb.pos_28{
    margin-right: 0;
}


#right {
    box-sizing: border-box;
    border-top: 1px solid #9A9B9D;
    padding-top: 10px;
}

h1,h2,h3,h4,h5,h6{
    font-family: Helvetica, Verdana, sans-serif;
    color: #1d3e92;
    margin: 0px 0px 10px 0px;
    text-transform: uppercase;
    font-weight: normal;
    word-spacing: 1px;
    letter-spacing: 3px;
}

h1 {
    font-size: 16px;
    line-height: 20px;
}
h2{
    font-size: 14px;
    line-height: 18px;
}

a{
    color: #57585a;
    text-decoration: none;
}
a:hover,
a:focus{
    color: #1d3e92;
}

.level1 a:hover, .level1 a.current1, .level1 a:focus, .metalink:hover, .metalink:focus, .metalink.current {
    color: #1D3E92;
}


div img{
    max-width: 100%;
}

#header{
    margin-top: 80px;
    margin-bottom: 30px;
}
#navigation-toggle{
    display: none;
}
ul.level1{
    text-align: left;
}
ul.level1 li a{
    color: #57585a;
    text-transform: uppercase;

}
ul.level1 li a:hover,
ul.level1 li a:focus{
    color: #1d3e92;
}

ul.level1>li:nth-child(7n){
    margin-top: 35px;
}

#fb_plugin {
    float: left;
    width: 100%;
    margin-top: 10px;
}

#video-portrait {
    margin-top: 25px;
}
#video-portrait strong{
    color: #1d3e92;
    display: block;
    font-size: 14px;
    margin-top: 5px;
    text-align: center;
    width: 100%;
}
#video-portrait-responsive {
	display: none;
	margin: -5px 0 5px 0;
}
#video-portrait-responsive a {
	color: #1d3e92;
}
#full{
    position: relative;
    margin-bottom: 17px;
    overflow: hidden;
}
#seitenbilder{
    margin-bottom: 18px;
}
.news-overlay{
    height: 353px;
    background-color: rgba(255,255,255,0.9);
    position: absolute;
    z-index: 1000;
    top: 0px;
    right: 0px;
    padding: 15px;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}

#footer{
    padding-top: 20px;
}
#footer-inner p{
    font-size: 12px;
}
#footer a,
#main-content a{
    color: #1d3e92;
}
#main-content{
    font-size: 13px;
}

#main-content #right a:hover,
#main-content #right a:focus,
#footer p a:hover,
#footer p a:focus{
    border-bottom: 1px dotted #1d3e92;
}

#main-content #right a.no-hover:hover,
#main-content #right a.no-hover:focus{
    border-bottom: none;
}

/* Fancybox */
span.fncb_fancy_title {
    font-size:12px;
    font-weight:bold;
}
span.fncb_fancy_displaycounter {
    font-size:11px;
}
#fancybox-title {
    line-height:16px;
    text-align:left;
}
#fncb_bottomNavClose {
    cursor:pointer;
    display:block;
}

/* Fancybox END */


#responsive-footer{
    display: none;
}

/* #Page Styles
================================================== */

/* #Media Queries
================================================== */

	/* Smaller than standard 960 (devices and browsers) */
	@media only screen and (max-width: 959px) {

        .thumb.pos_7, .thumb.pos_14, .thumb.pos_21, .thumb.pos_28{
            margin-right: 4px;
        }

        .meta.pos_0{
            margin-right: 23px;
        }
        .meta.pos_1{
            margin-right: 15px;
        }
    }
    @media only screen and (min-width: 768px) {
        ul.level1{
            display: block !important;
        }

    }
	/* All Mobile Sizes (devices and browser) */
	@media only screen and (max-width: 767px) {
       #header{
           margin-top: 20px;
       }
        #logo{
            text-align: center;
        }
        #meta div.six.columns{
            width: 45%;
        }
        #meta>div:nth-child(2n){
            float: right;
        }
        #meta>div:nth-child(2n) li:first-child{
            margin-left: 22px;
        }
        #meta .six.columns ul li:last-child{
            float: right;
        }
        #topinfo{
            float: left;
            width: 100%;
        }
        #metalist{
            margin-bottom: 20px;
            margin-top: 20px;
        }
        #metalist .meta{
            margin-right: 0px;
        }
        #metalist .meta.pos_3{
            margin-right: 0px;
        }
        #metalist .meta.pos_1{
            float: right;
        }
        .meta.pos_100{
            display: none;
        }
        #navigation-toggle{
            display: block;
            width: 100%;
            float: left;
            text-transform: uppercase;
            margin-bottom: 10px;
            padding-bottom: 10px;
            padding-top: 10px;
            border-bottom: 1px solid #1D3E92;
            border-top: 1px solid #1D3E92;
            cursor: pointer;
        }
        #navigation-toggle i{
            float: right;
            position: relative;
            font-size: 17px;
            top: 1px;
        }
        ul.level1{
            display: none;
            flaot: left;
            width: 100%;
        }
        ul.level1>li:nth-child(7n){
            margin-top: 0px;
        }
        ul.level1 li{
            border-bottom: 1px solid #1D3E92;
            padding-bottom: 10px;
        }

        #video-portrait{
            display: none;
        }
		#video-portrait-responsive {
			display: block;
		}
         #seitenbilder{
            float: left;
        }
        #seitenbilder>a{
            float: left;
            width: 100%;
            display: block;
        }
        #seitenbilder img.pos_1{
            width: 100%;
            max-width: none;
        }
        #left{
            padding-right: 0px;
        }
        #right{
            margin-top: 20px;
        }
        #footer{
           border-top: 1px solid #9A9B9D
        }
        #gilden-hut{
            margin-bottom: 10px;
        }
        #responsive-footer{
            z-index: 99999999;
            display: block;
            position: fixed;
            bottom: 0px;
            width: 100%;
            background-color: rgba(255,255,255,0.8);
            text-align: right;
        }
        #responsive-footer i{

            font-size: 20px;
            padding: 10px 5px;
        }
        body{
            padding-bottom: 40px;
        }
        #topinfo .reservationen, #fb_plugin {
            display: none;
        }
        #seitenbilder.slider, #seitenbilder.slider img {
            width: 420px !important;
        }

        #wrapper .news-overlay {
            float: left;
            width: 100%;
            position: static;
            background-color: #E0E0E0;
            height: auto;
            margin-bottom: 20px;
            margin-top: 10px;
        }
   }

	/* Mobile Portrait Size to Mobile Landscape Size (devices and browsers) */
	@media only screen and (max-width: 479px) {
        #meta>div.six.columns:first-child{
            width: 55%;
        }
        #meta div.six.columns{
            width: 45%;
        }
        #meta>div:nth-child(2n){
            float: right;
        }
        #meta>div:nth-child(2n) li:first-child{
            margin-left: 22px;
        }
        #meta .six.columns ul li:last-child{
            float: right;
        }
        #topinfo .reservationen, #fb_plugin {
            display: none;
        }
        #seitenbilder.slider, #seitenbilder.slider img {
            float: left;
            width: 300px !important;
            max-width: none;
        }

        #wrapper .news-overlay {
            float: left;
            width: 100%;
            position: static;
            background-color: #E0E0E0;
            height: auto;
            margin-bottom: 20px;
            margin-top: 10px;
        }
    }


/* #Font-Face
================================================== */
/* 	This is the proper syntax for an @font-face file
		Just create a "fonts" folder at the root,
		copy your FontName into code below and remove
		comment brackets */

/*	@font-face {
	    font-family: 'FontName';
	    src: url('../fonts/FontName.eot');
	    src: url('../fonts/FontName.eot?iefix') format('eot'),
	         url('../fonts/FontName.woff') format('woff'),
	         url('../fonts/FontName.ttf') format('truetype'),
	         url('../fonts/FontName.svg#webfontZam02nTh') format('svg');
	    font-weight: normal;
	    font-style: normal; }
*/