/* Primary Styles
    Author: Fabian König <fabian.koenig@kerygma.de> 
 */
#ke_container {    
    position:absolute;     
} 
 
#ke_main {
    position:absolute;    
    left: 16px;
    top: 29px;
}

#room-background {
    position:absolute;
    top: 60px;
    left: 60px;
    z-index: 1;
}

#border {
    position:absolute;
    top: -29px;
    left: -16px;
    z-index: 1000;    
}

#audioplayer {
    position:absolute;
    top:0px;
    left:0px;
}

#ke_more_link {
    position:absolute;
    top:586px;
    left:0px;
    width: 72px;
    height: 30px;
    cursor: pointer;
    z-index: 1000000;
    background: #ffffff;
}

#textfield {
    position:absolute;
    top: 94px;
    left: 82px;
    z-index: -100;
    background-image: url('../img/general/textfield.png');
    width: 600px;
    height: 409px;
}

#textfield-vorleser {
    position:absolute;
    top: 55px;
    left: 16px;
    width: 55px;
    height: 49px;
    display: hidden;
}

#textfield-vorleser-hotspot {
    background-color: #ffffff;
    position:absolute;
    top: 55px;
    left: 16px;
    width: 55px;
    height: 49px;    
    cursor: pointer;
    display: hidden;
    z-index: 300001;
}

#textfield-content {
    position:relative;
    top: 40px;
    left: 80px;
    width: 480px;
    height: 335px;
    overflow: auto;
}

#textfield-scroller {
    padding-right: 10px;
}

#textfield-small {
    position:absolute;
    top: 200px;
    left: 225px;
    z-index: -100;
    background-image: url('../img/general/textfield-small.png');
    width: 300px;
    height: 205px;
}

#textfield-small-content {
    position:relative;
    top: 24px;
    left: 18px;
    width: 265px;
    height: 170px;
    overflow: auto;
}

#preload {
    position:absolute;
    top: 0px;
    left: -20px;
    z-index: 200000;    
}

#preload-room {
    position:absolute;
    top: 59px;
    left: 65px;
    z-index: 200000;
}

#blocker-room {
    position:absolute;
    /*width: 640px;
    height: 480px;
    top: 60px;
    left: 60px;*/
    width: 830px;
    height: 650px;
    top: 0px;
    left: -30px;    
    z-index: 200001;
}

#flashapp {
    position: absolute;
    z-index: 1000000;
    top: 29px;
    left: 16px;
}


.Standard0763 {
    font-weight: normal;
    font-style: normal;
    line-height:15px;
    font-family: 'standard0763Regular', sans-serif;
    font-size-adjust: 0.63;
    color: #000000;
}

.CCJoeMad {
    font-weight: normal;
    font-style: normal;
    font-family: 'CCJoeMad', sans-serif;
    color: #000000;
}

.Futura{
    font-weight: normal;
    font-style: normal;
    font-family: 'FuturaBT-Book', sans-serif;
    color: #000000;
}

#textfield p {
    font-weight: normal;
    font-style: normal;
    line-height: 18px;
    letter-spacing: 0.03em;
    font-size: 14px;
    font-family: 'FuturaBT-Book', sans-serif;
    color: #000000;
    margin: 0px 0px 5px 0px;
    padding: 0;
}


#textfield img {
    margin-left: 10px;
    margin-right: 10px;
}

#textfield div.caption p {
    margin-left: 10px;
    margin-right: 10px;
}

#textfield a img {
    margin-left: 0px;
    margin-right: 0px;
}

#textfield h1 {
    font-weight: normal;
    font-style: normal;
    font-family: 'CCJoeMad', sans-serif;
    color: #c40000;
    font-size: 16pt;
    margin: 0px 0px 10px 0px;
    padding: 0px;
}

#textfield h2 {
    font-size: 100%;
    font-weight: normal;
    font-style: normal;
    font-family: 'CCJoeMad', sans-serif;
    color: #c40000;
    font-size: 14px;
    margin: 0px 0px 3px 0px;
    padding: 0px;
}

#textfield #pagebackbtn {
    background: url("../img/general/de/btn-textfield.png") no-repeat scroll -100px 0px transparent;
    width: 85px;
    height: 14px;
    overflow: hidden;
    text-indent: -9999px;        
    cursor:pointer;
    position:absolute;
}
    
#textfield #pagebackbtn:hover {
    background: url("../img/general/de/btn-textfield.png") no-repeat scroll -100px -25px transparent;     
}

#textfield #pageadvancvebtn {
    background: url("../img/general/de/btn-textfield.png") no-repeat scroll 0px 0px transparent;
    width: 85px;
    height: 14px;
    overflow: hidden;
    text-indent: -9999px;        
    cursor:pointer;
    position:absolute;
}
    
#textfield #pageadvancvebtn:hover {
    background: url("../img/general/de/btn-textfield.png") no-repeat scroll 0px -25px transparent;     
}

/* Mitschreibgeschichte */
#mitschreibgeschichte-page1text p, #mitschreibgeschichte-page2text p {
    font-weight: normal;
    font-style: normal;
    line-height:15px;
    font-family: 'FuturaBT-Book', sans-serif;
    color: #000000;
}

#mitschreibgeschichte-page1text h1, #mitschreibgeschichte-page2text h1 {
    font-size: 140%;
    font-weight: normal;
    font-style: normal;
    font-family: 'CCJoeMad', sans-serif;
    line-height:30px;
    color: #990000;
}

/* Formulare */
.formular_loading_icon {
	float:right;
	background:url(img/ajax-loader.gif) no-repeat 1px;
	height:30px;
	width:30px;
	display:none;
}

.formular_done {	
	font-size:12px;
    margin: 10px 0px;
	display:none;
}
 
.formular_clear {clear:both}

.formular_input {
    margin-bottom: 10px;
	font-size:12px;
}

.formular_input label {
	width:75px;
}

.formular_input input.text {
	float:left;
	width:270px;
}

.formular_input .formular_textarea {
	height:100px;
	width:270px;
}
 
.formular_input_submit_image {
	float:right;
	margin-right:10px;
}

#btn-einloggen {
    background: url("../img/general/de/btn-projektboerse.png") no-repeat scroll 0px -35px transparent;
    width: 104px;
    height: 28px;
    position: absolute;
    overflow: hidden;
    text-indent: -9999px;
    cursor:pointer;
}

#btn-einloggen:hover {
    background: url("../img/general/de/btn-projektboerse.png") no-repeat scroll -110px -35px transparent;
}

#btn-passwort-anfordern {
    background: url("../img/general/de/btn-projektboerse.png") no-repeat scroll 0px -70px transparent;
    width: 189px;
    height: 27px;
    position: absolute;
    overflow: hidden;
    text-indent: -9999px;        
    cursor:pointer;
}
    
#btn-passwort-anfordern:hover {
    background: url("../img/general/de/btn-projektboerse.png") no-repeat scroll -195px -70px transparent;     
}

#btn-registrieren {
    background: url("../img/general/de/btn-projektboerse.png") no-repeat scroll 0px -105px transparent;
    width: 124px;
    height: 27px;
    position: absolute;
    overflow: hidden;
    text-indent: -9999px;
    cursor:pointer;
}

#btn-registrieren:hover {
    background: url("../img/general/de/btn-projektboerse.png") no-repeat scroll -130px -105px transparent;
}

/* 
 * print styles
 * inlined to avoid required HTTP connection www.phpied.com/delay-loading-your-print-css/ 
 */
@media print {
  * { background: transparent !important; color: #444 !important; text-shadow: none; }

  a, a:visited { color: #444 !important; text-decoration: underline; }

  a:after { content: " (" attr(href) ")"; } 

  abbr:after { content: " (" attr(title) ")"; }
  
  .ir a:after { content: ""; }  /* Don't show links for images */
  
  pre, blockquote { border: 1px solid #999; page-break-inside: avoid; }
  
  img { page-break-inside: avoid; }

  @page { margin: 0.5cm; }

  p, h2, h3 { orphans: 3; widows: 3; }

  h2, h3{ page-break-after: avoid; }
}



/*
 * Media queries for responsive design
 */

@media all and (orientation:portrait) { 
  /* Style adjustments for portrait mode goes here */
  
}

@media all and (orientation:landscape) { 
  /* Style adjustments for landscape mode goes here */
  
}

/* Grade-A Mobile Browsers (Opera Mobile, iPhone Safari, Android Chrome)  
   Consider this: www.cloudfour.com/css-media-query-for-mobile-is-fools-gold/ */
@media screen and (max-device-width: 480px) {
  
  
  /* Prevent iOS, WinMobile from adjusting font size */
  html { -webkit-text-size-adjust:none; -ms-text-size-adjust:none; } 
}