@media (min-width: 1000px)
{
    body > nav > ul {
        display : flex;
        flex-direction: row;
        justify-content: center;
        list-style-type: none;
        gap : 1% 1%;
        background-color: red;
        margin: 0;
        padding: 0.5%;
    }
    body > nav > ul > li{
        border : 1px solid black;
        padding: 0.3%;
        background-color:rgb(138, 97, 97) ;
        border-radius: 10px;
    }

    body > nav > ul > li:nth-child(1){
        border : 1px solid black;
        padding: 0.3%;
        background-color:rgb(209, 68, 68) ;
        border-radius: 10px;
    }

    nav > ul > li > a{
        font-family: "Quintessential", serif;
        font-weight: 400;
        font-style: normal;
        text-decoration: none;
        color : white;
    }

    footer > nav > ul > li > a{
        font-family: "aerial";
        font-weight: 400;
        font-style: normal;
        text-decoration: underline;
        color : white;
    }

    footer > nav > ul {
        display : flex;
        flex-direction: row;
        justify-content: center;
        list-style-type: none;
        gap : 5% 5%;
        margin: 0;
        padding-bottom: 5px ;
        background-color: rgb(87, 3, 3);
    }

    footer > p {
        display : flex;
        flex-direction: row;
        justify-content: center;
        list-style-type: none;
        margin: 0;
        background-color: rgb(87, 3, 3);
        color: white;
    }

    footer > nav > ul li a {
        color: rgb(196, 140, 149);
    }

    main > section:nth-child(1){
        position : relative;
        height: 300px;
    }

    main > section > img{
        width: 100%;
        height: 100%;
        object-fit: cover;
    }

    h1 + p {
        position : absolute;
        color : white;
        text-align: center;
        left : 52%;
        top : 65%;
        transform: translate(-50%, -50%);
        font-size: 2em;
    }

    main > section > h1 {
        font-family: "Quintessential", serif;
        font-size: 3em;
        position : absolute;
        text-align: center;
        left : 52%;
        top : 20%;
        transform: translate(-50%, -50%);
        color : white;
    }

    main > section:nth-child(2){
        border : 1px solid black;
        margin: 10px 15px;
        background-color:rgb(184, 24, 24) ;
        border-radius: 10px;
        height: 20%;
    }

    main > section:nth-child(2) > h2{
        text-align: center;
        font-family: "Quintessential", serif;
        font-size: 2em;
        color : white;
    }

    main > section:nth-child(2) > p{
        text-align: center;
        color : rgb(211, 198, 198);
        font-size: 1.5em;
    }

    main > section:nth-child(2) > ul{
        display: flex;
        flex-direction: row;
        gap : 25px;
        justify-content: center;
        list-style-type: none;
        padding-bottom: 5px;
    }

    main > section:nth-child(2) > ul > li:nth-child(1){
        background-color: rgb(128, 33, 33);
        border-radius: 10px;
        font-size: 1.2em;
    }

    main > section:nth-child(2) > ul > li:nth-child(2){
        background-color: rgb(128, 33, 33);
        border-radius: 10px;
        font-size: 1.2em;
    }

    main > section:nth-child(2) > ul > li:nth-child(3){
        background-color: rgb(128, 33, 33);
        border-radius: 10px;
        font-size: 1.2em;
    }

    main > section:nth-child(2) > ul > li > p{
        color : rgb(211, 198, 198);
        padding: 0 10px;
    }

    main > section:nth-child(2) > ul > li > p > em > a{
        color : rgb(211, 198, 198);
        text-decoration: none;
    }

    main > section:nth-child(3){
        display: flex;
        flex-direction: column;
        border : 2px solid red;
        margin: 10px 15px;
        padding:  0px 0px  5px 0px;
        border-radius: 10px;
    }

    main > section:nth-child(3) > h3{
        font-family: "Quintessential", serif;
        font-size: 2em;
        text-align: center;
    }

    main > section:nth-child(3) > p{
        font-family: "Quintessential", serif;
        font-size: 1.5em;
        text-align: center;
    }

    main > section:nth-child(3) div {
        display: flex;
        flex-direction: row;
        justify-content: space-around;
        list-style-type: none;
    }

    main > section:nth-child(3) article {
        border : 1px solid black;
        background-color:  rgb(221, 177, 185);
        border-radius: 10px;
        text-align: center;
        width: 30%;
    }

    main > section:nth-child(3)  div  article  img{
        object-fit: cover;
        height: 91%;
        width: 95%;
        border : 7px  solid rgb(221, 177, 185);
        border-radius: 10px;
    }

    article > h4 > em{
        border : 1px solid black;
        position: absolute;
        top: 2%;
        left:2.5%;
        background-color: rgba(255, 255, 255, 0.562);
        font-size: 2em;
    }

    article{
        position: relative;
    }

    article:nth-child(1) > p{
        border : 1px solid black;
        position: absolute;
        bottom:-2%;
        left:2%;
        background-color: rgb(236, 101, 123);
        width : 95%;
        font-size: 1.2em;
    }

    article:nth-child(2) > p{
        border : 1px solid black;
        position: absolute;
        bottom: -2%;
        left:2%;
        background-color: rgb(236, 101, 123);
        width : 95.3%;
        font-size: 1.2em;
    }

    article:nth-child(3) > p{
        border : 1px solid black;
        position: absolute;
        bottom:-2%;
        left:2%;
        background-color: rgb(236, 101, 123);
        width : 95%;
        font-size: 1.2em;
    }
}

@media (max-width: 700px){
        body > nav > ul {
        display : flex;
        flex-direction: row;
        justify-content: center;
        flex-wrap: wrap;
        list-style-type: none;
        gap : 1% 1%;
        background-color: red;
        margin: 0;
        padding: 0.5%;
    }

    body > nav > ul > li{
        border : 1px solid black;
        padding: 1%;
        background-color:rgb(138, 97, 97) ;
        border-radius: 10px;
        font-size: 1em;
    }

    body > nav > ul > li:nth-child(1){
        border : 1px solid black;
        padding: 1%;
        background-color:rgb(209, 68, 68) ;
        border-radius: 10px;
        font-size: 1em;
    }

    

    nav > ul > li > a{
        font-family: "Quintessential", serif;
        font-weight: 400;
        font-style: normal;
        text-decoration: none;
        color : white;
    }

    footer > nav > ul > li > a{
        font-family: "aerial";
        font-weight: 400;
        font-style: normal;
        text-decoration: underline;
        color : white;
        font-size: 0.8em;
    }

    footer > nav > ul {
        display : flex;
        flex-direction: row;
        justify-content: center;
        list-style-type: none;
        gap : 5% 5%;
        margin: 0;
        padding: 0;
        padding-bottom: 5px ;
        background-color: rgb(87, 3, 3);
    }

    footer > p {
        display : flex;
        flex-direction: row;
        justify-content: center;
        list-style-type: none;
        margin: 0;
        background-color: rgb(87, 3, 3);
        color: white;
    }

    footer > nav > ul li a {
        color: rgb(196, 140, 149);
    }

    main > section:nth-child(1){
        position : relative;
        height: 150px;
    }

    main > section > img{
        width: 100%;
        height: 100%;
        object-fit: cover;
    }

    h1 + p {
        position : absolute;
        color : white;
        text-align: center;
        left : 52%;
        top : 65%;
        transform: translate(-50%, -50%);
        font-size: 1em;
    }

    main > section > h1 {
        font-family: "Quintessential", serif;
        font-size: 1.5em;
        position : absolute;
        text-align: center;
        left : 52%;
        top : 20%;
        transform: translate(-50%, -50%);
        color : white;
    }

    main > section:nth-child(2){
        border : 1px solid black;
        margin: 5px 0px;
        background-color:rgb(184, 24, 24) ;
        border-radius: 10px;
    }

    main > section:nth-child(2) > h2{
        text-align: center;
        font-family: "Quintessential", serif;
        font-size: 1.5em;
        color : white;
    }

    main > section:nth-child(2) > p{
        text-align: center;
        color : rgb(211, 198, 198);
    }

    main > section:nth-child(2) > ul{
        display: flex;
        flex-direction: column;
        gap : 5px;
        justify-content: center;
        list-style-type: none;
    }

    main > section:nth-child(2) > ul > li:nth-child(1){
        background-color: rgb(128, 33, 33);
        border-radius: 10px;
    }

    main > section:nth-child(2) > ul > li:nth-child(2){
        background-color: rgb(128, 33, 33);
        border-radius: 10px;
    }

    main > section:nth-child(2) > ul > li:nth-child(3){
        background-color: rgb(128, 33, 33);
        border-radius: 10px;
    }

    main > section:nth-child(2) > ul > li > p{
        color : rgb(211, 198, 198);
        padding: 0 0 0 10px;
    }

    main > section:nth-child(2) > ul > li > p > em > a{
        color : rgb(211, 198, 198);
        text-decoration: none;
    }

    main > section:nth-child(3){
        display: flex;
        flex-direction: column;
        flex-wrap: wrap;
        border : 2px solid red;
        margin: 0px 1px;
        padding:  0px 0px  10px 0px;
        border-radius: 10px;
    }

    main > section:nth-child(3) > h3{
        font-family: "Quintessential", serif;
        font-size: 1.5em;
        text-align: center;
    }

    main > section:nth-child(3) > p{
        font-family: "Quintessential", serif;
        font-size: 1em;
        text-align: center;
    }

    main > section:nth-child(3) div {
        display: flex;
        flex-direction: column;
        justify-content: center;
        list-style-type: none;
    }

    main > section:nth-child(3) article {
        border : 1px solid black;
        background-color:  rgb(221, 177, 185);
        border-radius: 10px;
        text-align: center;
        left: 4%;
        width: 90%;
    }

    main > section:nth-child(3)  div  article  img{
        object-fit: cover;
        height: 91%;
        width: 95%;
        border : 7px  solid rgb(221, 177, 185);
        border-radius: 10px;
    }

    article > h4 > em{
        border : 1px solid black;
        position: absolute;
        top: 2%;
        left:2.5%;
        background-color: rgba(255, 255, 255, 0.562);
        font-size: 1.5em;
    }

    article{
        position: relative;
    }

    article:nth-child(1) > p{
        border : 1px solid black;
        position: absolute;
        bottom:-2%;
        left:2%;
        background-color: rgb(236, 101, 123);
        width : 95%;
    }

    article:nth-child(2) > p{
        border : 1px solid black;
        position: absolute;
        bottom: -2%;
        left:2%;
        background-color: rgb(236, 101, 123);
        width : 95.3%;
    }

    article:nth-child(3) > p{
        border : 1px solid black;
        position: absolute;
        bottom:-2%;
        left:2%;
        background-color: rgb(236, 101, 123);
        width : 95%;
    }

}

@media (min-width: 701px) and (max-width: 999px)
{
    body > nav > ul {
        display : flex;
        flex-direction: row;
        justify-content: center;
        list-style-type: none;
        gap : 1% 1%;
        background-color: red;
        margin: 0;
        padding: 0.5%;
    }
    body > nav > ul > li{
        border : 1px solid black;
        padding: 0.3%;
        background-color:rgb(138, 97, 97) ;
        border-radius: 10px;
    }

    body > nav > ul > li:nth-child(1){
        border : 1px solid black;
        padding: 0.3%;
        background-color:rgb(209, 68, 68) ;
        border-radius: 10px;
    }

    nav > ul > li > a{
        font-family: "Quintessential", serif;
        font-weight: 400;
        font-style: normal;
        text-decoration: none;
        color : white;
    }

    footer > nav > ul > li > a{
        font-family: "aerial";
        font-weight: 400;
        font-style: normal;
        text-decoration: underline;
        color : white;
    }

    footer > nav > ul {
        display : flex;
        flex-direction: row;
        justify-content: center;
        list-style-type: none;
        gap : 5% 5%;
        margin: 0;
        padding-bottom: 5px ;
        background-color: rgb(87, 3, 3);
    }

    footer > p {
        display : flex;
        flex-direction: row;
        justify-content: center;
        list-style-type: none;
        margin: 0;
        background-color: rgb(87, 3, 3);
        color: white;
    }

    footer > nav > ul li a {
        color: rgb(196, 140, 149);
    }

    main > section:nth-child(1){
        position : relative;
        height: 300px;
    }

    main > section > img{
        width: 100%;
        height: 100%;
        object-fit: cover;
    }

    h1 + p {
        position : absolute;
        color : white;
        text-align: center;
        left : 52%;
        top : 65%;
        transform: translate(-50%, -50%);
        font-size: 2em;
    }

    main > section > h1 {
        font-family: "Quintessential", serif;
        font-size: 3em;
        position : absolute;
        text-align: center;
        left : 52%;
        top : 20%;
        transform: translate(-50%, -50%);
        color : white;
    }

    main > section:nth-child(2){
        border : 1px solid black;
        margin: 10px 15px;
        background-color:rgb(184, 24, 24) ;
        border-radius: 10px;
        height: 20%;
    }

    main > section:nth-child(2) > h2{
        text-align: center;
        font-family: "Quintessential", serif;
        font-size: 2em;
        color : white;
    }

    main > section:nth-child(2) > p{
        text-align: center;
        color : rgb(211, 198, 198);
    }

    main > section:nth-child(2) > ul{
        display: flex;
        flex-direction: row;
        gap : 25px;
        justify-content: center;
        list-style-type: none;
        padding-bottom: 5px;
    }

    main > section:nth-child(2) > ul > li:nth-child(1){
        background-color: rgb(128, 33, 33);
        border-radius: 10px;
    }

    main > section:nth-child(2) > ul > li:nth-child(2){
        background-color: rgb(128, 33, 33);
        border-radius: 10px;
    }

    main > section:nth-child(2) > ul > li:nth-child(3){
        background-color: rgb(128, 33, 33);
        border-radius: 10px;
    }

    main > section:nth-child(2) > ul > li > p{
        color : rgb(211, 198, 198);
        padding: 0 10px;
    }

    main > section:nth-child(2) > ul > li > p > em > a{
        color : rgb(211, 198, 198);
        text-decoration: none;
    }

    main > section:nth-child(3){
        display: flex;
        flex-direction: column;
        border : 2px solid red;
        margin: 10px 15px;
        padding:  0px 0px  5px 0px;
        border-radius: 10px;
    }

    main > section:nth-child(3) > h3{
        font-family: "Quintessential", serif;
        font-size: 2em;
        text-align: center;
    }

    main > section:nth-child(3) > p{
        font-family: "Quintessential", serif;
        font-size: 1.5em;
        text-align: center;
    }

    main > section:nth-child(3) div {
        display: flex;
        flex-direction: row;
        justify-content: space-around;
        list-style-type: none;
    }

    main > section:nth-child(3) article {
        border : 1px solid black;
        background-color:  rgb(221, 177, 185);
        border-radius: 10px;
        text-align: center;
        width: 30%;
    }

    main > section:nth-child(3)  div  article  img{
        object-fit: cover;
        height: 91%;
        width: 95%;
        border : 7px  solid rgb(221, 177, 185);
        border-radius: 10px;
    }

    article > h4 > em{
        border : 1px solid black;
        position: absolute;
        top: 3.7%;
        left: 2.6%;
        background-color: rgba(255, 255, 255, 0.562);
        font-size: 1.5em;
    }

    article{
        position: relative;
    }

    article:nth-child(1) > p{
        border : 1px solid black;
        position: absolute;
        bottom:-4%;
        left:2.5%;
        background-color: rgb(236, 101, 123);
        width : 95%;
    }

    article:nth-child(2) > p{
        border : 1px solid black;
        position: absolute;
        bottom: -4%;
        left:2.5%;
        background-color: rgb(236, 101, 123);
        width : 95.3%;
    }

    article:nth-child(3) > p{
        border : 1px solid black;
        position: absolute;
        bottom:-4%;
        left:2.5%;
        background-color: rgb(236, 101, 123);
        width : 95%;
    }
}