* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

#box {
    background-image: url("https://www.jcrew.com/brand_creative/homepage2022/07-Jul4/2022jul_0719_hp_w_img0_v2.jpg");
    width: 100vw;
    height: 100vh;
    margin-left: 0px;
    background-repeat: no-repeat;
    background-size: 100vw 100vh;
    /* text-align: center; */
    /* padding: 10px; */
}

#box>div {
    width: 60%;
    /* border: 1px solid red; */
    margin: auto;
    text-align: center;
    height: 100%;
    /* line-height:10px; */
    padding-top: 200px;
    background: transparent;

}
#box>div>h1{
    font-family: "Times New Roman" - 400;
}




#box>div>p:nth-child(1) {
    color: white;
    font-size: 50px;
    /* margin: 70px 0px 0px 0px; */
    margin-top: 0px;
    background: transparent;


}

#box>div>p:nth-child(2) {
    /* color: brown;
    font-size: 90px; */
    color: #cf6026 ;
    font-size: 120px;
    font-family: 'Kaisei Opti', serif;
    margin-top: -40px;
    
    background: transparent;

}

#box>div>p:nth-child(3) {
    color: white;
    font-size: 20px;
    margin-bottom: 50px;
    background: transparent;

}

#box>div>a:nth-child(4) {
    /* border: 1px solid red; */
    font-size: 18px;
    color: white;
    background: transparent;
}

/* *************************** */

#main {
    display: flex;
    position: absolute;

    right: 1px;
    left: 0px;
    /* width: 100px; */

}

#main>img {
    width: 500px;
    margin: auto;
    /* margin-left: 20%; */


}





/* ******GReen**** */


#green>div:nth-child(1) {
    /* border: 1px solid red; */
    background-color: #c7ca99;
    margin-top: 40px;
    padding-top: 40px;
    display: flex;
    gap: 5px;


    width: 100vw;

    /* margin-top: 20px; */
}

#green>div:nth-child(1)>img {
    background-color: #c7ca99;
    width: 13vw;
    margin-left: 45vw;
    height: 170px;
}

#green>div>img+p {
    /* border: 1px solid red; */
    height: 50px;
    margin-top: 150px;
    margin-left: 250px;
    font-weight: bold;

    background: transparent;





}

#green>div:nth-child(2) {
    background-color: #c7ca99;
    /* margin-top: 50%; */
    display: flex;
    justify-content: center;

    gap: 26px;
    /* border: 1px solid red; */
    height: 700px;
    width: 100vw;
    /* margin-bottom: 100px; */
    /* border: 1px solid green; */


}


#green>div:nth-child(2)>div {

    margin-top: 0px;
    width: 26vw;

    background: transparent;

}

#green>div:nth-child(2)>div>img {
    width: 100%;


}

.para {
    font-size: 17px;
    font-family: soleil, Helvetica, Arial, sans-serif;
    background: transparent;
}

.headline {
    font-family: freight-big-pro, Times, serif;
    font-weight: 350;
    background: transparent;
}

.underline {
    line-height: 40px;
    text-decoration: underline;
    font-family: soleil, Helvetica, sans-serif;
    font-weight: 700;
    background: transparent;
}



/* *******MOre_story******* */

#more_story {
    /* border: 1px solid red; */
    display: flex;
    justify-content: center;
    gap: 26px;
    /* border: 1px solid red; */
    height: 500px;
    width: 100vw;
    background-color: #c7ca99;
    margin-bottom: 20vh;

}

#more_story>div {
    /* border: 1px solid red; */
    background-color: #c7ca99;
    width: 15vw;
    gap: 20px;
}

#more_story>div>img {
    width: 100%;

}

.more_headline {
    background-color: #c7ca99;
    font-family: freight-big-pro, Times, serif;
    font-size: 52px;
    font-weight: 200;
    padding-left: 230px;
    padding-bottom: 50px;
}

.more_para2 {
    font-family: soleil, Helvetica, sans-serif;
    width: auto;
    text-decoration: underline;
    font-size: 14px;
    line-height: 37px;
    font-weight: bold;
    background: transparent;
}

.more_headline2 {
    font-family: freight-big-pro, Times, serif;
    font-weight: 400;
    font-size: 24px;
    line-height: 29px;
    background: transparent;
}




/* ******LOVE****** */

#love>div:nth-child(1) {
    background-image: url("https://www.jcrew.com/s7-img-facade/AY634_BK0001_m?wid=376");

}

#love>div:nth-child(2) {
    background-image: url("https://www.jcrew.com/s7-img-facade/BH543_WT0002?wid=376");
}

#love>div:nth-child(3) {
    background-image: url("https://www.jcrew.com/s7-img-facade/BE870_PP3492?wid=376");
}

#love>div:nth-child(4) {
    background-image: url("https://www.jcrew.com/s7-img-facade/H5809_PK5352_m?wid=376");
}

#love>div:nth-child(5) {
    background-image: url("https://www.jcrew.com/s7-img-facade/BF793_WO8694?wid=376");
}

#love>div:nth-child(6) {
    background-image: url("https://www.jcrew.com/s7-img-facade/BF389_BR6203_m?wid=376");
}

.hov_content {
    display: none;
    margin-top: 140px;
    font-size: 17px;
    background-color: rgba(255, 255, 255, 0.6);
}

.hover_show:hover .hov_content {
    display: inline-block;
    /* border: 1px solid red; */
}

#we_love {
    font-family: freight-big-pro, Times, serif;
    font-weight: 400;
    font-size: 36px;
    margin-left: 30px;
}

#love {
    display: flex;
    justify-content: center;
    gap: 15px;

}

#love>div {
    width: 200px;
    height: 250px;
    background-position: center;
    background-size: cover;
}

.fa-heart {
    /* background-color: white; */
    margin-left: 165px;
    margin-top: 15px;
}





/* ******re_image******* */
#re_image_headline {
    /* border: 1px solid red; */
    text-align: center;
    align-items: center;
    font-family: freight-big-pro - 400;
    font-size: 36px;
    line-height: 32px;
    font-weight: 400;
    margin-top: 150px;
}

#re_image {
    /* border: 1px solid orange; */
    display: flex;
    justify-content: center;
    gap: 25px;
    height: 500px;
    width: 100vw;
    margin-bottom: 20vh;
    margin-top: 50px;
    /* margin-left: 50px; */

}

#re_image>div {
    /* border: 1px solid red; */
    width: 30%;
    height: auto;
    background: transparent;

}

#re_image>div>img {
    width: 100%;
}

.re_image_headline {
    font-size: 24px;
    font-family: freight-big-pro - 400;
    line-height: 31px;
    font-weight: 400;
}

.re_image_para {
    font-family: soleil - 700;
    font-size: 14px;
    line-height: 27px;
    font-weight: 700;
    text-decoration: underline;
    font-weight: bold;

}

#insta_headline {
    text-align: center;
    font-family: freight-big-pro - 400;
    font-size: 36px;
    font-weight: 500;
    /* line-height: 32px; */
    /* padding-bottom: 40px; */
}

#insta_para {
    text-align: center;
    font-family: soleil, Helvetica, sans-serif;
    font-weight: 400;
    line-height: 2;
    font-weight: bold;
    font-size: 19px;
    /* padding-bottom: 40px; */
}

#instagram {
    /* border: 1px solid red; */
    display: flex;
    justify-content: center;
    gap: 50px;
    width: 100%;

}

#instagram>div {
    width: 20vw;
    height: 340px;
    background-position: center;
    background-size: cover;
}

#instagram>div:nth-child(1) {
    background-image: url("https://edge.curalate.com/v1/img/OTj4csjB4WFTsgPslA6Y5-yvWTrBYOj5PhA4SP92sqA=/w/450?typ=webp");
}

#instagram>div:nth-child(2) {
    background-image: url("https://edge.curalate.com/v1/img/ToBFDxTc90euACmuXlCyok9Ks33RHbkFAm9Sq1VyUFI=/w/600?typ=webp");
}

#instagram>div:nth-child(3) {
    background-image: url("https://edge.curalate.com/v1/img/-Fsqv0sA4n1JyFB9PiSqnn6wWt7KZn8TSmxubvkuyF0=/w/600?typ=webp");
}

#instagram>div:nth-child(4) {
    background-image: url("https://edge.curalate.com/v1/img/lEPiM6cB0ZtOiKRSKFzPu07f2TKMOf3liwXDuc55pc8=/w/450?typ=webp");
}

.insta_hover {
    height: 100%;
    display: none;
    background-color: rgba(255, 255, 255, 0.6);
}

.insta_hover>p:first-child {
    font-weight: bold;
    font-family: sans-serif;
    font-size: 18px;
    margin-top: 53%;
    margin-bottom: 30%;
}

.insta_hover>p {
    background: transparent;
}

.insta_content:hover .insta_hover {
    display: flex;
    flex-direction: column;
    align-items: center;
}

#instagram>div>img {
    width: 100%;

}



/* ********last box****** */
#last_box_headline {
    text-align: center;
    font-family: freight-big-pro, Times, serif;
    ;
    font-size: 36px;
    font-weight: 400;
    margin-top: 100px;

}

#last_box {
    /* border: 1px solid red; */
    width: 90%;
    height: 260px;
    margin: auto;
    margin-top: 50px;
    display: flex;
    justify-content: center;
    gap: 20px;
}

/* #last_box>div {
    border: 1px solid green;
    width: 15%;
    
} */

#last_box>div>p {
    margin: 8px 0px 5px 5px;
    font-family: sans-serif;
    text-decoration: underline;
    font-size: 13px;
    font-weight: 600;
}

#last_box>div>img {
    width: 100%;
}



/* ************************midsummer_box******************* */


#midsummer {
    width: 91%;
    margin-inline: auto;
    /* border: 1px solid red; */
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    grid-template-rows: repeat(3, 1fr);
    margin-top: 50px;
}

#midsummer>div {
    /* border: 1px solid green; */
    width: 45vw;
    height: 750px;
    background-size: cover;
}

#midsummer>div:nth-child(1)>h1 {
    text-align: center;
    margin-top: 300px;
    color: white;
    font-size: 40px;
    font-weight: 400;
    background: transparent;
}


#midsummer>div:nth-child(1)>a {
    display: block;
    text-align: center;
    color: white;
    /* text-decoration: none; */
    font-size: 18px;
    /* margin-top: 300px; */
    background: transparent;

}

#midsummer>div:nth-child(2)>h1 {
    /* border: 1px solid blue; */
    display: block;
    text-align: center;
    margin: 600px 0px 0px 130px;
    color: white;
    font-size: 40px;
    font-weight: 400;
    width: 60%;
    background: transparent;
}


#midsummer>div:nth-child(2)>a {
    display: block;
    text-align: center;
    color: white;
    /* text-decoration: none; */
    font-size: 18px;
    /* margin-top: 300px; */
    background: transparent;
}

#midsummer>div:nth-child(3)>h1 {
    display: block;
    margin: 300px 0px 0px 130px;
    text-align: center;
    color: white;
    font-size: 40px;
    font-weight: 400;
    width: 60%;
    background: transparent;
}


#midsummer>div:nth-child(3)>a {
    display: block;
    text-align: center;
    color: white;
    /* text-decoration: none; */
    font-size: 18px;
    /* margin-top: 300px; */
    background: transparent;
}

#midsummer>div:nth-child(4)>h1 {
    display: block;
    margin: 600px 0px 0px 130px;
    text-align: center;
    color: black;
    font-size: 40px;
    font-weight: 400;
    width: 60%;
    background: transparent;
}


#midsummer>div:nth-child(4)>a {
    display: block;
    text-align: center;
    color: black;
    /* text-decoration: none; */
    font-size: 18px;
    /* margin-top: 300px; */
    background: transparent;
}

#midsummer>div:nth-child(5)>h1 {
    display: block;
    margin: 600px 0px 0px 130px;
    width: 60%;
    text-align: center;
    margin-top: 300px;
    color: white;
    font-size: 40px;
    font-weight: 400;
    background: transparent;
}


#midsummer>div:nth-child(5)>a {
    display: block;
    text-align: center;
    color: white;
    /* text-decoration: none; */
    font-size: 18px;
    /* margin-top: 300px; */
    background: transparent;

}

#midsummer>div:nth-child(6)>h1 {
    /* border: 1px solid blue; */
    display: block;
    text-align: center;
    margin: 600px 0px 0px 130px;
    color: black;
    font-size: 40px;
    font-weight: 400;
    width: 60%;
    background: transparent;
}


#midsummer>div:nth-child(6)>a {
    display: block;
    text-align: center;
    color: black;
    /* text-decoration: none; */
    font-size: 18px;
    /* margin-top: 300px; */
    background: transparent;
}





#midsummer>div:nth-child(1) {
    background-image: url("https://www.jcrew.com/brand_creative/homepage2022/07-Jul4/2022jul_0719_hp_w_img1.jpg");
}

#midsummer>div:nth-child(2) {
    background-image: url("https://www.jcrew.com/brand_creative/homepage2022/07-Jul4/2022jul_0719_hp_w_img2.jpg");
}

#midsummer>div:nth-child(3) {
    background-image: url("https://www.jcrew.com/brand_creative/homepage2022/07-Jul4/2022jul_0719_hp_w_img3_d.jpg");
}

#midsummer>div:nth-child(4) {
    background-image: url("https://www.jcrew.com/brand_creative/homepage2022/07-Jul2/2022jul_0705_hp_w_img5.jpg");
}

#midsummer>div:nth-child(5) {
    background-image: url("https://www.jcrew.com/brand_creative/homepage2022/07-Jul4/2022jul_0719_hp_w_img5.jpg");
}

#midsummer>div:nth-child(6) {
    background-image: url("https://www.jcrew.com/brand_creative/homepage2022/07-Jul4/2022jul_0719_hp_w_img6.jpg");
}




/* ******************************* */
#only_flex {
    /* border: 1px solid red; */
    margin-top: 20px;
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 30px;
    margin-inline: auto;
}

#only_flex>h2 {
    font-weight: 400;
    font-size: 35px;
}

#only_flex>button {
    border: 1px solid rgb(183, 183, 183);
    background: transparent;
    padding: 12px 15px;
    font-weight: 600;
}

#only_flex>button:hover {
    color: white;
    background-color: rgb(198, 192, 192);
}