@font-face {font-family:TrajanPro; src: url(fonts/TrajanPro-Regular.otf), url(fonts/TrajanPro-Regular.eot);}

.container {
            position: relative;
            display: flex;
            display: -webkit-flex;
            width:95vw;
            font-family: Century Gothic;
        }
        .menu {
            flex: 1;
            -webkit-flex: 1;
            margin: 10px;
            padding: 10px;
            padding-right:30px;
            border-right: solid .5px;
        }
            .menu a {text-decoration: inherit; color: inherit;}
            .menu img {width:100%}
            .menu ul {font-family: TrajanPro; list-style-type:none; padding-left: 5px; line-height: 2; font-size:large; color: rgba(0,0,0,.8);}
            .footer {font-style: italic; text-align:center; font-size:small; color: rgba(0,0,0,.8); }
            .tagline {font-family: TrajanPro; text-align:center; font-size:medium; color: rgba(0,0,0,.8); }
            .menu i {font-size: large; color: gray;}
        .content {
            position:relative;
            flex: 3;
            -webkit-flex: 3;
            margin: 10px;
            padding:20px;
            text-align:center;
        }
            .feature { position: relative; display: flex; display: -webkit-flex; justify-content: space-between; -webkit-justify-content: space-between; }
                .feature div {
                    position:relative;
                    height: 275px;
                    font-family: TrajanPro; font-size: 22pt; color: white; text-shadow: 2pt 2pt 3pt black; text-align:center;
                }
                .feature img { position: relative; height: 100%; opacity: .60;}
                .feature p { position: absolute; left: 0px; top:35%; width:100%;}
                .feature a:hover { color:white; }
            .banner { background-color: #F0BAD4; color: rgba(0,0,0,.8); width:100%; font-family: TrajanPro; text-align:center; font-size:xx-large; padding-top:20px; padding-bottom:10px; margin-top:10px; margin-bottom:10px;}
            .banner a:hover {color: white;}
            .note {text-align:right; color: rgba(0,0,0,.8);}
            .credit { font-style:italic; font-size: x-small; margin-bottom: 5px; color: rgba(0,0,0,.8); position: absolute; bottom: 0px; width:100%; }
            .target { font-family:TrajanPro; }
            .target:hover {color: #F0BAD4; cursor: pointer;}
   
   
   
   .split {
        display: flex; display: -webkit-flex;
        }
    
    .split div {
        flex: 1; -webkit-flex: 1;
        border-right: solid .5px;
        padding:20px;
    }
    .split div:last-child { border-right: none; }
    u {text-decoration: underline;}
    
    a {text-decoration:inherit; color:inherit;}
    a:hover {color: #F0BAD4; cursor: pointer;}
    a > i:hover {color: #F0BAD4;}
    .split .banner a { font-size:15pt; text-decoration:inherit; color:inherit; }
    .split .banner a:hover {color: white;}
    
    .caption { font-size:larger; }
    .caption span { font-size:medium; }
    
    
    /* Flipper Class */
    
    .flipbook {
        display: none;
        justify-content: space-between;     -webkit-justify-content: space-between;
        align-items: center;                -webkit-align-items: center;
        width:100%;
    }
        .show {
            display: flex;                      display: -webkit-flex;
        }
        
        .flipbook > div {
            padding-left: 25px;
            padding-right: 25px;
        }
    
        .flipbook > img {
            background: url(arrows.png) -30px;
            height: 51px; width: 26px;
            cursor: pointer;
        }
        .flipbook > img:first-child {
            background-position: -60px;
        }
        .flipbook > img:hover {
            background-position: 0;
        }
        .flipbook > img:first-child:hover {
            background-position: -90px; 
        }
        
        .flipbook ~ ul {
            list-style-type: none;
            color: rgba(0,0,0,.60);
        }
        .flipbook ~ ul > li {
            display: inline;
        }
        .flipbook ~ ul > li+li:before {
            content: " | " 
        }
        .flipbook ~ ul > li:hover {
            color: #F0BAD4;
            cursor: pointer;
        }
        .flipbook > div img {
            float: left;
            height: 15%;
            padding-right: 10px;
            padding-top: 20px;
        }
        .flipbook > div img ~ p {
            text-align: left;
        }
        
        
            /* Credit Card Form Class */
    .ccForm {
        display: flex;  display: -webkit-flex;
        flex-direction: column; -webkit-flex-direction: column;
    }
    .ccForm div {
        display: flex;  display: -webkit-flex;
        justify-content: space-between; -webkit-justify-content: space-between;
        flex-wrap: nowrap; -webkit-flex-wrap: nowrap;
        white-space: nowrap;
        margin-bottom: 2px;
    }
    .ccForm div div {
        width:100%;
        margin-right:5px;
    }
    .ccForm div div:last-child {
        margin-right:0px;
    }
    .ccForm div div select {
        margin-right:8px;
        margin-left:3px;
        border:none;
        font-family:Century Gothic;
        font-size:small;
    }
    .ccForm div div div {
        border-bottom: solid 2px;
        padding-left: 5px;
        width:100%;
    }
    .ccForm div div div input {
        border: none;
        width:100%;
    }
    .ccForm input[type=submit], .ccForm button {
            width:10%;
            /*font-size:medium;*/
            align-self:center;
    }
    .hidden {
            display:none;
    }
    
    /* Photo Gallery */
    .galleryNav {
        display: flex; display: -webkit-flex;
        width:100%;
        justify-content: space-between;
    }
    .galleryNav > a {
        align-self: center;
    }
    .galleryNav > a > img {
            background: url(arrows.png) -30px;
            height: 51px; width: 26px;
            cursor: pointer;
            align-self: center;
    }
    .galleryNav > a:first-child > img {
        background-position: -60px;
    }
    .galleryNav > a > img:hover {
        background-position: 0;
    }
    .galleryNav > a:first-child > img:hover {
        background-position: -90px; 
    }
    .albumGrid {
        display: flex; display: -webkit-flex;
        flex-direction: column; -webkit-flex-direction: column;
        width:100%;
    }
    .albumGrid div {
        display: flex;
        margin-bottom:10px; 
    }
    .albumGrid div div {
        display: block;
        flex:1; -webkit-flex:1;
        height:20%;
        margin: 5px;
    }
    .albumGrid img {
        max-height:100%;
        max-width:100%;
    }
    .galleryBox {
        width:100%;
    }
    .galleryBox img {
        max-width:100%;
        max-height:100%;
    }
    .hide {
        display:none;
    }