/* removes white space around */
*{

 margin: 0; 
 padding: 0; 
 box-sizing: border-box; 

}

body {
    background-image: url("background.jpg");
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    min-height: 100vh;
    height: 2270px;
    
    *  {color:ghostwhite}

    
    .title {
        width: 100%;
        padding: 60px;
        font-size: 36px;
        background-color: rgba(0, 0, 0, 0.30);
        border-radius: 8px;
        box-shadow: 0 10px 30px rgba(0, 0, 0, 0.4);
        text-align: center;
        border-bottom-left-radius: 10px;
        border-bottom-right-radius: 10px;
        margin-bottom: 20px;
        color: ghostwhite;
        }
    
    .titlename {
        font-family: "Cormorant", serif;
        font-optical-sizing: auto;
        font-weight: 500;
        font-style: normal;
        }
  
    .subtitle {
        font-family: "Cormorant", serif;
        font-optical-sizing: auto;
        font-weight: 200;
        font-style: oblique
        }
    
    .emphasisbox { background-color: #00000080;
        border-radius: 60px;
        box-shadow: 0 0 30px 20px #00000080;
        padding: 20px;
        text-align: center 
        width 70%;          
        max-width: 600px;     
        margin: 0 auto;
    }
    
    .centeremphasis {
    font-family: "Cormorant", serif;
    font-weight: 700;
    font-size: 28px;
    letter-spacing: 0.02em;
    margin-bottom: 40px;
    margin-top: 20px;
        text-align: center }
    
    .emphasisbox2 { background-color: #00000080;
        border-radius: 80px;
        box-shadow: 0 0 50px 40px #00000080;
        padding: 10px;
        text-align: center 
        width 70%;          
        max-width: 500px;     
        margin: 0 auto;
    }
    
    .centeremphasis2 {
    font-family: "Cormorant", serif;
    font-weight: 900;
    font-size: 28px;
    letter-spacing: 0.02em;
    margin-bottom: 20px;
    margin-top: 20px;
        text-align: center }
        
    .h3 {
    margin-bottom: 25px;
    font-family: "Cormorant", serif;
    font-weight: 700;
    font-size: 28px;
    letter-spacing: 0.02em;
        }

    
    
    
    .section1 .content,
    .section3 .content ,
    .pic {
        text-align: center;
        max-width: 700px;
        margin: 0 auto;
        line-height: 30px
        }
    
    .poem {
        background-color: #00000080;
        border-radius: 60px;
        box-shadow: 0 0 35px 50px #00000080;
        padding-bottom: 20px;
        padding-top: 20px;
        font-family: "Manrope", sans-serif;
        font-optical-sizing: auto;
        font-weight: 300;
        font-style: normal;
        font-size: 20px;
        line-height: 35px;
        color:ghostwhite;
        margin-top: 20px;
        margin-bottom: 20px;
        }
    
    .staircase {
         background-color: #00000080;
        border-radius: 10px;
        box-shadow: 0 0 35px 80px #00000080;
        padding-bottom: 1px;
        padding-top: 20px;
         font-family: "Manrope", sans-serif;
        font-optical-sizing: auto;
        font-weight: 300;
        font-style: normal;
        font-size: 20px;
        max-width: auto;
        margin: 0 auto;
        
}

    .line {
  margin-bottom: 12px; text-align: center
        }
    .l1 { margin-left: -400px; }
    .l2 { margin-left: -250px; }
    .l3 { margin-left: -200px; }
    .l4 { margin-left: -150px; }
    .l5 { margin-left: -100px; }
    .l6 { margin-left: -50px; }
    .l7 { margin-left: px; margin-bottom: 50px}
    
    .poem-image {
        border: 10px solid #e4e7e3
    }
}