/* CSS is how you can add style to your website, such as colors, fonts, and positioning of your
   HTML content. To learn how to do something, just try searching Google for questions like
   "how to change link color." */
   
html,body,div,span,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,abbr,address,cite,code,del,dfn,em,img,ins,kbd,q,samp,small,strong,sub,sup,var,b,i,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,figcaption,figure,footer,header,hgroup,menu,nav,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;outline:0;font-size:100%;vertical-align:baseline}

body {
  line-height:1;
  background-image:url("./images/main_page_background.gif"); /*Hintergrundbild*/
  background-repeat:repeat; /*Hintergrundbild wiederholt sich*/
  cursor: url("./cursor/sparkle-arrow.gif"), auto; /*Cursor Normal*/
}

/*Schriften werden hier definiert!*/
@font-face {
            font-family: 'BabelSans';
            src: url('./fonts/BabelSans.ttf') format('truetype');
        }
        
        
@font-face {
            font-family: 'BabelSans-Oblique';
            src: url('./fonts/BabelSans-Oblique.ttf') format('truetype');
        }

@font-face {
            font-family: 'BabelSans-Bold';
            src: url('./fonts/BabelSans-Bold.ttf') format('truetype');
        }

@font-face {
            font-family: 'Society-Regular';
            src: url('./fonts/Society-Regular.ttf') format('truetype');
        }

@font-face {
            font-family: 'OLDSH___';
            src: url('./fonts/OLDSH___.ttf') format('truetype');
        }

/*Definitionen von Schrifteinstellungen*/
/*Große Überschrift mit Gradient*/
  h1{font-family: "BabelSans";font-size: 1.6em;margin-bottom: 10px; background-image: linear-gradient(to right, #ff588f, #ff8058, #ffbc39); color: transparent; background-clip: text;}
/*Mittlere Überschrift in Gelb*/
  h2{font-family: "BabelSans";font-size: 1.3em;margin-bottom: 10px; color: #ffbc39}
/*Zitate*/
  cite{color: #7c7ba8; font-family: "OLDSH___"; font-size: 0,8em; margin-top: 10px; margin-bottom: 10px;}
/*Normaler Fließtext*/
  p{color: #000; font-family: "BabelSans"; font-size: 1em;line-height: 1.3em;margin-bottom: 2px;}
/*Kursiv*/  
  i{color: #000; font-family: "BabelSans-Oblique"; font-size: 1em;line-height: 1.3em;margin-bottom: 2px;}
/*Fett*/
  b{color: #000; font-family: "BabelSans-Bold"; font-size: 1em;line-height: 1.3em;margin-bottom: 2px;}
/*Klein*/
  small{color: #6d6d80; font-family: "BabelSans"; font-size: 0.8em;line-height: 1.3em;margin-bottom: 2px;}
  
/*##############################################################################################
ACHTUNGGGGG: Listen und Aufzählungen "li" sind hier NICHT festgelegt! Ich hab keinen Bock,
dass der mir wieder meine Nav zerschießt, also lass das raus, bis wir es outgefigured haben xD
##############################################################################################*/



/*Ab hier muss ich noch drüber schauen lol*/
article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}
nav ul{list-style:none}
blockquote,q{quotes:none}
blockquote:before,blockquote:after,q:before,q:after{content:none}
a{margin:0;padding:0;font-size:100%; vertical-align: baseline; background:transparent}
ins{background-color:#ff9;color:#000;text-decoration:none}
mark{background-color:#ff9;color:#000;font-style:italic;font-weight:bold}
del{text-decoration:line-through}
abbr[title],dfn[title]{border-bottom:1px dotted;cursor:help}
table{border-collapse:collapse;border-spacing:0}
hr{display:block;height:1px;border:0;border-top:1px solid #ccc;margin:1em 0;padding:0}
input,select{vertical-align:middle}


/*#######################################################################################
#########################################################################################
                   ACTUAL WEBSEITE fängt ab hier an!!!
#########################################################################################
#########################################################################################*/


/*Desktop Hintergrund, nicht Fenster*/
#desktop {
    font-family: 'BabelSans', 'Society-Regular', 'BabelSans-Oblique', 'BabelSans-Bold', 'OLDSH___';
    position: fixed;
    height: 100%;
    width: 100%;
  	overflow: hidden;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
}

/*Desktop-Fenster ab hier*/
.window {
    position: absolute;
    min-width: 200px;
    min-height: 140px;
    border: 2px solid #000;
    background: #fffef8;
  	border-radius: 5px;
  	z-index: 1000;
}
.window.closed {
	display: none;
}
.window.minimizedWindow {
	display: none;
}
.window.fullSizeWindow {
    top: 0 !important;
    right: 0 !important;
    left: 0 !important;
    border-radius: 0;
    bottom: 32px !important;
}
.fullSizeWindow .ui-resizable-handle {
  	width: 300px;
  	height: 400px;
}

/*Fenster-Titelzeile hier*/
.windowHeader {
    font-family: 'Society-Regular';
    color: #000;
    background-color: #7c7ba8;
    text-align: right;
    border-bottom: 2px solid #000;
    padding: 2px;
    cursor: url("./cursor/sparkle-move.gif"), move;
    height: 28px;
}

/*Fenster-Titelzeile beim Drüberhovern*/
.windowHeader:hover {
  background: #ff8058;
}

.activeWindow .windowHeader {
    background-color: #ff588f;
}

/*span sind die window buttons für minimieren, maximieren und schließen!*/
.windowHeader > span {
    display: inline-block;
	  cursor: url("./cursor/sparkle-pointer.gif"), pointer;
    border: 2px solid #000;
    margin-left: 4px;
    font-size: 19px;
    padding: 2px 10px;
    border-radius: 5px;
    line-height: 20px;
    width: 12px;
    height: 20px;
    position: relative;
    overflow: hidden;
}
.windowHeader > span:hover {
	background: #ff8058;
}
.windowHeader > span.winclose:hover {
	background:#ff9c27;
}
.windowHeader > span > span {
    display: inline-block;
    height: 8px;
    width: 10px;
    position: absolute;
    top: 6px;
    left: 10px;
}
.winminimize > span {
	border-bottom: 3px solid #000;
}
.winmaximize > span {
	border: 2px solid #000;
	border-top: 3px solid #000;
}
.winmaximize > span:nth-child(2) {
	display: none;
}
.fullSizeWindow .winmaximize > span:nth-child(1) {
	margin: 2px 0 0 -4px;
}
.fullSizeWindow .winmaximize > span:nth-child(2) {
    display: inline-block;
    top: 3px;
    left: 12px;
}

/*Fensterinhalt ab hier*/
.wincontent {
    padding: 10px;
    min-width: 200px;
    min-height: 140px;
    border: 2px solid #000;
    margin: 2px;
	  border-radius: 0 0 5px 5px;
}
.windowHeader > strong {
    float: left;
    margin: 0px 3px 0 10px;
    line-height: 29px;
    font-size: 17px;
}

/*Die Taskbar unten beginnt ab hier*/
.taskbarPanel {
    font-family: 'Society-Regular';
    color: #000;
    display: inline-block;
    border: 2px solid #000;
    border-radius: 5px;
    line-height: 24px;
    margin: 2px 0 0 10px;
    font-size: 17px;
    padding: 0 10px;
    background: #7c7ba8;
    font-weight: bold;
	  cursor: url("./cursor/sparkle-pointer.gif"), pointer;
}
.taskbarPanel.activeTab {
	background: #ff588f;
}

.taskbarPanel.activeTab:hover {
	background: #ff8058;
}
.taskbarPanel.minimizedTab {
	background: #7c7ba8;	
}
.taskbarPanel.minimizedTab:hover {
	background: #ff8058;
}
.taskbarPanel.closed {
	display: none;
}

/*Vorbei-scrollender Text - funktioniert nur über javascript!!!*/
*, *::before, *::after{
  -webkit-box-sizing:padding-box;
  box-sizing:padding-box;
}

body{
  background:#CCC;
}

body,
div,
ul,
li,
p {
  margin: 0;
  padding: 0;
  font-family: verdana;
  font-size: 16pt;
}

.tickerwrapper {
  /* the outer div */
  
  position: relative;
  top: 30px;
  left:0%;
  border: 1px solid #444;
  background: #fff;
  width: 99.9%;
  height: 30px;
  overflow: hidden;
  cursor: pointer;
}

ul.list {
  position: relative;
  display: inline-block;
  list-style: none;
  padding:0;
  margin:0;
}

ul.list.cloned {
  position: absolute;
  top: 0px;
  left: 0px;
}

ul.list li {
  float: left;
  padding-left: 20px;
}

/*Inhaltsverzeichnisse als ansprechbare class*/
#toc_container {
    background: #f9f9f9 none repeat scroll 0 0;
    border: 1px solid #aaa;
    display: table;
    font-size: 95%;
    margin-bottom: 1em;
    padding: 20px;
    width: auto;
}

.toc_title {
    font-weight: 700;
    text-align: center;
}

#toc_container li, #toc_container ul, #toc_container ul li{
    list-style: outside none none !important;
}

/*Taskbar als ansprechbare class*/

#taskbar {
	position: absolute;
	height: 32px;
	border-top: 2px solid #000;
	bottom: 0;
	left: 0;
	right: 0;
	background: #80bbff;
}

/*Hier wird die Navigationsleiste links organisiert*/
#icons {
  font-family: 'Society-Regular';
  color: #ff588f;
	position: absolute;
	z-index: 10;
	top: 20px;
	left: 20px;
}
#icons a {
    display: block;
    padding: 5px 10px;
}
#icons a:hover {
	background: #000;
	color: #ffbc39;
	cursor: url("./cursor/sparkle-pointer.gif"), pointer;
}

/*Der Link zum Template wird hier ausgezeichnet*/
#templateLink {
    position: absolute;
    display: inline-block;
    bottom: 10px;
    right: 20px;
    font-weight: bold;
    font-size: 15px;
    color: #EEE;
}

/*Voreinstellung - so öffnet sich die Seite beim ersten Aufruf*/

#window0 {	top: 20px;	left: 340px;}
#window1 {	top: 400px; left: 220px;}
#window2 {	top: 250px; left: 400px;}
#window3 {	top: 125px; left: 520px;}
#window4 {	top: 40px; left: 500px;}
#window5 {	top: 600px; left: 460px;}

#window0 .wincontent {	width: 660px; height: 400px;	}
#window1 .wincontent {	width: 500px; height: 300px;	}
#window2 .wincontent {	width: auto; height: 350px;	}
#window3 .wincontent {	width: auto; height: 350px;	}
#window4 .wincontent {	width: 600px; height: 550px;	}
#window5 .wincontent {	width: auto; height: 350px;	}