/**
 * "Yet Another Multicolumn Layout" - (X)HTML/CSS Framework
 *
 * (en) Uniform design of standard content elements
 *
 * @copyright       Copyright 2005-2010, Dirk Jesse
 * @license         CC-A 2.0 (http://creativecommons.org/licenses/by/2.0/),
 *                  YAML-C (http://www.yaml.de/en/license/license-conditions.html)
 * @link            http://www.yaml.de
 * @package         yaml
 * @version         3.2.1
 * @revision        $Revision:392 $
 * @lastmodified    $Date:2009-07-05 12:18:40 +0200 (So, 05. Jul 2009) $
 * @appdef yaml
 */
@media all {
    /**
  * Fonts
  *
  * (en) global settings of font-families and font-sizes
  *
  * @section content-global-settings
  */
    /* (en) reset font size for all elements to standard (16 Pixel) */
    html * {
        font-size: 100.01%;
    }

    /**
  * (en) reset monospaced elements to font size 16px in all browsers
  *
  * @see: http://webkit.org/blog/67/strange-medium/
  */
    /* (en) base layout gets standard font size 12px */
    body {
        font-family: 'Rosarivo', serif;
        font-size: 90.00%;
        letter-spacing: 1.25px;
    }

    #indexornament img {
        height: 120px;
        width: 120px;
    }

    .bodyindex {
        background-color: #fff;
    }

    .bodymainmenu {
        background-color: #fff;
        text-align: center;
    }

    body.mmenu {
        background-color: #fff;
        text-align: center;
        background: url('images/mm-large.jpg');
        background-size: cover;
        background-repeat: no-repeat;
    }

    .bodywork {
        background-color: #fff;
        margin: 0 0 0 0px;
        padding: 0;
        /* text-align: center; */
    }

    .bodyarticles {
        background-color: #fff;
    }

    .bodybiography {
        background-color: #fff;
    }

    .bodycv {
        background-color: #fff;
    }

    .bodycontact {
        background-color: #fff;
        margin-top: 4em;
    }

    .bodylinks {
        background-color: #fff;
    }

    /*--- Headings | berschriften ------------------------------------------------------------------------*/
    h1,h2,h3,h4,h5,h6 {
        font-weight: 300;
        font-style: normal;
    }

    #pagetitle {
        margin: 40px auto 0 auto;
        width: 246px;
        text-align: center;
    }

    div#pagetitle h1 {
        font-size: 110%;
        margin: 20px 0 40px 0;
        font-weight: 100;
        border: 0px solid #222;
        border-width: 0 0 1px 0;
        border-style: solid;
        font-style: normal;
        padding-bottom: 10px;
    }

    original-h1.pagetitle {
        /* width: 246px; */
        /* text-align: center; */
        font-size: 110%;
        margin: 30px auto 20px auto;
        font-weight: 100;
        border: 1px solid #CCAABC;
        border-width: 0 0 1px 0;
        border-style: dotted;
        /* font-style: italic; */
        padding-bottom: 10px;
    }

    h1.pagetitle {
        /* width: 246px; */
        /* text-align: center; */
        font-size: 110%;
        margin: 30px 10px 20px 0;
        font-weight: 100;
        border: 1px solid #eee;
        border-width: 1px 0 1px 0;
        border-style: solid;
        /* font-style: italic; */
        padding: 5px 14px;
        display: inline-block;
        color: #ccc;
    }

    .projects h1 {
        margin-top: 30px;
    }

    body.bodywork h1.pagetitle {
        margin: 20px 0 0px 0;
        border: 0;
        font-weight: 600;
        padding: 0;
        color: #333;
    }

    hr.divider {
        padding: 0;
        border: none;
        border-top: 1px solid #777;
        /* color: #ccc; */
        text-align: center;
        width: 38%;
        margin: 2em auto .25em auto;
    }

    /* --- Lists | Listen  -------------------------------------------------------------------------------- */
    ul {
        list-style-type: none;
        margin: 0;
        padding: 0;
    }

    ul a {
        text-decoration: none;
        color: #000;
    }

    div#mainmenu ul {
        margin: 0;
        padding: 0;
    }

    li {
        margin-left: 0;
    }

    ul.cvli li {
        padding-left: 15px;
    }

    /* deprecate
li.menu {
	font-size:125.00%;
	line-height:4em;
	letter-spacing:1.5px;
}
*/
    ul.menu li {
        font-size: 100.00%;
        padding-top: 2em;
    }

    ul.menu li img {
        padding-top: 2em;
    }

    div#articlemenu ul li {
        font-size: 98.00%;
        line-height: 2.83em;
        letter-spacing: 0.5px;
    }

    /* --- specific IDs and Classes, in the order of their appearance in the site  -------------------------------------------------------------------------------- */
    /* vertically centering content works on the specific element not container? */
    #indexornament img {
        margin: auto;
        position: absolute;
        top: 0;
        left: 0;
        bottom: 0;
        right: 0;
    }

    .bodycontact #content {
        width: 300px;
        height: 300px;
        position: absolute;
        left: 50%;
        top: 50%;
        margin-left: -150px;
        margin-top: -150px;
    }

    #mainmenu {
        width: 300px;
        height: 300px;
        position: absolute;
        left: 50%;
        top: 40%;
        margin-left: -150px;
        margin-top: -200px;
    }

    #menutitle {
        padding-top: 4em;
    }

    #workbooktitle {
        padding-top: 6em;
    }

    #workcarnaltop {
        padding-top: 10em;
    }

    #workmain, #projects {
        padding: 0 -30px;
        margin: 0 auto;
        width: 100%;
        border: 0px solid red;
    }

    .workbook, projects {
        /* margin-bottom: 46px; */
        /* text-align: right; */
        clear: both;
    }

    .workbook.ck {
        /* clear: both; */
        margin-top: 100px;
    }

    .workbyline {
        /* padding-top: 1.5em; */
        font-size: 80%;
        letter-spacing: 1px;
        line-height: 1.5;
        margin: 65px 0 0 15px;
        /* display: inline-block; */
        clear: both;
        text-align: left;
        padding-right: 20px;
    }

    .arrowheight {
        padding-top: 0;
    }

    .leftarrow {
        text-align: right;
    }

    .rightarrow {
        text-align: left;
    }

    #workornament {
        padding-top: 3em;
        margin-bottom: 3em;
        /* width:380px; */
        /* padding-left: 60px; */
    }

    #indexornament img, #biographyornament img, #cvornament img, #articleornament img, #carnalornament img, #projectornament img, #workornament img {
        opacity: 1;
        transition: all 0.2s linear;
        -moz-transition: all 0.2s linear;
        -webkit-transition: all 0.2s linear;
        -o-transition: all 0.2s linear;
    }

    #indexornament img:hover, #biographyornament img:hover, #cvornament img:hover, #articleornament img:hover, #carnalornament img:hover, #projectornament img:hover, #workornament img:hover {
        opacity: .6;
        transition: all 0.2s linear;
        -moz-transition: all 0.2s linear;
        -webkit-transition: all 0.2s linear;
        -o-transition: all 0.2s linear;
    }

    #projectornament {
        padding-top: 3em;
        margin-bottom: 3em;
        clear: both;
    }

    #carnalornament {
        padding-top: 3em;
        padding-bottom: 2em;
        width: 380px;
        padding-left: 175px;
    }

    #at_rest_title {
        padding-top: 6em;
        padding-bottom: 2em;
    }

    #at_rest_video {
    }

    #at_rest_ornament {
        padding-top: 2em;
        padding-bottom: 2em;
    }

    #articletitle {
        padding-top: 5.6em;
    }

    #articlemenu {
        padding-top: 1.8em;
    }

    #articleornament {
        padding-top: 2em;
        padding-bottom: 2em;
    }

    #linktitle {
        padding-top: 12em;
    }

    #linkmenu {
        padding-top: 1.8em;
    }

    #linkornament {
        padding-top: 2em;
        padding-bottom: 2em;
    }

    #titlebiography {
        padding-top: 12em;
    }

    #biography {
        padding-top: 2.8em;
        font-size: 102.00%;
        padding-left: 10px;
        padding-right: 10px;
    }

    #biography p {
        line-height: 1.36;
        margin: 0 0 0 0;
        padding-bottom: 1.7em;
        text-align: left;
        letter-spacing: 0.2px;
    }

    #bio_viewcv {
        padding-top: 1.5em;
    }

    #biographyornament {
        padding-top: 4em;
        padding-bottom: 2em;
    }

    #cvtext {
        padding-top: 5em;
        text-align: left;
        font-size: 105%;
        letter-spacing: .5px;
        line-height: 1.75;
    }

    #cvtext h1 {
        color: #000;
        padding-bottom: 1em;
        padding-left: 0;
    }

    .cvtable {
        width: 100%;
        padding-left: 0;
    }

    .cvtable td {
        vertical-align: top;
    }

    .year {
        width: 8%;
    }

    .divider {
        padding-top: 2em;
        padding-bottom: 0em;
        text-align: center;
    }

    #cvornament {
        padding-top: 5em;
        padding-bottom: 2em;
    }

    /*old and delete*/
    #contact {
        padding-top: 17.8em;
    }

    /*old and delete*/
    #contact-title {
        padding-top: 17.8em;
    }

    #contact-text {
        padding-top: 3em;
    }

    #contact-text p {
        line-height: 1.36;
        margin: 0 0 0 0;
        padding-bottom: 1.7em;
        text-align: center;
        letter-spacing: 0.2px;
    }

    #contact-email {
        padding-top: 2.5em;
    }

    #contactornament {
        padding-top: 5em;
        padding-bottom: 2em;
    }

    /* --- general text formatting | Allgemeine Textauszeichnung ------------------------------------------ */
    strong,b {
        font-weight: bold;
    }

    em,i {
        font-style: italic;
    }

    /*--- Links ----------------------------------------------------------------------------------------- */
    a {
        color: #000;
        text-decoration: none;
    }

    a:visited {
        color: #000;
    }

    /* (en) maximum constrast for tab focus - change with great care */
    a:focus {
        text-decoration: none;
        color: #000;
        outline: 2px #f93 solid;
    }

    a:active {
        text-decoration: none;
        outline: 0 none;
    }

    a:hover {
        color: #aaa;
        text-decoration: none;
    }

    /*--- Works ----------------------------------------------------------------------------------------- */
    div.cover {
        float: left;
        margin: 0 23px 0 0px;
    }

    img.cover {
        /* margin-left: -13px; */
    }

    div.thumbs {
        /* text-align: right; */
        /* overflow: hidden; */
    }

    .projects div.thumbs {
        text-align: left;
    }

    div.clear {
        clear: both;
    }

    div.thumbs-col {
        -moz-column-count: 5;
        /* Firefox */
        -webkit-column-count: 5;
        /* Safari and Chrome */
        column-count: 5;
    }

    /*
Use to finnesse
*/
    .thumbs img {
        height: 148px;
        width: auto;
        /* padding: 22px; */
    }

    .stills img {
        height: 160px;
        width: auto;
        padding: 22px;
    }

    .covers {
        margin-top: 40px;
    }

    .covers img {
        margin: 0px 40px 40px;
        opacity: 1;
    }

    .covers img:hover {
        opacity: .6;
        transition: all 0.2s linear;
        -moz-transition: all 0.2s linear;
        -webkit-transition: all 0.2s linear;
        -o-transition: all 0.2s linear;
    }

    .projects .thumbs img {
        text-align: center;
    }

    .crop {
        /* float: left; */
        /* width: 180px; */
        /* height: 150px; */
        /* overflow: hidden; */
        margin: 40px 16px 51px;
        display: inline-block;
        vertical-align: top;
    }

    .projects div.crop {
        /* float: left; */
        /* width: 180px; */
        /* height: 150px; */
        margin: 20px 20px 20px 20px;
        text-align: center;
    }

    .portraits div {
        border: 0px solid red;
    }

    .portraits div.crop span {
        display: block;
        border: 0px solid blue;
        margin-bottom: 5px;
    }

    .projects div.portraits .crop {
        width: 390px;
        clear: both;
        margin: 20px 0 40px 0;
        text-align: left;
        text-wrap: none;
    }

    .projects div.portraits div.crop.wide {
        width: 800px;
        clear: both;
        margin: 20px 0 40px 0;
        text-align: left;
        text-wrap: none;
    }

    .projects div.portraits .crop img {
        margin: 0px 5px 0 5px;
        display: inline-block;
        text-align: center;
    }

    .crop img.cover {
        height: 180px;
    }

    .crop img.s {
        height: 180px;
    }

    .crop img.sz {
        height: 160px;
    }

    .thumbs .crop:nth-child(4n) {
        /* clear: left; */
    }

    .bodywork #main {
        width: 1000px;
        /* text-align: center; */
        margin: 0px auto;
        /* padding: 0; */
    }

    /*
.crop img.cover:hover {
    height: 330px;
    position: relative;
    top: 0;
    bottom: 0;
    background: white;
    border: 60px solid white;
}
*/
    .projects h6 {
        margin: 50px 0 10px 0;
        /* text-align: center; */
        display: inline-block;
    }

    .thumbs span {
        font-size: 11px;
        display: block;
        margin: 0px 0 10px 0;
    }

    table.cvtable td {
        padding-bottom: 5px!important;
    }

    .portraits {
        margin: 0 10px;
        /* width: 400px; */
    }

    /* Smartphones (portrait and landscape)  - - - - - - - - -  */
    @media only screen and (min-width : 320px) and (max-width : 480px) {
        /* Styles */ .stills img {
            height: auto;
            width: calc(30% - 10px);
            padding: 8px;
        }

        .covers img {
            margin: 0px 0px 20px;
            height: auto;
            width: calc(50% - 40px);
            padding: 8px;
        }

        /**
 * css for mobile devices
 */
        body {
            -webkit-text-size-adjust: 100%;
        }

        .bodywork {
            background-color: #fff;
            margin: 0 auto;
            padding: 0px;
            /* text-align: center; */
        }

        #indexornament {
            padding-top: 12em;
            padding-bottom: 2em;
        }

        #menutitle {
            padding-top: 3em;
        }

        #mainmenu {
            padding-top: 1em;
            padding-bottom: 2em;
        }

        li.menuimg {
            padding-top: 1.1em;
        }

        #at_rest_ornament {
            padding-top: 4em;
            padding-bottom: 2em;
        }

        #articletitle {
            padding-top: 3em;
        }

        #articlemenu {
            padding-top: 1.8em;
        }

        #articleornament {
            padding-top: 2em;
            padding-bottom: 2em;
        }

        #linktitle {
            padding-top: 3em;
        }

        #linkmenu {
            padding-top: 1.8em;
        }

        #linkornament {
            padding-top: 2em;
            padding-bottom: 2em;
        }

        #titlebiography {
            padding-top: 3em;
        }

        #biography {
            padding-top: 1.8em;
            padding-left: 1.5em;
            padding-right: 1.5em;
        }

        .page_margins_cv, .page_margins_biography {
            width: 90%;
        }

        #cvtext {
            padding-top: 3em;
            font-size: 135%;
            padding-right: 1.5em;
        }

        .divider {
            padding-left: 1.5em;
        }

        #contact {
            padding-top: 7em;
        }

        #contactornament {
            padding-top: 3em;
            padding-bottom: 2em;
        }

        #workmain {
            /* padding: 0; */
            /* margin: 0 3px; */
        }

        .workbyline {
            /* padding-top: 1.5em; */
            font-size: 80%;
            letter-spacing: 1px;
            line-height: 1.5;
            margin: 15px 0 0 20px;
            /* display: inline-block; */
            /* float: left; */
            text-align: left;
        }

        .thumbs img {
            height: 100px;
            /* width: auto; */
            /* padding: 22px; */
        }

        div.thumbs {
            /* text-align: left; */
            /* overflow: hidden; */
        }

        .ck .thumbs img {
            /* height: 80px; */
            /* width: auto; */
            /* padding: 22px; */
        }

        .crop, .projects div.crop {
            /* float: left; */
            width: 140px;
            height: 139px;
            /* overflow: hidden; */
            margin: 15px 20px 0px 20px;
            /* padding: 2px; */
            display: inline-block;
        }

        .crop img.cover {
            height: 100px;
        }

        .crop img.s {
            height: 120px;
        }

        .ck .crop img.cover {
            height: 115px;
        }

        .ck .crop img.s {
            /* height: 108px; */
        }

        div.clear {
            display: none;
        }

        .bodywork #main {
            width: 100%;
            text-align: center;
            margin: 30px 0px;
            /* padding: 0; */
        }

        .bodywork #main #projects {
            margin: 15 px 10px;
        }

        #workornament {
            padding-top: 3em;
            padding-bottom: 2em;
            clear: both;
            /* width:380px; */
            /* padding-left: 60px; */
        }

        .workbook .projects {
            margin-bottom: 43px;
            /* text-align: right; */
            clear: both;
        }

        #workornament img {
            height: 110px;
            width: auto;
        }

        #projectornament img {
            height: 100px;
            width: auto;
        }

        #projectornament {
            padding-top: 8em;
            padding-bottom: 0em;
        }

        .projects h6 {
            margin: 30px 10px 30px 10px;
            /* text-align: center; */
            display: inline-block;
            font-size: 90%
        }

        .projects h6 br {
            display: none;
        }

        .crop img.sz {
            height: 100px;
        }

        #cvtext {
            padding-top: 5em;
            text-align: left;
            font-size: 100%;
            letter-spacing: .5px;
            line-height: 1.75;
            margin: 5px 10px;
            width: 95%;
        }

        .year {
            padding-right: 5px;
        }

        .projects h1 {
            clear: both;
        }

        .projects div.portraits .crop {
            width: 95%;
            clear: both;
            margin: 20px 0 20px 0;
            text-align: center;
            text-wrap: none;
        }

        .projects div.portraits .crop img {
            margin: 5px 5px 0 5px;
            display: inline-block;
            text-align: center;
        }
    }

    /* Smartphones (landscape)  - - - - - - - - -  */
    @media only screen and (min-width : 321px) and (max-width : 1024px) {
        /* Styles */ .portraits {
            margin: 0 auto;
            width: 380px;
        }
    }

    /* Smartphones (portrait)  - - - - - - - - -  */
    @media only screen and (max-width : 320px) {
        /* Styles */ .portraits {
            margin: 0 auto;
            width: 300px;
        }
    }

    /* Tablets (portrait and landscape)  - - - - - - - - -  */
    @media only screen and (min-width : 768px) and (max-width : 1024px) {
        /* Styles */ .bodywork #main {
            width: 100%;
        }

        .portraits {
            margin: 0 20px;
            /* width: 420px; */
        }

        .crop {
            /* float: left; */
            /* width: 180px; */
            /* height: 150px; */
            /* overflow: hidden; */
            margin: 40px 20px 51px;
            display: inline-block;
            vertical-align: top;
        }

        .crop img.s {
            height: 140px;
        }

        .crop img.sz {
            height: 100px;
        }

        .thumbs img {
            height: 100px;
            width: auto;
            /* padding: 22px; */
        }

        .stills img {
            height: 150px;
            width: auto;
            padding: 15px;
        }
    }

    /* Tablets (landscape)  - - - - - - - - -  */
    @media only screen and (min-width : 768px) and (max-width : 1024px) and (orientation : landscape) {
        /* Styles */
    }

    /* Tablets (portrait)  - - - - - - - - -  */
    @media only screen and (min-width : 768px) and (max-width : 1024px) and (orientation : portrait) {
        /* Styles */
    }

    /* iPad 3 - - - */
    @media only screen and (min-width : 768px) and (max-width : 1024px) and (orientation : landscape) and (-webkit-min-device-pixel-ratio : 2) {
        /* Styles */
    }

    @media only screen and (min-width : 768px) and (max-width : 1024px) and (orientation : portrait) and (-webkit-min-device-pixel-ratio : 2) {
        /* Styles /
}

/* Desktops and laptops  - - - - - - - - -  */@media only screen and (min-width : 1224px) {
            /* Styles */
        }

        /* Large screens  - - - - - - - - -  */
        @media only screen and (min-width : 1824px) {
            /* Styles */
        }

        /* iPhone 4  - - - - - - - - -  */
        @media only screen and (min-width : 320px) and (max-width : 480px) and (orientation : landscape) and (-webkit-min-device-pixel-ratio : 2) {
            /* Styles */
        }

        @media only screen and (min-width : 320px) and (max-width : 480px) and (orientation : portrait) and (-webkit-min-device-pixel-ratio : 2) {
            /* Styles */
        }