/* Reset                        */

/* Fonts                        */

/* Standards                    */

/* Grid                         */

/* Header                       */

/* Footer                       */

/* Content                      */

/* Forms                        */

/* Home                         */

/* _Special                     */

/* End                          */


/* RESET ///////////////////////////////////////////////*/

html {color:#8d857c; background:#ffc54e;}
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,input,textarea,p,blockquote,th,td {margin:0; padding:0; border:0}

table {border-collapse:collapse; border-spacing:0;}

fieldset,img {border:0;}

address,caption,cite,code,dfn,em,strong,th,var {font-style:normal; font-weight:normal;}

li {list-style:none;}

caption,th {text-align:left;}

h1,h2,h3,h4,h5,h6 {font-size:100%; font-weight:normal;}

q:before,q:after {content:'';}

abbr,acronym {border:0; font-variant:normal;}

sup {vertical-align:text-top;}

sub {vertical-align:text-bottom;}

input,textarea,select {font-family:inherit; font-size:inherit; font-weight:inherit;}

input,textarea,select {*font-size:100%;}

legend {color:#000;}



/*  FONTS ///////////////////////////////////////////////// */

body {
    font: 12px arial, helvetica, sans-serif;
    line-height: 17px;
    color: #353535;
}


h1,
h2,
h3,
h4,
h5,
h6 { font-size: 100%; line-height: 100%;}


select,input,button,textarea {
    font:100% arial, helvetica, sans-serif;
}


table {
    font-size:inherit;
    font:100%;
}


pre,code,kbd,samp,tt {
    font-family:monospace;
    * font-size:108%;
    line-height:100%;
}



/*  Standards ///////////////////////////////////////////////// */


html,
body {
    height: 100%  !important;
    min-height: 100%;
    *height: 100%;    
}


img {
    border: none
}


strong {
    font-weight: bold;
}


.clear {
    clear: both;
}


.floatLeft {
    float: left;
}


.floatRight {
    float: right;
}


a {
    color: #353535;
    text-decoration: underline;
    outline: none;
}


a:hover {
    text-decoration: none;
}


#site    {
    margin: 0 auto;
    width: 1000px;
    height: auto !important;
    min-height: 100%;
    background:#ffc54e;
    border: 0px solid #000000;
    *height: 100%;
}


/* Header ///////////////////////////////////////////////*/
#header {
    height: 142px;
    position: relative;
    margin-top: 10px;
    margin-bottom: 0px;
    overflow: hidden;
    border: 0px solid #000000;
}

#header a.logo {
    position: absolute;
    top: 15px;
    left: 25px;
    width: 170px;
    height: 95px;
    display: block;
    overflow: hidden;
    text-indent: -1000em;
    background: transparent url(./images/projacter-logo.gif) no-repeat 0 0;
}

#header h1 {
    position: absolute;
    top: 25px;
    left: 250px;
    color: #666666;
    font-size: 24px;
    font-weight: bold;
}

#header h1 span.CEO {
    display:inline;
    font-size:0.6em; 
    font-weight:normal; 
}

#header h1 span.mission {
    display: block;
    font-size: 14px;
    line-height: 24px;
}

#header h2 {
    position: absolute;
    top: 85px;
    left: 250px;
    color: #a6a6a6;
    font-size: 14px;
    font-weight: normal;
}


#headerNavi {
    position: absolute;
    top: 110px;
    left: 244px;
}

#headerNavi li {
    float: left;
    display: inline;
}

#headerNavi li a {
    float: left;
    color: #fff;
    width: 137px;
    height: 21px;
    padding-top: 11px;
    display: block;
    font-size: 12px;
    text-align: center;
    text-decoration: none;
    text-shadow: #333 1px 1px 1px;
    background: transparent url(./images/menubar.png) no-repeat 0 0;    
}

#headerNavi li a:hover {
    color: #333;
    height: 21px;    
    padding-top: 11px;    
    text-shadow: #e5e5e5 1px 1px 1px;
    text-decoration: none;
}

#headerNavi li.aktiv a {
    font-size: 12px;
	  font-weight: bold;
    text-decoration: underline;
}

#headerNavi li.first a {
    padding-left: 6px;
}

#headerNavi li.first a:hover {
    background-position: 0 -32px;
}

#headerNavi li.second a {
    background-position: -143px 0;
}

#headerNavi li.second a:hover {
    background-position: -143px -32px;
}

#headerNavi li.third a {
    background-position: -280px 0;
}

#headerNavi li.third a:hover {
    background-position: -280px -32px;
}

#headerNavi li.fourth a {
    background-position: -417px 0;
}

#headerNavi li.fourth a:hover {
    background-position: -417px -32px;
}

#headerNavi li.last a {
    padding-right: 8px;
    background-position: right 0;    
}

#headerNavi li.last a:hover {
    background-position: right -32px;
}



/* Mittelteil ///////////////////////////////////////////*/
#middle {
    min-height: 100px;
}



/* Sidebar ///////////////////////////////////////////////*/
#sidebar {
    min-height: 100px;
    width: 230px;
    margin: 0 20px 0 0;
    float: left;
    display: inline;
    overflow-x: hidden;
}

#sidebar li {
    height: 59px;
    background: url(./images/sidebar_off.gif) repeat-x 0 0;
    margin-bottom: 1px;
}

#sidebar li a {
    width: 185px;
    height: 39px;
    padding: 20px 0 0 40px;
    display: block;
    color: #444444;
    font-size: 14px;
    line-height: 16px;
    text-decoration: none !important;
    border: 0px solid #000;
}

#sidebar li a:hover {
    width: 230px;
    margin-left: 5px;
    margin-bottom: 1px;
    background: url(./images/sidebar_on.gif) repeat-x 0 0;
}

#sidebar li a span {
    display: block;
    color: #464646;
    font-size: 11px;
}



/* Content ///////////////////////////////////////////////*/
#content {
    width: 686px;
    float: left;
    background: #fff;
    display: inline;
}

/* Welcome - Seite */
#intro {
    width: 660px;
    height: 230px;
    padding: 20px 0 0 20px;
    position: relative;
    background: url(./images/projacters-vision.jpg) no-repeat 0 40px;
	border: 0px solid #000;
}

#intro h2 {
    font-size: 20px;
    color: #555555;
    font-weight: normal;
    padding: 5px;
}

#intro p {
    position: absolute;
    left: 425px;
    top: 225px;
    color: #555555;
    font-size: 14px;
}


/* einfache Text - Seiten: Kontakt, Impressum, Datenschutzerklärung */
#kontakt {
    width: 660px;
    height: 200px;
    padding: 15px 0 0 20px;
    position: relative;
}

#impressum {
    width: 660px;
    height: 980px;
    padding: 15px 0 0 20px;
    position: relative;
}

#datenschutz {
    width: 660px;
    height: 6450px;
    padding: 15px 0px 0px 20px;
    position: relative;
}

#impressum h2, #kontakt h2, #datenschutz h2 {
    font-size: 18px;
    color: #555555;
    font-weight: bold;
    line-height: 2em;
}

#impressum p, #kontakt p, #datenschutz p {
    color: #555555;
    line-height: 1.3em;
    font-size: 14px;
}

#impressum a, #kontakt a, #datenschutz a {
    color: #0000ff;
    white-space: nowrap;
    padding-left: 7px;
}


/* Beschreibung des Unternehmens */
#projacter {
    width: 520px;
    height: 710px;
    padding: 15px 0 0 20px;
    position: relative;
}

#projacterTab {
    width: 548px;
    height: 20px;
    padding: 0px 0px 0px 0px;
    position: relative;
    background: url(./images/activetab.png) no-repeat 200px 0px;
	border: 0px solid #000;
}

#projacter h2 {
    font-size: 18px;
    color: #555555;
    font-weight: bold;
    line-height: 2em;
}

/*
#projacter p {
    color: #555555;
    line-height: 1.3em;
    font-size: 14px;
}
*/

#projacter a {
    color: #0000ff;
    white-space: nowrap;
    padding-left: 7px;
}

#projacter img {
    position: absolute;

    -webkit-border-radius: 10px; /* Safari 3-4, iOS 1-3.2, Android =1.6 */
            border-radius: 10px; /* Opera 10.5, IE9+, Safari 5, Chrome, Firefox 4+, iOS 4, Android 2.1+ */
  /* useful if you don't want a bg color from leaking outside the border: 
  -moz-background-clip: padding; -webkit-background-clip: padding-box; background-clip: padding-box; */

    -webkit-box-shadow: 0px 0px 4px 0px #ffffff; /* Safari 3-4, iOS 4.0.2 - 4.2, Android 2.3+ */
            box-shadow: 0px 0px 4px 0px #ffffff; /* Opera 10.5, IE9+, Firefox 4+, Chrome 6+, iOS 5 */
}

#projacter img.first {
    top: 115px;
    left: 30px;
    width: 124px;
    height: 112px;
    background: url(./images/firststep.jpg) no-repeat;
}

#projacter p.first {
    position: absolute;
    top: 130px;
    left: 170px;
    width: 240px;
    height: 70px;
    color: #666666;
    line-height: 1.3em;
    font-size: 14px;
    border: 0px solid #000;
}

#projacter img.second {
    top: 210px;
    left: 125px;
    width: 124px;
    height: 112px;
    background: url(./images/secondstep.jpg) no-repeat;
}

#projacter p.second {
    position: absolute;
    top: 230px;
    left: 270px;
    width: 240px;
    height: 70px;
    color: #666666;
    line-height: 1.3em;
    font-size: 14px;
    border: 0px solid #000;
}

#projacter img.third {
    top: 300px;
    left: 225px;
    width: 149px;
    height: 112px;
    background: url(./images/thirdstep.jpg) no-repeat;
}

#projacter p.thirdleft {
    position: absolute;
    top: 350px;
    left: 70px;
    width: 160px;
    height: 70px;
    color: #666666;
    line-height: 1.3em;
    font-size: 14px;
    border: 0px solid #000;
}

#projacter p.thirdright {
    position: absolute;
    top: 310px;
    left: 385px;
    width: 150px;
    height: 70px;
    color: #666666;
    line-height: 1.3em;
    font-size: 14px;
    border: 0px solid #000;
}

#projacter img.fourth {
    top: 395px;
    left: 350px;
    width: 124px;
    height: 112px;
    background: url(./images/fourthstep.jpg) no-repeat;
}

#projacter p.fourth {
    position: absolute;
    top: 440px;
    left: 100px;
    width: 240px;
    height: 70px;
    color: #666666;
    line-height: 1.3em;
    font-size: 14px;
    border: 0px solid #000;
}


#projacter img.last {
    top: 510px;
    left: 200px;
    width: 180px;
    height: 210px;
    background: url(./images/success.jpg) no-repeat;
}

#projacter p.lastleft {
    position: absolute;
    top: 540px;
    left: 60px;
    width: 140px;
    height: 120px;
    color: #666666;
    line-height: 7em;
    font-size: 14px;
    border: 0px solid #000;
}

#projacter p.lastright {
    position: absolute;
    top: 540px;
    left: 380px;
    width: 130px;
    height: 120px;
    color: #666666;
    line-height: 7em;
    font-size: 14px;
    border: 0px solid #000;
}



/* Footer ///////////////////////////////////////////////*/
#footer {
    position: relative;
    margin: 15px 0;
    height: 61px;
    line-height: 61px;
    background: transparent url(./images/drop_shadow.png) no-repeat 0 0;
}

#footer p {
    color: #888888;
    font-size: 14px;
    margin-left: 40px;
    display: inline;
}

#footer p span {
    font-size: 12px;
    display: inline;
}

#footer div.logo {
    position: absolute;
    top: 14px;
    right: 20px;
    width: 58px;
    height: 36px;
    overflow: hidden;
    text-indent: -1000em;
    background: transparent url(./images/sprite-footer.png) no-repeat 0 -70px;
}



/*  System Message /////////////////////////// *
/
.systemMessage {
    font-size: 14px;
    font-weight: bold;
    line-height: 33px;
    color: #1a1a1a;
    margin: 0 10px 20px;
}

.systemMessage.error {
    color: #B31E00;
}

.systemMessage div.icon {
    float: left;
    height: 35px;
    width: 35px;
    margin-right: 10px;
    background: #f2f2f2 url(./images/bg-box-info.png) no-repeat -20px -200px;
}

.systemMessage.error div.icon {
    background: #f2f2f2 url(./images/bg-box-info.png) no-repeat -20px -350px;
}

.systemMessage .middle {
    background: #f2f2f2;
    padding: 0 20px;
}

.systemMessage .top {
    background: #f2f2f2 url(./images/bg-box-info.png) no-repeat 0 top;
    height: 13px;
    line-height: 10px;
    position: relative;
}

.systemMessage div.tr {
    background: #f2f2f2 url(./images/bg-box-info.png) no-repeat right top;
    width: 13px;
    height: 13px;
    display: block;
    float: right;
}

.systemMessage .bottom {
    background: #f2f2f2 url(./images/bg-box-info.png) no-repeat 0 bottom;
    height: 13px;
    line-height: 10px;
    position: relative;
}

.systemMessage div.br {
    background: #f2f2f2 url(./images/bg-box-info.png) no-repeat right bottom;
    width: 13px;
    height: 13px;
    display: block;
    float: right;
}


/* End ///////////////////////////////////////////////*/
