/**
 * 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 article styles
 * @author     gueldner
 * @since      11.10.2011
 * @version    $Id$
 **/
@media screen
{

  /*  =========================================================
  0. basic config
  1. hotel specifics
  2. offer specifics
  3. event specifics
  4. main image
  5. tools, buttons, infocorner
  6. sitemap
  7. fulltext search
  8. video gallery
  9. social meadia share buttons
  10. tour map
  11. overlay for listitems
  ========================================================== */


  /*  =========================================================
   =0. basic config
  ========================================================= */
  #CONT_content .mainContentArea .article{ width:100%; margin:0 0 30px; position:relative;}
  #CONT_content .mainContentArea .article.social-plugin-margin-3 {margin: 0 0 15px;}

  #CONT_content .mainContentArea .article h1{ font-family:'DesyrelRegular', Arial, Helvetica, Verdana, sans-serif; font-size:40px; margin:0; padding:0;}
  #CONT_content .mainContentArea .article h1.withPrice{ width:520px;}
  #CONT_content .mainContentArea .article h1.withStars{ width:470px;}
  #CONT_content .mainContentArea .article h2{ font-size:20px; font-weight:bold; margin:20px 0 5px; padding:0;}
  #CONT_content .mainContentArea .article h3{ font-size:18px; font-weight:bold; margin:20px 0 3px; padding:0;}
  #CONT_content .mainContentArea .article h4{ font-size:18px; font-weight:normal; font-style:italic; margin:20px 0 3px; padding:0;}
  #CONT_content .mainContentArea .article h5{ font-size:16px; font-weight:normal; font-style:italic; margin:20px 0 3px; padding:0;}
  #CONT_content .mainContentArea .article h6{ font-size:14px; font-weight:bold; margin:20px 0 3px; padding:0;}

  #CONT_content .mainContentArea .article ul{ margin:0 0 10px 15px; padding:0;}
  #CONT_content .mainContentArea .article li{ list-style-type:square; font-size:14px; padding:0 0 5px;}

  #CONT_content .mainContentArea .tabContentCollection {color: #717171;}
  #CONT_content .mainContentArea .tabContentCollection ul{ margin:0 0 10px 15px; padding:0 0 0 10px;}
  #CONT_content .mainContentArea .tabContentCollection li{ list-style-type:square; font-size:14px; padding:0 0 5px;}
  #CONT_content .mainContentArea .tabContentCollection li p {margin: 0;}
  #CONT_content .mainContentArea .tabContentCollection p{ margin:0 0 10px; padding:0;}
  #CONT_content .mainContentArea .tabContentCollection p.ibeOfferDateSubline{ font-weight:bold; padding:10px;}

  #CONT_content .mainContentArea .article p{ margin:0 0 10px; padding:0;}
  #CONT_content .mainContentArea .article p.subline{ font-weight:bold; margin:0 0 15px;}

  #CONT_content .mainContentArea .article p span.infoAdd{ border-bottom:1px #af0014 dashed; cursor:help;}

  /*links*/
  #CONT_content .mainContentArea .article a {text-decoration: underline;}

  #CONT_content a.download {padding: 0 0 0 1.5em; background: url(/portal/img/mime/default.png) scroll no-repeat 0 0 transparent;}

  #CONT_content a.pdf {background-image: url(/portal/img/mime/pdf.png);}
  #CONT_content a.doc, #CONT_content a.docx, #CONT_content a.xls, #CONT_content a.xlsx
  {background-image: url(/portal/img/mime/document.png)}
  #CONT_content a.wav, #CONT_content a.wma, #CONT_content a.mp3
  {background-image: url(/portal/img/mime/audio.png);}
  #CONT_content a.html, #CONT_content a.htm
  {background-image: url(/portal/img/mime/html.png);}
  #CONT_content a.mov, #CONT_content a.avi, #CONT_content a.mpg, #CONT_content a.wmv, #CONT_content a.flv, #CONT_content a.divx, #CONT_content a.xvid
  {background-image: url(/portal/img/mime/video.png);}
  #CONT_content a.jpg, #CONT_content a.jpeg, #CONT_content a.png, #CONT_content a.gif, #CONT_content a.tif, #CONT_content a.bmp
  {background-image: url(/portal/img/mime/image.png);}

  /*busker area*/
  #CONT_content .mainContentArea .article .buskerArea{ width:100%; margin:0 0 30px; padding:15px 0 30px; border-bottom:1px solid; position:relative;}
  #CONT_content .mainContentArea .article .buskerArea.reverse{ margin-top:30px; border-top:1px solid; border-bottom:0;}
  #CONT_content .mainContentArea .article .buskerArea.animalHeadline{ background-position:0 0;}
  #CONT_content .mainContentArea .article .buskerArea .preloader{ z-index:1;}
  #CONT_content .mainContentArea .article .buskerArea h2{ font-family:'DesyrelRegular', Arial, Helvetica, Verdana, sans-serif; font-weight:normal; font-size:30px; margin:0; padding:0;}
  #CONT_content .mainContentArea .article .buskerArea p.subline{ font-weight:bold; margin:0 0 15px; padding:0;}


  /*  =========================================================
   =1. hotel specifics
  ========================================================= */
  /*stars for hosts*/
  #CONT_content .mainContentArea .article .stars{ float:right; padding:10px 0 0;}
  #CONT_content .mainContentArea .article .stars span.star{ float:right; height:22px; overflow:hidden; background:right 0 no-repeat;}
  #CONT_content .mainContentArea .article .stars span.one{ width:26px;}
  #CONT_content .mainContentArea .article .stars span.two{ width:52px;}
  #CONT_content .mainContentArea .article .stars span.three{ width:78px;}
  #CONT_content .mainContentArea .article .stars span.attribute{ display:none;}
  #CONT_content .mainContentArea .article .stars p.attribute{ display:block; text-align:right; clear:both; font-family:'DesyrelRegular', Arial, Helvetica, Verdana, sans-serif; font-size:15px; margin:0; line-height:10px;}

  /*quick booking area*/
  #CONT_content .mainContentArea .article .buskerArea table{ width:100%}
  #CONT_content .mainContentArea .article .buskerArea table td{ border:0; padding:1px 0;}

  #CONT_content .mainContentArea .article .buskerArea p.info{ font-style:italic; margin:10px 0 15px; font-size:12px;}
  #CONT_content .mainContentArea .article .buskerArea a.button,
  #CONT_content .mainContentArea .article .buskerArea button
  { font-size:14px; padding:4px 10px 4px 7px; height:auto; float:none;}

  /*fill in date area*/
  #CONT_content .mainContentArea .article .buskerArea .section{ float:left; margin:0 20px 10px 0;}
  #CONT_content .mainContentArea .article .buskerArea input.text.date{ width:136px; background-position:128px center;}
  #CONT_content .mainContentArea .article .buskerArea input[name=nights]{ width:52px;}


  /*  =========================================================
   =2. offer specifics
  ========================================================= */

  #CONT_content .offer-base-infos {position: relative; overflow: hidden; margin: 0 0 10px 0;}
  #CONT_content .offer-base-infos > #base-price {position: absolute; right: 0; top: 0; line-height: 30px;}
  #CONT_content .offer-base-infos > #base-price > em {margin-left: 5px; font-size: 30px; font-style: normal; font-weight: bold; color: #e3001a;}


  /*  =========================================================
   =3. event specifics
  ========================================================= */
  #CONT_content .mainContentArea .article a.textListShowMore,
  #CONT_content .mainContentArea .article a.textListShowLess
  { font-size:12px; margin-top:-5px; float:left; background:right center no-repeat;}
  #CONT_content .mainContentArea .article a.textListShowMore{ padding-right:10px; background-image:url(../../../img/objects/allg.link.arrow.down.gif);}
  #CONT_content .mainContentArea .article a.textListShowLess{ padding-right:8px; background-image:url(../../../img/objects/allg.link.arrow.right.gif); display:none;}


  /*  =========================================================
   =4. main image
  ========================================================= */
  #CONT_content .mainContentArea .article .mainImage { width:606px; max-height:404px; padding:7px; position:relative; margin:0 0 30px;}

  #CONT_content .mainContentArea .article .mainImage.tabContent { padding: 0; margin: 0; }

  .mainImage .imageRow{ width:606px; height:404px; overflow:hidden; position:relative;}
  .mainImage .imageCollection{ height:100%;}
  .mainImage .imageCollection .image{ float:left; width:606px; height:404px; overflow:hidden; position:relative; text-align:center;}
  .mainImage .imageCollection .image img{width:606px; position:relative;}

  .mainImage.skyline .imageRow{ background:url(../../../img/environment/mainimage.skyline.gif) 0 0 no-repeat;}
  .mainImage.skyline .imageCollection .image img{ width:auto; height:auto; vertical-align:middle;}
  .mainImage.skyline .imageCollection .image img.skylinehelper{ width:1px; height:100%; margin:0 0 0 -1px;}

  .mainImage .imageCollection .image .infoCorner img{width:auto;}
  .mainImage .imageCollection .image .preloader{ background-image:url(../../../img/environment/preloader.mainImage.gif);}

  .mainImage a.prev{ width:51px; height:78px; background:0 0 no-repeat; margin-top:-39px; display:none; position:absolute; top:50%; left:13px;}
  .mainImage a.next{ width:51px; height:78px; background:0 0 no-repeat; margin-top:-39px; display:block; position:absolute; top:50%; right:13px;}
  .mainImage a.magnifier{ background:0 center no-repeat; padding:0 0 0 15px; font-size:12px; font-weight:bold; position:absolute; bottom:7px; right:7px; text-align:right; z-index:2;}

  .mainImage .positioner{ width:100%; text-align:center; position:absolute; bottom:10px; left:0; z-index:1;}
  .mainImage .positioner a{ width:9px; height:9px; background:0 0 no-repeat; display:inline-block;}

  .mainImage .playVideo {position: absolute; top: 158px; left: 245px; display: block; width: 116px; height: 87px; z-index: 1; background: url("/portal/img/objects/context.teaser.overlay.movie.png") no-repeat scroll 0 0 transparent;}

  .mainImage iframe.panorama{ width:600px; height:356px; border:0; padding:3px;}

  /*  =========================================================
   =5. tools, buttons, infocorner
  ========================================================= */
  /*infoCorner*/
  #CONT_content .mainContentArea .article .infoCorner{ background-image:url(../../../img/branding/default/imageTeaserCornerRight.large.png); color:white;}
  #CONT_content .mainContentArea .article .infoCorner{ position:absolute; font-size:23px; top:0; right:0; width:106px; height:99px; padding:10px 3px 0 0; text-align:right; font-family:'ArialNarrow', Arial, Helvetica, Verdana, sans-serif; line-height:23px; background-position:0 0; background-repeat:no-repeat; z-index:2;}
  #CONT_content .mainContentArea .article .infoCorner span.subPrice{ font-size:14px; font-family:inherit; vertical-align:top; line-height:10px; padding-left:2px;}
  #CONT_content .mainContentArea .article .infoCorner span.info{ font-size:20px; font-family:inherit;}

  /*tools*/
  #CONT_content .mainContentArea .tools{ padding:15px 0 0; margin:30px 0 0; border-top:1px solid;}

  .addthis_button_compact{ font-size:14px;}

  #CONT_content .mainContentArea .tools .internal_functions{ float:right;}
  #CONT_content .mainContentArea .tools .internal_functions span.separator{ font-size:12px;}
  #CONT_content .mainContentArea .tools .internal_functions a{ text-decoration:underline; font-size:12px; padding:5px 0;}
  #CONT_content .mainContentArea .tools .internal_functions a.backLink{ padding-left:7px; background:0 center no-repeat;}
  #CONT_content .mainContentArea .tools .internal_functions a.printLink{ padding-left:20px; background:0 center no-repeat;}

  #CONT_content .mainContentArea .tools p{ font-size:12px; color:#717171; margin:0; padding:0;}
  #CONT_content .mainContentArea .tools p a{ text-decoration:underline; color:#515151;}

  /*buttons*/
  #CONT_content .mainContentArea .article a.button{height:23px; font-size:16px; font-weight:bold; padding:7px 10px 0; margin:0 20px 20px 0; float:left; text-decoration:none;}
  #CONT_content .mainContentArea .article a.button img{ padding:0 7px 0 0;}
  #CONT_content .mainContentArea .article a.button img.bottom{ vertical-align:bottom;}

  #CONT_content .mainContentArea .article a.button.notice {
    padding: 0 10px 7px 10px;
  }
  #CONT_content .mainContentArea .article a.button.notice img {
    position: relative; top: 5px;
  }
  #CONT_content .mainContentArea .article a.button.noticed {
    cursor: default;
  }

  /*  =========================================================
   =6. sitemap
  ========================================================= */
  #CONT_content #sitemap ul {list-style: none outside none; margin: 0; padding: 0;}
  #CONT_content #sitemap ul li {list-style-type: none; font-size: 1.6em; line-height: 1.6em; font-weight: bold;}

  #CONT_content #sitemap ul ul {padding: 0 0 0 1.75em;}
  #CONT_content #sitemap ul ul li {list-style-type: none; font-size: 0.9em;}

  #CONT_content #sitemap ul ul ul {padding: 0 0 0 2.5em;}
  #CONT_content #sitemap ul ul ul li {list-style-type: square; font-size: 1em;}

  #CONT_content #sitemap a.switcher {background: none no-repeat scroll 0 -16px transparent; display: block; float: left; height: 16px; width: 16px;}
  #CONT_content #sitemap a.switcher {background-image: url("/portal/img/objects/allg.arrowTopDown.gif"); background-color: transparent;}
  #CONT_content #sitemap a.switcher.closed {background-position: 0 8px;}


  /*  =========================================================
   =7. fulltext search
  ========================================================= */

  #CONT_content .resultInfos {font-size: 2em;}
  #CONT_content .resultInfos em {font-style: normal; font-weight: bold;}

  #CONT_content #emptySearchResults {min-height: 300px;}
  #CONT_content #emptySearchResults .buskers {float: left; margin: 0 50px 20px 0;}
  #CONT_content #emptySearchResults h2 {margin: 1.5em 0 0; font-size: 3em; font-family:'DesyrelRegular', Arial, Helvetica, Verdana, sans-serif; font-weight: normal;}
  #CONT_content #emptySearchResults h3 {margin: 0 0 1.5em;}
  #CONT_content #emptySearchResults em {font-style: normal; font-weight: bold;}
  #CONT_content #emptySearchResults ul {list-style-position: inside;}


  /*  =========================================================
   =8. video gallery
  ========================================================= */

  #videoGallery hr {margin: 3em 0;}

  #videoGallery .videoPlayer {position: relative; margin: 0 0 30px;}
  #videoGallery .videoPlayer .roundedBorder {box-shadow: 0 1px 2px #000000;}
  #videoGallery .videoPlayer iframe.imx-video-youtube {margin: 8px 8px 6px 8px;}
  #videoGallery .videoPlayer object {margin: 8px 4px 6px;}

  #videoGallery .videoPlayer iframe.vimeo {position: relative; top: 8px; left: 8px; display: block; width: 944px; height: 564px; margin-bottom: 16px; padding-bottom: 16px; z-index: 1; border: 0 none;}

  #videoGallery .teaserArea {height: 200px; width: 960px; overflow: hidden; position: relative;}
  #videoGallery .teaserArea .teaserRow {height: 200px; width: 960px; overflow: hidden;}
  #videoGallery .teaserArea .teaserCollection {height: 200px;}

  #videoGallery .coverflow {margin: 2em;}
  #videoGallery .coverflow .backLink {float: left; padding: 0 0 0 10px; background: url("/portal/img/objects/allg.link.arrow.left.gif") scroll no-repeat left 5px transparent;}
  #videoGallery .coverflow .nextLink {float: right; padding: 0 10px 0 0; background: url("/portal/img/objects/allg.link.arrow.right.gif") scroll no-repeat right 5px transparent;}
  #videoGallery .coverflow .backLink.inactive {float: left; padding: 0 0 0 10px; background-image: url("/portal/img/objects/allg.link.arrowLight.left.gif");}
  #videoGallery .coverflow .nextLink.inactive {float: right; padding: 0 10px 0 0; background-image: url("/portal/img/objects/allg.link.arrowLight.right.gif");}
  #CONT_content #videoGallery .coverflow a {font-size: 14px;}
  #CONT_content #videoGallery .coverflow a.inactive {color: #cdcdcd; text-decoration: none;}

  #videoGallery .teaser.contextTeaser {float: left; margin: 0 20px 10px 20px;}
  #videoGallery .teaser.contextTeaser h4{ font-size:16px; font-weight:bold; margin:0; padding:0;}
  #videoGallery .teaser.contextTeaser h4 a{ font-weight:bold; font-style: normal; text-decoration: none;}
  #videoGallery .teaser.contextTeaser p{ margin:0; padding:0;}
  #videoGallery .teaser.contextTeaser a.moreInfos{ text-decoration:underline; font-size:14px; padding:0 7px 0 0; background:right center no-repeat;}

  #videoGallery .teaser .image .infoCorner{ position:absolute; font-size:18px; top:5px; right:5px; width:64px; height:64px;text-align:right;}
  #videoGallery .teaser .image .infoCorner.icon{ width:59px; height:59px; padding:5px 5px 0 0;}
  #videoGallery .teaser .image .infoCorner.icon img{ width:auto; height:auto; position:static;}


  /*  =========================================================
   =9. social meadia share buttons
  ========================================================= */

  #CONT_content #socialshareprivacy {display: block; width: 100%; height: 28px; margin: -25px 0 15px;}
  #CONT_content #socialshareprivacy ul {margin: 0;}
  #CONT_content #socialshareprivacy li {list-style: none outside none;}


  /*  =========================================================
   =10. tour map
  ========================================================= */

  #CONT_content .mainContentArea .contentTabs .tabContent.tour {
    position: relative;
  }
  #CONT_content .mainContentArea .contentTabs .tabContent.tour .controls {
    position: absolute; top: 0; right: 0; z-index: 100;
  }
  #CONT_content .mainContentArea .contentTabs .tabContent.tour .controls a {
    padding: 10px; float: left;
    color: #fff; font-size: 14px; background-color: #d60019; text-decoration: none;
  }

  #CONT_content .mainContentArea .contentTabs .tabContent.tour .controls a.mapOpener {
    border-right: 1px solid #aa0013;
  }
  #CONT_content .mainContentArea .contentTabs .tabContent.tour .controls a.printTourMap {
    border-left: 1px solid #de4859;
  }

  #tourMap {
    width: 100%; height: 405px;
    background-color: #717171;
  }

  #tourDetails {
    width: 255px; padding: 10px 10px 15px 30px; float: left;
  }
  #CONT_content .mainContentArea .article #tourDetails h5 {
    font-size: 14px; font-weight: bold; font-style: normal;
    margin: 0 0 10px 0;
  }
  #tourDetails dl {
    margin: 0;
  }
  #tourDetails dl dt,
  #tourDetails dl dd {
    font-size: 12px; color: #717171;
    display: inline-block;  padding: 0 5px 3px 0; margin: 0;
  }
  #tourDetails dl dt {
    width: 105px;
  }
  #tourDetails dl dd {
    width: 135px;
  }

  #elevationProfile {
    position: relative;
    float: right; width: 300px; height: 123px; margin: 12px 10px 15px 0;
    background: #4d4d4d;
  }


  /*  =========================================================
   =11. overlay for listitems
  ========================================================= */

  #overlayForListItems {
    text-align: left;
    width: 450px;
  }
  #CONT_content #overlayForListItems {
    display: none;
  }
  #overlayForListItems > h2 {
    font-size: 20px;
    font-weight: bold;
  }
  #overlayForListItems > p {
    font-size: 16px;
  }
  #overlayForListItems > p:last-of-type {
    margin-bottom: 0px;
  }
  #overlayForListItems > p.telephone {
    color: red;
    font-weight: bold;
  }
  #overlayForListItems a {
    color: #515151;
    text-decoration: underline;
  }

  #overlayForListItems img {
    width: 450px;
  }


}