/* HEADER */

#header {
    margin-left: auto;
    margin-right: auto;
    width: 778px;
    height: 152px;
}

#header h1 {
    padding-top: 45px;
    text-align: center;
}

/* NAVIGATION */

.navigation {
    position: relative;
    width: 100%;
}

.navigation ul {
    margin: 0;
}

#mainnav {
    float: left;
}

#sysnav {
    float: right;
}

.navigation ul li {
    float: left;
    margin-right: 13px;
    background-repeat: no-repeat;
}

.navigation ul li.last-child {
    margin-right: 0;
}

.lang-de .navigation ul li a {
    background-image: url('../../img/default/menu_de.png');
}

.lang-en .navigation ul li a {
    background-image: url('../../img/default/menu_en.png');
}

.navigation ul li span {
    display: none;
}

.navigation ul li a {
    display: block;
    height: 12px;
}

/* NAVIGATION REGULAR STATE */

.nav-studio38                                           { background-position: -7px -8px; }
.nav-work, .nav-referenzen                              { background-position: -7px -48px; }
.nav-contact, .nav-kontakt                              { background-position: -7px -88px; }
.nav-blog                                               { background-position: -7px -128px; }
.nav-back                                               { background-position: -7px -168px; margin-left: 13px; }
.nav-imprint, .nav-impressum                            { background-position: -7px -208px; }
.nav-lang-en, .nav-lang-de                              { background-position: -7px -248px; }

/* NAVIGATION HOVER/SELECTED STATE */

.nav-studio-38:hover, 
    .selected .nav-studio38                             { background-position: -7px -28px; }
.nav-work:hover, .nav-referenzen:hover, 
    .selected .nav-work, .selected .nav-referenzen      { background-position: -7px -68px; }
.nav-contact:hover, .nav-kontakt:hover,
    .selected .nav-contact, .selected .nav-kontakt      { background-position: -7px -108px; }
.nav-blog:hover,
    .selected .nav-blog                                 { background-position: -7px -148px; }
.nav-back:hover,
    .selected .nav-back                                 { background-position: -7px -188px;  margin-left: 13px; }
.nav-imprint:hover, .nav-impressum:hover,
    .selected .nav-imprint, .selected .nav-impressum    { background-position: -7px -228px; }
.nav-lang-en:hover, .nav-lang-de:hover,
    .selected .nav-lang-en, .selected .nav-lang-de      { background-position: -7px -268px; }

/* NAVIGATION ENGLISH */

.lang-en .nav-studio38                                  { width: 54px; }
.lang-en .nav-work                                      { width: 27px; }
.lang-en .nav-contact                                   { width: 43px; }
.lang-en .nav-blog                                      { width: 23px; }
.lang-en .nav-back                                      { width: 26px; }
.lang-en .nav-imprint                                   { width: 42px; }
.lang-en .nav-lang-de                                   { width: 43px; }
.lang-en .nav-lang-en                                   { width: 39px; background-image: url('../../img/default/menu_de.png') !important; }

/* NAVIGATION GERMAN */

.lang-de .nav-studio38                                  { width: 54px; }
.lang-de .nav-referenzen                                { width: 60px; }
.lang-de .nav-kontakt                                   { width: 44px; }
.lang-de .nav-blog                                      { width: 23px; }
.lang-de .nav-back                                      { width: 38px; }
.lang-de .nav-impressum                                 { width: 60px; }
.lang-de .nav-lang-en                                   { width: 39px; }
.lang-de .nav-lang-de                                   { width: 43px; background-image: url('../../img/default/menu_en.png') !important; }



/* CONTENT */

#content {
    width: 778px;
    height: 350px;
    clear: left;
    /*border-left: 40px solid #99b4a7;*/
    margin-left: auto;
    margin-right: auto;
    position: relative;
}

#placeholder_content {
    background: #e9efec;
    width: 100%;
    height: 100%;
    position: relative;
}

.start #placeholder_content {
    background-image: url('../../img/default/start.png');
    background-repeat: no-repeat;
}

.project-list #placeholder_content, .project-details #placeholder_content {
    white-space: nowrap;
    background: none;
}

.cms-plugin-filebrowser-image {
    display: inline-block;
    border-right: 14px solid white;
}

.cms-plugin-filebrowser-image.last-child {
    border-right: 0;
}

.cms-plugin-filebrowser-image a {
    display: block;
}

.project-list .cms-plugin-filebrowser-image img {
    margin-bottom: 28px;
}

#placeholder_content .cms-plugin-richtext {
    float: left;
    padding: 28px 14px 28px 14px;
    margin-right: 14px;
    width: 222px;
}

.skills #placeholder_content .cms-plugin-richtext {
    padding-top: 0;
}

#placeholder_content .cms-plugin-richtext p {
    margin-bottom: 14px;
}

.contact #placeholder_content .cms-plugin-richtext {
    height: 294px;
    margin-right: 0;
    border-right: 14px solid #fff;
}

.contact #placeholder_content .double-richtext .cms-plugin-richtext {
    height: 294px;
    margin-right: 0;
    width: auto;
    border-right: none;
}

.category-list #placeholder_content .cms-plugin-richtext h3 {
    margin-bottom: 14px;
}

#placeholder_content .cms-plugin-richtext.last-child {
    margin-right: 0;
}

#placeholder_content .cms-plugin-richtext h4 {
    margin-bottom: 0;
}

#placeholder_content .cms-plugin-headline {
    padding: 28px 14px 14px 14px;
}

/* DESCRIPTION */

#placeholder_description {
    clear: left;
    float: left;
    margin-top: 28px;
    margin-bottom: 50px;
    width: 778px;
    position: relative;
}

#placeholder_description .address,
#placeholder_description .phones,
#placeholder_description .web {
    width: 142px;
    float: left;
    margin-top: 24px;
    margin-left: 18px;
    line-height: 170%;
}

#placeholder_description .address {
    margin-left: 84px;
}

html>body #placeholder_description .address {
    margin-left: 167px;
}

/* SUBNAV */

ul.subnav {
    margin: 0;
    width: 250px;
    margin-right: 14px;
    float: left;
    text-transform: lowercase;
}

ul.subnav .selected a{
    color: #99b4a7;
}

.description-content {
    text-align: center;
}

.project-details .description-content {
    width: 778px;
}


/* SLIDING AREA */

.project-list.fx #placeholder_content .slider-container, .project-details.fx #placeholder_content .slider-container {
    position: absolute;
    left: 0;
}

#content .slider-nav {
    position: absolute;
    top: 0px;
    left: -40px;
    width: 40px;
    text-align: center;
}

#content .slider-nav img {
    cursor: pointer;
    padding: 170px 0;
    opacity: 0.5;
}

#content .slider-nav img:hover {
    opacity: 1;
}

#content .slider-nav .slider-nav-prev {
    padding-left: 5px;
}

#content .slider-nav .slider-nav-next {
    padding-right: 5px;
}


/* INTRO PAGE */

.start #placeholder_content {
    overflow: hidden;
}

.start #placeholder_content .cms-plugin-filebrowser-image {
    position: absolute;
    top: 0;
    left: 0;
    display: none;
    border-right: 0;
}