@font-face{
    font-family: 'Sail';
    src: url('Sail-Regular.ttf');
}

@font-face{
    font-family: 'Josefin Sans';
    font-style: normal;
    src: url('JosefinSans-VariableFont_wght.ttf');
}

@font-face{
    font-family: 'Josefin Sans';
    font-style: italic;
    src: url('JosefinSans-Italic-VariableFont_wght.ttf');
}

html, body{
    margin:0;
    padding:0;
    min-height:100%;
    font-family: 'Josefin Sans', sans-serif;
    font-weight: 300;
    color:saddlebrown;
}

body{
    background-color:lightpink;
    background-image:url(images/hearts_bg_transparent.PNG);
    background-repeat: repeat;
    background-size:100px;
    display:flex;
    min-height:100vh;
    background-attachment:fixed;
}

#content{
    width:80%;
    display:flex;
    margin:0 auto;
    padding:0;
}

#left_lace, #right_lace{
    width:100px;
    background-size:80px;
    background-repeat:repeat;
    flex:0 0 80px;
}

#left_lace{
    background-image: url(images/lace_left.PNG);
}

#right_lace{
    background-image:url(images/lace_right.PNG);
}

#center{
    flex-grow:1;
    background-color:floralwhite;
    flex-direction: column;
}

header{
    background-color:lightpink;
    padding:10px;
    border:2px solid white;
    border-bottom:0px;
    
}

h1{
    color:white;
    font-family: 'Sail';
    margin:0;
    text-align: center;
    font-size:30pt;
}

.content{
    display:flex;
    flex-direction:column;
    font-size:14pt;
    flex-grow:1;
}

.content img{
    width:100%;
    border:2px solid lightpink;
    border-radius:20px;
}

.content *{
    margin:0;
    margin-bottom:20px;
}

.content *:last-child{
    margin-bottom:0;
}

.container{
    margin:20px;
    padding:20px;
    background-color:white;
    border:2px solid pink;
    display:flex;
    align-items:flex-start;
    justify-content:center;
}

.bow_left, .bow_right{
    width:50px;
    flex: 0 0 50px;
}

.bow_left{
    margin-right:10px;
}

.bow_right{
    margin-left:10px;
}

nav{
    display:flex;
    text-align:center;
    font-size:14pt;
}

nav div{
    flex-grow:1;
    padding:10px;
    background-color:lightpink;
    border:2px solid white;
    border-right: 0px;
    color:white;
    font-weight:500;
    transition:background-color .35s ease;
}

nav a:last-child div{
    border-right:2px solid white;
    font-family: 'Josefin Sans', sans-serif;
}

nav a{
    flex-grow:1;
    text-decoration:none;
}

nav div:hover{
    background-color: #ff8397;
}