body {
    background-color: rgb(230, 227, 227);

    overflow-x: hidden; /* Disable horizontal scrolling */
    overflow-y: auto; /* Enable vertical scrolling */
    padding-right: 11px;
}


.ianIsA{    background-color: rgb(230, 227, 227);
}

.navList{
    gap:0rem !important;
}

:root {
    background-color: rgb(230, 227, 227);
    }
  
    .headerContainer {
      background-color: rgb(230, 227, 227);
      justify-content: center;

    }

    /*.sigMarg {
        
        margin-right: 60px;
    }*/

    .JMsignature {
        /* margin-right: 140px; */
       /* transform: scale(.9); */
    }

    .headerContent hr {
       /* margin-left: 12%;
        width: 78%; */
      }
    
      .headerContent h2 {
        font-family: 'Poiret One';
        font-size: 75px;
        font-weight: bold;
        color: rgb(188, 67, 19) !important; 
      }
    
      .imageContainerTest {
        background-color: rgb(230, 227, 227);
        /*padding-top: 50px;*/
        justify-content: center;
        align-items: center;
        text-align: center;
      }
    
      .imageRow1 {
        background-color: rgb(230, 227, 227);
        justify-content: center;
        align-items: center;
        text-align: center;
        padding-right: 44px;
      }
      .col-md-4 {
        justify-content: center;
        align-items: center;
        text-align: center;
      }
    
      .imgColCell {
        justify-content: center !important;
        align-items: center !important;
        text-align: center !important;
        border-style: solid;
        border-color: grey;
        /* padding: 18px; */
        height: 450px !important;
      }
    
      .projectCol {
        width: 450px !important; 
        background-color: white;
        margin-left: 45px; 
      }
    
      .title {
        background-color: rgb(230, 227, 227);
      }
    
      .titleH3 {
        background-color: rgb(230, 227, 227);
       
      }
    
      .col-md-4 a {
        font-size: 30px;
        color: grey !important;
        text-decoration: none;
          }
    
          .col a:hover {
            color: grey;
            text-decoration: underline rgb(188, 67, 19) !important; 
          }
    
          .col-md-4 h5:hover {
            text-decoration: rgb(188, 67, 19) !important; 
          }
    
          .col- {
            text-align: center;
          }
    
          .col a {
            text-decoration: none;
            color: gray;
            font-size: 30px;
            font-weight: 500;
          }

    .navItems a {
        font-size: 30px;
        text-decoration: none; /* Remove underline */
        color: black; /* Default link color */
        padding: 10px 20px;
        display: block;
        transition: background-color 0.3s ease, color 0.3s ease;
    }
        .navList {
        background-color: rgb(230, 227, 227);

      }
    
      .navItems a:hover {
    
        color: black;
      }  
    
      

.homeMainImageContainer {

    background-color: rgb(230, 227, 227);
    justify-content: center;
  /*  align-items: center; */
  /*  text-align: center; */
   /* margin-right:80px; */
    margin-top:-80px;
  /*  padding: 20px;
    padding-right: 35px; */

}

.mainHeaderRow {
    background-color: rgb(230, 227, 227);

    width: 100%;
    justify-content: center;

}

.headerContainer,
.navContainer,
.imageContainerTest {
  text-align: center; /*  Center alignment for all containers */
}


.homeCover {
    background-color: rgb(230, 227, 227);
    width: 100%;
    text-align: center;
    justify-content: center;
    text-align: top;
    padding-left: 5px;
    padding-bottom: 10px;
    display:grid;
}

.coverCol {
    background-color: rgb(230, 227, 227);
}

.coverCol img{
    background-color: rgb(230, 227, 227);
    text-align: top;
    justify-content: center;
    text-align: center;
    margin-top: -140px !important;
}

.homeMainImage {
    background-color: rgb(230, 227, 227);
    scale: 80%;
    margin-top: -80px;
}

.DividerLine {
    background-color: rgb(230, 227, 227);
    width: 100%;
    justify-content: center;
    text-align: center;
    align-items: center;
}

.dividingLine {
    background-color: rgb(230, 227, 227);
    background-color: black;
    height: 2px;
    width:80%;
}

.dividingLineSmall {
    background-color: black;
    height: 2px;
    padding-top: -10px;
}

.aboutJMContainer {
    background-color: rgb(230, 227, 227);
    text-align: center;
    
}

.aboutJMFirstRow {
    background-color: rgb(230, 227, 227);
    justify-content: center;
    margin-bottom: 20px;
    width: 100%;
    padding-top: 60px !important;
    display: flex !important;
    flex-wrap: wrap;
    gap: 1rem;
    margin: 0;
    padding: 0;
    text-align: left;
  }

  .amyKawadler{
    text-align: center;
    padding-left: 160px; 
    padding-top: 10px
  }
.aboutJMCol {
  text-align: right;
  
}

.aboutJMCol h4 {
    padding-right: 16%;
    font-size: small;
    justify-content: space-between;

}

.aboutJMDesc {
    margin-right: 12%;
    width: 40%;
}

.aboutJMDesc p {
    
    font-size: 18px;
    margin-left: 10px;
    margin-right: 5px;
}



.disclaimer {
    margin-top: 0px !important;
    float: right;
    margin-top: 150px;
    font-size: 15px;
}


.jmStamp {
    transform: scale(.9)  !important;
    margin-top: 30px;
    margin-left: 10%;

  }

.aboutJMDesc h2 {
    background-color: rgb(230, 227, 227);

    text-align: center;
    font-family: Georgia;
    margin-top: -4px;
}

.projectList {
    background-color: rgb(230, 227, 227);
    justify-content: center;
    align-items: center;
    align-content: center;
    padding-top: 10px;
}

#recentProjects {
    text-align: center;
    padding-right: 25px;
  
}

.recentProjectsList {
    list-style: none;
}

#RProjects {
    font-weight: bold;
    font-size: 44px !important;
    font-family: 'Poiret One', cursive;
    color: rgb(188, 67, 19) !important;
}

#member {
    font-family: 'Poiret One', cursive;
    font-size: 27px;
text-decoration: none !important;
color: black;
}

.projectList #Ex2019 {
    /* text-decoration: underline !important; */
    font-family: 'Poiret One', cursive;
    font-size: 27px;
text-decoration: none !important;
color: black;
}



 #Ex2019:hover {
   text-decoration: underline rgb(188, 67, 19) !important;
}


.projectList li #Ex2019 {
    text-decoration: underline !important;
    font-size: 25px;
    font-weight: 400;
}

  .footerWrapper {
    background-color: rgb(230, 227, 227);
  }
  
  .footerContainer {
    flex-wrap: flex;
    background-color: rgb(230, 227, 227);
    text-align: center !important;
      font-size: 20px;
      padding-top: 35px;
      margin-left: 3.4% !important;
    }
    
  
  .footerRow {
      justify-content: center;
  }
   
    .footerContainer a {
        color: rgb(188, 67, 19) !important;
    }  

    .created {
        background-color: rgb(230, 227, 227);
    }

  .createdBy p{
    padding-top: -20px;
    text-align: center;
    color: grey;
  }


/* DYNAMIC DESIGN */

 /*  @media (max-width: 2100px) {
    
    #aboutJMDesc {
        padding-left: 120px !important;
    }

    #aboutJMDesc p {
        margin-right: 200px !important;
    }

    #secondSectionAboutJM {
        width: 90% !important;
    }

    .secondDescCol  {
        padding-right: 140px !important;
        margin-left: 30px !important;
        width: 80%;
    }

    .recentProjectsList {
        list-style-type: none;
        margin-left: 2%;
    }

    #footerRow {
        margin-left: -24% !important;
        text-align: center;
        justify-content: center;
        align-items: center;
    }
}

@media (max-width: 2000px) {
    
    #aboutJMDesc {
        padding-left: 120px !important;
    }

    #aboutJMDesc p {
        margin-right: 120px !important;
    }

    #secondSectionAboutJM {
        width: 90% !important;
    }

    .secondDescCol  {
        padding-right: 70px !important;
        margin-left: 30px !important;
        width: 80%;
    }
}


@media (max-width: 1900px) {
    
    #aboutJMDesc {
        padding-left: 180px !important;
        padding-right: 100px !important;
    }

    .dividingLineSmall {
        margin-right: -2%;
    }

    #aboutJMDesc p{
        
        margin-right: -1% !important;
    }

    .JMImage {
        margin-left: 25px;
        }

        .secondDescCol  {
            padding-right: 60px !important;
            margin-left: 50px !important;
            width: 80%;
        }

        .recentProjectsList {
            list-style-type: none;
            margin-left: 8%;
        }
}


@media (max-width: 1750px) {
    
    #aboutJMDesc {
        padding-left: 230px !important;
        margin-right: -300px !important;
    }

    .dividingLineSmall {
        margin-right: -18% !important;
    }

    #aboutJMDesc p {
        margin-right: -120px !important;
    }

    .JMImage {
        margin-left: 25px;
        }

        .secondDescCol  {
            padding-right: 1px !important;
            margin-left: 70px !important;
            width: 80%;
        }

        .recentProjectsList {
            list-style-type: none;
            margin-left: 13%;
        }
}


@media (max-width: 1720px) {

    .homeMainImage {
        margin-top: -160px !important;
    }

    .aboutJM p {
    font-family: Georgia;
    font-size: 23px;
    margin-top: 30px;
    margin-left: 70px;
}

.dividingLine {
    background-color: black;
    height: 2px;
    width: 73% !important;
    margin-left: 20%;
    margin-top: -180px;
}

#aboutJMDesc {
    padding-left: 220px !important;
}

.col-7 p {
    margin-right: 20%;
    font-size: 20px;
}

#secondSectionAboutJM {
    font-size: 20px;
    margin-left: 17%;
    margin-right: 10%;
}

.secondDescCol  {
    padding-right: -260px !important;
    margin-left: 70px !important;
    width: 80%;
}

.secondDescCol p {
    margin-right: -140px !important;
}

#footerRow {
    margin-left: -15% !important;
}

}

@media (max-width: 1690px) {
    .dividingLine {
        background-color: black;
        height: 2px;
        width: 74% !important;
        margin-left: 20%;
        margin-top: -180px;
    }

    .recentProjectsList {
        list-style-type: none;
        margin-left: 12%;
    }
}

@media (max-width: 1630px) {

    #aboutJMDesc {
        padding-left: 245px !important;
    }

    #aboutJMDesc p {
        margin-right: -24% !important;
    }

    #footerRow {
        margin-left: -18% !important;
    }
}

@media (max-width: 1600px) {

    .dividingLine {
        background-color: black;
        height: 2px;
        width: 76% !important;
        margin-left: 22%;
        margin-top: -180px;
    }

    #aboutJMDesc {
        padding-left: 270px !important;
    }

    #aboutJMDesc p {
       margin-right: -20% !important;
      
    }

    #aboutJMDesc p {
        margin-right: -55% !important;
        font-size: 20px;
    }

    .dividingLineSmall {
        background-color: black;
        height: 2px;
        margin-right: -50% !important;
        margin-top: -10px;
    }

    #secondSectionAboutJM {
        font-size: 20px;
        margin-left: 17%;
        margin-right: -1%;
    }

    .secondDescCol  {
        margin-left: 140px !important;
        width: 80%;
    }
    
    .secondDescCol p {
        margin-right: -210px !important;
    }

    .recentProjectsList {
        list-style-type: none;
        margin-left: 15%;
    }
}

@media (max-width: 1550px) {
    .dividingLine {
        background-color: black;
        height: 2px;
        width: 80% !important;
        margin-left: 22%;
        margin-top: -180px;
    }
}

@media (max-width: 1500px) {
    .dividingLine {
        background-color: black;
        height: 2px;
        width: 83% !important;
        margin-left: 23%;
        margin-top: -180px;
    }

    #aboutJMDesc {
        padding-left: 295px !important;
    }

    .dividingLineSmall {
        margin-right: -78% !important;
    }

    #aboutJMDesc p {
        margin-right: -40% !important;
    }

    #aboutJMDesc p {
        margin-right: -85% !important;
        font-size: 20px;
    }

    .dividingLineSmall {
        background-color: black;
        height: 2px;
        margin-right: -12%;
        margin-top: -10px;
    }

    .recentProjectsList {
        list-style-type: none;
        margin-left: 10%;
    }

    .secondDescCol  {
        margin-left: 170px !important;
        width: 80%;
    }
    
    .secondDescCol p {
        margin-right: -210px !important;
    }

    .recentProjectsList {
        list-style-type: none;
        margin-left: 18%;
    }

    #footerRow {
        margin-left: 20% !important;
    }
}

@media (max-width: 1450px) {
    .dividingLine {
        background-color: black;
        height: 2px;
        width: 85% !important;
        margin-left: 24%;
        margin-top: -180px;
    }

    #aboutJMDesc {
        padding-left: 305px !important;
    }

    .dividingLineSmall {
        margin-right: -110% !important;
    }

    #aboutJMDesc p {
        margin-right: -114% !important;
        font-size: 20px;
    }

    #secondSectionAboutJM {
        font-size: 20px;
        margin-left: 17%;
        margin-right: -8%;
    }

    .secondDescCol  {
        margin-left: 170px !important;
        width: 80%;
    }
    
    .secondDescCol p {
        margin-right: -270px !important;
    }
}

@media (max-width: 1400px) {
    .dividingLine {
        background-color: black;
        height: 2px;
        width: 88% !important;
        margin-left: 25%;
        margin-top: -180px;
    }

    #aboutJMDesc {
        padding-left: 330px !important;
    }

    #aboutJMDesc h2 {
        margin-right: -200px;
    }

    #aboutJMDesc p {
        margin-right: -149% !important;
        font-size: 20px;
    }

    .dividingLineSmall {
        background-color: black;
        height: 2px;
        margin-right: -30%;
        margin-top: -20px;
    }

    #secondSectionAboutJM {
        font-size: 20px;
        margin-left: 21%;
       
    }

    .recentProjectsList {
        list-style-type: none;
        margin-left: 15%;
    }


    .secondDescCol  {
        margin-left: 120px !important;
        width: 80%;
    }
    
    .secondDescCol p {
        margin-right: -280px !important;
    }

    .recentProjectsList {
        list-style-type: none;
        margin-left: 23%;
}

@media (max-width: 1350px) {
    .dividingLine {
        background-color: black;
        height: 2px;
        width: 91% !important;
        margin-left: 26%;
        margin-top: -180px;
    }

    #aboutJMDesc {
        padding-left: 360px !important;
    }

    .dividingLineSmall {
        margin-right: -205% !important;
    }

    #aboutJMDesc p {
        margin-right: -210% !important;
        font-size: 20px;
    }

    .secondDescCol  {
        margin-left: 120px !important;
        width: 80%;
    }
    
    .secondDescCol p {
        margin-right: -340px !important;
    }

    #footerRow {
        margin-left: 10% !important;
    }
}

@media (max-width: 1300px) {

    .homeMainImage {
        margin-top: -160px !important;
    }

  .dividingLine {
        background-color: black;
        height: 2px;
        width: 94% !important;
        margin-left: 27%;
        margin-top: -180px;
    }

    .JMImage {

        margin-right: 100px;
        padding-left: 262px;
        margin-top: -10px;
        margin-bottom: 65px;
    }

    #aboutJMDesc {
        padding-left: 400px !important;
    }

    #aboutJMDesc p {
        margin-right: -302% !important;
        font-size: 20px;
    }

    #secondSectionAboutJM {
        font-size: 20px;
        margin-left: 26%;
        margin-right: -20%;
    }

    .recentProjectsList {
        list-style-type: none;
        margin-left: 23%;
    }

    .secondDescCol  {
        margin-left: 120px !important;
        width: 80%;
    }
    
    .secondDescCol p {
        margin-right: -310px !important;
    }

    .recentProjectsList {
        list-style-type: none;
        margin-left: 30%;
}
}

@media (max-width: 1250px) {

  .dividingLine {
        background-color: black;
        height: 2px;
        width: 99% !important;
        margin-left: 27%;
        margin-top: -180px;
    }


    #aboutJMDesc {
        padding-left: 430px !important;
    }

    #aboutJMDesc h2 {
        margin-right: -270px;
    }

    #aboutJMDesc p {
        margin-right: -550px !important;
        font-size: 20px;
    }

    .dividingLineSmall {
        background-color: black;
        height: 2px;
        margin-right: -501% !important;
        margin-top: -20px;
    }

    #footerRow {
        margin-left: 31% !important;
    }
}

@media (max-width: 1200px) {

    .dividingLine {
          background-color: black;
          height: 2px;
          width: 104% !important;
          margin-left: 28%;
          margin-top: -180px;
      }

      #aboutJMDesc {
        padding-left: 450px !important;
    }

    .dividingLineSmall {
        margin-right: -905% !important;
    }

    #aboutJMDesc p {
        margin-right: -510px !important;
        font-size: 20px;
    }

    #secondSectionAboutJM {
        font-size: 20px;
        margin-left: 27%;
        margin-right: -34%;
    }

    .recentProjectsList {
        list-style-type: none;
        margin-left: 29%;
    }

    .recentProjectsList {
        list-style-type: none;
        margin-left: 35%;
}
  }

  @media (max-width: 1150px) {

    .dividingLine {
          background-color: black;
          height: 2px;
          width: 108% !important;
          margin-left: 29%;
          margin-top: -180px;
      }

      .aboutJM h2 {
        float: right;
        margin-right: 330px;
        font-family: Georgia;
        margin-top: -570px;
    }

    #aboutJMDesc {
        padding-left: 470px !important;
    }

    #aboutJMDesc h2 {
        margin-right: -320px;
    }

    .dividingLineSmall {
        margin-right: -560px !important;
    }

    #aboutJMDesc p {
        margin-right: -600px !important;
        font-size: 20px;
    }

    .secondDescCol p {
        margin-right: -380px !important;
    }

    .col-7 h2 {
        margin-top: 10px;
        width: 130%;
    }

    .dividingLineSmall {
        background-color: black;
        height: 2px;
        margin-right: -131%;
        margin-top: -20px;
    }

    #footerRow {
        margin-left: 42% !important;
    }
  }

  @media (max-width: 1100px) {

    .dividingLine {
          background-color: black;
          height: 2px;
          width: 114% !important;
          margin-left: 30%;
          margin-top: -180px;
      }

      #aboutJMDesc {
        padding-left: 470px !important;
    }

    #aboutJMDesc p {
        margin-right: -600px !important;
        font-size: 20px;
    }

    .col-7 h2 {
        margin-top: 10px;
        width: 150%;
    }
    .dividingLineSmall {
        background-color: black;
        height: 2px;
        margin-right: -200%;
        margin-top: -20px;
    }

    #secondSectionAboutJM {
        font-size: 20px;
        margin-left: 30%;
        margin-right: -44%;
    }

    #recentProjects {
        margin-right: -80px !important;
    }

    .recentProjectsList {
        list-style-type: none;
        margin-left: 367;
    }
  }

  @media (max-width: 1050px) {

    .dividingLine {
          background-color: black;
          height: 2px;
          width: 119% !important;
          margin-left: 32%;
          margin-top: -180px;
      }

      #aboutJMDesc {
        padding-left: 480px !important;
    }

    #aboutJMDesc p {
        margin-right: -600px !important;
        font-size: 20px;
    }

    .col-7 h2 {
        margin-top: 10px;
        width: 170%;
    }

    .dividingLineSmall {
        background-color: black;
        height: 2px;
        margin-right: -250%;
        margin-top: -20px;
    }

    #footerRow {
        margin-right: -25% !important;
    }
  }

 /* @media (max-width: 1000px) {

    .dividingLine {8
          background-color: black;
          height: 2px;
          width: 124% !important;
          margin-left: 34%;
          margin-top: -180px;
      }

      #aboutJMDesc {
        padding-left: 500px !important;
    }

    #aboutJMDesc p {
        margin-right: -680px !important;
        font-size: 20px;
    }

    .secondDescCol p {
        margin-right: -520px !important;
    }

    .dividingLineSmall {
        background-color: black;
        height: 2px;
        margin-right: -650px !important;
        margin-top: -20px;
    }

    #secondSectionAboutJM {
        font-size: 20px;
        margin-left: 30%;
        margin-right: -54%;
    }

    .recentProjectsList {
        list-style-type: none;
        margin-left: 44%;
    } 
  } */


  /*responsive deisgn by Zen*/
  

  @media (min-width: 1200px) {

    .homeCover{
        margin-left: 35px;
    }


  }

  @media (max-width: 576px) {
    .homeMainImageContainer {
        max-width: 90%;
        padding-top: 80px; 
        background-color: rgb(230, 227, 227);
        margin-right: 0 !important;
    }

    .homeMainImage {
        background-color: rgb(230, 227, 227);
        /*margin-right: -12px;*/
        margin-left: 35px;
        scale: 100% !important;
        margin-top:80px;

    }

    
    .amyKawadler{

       /* padding-left: 28px !important; */
    }     

    .aboutJMFirstRow img {
        max-width: 69%; /* Adjust the max-width as needed for Jackson's picture on mobile*/
      }
  


    .JMsignature {
        max-width: 50%; /* Ensure the image does not exceed its container */
        height: auto; /* Maintain aspect ratio */
        scale: 100%;
        margin-right: -39px;
    }
    .col-img-4-5x11 {
        max-width: 33.333%; /* Adjust as needed */
    }


    .col-img-8-5x11 {
        max-width: 50%; /* Adjust as needed */
    }

    .amyKawadler{
        /*margin-right: 80px;*/
        padding-top: 10px;
        padding-left: -60px;
      }
    
    .aboutJMDesc {
        margin-left: 15px;
        margin-right: 30px;
        max-width: 100%; /* Adjust the max-width as needed */
        /* Additional styles as needed */
        padding-top: 40px;

    .aboutJMDesc p {
        
        margin-left:35px;
        padding-right:2px;
        padding-left:18px;
    }
    }

    .about-section{
        width: 90%; /* Keeps the content manageable across screen sizes */
        max-width: 600px; /* Prevents text from stretching too wide on larger screens */
        margin: 20px auto; /* Centers the section */
        text-align: left; /* Left-aligns the text for better readability */
        line-height: 1.6; /* Improves text readability */
        font-size: 16px; /* Optimal size for mobile readability */
        color: #333; /* Darker text for better contrast */
      
    }
    
    /*.img-fluid{
        height:90% !important

    }*/
    .signatureContainer {
        max-width: 100%; /* Adjust as needed */
        text-align: center;
        /*margin-right: 12%; */
        margin-left: 0px !important;

    }
    .jmStamp {
        transform: scale(.3);
        margin-top: 10px;
        margin-left: 10%;
        margin-right:17%;
        
      }
    
      #backToTop {
        position: fixed; /* Fixed position */
        bottom: 20px;    /* 20px from the bottom */
        right: 20px;     /* 20px from the right */
        z-index: 9999;   /* Make sure it's on top of other content */
        padding: 10px 20px; /* Padding for size */
        background-color: #666; /* Background color */
        color: white; /* Text color */
        border: none; /* No border */
        cursor: pointer; /* Cursor indicates it's clickable */
        border-radius: 5px; /* Rounded corners */
        opacity: 0.7; /* Slightly transparent */
        /*display: none;  Hidden by default */
    }
    #backToTop:hover {
        opacity: 1; /* Fully visible when hovered */
    }
    
        

}