/**********************************************************************
* General styles                                                      *
**********************************************************************/
* {
	font-family: Helvetica, Arial, sans-serif;
	font-size:   12px;
	line-height: 150%;
	color:       inherit;
	margin:      0px 0px 0px 0px;
	padding:     0px 0px 0px 0px;
	
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	-ms-box-sizing: border-box;
	box-sizing: border-box;
	
	outline: none; 
	-moz-outline-style: none;
}

body {
  border:     0px;
  margin:     0px 0px 0px 0px;
  padding:    0px 0px 0px 0px;
  overflow-x: hidden;
}

p {
  display:  block;
  margin:   0px 0px 16px 0px;
}

input.text {
  width: 100%;
}

input.button {
  width: 48%;
}

fieldset {
  border: 0px;
  margin-bottom: 16px;
}

h1 {
  font-size:      22px;
  text-transform: uppercase;
  line-height:    130%;
}

h2 {
  font-size:      22px;
  font-weight:    100;
  text-transform: uppercase;
  line-height:    130%;
  margin:         36px 0px 28px 0px;
}

h2:first-child {
  margin-top: 0px;
}

h3 {
  margin: 36px 0px 15px 0px;
}

h3:first-child {
  margin-top: 0px;
}

h2 + h3 {
  margin-top: 0px;
}


hr {
  background-color: #CCCCCC;
  color:            #CCCCCC;
  height:           1px;
  border:           0px; 
  margin-top:       4px;
}

img {
  border: 0px;
}



/**********************************************************************
* Header styles                                                       *
**********************************************************************/
.header {
  /* Apply no styles here */
}

.header .content {
  padding-top:      60px;
  padding-bottom:   3px;
  z-index:          100;
  height:           125px;
}

.header .content a {
  color:           #999999;
  text-transform:  uppercase;
  text-decoration: none;
  font-size:       11px;
  margin:          0px 10px 0px 0px;
}

.header .content a:hover {
  color: #009BD6;
}

.header .content a.selected {
  color: #000000;
}

.header .sidebar {
  padding-top:      60px;
  padding-bottom:   3px;
  z-index:          100;
  height:           125px;
}

.header .sidebar a {
  color:           #000000;
  text-transform:  uppercase;
  text-decoration: none;
  font-size:       12px;
  letter-spacing:  3px;
}

.header .sidebar a:hover {
  color: #009BD6;
}



/**********************************************************************
* Page styles                                                         *
**********************************************************************/
.page {
  /* Apply no styles here */
}

.page a:hover {
  color: #009BD6;
}

.page .content {
  top:              0px;
  padding-bottom:   25px;
  padding-top:      150px;
  z-index:          99;
  min-height:       100%;
}

.page .sidebar {
  top:              0px;
  padding-bottom:   25px;
  padding-top:      150px;
  z-index:          99;
  min-height:       100%;
}



/**********************************************************************
* Footer styles                                                       *
**********************************************************************/
.footer {
  /* Apply no styles here */
}

.footer .content {
  height:   25px;
  bottom:   0px;
  z-index:  101;
  color:    #999999;
}

.footer .sidebar {
  height:   25px;
  bottom:   0px;
  z-index:  101;
  color:    #999999;
}



/**********************************************************************
* Background styles                                                   *
**********************************************************************/
.background {
  /* Apply no styles here */
}

.background .content {
  height: 100%;
}

.background .sidebar {
  height: 100%;
}



/**********************************************************************
* Layout styles                                                       *
**********************************************************************/
.fixed {
  position: fixed;
}

.absolute {
  position: absolute;
}

.left {
  float: left;
}

.right {
  float: right;
}

.content {
  padding-left:  10px;
  padding-right: 50px;
  
  background-color:      #FFFFFF;
  background-image:      url(/images/background-content.png);
  background-position:   top right;
  background-repeat:     repeat-y;
}

.sidebar {
  width:         357px;
  padding-left:  25px;
  padding-right: 5px;
  
  background-color:      #FFFFFF;
  background-image:      url(/images/background-sidebar.png);
  background-position:   top left;
  background-repeat:     repeat-y;
}

.shadow {
  background-image:  url(/images/shadow-top.png);
  background-repeat: repeat-x;
  width:    100%;
  height:   10px;
  z-index:  101;
  position: fixed;
}



/**********************************************************************
* Table styles                                                        *
**********************************************************************/
table.lined {
  width: 101%;
  position: relative;
  border-collapse: separate;
  left: -5px;
}

table.lined thead th {  
  font-weight: bold;
  padding: 0px 0px 9px 0px;
  text-align: left;
}

table.lined thead th:first-child {  
  min-width: 5px;
  width: 5px;
}

table.lined thead th:last-child {  
  min-width: 5px;
  width: 5px;
}

table.lined tbody td {
  cursor: pointer;
}

table.lined tbody td {  
  padding:    9px 0px 9px 0px;
  border-top: 1px solid #DDDDDD;
}

table.lined tbody tr:first-child td {  
  border-top: 1px solid #CCCCCC;
}

table.lined tbody td.hover {  
  background-color: #009BD6;
  color: #ffffff;
  border-top: 1px solid #009BD6 ! important;
}

table.lined tbody td:first-child {  
  border-top: 0px ! important;
  min-width: 5px;
  width: 5px;
}

table.lined tbody td:last-child {  
  border-top: 0px ! important;
  min-width: 5px;
  width: 5px;
}

table.lined tbody td.hover:first-child {  
  -webkit-border-top-left-radius: 3px;
  -webkit-border-bottom-left-radius: 3px;
  -moz-border-radius-topleft: 3px;
  -moz-border-radius-bottomleft: 3px;
  border-top-left-radius: 3px;
  border-bottom-left-radius: 3px;
}

table.lined tbody td.hover:last-child {  
  -webkit-border-top-right-radius: 3px;
  -webkit-border-bottom-right-radius: 3px;
  -moz-border-radius-topright: 3px;
  -moz-border-radius-bottomright: 3px;
  border-top-right-radius: 3px;
  border-bottom-right-radius: 3px;
}

table.lined tbody td p:last-child {  
  margin-bottom: 0px ! important;
}

table.lined tbody td a:last-child {  
  margin-bottom: 0px ! important;
}

table.lined tbody td a:hover {  
  color:inherit;
}



/**********************************************************************
* Publication styles                                                  *
**********************************************************************/
.publication {
  width:    127px;
  height:   300px;
  float:    left;
  margin:   0px 15px 0px 15px;
  position: relative;
  left:     -15px;
}

.publication img {
  margin: 0px 0px 6px 0px;
  width: 127px;
}



/**********************************************************************
* Series styles                                                       *
**********************************************************************/
.series {
  width:    200px;
  height:   240px;
  float:    left;
  padding:  10px 10px 0px 10px;
  margin:   0px 5px 15px 5px;
  position: relative;
  left:     -15px;
  top:      -5px;
  
  text-decoration: none;
  
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  border-radius: 3px;
}

.series.hover {
  background-color: #009BD6;
  color: #FFFFFF ! important;
}

.series img {
  margin: 0px 0px 6px 0px;
  width:  180px;
  height: 180px;
}



/**********************************************************************
* Photo styles                                                        *
**********************************************************************/
.photo {
  width:    200px;
  height:   290px;
  float:    left;
  padding:  10px 10px 0px 10px;
  margin:   0px 5px 15px 5px;
  position: relative;
  left:     -15px;
  top:      -5px;
  
  text-decoration: none;
  
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  border-radius: 3px;
}

.photo.hover {
  background-color: #009BD6;
  color: #FFFFFF ! important;
}

.photo img {
  margin: 0px 0px 6px 0px;
  width:  180px;
  height: 180px;
}



/**********************************************************************
* Selector styles                                                     *
**********************************************************************/
.selector {
  position: relative;
  left:     -5px;
  top:      -5px;
  width:    337px;
  
  padding: 5px 5px 5px 5px;
  margin-bottom: 3px;
  display: block;
  
  text-decoration: none;
  
  cursor: pointer;
  
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  border-radius: 3px;
}

.selector.disabled {
  cursor: default ! important;
  color:  #999999 ! important;
}

.selector.hover {
  background-color: #009BD6;
  color: #FFFFFF ! important;
}

.selector.selected {
  background-color: #009BD6;
  color: #FFFFFF;
}

.selector img {
  margin-right: 10px;
}

.selector h3 {
  margin-bottom: 4px;
}

.selector p {
  margin-bottom: 0px;
}

.selector table {
  margin-bottom: -5px;
}



/**********************************************************************
* Tag styles                                                          *
**********************************************************************/
.tag {
  position:  fixed;
  bottom:    25px;
  font-size: 10px;
  color:     #999999;
  z-index:   101;
}

.tag h3 {
  margin-bottom: 0px;
  font-size:     10px;
}

.tag span {
  margin-bottom: 4px;
  font-size:     10px;
}



/**********************************************************************
* Picture styles                                                      *
**********************************************************************/
#picture {
  cursor: pointer;
}

.picturelink.text {
  text-decoration:     none;
  background-image:    url(/images/background-textlink.png);
  background-repeat:   repeat-x;
  background-position: 0px 13px;
}

.picturelink.text:hover {
  text-decoration:     none;
  background-image:    url(/images/background-textlink-hover.png);
}

.picturelink.text.selected {
  text-decoration: none;
  /*background-color: #009BD6;
  color: #FFFFFF;*/
}

.picturelink.number {
  position: absolute;
  left:     -40px;
  color:    #999999;
  
  text-decoration: none;
  font-size: 10px;
  
  width:       41px;
  height:      19px;
  font-weight: bold;
  text-align: center;
  
  padding: 2px 0px 0px 5px;
}

.picturelink.number.selected {
  color: #FFFFFF;
  
  background-position: 0px -1px;
  background-image:    url(/images/background-picturelink.png);
}

.picturelink.number.selected.hover {
  color: #FFFFFF;
}

.picturelink.number.hover {
  color: #009BD6;
}

.picturelink.thumbnail {
  float:   left;
  width:   82px;
  height:  82px;
  padding: 5px 5px 5px 5px;
  
  position: relative;
  left: -5px;
  
  margin: 0px 3px 3px 0px;
  
  cursor: pointer;
  
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  border-radius: 3px;
}

.picturelink.thumbnail.selected {
  background-color: #009BD6;
}

.picturelink.thumbnail.hover {
  background-color: #009BD6;
}

.picturelink.thumbnail img {
  width:  72px;
  height: 72px;
}

.thumbnailcontainer {
  width: 350px;
}



/**********************************************************************
* Sidelink styles                                                     *
**********************************************************************/
.sidelinks {
  color: #999999;
  position: absolute;
  top: 158px;
}

.sidelinks a {
  text-decoration: none;
}

.sidelinks a:hover {
  color: #009BD6 ! important;
}

.sidelinks a.selected {
  color: #000000;
}

.sidebar .sidelinks {
  right: 8px;
}

.content .sidelinks {
  right: 50px;
}



/**********************************************************************
* Specific styles                                                     *
**********************************************************************/
#home .content h1 {
  letter-spacing: 3px;
  position:       absolute;
  text-align:     right; 
  right:          50px;
  top:            122px;
}

#home .content h2 {
  position:       absolute;
  text-align:     right; 
  right:          50px;
  top:            170px;
  font-size:      12px;
  font-weight:    normal;
  line-height:    150%;
}

#texts .content h3 {
  max-width: 480px;
  font-size: 14px;
}

#texts .content p {
  max-width: 480px;
}

#contact .content h3 {
  max-width: 440px;
  font-size: 14px;
}

#contact .content p {
  max-width: 440px;
}

#publications .content {
  padding-right: 10px;
}

#photography .content {
  padding-right: 10px;
}