/*
* Skeleton V1.2
* Copyright 2011, Dave Gamache
* www.getskeleton.com
* Free to use under the MIT license.
* http://www.opensource.org/licenses/mit-license.php
* 6/20/2012
*/


/* Table of Contents
==================================================
    #Base 960 Grid
    #Tablet (Portrait)
    #Mobile (Portrait)
    #Mobile (Landscape)
    #Clearing */



/* #Base 960 Grid
================================================== */

.container                                  { position: relative; width: 960px; margin: 0 auto; padding: 0; }
.container .column,
.container .columns                         { float: left; display: inline; margin-left: 10px; margin-right: 10px; }
.row                                        { margin-bottom: 20px; }

/* Nested Column Classes */
.column.alpha, .columns.alpha               { margin-left: 0; }
.column.omega, .columns.omega               { margin-right: 0; }

/* Base Grid */
.container .one.column,
.container .one.columns                     { width: 40px;  }
.container .two.columns                     { width: 100px; }
.container .three.columns                   { width: 160px; }
.container .four.columns                    { width: 220px; }
.container .five.columns                    { width: 280px; }
.container .six.columns                     { width: 340px; }
.container .seven.columns                   { width: 400px; }
.container .eight.columns                   { width: 460px; }
.container .nine.columns                    { width: 520px; }
.container .ten.columns                     { width: 580px; }
.container .eleven.columns                  { width: 640px; }
.container .twelve.columns                  { width: 700px; }
.container .thirteen.columns                { width: 760px; }
.container .fourteen.columns                { width: 820px; }
.container .fifteen.columns                 { width: 880px; }
.container .sixteen.columns                 { width: 940px; }

.container .one-third.column                { width: 300px; }
.container .two-thirds.column               { width: 620px; }

/* Offsets */
.container .offset-by-one                   { padding-left: 60px;  }
.container .offset-by-two                   { padding-left: 120px; }
.container .offset-by-three                 { padding-left: 180px; }
.container .offset-by-four                  { padding-left: 240px; }
.container .offset-by-five                  { padding-left: 300px; }
.container .offset-by-six                   { padding-left: 360px; }
.container .offset-by-seven                 { padding-left: 420px; }
.container .offset-by-eight                 { padding-left: 480px; }
.container .offset-by-nine                  { padding-left: 540px; }
.container .offset-by-ten                   { padding-left: 600px; }
.container .offset-by-eleven                { padding-left: 660px; }
.container .offset-by-twelve                { padding-left: 720px; }
.container .offset-by-thirteen              { padding-left: 780px; }
.container .offset-by-fourteen              { padding-left: 840px; }
.container .offset-by-fifteen               { padding-left: 900px; }



/* #Tablet (Portrait)
================================================== */

/* Note: Design for a width of 768px */

@media only screen and (min-width: 768px) and (max-width: 959px) {


    .container { width: 98%; margin-left: 2%; margin-right: 2%; }
    .main, .fusszeile { width: 98%!important; }
    .navigation {width: 100% !important; }
    .container .columns,
    .container .column { margin: 0; }


    .container .three.columns,
    .container .four.columns,
    .container .five.columns,
    .container .six.columns,
    .container .seven.columns,
    .container .eight.columns,
    .container .nine.columns,
    .container .ten.columns,
    .container .eleven.columns,
    .container .twelve.columns,
    .container .thirteen.columns,
    .container .fourteen.columns,
    .container .fifteen.columns,
    .container .sixteen.columns,
    .container .one-third.column,
    .container .two-thirds.column { width: 100%; }



    /*         Ausnahmen */

    .container .one.column,
    .container .one.columns {
        width: 20px;
        float: left;
    }

    .container .two.columns {
        width: 40px;
        margin: 0px;
        float:left;
        clear:both;
    }




    /* Offsets */
    .container .offset-by-one,
    .container .offset-by-two,
    .container .offset-by-three,
    .container .offset-by-four,
    .container .offset-by-five,
    .container .offset-by-six,
    .container .offset-by-seven,
    .container .offset-by-eight,
    .container .offset-by-nine,
    .container .offset-by-ten,
    .container .offset-by-eleven,
    .container .offset-by-twelve,
    .container .offset-by-thirteen,
    .container .offset-by-fourteen,
    .container .offset-by-fifteen { padding-left: 0; }

}




/* ANPASSUNGEN KOMPETENZAUFBAU
””””””””””””””””””””””””””””””””””””””””””””””””””””””””””””” */
@media only screen and (min-width: 768px) and (max-width: 959px) {

    html body div.container div.main div.twelve div.kompetenzaufbau div.komptitel div.querverweis_einleitung {width:66px; padding:0px; margin:0px;}

    html body div.container div.main div.twelve div.kompetenzaufbau div.komptitel div.kompetenztitel {max-width:524px;}

    html body div.container div.main div.twelve div.kompetenzaufbau div.kompetenzen_einleitung, .aufbauten_zwischentitel_erster, .aufbauten_zwischentitel_folgende {max-width:639px;}


    html body div.container div.main div.twelve div.kompetenzaufbau div.kompetenzen_einleitung_titel{max-width:589px;}

    html body div.container div.main div.twelve div.kompetenzaufbau div.aufbauten_zwischentitel_folgende {padding-top:36px;}


    html body div.container div.header div.header-right div.filter {max-width:360px;}

    html body div.container div.header div.header-right div.eight div.kanton, html body div.container div.header div.header-right div.eight div.zyklus {max-width:240px;}

    html body div.container div.header div.header-right div.eight div.kanton {margin-right:40px;}

    html body div.container div.header div.header-right div.suche {max-width:240px;}

    html body div.container div.header div.header-right div.eight div.omega div.border {border-right:none;}


    div.eight.columns.handlungsaspekt {
        width: 200px;
        float:left;
    }


    .two.columns.kompetenz_nr.alpha {
        text-align: left !important;
        width: 10px !important;
        vertical-align: top;
        margin-top: 10px;
        padding:0px !important;
    }

    .two.columns.kompetenz_nr.alpha p {
        /*margin:0px;
        padding:0px;*/
    }

    .kompetenzcode { width: 100%;
        float:left;
    }

    .kompetenzbereich.nine.columns {
        width: 80% !important;
    }

    div.navigation.three.columns.alpha {
        margin-bottom: 2em;
    }


    .kompetenztitel {
        width: 625px !important;
        margin-left: 15px;
        margin-top: 10px;
        padding: 0 5px 0 10px !important;
        float:left !important;
    }


    .komp_cell {
        display:table-cell !important;
        float:left;
        margin-bottom: -500px !important;
        padding-bottom: 500px !important;
    }


    .marker_z1, .marker_z2, .marker_z3 {
        width: 30px !important;
        /*height: 100px !important;*/
    }

    .marker_z12, .marker_z23 {
        height: 100% !important;
        width: 15px !important;
    }


    p.zycode { font-size: 25px !important;
        margin: 10px 2px 2px 2px !important;
        padding: 0px !important;

    }


    .marker_z1_op, .marker_z2_op, .marker_z3_op {
        width: 30px !important;
        height: 30px !important;
        padding:0px !important;
        border-bottom: 0px solid #fff;
    }


    .marker_z1_op img, .marker_z2_op img, .marker_z3_op img {
        margin: 0px 15px 0px 4px !important;
        padding:0px !important;
    }




    .eight.columns.komp_cell.kompetenz_text {
        width: 579px;
        margin-left: 10px;
        margin-top: 0px;
        padding: 0 10 0 10px !important;
        float:left !important;
    }

    .eight.columns.komp_cell.kompetenz_text ul {
        margin-top: 0px;
    }





    div.querverweis_einleitung {
        width:30px;
        padding:0px;
        float:right;
        padding-right: 10px !important;

    }


    p.querv {
        text-align: left;
        margin: 0 15px 0 5px;
        margin-top: 0px;
        font-size: 70%;
        line-height: 1.4em;
    }

    p.querv:before:first {
        content:"Querverweise: ";
    }


    .eight.offset-by-two.columns.aufbauten_zwischentitel {
        margin-top: 1em;
    }


    .komp_cell.kompetenz_querverw {
        width:30px;
        padding:0px;
        float:right;
        padding-left: 5px !important;
        padding-top: 5px !important;
        padding-right: 10px !important;

    }


    .komp_cell.kompetenz_querverw p.querv {
        text-align: left;
        margin: 0 0 0 0px;
        margin-top: 0px;
        font-size: 70%;
        line-height: 1.4em;
    }

    div.search.six.columns.offset-by-five.omega {
        float: left;
        clear:both;
        margin-top: 1em;
        margin-bottom: 0.5em;
    }
    html body div.container div.main div.twelve div.kompetenzaufbau div.komptitel div.querverweis_einleitung p.querv {padding-left:8px;}

    html body div.container div.main {margin-top:0px;}


    html body div.container div.header div.header-right div.border  {border-right:none;}

}

/* ”””””””””””””””””””””””””””””””””””””””””””””””””””””””””””””
ENDE ANPASSUNGEN KOMPETENZAUFBAU */














/*  #Mobile (Portrait)
================================================== */

/* Note: Design for a width of 320px */

@media only screen and (max-width: 767px) {

    .container { width: 98%; margin: 2%; }
    .main, .fusszeile { width: 98%; }
    .navigation {width: 100% !important; }
    .container .columns,
    .container .column { margin: 0; }


    .container .three.columns,
    .container .four.columns,
    .container .five.columns,
    .container .six.columns,
    .container .seven.columns,
    .container .eight.columns,
    .container .nine.columns,
    .container .ten.columns,
    .container .eleven.columns,
    .container .twelve.columns,
    .container .thirteen.columns,
    .container .fourteen.columns,
    .container .fifteen.columns,
    .container .sixteen.columns,
    .container .one-third.column,
    .container .two-thirds.column { width: 100%; }


    .container .one.column,
    .container .one.columns {
        width: 20px;
        float: left;
    }

    .container .two.columns {
        width: 40px;
        margin: 0px;
        float:left;
    }


    /* Offsets */
    .container .offset-by-one,
    .container .offset-by-two,
    .container .offset-by-three,
    .container .offset-by-four,
    .container .offset-by-five,
    .container .offset-by-six,
    .container .offset-by-seven,
    .container .offset-by-eight,
    .container .offset-by-nine,
    .container .offset-by-ten,
    .container .offset-by-eleven,
    .container .offset-by-twelve,
    .container .offset-by-thirteen,
    .container .offset-by-fourteen,
    .container .offset-by-fifteen { padding-left: 0; }

}

/* ANPASSUNGEN KOMPETENZAUFBAU
””””””””””””””””””””””””””””””””””””””””””””””””””””””””””””” */
@media only screen and (max-width: 767px) {


    div.eight.columns.handlungsaspekt {
        width: 200px;
        float:left;
    }
    html body div.container div.header div.header-right div.eight div.omega div.border {border-right:none;}

    div.querverweis_einleitung p.querv {padding-left:6px;}

    .two.columns.kompetenz_nr.alpha {
        text-align: left !important;
        width: 10px !important;
        vertical-align: top;
        margin-top: 10px;
        padding:0px !important;
    }

    .two.columns.kompetenz_nr.alpha p {
        margin:0px;
        padding:0px;
    }

    .kompetenzcode { width: 100%;
        float:left;
    }

    .nine.columns.kompetenzbereich.omega {
        width: 80% !important;
    }




    div.navigation.three.columns.alpha {
        margin-bottom: 2em;
    }


    div.kompetenztitel {
        width: 225px !important;
        margin-left: 15px;
        margin-top: 10px;
        padding: 0 5px 0 10px !important;
        float:left !important;
    }


    .komp_cell {
        display:table-cell !important;
        float:left;
        margin-bottom: -500px !important;
        padding-bottom: 500px !important;
    }


    .marker_z1, .marker_z2, .marker_z3 {
        width: 30px !important;
        height: 100px !important;
    }

    .marker_z12, .marker_z23 {
        height: 100% !important;
        width: 15px !important;
    }


    p.zycode { font-size: 25px !important;
        margin: 10px 2px 2px 2px !important;
        padding: 0px !important;

    }


    .marker_z1_op, .marker_z2_op, .marker_z3_op {
        width: 30px !important;
        height: 30px !important;
        padding:0px !important;
        border-bottom: 0px solid #fff;
    }


    .marker_z1_op img, .marker_z2_op img, .marker_z3_op img {
        margin: 0px 15px 0px 4px !important;
        padding:0px !important;
    }





    .eight.columns.komp_cell.kompetenz_text {
        width: 280px; !important;
        margin-left: 10px;
        margin-top: 0px;
        padding: 0 10 0 10px !important;
        float:left !important;
    }

    .nine.columns.komp_cell.kompetenz_text ul {
        margin-top: 0px;
    }





    div.querverweis_einleitung {
        width:20px;
        padding:0px;
        float:right;
        padding-right: 10px !important;
    }


    p.querv {
        text-align: left;
        margin: 0 15px 0 5px;
        margin-top: 0px;
        font-size: 70%;
        line-height: 1.4em;
    }

    p.querv:before:first {
        content:"Querverweise: ";

    }


    .nine.offset-by-two.columns.aufbauten_zwischentitel {
        margin-top: 1em;
    }


    .komp_cell.kompetenz_querverw {
        width:30px;
        padding:0px;
        float:right;
        padding-left: 5px !important;
        padding-top: 5px !important;

    }


    .komp_cell.kompetenz_querverw p.querv {
        text-align: left;
        margin: 0 15px 0 0px;
        margin-top: 0px;
        font-size: 70%;
        line-height: 1.4em;
    }


    div.search.six.columns.offset-by-five.omega {
        float: left;
        clear:both;
        margin-top: 1em;
        margin-bottom: 0.5em;
        width: 75%;
    }

    #search {
        width: 130px !important;
    }

    #submit {
        float:left;
        width: 60px !important;
    }



    html body div.container div.main div.twelve div.kompetenzaufbau div.kompetenzen_einleitung, .aufbauten_zwischentitel_erster, .aufbauten_zwischentitel_folgende {max-width:340px;}

    html body div.container div.main div.twelve div.kompetenzaufbau div.kompetenzen_einleitung_titel{max-width:290px;}

    .aufbauten_zwischentitel_folgende {padding-top:36px;}


}

/* ”””””””””””””””””””””””””””””””””””””””””””””””””””””””””””””
ENDE ANPASSUNGEN KOMPETENZAUFBAU */









/* #Mobile (Landscape)
================================================== */

/* Note: Design for a width of 480px */

@media only screen and (min-width: 480px) and (max-width: 767px) {
    .container { width: 480px; }
    .container .columns,
    .container .column { margin: 0; }

    .container .one.column,
    .container .one.columns,
    .container .two.columns,
    .container .three.columns,
    .container .four.columns,
    .container .five.columns,
    .container .six.columns,
    .container .seven.columns,
    .container .eight.columns,
    .container .nine.columns,
    .container .ten.columns,
    .container .eleven.columns,
    .container .twelve.columns,
    .container .thirteen.columns,
    .container .fourteen.columns,
    .container .fifteen.columns,
    .container .sixteen.columns,
    .container .one-third.column,
    .container .two-thirds.column,
    .navigation, .main         { width: 420px; }



    /*     Ausnahmen */

    .container .one.column,
    .container .one.columns {
        width: 20px;
        float: left;
    }

    .container .two.columns {
        width: 40px;
        margin: 0px;
        float:left;
    }

}




/* ANPASSUNGEN KOMPETENZAUFBAU
””””””””””””””””””””””””””””””””””””””””””””””””””””””””””””” */
@media only screen and (min-width: 480px) and (max-width: 767px) {


    div.nine.columns.handlungsaspekt {
        width: 200px;
        float:left;
    }


    .two.columns.kompetenz_nr.alpha {
        text-align: left !important;
        width: 10px !important;
        vertical-align: top;
        margin-top: 10px;
        padding:0px !important;
    }

    .two.columns.kompetenz_nr.alpha p {
        margin:0px;
        padding:0px;
    }

    .kompetenzcode { width: 100%;
        float:left;
    }

    .kompetenzbereich.ten.columns {
        width: 80% !important;
    }

    div.navigation.three.columns.alpha {
        margin-bottom: 2em;



    div.kompetenztitel {
        width: 1450px !important;
        margin-left: 15px;
        margin-top: 10px;
        padding: 0 5px 0 10px !important;
        float:left !important;
    }


    .komp_cell {
        display:table-cell !important;
        float:left;
        margin-bottom: -500px !important;
        padding-bottom: 500px !important;
    }


    .marker_z1, .marker_z2, .marker_z3 {
        width: 30px !important;
        height: 100px !important;
    }

    .marker_z12, .marker_z23 {
        height: 100% !important;
        width: 15px !important;
    }


    p.zycode { font-size: 25px !important;
        margin: 10px 2px 2px 2px !important;
        padding: 0px !important;

    }


    .marker_z1_op, .marker_z2_op, .marker_z3_op {
        width: 30px !important;
        height: 30px !important;
        padding:0px !important;
        border-bottom: 0px solid #fff;
    }


    .marker_z1_op img, .marker_z2_op img, .marker_z3_op img {
        margin: 0px 15px 0px 4px !important;
        padding:0px !important;
    }





    .nine.columns.komp_cell.kompetenz_text {
        width: 66%;
        margin-left: 10px;
        margin-top: 0px;
        padding: 0 10 0 10px !important;
        float:left !important;
    }

    .nine.columns.komp_cell.kompetenz_text ul {
        margin-top: 0px;
    }





    div.querverweis_einleitung {
        width:30px;
        padding:0px;
        float:right;
        padding-right: 10px !important;
    }


    p.querv {
        text-align: left;
        margin: 0 0 0 10px;
        margin-top: 0px;
        font-size: 70%;
        line-height: 1.4em;
    }

    p.querv:before:first {
        content:"Querverweise: ";
    }


    .nine.offset-by-two.columns.aufbauten_zwischentitel {
        margin-top: 1em;
    }


    .komp_cell.kompetenz_querverw {
        width:30px;
        padding:0px;
        float:right;
        padding-left: 5px !important;
        padding-top: 5px !important;
        padding-right: 10px !important;
    }


    .komp_cell.kompetenz_querverw p.querv {
        text-align: left;
        margin: 0 0 0 10px;
        margin-top: 0px;
        font-size: 70%;
        line-height: 1.4em;
    }


    .header-right.eleven.columns.offset-by-one omega {
        position: absolute;
        top: 99%
    }



}

/* ”””””””””””””””””””””””””””””””””””””””””””””””””””””””””””””
ENDE ANPASSUNGEN KOMPETENZAUFBAU */








/* #Clearing
================================================== */

/* Self Clearing Goodness */
.container:after { content: "\0020"; display: block; height: 0; clear: both; visibility: hidden; }

/* Use clearfix class on parent to clear nested columns,
or wrap each row of columns in a <div class="row"> */
.clearfix:before,
.clearfix:after,
.row:before,
.row:after {
    content: '\0020';
    display: block;
    overflow: hidden;
    visibility: hidden;
    width: 0;
    height: 0; }
.row:after,
.clearfix:after {
    clear: both; }
.row,
.clearfix {
    zoom: 1; }

/* You can also use a <br class="clear" /> to clear columns */
.clear {
    clear: both;
    display: block;
    overflow: hidden;
    visibility: hidden;
    width: 0;
    height: 0;
}