/**
 * BTZ 2011
 *
 * LICENSE
 *
 * This software and its source code is protected by copyright law (Sec. 69a ff. UrhG).
 * It is not allowed to make any kinds of modifications, nor must it be copied,
 * or published without explicit permission. Misuse will lead to persecution.
 *
 * @copyright  2011 infomax websolutions GmbH
 * @link       http://www.infomax-it.de
 * @package    css
 * @subpackage basic styles
 * @author     gueldner
 * @since      19.07.2011
 * @version    $Id$
 **/
@media screen
{

  /*  =========================================================

  Basics:
  A. general Structure Setup
  B. general Font Setup
  C. tools
  D. colorsettings

  Struktur-Layout:


  ========================================================== */


  /*  =========================================================
   =A. general Structure Setup
  ========================================================= */
  html {
    width: auto;
    height: auto;
    font-size: 10px;
    touch-action: manipulation; /* http://developer.telerik.com/featured/300-ms-click-delay-ios-8/ */
  }
  html, body { text-align:center; margin:0; border:0;}
  body{ padding:35px 0 0 0; position:relative; background-position:center 610px!important; overflow-x: hidden;}
  .contentArea{ margin:0 auto; width:960px; text-align:left; position:relative;}

  body a img {border: 0 none;}

  hr{ height:1px; line-height:1px; font-size:1px; border:0; border-bottom:1px solid;}

  /*overlay hull*/
  body.overlay {padding: 0;}
  body.overlay .contentArea {margin: 0; width: auto;}

  a[href^='http://www.etracker']{display:none;}

  /*  =========================================================
   =B. general Font Setup
  ========================================================= */

  *{ font-family: Arial, Helvetica, Verdana, sans-serif; font-weight:normal; text-decoration:none;}
  p{ font-size:14px; line-height:1.25em;}
  strong{ font-weight:bold!important;}
  a{ cursor:pointer;}
  u { text-decoration: underline; }


  /*  =========================================================
   =C. tools
  ========================================================= */

  .closer{ clear:both; display:block; margin:0!important; padding:0!important; background:transparent!important;}
  .none, .hide, #print{ display:none;}
  .transfiller{ width:100%; height:100%; display:block; background:transparent;}
  .noMargin {margin: 0 !important;}
  .noPadding {padding: 0 !important;}
  .noBorder {border: 0 none transparent !important;}

  .roundedBorder{ position:absolute; top:0; left:0; width:100%; height:100%; }

  .preloader{ position:absolute; top:0; left:0; width:100%; height:100%; background:transparent url(../../../img/environment/preloader.gif) center center no-repeat; text-align:center;}
  .preloader .message{ margin:0 auto; font-size:18px; color:#515151; padding:0 10%; position:relative; top:56%;}

  .phoneLink {color: inherit; cursor: auto;}

  /*tipsy tooltips*/
  .tipsy {padding:5px; font-size:1.5em; line-height:1.2em; background-repeat:no-repeat;}
  .tipsy-inner{ padding:5px 10px; max-width:200px; text-align:center; }

  .tipsy-north {background-position:top center;}
  .tipsy-south {background-position:bottom center;}
  .tipsy-east {background-position:right center;}
  .tipsy-west {background-position:left center;}

  #contactAccessArea .contactBarContent div li {margin: 5px 0; font-size: 1.3em; line-height: 1.4em; color: #515151;}

  li > figcaption,
  .image > figcaption,
  .teaser > figcaption{
    position: absolute; bottom: 4px; left: 4px;
    padding: 3px 15px 3px 20px;
    background: rgba(255, 255, 255, 0.8);
    overflow: hidden;
    font: 400 normal 8px Arial, sans-serif; color: #555;
    min-height: 8px;
    max-width: 180px;
    text-align: left;
    z-index: 50;
  }
  .teaser > figcaption {
    bottom: 7px; left: 7px;
  }

  #keyvisual li > figcaption {
    bottom: 120px;
    left: 50%;
    margin-left: -476px;
  }



  #keyvisual li > figcaption > span,
  .image > figcaption > span,
  .teaser > figcaption > span{
    position: absolute; top: 0px; left: 0px;
    height: 100%; width: 15px; box-sizing: border-box;
    padding: 2px 5px;
    background: rgba(175, 175, 175, 0.8);
    font: 400 normal 10px Arial, sans-serif; color: #fff;
  }

  .listElement figcaption:not(:hover),
  table figcaption:not(:hover),
  .teaser > figcaption:not(:hover){
    font-size: 0px; width: 15px;
    padding-left: 0px; padding-right: 0px;
  }
  #hotelroomsInContentTab figcaption {
    display: none;
  }

  #mtk-branding { display: none; }

  /*  =========================================================
   =D. colorsettings
  ========================================================= */





  @media screen and (max-height: 799px){

    body.frontdoor{ background-position: center 680px !important;}

  }

  @media screen and (min-height: 800px) and (max-height: 899px){

    body.frontdoor{ background-position: center 750px !important;}

  }

  @media screen and (min-height: 900px) and (max-height: 999px){

    body.frontdoor{ background-position: center 810px !important;}

  }

  @media screen and (min-height: 1000px){

    body.frontdoor{ background-position: center 920px !important;}

  }





}