html{
        background: url(/web-pics/carnival.jpg); 
        background-repeat: no-repeat;
        background-attachment: fixed;
        background-position: center;
        background-size:100% 100%;
        color:black;
        
}
.contain {
      background-color: transparent;
      max-width: 980px;
      max-height:fit-content;
      margin: auto 95px 95px 95px;
      display:grid;
      grid-gap:35px;
      grid-template-columns: 250px minmax(0,1fr);
      border:transparent;
      font-size: "rem";
      font-family:Arial, Helvetica, sans-serif;
 }

menu, main, footer { 
    padding-bottom: 7px;
    padding-left: 4px;
    background-color: black;   
    overflow-y:hidden;
    overflow-y:auto;
    overflow-x:hidden;
    color: #fefde9;

}

header {
     color: transparent;
     grid-row: 1/2 ;
     grid-column: 1/3; 
     width:"50%";
     margin:15px;
     
}


menu {
     grid-row:2/3;
     grid-column:1/2;
     border:#ed1e59 ridge 7px;
     width: calc(900px + 0);
     height:200px;
     margin-top:0%;
     background-image:linear-gradient(to bottom, #e00d49, #570019);
     box-shadow: black 5px 5px 15px 1px, black -5px 5px 15px 1px;
}

main {
     background-image:linear-gradient(to bottom, #008cbe, #00435c);
     border:#2d809f ridge 7px; 
     grid-row:2/3;
     grid-column:2/3;
     height:300px;
     width: calc(1200px +0);
       padding-left:6px;
     flex-wrap: wrap;
     box-shadow:#38a54549 2px 2px inset, black 5px 5px 15px 1px, black -5px 5px 15px 1px;

}


footer {
    border-radius: 7px;
    border:#38a545 ridge 4px; 
    background-image:linear-gradient(to bottom, #01bc17,#004a09) ;
    grid-row:4/5;
    grid-column:1/3;
    width:97%;
      padding-left:6px;
    text-align: center;
    padding-top:0%;
    box-shadow:#2d819f6a 2px 2px inset;
    box-shadow: black 5px 5px 15px 1px, black -5px 5px 15px 1px;
}
/*Pear Phone*/
article {
     position: relative;
     grid-row:3/4;
     grid-column: 1/2;
     background-image: url(/web-pics/pearphone.png);
        background-repeat: no-repeat;
        background-attachment: local;
        background-position: center;
        background-size:100% 100%;
     background-color:transparent;
     height: 265px;
     width:395px;

}
.theslap{/*main paragraph*/
     position:absolute;
     top:2em;
     right:5em;
     padding-left: 32%;
     padding-top:2%; 
}
.feeling {/*Feeling + emote*/
     box-shadow: none;
     background-image:none;
     background-color:transparent;
     border:transparent;
     position: absolute;
     bottom:4.7em;
     right: -2.5em;
     color:rgb(177, 17, 118);
     font-family:'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
     font-style: oblique;
     font-weight:bold;
}
.reaction{
     scale: 62%;
     position:absolute;
     top:4.5em;
     left:2.25em;
}
aside {/*links?*/
     justify-self: right;
     background-image:linear-gradient(to bottom, #cf03e6,#590263);
     width:85px;
     grid-row:3/4;
     grid-column:2/3;
     border: #cf03e6 ridge 4px;
     
}

a:link {
   color: black;
   background-color:#fac95f;
   text-decoration: none;
}
 a:active {
   color: #fefde9;
   background-color: #fac95f;
   text-decoration: underline;
}

 a:visited {
   color: #1e6984;
   background-color: #fac95f;
   text-decoration: none;
}

 a:hover {
   color: red;
   background-color: transparent;
   text-decoration: underline;
}
/*scrollbars*/
main, menu, blockquote {
     text-wrap: balance;
     overflow: hidden;
     overflow-y: scroll;
     scrollbar-width: thin;
     scrollbar-color: transparent transparent;
     
}
/*end scrollbars*/
/*start pics between texts*/
.dividers {
     padding:5px 5px;
     display: flex;
     justify-content: center;
     place-items: center;
     width: max-content;
     margin: auto;
}
/*end pics between texts*/
/*menu headings*/
h4 {
     background-color:transparent;
     color: #000000;
     text-align: center;
     width:75%;
     margin: auto 30px;
}