html {

  -webkit-text-size-adjust: 100%; 
  -ms-text-size-adjust: 100%; 
  -webkit-tap-highlight-color: rgba(0,0,0,0);
  background: rgb(12,8,5); 
 height: 100%

}



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

body
{
    color: rgb(188,15,15);
    font-family: Helvetica;
    font-size: 62.5%;
    margin: 0;
    min-width: 320px;
 height: 100%
}
.header-container {

position: fixed;
right: 0;
}

.link-container {
padding-top:10px;
font-size:34px;
    color: rgb(188,15,15);
}

h1 {
font-family: 'Creepster', cursive;
font-weight:400;
font-size:34px;
text-align: right;
  margin: 0;
padding-top: 16px;
padding-right: 16px;
}

h3 {
font-family: 'Permanent Marker', cursive;
font-weight: 400;
font-size: 30px;
margin:0;
}

.preload-container {
     width: 100px;
height: 100px;
  position: absolute;
  left: -1000px;
top:50px;
overflow: hidden;
}

.preload {

}

.preload img {

width:100%;
height: auto;
}

#logo a
{
    color: rgb(188,15,15);
}

a
{
 text-decoration: none;
    outline: none;
}

#pageContent {
 height: 100%
}

#pageContent #visualHalf {
  -webkit-text-size-adjust: 100%; 
  -ms-text-size-adjust: 100%; 
  -webkit-tap-highlight-color: rgba(0,0,0,0);
  background: rgb(12,8,5) url(IMG_0772.JPG) no-repeat top center scroll; 
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
  -webkit-transition: background 1s linear;
  -moz-transition: background 1s linear;
  -o-transition: background 1s linear;
  transition: background 1s linear;
  
}

#pageContent #visualxxHalf .picture.first {

  background: rgb(12,8,5) url(IMG_0772.JPG) no-repeat center center scroll; 
  
}

#pageContent #visualHalf .picture {


    opacity: 1;
  -webkit-tap-highlight-color: rgba(0,0,0,0);
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
  height:auto;
width: 100%;
}

#pageContent.landscape #visualHalf {
width: 50%;
float:right;
height: 100%;
display: block;
min-height: 50px;
position: relative;
}


#pageContent.landscape #textHalf {
width: 50%;
padding:20px;
font-size: 18px;
float:left;
height: 100%;
}


#pageContent.portrait #visualHalf {
width: 85%;
height: 70%;
display: block;
min-height: 50px;
overflow:hidden;
}


#pageContent.portrait #textHalf {
width: 100%;
font-size: 20px;
height: 30%;
overflow-y: auto;
}

#pageContent.portrait #textHalf .inner {

padding:20px;

}

img
{
    border: 0 none;
    margin: 0;
    padding:0;
}

.img-responsive
{
     max-width: 100%; 
    height: auto; 

}

@media (max-width: 1000px) {

#pageContent.portrait #visualHalf {

width: 100%;
}


}


@media (max-width: 840px) {

.preload {
display: none;
}

#pageContent.portrait #visualHalf {

height: 50%;

}


#pageContent.portrait #textHalf {

height: 50%;

}
}