/* Main CSS */
/* Paul Knecht, 2011 */

body {
  background-color : #fff;
  font-family : Helvetica, Arial, sans-serif;
  font-size : 13px;
  color : #222;
  line-height : 17px;
  margin : 0px;
  width : 100%;
}

h1 {
  font-size : 13px;
  font-weight : bold;
  margin : 0px;
}

h2 {
  font-size : 13px;
  font-weight : normal;
  font-style : italic;
  margin : 1px 0px 20px 0px;
}

img {
  border : none;
  margin : 0px;
  padding : 0px;
}

a, a:visited {
  cursor : pointer;
  color : #222;
  text-decoration : none;
}


a:hover {
  cursor : pointer;
  text-decoration : underline;
}


p {
  margin-top : 0px;
  margin-bottom : 10px;
  padding : 0px;
} 

/* specific definitions */

#topleft {
  position : absolute;
  top : 10%;
  left : 25%;
  margin : 0px 0px 0px -240px;
  width : 130px;
  text-align : right;
}

#start {
  position : absolute;
  top : 10%;
  left : 25%;
  margin : 7px 0px 0px -86px;
  width : 75%;
  max-width : 923px;
  min-width : 783px;
  overflow : hidden;
  z-index : 2;
}
  
#spacer {
  position : absolute;
  top : 10%;
  left : 25%;
  margin : 7px 0px 0px -86px;
  width : 75%;
  max-width : 923px;
  min-width : 783px;
  overflow : hidden;
  z-index : 0;
}
  
#text {
  position : absolute;
  width : 49.6%;
  height : 35.9%;
}

#text h3 {
  margin : 0px 0px 13px 0px;
  font-size : 13px;
  font-weight : bold;
}

#facebook {
  font-weight : bold;
  display : block;
  margin : 0px 20px 0px 0px;
  float : left;
}

.fb-like {
  display : block;
}    

#facebookbox {
  position : absolute;
  top : 135px;
  left : 0px;
  bottom : 0px;
  width : 100%;
  overflow : auto;
}  
#facebookbox a, #facebookbox a:visited, #facebookbox div a, #facebookbox div a:visited {
  text-decoration : underline;
}

.box {
  max-width : 380px;
}  

.goto {
  position : absolute;
  bottom : 10px;
  left : 15px;
  font-weight : bold;
}  

#calais {
  position : absolute;
  top : 0px;
  right : 0px;
  height : 36%;
  margin-right : 0px;
  width : 49.7%;
}

#calais img {
  width : 100%;
  max-height : 340px;
}  
  
#return {
  position : absolute;
  top : 36.6%;
  right : 0%;
  height : 36%;
  width : 49.7%;
}

#return img {
  width : 100%;
  max-height : 340px;
}  
  
#southind {
  position : absolute;
  top : 36.6%;
  left : 0%;
  height : 36%;
  width : 49.7%;
}

#southind img {
  width : 100%;
  max-height : 340px;
}  
  
#israel {
  position : absolute;
  bottom : 0px;
  left : 0px;
  height : 26.7%;
  width : 37%;
  float : left;
}

#israel img {
  width : 100%;
  max-height : 227px;
  float : left;
}  
  
#africacup {
  position : absolute;
  bottom : 0px;
  width : 37%;
  left : 37.75%;
  height : 26.7%;
}

#africacup img {
  width : 100%;
  max-height : 227px;
  float : left;
}  
  
#munich {
  position : absolute;
  bottom : 0px;
  left : 75.45%;
  height : 26.7%;
  width : 24.6%;
}

#munich img {
  width : 100%;
  max-height : 227px;
  float : left;
}

#story {
  position : absolute;
  top : 10%;
  left : 25%;
  margin : 7px 0px 0px -86px;
  width : 60%;
  max-width : 1050px;
  min-width : 700px;
  text-align : right;
  z-index : 1;
}

#content {
  position : absolute;
  left : 0px;
  right : 0px;
  overflow-x : hidden;
  height : 120%;
}

#photowrapper {
  position : absolute;
  top : 0px;
  left : 0px;
  height : 100%;
  width : 100%;
  text-align : left;
  overflow : hidden;
  z-index : 0;
}  

.format {
  width : 100%;
}  

#subtitle {
  position : relative;
  padding-left : 0.65%;
  top : 8px;
  left : -0.1em;
  width : 99%;
  
  font-style : italic;
  display : block;
  text-align : left;
  height : 60px;
  font-size : 13px;
  line-height : 17px;
}  

#thumbs {
  position : absolute;
  left : 240px;
  right : -0.3%;

  text-align : right;
  font-size : 1px;
  line-height : 1px;
}

.thumbimg {
  width : 20%;
  float : left;
}  

#thumbs img {
  width : 97%;
  padding-bottom : 3%;
  cursor : pointer;
}

#thumbs2 {
  position : absolute;
  left : 240px;
  right : -0.3%;

  text-align : right;
  font-size : 1px;
  line-height : 1px;

  width : 67.9%;
  text-align : right;
  font-size : 1px;
  line-height : 1px;
}

#thumbs2 img {
  width : 97%;
  padding-bottom : 3%;
  cursor : pointer;
}



#article {
  position : relative;
  margin : 0px 0px 100px 240px;
  text-align : left;
}

#article h3 {
  margin : 0px 0px 20px 0px;
  padding : 0% 0% 0% 0%;
  padding-left : 0.65%;
  margin-left : -0.1em;
  font-family : Garamond, Times, Times New Roman, serif;
  font-size : 27px;
  font-weight : normal;
}    

#article p {
  padding-left : 0.65%;
  margin-left : -0.1em;
  max-width : 570px;
  line-height : 18px;
}    

#article div {
  padding-left : 0.65%;
  margin-left : -0.1em;
}

#article #subtitle p {
  padding : 0px;
  margin : 0px;
  max-width : 100%;
}  

#article ul {
  margin : 7px 0px 7px 0px;
  padding : 0px 0px 0px 0px;
}
  
#article ul li {
  display : block;
  list-style-type : none;
}
  
#article object, #article embed {
  padding : 0px;
  margin : 0px;
  margin-left : 20px;
  max-width : 570px;
  line-height : 18px;
}    

#left {
  margin-top : 60px;
  width : 180px;
  float : left;
  text-align : left;
}

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

#navigation ul li {
  margin-bottom : 2px;
  cursor : pointer;
}      

#navigation ul li a:hover {
  font-weight : bold;
  text-decoration : none;
}      

#description {
  margin-top : 60px;
  width : 180px;
  text-align : left;
}    

.act {
  font-weight : bold;
}

.normal {
  width : 100%;
}  

.medium {
  position : relative;
  margin-left : 240px;
  padding-left : 0.65%;
  left : -0.1em;
  width : 66.6667%;
} 

.high {
  position : relative;
  margin-left : 240px;
  padding-left : 0.65%;
  left : -0.1em;
  width : 44.48%;
} 

#navphoto {
  position : absolute;
  top : 0px;
  left : 0px;
  width : 100%;
  z-index : 2;
  overflow : hidden;
}  

#prev, #next {
  position : absolute;
  top : 0px;
  height : 100%;
  visibility : hidden;
  background-repeat : no-repeat;
  cursor : pointer;
}

#prev {
  left : 0%;
  width : 50%;
  background-image : url(img/format.png);
  background-position : left center;
}
#next {
  left : 50.1%;
  width : 50%;
  background-image : url(img/format.png);
  background-position :  right center;
}  

#article a {
  text-decoration : underline;
}  
#article a:hover {
  text-decoration : none;
}  






.imgone {
  float : left;
  margin-right : 10px;
}    

.img {
  visibility : hidden;
  display : none;
}