/* ######################################################################################################
** # "Yet Another Multicolum Layout" (c) by Dirk Jesse (http://www.yaml.de) #############################
** # "YAML for TYPO3" (c) by Dieter Bunkerd (http://yaml.t3net.de) ######################################
** ######################################################################################################
**
**  YAML Version: 2.5.2
**  Dateiversion: 6.11.06
**  Datei       : basemod.css
**  Funktion    : Basis-Modifikation für das Layout des YAML-Tutorials
**  Checked with http://jigsaw.w3.org/css-validator/  over19.1.07 - DB
*/

@media all {

  /* Formatierung der Seite */
  body { background: #fff;}
  @media screen and (max-width:767px){
     button{ font-size: 16px; }
  }

  /* Hier kann ein umlaufender Rand um die gesamte Webseite erzeugt werden */
  #page { margin: 0 auto; }
  #page_margins { position: relative; left:0; width: 932px; margin: 0 auto;  clear:both;}
  
  .align-left {text-align: left;}
  .align-right {text-align: right;}
  
  #topnav img{padding-left:2px;}
  
  #flashtopmargin {margin-top: 20px; }
  .newsFlash_inline {display:block; margin-bottom:40px; margin-top:20px; position:absolute; }

  /* #flashcontent {margin-top: 20px; margin-left: 60px;} */
  #navigation {top: -28px; position:relative; left:175px;}
  
  /* News Box formatierung */
  .newsentry {float: left; overflow:hidden; width: 46%; margin: 4px; border:1px #990033 dotted; padding:5px; height:130px;}
  #newsentry {float: left; overflow:hidden; width: 46%; margin: 4px; border:1px #990033 dotted; padding:5px; height:130px;}
  #newsentry4x {float: left; overflow:hidden; width: 23%; margin-right: 3px; margin-top: 3px; border:1px #990033 dotted; padding:5px; height:140px;}
  .news-list-container { overflow: hidden;}
  .news-list-container:before { content: " "; display: table; }
  #newsentry-list {float: left; width: 49%; height:160px; overflow:hidden;}
  #newsentry-list:nth-child(odd) {margin-right: 2%;}
  .news-list-container:after { clear:both; }
  #newsentry2v {margin-bottom: 10px ;width: 90%; margin-right: 6px; margin-left: 6px; border:1px #990033 dotted; padding:5px; height:130px; margin-bottom:5px; margin-top:5px;}
  .newsentry2v {margin-bottom: 10px ;width: 94%; margin-right: 6px; margin-left: 6px; border:1px #990033 dotted; padding:5px; height:130px; margin-bottom:5px; margin-top:5px; overflow:hidden;}
  #newscontainer {background:#EFF5D9 none repeat scroll 0%; border:1px #990033 solid; padding-left:5px; padding-right:5px; }
  #archivelink { text-align:right; padding-right:20px; font-weight:bold;}
  .archivelink { text-align:right; padding-right:20px; font-weight:bold;}
  .tx-ttnews-browsebox-SCell { font-weight:bold}
  
  /* Sichtbarkeits-formatierung  */
  #header {z-index:1; }
  #navigation {/*z-index:90;*/z-index:4; }
  #main {z-index:2; }


  /* Formatierung der Kopfbereiches */
  #header img#headerlogo {position:absolute; left: 0; bottom: 25px; font-size:208%;}
  /* #header #logo {position:absolute; left: 0; top: 0px; width: 174px; height:145px; } */

  /* Formatierung des KybunCenter Logos */
  .leftlogo .tx-rlmpflashdetection-pi1 {position:absolute; left: -5px; top: 450px; display:block; width:175px; height:50px; border-top:1px solid #990033; border-bottom:1px solid #990033; }

  /* PRETTY SEARCH */
  #header div.tx-macinasearchbox-pi1 { position:absolute; top:116px; height: 29px; z-index:10; width: 174px; }
  
  #searchform input.prettysearch { width:129px; height: 17px; border: 0px; margin: 0; padding: 7px 0 3px 25px; font:11px "Lucida Grande", Geneva, Arial, sans-serif; background: #fff url(http://www.kybun.ch/fileadmin/img/kybun/searchfield_line.jpg) repeat-x;  }
  .search-wrapper .prettysearchleft { display: block; position: absolute; left: 0; top: 2px; width: 20px; height: 27px; background: #fff url(http://www.kybun.ch/fileadmin/img/kybun/searchfield_leftcap.jpg) left top no-repeat; }
  .search-wrapper .prettysearchright:hover,
  .search-wrapper .prettysearchright { display: block; position: absolute; right: 0; top: 2px; width: 20px; height: 27px; background: #fff url(http://www.kybun.ch/fileadmin/img/kybun/searchfield_pfeil.jpg) right top no-repeat; cursor: pointer;}

  /* Formatierung der Fusszeile !DEAKTIVIERT!
  #footer {color:#888; background:#fff; margin:1em; padding:1em 0 0 0; border-top:1px #990033 solid; line-height:2em;}
        */

  /* ######################################################################################################
  ** ### Formatierung der Inhaltsspalten ##################################################################
  ** ######################################################################################################*/
  #main {padding-top:0; }

  /* linke Spalte */
  #col1 { width:175px; background: #eef5d9; height:480px; border-bottom:1px solid #990033;}
  #col1_content {margin-left:5px; margin-right:1em; color:#444; background:inherit;}

  /* Rechte Spalte */
  #col2 {width:25%;}
  #col2_content {  margin-left:1em; margin-right:1em;}

  /* Mittlere Spalte */
  #col3 {margin-left:175px; margin-right:25%; background: #fff; border: none;}
  #col3_content {margin-left:1em; margin-right:1em;}
  /* ######################################################################################################
  ** ### Formatierung des Teasers der Startseite ##########################################################
  ** ######################################################################################################*/

  .newsletterBox {
  position:absolute;
  top:320px;
  width:160;
  }
  .newsMoreLink {padding-left:4px; display: inline-block;}
  
  div.newsletterBox input.csc-mailform-submit { margin: 0em 0 0 2em; }
  div.newsletterBox input#mailformformtype_mail {margin-left:0em;}
  div.newsletterBox fieldset.csc-mailform .csc-mailform-input,
  div.newsletterBox fieldset.csc-mailform .csc-mailform-text { width: 140px !important; }          
  div.newsletterBox fieldset.csc-mailform .csc-mailform-field input, fieldset.csc-mailform .csc-mailform-field select, fieldset.csc-mailform .csc-mailform-field textarea {
  /*font-size:50%;*/
  margin-left:0em;
  }
  div#main .csc-mailform-field input[type="text"],
  div#main .csc-mailform-field textarea {
  margin-left:0em;
  width: 100%;
  }

  div.newsletterBox input {
  background:#FAFAFA none repeat scroll 0%;
  border:0px;
  color:#777777;
  padding:2px;
  width:auto;
  }
  
  div.newsletterBox h5 {
  background:transparent none repeat scroll 0%;
  border-bottom:0px solid #990033;
  color:#990033;
  font-size:1em;
  margin:0.4em 0pt 0.5em;
  padding-top:1em;
  }
  div.newsletterBox h4 {
  font-size:1em;
  }
  div.newsletterBox input, div.newsletterBox textarea {
  background:#FAFAFA none repeat scroll 0%;
  border:1px solid #CCCCCC;
  color:#777777;
  padding:2px;
  font-size:1em;
  width:auto;
  }
  
  /* WT GALLERY category mode */
div.wtgallery_categories { 
  border: 1px dotted #990033;
  width: 200px;
  height: 200px;
  padding: 10px;
        margin-right: 10px;
  float: left;
  background: url(http://www.kybun.ch/fileadmin/img/photo.gif) no-repeat scroll 200% 140%;
}
div.wtgallery_category_pic {
  /* float: left; */
}
div.wtgallery_category_pic {
  margin-right: 10px;
}
div.wtgallery_category_folder {
  margin: 20px 0 10px 0;
  float: left;
  font-weight: bold;
}
p.wtgallery_category_pagebrowser {
  display: none;
}

.wtgallery_pagebrowser_up {
  display: none;
}
/* WT GALLERY singleview mode */
.wtgallery_singlepic_pic {
  border: 1px solid white;
}
.wtgallery_singlepic {
  margin-left: 50px;
  text-align: center;
}
/* wt_gallery END */

/* custom kybun button style */
.btn.btn-kybun { 
  color: #FFFFFF; 
  background-color: #777777; 
  border-color: #690000;
  margin-bottom: 3px;
}

.btn.btn-joya{ 
  background-color: #019ba3; 
  border-color: #019ba3;
} 



.btn.btn-kybun-world { 
  color: #FFFFFF; 
  background-color: #980A2B;
  border: 1px solid #FFFFFF;
} 
.btn-group-md .btn-primary { 
  margin-bottom: 3px;
} 
 
.btn.btn-kybun:hover, 
.btn.btn-kybun:focus, 
.btn.btn-kybun:active, 
.btn.btn-kybun.active,
.btn.btn-kybun-world:hover, 
.btn.btn-kybun-world:focus, 
.btn.btn-kybun-world:active, 
.btn.btn-kybun-world.active, 
.open .dropdown-toggle.btn-kybun { 
  color: #FFFFFF; 
  background-color: #980A2B; 
  border-color: #690000; 
} 
 
.btn-kybun:active, 
.btn-kybun.active, 
.open .dropdown-toggle.btn-kybun { 
  background-image: none; 
} 
 
.btn-kybun.disabled, 
.btn-kybun[disabled], 
fieldset[disabled] .btn-kybun, 
.btn-kybun.disabled:hover, 
.btn-kybun[disabled]:hover, 
fieldset[disabled] .btn-kybun:hover, 
.btn-kybun.disabled:focus, 
.btn-kybun[disabled]:focus, 
fieldset[disabled] .btn-kybun:focus, 
.btn-kybun.disabled:active, 
.btn-kybun[disabled]:active, 
fieldset[disabled] .btn-kybun:active, 
.btn-kybun.disabled.active, 
.btn-kybun[disabled].active, 
fieldset[disabled] .btn-kybun.active { 
  background-color: #980A2B; 
  border-color: #690000; 
} 
 
.btn-kybun .badge { 
  color: #777777; 
  background-color: #FFFFFF; 
}

/*LP Anwendungen Button styles */


  
.glyphicon-time:before {
    content: "\e023";
    position: relative;
    font-weight: bold;
    top: 1px;
    left: 4px;
}  

  
.btn.btn-trial { 
  color: #980A2B; 
  background-color: #ffffff; 
  border-color: #980A2B;
  margin-bottom: 3px;
}  

 .btn.btn-trial:hover, 
.btn.btn-trial:focus, 
.btn.btn-trial:active, 
.btn.btn-trial.active, 
.open .dropdown-toggle.btn-trial { 
  color: #980A2B; 
  background-color: #ffffff; 
  border-color: #980A2B; 
} 
 
.btn-trial:active, 
.btn-trial.active, 
.open .dropdown-toggle.btn-trial { 
  background-image: none; 
}

.btn-ripple {
  display: inline-block;
  position: relative;
  overflow: hidden;
  transition: all ease-in-out .5s;
}

.btn-ripple::after {
  content: "";
  display: block;
  position: absolute;
  top: 0;
  left: 25%;
  height: 100%;
  width: 50%;
  background-color: #000;
  border-radius: 50%;
  opacity: 0;
  pointer-events: none;
  transition: all ease-in-out 1s;
  transform: scale(5, 5);
}

.btn-ripple:active::after {
  padding: 0;
  margin: 0;
  opacity: .2;
  transition: 0s;
  transform: scale(0, 0);
}


}