

/* ///////////////////////////////////////////////////////////////////// */
/* ///   TomSoft Css © 2015                                              */
/* ///   D'AMICO CUSTOM Styles                                           */
/* ///////////////////////////////////////////////////////////////////// */

    html,body {
        height: 100%;
        -moz-box-sizing: border-box;
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
    }
    *, *:before, *:after {
        -moz-box-sizing: border-box;
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
    }

    .flex-container {
        width: 100%;
        display: flex; display: -webkit-flex; display: -ms-flexbox;
        -ms-flex-direction: row; -webkit-flex-direction: row; flex-direction: row;
        -ms-flex-wrap: wrap;-webkit-flex-wrap: wrap; flex-wrap: wrap;
        -webkit-justify-content: space-between; justify-content: space-between; 
        -ms-flex-align: start; -webkit-align-items: flex-start; align-items: flex-start;
    }


    .maxW {max-width: 900px;}
    .pageW {max-width: 860px;}
    .pageInner {max-width: 858px;}

    .raster { width: 100%; margin: 0 auto; background: url('../Images/bg/raster.png') repeat fixed center top #d7e8f5; }

    #container {
        overflow:hidden;
        position: relative;
        height: 100%; 
        max-width: 900px; min-width: 320px;
        margin: 0 auto; 
        background: url() #fff;
        }
            
        #passepartout { 
            width:100%; margin:0;
        }

        #container-head  {
            display: flex;
            flex-direction: row;
            justify-content:center;
            flex-wrap:wrap;  
    }

    @media (min-width : 480px) {
        #passepartout { padding:10px 20px;}
    }
    @media (min-width: 568px)  {
        #container {top: 0;}
        #container-head  {justify-content:space-between;}
    }
    @media (min-width : 768px) {
        #container {top: 15px;}
    }
    @media (min-width : 900px) {
        #container {top: 20px;}
    }


    .papier { 
        position: relative; 
        padding:25px 35px;
        background: url('../Images/bg/bg_body.png') repeat #f8f8f8;
        border: 1px solid #cba;
        overflow: hidden; text-align:left; 
    }


    h1.bluebar, h2.bluebar { height:26px; text-align:left; padding-left:15px; line-height:1.3; color:#fff; }
    h2.bluebar { padding-left:10px; line-height:1.4;  }

    .bayrischblau { background-color: #0099d5; }
    .hellblau { background-color: #d7e8f5; }
    .leichtblau { background-color: #f4faff!important; }
    .hellgrau { background-color: #eee; }
    .dunkelbraun { background-color: #a98; }

    li.service { list-style: disc inside; }

    span.weiter { 
        margin: 5px 0 0 45%;
        display:inline-block;
    }

    span.lnkImg {
        line-height: 14px;
        margin-left: 3px;
    }

    /* Language/Flags  */
    .langmap {display:inline-block; width: 23px; height: 15px;}

    #divLanguageSelection {
        float: right;
        margin:7px 11px 0 0; 
    }
        #divLanguageSelection a {
            display:inline-block; 
            width:20px; line-height:16px;  
            border:1px solid transparent;
            text-decoration: none;
            cursor:pointer;
        }
        #divLanguageSelection a:hover {text-decoration: none;}



    #PopUp ul {
        margin: 0 10pt;
        line-height: 1.3em;
    }
    #PopUp li {
        list-style: disc; margin: 0 4px;
    
    }
    #PopUp img { 
            padding: 12px;
            background-color: #fff;
            -moz-box-shadow: 3px 3px 10px  #535353;
            -webkit-box-shadow: 3px 3px 10px  #535353;
            box-shadow: 3px 3px 10px #535353;
            border-collapse: separate;
            border-top: 1px solid #ccc;
            border-left: 1px solid #ccc;
    }

    .linkbutton {
            font-size: 0.9em;
            font-family: Arial, 'DejaVu Sans', 'Liberation Sans', Freesans, sans-serif;
    }

/* //////////////////////////////////////////////////////////////////////////// */
/* ///   Css Menue                                                              */
/* //////////////////////////////////////////////////////////////////////////// */

    #mainmenu {
        height:38px;
        overflow: visible; z-index: 999; 
        text-align:left; 
    }

    #mainmenu li, 
    #mainmenu ul { list-style-type: none; padding:0; margin: 0; }

    #mainmenu .horizonal ul { 
        left: -999em; position: absolute; 
        margin: 0 0 0 -1px;
        padding: 7px 0 0 0;
        z-index:9999;
    }
    #mainmenu a { 
        display: block; padding: 11px 16px 11px 15px; 
        border-right: 1px solid #0e303e; border-left: 1px solid #adcdda;
        font-size: 1.0em; font-weight: normal; text-decoration: none; 
        color: #fff;  
    }
    #mainmenu .horizonal .first { border-left-color:transparent; color: #333;}
    #mainmenu .horizonal .last  { border-left: 1px solid #adcdda; width:0; height:38px;}

    #mainmenu li { float: left; line-height: 16px; }
    #mainmenu li:hover a { color: #000; }
    #mainmenu li:hover .vertical { left: auto; }
    #mainmenu li:hover { background: url('../Images/sprites/verlauf.png') repeat-x scroll 0 -302px orange;}

    #mainmenu .vertical a { padding: 7px 22px; border: 1px solid #ddd; border-top: 0;  min-width: 90px; }
    #mainmenu .vertical a:hover { color: #000; }
    #mainmenu .vertical li { float: none; background-color:#48b; }
    #mainmenu .vertical li a { color: #fff; }



/* //////////////////// CSS sprites  ///////////////// */



    .frontPage { background: url('../Images/sprites/frontpage.jpg') no-repeat scroll 0 0 transparent;}
    .frontPage.large    { background-position: 0 0;}
    .frontPage.left    { background-position: -307px -300px; width: 293px; height: 244px;  }
    .frontPage.center  { background-position: 0 -300px; width: 297px; height: 244px;  }
    .frontPage.right    { background-position: -306px -551px; width: 253px; height: 244px;  }

    .sprites { background: url('../Images/sprites/master.png') no-repeat scroll 0 0 transparent;}

    .sprites.header { background-position: 0    0px; width: 250px; height: 112px;  }
    .sprites.menu   { background-position: 0 -116px; background-color: #48b;  }  

    .vsprites { background: url('../Images/sprites/verlauf.png') repeat-x scroll 0 0 transparent;}

    .vsprites.sunny { background-position: 0    0px; background-color: #fb4;}
    .vsprites.hover { background-position: 0 -302px; background-color: orange;}
    .vsprites.sky   { background-position: 0 -340px; background-color: #48b; }  
    .vsprites.night { background-position: 0 -381px; background-color: transparent; }  
    .vsprites.grafit { background-position: 0 -395px; background-color: transparent; }  
    .vsprites.input { background-position: 0 -422px; background-color: #fafafa; }  
    .vsprites.gras { background-position: 0 -439px; background-color: #3e5; }  
    .vsprites.fire   { background-position: 0 -477px; background-color: #b13; }  



    .features { width: 33px;height:33px; margin:0 1px 0 0; display:inline-block;  background: url('../Images/sprites/features.png') no-repeat scroll 0 0 transparent;}
    .features.pets  { background-position: -33px  0;}
    .features.kids  { background-position: -66px  0;}
    .features.heat  { background-position: -66px -33px;}
    .features.tv    { background-position:  0    -66px;}                                 
    .features.fridge { background-position: 0    -99px;}                                 
    .features.herd  { background-position: -66px -99px;}                                 
    .features.phone { background-position:  0    -132px;}                                 
    .features.wlan  { background-position: -33px -132px;}                                 
    .features.wasch { background-position:  0    -165px;}                                 
    .features.dish  { background-position: -33px -165px;}                                 
    .features.terrasse { background-position: 0   -198px;}                                 
    .features.kbett { background-position: -33px -198px;}                                 
    .features.nosmoke { background-position: -66px -198px;}         
    .features.smoke { background-position: -66px -165px;}                                 

    .haken { width: 16px; height: 10px; display:inline-block;
            background:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAsAAAAJCAYAAADkZNYtAAAAY0lEQVQY02P4//8/Az7MELdiAhD/B+IEmIABDoUJUIUQjKRzAZrCABSFcSsuMKAJJMBsAuIPSOIgtgIDWAeqhgYsCsHOBCkWwKIBGQfAnYbDWhRnoSjGoaEBI3RwBNUCbEEJADjU3+XxUdfUAAAAAElFTkSuQmCC) no-repeat 0 0;}

/* //////////////////// Admin Css & Sprites  ///////////////// */                

    .cmdbar .belegungsplan   { background:url('../Images/sprites/admin.png') 0 0 no-repeat; width:104px; }
    .cmdbar .buchen   { background:url('../Images/sprites/admin.png') 0 -24px no-repeat; width:74px; }

    /*.cmdbar {
        margin: -1px 0 0 -1px;
        border-bottom: 1px solid #aaa;
        width: 860px;
    }*/

    #access, .access { 
        Position: relative;
        text-align: left; overflow: hidden; 
        margin: 20px 0;
        background-color:#f0f0f0;
        border: 1px solid #bbb;
    }

    #noaccess { 
        height: 200px; margin: 100px;
        background-color:#fafafa;
    }


    #access input[type = checkbox]:focus, #access input[type = radio]:focus { outline: 1px dotted red;}
    td.tdLabel { padding-left:10px; text-align:right;}
    td.tdInput { padding-left:10px; text-align:left; }
    tr.trInput { height: 27px; } 


/* //////////////////////////////////////////////////////////////////////////// */
/* ///   Suchbox und Listen                                                     */
/* //////////////////////////////////////////////////////////////////////////// */


    /* Definition blaue Buttons mit hover: vsprites button blue shadow round */
    .button {width: 100%; padding: 2px 0;text-decoration: none; text-align:center; display:inline-block;}
    .button:hover { text-decoration: none; }
    .button.shadow {box-shadow: 1px 1px 3px #bbb; -webkit-box-shadow: 1px 1px 3px #bbb, -moz-box-shadow: 1px 1px 3px #bbb;}
    .button.round {border: 1px solid #bbb; border-radius: 5px; -webkit-border-radius: 5px; -moz-border-radius: 5px; }
    .button.blue {background-position: 0 -348px !important; color: #eee !important; }
    .button.blue:hover { background-position: 0 -340px !important; color: #fff !important; }

    .buchen.button { height: 45px; margin-top: 15px; padding: 15px 5px; background-position: 0 -182px; color: navy !important;}
    .buchen.button:hover { background-position: 0 -50px; color: #fff !important; }

    /* //////////////////// Footer-Zeile  ///////////////// */

    
    


    /* //////////////////////////////////////////////////////////////////////////// */
    /* ///   Buchungskalender                                                       */
    /* //////////////////////////////////////////////////////////////////////////// */

    .Calendar { border: 1px solid #bbb; border-collapse: collapse; background-color: #fff; }
    .Calendar .blueRow { background-color:#48b; color:White; text-align:center; padding: 4px 2px; font-size: 0.80em;}
    .Calendar .blueCol { background-color:#48b; color:White; text-align:right; padding: 2px 5px; font-size: 0.80em;}
    .Calendar td { border: 1px solid #aaa; width: 21px; text-align:center; font-size:0.80em; }

    .Calendar .weekday, 
        .Calendar .weekend, 
        .Calendar .months { background-color: #e8f0fa; }
    .Calendar .weekend { font-weight: bold; }
    .Calendar .days, 
        .Calendar .months {  padding: 0; line-height:100%; cursor:pointer; }
        .Calendar .weekday, 
        .Calendar .weekend { color:#555; }

    .Calendar .sprite { background-image:url('../Images/sprites/admin.png'); background-repeat: no-repeat; }
    .Calendar .buchung { background-color: #777;}
    .Calendar .eigen   { background-color: #66aaff; }
    .Calendar .reserviert { background-color:#ffdd00;}
    .Calendar .problem { background-color: #ff0000; }


    /* Buchungsanfragen-Calender-sprites */
    .Calendar .suchen               { width: 16px; height: 30px; }
    .Calendar .suchen.belegt.anreise{ background-position:    1px -120px; }
    .Calendar .suchen.belegt.abreise{ background-position:  -17px -120px; }
    .Calendar .suchen.anreisetag    { background-position:  -35px -120px; }
    .Calendar .suchen.abreisetag    { background-position:  -53px -120px; }
    .Calendar .suchen.belegt        { background-position:  -71px -120px; }
    .Calendar .suchen.frei          { background-color: #aaff33 !important; }
    .Calendar .suchen.frei.abreise  { background-position:    2px -150px; }
    .Calendar .suchen.frei.anreise  { background-position:  -17px -150px; }



/* //////////////////////////////////////////////////////////////////////////// */
/* ///   FlexSlider Control                                                     */
/* //////////////////////////////////////////////////////////////////////////// */

    .flexslider .slides > li {display: none;  -webkit-backface-visibility: hidden;} /* Hide the slides before the JS is loaded. Avoids image jumping */

    .flexslider .slides img { width:auto; max-width: 600px; display: block; }
    .flex-pauseplay span {text-transform: capitalize;}

    /* Clearfix for the .slides element */
    .slides:after {content: "."; display: block; clear: both; visibility: hidden; line-height: 0; height: 0;} 
    html[xmlns] .slides {display: block;} 
    * html .slides {height: 1%;}

    .flexslider { border: 8px solid #fff; position: relative; -webkit-border-radius: 4px; -moz-border-radius: 4px; -o-border-radius: 4px; border-radius: 4px; box-shadow: 0 1px 4px rgba(0,0,0,.2); -webkit-box-shadow: 0 1px 4px rgba(0,0,0,.2); -moz-box-shadow: 0 1px 4px rgba(0,0,0,.2); -o-box-shadow: 0 1px 4px rgba(0,0,0,.2); zoom: 1;}
    .flex-viewport {max-height: 2000px; -webkit-transition: all 1s ease; -moz-transition: all 1s ease; transition: all 1s ease;}
    .loading .flex-viewport {max-height: 300px;}
    .flexslider .slides {zoom: 1;}

    /* Direction Nav */
    .flex-direction-nav {*height: 0;}
    .flex-direction-nav a {
        width: 30px; height: 30px; margin: -20px 0 0; display: block;    
        background-image:url( data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADkAAAAbCAYAAADGfCe4AAACv0lEQVRYw+2YTWsaQRjHNZhQGyERPDQEahpKaaAQSANKodS0xYukBxNKq+lbDr159RP4Lbx6Eo9+Cb14FL+BiHrwBfG9z79M0nUzO/uMyqaFLjwMzj7P/zf/3ZlhXJfr/+VyzefzDYrHFK8p4hRJip+ijYt+3N/457hU7KY4orgS4nZxJfLdK5pzhksFPooLJsQcqPMtadAZLiUGZrPZlyVBv0PUBzQNOsOlhO3pdPp1FdBNCJ1tpkFnuFjAlHC5DpABeGm3MTjKpRvHXJFarRZPp9MhtAzgscokh6vDs+RSp2c8Hn/jFFcqlQ9Usk/xEK1dPuli+ngs3qJH3FdqGHngc8Yp/PzhDofDQw2De4ZBbnHqoC8zyeWCYyjb4xpd4LZarfe6BnFNJpMIBwZ9mUkOFwGOqZRldIHb6/U+6xqk/gh3fXQ6nU8yk+jX2FC0jcLXbfZoNLpWLXrJFI3o7HbQl5lUca2MmqeuajNa4KqES6XSwhPsdruHy2zrFhuPtg74Rg2Mj8WlBXqteOUfTU/Pl81m3+gMDPoWG4/WmwQXfOOsEuOz57bb7aTNcenCZHRHxyj0ZSbtuBKDO0aDYlw8brVaPWecC+8Yzefz7zgDhL7MJIeLAEfX4B1uoVA4ZR6AzUb9zEGeyEyin7me/boGEfB1CwuFQv7BYPBD1yjnMADdcDi8KzOJfiZ3S9cgdOHLyHMXi8W3Gn9pEtS+FK0yF7rQtzi6srg6PCU3GAwGms1mcp3/BqAHXdUB3WmuOxaLHXGnLWe6QE/xFu+Nu5lKpU76/f73VUCohw70mB8GHOc+iEajLxqNRmIZEOpQDx3NTzyOcze9Xu+TXC53xn26yEM+6jTe4F/B3aXrWSaTeVUul8/r9XriBo4Wv9GP+8hD/po+uzrOdYvz4iOKA4qnFM9FeyD6fYwN5t64vwDZ8aK5YZpfBwAAAABJRU5ErkJggg== );
        background-repeat:no-repeat; 
        position: absolute; top: 50%; z-index: 10; cursor: pointer; 
        text-indent: -9999px; 
        opacity: 0; -webkit-transition: all .3s ease;
    }
    .flex-direction-nav li { list-style:none; }
    .flex-direction-nav .flex-next {background-position: 100% 0; right: -36px; }
    .flex-direction-nav .flex-prev {left: -36px;}
    .flexslider:hover .flex-next {opacity: 1.0; right: 5px;}
    .flexslider:hover .flex-prev {opacity: 1.0; left: 5px;}
    .flexslider:hover .flex-next:hover, .flexslider:hover .flex-prev:hover {opacity: 1;}
    .flex-direction-nav .flex-disabled {opacity: .3!important; filter:alpha(opacity=30); cursor: default;}

    /* Control Nav */
    .flex-control-nav {width: 100%; position: absolute; bottom: -40px; text-align: center;}
    .flex-control-nav li {margin: 0 6px; display: inline-block; zoom: 1; *display: inline; }
    .flex-control-paging li a {width: 11px; height: 11px; display: block; background: #666; background: rgba(0,0,0,0.5); cursor: pointer; text-indent: -9999px; -webkit-border-radius: 20px; -moz-border-radius: 20px; -o-border-radius: 20px; border-radius: 20px; box-shadow: inset 0 0 3px rgba(0,0,0,0.3);}
    .flex-control-paging li a:hover { background: #333; background: rgba(0,0,0,0.7); }
    .flex-control-paging li a.flex-active { background: #000; background: rgba(0,0,0,0.9); cursor: default; }

    .flex-control-thumbs {margin: 3px 0 0; position: static; overflow: hidden;}

    .flex-control-thumbs li {height: 150px; width: 25%; float: left; overflow:hidden; margin: 0;}
    .flex-control-thumbs img {width: 100%; display: block; opacity: .7; cursor: pointer;}
    .flex-control-thumbs img:hover {opacity: 1;}
    .flex-control-thumbs .flex-active {opacity: 1; cursor: default;}




/* //////////////////////////////////////////////////////////////////////////// */
/* ///   Mobile Styles                                                          */
/* //////////////////////////////////////////////////////////////////////////// */
    @media only screen and (max-width: 850px) {
      .flex-direction-nav .flex-prev {opacity: 1; left: 0;}
      .flex-direction-nav .flex-next {opacity: 1; right: 0;}
    }


