/****************
 HEADER
 *****************/

 body {
    font-family:Verdana,Helvetica,Geneva,Arial,sans-serif;
    font-size:14px;
    width:100%;
    margin: 0px;
    padding: 0px;
}

img {
    border:0 solid white;
}
a.screenshot img  {
    background:none repeat scroll 0 0 white;
    border:1px solid #BBBBBB;
    margin:7px 14px 7px 0;
    padding:5px;
}

h1 {
    font-size:160%;
    font-weight:bolder;
}

h2 {
    font-size:140%;
    padding-left: 20px;
    padding-top: 15px;
    border-bottom: 1px dotted #67AC0E;
    
}
h3 {
    font-size:120%;
    padding-left: 40px;
    padding-top: 15px;
    border-bottom: 0px dotted #67AC0E;
    font-weight: bold;
}
h4 {
    font-size:100%;
    padding-left: 60px;
    padding-top: 7px;
    border-bottom: 0px dotted #67AC0E;
    font-weight: bold;
}
li{
    padding: 6px 5px;
}


/****************
 LINKS
 *****************/

 a.topmenu:link{
    font-size: 16px;
	color: #000000;
	padding: 5px 20px;
}
a.topmenu:visited{
    font-size: 16px;
	color: #333333;
	padding: 5px 20px;
}

a.bottomMenu:link,a.bottomMenu:visited{
    text-decoration: none;
}
a.bottomMenu:hover{
    color: black;
    text-decoration: underline;
}

span.leftMenu{ color: blue; cursor: pointer; }
a.leftMenu:link { color: blue; cursor: pointer; }
a.leftMenu:hover { color: #E58A01; cursor: pointer; }

/****************
 HEADER
 *****************/

div#topmenu {
    background-color:transparent;
    background-image:url("../images/main_back.png");
    background-position:left top;
    background-repeat:repeat;
    border-bottom:1px solid #67AC0E;
    margin-bottom:6px;
    margin-top:2px;
    padding:5px 150px 3px 0px;
    text-align:right;
    white-space:nowrap;
    height: 18px;
}
.subheader {
    color:black;
    font-size:18px;
    font-weight:bolder;
    padding-bottom:3px;
    padding-top:3px;
    margin-left:12px;
    white-space:nowrap;
}
div#logo {
    margin-top:10px;
    margin-bottom:8px;
    margin-left:10px;
    padding:0;
    text-align:left;
}

div#header {
    left:0;
    margin-bottom:1px;
    padding:0;
    text-align:left;
    top:0;
}


/****************
 MENU 
 *****************/

.topmenu_active{
    font-size: 16px;
	color: #000000;
	padding: 5px 20px;
    font-weight: bolder;
}
div#leftMenu{
    float: left;
    width: 280px;
    border-right: 1px dotted #67AC0E;
    padding: 10px;
}
div#rightMenu{
    float: right;
    width: 250px;
    border-left: 1px dotted #67AC0E;
    padding: 10px;
}
div#rightMenu h1{
    background-color:#EEEEEE;
    color:#666666;
    font-size:80%;
    margin:20px 0 10px;
    padding:3px 0 2px 5px;
}

div#leftMenu h1{
    background-color:#EEEEEE;
    color:#666666;
    font-size:80%;
    margin:20px 0 10px;
    padding:3px 0 2px 5px;
}
ul.leftMenu{
    list-style: none;
    padding-left: 5px;
}

ul.leftMenu li{
    padding: 5px 5px 2px 5px;
}
.leftmenu_active{
    color: #E58A01;
    font-weight: bolder;
}

ul.rightMenu{
    list-style: none;
    padding-left: 5px;
}

ul.rightMenu li{
    padding: 5px 5px 2px 5px;
}

ul.bottomMenu{
    list-style: none;
    padding-left: 23px;
    margin-left: 0px;
}
ul.bottomMenu li{
    padding: 5px 5px 2px 5px;
}
.bottomMenu_active{
    color: #E58A01;
    font-weight: bold;
}
ul.bottomMenuContainer{
    list-style:none outside none;
    margin: 0px;
    padding:20px 0px;
}
ul.bottomMenuContainer li.bottomMenuContainer{
    border-left:1px solid whitesmoke;
    float:left;
    padding-right: 20px;
    min-height: 100px;
}

/****************
 MAIN CONTENT 
 *****************/

div#hello{
    margin: 0 auto;
    text-align:center;
    width: 800px;
}
div#inthecloud{
    padding: 35px 0px 0px 0px;
    width: 320px;
    float: left;
}
div#hello_text{
    margin-left: 320px;
    padding: 5px 0px 30px 30px;
    text-align:center;
    width: 400px;
 }
 div#hello_header{
    text-align:center;
    font-size: 120%;
    font-weight: bolder;
 }
 div#hello_subheader{
    padding-top: 25px;
    text-align:center;
    font-size: 110%;
 }
 div#hello_button{
    padding-top: 25px;
    text-align:center;
 }

ul.hello {
    padding: 0 15px;
}
 ul.hello li{
    list-style: none;
    padding: 10px 20px 10px 65px;
}
li#talk{
    background-image: url("../images/startpage/talk.png");
    background-repeat: no-repeat;
    background-position: 0 12px;
}
li#cloud{
    background-image: url("../images/startpage/cloud.png");
    background-repeat: no-repeat;
    background-position: 0 12px;
}
li#save{
    background-image: url("../images/startpage/save.png");
    background-repeat: no-repeat;
    background-position: 0 12px;
}
li#solution{
    background-image: url("../images/startpage/stack.png");
    background-repeat: no-repeat;
    background-position: 0 12px;
}
li#grow{
    background-image: url("../images/startpage/grow.png");
    background-repeat: no-repeat;
    background-position: 0 12px;
}
 
 a.slidedown{
    font-size: 120%;
    background-image:url("../images/slideDown.gif");
    background-position:left;
    background-repeat:no-repeat;
    padding-left: 20px;
}
 a.slideup{
    font-size: 120%;
    background-image:url("../images/slideUp.gif");
    background-position:left;
    background-repeat:no-repeat;
    padding-left: 20px;
}
 table.default{
    border: 1px dotted #CCCCCC;
 }
 
 table.default td{
    padding: 10px;
    margin: 0px;
    border: 1px dotted #999999;
 }
 table.default th{
    padding: 15px 5px 5px 5px;
    color: #666666;
 }
 
div#startpage-outer{
    background-image: url(../images/startpage/background_left.png);
    background-repeat: no-repeat;
    background-position: 0px 0px;
	padding-top: 0px;
    padding-bottom: 0px;
}
div#startpage-inner{
    background-image: url(../images/startpage/background_right.png);
    background-repeat: no-repeat;
    background-position: 0px 0px;
	padding-top: 0px;
    padding-bottom: 0px;
    text-align: center;
}
 
div#sitecontainer {
    padding:10px;
	min-height:100%;
}

div#main{
    padding: 5px;
    
}
div#centeredcontent{
    padding: 10px 20px;
    margin-left: 200px; 
    margin-right: 200px; 
}
div#rightcontent{
    padding: 10px 20px;
    margin-left: 300px; /* width of the left menu plus padding */    
}
div#leftcontent{
    padding: 10px 20px;
    margin-right: 270px; /* width of the right menu plus padding */    
}

div.screencast{
    padding: 25px 15px;
}
div.level1{
    text-align: justify;
    padding-left: 3px;
    padding-top: 10px;
}
div.level2{
    text-align: justify;
    padding-left: 23px;
    padding-top: 10px;
}
div.level3{
    text-align: justify;
    padding-left: 43px;
    padding-top: 10px;
}
div.level4{
    text-align: justify;
    padding-left: 63px;
    padding-top: 7px;
}

span.index{
}
span.index .no_link{
    color: #666666;
    padding: 5px 10px;
    border:1px dotted white;
}
span.index a{
    padding: 5px 10px;
    border:1px dotted white;
}
span.index a:hover{
    border:1px dotted #333333;
    color: #E58A01;
}

div.warning  {
    background-color:#FFFFCC;
    background-image:url("/images/icons/warning.png");
    background-position:20px 50%;
    background-repeat:no-repeat;
    margin:3px auto 23px auto;
    min-height:50px;
    padding:15px 20px 15px 90px;
    text-align:justify;
    vertical-align: middle;
    width:300px;
    -moz-border-radius: 20px;
    -webkit-border-radius: 20px;
}

/****************
 Doku
 *****************/

div.toc{
    border-bottom: 1px dotted #999999;
    background-color: #efefef;
}
div#toc__header{
    text-align: center;
    color: #666666;
}
div#toc__inside{
    padding: 10px;
}
ul.toc li.level1{
    list-style: none;
    padding: 4px;
    font-size: 120%;
}
ul.toc li.level2{
    list-style: decimal;
    padding: 2px;
    font-size: 88%;
}
ul.toc li.level3{
    list-style: none;
    padding: 2px;
    font-size: 88%;
}

table.inline th{
    background-color: #efefef;
    font-size: 105%;
    color: #666666;
    font-weight: normal;
    padding: 3px 15px;
}
table.inline td{
    border-bottom: 1px dotted #999999;
    padding: 5px 10px;
}

code  {
    font-size:100%;
}
pre.code  {
    background-color:#F7F9FA;
}
pre  {
    border:1px dashed #C8EBAC;
    color:#000000;
    font-size:100%;
    overflow:auto;
    padding:0.5em;
}

/****************
 FOOTER
 *****************/

div#footer{
    margin-top: 40px;
    padding-top: 10px;
    padding-bottom: 20px;
    border-top: 1px dotted #AAAAAA;/*border-top: 1px solid #67AC0E;*/
    background-color: #EFEFEF;
    text-align: center;
}
div#footer2{
    font-size:80%;
    padding-top: 10px;
    padding-bottom: 20px;
    text-align: center;
    color: #777777;
}

div#footer2 a img{
    opacity: 0.5;
    filter: alpha(opacity = 50);
}
div#footer2 a:hover img{
    opacity: 1;
    filter: alpha(opacity = 100);
}

a.fade img{
    opacity: 0.5;
    filter: alpha(opacity = 50);
}
a:hover.fade img{
    opacity: 1;
    filter: alpha(opacity = 100);
}

.bottomMenuHeader{
    padding-left: 20px;
    color:#666666;
    font-size:80%;
    font-weight: bold;
}
.bottomMenu{
    color:#666666;
    font-size:80%;
}