/*
################################################################################
#                           jubileefest.org main.css                           #
#           Copyright (C) 2015 P. H. Madore | phm.link >< spacity.website      #
#                  Open under Mozilla Public License Version 2.0               #
#                      https://www.mozilla.org/en-US/MPL/2.0/                  #
################################################################################
*/
 
/*top-level*/
 
@import "compass/css3";
 
* {
    font-size: 14pt;    
    }
 
body {
    overflow-x:hidden;
    font-family: "cantora";
    }
 
/*boxes*/
 
#body-front, #body-faq, #body-manifesto, #body-contact {
    width: 100%;
    height: 100vh;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    overflow-y:scroll;
    overflow-x:hidden;
   
    }
 
 
#menu {
    position: fixed;
    right: 0;
    top: 35%;
    width: auto;
    margin: -2.5em 0 0 0;
    z-index: 5;
    color: white;
    font-weight: bold;
    font-size: large;
    text-align: left;
    border-right: none;
    padding: 0.5em 0.5em 0.5em 0.5em;
    border-radius: 3em 0.5em 0.5em 3em;  
 }
   
#content {
     width: 55vw;
     margin-top: 3%;
     margin-left: 10%;
     margin-bottom: 10%;
     margin-right: 10%;
    }
   
#copyright {
    width: 40%;
    height: auto;
    position: relative;
    bottom: 0;
    text-align: left;
    margin-left: auto;
    margin-right: auto;
    }
   
/*elements*/
 
h1 {
    font-family: "hippie";
    margin-left: auto;
    margin-right: auto;
    text-align: center;
    font-size: 3.85em;
   
    }
   
h2, h5, h6 {
    font-family: "hi.bold";
   
    }
 
h2 {
    font-size: 2.85em;
   
    }
 
h3 {
    font-family: "glacial";
    font-size: 2.15em;
    }
h4 {
   font-size: 1.5em;
   font-family: "cantora";
   }
 
p {
    font-family: "cantora";
    font-size: 1.25em;
       
    }
blockquote {
    width: 512px;
    font-family: "glacial";
    font-style: italic;
    height: 255px;
    }
 
#copyright p {
    font-family: monospace;
    font-size: 0.65em;
    text-align: center;
   
    }
   
/*classes*/
 
/*You can change to higher quality files by pre-pending /png/ to the image and
changing the extension to .png, as in /img/png/frontbg.png - data intensive. */
 
/*Several individual classes have been created but not used or modified. This
leaves room for future, further customization, either by me on request or you
at your leisure. Having the skeleton here adds almost no extra data or server
strain, so it is advisable to leave any unused classes in place for the present,
or to move them to another file such as unused.css for later re-importing.*/
 
#body-front.frnt {
    background: url('../img/frontbg.jpg');
    background-repeat: repeat-y;
    background-position: top center;
    background-attachment: scroll;
 
    }
 
#body-faq.frq {
    background: url('../img/faqbg.jpg');
    background-repeat: repeat-y;
    background-position: top center;
    background-attachment: scroll;
 
    }
 
#body-manifesto.man {
    background: url('../img/manifestobg.jpg');
    background-repeat: repeat-y;
    background-position: top center;
    background-attachment: scroll;
 
    }
 
#body-contact.call {
    background: url('../img/contactbg.jpg');
    background-repeat: repeat-y;
    background-position: top center;
    background-attachment: scroll;
   
    }
 
#menu.hello {
    color: #efefef;
    background: hsla(0, 80%, 52%, 1);
    border: solid hsla(215, 76%, 84%, 1);
    box-shadow: 0 1px 3px #efefef;
    }
 
#menu.hello a, #menu.hello a:visited {
    color: #efefef;
    text-decoration: none;
    }
 
#menu.hello a:active, #menu.hello a:hover {
    color: #e8df79;
    text-decoration: none;
    }
   
h1.dex {
    text-shadow: -3px 0 4px #857661;
    color: #fb6c65;
 
    }
   
h2.dexh2 {
    text-align: left;
    margin-left: .75in;
    color: #332232;
    margin-top: -.2in;
   
    }
   
h3.dexh3 {
    text-align: center;
    color: #efefef;
    text-shadow: 1px 1px 1px #fb6c65;
    }
 
h4.dexh4 {
    text-align: center;
    text-shadow: 1px 2px 3px #332232;
    color: #e8df79;
    margin-top: -.25in;
    }    
 
 
p.front {
    text-shadow: -2px 0 4px #efefef;
    color: #b57552;    
   
    }    
   
#copyright p.boringlegal {
    font-family: monospace;
   
    }
#copyright p.boringlegal a, #copyright p.boringlegal a:visited {
    font-size: inherit;
    color: #332232;
   
    }
 
#copyright p.boringlegal a:active, #copyright p.boringlegal a:hover {
    font-size: inherit;
    color: #b57552;
    text-decoration: none;
    }    
 
#copyright p.ext {
    font-size: 0.35em;
    text-decoration: none;
    }
 
blockquote.fr0nt {
    text-shadow: -2px 0 4px #efefef;
    color: #332232;
    background-image: url('../img/musical-note.png');
    background-position: bottom right;
    background-repeat: no-repeat;
}
 
h1.fac {
    text-shadow: -3px 0 4px #857661;
    color: #332232;
 
    }
   
h1.fac a, h1.fac a:visited {
    text-shadow: -3px 0 4px #857661;
    color: #332232;
    text-decoration: none;
    font-size: inherit;
    }
   
h1.fac a:hover, h1.fac a:active {
    text-shadow: -3px 0 4px #857661;
    color: #fb6c65;
    text-decoration: none;
    font-size: inherit;
    }
   
h2.fach2 {
    text-align: left;
    margin-left: .75in;
    color: #fb6c65;
    margin-top: -.2in;
   
    }
   
h3.faqh3 {
    text-align: left;
    margin-left: 5vw;
    color: #332232;
    text-shadow: 1px 1px 1px #fb6c65;
   
    }    
 
p.faq {
    text-shadow: -2px 0 4px #efefef;
    color: #6f722f;
    margin-top: -.1in;
       
    }
 
blockquote.queshin {
    text-shadow: -2px 0 4px #efefef;
    color: #332232;
    background-image: url('../img/question-mark.png');
    background-position: center;
    background-repeat: no-repeat;
    font-size: 2.35em;
    padding-top: 15%;
    margin-bottom: -5vh;
}
 
#menu.query {
    color: #efefef;
    background: hsla(304, 20%, 17%, 1);
    border: solid hsla(215, 76%, 84%, 1);
    box-shadow: 0 1px 3px #efefef;
    }
 
#menu.query a, #menu.query a:visited {
    color: #e8df79;
    text-decoration: none;
    }
 
#menu.query a:active, #menu.query a:hover {
    color: #efefef;
    text-decoration: none;
    }    
 
p.manifest {
    font-size: 1.6em;
    }
 
p.manifest1 {
    background-image: url('../img/manifesto1.png');
    background-position: top left;
    background-repeat: no-repeat;
    width: 100%;
    height: 150px;
    padding-left: 75px;
    padding-top: 15px;
    margin: auto;
    }
 
p.manifest2 {
    background-image: url('../img/manifesto2.png');
    background-position: top left;
    background-repeat: no-repeat;
    width: 100%;
    height: 150px;
    padding-left: 75px;
    padding-top: 15px;
    margin: auto;
    }
   
p.manifest3 {
    background-image: url('../img/manifesto3.png');
    background-position: top left;
    background-repeat: no-repeat;
    width: 100%;
    height: 150px;
    padding-left: 75px;
    padding-top: 15px;
    margin: auto;
    }
   
p.manifest4 {
    background-image: url('../img/manifesto4.png');
    background-position: top left;
    background-repeat: no-repeat;
    width: 100%;
    height: 150px;
    padding-left: 75px;
    padding-top: 15px;
    margin: auto;
    }
   
p.manifest5 {
    background-image: url('../img/manifesto5.png');
    background-position: top left;
    background-repeat: no-repeat;
    width: 100%;
    height: 150px;
    padding-left: 75px;
    padding-top: 15px;
    margin: auto;
    margin-bottom: 3%;
    }
 
p.manifest6 {
    background-image: url('../img/manifesto6.png');
    background-position: top left;
    background-repeat: no-repeat;
    width: 100%;
    height: 150px;
    padding-left: 75px;
    padding-top: 15px;
    margin: auto;
    }
   
p.manifest7 {
    background-image: url('../img/manifesto7.png');
    background-position: top left;
    background-repeat: no-repeat;
    width: 100%;
    height: 150px;
    padding-left: 75px;
    padding-top: 15px;
    margin: auto;  
    }    
 
h1.mani {
    text-shadow: -3px 0 4px #857661;
    color: #844c55;
 
    }
   
h1.mani a, h1.mani a:visited {
    text-shadow: -3px 0 4px #857661;
    color: #844c55;
    text-decoration: none;
    font-size: inherit;
    }
   
h1.mani a:hover, h1.mani a:active {
    text-shadow: -3px 0 4px #857661;
    color: #e8df79;
    text-decoration: none;
    font-size: inherit;
    }
   
h2.manih2 {
    text-align: left;
    margin-left: .75in;
    color: #fefaf7;
    margin-top: -.2in;
   
    }
 
#menu.menufesto {
    color: #efefef;
    background: hsla(350, 27%, 41%, 1);
    border: solid hsla(215, 76%, 84%, 1);
    box-shadow: 0 1px 3px #efefef;
    }
 
#menu.menufesto a, #menu.menufesto a:visited {
    color: #fefaf7;
    text-decoration: none;
    }
 
#menu.menufesto a:active, #menu.menufesto a:hover {
    color: #e8df79;
    text-decoration: none;
    }    
 
h1.cntct {
    text-shadow: -3px 0 4px #857661;
    color: #efefef;
 
    }
   
h1.cntct a, h1.cntct a:visited {
    text-shadow: -3px 0 4px #857661;
    color: #332232;
    text-decoration: none;
    font-size: inherit;
    }
   
h1.cntct a:hover, h1.cntct a:active {
    text-shadow: -3px 0 4px #857661;
    color: #a50b2f;
    text-decoration: none;
    font-size: inherit;
    }
   
h2.callh2 {
    text-align: left;
    margin-left: .75in;
    color: #a50b2f;
    margin-top: -.2in;
   
    }
   
h3.callh3 {
    text-align: left;
    margin-left: 5vw;
    color: #332232;
    text-shadow: 1px 1px 1px #fb6c65;
   
    }
 
 
#menu.jubcontact {
    color: #efefef;
    background: hsla(346, 88%, 35%, 1);
    border: solid hsla(215, 76%, 84%, 1);
    box-shadow: 0 1px 3px #efefef;
    }
 
#menu.jubcontact a, #menu.jubcontact a:visited {
    color: #fefaf7;
    text-decoration: none;
    }
 
#menu.jubcontact a:active, #menu.jubcontact a:hover {
    color: #e8df79;
    text-decoration: none;
    }
   
 
.threatlevelgreen {
    color: #6f722f;
    font-size: inherit;
    }
 
.threatlevelred {
    color: #e70b0b;
    font-size: inherit;
    }
 
.threatlevelorange {
    color: #e76709;
    font-size: inherit;
    }
 
.threatlevelyellow {
    color: #e8df79;
    font-size: inherit;
    }
   
/*contact fields*/
 
div.field {
    font-size: 1.1em;
    margin: 3vw;
    font-family: "cantora";  
    }
 
div.field input {
    width: 20vw;
    color: #e8df79;
    background: hsla(346, 88%, 35%, 1);
    border: solid hsla(215, 76%, 84%, 1);
    box-shadow: 3px 1px 3px #efefef;
    font-size: 1.1em;
    font-weight: bold;
    outline: none;
    padding: 15px;
    -webkit-border-radius: 40;
    -moz-border-radius: 40;
    border-radius: 40px;
    font-family: "cantora";    
}
 
div.field textarea {
    color: #e8df79;
    background: hsla(346, 88%, 35%, 1);
    border: solid hsla(215, 76%, 84%, 1);
    box-shadow: 3px 1px 3px #efefef;
    font-size: 1.2em;
    font-weight: bold;
    width: 50vw;
    height: 3.5in;
    padding: 15px;
    outline: none;
    -webkit-border-radius: 40;
    -moz-border-radius: 40;
    border-radius: 40px;
    font-family: "cantora";  
}
 
.btn {
    background: hsla(346, 88%, 35%, 1);
    border: solid hsla(215, 76%, 84%, 1);
    box-shadow: 3px 1px 3px #efefef;
    -webkit-border-radius: 54;
    -moz-border-radius: 54;
    border-radius: 54px;
    margin-left: 25vw;
    font-size: 54px;
    width: 20vw;
    padding: 10px 20px 10px 20px;
    text-decoration: none;
    color: #e8df79;
    font-size: 1.2em;
    font-family: "cantora";  
    }
 
.btn:hover {
    background: #332232;
    color: #e8df79;
    text-decoration: none;
    font-family: inherit;
    }
 
/*stupid hacks et cetera*/
 
span.hifixh2 {
    margin-left: 12px;
    margin-right: 13px;
    }
   
#bottom-right {
    width: 0;
    height: 0;
    position: fixed;
    bottom: 0;
    right: 0;
    }
 
#bottom-right.perpage {
    border-bottom: 100px solid #fb6c65;
    border-left: 100px solid transparent;    
    }