@font-face {
    font-family: 'divine_and_earthly_imperiumRg';
    src: url('../fonts/divine_and_earthly_imperium-webfont.woff2') format('woff2'),
         url('../fonts/divine_and_earthly_imperium-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'requiem_for_aregular';
    src: url('../fonts/requiem_for_a-webfont.woff2') format('woff2'),
         url('../fonts/requiem_for_a-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'requiemregular';
    src: url('../fonts/requiem-webfont.woff2') format('woff2'),
         url('../fonts/requiem-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'jibriel_smalljibrielsmallcaps';
    src: url('../fonts/jibriel_small_caps-webfont.woff2') format('woff2'),
         url('../fonts/jibriel_small_caps-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'Wingdings';
    src: local('Wingdings'),
        url('../fonts/wingding.woff') format('woff');
    font-style: normal;
    font-weight: normal;    
}

body {
    background-color: #000;
    color: #fff;
    margin-top: 75px;
}
header, footer {
    margin: 0 auto;
    max-width: 1920px;
}
header {
    background-color: #000;
}
header a {
    color: #fff;
    text-decoration: none;
}
header a:hover {
    color: #eee;
    text-decoration: none;
}  
header a.nav-link {
    color: #b11f24;
    text-decoration: none;
}
header a.nav-link:hover {
    color: #fff;
    text-decoration: none;
}               
header h1 {
    margin: 0;
    font-size: 1.5em;
    font-family: 'jibriel_smalljibrielsmallcaps';

    font-weight: normal;
    letter-spacing: 10px;
    text-shadow: 5px 5px 5px #000, 2px 2px #000;
}
header h1 em {
    font-family: 'Wingdings';
    font-weight: normal;
    font-style: normal;
    color: #b11f24;
}           
header h1 img {
    position: relative;
    top: -5px;
    height: 70px                
}
header p em {
    color: #b11f24;
    font-style: normal;
}
header nav {
    box-shadow: 0 5px 50px #000, 0 5px 50px #000, 0 5px 50px #000;    
}
header nav.bg-dark, header .text-bg-dark {
    background-color: #000 !important;
}
.intro {
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
    position: relative;

    background-color: #697279;
    overflow: hidden;
    text-align: center;
    /* clear: both; */        
}
.intro h1 {
    opacity: 0;    
    font-size: 6em;
    font-family: 'jibriel_smalljibrielsmallcaps';                

    display: block;
    margin: 0 0 0.25em;
    color: #ccc;
    text-shadow: 5px 5px 5px #000, 2px 2px #000;        
}   
.intro h2 {
    opacity: 0;    
    font-size: 2em;
    font-family: 'requiem_for_aregular';                

    display: block;
    margin: 0 0 0.25em;
    color: #ccc;
    text-shadow: 5px 5px 5px #000, 2px 2px #000;        
}   
.intro h1 em, .intro h2 em, .intro h3 em {
    font-style: normal;
    font-size: 1.75em;
    position: relative;
    top: 15px;
    color: #ddd;
}                   
.intro h3 {
    opacity: 0;             
    font-size: 2em;
    font-family: 'requiem_for_aregular';
    display: block;
    font-weight: lighter;
    margin: 0 0 0.25em;
    color: #ccc;
    text-shadow: 5px 5px 5px #000, 2px 2px #000;        
}   

.title {
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
    position: relative;

    background-color: #697279;
    padding: 50px 0;
    overflow: hidden;
    text-align: center;
    /* clear: both; */        
}
.title h2 {
    opacity: 0;    
    font-size: 2em;
    font-family: 'requiem_for_aregular';                

    display: block;
    margin: 0 0 0.25em;
    color: #ccc;
    text-shadow: 5px 5px 5px #000, 2px 2px #000;        
}               
.title h3 {
    opacity: 0;             
    font-size: 2em;
    font-family: 'requiem_for_aregular';
    display: block;
    font-weight: lighter;
    margin: 0 0 0.25em;
    color: #ccc;
    text-shadow: 5px 5px 5px #000, 2px 2px #000;        
}  
.title h1 em, .title h2 em, .title h3 em {
    font-style: normal;
    font-size: 1.75em;
    position: relative;
    top: 15px;
    color: #ddd;
}   
.calig {
    font-family: 'requiem_for_aregular';      
}
.calig small {
    font-family: times;
    color: #b11f24;
}
.trenchcrusade .get-miniatures img {
    border: 3px solid black;
    transition: border 0.5s ease;

}
.trenchcrusade .get-miniatures:hover img {
    border: 3px double #b11f24;
}
.timeline p em {
    color: #b11f24;
    font-family: 'jibriel_smalljibrielsmallcaps';
    font-style: normal;
}

@media (min-width: 620px) {
    body {
        margin-top: 125px;
    }               
    header h1 {
        font-size: 3em;
    }    
    header h1 img {
        position: relative;
        top: -10px;
        height: 120px;          
    }   
    .intro h2 {
        font-size: 3em;         
    }   
    .intro h2 em {
        font-size: 1.75em;
    }                   
    .intro h3 {
        font-size: 3em;     
    } 
    .title h2 {
        font-size: 5em;         
    }   
    .title h2 em {
        font-size: 1.75em;
    }                   
    .title h3 {
        font-size: 3em;     
    }                                                   
}               
img {
    max-width: 100%;
}
p a, p a:visited {
    color: #b11f24;
    border-bottom: 1px dotted;
    text-decoration: none;
}
p a:hover, p a:active {
    color: #e31219;
    border-bottom: 3px double;
}
.bg1 {
    background: #000 url(/images/battlefield.jpg) 50% 0 no-repeat fixed;
}
.bg2 {
    background: #000 url(/images/procession.jpg) 50% 0 no-repeat fixed;
}
.bg3 {
    background: #000 url(/images/artillery-battery_trench-crusade.jpg) 50% 0 no-repeat fixed;
}  

.bg4 {
    background: #000 url(/images/larval-beast-lord.jpg) 50% 0 no-repeat fixed;
}
.bg5 {
    background: #000 url(/images/battlefield-assassin.jpg) 50% 0 no-repeat fixed;
}
.bg6 {
    background: #000 url(/images/black-grail.jpg) 50% 0 no-repeat fixed;
}
.bg7 {
    background: #000 url(/images/legions-of-the-damned_trench-crusade.jpg) 50% 0 no-repeat fixed;
}
.bg8 {
    background: #000 url(/images/trench-pilgrims_illustration.jpg) 50% 0 no-repeat fixed;
}
.bg9 {
    background: #000 url(/images/heretic-legion.jpg) 50% 0 no-repeat fixed;
}
.bg10 {
    background: #000 url(/images/new-antioch.jpg) 50% 0 no-repeat fixed;
}
.bg11 {
    background: #000 url(/images/zygotic-lord.jpg) 50% 0 no-repeat fixed;
}

footer { 
    clear: both;
    margin: 10em auto 10em;
    text-align: center;
}
.hideme {
    opacity: 0;
}