
/* For mobile phones: */
[class*="col-"] {
    float: left;
    width: 100%;    
}         

@media only screen and (max-width:550px) {
    html { font-size: 80%; }
}

@media only screen and (min-width: 768px) {
    /* For desktop: */
    .col-mainnavilayer {width: 30%;}
    .col-mainlayer {width: 69%;}
    html { font-size: 90%; }
}    


@media only screen and (min-width: 900px) {
    /* For desktop: */
    .col-mainnavilayer {width: 27%;}
    .col-mainlayer {width: 72%;}
    html { font-size: 90%; }
}    


@media only screen and (min-width: 1200px) {
    /* For desktop: */
    .col-mainnavilayer {width: 25%;}
    .col-mainlayer {width: 74%;}
    html { font-size: 80%; }
}    

@media only screen and (min-width: 1440px) {
    /* For desktop: */
    .col-mainnavilayer { width: 21%; }
    .col-mainlayer { width: 63%; }
    .col-mainlinklayer { width: 15%; }
    html { font-size: 100%; }
}

@media only screen and (min-width: 1680px) {
    /* For desktop: */
    .col-mainnavilayer { width: 21%; }
    .col-mainlayer { width: 63%; }
    .col-mainlinklayer { width: 15%; }
    html { font-size: 100%; }
}


body {
    /*background: #E5EAEC; */
    background: #F4F4F4;
    font-family: Open Sans, Verdana, Arial, Helvetica, sans-serif;
}
       
.row::after {
    content: "";
    clear: both;
    display: table;
}
                               
.row {
    padding-top: 5px;
    padding-bottom: 5px;
}

                                                                          
img
{  
    border-style: none;
}

.mainpage {
    /* width: 80%; */
    background-color: #FFFFFF;
    visibility: visible;
}

.mainbody {

}
 
.col-mainlayer {
    padding: 2px 2px;
    background-color: #FFFFFF;
    /* box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24);
   )border: 1px solid #000000;  */
}

.col-mainlayer_scroll {
    padding: 2px 2px;
    background-color: #FFFFFF;
    /* box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24);
      )border: 1px solid #000000;  */
}

.shopcart {
    background-color: #9A9A9A;
    background-repeat: no-repeat;
    font-weight: bold;
    text-align: left;
    border: 0px solid #AAAAAA;  
}


.maintophistory {
    padding: 10px;
    float:left;
    width: calc(100% - 20px);
    height: 20px;
    background: #2288BB; /* Old browsers */
    background: -moz-radial-gradient(center, ellipse cover, #2288BB 0%, #006699 100%); /* FF3.6-15 */
    background: -webkit-radial-gradient(center, ellipse cover, #2288BB 0%,#006699 100%); /* Chrome10-25,Safari5.1-6 */
    text-align:left;
}

.mainbottomhistory {
    padding: 10px;
    float:left;
    text-align:center;
    width: calc(100% - 20px);
    height: 20px;
    background: #2288BB; /* Old browsers */
    background: -moz-radial-gradient(center, ellipse cover, #2288BB 0%, #006699 100%); /* FF3.6-15 */
    background: -webkit-radial-gradient(center, ellipse cover, #2288BB 0%,#006699 100%); /* Chrome10-25,Safari5.1-6 */
}

.splitline {
    top:152px;
    height:28px;
    width:100%;
    background: url('/images/linie_braun01.png') repeat-x;
    text-align: center;
}

.splitline_page {
    background: url('/images/linie_braun02.png') no-repeat;
}

/************************************************/
/* Maintop - Runde Ecken im Content Bereich *****/
/************************************************/

.eventlayer {
    background-color: #CACACA;
    z-index:0;
    overflow:hidden;
}


/************************************************/
/* Maintop - Runde Ecken im Content Bereich *****/
/************************************************/


.header {
    width:100%;
    text-align:center;
    background: #FFFFFF url('../../images/head_back.png') repeat-x;
    visibility: visible;
}


.footer {
    text-align:center;
    background: #006699 url('../../images/head_back.png') repeat-x;
    visibility: visible;
}

/************************************************/
/* Maintop - Runde Ecken im Content Bereich *****/
/************************************************/

.topbanner1 {
    width: 40%;
    float: left;
    text-align: center;
    vertical-align: center;
}
 
 .topbanner1 img {
    width: 60%; 
 }
 
 .topbanner2 {
     width: 60%;
     float: right;
     text-align: right;
     height:auto; 
 }

 .topbanner2 img {
    width: 100%; 
 }



/************************************************/
/* Mainmenu - Runde Ecken im Content Bereich *****/
/************************************************/

.mainbuttonmenu {
    width: 100%;
    text-align: center;
    background: #3092c0;
    background-image: linear-gradient(to bottom, #3298c8, #2e8cb8);
    z-index:1;
}

/************************************************/
/* Navimenu Layer - Runde Ecken im Content Bereich *****/
/************************************************/

/************************************************/
/* Navimenu Layer - Runde Ecken im Content Bereich *****/
/************************************************/

.col-mainnavilayer {
  float:left;
  z-index:1;
  /* )border: 1px solid #000000;  
  box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 3px 5px rgba(0,0,0,0.24); */
}

.navimenu {
    font-size: 11px;
    visibility: visible;
    background: #F4F4F4;
}

/************************************************/
/* Mainmenu - Runde Ecken im Content Bereich *****/
/************************************************/

.mainmenu {
    background: transparent;
    visibility: visible;
    z-index:0;
}


/************************************************/
/* MainLinkLayer - Runde Ecken im Content Bereich *****/
/************************************************/

.col-mainlinklayer {
    float:right;
      /* )border: 1px solid #000000;  
    box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24); */
}

.aside {
    text-align: left;
    color: #ffffff;
}

/*****************************************************/
/* Maincalendar - Runde Ecken im Content Bereich *****/
/*****************************************************/

.maincalendar {
    background: #2288BB; /* Old browsers */
    background: -moz-radial-gradient(center, ellipse cover, #2288BB 0%, #006699 100%); /* FF3.6-15 */
    background: -webkit-radial-gradient(center, ellipse cover, #2288BB 0%,#006699 100%); /* Chrome10-25,Safari5.1-6 */
    border: 1px solid #2288BB;
    text-align: right;
}


/************************************************/
/* MainSearch - Runde Ecken im Content Bereich *****/
/************************************************/

.mainnews {
    background:transparent; /* -color: #F0F0F0; */
    visibility:visible;    
    text-align: right;
}

#mainsearch_head {
    background: #2288BB; /* Old browsers */
    background: -moz-radial-gradient(center, ellipse cover, #2288BB 0%, #006699 100%); /* FF3.6-15 */
    background: -webkit-radial-gradient(center, ellipse cover, #2288BB 0%,#006699 100%); /* Chrome10-25,Safari5.1-6 */
    text-align: center;
}

.mainsearch {
    background: #2288BB; /* Old browsers */
    background: -moz-radial-gradient(center, ellipse cover, #2288BB 0%, #006699 100%); /* FF3.6-15 */
    background: -webkit-radial-gradient(center, ellipse cover, #2288BB 0%,#006699 100%); /* Chrome10-25,Safari5.1-6 */
    text-align: right;
}


.mainlink {
    color:#E2E7EA;
    background: #2288BB;
    background: -moz-radial-gradient(center, ellipse cover, #2288BB 0%, #006699 100%); /* FF3.6-15 */
    background: -webkit-radial-gradient(center, ellipse cover, #2288BB 0%,#006699 100%); /* Chrome10-25,Safari5.1-6 */
    text-align: right;
}

.mainsearchtable {
    font-size: 1.2em;
    margin-left: 3px; 
    text-align:center;
    background-color:transparent;
}

.mainsearchtitle {
    color:#E2E7EA;
    background-color:transparent;
    font-size:1.3em;
    font-weight:bold;
    text-align: center;
}

#mainextendedsearch {
    width:30px;
    font-size:0.9em;
    visibility: visible;
}

.mainsearchtext {
    text-align:center;
    font-size:0.9em;
    color:#E2E7EA;
}

.mainsearchtext a {
    font-size: 1.2em;
    font-weight: bold;
    text-decoration: none;
    color: #E2E7EA;
}


/************************************************/
/* Standard - CSS *****/
/************************************************/

.rounded-corners-small {
    behavior: url(/css/ie-css3.htc);
    -moz-box-shadow: 0px 3px 6px #6C6C6C;  
    -webkit-box-shadow: 0px 3px 6px #6C6C6C;  
    box-shadow: 0px 3px 6px #6C6C6C;  

/*  mit radius
   -moz-border-radius: 8px;        
    -webkit-border-radius: 8px;
    -khtml-border-radius: 8px;
    border-radius: 8px; */
}


.normaltext {
    font-size: 1em;
    font-style: normal;
    font-weight: normal;
}

.labeltext {
    font-size: 1em;
    font-style: normal;
    font-weight: normal;
}

.smalltext {
    font-size: 0.8em;
    font-style: normal;
    font-weight: normal;
}

.historybutton, .historybutton a {
    background:transparent;
    text-decoration: none;
    font-size: 1em;
    font-weight: normal;
    color: #FFF;
    -webkit-transition-duration: 0.2s; /* Safari */
    transition-duration: 0.2s;
    
}

a.historybutton:hover {
    font-weight: bold;
    
}

.historytext {
    color: #E2E7EA;
}

.historytext a {
    color: #E2E7EA;
}


.hyperlinks {
    font-family: Open Sans, Verdana, Arial, Helvetica, sans-serif;
    font-size: medium;
    font-style: normal;
    font-weight: normal;
    color: #000000;
}

.tabletext {
    font-size: 1em;
    font-style: normal;
    font-weight: normal;
    border-bottom: 1px none #666666;
    border-left: 1px none #666666;
    border-right: 1px none #666666;    
    height: 20px;
    background-color: #9A9A9A;
}

.tablemenu {
    height:20px;
    background-color: #E0E0E0;
    font-size: 0.8em;
    border:none #666666;
}

.headertext {
    font-family: Open Sans, Verdana, Arial, Helvetica, sans-serif;
    font-size: 1.2em;
    font-weight: bold;
    border: 0px solid #666666;
    height: 16px;
}

.header1text {
    font-size: 1.2em;
    font-weight: bold;
}

.header2text {
    font-size: 1.2em;
    font-weight: bold;
}


.titlestd {
    font-size: 1em;
    font-weight: bold;
    text-align: left;
    background-color: #9A9A9A;
    background-repeat: no-repeat;
    border: 0px solid #AAAAAA;  
}

.titlerow {
    padding: 2px;
    font-size: 1.5em:
    text-decoration:none;
    background-color: #DDDDDD;
    background-repeat: no-repeat;
    font-weight: bold;
    text-align: left;
}

.titlerow a, .titlerow a.visited {
    text-decoration:none;
    color:#333333;
}


.field-hint-inactive { color: #CCC; }

.field-hint { color: black; background-color:#FFC; }