#AboutUs{
    width: 75%;
    height: auto;
    display:flex;
    flex-direction: column;
    background-color: rgb(253, 28, 3);
    flex-direction: column;
    font-size: 14pt;
    justify-self: center;
    align-content: center;
}
#AboutUs>*{
    color: white;
}
ul>*{
    color: white;
}
footer>*{
    color: white;
}
#Shopi>*{
    color: white;
}
#Carti>:not(#rec){
    color: white;
}

#Shopi{
    display: grid;
    grid-template-areas: 
    "it1 it2 it3 it4"
    "it5 it6 it7 it8";
    grid-template-rows: 5fr 5fr;
    grid-template-columns: 25% 25% 25% 25%;
    z-index: 2;
    width: 100%;
}
#Carti{
    display: grid;
    grid-template-areas: 
    "itb1 itb2 itb3 itb4"
    "Rec Rec Rec Rec"
    "itb5 itb6 itb7 itb8";
    grid-template-rows: repeat(1fr, 3);
    grid-template-columns: 25% 25% 25% 25%;
}

#rec{
    grid-area: Rec;
    background-color: aqua;
}
#I1{
    grid-area: it1;
    display:flex;
    flex-direction: column;
    background-color: rgb(253, 28, 3);
}
#I2{
    grid-area: it2;
    display:flex;
    flex-direction: column;
    background-color: rgb(253, 28, 3);
}
#I3{
    grid-area: it3;
    display:flex;
    flex-direction: column;
    background-color: rgb(253, 28, 3);
}
#I4{
    grid-area: it4;
    display:flex;
    flex-direction: column;
    background-color: rgb(253, 28, 3);
}
#I5{
    grid-area: it5;
    display:flex;
    flex-direction: column;
    background-color: rgb(253, 28, 3);
}
#I6{
    grid-area: it6;
    display:flex;
    flex-direction: column;
    background-color: rgb(253, 28, 3);
}
#I7{
    grid-area: it7;
    display:flex;
    flex-direction: column;
    background-color: rgb(253, 28, 3);
}
#I8{
    grid-area: it8;
    display:flex;
    flex-direction: column;
    background-color: rgb(253, 28, 3);
}
#Ib1{
    grid-area: itb1;
    display:flex;
    flex-direction: column;
    background-color: rgb(253, 28, 3);
}
#Ib2{
    grid-area: itb2;
    display:flex;
    flex-direction: column;
    background-color: rgb(253, 28, 3);
}
#Ib3{
    grid-area: itb3;
    display:flex;
    flex-direction: column;
    background-color: rgb(253, 28, 3);
}
#Ib4{
    grid-area: itb4;
    display:flex;
    flex-direction: column;
    background-color: rgb(253, 28, 3);
}
#Ib5{
    grid-area: itb5;
    display:flex;
    flex-direction: column;
    background-color: rgb(253, 28, 3);
}
#Ib6{
    grid-area: itb6;
    display:flex;
    flex-direction: column;
    background-color: rgb(253, 28, 3);
}
#Ib7{
    grid-area: itb7;
    display:flex;
    flex-direction: column;
    background-color: rgb(253, 28, 3);
}
#Ib8{
    grid-area: "itb8";
    display:flex;
    flex-direction: column;
    background-color: rgb(253, 28, 3);
}
.img{
    width: 100%;
    display: block;
}
.des{
    display:flex;
    flex-direction: column;
    flex-direction: column;
}
.h{
    width: 100%;
    text-align: center;
}
#hi{
    width: 100%;
    height: auto;
}
.required{
    color: red;
}
#hf{
    height: 3.6in;
    width: 6.5in;
    overflow: hidden;
    font-size: 14pt;
    font-family: 'Times New Roman', Times, serif;
}
body{
    background-color: aqua;
    font-family: 'Times New Roman', Times, serif;
    width: 98.959vw;
}
footer{
    display: flex;
    justify-content: start;
    width: 100%;
    height: fit-content;
    flex-direction: column;
    background-color: green;
}
.social{
    height: 50px;
    width: auto;
    margin-left: 50px;
}
#logo{
    width: 50px;
    height: 50px;
}
ul{
    display: flex;
    flex-direction: row;
    justify-content: space-around;
}
li{
    display: flex;
    align-items: center;
    width: 25%;
}
li:hover{
    cursor: pointer;
}
ul>*{
    border: solid black 1px;
}
nav{
    background-color: blue;
}
#Contactform{
    width: 50%;
    display: grid;
    justify-self: center;
    grid-template-areas: 
    "first last"
    "email email "
    "State Phone"
    "Concern Concern";
}
#fn{
    grid-area: first;
}
#ln{
    grid-area: last;
}
#em{
    grid-area: email;
}
#countree{
    grid-area: State;
}
#tele{
    grid-area: Phone;
}
textarea{
    width: 100%;
    height: 2in;
}
#sitch{
    grid-area: Concern;
}
div{
    display: flex;
    flex-direction: column;
}
.nu{
    display: flex;
    margin: 15%;
    align-content: center;
}