﻿/*custom fonts*/

@font-face {
    font-family: 'caviar';
    src: url('../fonts/CaviarDreams-webfont.woff');
}



@font-face {
    font-family: 'linedrawn_bold';
    src: url('../fonts/Archistico_reg-webfont.woff');
}

@font-face {
    font-family: 'linedrawn';
    src: url('../fonts/Archistico_Bold-webfont.woff');
}

@font-face {
    font-family: 'dots';
    src: url('../fonts/BPdotsBold-webfont.woff');
}

@font-face {
    font-family: 'dots-line';
    src: url('../fonts/BPdotsMinusBold-webfont.woff');
}



/*styling here will apply to the body of the page */

body {
    font-family:caviar;
    

   background:
linear-gradient(27deg, #151515 5px, transparent 5px) 0 5px,
linear-gradient(207deg, #151515 5px, transparent 5px) 10px 0px,
linear-gradient(27deg, #222 5px, transparent 5px) 0px 10px,
linear-gradient(207deg, #222 5px, transparent 5px) 10px 5px,
linear-gradient(90deg, #1b1b1b 10px, transparent 10px),
linear-gradient(#1d1d1d 25%, #1a1a1a 25%, #1a1a1a 50%, transparent 50%, transparent 75%, #242424 75%, #242424);
background-color: #131313;
background-size: 20px 20px;

background-attachment: fixed;


}

/*styling for main HTML tag sections. Organized in the order they appear on the HTML page (header to footer)*/
a {
    color:#e0b974;
}

a:hover {
    color:#ffffff;
    text-decoration:none;
}


header {
    height: 400px;
    width: 100%;
    background-color: #808080;
    background-image: url('../images/headerbg.png');
    background-position:left;
    background-size:cover;
    padding-left:5px;
    overflow-y:hidden;
    

}

h1 {
    font-family:linedrawn;
    font-size:4.5em;
    top:10px;
    
    
    
}

/*e7e6f7,e3d0d8,aea3b0,827081,c6d2ed*/

nav {
    margin-bottom: 40px;
    background-color:#000000;
    color:#ffffff;
    font-family: dots;
    text-align:center;
    font-size:1.5em;
    padding-top:5px;
    padding-bottom:5px;
    position:sticky;
    top:0px;
}

section {
    
    margin-bottom: 40px;
    padding-left: 5px;
    /*background-color:#69635d;*/
    
}

h2 {
    font-family:linedrawn;
    font-size:3em;
    color:#000000;
    padding:8px;

}

[class*="hmod"] {
    border: 1px solid #282828;
    border-bottom-left-radius:20px;
    border-top-right-radius: 20px;
    margin-bottom:5px;
    background-repeat:no-repeat;
    background-position:left,right;
    background-color:#ffffff;
    text-align:right;
}

.hmod01 {
    
    background-image:url('../images/bg01.png'),url('../images/bg01r.png');
    
    
}

.hmod02 {
    background-image:url('../images/bg02.png'), url('../images/bg02r.png');
}

.hmod03 {
    background-image:url('../images/bg03.png'), url('../images/bg03r.png');
}

.hmod04 {
    background-image:url('../images/bg04.png'), url('../images/bg04r.png');
}

.hmod05 {
    background-image:url('../images/bg05.png'), url('../images/bg05r.png');
}


section {
    width:80%;
    margin-left:auto;
    margin-right:auto;
    color:#ffffff;
    padding-left:5px;
    padding-bottom:5px;
    border-radius:10px;
}

ul {
    list-style-type:square;
    
}

p, ul, ol {
    font-size:1.5em;
}

h3, h4 {
           font-family:dots-line;
                    
       }

h3 {
    font-size:2em;
    color:#e6f4ea;
}

h4 {
    font-size:1.5em;
    color:#fcf6df;
}

article.mod01 section {
    background-color:#6f6962;
}

    



article.mod02 section {
    background-color:#616c62;

}



article.mod03 section {
    background-color:#5e666c;
}

article.mod04 section {
    background-color:#66656b;
}

article.mod05 section {
    background-color:#6b6062;
}

.center {
    text-align:center;
}



[id*="assess"] ol li  {
    list-style-type:none;
}




.topnav {
    display:inline-block;
    position:fixed; /*keep the button on the page all the time*/
    bottom:10px;
    right:10px;
    color:rgba(209, 205, 190, 0.82); /*last number is the transparency index*/
    text-align:center;
    z-index: 10;
}

.endsection:after {
    display: block; 
  content: " "; 
  height: 800px; 
  visibility: hidden; 
}

.spacer:before {
    display:block;
    content:" ";
    height:40px;
    visibility:hidden;
}

footer {
    background-color:#271e1e;
    color: #d4d4d4;
    text-align:center;
    border: 1px solid rgba(132, 108, 91, 0.80);
    border-top-left-radius:10px; 
    border-bottom-right-radius:10px;
}

