@charset "utf-8";
/* CSS Document */

// imports
@import "reset.less";
@import "settings.less";
@import "mixins.less";

/*----- custom global styles -----*/
body {
  color: #000; background: @bg_color url(../img/body_bg.gif) 0 0 repeat-x; 
  font-family: Arial, Verdana, Tahoma, sans-serif;
}
input { padding: 0 }
#wrapper { width: @wrapper_width; margin: 0 auto; position: relative; }
h1 { font-size: 210%; color: @fg_color; margin: 0 0 15px; font-weight: normal; }
h2 { font-size: 150%; color: @fg_color; margin: 0 0 10px; }
h3 { font-size: 110%; color: @fg_color; margin: 0 0 15px; }
p { line-height: 1.5; }
a { color: @fg_color_a; }
a:hover { text-decoration: none }
ul, ol { line-height: 1.7 }

/*----- custom global classes -----*/
.noscreen { display: none; visibility: hidden; }
.reseter { float: none; clear: both; }
.clear { overflow: hidden; width: 1px; height: 1px; clear: both; }
.left { text-align: left; }
.right { text-align: right; }
.f-l { float: left; }
.f-r { float: right; }
.last { margin: 0 !important; border: 0 !important; }
.i { font-style: italic; }
.red, .error { color: @red_color; }

/*----- HEADER -----*/
header {
  width: @wrapper_width - 2 * @wrapper_margin;
  height: @header_height;
  background: @header_bg url(../img/header_bg.jpg) 0 0 no-repeat;
  position: relative;
  #homepage a {
    display: block; width: @logo_width + @logo_left; height: @logo_height + @logo_top;
    span { display: none }
  }
  #lang {
    position: absolute;
    top: 200px;
    left: 23px;
    a {
      display: block;
      float: left;
      width: 26px;
      height: 20px;
      margin: 0 12px 0 0;
      span {
        display: none;
      }
    }
  }
}

/*----- CONTENT -----*/
#content {
  width: @wrapper_width - 2 * @wrapper_margin;
  background: transparent url(../img/content_bg.png) 0 0 repeat-y;
  overflow: hidden;
  padding: 40px 0 0;
  margin: 0 0 0 1px;
  input[type=text], input[type=password], textarea {
    background-color: #fff; border: 1px solid #d1d1d1;
    padding: 3px; margin: 0 0 5px; color: @fg_color;
  }
  input[type=submit] {
    background: #fff url(../img/login.png) 0 0 no-repeat; border: 0;
    color: #fff; font-weight: bold; font-size: 90%;
    width: 90px; height: 25px; line-height: 25px;
    &:hover { background-position: 0 -25px; }
  }
}

/*----- SECTION -----*/
#section {
  float: left; width: 700px;
  h3 { margin: 0 0 10px }
  p { margin: 0 0 10px }
  ul, ol { margin: 0 0 10px; padding: 0 0 0 35px; }
  #main {
    float: right;
    width: 480px;
  }
  #mainphotos {
    float: left;
    width: 155px;
    margin: 0 0 0 30px;
  }
  form {
    margin: 20px;
    th { vertical-align: top; padding: 3px 5px; text-align: right; }
    input[type=text], input[type=password], textarea {
      padding: 2px; margin: 2px; width: 230px;
    }
  }
  #fotogalerie {
    .column(210px, right);
    a {
      margin: 0 5px 3px 0;
    }
  }
  .fotogalerie a {
    text-decoration: none;
    margin: 0 10px 10px 0;
    padding: 0;
    display: block;
    float: left;
    img {
      border: 1px solid @fg_color;
      &:hover {        
        border: 1px solid #000;
      }
    }
  }
}

/*----- ASIDE -----*/
#aside {
  float: right; width: 185px; height: auto;
}

/*----- NAVIGATION -----*/
#nav {
  position: absolute; top: 200px; left: 80px;
  li {
    display: block; float: left;
    margin: 0; padding: 0;
    a {
      text-decoration: none;
      margin: 0 0 0 20px;
      display: block;
    }
  }
}

/*----- FOOTER -----*/
#footer {
  width: 100%;
  height: 200px;
  background: @bg_color url(../img/footer_bg.jpg) 0 0 no-repeat;
  color: @footer_color;
  p {
    padding: 15px 0 0 60px;
    overflow: hidden;
    a {
      display: block;
      float: left;
      margin: 0 100px 0 0;
      width: 200px;
      height: 80px;
      span {
        display: none;
      }
      &.last {
        margin: 0;
      }
    }
  }
}

/* End of CSS Document */