/*------------------------------------*\
    color notes
text default        #fff
background          #369
shadow light        #fff
shadow mid          
shadow dark         #000
\*------------------------------------*/

/*------------------------------------*\
    fonts
\*------------------------------------*/
@font-face{
    font-family: Qwigley;
    src: url(templates/Qwigley-Regular.ttf);
}

@font-face{
    font-family: Junge;
    src: url(templates/Junge-Regular.ttf);
}

/*------------------------------------*\
    UNIVERSALS
\*------------------------------------*/
*{
    color: #000;
    font-style: normal;
    font-variant: normal;
    font-weight: normal;
    font-size: 10px;
    font-family: Junge, serif;
    line-height: 100%;
    text-decoration: none;
    text-align: left;
    margin: 0;
    padding: 0;
    /*border: 1px dashed blue;*/
}

/*------------------------------------*\
    texts
\*------------------------------------*/
p{
    font-size: 2em;
    margin: 0.5em;
}

h1{     /* main title */
    text-align: center;
    color: #fff;
    font-family: Qwigley;
    font-size: 2500%;
    text-shadow: #000 0 0 0.08em;
    margin: 0.08em;
    letter-spacing: 0em;
}

h2{     /* tagline */
    text-align: center;
    font-size: 6em;
    text-shadow: #fff 0 0 0.3em;
    margin: 0.3em;
}

h3{     /* tour dates */
    margin: 0.5em;
    margin-bottom: 0em;
    font-family: Qwigley;
    font-size: 4em;
}

h3+p{
    margin-top: 0em;
    margin-left: 2em;
}

h4{     /* section top line */
    margin: 0.5em;
    text-align: center;
    font-family: Qwigley;
    font-size: 6em;
}

h5{     /* section top line */
    margin: 0.5em;
    margin-bottom: 0em;
    text-align: center;
    font-family: Qwigley;
    font-size: 6em;
}

h5+p{
    margin-top: 0em;
}

h6{

}

foot{    /* index footer contact info */
    font-size: 1.4em;
    position: relative;
    bottom: 0.7em;
}

copyright{    /* index footer copyright info */
    font-size: 1em;
    position: relative;
    bottom: 1em;
}

em{
    font: inherit;
    color: #c00;
}

i{
    font: inherit;
    font-style: italic;
}

b{
    font: inherit;
    font-weight: bold;
}

a{
    color: inherit;
}

.qwigley{
    font-family: Qwigley;
    font-size: 1.5em;
}

ls1{
    color: inherit;
    font: inherit;
    letter-spacing: -0.1em;
}

ls06{
    color: inherit;
    font: inherit;
    letter-spacing: -0.06em;
}

/*------------------------------------*\
    structure
\*------------------------------------*/
body{
    position: relative;
    background: #369;
    background-image: url(img/IMG_8488cut1.jpg);
    background-size: auto 100%;
    background-repeat: no-repeat;
    background-attachment: fixed;
    background-position: center top;
    min-width: 100em;
}

body>div{
    padding: 15em 4em;
    min-height: 100em;
}

#header{
    padding: 0;
    position: fixed;
    top: 0;
    z-index: 10;
    background: rgba(255,255,255,1);
    min-height: 0;
    height: 10em;
}

#title{
    padding-top: 25em;
    background: none;
}

#one{}

#two{}

.koocanusa{
    text-align: center;
    border-radius: 1em;
}

.bugscreen{
    float: right;
    height: 25em;
    margin: 0.5em 2.5em;
    border-radius: 1em;
}

#three{}

#four{}

#five{}

.canonpic{
    float: right;
    height: 50em;
    margin: 2.5em;
    border-radius: 1em;
}

#six{
    width: 100em;
    margin: auto;
}

#footer{
    padding: 0;
    min-height: 0;
    height: 5em;
    position: relative;
    background: rgba(255,255,255,0.8);
}

/*------------------------------------*\
    arrange justified sections
\*------------------------------------*/
#header, #footer, #spread{
    text-align: justify;
    /*font-size: 0.1px;*/
    width: 100%;
    /*min-width: 1000px;*/
    margin: auto;
}

#header div, #footer div, #spread div{
    display: inline-block;
}

#header:after, #footer:after, #spread:after{
    content: '';
    width: 100%;
    display: inline-block;
}

/*------------------------------------*\
    ids & classes
\*------------------------------------*/
#header>:first-child, #footer>:first-child{
    margin-left: 2em;
} 

#header>:last-child, #footer>:last-child{
    margin-right: 2em;
}

.logo img{
    height: 10em;
}

.nav a:link{
    position: relative;
    top: -2em;
    font-size: 2em;
    font-weight: bold;
    letter-spacing: -0.05em;
    padding: 4em 0.5em 1.5em 0.5em;
    background-color: rgba(255,255,255,0);
    /*border-radius: 50%;*/
}

.nav a:hover{
    color: #fff;
    background-color: rgba(0,0,0,0.6);
    text-shadow: #000 0 0 0.3em;
}

.bg1{
    position: relative;
    margin-bottom: 60em;
    padding: 2em;
    border-radius: 2em;
    background-image: url(img/bg08.jpg);
    background-repeat: repeat;
    /*z-index: -1;*/
}

.quote{
    background-color: rgba(0,0,0,0.1);
    padding: 1em;
    border-radius: 1em;
}

.contacttopper{
    display: inline-block;
}

.sociallinks{
    display: inline-block;
    margin-left: 8em;
}   

.sociallinks a img{
    height: 4.8em;
}

#footer a img{
    height: 4.8em;
}

/*------------------------------------*\
    form
\*------------------------------------*/
form{
    background-color: rgba(0,0,0,0.1);
    padding: 1em;
    border-radius: 1em;
}

select, input, textarea{
    font-size: 2em;
}

select:focus, input:focus, textarea:focus{
    border: 2px solid #900;
}

select{
    width: 15em;
}

#name{
    width: 30em;
}

#date, #date2, #tel{
    width: 14em;
}

#email{
    width: 20em;
}

textarea{
    width: 28em;
    height: 4.5em;
    vertical-align: top;
    resize: none;
    overflow: auto;
}

#submit{
    color: #f00;
    position: relative;
    top: 0;
    left: 8em;
    padding: 0.5em 5em;
    background: #fff;
    -webkit-border-radius: 0.5em;
    -moz-border-radius: 0.5em;
    border-radius: 0.5em;
    /*border: 0;*/
    /*text-shadow: #000 0 0 0.3em;*/
}

#submit:hover{
    color: #fff;
    background-color: rgba(0,0,0,0.6);
    text-shadow: #000 0 0 0.3em;
}