/* ============================================================
  PRIMARY STRUCTURE
============================================================ */
@import 'https://fonts.googleapis.com/css?family=Gentium+Basic|Quando';


body {
font-weight: normal;
font-family: Gentium Basic, Georgia, serif;
color:#101A32;
font-size:2vw;}
.container {
  margin: 0 auto;
height: auto;
padding: 2vh 5vw;
}
strong, b {
  font-family: 'Quando', 'Gentium Basic', Georgia, serif;
}
.container h1 {margin:2vw 0 0 0;padding:0;}

fieldset {border: 1px solid rgba(255, 255, 255, 0.3); padding:20px;margin:10px;
background:rgba(0, 0, 0, 0.1);

}


a.fansfansfans, img.fansfansfans, img.fansfansfans.a, img a {box-shadow:none;  -webkit-box-shadow:none; -moz-box-shadow:none; padding:0;margin-bottom: 15px!important;}

img {margin:3px; padding:2px;
 border: 1px solid RGB(151, 152, 150);
 -webkit-box-shadow: #000000 0px 0px 3px,  RGB(151, 152, 150) 0px 0px 5px,  RGB(119, 121, 123) 0px 0px 13px ;
box-shadow: #000000 0px 0px 3px,  RGB(151, 152, 150) 0px 0px 5px,  RGB(119, 121, 123) 0px 0px 13px ;
}

img a:hover, a:hover img {margin:2px; padding:3px;
}


#navi {position:fixed; z-index:4;top:1vw;text-align:center;width:100%;backgrsound:#2D0507;line-height:100%;overflow:hidden;}



#navi ul {float:left;position:relative; left:50%;}
#navi li {position:relative;display:inline-block;float:left;margin:0 1vw;right:50%;
}
#navi li:hover {}
#navi li>a {display:block;padding:1vw;font-size:2vw;text-transform:uppercase;text-shadow:0px 0px 15px rgba(255, 255, 255, 0.3);-webkit-text-shadow:0px 0px 15px rgba(255, 255, 255, 0.3);

}
#navi li>a:hover, #navi a:active {color: #F7F7F0;background:rgba(255, 255, 255, 0.1);}



#show-members>ul>li,#pagination {clear:both;padding-top:2em;}

a:link, a:visited {  font-family: 'Quando', 'Gentium Basic', Georgia, serif;
margin:0;color: rgba(255, 255, 255, 0.9);font-size:80%;text-decoration:none;}
a:hover, a:active {color: #F7F7F0;}
li {margin: 10px;}
textarea {background: #746D5A;}
/* ============================================================
  SECTIONS
============================================================ */
* {margin:0;padding:0; }

section {width:100%;border-top: 0px solid rgba(0, 0, 0, 0.3); border-bottom: 0px solid rgba(0, 0, 0, 0.3); 
height: 100%;margin:0;width:100%;padding:0;overflow:hidden;
-webkit-box-shadow: 0px 0px 15vh 10vh rgba(210,216,228,1);
-moz-box-shadow: 0px 0px 15vh 10vh rgba(210,216,228,1);
box-shadow: 0px 0px 15vh 10vh rgba(210,216,228,1);

}


section.module:last-child {
  margin-bottom: 0;
}
section.module p {
  margin: 20px 0;
color:#101A32;

}
section.module p:last-child {
  margin-bottom: 0;
}
section.module.content {
  padding: 2vh 0;
background: #D2D8E4;
height: auto;

}


section.module.parallax {
height:100vh;
  background-position: 50% 50%;
  background-repeat: no-repeat;
  background-size: cover;

}

@media only screen 
and (min-device-width : 1024px) {
  section.module.parallax {
 
  background-attachment: fixed;
}

}



section.module.parallax h1 {
 font-family: 'Quando', 'Gentium Basic', Georgia, serif;
color: rgba(255, 255, 255, 0.6);
    font-size: 10vw;
  line-height: 100%;
  font-weight: 700;
  text-align: center;
padding-top: 50vh;
text-shadow: 0px 0px 6px rgba(255, 255, 255, 0.2);
}

section.module.parallax h2 {
  font-family: 'Gentium Basic', Georgia, serif;
margin-top: -2.7vw;
  font-size: 2.7vw;
  text-align: center;
text-shadow: 0px 0px 6px rgba(255, 255, 255, 0.5);
padding:0.5em;


}



section.module.content h1 {
  font-family: 'Quando', 'Gentium Basic', Georgia, serif;
color: rgba(255, 255, 255, 0.8);
    font-size: 3vw;
  line-height: 120%;
text-shadow: 0px 0px 6px rgba(0, 0, 0, 0.2);

}


section.module.parallax-1 {
  background-image: url("a.jpg");
}
section.module.parallax-2 {
  background-image: url("e.jpg");
}
section.module.parallax-3 {
  background-image: url("c.jpg");
}
section.module.parallax-4 {
  background-image: url("d.jpg");
}
section.module.parallax-5 {
  background-image: url("m.jpg");
}
section.module.parallax-6 {
  background-image: url("f.jpg");
}
section.module.parallax-7 {
  background-image: url("g.jpg");
}
section.module.parallax-8 {
  background-image: url("h.jpg");
}

input[type=radio], input[type=checkbox]{width:10px;}

label, legend, fieldset>label {   margin: 1em 0 1em 0%;
width:30%;float:left;clear:both;

}
fieldset>p {clear:both;}
input, textarea {
box-shadow: 0px 0px 40px rgba(255, 255, 255, 0.3);
  margin: 1em 0 1em 0%;
  padding: 10px 20px;
  width: 50%;
background-color: rgba(255, 255, 255, 0.5);
  border: 1px solid rgba(255, 255, 255, 0.3);  
}

input[type=submit], input[type=reset], p.inputPassword {margin-left:30%;}


textarea:focus, input:focus {
    background: rgba(255, 255, 255, 0.7);
}

.otherforms {
margin-top:30px;
min-height:100px;
padding-bottom:100px;
margin-bottom:100px;}


select {clear:both;  margin: 1em 0 1em 0%;
   overflow: hidden;
background-color: rgba(255, 255, 255, 0.5);
  border: 1px solid rgba(255, 255, 255, 0.3);  }

option {  padding: 10px 20px;   overflow: hidden;
background-color: rgba(255, 255, 255, 0.5);
  border: 1px solid rgba(255, 255, 255, 0.3);  }


label.punch { 
   width: 25%;
clear:none;
float:left;display:inline;
text-align:center;cursor:pointer; 
box-shadow: 0px 0px 40px rgba(255, 255, 255, 0.3);
  margin: 2em 1em;
  padding:  30px 20px;
background-color: rgba(255, 255, 255, 0.5);
  border: 1px solid rgba(255, 255, 255, 0.3);  
 
}

div.advanced label:hover { 
  cursor: pointer; 
}

section {padding-bottom:100px;}

input.toggle ~ div { 
  height: 0px; width:0px;
  overflow: hidden;
  -webkit-transition: width 2s, height 4s; /* For Safari 3.1 to 6.0 */
    transition: width 2s, height 4s;}
input.toggle:checked ~ div { height: auto; width:100%;   clear:both;
 }
input.toggle:checked + label { font-weight:bold; }
input.toggle { display: none;  }

#albums{position:relative; float:left; left:50%;}
.album {position:relative;display:inline-block;float:left;right:50%;padding:5px;}




ul {list-style-type:none;}

p.faveField {
margin:-15px 0 0 0;padding:0;line-height:0;float:left;display:inline;}
p.faveField strong {  font-family: 'Gentium Basic', Georgia, serif;font-weight:normal;
}

/* Old browsers IE 6, IE 7, and IE 8*/
@media \0screen\,screen\9 {

input.toggle ~ div { 
  height: auto; width:100%; }
input.toggle:checked ~ div { height: auto; width:100%;   clear:both;
 }
label[for=punch] { 
clear:both;  margin: 2em 0;
  padding: 10px 0px;
   
}
div.advanced label:hover { 
  cursor: default; 
}
input.toggle:checked + label { display:none; }
input.toggle { display: none;  }
    body { color: white; }
   

 }