
@font-face {
    font-family: "OldEnglish" ;
    src: url(fonts/OldEnglishGothicPixelRegular-ow2Bo.ttf);
}
@font-face {
    font-family: "dog" ;
    src: url(fonts/dogicapixel.otf);
}
@font-face {
    font-family: "modern8" ;
    src: url(fonts/ModernDOS8x8.ttf);
}

@font-face {
    font-family: "modern14" ;
    src: url(fonts/ModernDOS8x14.ttf);
}

@font-face {
    font-family: "modern16" ;
    src: url(fonts/ModernDOS9x16.ttf);
}

body {
    cursor: url("cursor/Normal.png"), default;
   font-family: dog ;
   font-size: 10px;
   text-align: left;
   color: #f0f0cc;
}


.main {
    width: 800px;
    border: 5px ridge #855555;
    margin: auto;
    padding: 5px;
    background-color: #f0f0cc;
}

.salmon{
    position: absolute;
    rotate: 40deg;
    left: 900px;
    top: 75px;
    z-index: 2;
    filter: drop-shadow(0 0 3px #5a5a5a);
    
}

.header {
    background: url(Images/header01.png);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    height: 120px;
    border: 5px ridge #855555;
    font-family: OldEnglish ;
    position: relative;
    box-shadow: 0 0 4px 4px #a7aa70 inset
}

/*Header text*/
.header h1{
color: #ffffc7;
position: absolute;
bottom: 0px;
margin-bottom: 0;
left: 8px;
font-size: 50px;
align-items: flex-end;
text-shadow: 2px 0 #a7aa70, -2px 0 #a7aa70, 0 2px #a7aa70, 0 -2px #a7aa70,
             1px 1px #a7aa70, -1px -1px #a7aa70, 1px -1px #a7aa70, -1px 1px #a7aa70;
}

/*Link row*/
.links{
    height: 30px;
    border: 5px ridge #855555;
    margin-top: 5px;
    align-items: center;
    background: url(Images/links03.png);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    box-shadow: 0 0 2px 2px #a7aa70 inset;
    display: grid;
    grid-template-areas: "button button button . . . . . . . . . . . . . . . . . .";
}
/*Removes line under links*/
.links a{
    text-decoration: none;
}

/*Buttons for links*/
.button{
    width: fit-content;
    border: inset thin black;
    padding: 3px;
    font-size: 7px;
    background-color: #a7aa70;
    margin-left: 5px;
    font-family: dog ;
    padding-right: 20px;
    color: #855555;
}

/*blinkies*/
.blinkies{
    height: 20px;
    margin-top: 5px;
    filter: sepia(70%) saturate(1);
    margin-left: 14px;
}

.blinkies:hover{
    filter: none;
}

/*Main container for first page*/
.container{
    display: flex;
    flex-direction: row;
    margin-top: 5px;
}



/*big info box*/
.info{
    width: 500px;
    height: 340px;
    margin-right: 5px;
    background: url(Images/background06.jpg);
    background-repeat: no-repeat;
    background-size: cover;
    padding: 10px 10px 10px 0px;
    border: 5px ridge #855555;
    box-shadow: 0 0 4px 4px #a7aa70 inset;
}

.info p{
    color: #855555;
    margin-left: 6px;
    word-wrap: break-word;
   
}

.title-info{
    background-image: url(Images/background02.png);
    height: 20px;
    padding-top: 5px;
    border-radius: 0px 100px 100px 0px;
    box-shadow: 0 0 2px 2px #855555 inset
}

.title-info p{
   font-family: modern8; 
   color: #855555;
   margin: -3px;
   margin-left: 6px;
   font-size: 20px;
}

.title-info2{
    background-image: url(Images/background02.png);
    height: 20px;
    right: 140px;
    padding-top: 5px;
    border-radius: 0px 100px 100px 0px;
    box-shadow: 0 0 2px 2px #855555 inset 
}

.title-info2 p{
    font-family: modern8; 
   color: #855555;
   margin: -3px;
   margin-left: 6px;
   font-size: 20px;
}

.deer{
    width: 200px;
    float: right;
    padding-top: 10px;
    filter: sepia(70%) saturate(1);
}

.borzoi{
    width: 140px;
    padding-left: 10px;
    float: left;
    padding-top: 10px;
    filter: drop-shadow(0 0 3px #5a5a5a);
}

/*update box*/
.updates{
    width: 300px;
    height: 150px;
    border: 5px ridge #855555;
    background: url(Images/updates04.jpg);
    background-repeat: no-repeat;
    background-size:cover;
    backdrop-filter:sepia(70%) saturate(1);;
    background-position: right;
    color: #855555;
    overflow: scroll;
}


.update-header{
    height: 20px;
    background: url(Images/links03.png);
    border-bottom: 5px ridge #855555;
    font-family: modern8;
    font-size: large;
    padding-left: 5px;
    color: #f0f0cc;
    
}

.update-segments{
    background: url(Images/background02.png);
    height: 15px;
    font-size: 12px;
    font-family: modern8;
    padding-left: 3px;
}

.left-corner{
    display: flex;
    flex-direction: row;
}

/*to-do*/
.to-do-background{
    background: url(Images/background02.png);
    height: 195px;
    width: 194px;
    border: 5px ridge #855555;
    margin-top: 5px;
    box-shadow: 0 0 4px 4px #a7aa70 inset;
    text-align: center;
}

/*stamps*/
.stamps{
    width: 99px;
    height: 204px;
    margin-left: 5px;
    margin-top: 5px;
    margin-right: 5px;
    overflow: scroll;
    filter: sepia(70%) saturate(1);
}

.stamps:hover{
    filter: none;
}

.footer{
    display: flex;
    align-items: center;
    height: 30px;
    border: 5px ridge #855555;
    margin-top: 5px;
    background: url(Images/links03.png);
    background-repeat: no-repeat;
    background-size:cover;
    box-shadow: 0 0 3px 3px #a7aa70 inset;
    

}

.footer p{
    font-family: modern16;
    font-size: medium;
    margin-left: 9px;
}

.footer a{
    margin-left: 9px;
    color: #d2d597;
    text-decoration: none;
}

