#all {
margin: auto;
width: 697px;
}

body {
background-image: url(images/bodybg.jpg);
background-repeat: repeat-x;
}

#head {
position:absolute;
width: 695px;
height: 200px;
border: 1px solid #fff;
background-image: url(images/header1.jpg);
margin: auto;
color: #fff;
overflow:hidden;
}

.nie{
opacity:0;
}
.ie8{
opacity:2;
}

#pics h1 {
position:absolute;
top:-5px;
font-size: 40px;
font-family: Arial, Sans-Serif;
color: #fff;
padding-left: 48px;
top: 185px;
margin-bottom: 5px;
text-shadow: 2px 2px #000000;
}

#pics .ie8  h1{
position:absolute;
top:-5px;
font-size: 40px;
font-family: Arial, Sans-Serif;
color: #fff;
padding-left: 48px;
top: 185px;
margin-bottom: 5px;
text-shadow: 2px 2px #000000;
}

#flip{
-moz-transform: scaleX(-1); /* Gecko */
-o-transform: scaleX(-1); /* Operah */
-webkit-transform: scaleX(-1); /* webkit */
transform: scaleX(-1); /* standard */
filter: FlipH; /* IE 6/7/8 */
margin-left:20px;
}

#shift{
margin-left:0px;
}

.ie8 h1 #shift{
top:-26px;
}

#pics h2{
position:absolute;
top:255px;
left:20px;
width:300px;
font-size: 15px;
font-family: Arial, Sans-Serif;
color: #fff;
/*padding-left: 20px;*/
margin: 0;
text-shadow: 2px 2px #000000;
}

#pics .ie8 h2 {
top:255px;
left:20px;
text-shadow: 2px 2px #000000;
}

.headlinks {
color: #fff;
font-family: Arial, Sans-Serif;
font-size: 12px;
float: right;
padding-right: 5px;
margin: 0;
}

.headlinks img {
float: right;
margin-right:5px;
cursor:pointer;
}

.headlinks a {
color: #fff;
}

.headlinks a:hover {
text-decoration: none;
}

#navigation {
position:absolute;
top:305px;
/*left:285px;*/
float:right;
width: 695px;
background-image: url(images/navigation_bg.jpg);
background-repeat: repeat-x;
height: 44px;
margin-top: 10px;
margin-left: auto;
margin-right: auto;
border-bottom: 1px solid #fff;
border-top: 1px solid #fff;
border-left: 1px solid #fff;
border-right: 1px solid #fff;
}

#navigation ul {
list-style-type: none;
margin: 0;
padding: 0;
}

#navigation li {
cursor:pointer;
width: 115px;
margin: auto;
float: left;
text-align: center;
border-right: 1px solid #fff;
}

#navigation li a {
text-decoration: none;
color: #fff;
display: block;
width: 100%;
background-image: url(images/button.jpg);
padding-top: 14px;
padding-bottom: 14px;
font-size: 13px;
font-family: Arial, Sans-Serif;
background-repeat: no-repeat;
}

#navigation li a:hover {
background-image: url(images/button_hover.jpg);
background-repeat: no-repeat;
}

.endfloat {
float: none;
clear: both;
width: 1px;
margin: 0;
padding: 0;
font-size: 0px;
line-height: 0px;
height: 0px;
}

#content {
position:absolute;
top:355px;
/*left:285px;*/
float:right;
width: 695px;
height:800px;
margin: 0;
margin-top: 10px;
border: 1px solid #fff;
background-image: url(images/content_bg.jpg);
background-color: #fff;
background-repeat: repeat-x;
font-family: Arial, Sans-Serif;
font-size: 13px;
padding-bottom: 50px;
}

#leftnavigation {
float: left;
width: 140px;
padding: 0;
padding-left: 20px;
margin: 0;
}

#mainnavigation {
padding-top: 0;
font-family: Arial, Sans-Serif;
}

#mainnavigation a {
cursor:pointer;
display: block;
background: url(images/mainnavigation_bg.jpg);
color: #fff;
padding: 7px;
padding-top: 5px;
padding-bottom: 5px;
padding-right: 10px;
text-decoration: none;
font-size: 12px;
width: 143px;
background-repeat: no-repeat;
border-left: 1px solid #000;
border-right: 1px solid #000;
}

#mainnavigation a:hover {
background-image: url(images/mainnavigation_bg_hover.jpg);
}

#mainnavigation h3 {
background: url(images/headline.jpg);
color: #fff;
padding: 7px;
padding-top: 5px;
padding-bottom: 5px;
text-decoration: none;
font-size: 12px;
width: 146px;
background-repeat: repeat-x;
margin: 0;
margin-top: 10px;
border-right: 1px solid #000;
border-left: 1px solid #000;
border-top: 1px solid #000;
border-bottom: 1px solid #000;
}

#textcontent {
position:absolute;
margin:auto;
/*top:180px;*/
left:185px;
text-align: justify;
font-family: Arial, Sans-Serif;
font-size: 12px;
padding-left: 5px;
padding-right: 20px;
width: 480px;
}

.text {
width: 480px;
}

.textbackground {
background-color: #fff;
color: #000;
padding: 7px;
padding-top: 5px;
padding-bottom: 5px;
margin: 0;
border: 1px solid #000;
}

.text h4 {
background: url(images/headline.jpg);
color: #fff;
padding: 7px;
padding-top: 5px;
padding-bottom: 5px;
text-decoration: none;
font-size: 12px;
background-repeat: repeat-x;
margin-bottom: 0px;
margin-left: 0px;
margin-right: 0px;
margin-top: 10px;
border-top: 1px solid #000;
border-right: 1px solid #000;
border-left: 1px solid #000;
}

#footer {
width: 695px;
height: 100px;
border: 1px solid #fff;
background-image: url(images/footer.jpg);
background-repeat: no-repeat;
margin-left: auto;
margin-right: auto;
margin-top: 5px;
font-family: Arial, Sans-Serif;
font-size: 12px;
color: #fff;
text-align: center;
padding: 0;
}

#footer p {
margin-top: 30px;
}

#footer a {
color: #fff;
text-decoration: underline;
}

#footer a:hover {
text-decoration: none;
}

#pics{
position:absolute;
overflow:hidden;
border-radius:21px;
margin: auto;
width: 695px;
height: 300px;
}

#cont1{
position:absolute;
border-radius:21px;
left:-695px;
height:300px;
width:695px;
background: url(images/697x300/about_easy.png);
}

#cont2{
position:absolute;
border-radius:21px;
left:0px;
height:300px;
width:695px;
background: url(images/697x300/about_think.png);
}

#cont3{
position:absolute;
border-radius:21px;
left:695px;
height:300px;
width:695px;
background: url(images/697x300/about_collage.png);
}

#cont4{
position:absolute;
border-radius:21px;
left:0px;
height:300px;
width:695px;
background: url(images/697x300/omap_whole.jpg);
opacity:0;
}

#next{
position:absolute;
cursor:pointer;
top:130px;
left:80px;
z-index:2;
}

#prev{
position:absolute;
cursor:pointer;
top:130px;
left:615px;
z-index:2;
}