/* threeCol.css */


/* siehe: http://wiki.jetztlab.de/index.php/Templates */

@media screen and (min-width:570px) and (orientation:portrait), screen and (min-width:700px) and (orientation:landscape) {

    /********************/
    /* CONTAINER STYLES */
    /********************/

    /* vertical lines */

    /* right */
    div.container .verticalLineContainerRight {
        position: absolute;
        left: 0px;
        width: 66.66667%;
        height: 100%;
        z-index: -1;
    }

    div.container .verticalLineRight {
        position: absolute;
        right: 0px;
        height: 100%;
        width: 6px;
        border-left: 1px solid black;
    }

    /* left */
    div.container .verticalLineContainerLeft {
        position: absolute;
        right: 0px;
        width: 66.66667%;
        height: 100%;
        z-index: -1;
    }

    div.container .verticalLineLeft {
        position: absolute;
        left: 0px;
        height: 100%;
        width: 6px;
        border-right: 1px solid black;
    }

    /* center */
    div.container .verticalLineCenter {
        position: absolute;
        right: 0px;
        width: 50%;
        height: 100%;
        border-left: 1px solid black;
    }

    /* outside left */
    div.container .verticalLineOutsideLeft {
        position: absolute;
        left: 0px;
        width: 20px;
        height: 100%;
        border-right: 1px solid black;
    }

    /* outside right */
    div.container .verticalLineOutsideRight {
        position: absolute;
        right: 0px;
        width: 20px;
        height: 100%;
        border-left: 1px solid black;
    }




    /*** Alle Container ***/

    div.container {
        position: relative;
    }

    /*** Alle Spalten ***/

    div.colum1,
    div.colum2,
    div.colum3 {
        float: left;
    }

    /*** Container Type: Eine Spalte ***/

    div.containerOneColum div.colum1 {
        width: 100%;
    }

    div.containerOneColum div.colum1 div.margin {
        margin: 0px 30px 0px 30px;
    }

    /*** Container Type: Zwei Spalten (2-1) ***/

    div.containerTwoColum2-1 div.colum1 {
        width: 66.66665%;
    }

    div.containerTwoColum2-1 div.colum2 {
        width: 33.33335%;
    }

    div.containerTwoColum2-1 div.colum1 div.margin {
        margin: 0px 17px 0px 30px;
    }

    div.containerTwoColum2-1 div.colum2 div.margin {
        margin: 0px 30px 0px 4px;
    }


    /*** Container Type: Zwei Spalten (1-2) ***/

    div.containerTwoColum1-2 div.colum1{
        width: 33.33335%;
    }

    div.containerTwoColum1-2 div.colum2{
        width: 66.66665%;
    }

    div.containerTwoColum1-2 div.colum1 div.margin {
        margin: 0px 4px 0px 30px;
    }

    div.containerTwoColum1-2 div.colum2 div.margin {
        margin: 0px 30px 0px 17px;
    }

    /*** Container Type: Zwei Spalten (1-1) ***/

    div.containerTwoColum1-1 div.colum1 {
        width: 50%;
        float: left;
    }

    div.containerTwoColum1-1 div.colum2 {
        width: 50%;
        float: left;
    }

    div.containerTwoColum1-1 div.colum1 div.margin {
        margin: 0px 10px 0px 30px;
    }

    div.containerTwoColum1-1 div.colum2 div.margin {
        margin: 0px 30px 0px 10px;
    }

    /*** Container Type: Drei Spalten ***/

    div.containerThreeColum div.colum1,
    div.containerThreeColum div.colum2,
    div.containerThreeColum div.colum3 {
        width: 33.33332%;
        float: left;
    }

    div.containerThreeColum div.colum1 div.margin {
        margin: 0px 4px 0px 30px;
    }

    div.containerThreeColum div.colum2 div.margin {
        margin: 0px 17px 0px 17px;
    }

    div.containerThreeColum div.colum3 div.margin {
        margin: 0px 30px 0px 4px;
    }

    /********************/
    /* PARAGRAPH STYLES */
    /********************/

    /* 2 Bilder mit Bildunterschrift */

    div.containerTwoColum1-2 div.colum2 div.zweiBilderMitBu div.pictureRightMargin {
        margin: 0px 0px 0px 11px;
    }

    div.containerTwoColum2-1 div.colum1 div.zweiBilderMitBu div.pictureRightMargin {
        margin: 0px 0px 0px 11px;
    }

    /* Bilder mit Bildunterschrift */

    div div.bildMitBuLinks,
    div div.bildMitBuRechts {
        position: relative;
    }

    div.bildMitBuRechts div.textContainer {
        position: absolute;
        bottom: 3px;
        right: 0px;
    }

    div.bildMitBuLinks div.textContainer {
        position: absolute;
        bottom: 3px;
        left: 0px;
    }

    div.bildMitBu .clear {
        display: none;
    }

    /* Bild mit Bildunterschrift links vom Bild */


    div.bildMitBuLinks div.pictureContainer,
    div.bildMitBuLinks div.textContainer {
        width: 50%;
        float: right;
    }

    div.containerOneColum div.bildMitBuLinks div.pictureContainer{
        float: right;
        width: 66.6665%;
    }

    div.containerOneColum div.bildMitBuLinks div.textContainer {
        width: 33.3332%;
    }

    div.bildMitBuLinks div.textContainer {
        text-align: right;
    }

    /* Bild mit Bildunterschrift rechts vom Bild */

    div.bildMitBuRechts div.pictureContainer,
    div.bildMitBuRechts div.textContainer {
        width: 50%;
        float: left;
    }

    div.containerOneColum div.bildMitBuRechts div.pictureContainer{
        float: left;
        width: 66.6665%;
    }

    div.containerOneColum  div.bildMitBuRechts div.textContainer {
        width: 33.3332%;
    }

    div.bildMitBuRechts div.textContainer {
        text-align: left;
    }


    /* containerTwoColum1-2 */

    div.containerTwoColum1-2 div.colum2 div.bildMitBuRechts div.pictureMargin {
        margin: 0px 10px 0px 0px;
    }

    div.containerTwoColum1-2 div.colum2 div.bildMitBuRechts div.textMargin {
        margin: 0px 0px 0px 11px;
    }

    div.containerTwoColum1-2 div.colum2 div.bildMitBuLinks div.pictureMargin {
        margin: 0px 0px 0px 10px;
    }

    div.containerTwoColum1-2 div.colum2 div.bildMitBuLinks div.textMargin {
        margin: 0px 11px 0px 0px;
    }


    /* containerTwoColum2-1 */

    div.containerTwoColum2-1 div.colum1 div.bildMitBuLinks div.pictureMargin {
        margin: 0px 0px 0px 10px;
    }

    div.containerTwoColum2-1 div.colum1 div.bildMitBuLinks div.textMargin {
        margin: 0px 11px 0px 0px;
    }

    div.containerTwoColum2-1 div.colum1 div.bildMitBuRechts div.pictureMargin {
        margin: 0px 10px 0px 0px;
    }

    div.containerTwoColum2-1 div.colum1 div.bildMitBuRechts div.textMargin {
        margin: 0px 0px 0px 11px;
    }

    /* containerOneColum */

    div.containerOneColum div.colum1 div.bildMitBuLinks div.pictureMargin {
        margin: 0px 0px 0px 7px;
    }

    div.containerOneColum div.colum1 div.bildMitBuLinks div.textMargin {
        margin: 0px 14px 0px 0px;
    }

    div.containerOneColum div.colum1 div.bildMitBuRechts div.pictureMargin {
        margin: 0px 7px 0px 0px;
    }

    div.containerOneColum div.colum1 div.bildMitBuRechts div.textMargin {
        margin: 0px 0px 0px 14px;
    }


    /********************/
    /* DIRECTORY STYLES */
    /********************/

    .directorySZMHead {
        margin: 37px auto 0px auto;
        width: 479px;
    }

    .directoryHeadline {
        margin: 29px 0px 18px 0px;
    }

    .directoryCover {
        margin: 0px 0px 8px 0px;
    }

    .directoryCoverText {
        margin: 0 0 7px 0;
    }

    .directoryText {
        margin: 31px 0 0 0;
    }

    .directoryCoverBottom {
        margin: 40px 0 0 0;
        line-height: 0;
    }

    .directoryHeadline2 {
        margin: 36px 0px 21px 0px;
    }

    .directoryText2 {
        margin: 0px 0px 11px 0px;
    }

    .directoryText img {
        position: relative;
        float: left;
        width: 122px;
        height: 122px;
        margin: 0 15px 0 0
    }


    /*****************/
    /* COMMON STYLES */
    /*****************/

    /* Abstaende fuer einspaltiges Layout deaktivieren */

    div.marginOneColum {
        display: none;
    }

    /* Allgemeine Text Settings */

    .indent {
        text-indent: 40px;
    }

    .showIn1ColumnOnly {
        display: none;
    }
    .showIn3ColumnOnly {
        display: block;
    }
}