@import url(https://fonts.googleapis.com/css?family=Open+Sans);
*, *:before, *:after { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;}
body {margin: 0px; font-size: 100%; font-family: 'Open Sans', sans-serif;}

.row { position: relative;}
.row:before, .row:after  {content: " "; display: table;}
.row:after { clear: both; }

.c-1 { width: 8.333333%;}
.c-2 { width: 16.66666667%}
.c-3 { width: 25%;}
.c-4 { width: 33.333333%;}
.c-5 { width: 41.66666667%;}
.c-6 { width: 50%;}
.c-7 { width: 58.333331%;}
.c-8 { width: 66.666667%;}
.c-9 { width: 75%;}
.c-10 { width: 83.33333333%;}
.c-11 { width: 91.666667%;}
.c-12 { width: 100%;}
[class*='c-']{ float: left;}

.clear {clear: both;}

.hidden { display: none;}

.right { text-align: right;}
.left { text-align: left;}
.center { text-align: center;}

.wrapper {
    max-width: 1030px;
    margin: 0 auto;
}

blockquote {
    font-style: italic;
    font-family: Georgia, Times, "Times New Roman", serif;
    padding: 2px 16px;
    border-style: solid;
    border-color: #540611;
    border-width: 0;
    border-left-width: 5px;
}
h3,
h2,
h1 {
    text-align: center;
    text-transform: uppercase;
    color: #701913;
    font-weight: bold;
    font-family: Arial, sans-serif;
}
/*
COLORS:
    red : #701913
    brown: #A1612E;
*/
/*
    CKEDITOR
*/

img.align_left{
    float: left;
    margin-right: 15px;
}
img.align_right {
    float: right;
    margin-left: 15px;
}


/* NAVIGATION */
.page-now {
    font-weight: bold;
}
.header {
    margin-top: 30px;
}
.hlogo {
    width: 110px;
    display: inline-block;
    vertical-align: middle;
    padding-left: 10px;
}
.hlogo img {
    width: 100%;
}
.main-nav {
    display: inline-block;
    text-align: right;
    vertical-align: middle;
    padding: 0;
    width: 83%;
}
.main-nav li {
    display: inline-block;
    font-size: 18px;
    text-transform: uppercase;
    font-family: Arial, sans-serif;
    margin: 0 10px
}
.main-nav li a:hover{
    font-weight: bold;
}
.main-nav li a::after {
    display:block;
    content:attr(title);
    font-weight:bold;
    height:1px;
    color:transparent;
    overflow:hidden;
    visibility:hidden;
    margin-bottom:-1px;
}
.main-nav a {
    color: #701913;
    text-decoration: none;
}

.header-img img{
    width: 100%;
}
.line {
    width: 100%;
    height: 16px;
    margin: 0 0 20px 0;
    background-image: url(../img/line1.png);
}

.parmums {
    -webkit-column-count: 2; /* Chrome, Safari, Opera */
    -moz-column-count: 2; /* Firefox */
    column-count: 2;
    text-align: justify;
    color: #A1612E;
    padding: 0 30px 0 30px;
}
.main-content {
    padding-top: 20px;
    background: url(../img/background.jpg) no-repeat;
    background-size: cover;
    margin-top: -10px;
}
.main-content img {
    max-width: 100%;
}
.parmums p {
    margin: 0;
}


.simple-body {
    padding: 0 20px;
    color: #701913;
}
.simple-body .c-3 {
    padding: 20px;
}
.book-div {
    position: relative;
    display: inline-block;
    float: left;
    height: 395px;
    width: 220px;
    margin:0 20px 20px 0;
    border-style: solid;
    border-width: 20px;
    -moz-border-image: url(../img/frame.png) 20 stretch repeat;
    -webkit-border-image: url(../img/frame.png) 20 stretch repeat;
    -o-border-image: url(../img/frame.png) 20 stretch repeat;
    border-image: url(../img/frame.png) 20 fill stretch repeat;


}
.book-img {
    width: 180px;
    margin-top: 10px;
    height: 277px;
    overflow: hidden;
}
.book-img img {
    width: 100%;
}
.book-title {
    text-align: center;
}
.book-readmore {
    text-align: center;
    position: absolute;
    bottom: 0;
    width: 100%;
}
.partners {margin-top: 20px;}
.footer {
    margin-top: 70px;
    padding-bottom: 10px;
}
.footer-con {
    text-align: center;
}
.footer-con li {
    display: inline-block;
    margin: 0 10px;
    color: #A1612E;
    font-size: 14px;
}

.bars {
    display: none;
    position: absolute;
    font-size: 26px;
    border: 2px solid #A1612E;
    color :#A1612E;
    border-radius: 5px;
    right: 10px;
    width: 40px;
    height: 40px;
    text-align: center;
}
.bars:hover {
    cursor: pointer;
    background-color: #A1612E;
    border-color: #ffffff;
    color: #ffffff;
}

.video-frame {
    margin: 0 auto;
    display: block;
    margin-bottom: 20px;
}

.bio {padding: 15px;}

.musik-wrapper {
    width: 470px;
    margin: 0 auto;
    padding-bottom: 50px;
}
.audiojs .play-pause {
    padding: 4px 0px;
}

.foto-wrap {
    padding: 30px;
}
.foto-img {
    max-width: 100%;
    border-radius: 5px;
}
.gas {
  padding: 4px;
  border: 1px solid gray;
  color:inherit;
  text-decoration: inherit;
  display: inline-block;
}
.gallery-holder {
  display: inline-block;
  width: 220px;
  height: 213px;
  vertical-align: top;
  position: relative;
  background-size: cover;
  background-position: center;
}
.gallery-holder:hover .gallery-title {
  height: 100%;
  padding-top: 30px;
}
.gallery-title {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  background-color: rgba(255, 255, 255, 0.5);
  text-align: center;
  height: 60px;
  transition: all .3s;
  padding: 5px;
  font-size: 13px;
}
.grouped {
  display: inline-block;
  width: 100%;
  height: 95%;
  min-height: 20px;
  width: 200px;
}
.gal-image {
  height: 15vh;
  width: 100%;
  display: inline-block;
  background-position: center;
  background-size: cover;
}
@media only screen and (max-width: 800px) {
    .c-3 {width: 50%; padding: 20px 70px;}
}

@media only screen and (max-width: 360px) {
    .bars {  display: block;  }
    body {font-size: 75%;}
    [class *='c-'] { width: auto; float: none; padding: 10px;  }
    .c-3 {width: 50%; padding: 20px 70px;}
    .hlogo {display: block; text-align: center; width: 100%; padding: 0;}
    .hlogo img {width: 110px;}
    .main-nav {width: 100%; text-align: center;}
    .main-nav li{display: block; width: 100%; margin-bottom: 15px;}
    .parmums {
        -webkit-column-count: 1; /* Chrome, Safari, Opera */
        -moz-column-count: 1; /* Firefox */
        column-count: 1;
        padding: 0 10px;
    }
    .main-nav {display: none;}
}
