#residence {
    background: #F6F9EB;
    padding-bottom: 5rem;
}

#residence .desc {
    color: #111111;
    font-weight: 300;
}


.dest-item i {
    font-size: 60px;
    color: #7B7B7B;
}

.dest-container .dest-item {
    background: #EFEFEF;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    text-decoration: none;
}

.dest-item img {
    width: 100%;
    height: 350px;
    object-fit: cover;
}

.dest-container {
    overflow: hidden;
    display: grid;
    /* grid-row-gap: 38px!important; */
    grid-gap: 5px;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    grid-auto-rows: minmax(250px, auto);
    grid-auto-flow: dense;
}


.dest-container .wide {
    grid-column: span 2;
}

.dest-container .tall {
    grid-row: span 2;
}

.dest-container .big {
    grid-column: span 2;
    grid-row: span 2;
}

@media only screen and (max-width: 1200px) and (min-width: 770px)  {
    #residence .text-dark-green-above{
        display: flex;
    margin-bottom: -8px!important;
    margin-top: -77px!important;
    }
}
a:link { text-decoration: none; }

    .bottom-left {
    position: relative;
    bottom: 76px;
    /* margin-bottom: 20px; */
    padding-bottom: -33px;
    padding-top: 0px;
    padding-left: 16px;
    text-align: left;
    font-weight: lighter!important;
    font-size: 48px;
    letter-spacing: -0.48px;
    color: #4A5A0B;
    background: transparent linear-gradient(180deg, #FFFFFF00 0%, #FFFFFF 100%) 0% 0% no-repeat padding-box;
}
.above{
    /* display: flex; */
    justify-content: center;
    position: relative;
    align-items: center;
    line-height: 1;
    margin-top: -121px;
    padding-bottom: 7px;
    padding-top: 66px;
    padding-left: 16px;
    text-align: left;
    font-weight: lighter!important;
    font-size: 48px;
    letter-spacing: -0.48px;
    color: #4A5A0B;
    background: transparent linear-gradient(180deg, #FFFFFF00 0%, #FFFFFF 100%) 0% 0% no-repeat padding-box;
}
.bottom-left-small-2lines {
    position: relative;
    bottom: 122px;
    /* margin-bottom: 20px; */
    padding-bottom: 0px;
    padding-top: 20px;
    padding-left: 4px;
    text-align: left;
    font-weight: lighter!important;
    font-size: 36px;
    letter-spacing: -0.48px;
    color: #4A5A0B;
    background: transparent linear-gradient(180deg, #FFFFFF00 0%, #FFFFFF 100%) 0% 0% no-repeat padding-box;
}
.bottom-left-small {
 position: relative;
 bottom: 74px;
 padding-bottom: 0px;
 padding-top: 20px;
 padding-left: 4px;
 text-align: left;
 font-weight: lighter!important;
 font-size: 36px;
 letter-spacing: -0.48px;
 color: #4A5A0B;
 background: transparent linear-gradient(180deg, #FFFFFF00 0%, #FFFFFF 100%) 0% 0% no-repeat padding-box;
}
    .dest-custom-container{
        display: flex;
        margin: auto;
        flex-direction: column;
        padding: 3rem 0 1rem;
        align-items: center;

    }
.image-grid1 {
  display: grid;
  grid-template-columns: 600px 300px 300px;
  grid-template-rows: 300px 300px;
  grid-gap: 10px;
}

.image-big1 {
  grid-column: 1 / 2;
  grid-row: 1 / 3;
}

.image-small1:nth-child(2),
.image-small1:nth-child(3) {
  grid-column: 2 / 3;
}

.image-small1:nth-child(4)
 {
    grid-row: 1 / 2;
  grid-column: 3 / 4;
}
.image-small1:nth-child(5){
 
    grid-column: 3 / 4;

}

.image-small1 img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.image-grid2 {
    padding-top:10px;
  display: grid;
  grid-template-columns: 300px 290px 610px;
  grid-template-rows: 300px 300px;
  grid-gap: 10px;
}

.image-big2 {
  grid-column: 3 / 4;
  grid-row: 1 / 3;
}

.image-small2:nth-child(2) {
  grid-column: 1 / 2;
}
.image-small2:nth-child(3) {

}

.image-small2:nth-child(4)
 {
    grid-row: 1 / 2;
  grid-column: 1 / 2;
}
.image-small2:nth-child(5){
 
    grid-column: 2 /3;

}

.image-small2 img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.image-grid3 {
    padding-top:10px;
    display: grid;
    grid-template-columns: 1220px;
    height: 300px;
    grid-gap: 10px;
}
@media screen and (max-width: 1850px){
    .image-grid1 {
  display: grid;
  grid-template-columns: 500px 250px 250px;
  grid-template-rows: 250px 250px;
  grid-gap: 10px;
}
.image-grid2 {
  display: grid;
  grid-template-columns: 250px 240px 510px;
  grid-template-rows: 250px 250px;
  grid-gap: 10px;
}
.image-grid3 {
    display: grid;
    grid-template-columns: 1020px;
    height: 250px;
  grid-gap: 10px;
}
.bottom-left-small-2lines {
    bottom: 55px;
    font-size: 24px;
}
.bottom-left-small {
    bottom: 55px;
    font-size: 24px;
}
.above{
    margin-top: -108px;
    font-size: 36px;

}
}
@media screen and (max-width: 1300px){
    .image-grid1 {
  display: grid;
  grid-template-columns: 400px 200px 200px;
  grid-template-rows: 200px 200px;
  grid-gap: 10px;
}
.image-grid2 {
  display: grid;
  grid-template-columns: 200px 190px 410px;
  grid-template-rows: 200px 200px;
  grid-gap: 10px;
}
.image-grid3 {
    display: grid;
    grid-template-columns: 820px;
    height: 200px;
  grid-gap: 10px;
}
.bottom-left-small-2lines{
    bottom: 90px;
}
}
@media screen and (min-width: 992px){
    .dest-container{
        display:none;
    }
    .dest-custom-container{
        display:flex;
    }} 

@media screen and (max-width: 992px){
    .dest-container{
        display:grid;
    }
    .dest-custom-container{
        display:none;
    }}