/* =Reset default browser CSS. Based on work by Eric Meyer: http://meyerweb.com/eric/tools/css/reset/index.html
-------------------------------------------------------------- */
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
  background: transparent;
  border: 0;
  margin: 0;
  padding: 0;
  vertical-align: baseline; }

body {
  line-height: 1; 
}

h1, h2, h3, h4, h5, h6 {
  clear: both;
  font-weight: normal; }

a img {
  border: none; }


/* =Global
-------------------------------------------------------------- */
*,
*:before,
*:after {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box; }

body {
    background-color:#fff;
    color: #505050;
    font-family: "Ubuntu", sans-serif;
    font-weight: 300;
    font-size: 18px;
    line-height: 1.8; }

    

/* Headings */
h1, h2, h3, h4, h5, h6, h7 {
    line-height: 1;
    font-weight: 300; 
}

a{
    color:#c6c7c8;
    text-decoration: none;
}

 a:hover{
    color:#c6c7c8;
}

/* =Fonts
-------------------------------------------------------------- */

@font-face {
  font-family: 'Ubuntu';
  src: url('../fonts/Ubuntu-Regular.ttf')  format('truetype')
}


/* =Header
-------------------------------------------------------------- */
header {
    padding:0; 
    margin:0;
    background:#000;
    text-align:center;
    line-height:2em;
    position:fixed;
    width:100%;
        }

/* Body
-------------------------------------------------------------- */

#wrapper {
    width: 100%;
    margin: 0 auto;
    padding-top:0;
}


.logo{
    display:block;
    width:100%;
    padding:8em 0 0 0;
    margin:0;
    background:#4b4b4d;
    background-repeat:no-repeat;
}


.logo section{
    width:20%;
    margin-left:40%;
    float:left;
}

h1{
    text-transform:uppercase;
    margin-top:.7em;
    margin-bottom:.2em;
    text-align:center;
    color:#00A99D;
}

h2{
    color:#fff;
    font-size:1.5em;
    margin-bottom:.2em;
    text-transform:uppercase;
}

h3 {
    font-size:20px;
    font-weight:normal;
    padding:1em;
    text-align:center;
    color:#00A99D; 
}

h4 {
    font-size:10px;
    margin:0;
    padding:0;
    color:#ff6166;
    font-weight:bold;
    display:inline;
    font-style:italic;
}

h7{
    color:#00A99D;
    display:inline;
    line-height:1em;
    font-size:28px;
    text-align:center;
    text-transform:none;
}

hr {
    width:200px;
    color:#00A99D;
    border:solid 2px;
    margin-bottom:20px;
}

#main {
    padding: 10px 0 0 0;
}

#center{
    display:block;
    text-align:center;
    background:#fff;
    width:60%;
    padding:1em;
    margin-left:20%;
    float:left;
    margin-bottom:4em;
}

.half{
    display:block;
    width:100%;
    color:#fff;
    background:#777777;
    padding:0;
    float:left;
    margin:0;
    padding:3em 15% 4em 15%;
}

.half section{
    width:45%;
    float:left;
    margin-right:5%;
}

.half ul{
    list-style-type: circle;
    padding-left:1em;
    margin-top:15px;
}

.half ul li{
    line-height:1.5;
}

.half p{
    margin-top:15px;
}


.muay{
    display:block;
    background:#00A99D; 
    color:#fff;
    width:100%;
    margin-left:0;
    margin-top:0;
    padding:3em 15% 2em 15%;
}


.muay section{
    width:50%;
    float:left;
    padding:1em;
    margin-bottom:2em;
}


.muay h1{
    color:#fff;
}

.muay hr{
    color:#fff;
}


.box{
    display:block;
    width:100%;
    margin-top:3em;
    margin-bottom:4em;
    padding:3em 15% 2em 15%;
    
}

.box section{
    width:50%;
    float:left;
    padding:1em;
    margin-bottom:25px
}


.Fitness{
    display:block;
    background:#8accc6; 
    color:#fff;
    width:100%;
    margin-top:3em;
    margin-bottom:3em;
    padding:3em 15% 2em 15%;
}


.Fitness section{
    width:50%;
    float:left;
    padding:1em;
    margin-bottom:2em;
}

.Fitness h1{
    color:#fff;
}

.Fitness hr{
    color:#fff;
}

.Fitness img{
    margin-top:1em;
}

.training{
    display:block;
    background:#4b4b4d;
    color:#fff;
    width:100%;
    margin-left:0;
    padding:3em 5% 3em 5%;
}

.training h1 {
    color:#fff;
}

.training hr{
    color:#fff;
}

.training article{
    display:none;
}

.training table{
    width: 100%;
    border-collapse: collapse;
    border:3px #fff solid;
    margin-top:2em;
}

.training tr, td {
    padding: 10px;
    width:16%;
    border:2px #bbbdbe solid
}

.training tr:nth-child(1) {
    background-color:#00A99D;
    border-bottom:3px #fff solid;
    font-weight:bold;
    
}

.training tr:nth-child(2) {
    font-size:14px;
}

.training tr:nth-child(3) {
    font-size:14px;
}
.training tr:nth-child(4) {
    font-size:14px;
}

.training section{
    display:block;
    height:inherit;
    padding:0 12% 1em 12%;
    width:100%;
    margin-left:0;
    float:left;
}

.training p {
    float:left;
    width:70%;
    margin-left:15%;
}


#news{
    display:table;
    text-align:center;
    color:#fff;
    width:100%;
    margin:0;
    padding:0 0 0 0; 
    float:left;
}


#news section{
    background:#707173;
    text-align:center;
    width:50%;
    display:table-cell;
    text-align:left;
    float:none;
    padding:3em 5% 2em 5%;
}

.fb-page {
    text-align:center;
}
 

#news sidebar{
    display:table-cell;
    text-align:left;
    color:#fff;
    background:#9a9a9a;
    width:50%;
    margin:0;
    padding:3em 5% 3em 5%;
    float:none;
}

h8{
    text-align:left;
    font-weight:bold;
    font-size:20px;
    color:#fff;
    text-transform:uppercase;
}


#news  h1{
    color:#fff;
}

#news iframe{
    display:block;
    max-width:500px;
    width:100%;
    height:500px;
    margin-bottom:2em;
    float:left;
}


.kontakt{
    margin-bottom:0;
    display:block;
    background:#4b4b4d;
    color:#fff;
    width:100%;
    margin-left:0;
    padding:3em 25% 5em 25%;
    
}

.kontakt h1 {
    color:#fff;
}

.kontakt hr{
    color:#fff;
}
.kontakt sectiona,
.kontakt sectionb{
    float:left;
    padding:1em;
    
}
.kontakt sectiona{
    width:30%;
}

.kontakt sectionb{
    width:70%;
    padding-top:0;
}

#impressum{
    margin-bottom:0;
    display:block;
    background:#4b4b4d;
    color:#fff;
    width:100%;
    margin-left:0;
    padding:6em 25% 3em 25%;
    font-size:14px;
}

#impressum h5{
    font-size:20px;
    line-height:1.5;
}
#impressum h6{
    color:#00A99D;
    font-size:18px;
    line-height:2;
    margin:0;
    padding:0;
}


/* =Footer
-------------------------------------------------------------- */
footer {
    bottom:0;
    width:100%;
    height:70px;
    background:#ff6166;
    line-height:1.6em;
    padding-top:1em;
    clear:both;
    text-align:center;
    color:#fff;
    position:static;
    margin-top:0;
}

footer a{
    font-size:16px;
    color:#fff;
}
/* =Extras
-------------------------------------------------------------- */
.clearfix:after {
  visibility: hidden;
  display: block;
  content: "";
  clear: both;
  height: 0; }






/* =Media Queries
-------------------------------------------------------------- */
@media all and (max-width: 1040px) {
nav{
    font-size:16px;
    line-height:30px;
    }
    
}

@media all and (max-width: 770px) {

    
body{
    font-size:15px;
    }    
 
.logo{
    padding-top:5em;
    }    
.logo section{
    width:50%;
    margin-left:25%;
}

h1{
    font-size:30px;   
    margin-top:.5em;
    margin-bottom:.2em;
    text-align:center;
    color:#00A99D;
    font-weight:bolder;
}  

h7{
    font-size:20px;
        
}    
#center{
    width:90%;
    padding:1em;
    margin-left:5%;
}


.half{
    width:100%;
    padding-left:10%;
    } 
    
.half section{
    width:100%;
    float:none; 
    margin-top:40px;   
}
    
.half ul{
    margin-top:15px;
    }    

.half p{
    margin-top:20px;
    }

.muay{
    margin-top:0;
    padding:3em 5% 2em 5%;
}


.muay section{
    width:100%;
    float:none;
    padding:1em;
    margin-bottom:0;
}

.muay img{
    width:90%;
    margin-left:5%;   
    }    

.box{
    margin-top:1em;
    margin-bottom:4em;
    padding:3em 5% 2em 5%;
    
}

.box section{
    width:100%;
    float:none;
    padding-bottom:0;
}


.Fitness{
    padding:3em 10% 2em 10%;
}


.Fitness section{
    width:100%;
    float:none;
    margin-bottom:0;
    padding:0 0 1em 0;
    margin-left:0;   
}

.training section{
    padding:0 5% 1em 5%;
    width:100%;
    margin-left:0;
    float:left;
}
    
.training p {
    width:100%;
    margin-left:0px;
    margin-top:15px;
}

.training table{
    display:none;    
}

.training article{
    display:block;
    margin-top:3em;   
    text-align:center;
    width:80%;
    margin-left:10%;   
}    


#news{
    display:block;
    text-align:center;
    background:#707173;
    color:#fff;
    width:100%;
    margin:0;
    padding:0 0 0 0; 
    float:left;
}


#news section{
    background:#707173;
    width:100%;
    display:block;
        padding:3em 10% 4em 10%;
}

#news iframe{
    margin-bottom:2em;   
    }    

#news sidebar{
    display:block;
    width:100%;
    padding:3em 10% 3em 10%;
    float:none;
}

.kontakt{
    width:100%;
    margin-left:0;
    padding:3em 5% 5em 5%;
        text-align:center;
    }

.kontakt sectiona{
    width:50%;
    margin-left:25%;   
        
}    
    
.kontakt sectionb{
    width:90%;
    margin-left:5%;   
    padding-top:0;
}
    
/*
.kontakt sectiona,
.kontakt sectionb{
    float:none;
    padding:1em;
    
}



    
*/


#impressum{
    padding:3em 5% 3em 5%;
    font-size:12px;
}

#impressum h5{
    font-size:16px;
}
#impressum h6{
    color:#00A99D;
    font-size:16px;
    line-height:40px;
    margin:0;
    padding:0;
    }
#impressum p{
    margin-top:15px;   
    }    

}
    

#calendar{
    padding:3em 5% 3em 5%;
    font-size:14px;
}

#calendar h5{
    font-size:16px;
}
#calendar h6{
    color:#00A99D;
    font-size:16px;
    line-height:40px;
    margin:0;
    padding:0;
    }
#calendar table{
    margin-top:30px;   
    }    

}