@font-face {
    font-family: 'noto';
    src: url('https://cc2.tv/NotoSans-Regular-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

A.blog {
    font-size:18pt;
    font-weight: normal;
    font-variant: small-caps;
    text-decoration: none;
    color: #8e3b04
}
a.blog:hover {
    color: #8e3b04;
    text-decoration: underline;
}

A {
    font-weight: normal;
    text-decoration: none;
    color: #8e3b04;
}
a:hover {
    color: #8e3b04;
    text-decoration: underline;
}
A.menu {
    font-weight: normal;
    text-decoration: none;
    color: #ffeeee;
    border-color:#cccc88;
    border-radius:4px;
    padding:5px;
    font-size:12pt;
}
a.menu:hover {
    color: #ffeeee;
    text-decoration: underline;
}
h1 {
    font-size:12pt;
    color:white;
    font-family:noto,sans-serif;
    font-weight:normal;
}
h2 {
    font-size:14pt;
    color:black;
    font-family:noto,sans-serif;
    font-weight:normal;
}
h3 {
    font-size:10pt;
    color:white;
    font-family:noto,sans-serif;
    font-weight:normal;
}
h4 {
    font-size:12pt;
    color:#aa0000;
    font-family:noto,sans-serif;
    font-weight:normal;
}
h5 {
    font-size:10pt;
    color:black;
    font-family:noto,sans-serif;
    font-weight:normal;
}

/* bildbox */
#titel {
    position:absolute; top:25px; left:0px; height:145px;
    width:100%;
    z-index:4;
    background-image:url(https://cc2.tv/titel2.jpg);
    }
    @media all and (min-width: 1px) and (max-width:1100px) {
        #titel {
            background-image:url(https://cc2.tv/titelm.jpg);
            position:absolute;
            left:0px;
            width:100%;
            top:0px;
            max-width:100%;
        }
     }

@media all and (min-width: 1101px) {
    #linksmobil {
    display:none;
    }
}

#derlink {
    position:fixed; top:0px; left:0px; height:24px; width: 100%;
    z-index:5;
    font-size:14pt; font-family:noto,sans-serif; color:#ffffff;
    font-variant: small-caps;
    line-height:1.3;
    background-color:#3d3344;
    border-bottom-color: #888888;
    border-bottom-width: 2px;
    border-bottom-style: solid;
}
@media all and (min-width: 1px) and (max-width:1100px) {
    #derlink {
        display:none;
    }

    #linksmobil {
        position:absolute;
        font-family: noto,sans-serif;
        line-height:2;
        top:0px;
        left:0px;
        /* height:300px; */
        width:96%;
        background-color:#3d3344;
        font-variant: small-caps;
        font-size:13pt;
        padding:2%;
    }
 }


/* spenden */
#box1 {
    position:absolute; top:180px; right:25px;
    z-index:2;
    border-radius:10px;
    font-size:10pt; background-color:#888888; color:#eeeeee; font-family:noto,sans-serif;
}
    @media all and (min-width: 1px) and (max-width:1100px) {
        #box1 {
            position:absolute;
            top:1100px;
            left:10%;
            width:80%;
        }
     }
    @media all and (min-width: 1234px) {
        #box1 {
            z-index:3;
            top:10px;
            position:fixed;
        }    
     }


/* Logobox */
#logo {
    position:absolute; top:25px; right:40px;
    font-size:12pt; color:#000000; font-family:noto,sans-serif;
    z-index:4; }
@media all and (min-width: 1px) and (max-width:1100px) {
    #logo {
        position:absolute;
        top:0px;
        right:5%;
    }
}


/* unbenutzt */
#box7 { border:solid 2px #d2cfbe; font-size:12pt; color:black; font-family:noto,sans-serif; font-weight:normal; background:#f2efde;}

/* Inhaltsbox */
#box4 {
    position:absolute;
    top:200px; left:30px; width:61%;
    z-index:1;
    font-family:noto,sans-serif;
    max-width:1200px;
}
@media all and (min-width: 1px) and (max-width:1100px) {
    #box4 {
        position:absolute;
        top:790px;
        left:1%;
        width:98%;
        max-width:98%;
    }
}


/* Linkbox */
#box5 {
    position:absolute;
    font-size:10pt; color:black; font-family:noto,sans-serif;
/*    border: solid 1px #bbbbbb;  */
    top:200px; right:25px; width:33%;
    z-index:1;
    border-radius:10px;
    }
    @media all and (min-width: 1px) and (max-width:1100px) {
        #box5 {
            position:absolute;
            top:130px;
            left:1%;
            width:98%;
        }
     }

#boxp {
    position:absolute;
    font-size:10pt; color:black; font-family:noto,sans-serif;
/*    border: solid 1px #bbbbbb;  */
    top:200px; right:10%; width:80%;
    z-index:1;
    border-radius:10px;
    }
    @media all and (min-width: 1px) and (max-width:1100px) {
        #boxp {
            position:absolute;
            top:130px;
            left:1%;
            width:98%;
        }
     }


/* Gruene Box */
#box6 { 
    position:absolute;
    font-size:12pt; color:black; font-family:noto,sans-serif;
    border: solid 1px #bbbbbb;
    top:30%; left:20%; width:70%; height:80%;
    background-color:#77aa77;
    z-index:2; }

/*body { background-color: #6655ff; } */
body {
    background-color: #183053;
    color:#ffffff;
    line-height: 1.5;
}

.block {
    color:#000000;
    border-bottom-color: #b8bf03;
    border-bottom-width: 1px;
    border-bottom-style: dotted;
    border-left-color: #bf9883;
    border-left-width: 0px; /* war 12 */
    border-left-style: solid;
    background-color:#f7f7f7;
    border-radius:20px;

    margin-bottom:10px;
    padding-top:42px;
    padding-bottom:62px;
    padding-right:55px;
    padding-left:62px;
}
@media all and (min-width: 1px) and (max-width:1100px) {
    .block {
        padding-right:25px;
        padding-left:20px;
    }
}

.rblock {
    color:#000000;
    border-right-color: #bf9883;
    border-right-width: 0px; /* war 12 */
    border-right-style: solid;
    background-color:#d7e2e6;
    border-radius:20px;

    margin-bottom:10px;
    padding-top:26px;
    padding-bottom:26px;
    padding-right:55px;
    padding-left:26px;
}


.rcblock {
    color:#000000;
    border-right-color: #bf9883;
    border-right-width: 0px; /* war 12 */
    border-right-style: solid;
    background-color:#d7e2e6;
    border-radius:20px;

    margin-bottom:10px;
    padding-top:26px;
    padding-bottom:26px;
    padding-right:55px;
    padding-left:26px;
}

.blockchen {
    border-width:0px;
    border-color: #000000;
    border-style: dashed;
    background-color:#e0e0ea;
    border-radius:0px;

    padding-top:10px;
    padding-bottom:10px;
    padding-right:20px;
    padding-left:26px;
}


hr {
  display:none;
  border:none;
  border-top:20px dotted #fff;
  color:#fff;
  background-color:#fff;
  height:1px;
  width:66%;
}


TABLE.norm { 
    width: 100%;
    border: solid 1px #bbbbbb;
    font-size:12pt; color:black; font-family:noto,sans-serif; font-weight:normal;
    background-color:#eeeeee;}

TABLE.unnorm {
    width: 100%;
    border: solid 1px #aa7777;
    font-size:12pt; color:black; font-family:noto,sans-serif; font-weight:normal;
    background:#b2ccff;}

/*@media all and (min-width: 1101px) {*/
@media all and (min-width: 1101px) {
    :target:before {
        content: "";
        display: block;
        visibility: hidden;
        margin: 90px 0 0;
        height: 90px;
    }
}

.bildfit {
    max-width:99%;
}

/* Mobiles Menu */
ul#mobimenu > li{
  list-style-type: none;
}

label{
  color:white;
  position: relative;
  display: block;
  padding: 0 0px 0 12px;
  margin-left: -20px;
  line-height: 3em;
  transition: background 0.3s;
  cursor: pointer;
}

label:after{
  content: "";
  position: absolute;
  display: block;
  top: 50%;
  right: 5px;
  width: 0;
  height: 0;
  border-top: 4px solid rgba(255,255,255,.5);
  border-bottom: 0 solid rgba(255,255,255,.5);
  border-left: 4px solid transparent;
  border-right: 4px solid transparent;
  transition: border-bottom .1s, border-top .1s .1s;
  }

label:hover,
input.mm:checked ~ label{background: rgba(0,0,0,.3);}

input.mm:checked ~ label:after{
  border-top: 0 solid rgba(255,255,255,.5);
  border-bottom: 8px solid rgba(255,255,255,.5);
  transition: border-top .1s, border-bottom .1s .1s;
}

/*hide the inputs*/
input.mm{display: none}

/*show the second levele menu of the selected voice*/
input.mm:checked ~ ul.submenu{
  max-height: 1200px;
  transition: max-height 0.5s ease-in;
}

/*style for the second level menu*/
ul.submenu{
  max-height: 0;
  overflow: hidden;
  list-style-type: none;
  transition: max-height 0.5s ease-out;
}


@media all and (min-width: 1px) and (max-width: 1100px) {
    .notblock {
        min-height: 120px;
    }
    .rcblock {
        display: none;
    }
}
@media all and (min-width: 1101px) {
    .notblock {
        display: none;
    }
}