#LoveMyLaybyLogo{
  height:150px;
 }
header{
display:block;
align-items: center;
justify-content: center;
margin-top: 50px;
margin-bottom: 20px;
 }
 .nav{
display:flex;
flex-wrap: wrap;
height: 50px;
font-family: Verdana, Geneva, Tahoma, sans-serif;
font-weight:500;
align-items: center; 
  background-color:rgb(247, 247, 247);
}
.nav-item{
text-align: center;
margin-left: 10px;
margin-right: 10px;
}
.nav-item:hover{
font-weight:bold;
}
/* Base underline behaviour */
.navbar-nav.me-auto .nav-link {
  position: relative;
  display: inline-block;   /* key change: shrink to text width */
}
/* Animated underline */
.navbar-nav.me-auto .nav-link::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  width: 0%;
  height: 2px;
  background-color: #000;
  transition: width 0.25s ease;
}
.navbar-nav.me-auto .nav-link:hover::after {
  width: 100%;
}
.nav-item{
text-align: center;
font-weight: 500;
margin-left: 10px;
margin-right: 10px;
}
.nav-item:hover{
font-weight:bold;
}
/* Override global link hover colour for the main nav */
.navbar-nav .nav-link:hover {
  color: #000 !important;   /* black */
  font-weight: bold;        /* keep your hover bold */
}
.container{
font-family: Verdana, Geneva, Tahoma, sans-serif;
font-weight: 800;
background-color:rgb(250, 247, 247);
}
body{
  margin:0;
  padding:0;
  box-sizing: border-box;
  background-color:rgb(250, 247, 247);
}
html{
background-color:rgb(250, 247, 247);
}
 .btn {
 font-family: Verdana, Geneva, Tahoma, sans-serif;
  font-weight: 800;
 }
.nav-item:hover{
    font-weight:bold;
}
.sign-up{
  margin-right: 50px;
}
 #images1{
    float:right;
    height:80%;
    width:85%;
    margin-top: 50px;
    margin-right:19px;
     box-shadow: 2px 2px 6px 3px #47143f;
 }
#images2{
   height:50%;
   width:85%;
    margin-left: 30px;
    margin-top: 50px;
    box-shadow: 2px 2px 6px 3px #47143f;
 }
 #images3{
  height:30%;
  width:85%;
  margin-left: 30px;
  margin-top: 50px;
  box-shadow: 2px 2px 6px 3px #47143f;
 }
 
 .rowSecond{
    margin-top: 180px;
    height:620px;
    background-color: rgb(181, 209, 206);
 }
 h1{
  padding-top: 50px;
  padding-left: 65px;
 }
 #wideAngle{
    height:60%;
    width: 100%;
    padding:0px 20px 10px 20px;
 }
 .reflect{
  background-color: rgb(176, 228, 228);
  height:50%;
  border-radius: 1%;
 }
 .custom-bg{
  background-color:rgb(103, 204, 204);
  opacity: 70%;
  padding-top:10px;
  padding-bottom:9px;
  padding-right: 7px;
  margin-left:20px;
  font-size:13px ;
 
 }
 .culture{
  margin-left:auto;
  margin-top:150px;
  margin-bottom:50px;
 }
 p{
  margin-top: 20px;
  font-family: "Lato", sans-serif;
  font-weight: 100;
  font-style: normal;
 }
   .rowFive{
    display:flex;
    align-items: center;
    justify-content: center;
    margin-top: 20px;
   }
   .rowSix{
    display:flex;
    align-items: center;
    justify-content: center;
    margin-top: 10px;
   }
   #councilTrim {
   border-radius: 8px;
    height:30%;
    width:30%;
   }
   #trashBuildUp{
    height:30%;
    width:30%;
    border-radius: 8px;
   }
   #trashedWheelB{
     height:30%;
    width:30%;
   border-radius: 8px;
   }
   #miniLand{
    margin-top: 3px;
    border-radius: 8px;
    height:40%;
    width:80%;
   }
 
   h5{
    margin-top:60px;
    text-shadow: 2px 2px 2px yellowgreen;
   }
   #useful{
    margin-top: 60px;
    text-shadow: 2px 2px 2px yellowgreen;
    font-weight: 500;
    font-size: medium;
   }
   #brandsHatch{
     height:90%;
     width:80%;
   }
   #cleaner{
    display:flex;
    background-color: beige;
    text-shadow: 2px 2px 2px yellowgreen;
    padding:35px 20px 40px 120px;
    letter-spacing: 2px;;
    margin-right: 5px;
    margin-left: 5px;
   }
   #brands1{
    height:190px;
    width:20%;
   }
   #brands2{
    height: 190px;
    width:20%;
   }
   #brands3{
    height: 190px;
    width:20%;
   }
   #brands4{
     height: 190px;
    width:20%;
   }
   .img-fluid{
    height:100px;
    width:200px;
   }
.popup {
  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.3);
  display: none;
  border-radius: 10px;
  position: fixed;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  background: white;
  padding: 20px;
}

#popup-card {
box-shadow: 0 4px 10px rgba(0, 0, 0, 0.3);
  display: none;
  border-radius: 10px;
  height:680px;
  width:420px;
}
.popup-content {
  text-align:left;
}
#newCCTV{
  list-style:circle;
}
#style77{
  margin-top:10px;
  margin-left:20px;
}
#talkingCCTV3{
  height:125px;
  width:130px;
  margin-right:15px;
  margin-left:20px;
}
#talkingCCTV2{
  height:125px;
  width:130px;
  margin-left:10px;
}
#talkingCCTV1{
  height:116px;
  width:130px;
}
.popupP {
  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.3);
  display: none;
  border-radius: 10px;
  position: fixed;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  background: white;
  padding: 20px;
}
#popup-cardP {
  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.3);
  display: none;
  border-radius: 10px;
  height:590px;
  width:420px;
}
.pupupP-content{
  align-content: center;
}
.close-btn {
  position: absolute;
  top: 60px;
  right: 5px;
  cursor: pointer;
  font-size: 20px;
   margin-top:12px;
   margin-right:12px;
  padding:0px 8px 5px px;
  font-weight: bold;
}
#trash{
  height:130px;
  width:160px;
  margin-left: 28px;
}
#trash2{
  height:130px;
  width:160px;
  margin-left:4px;
}
#mule {
  margin-left: 120px;
}
.bins{
  display:block;
}
#style41{
width:70%; 
height:auto;
border-radius: 8px;
}
#style68{
   padding: 10px 25px 0px 20px;
    font-weight: 600;
    font-size: medium;
}
#blueTruck{
  text-shadow: 2px 2px 2px yellowgreen; 
  margin-top:100px;
  padding-bottom: 10px;
  text-align: center;
}
#style69{
  font-size: smaller;
}
#style65{
  margin-top:200px; 
  text-align:left;
   padding-left: 35px;
}
#style66{
  height:300px; 
  width:100%;
  border-radius: 2%;
}
#style67{
  font-family: 'Verdana', Geneva, Tahoma, sans-serif;
  padding-top: 30px;
  padding-bottom:30px;
  text-align: center;
  text-shadow: 2px 2px #8a226b; 
  color:rgb(151, 199, 102);
}
#tiny{
padding-top: 80px;
padding-bottom: 50px;
padding-left: none !important;
text-shadow: 2px 2px 2px yellowgreen;
font-weight: 500;
}
#style47{
  margin-top:5px; 
  padding-left: 0px;
  text-shadow: 2px 2px 2px yellowgreen;
  font-size: medium;
  font-weight:500 !important;
}
#style48{
  font-family:Verdana, Geneva, Tahoma, sans-serif;
  font-weight: 600;
  font-size:large;
  padding-left: 5%;
}
#savePlanet{
  border-radius: 2%;
  height:80%;
  width:65%;
}
#trashCat6{
  border-radius: 8%;
  height:40%;
   width:30%;
}
#trashCat8{
   border-radius: 8%;
  height:40%;
   width:30%;
}
#trashCat10{
  border-radius:8%;
  height:40%;
  width:30%;
}
#deeperDig{
  text-shadow: 2px 2px 2px yellowgreen;
  padding-top: 150px;
  text-align:left;
}
#coreCulture{
 text-shadow: 2px 2px 2px yellowgreen;
 padding-left:43px !important; 
 padding-top:15px;
 font-size:x-large !important;
}
#cleanCulture{
  text-shadow: 2px 2px 2px yellowgreen;
 padding-left:125px !important; 
 padding-top: 15px;
 font-size:x-large !important;
}
#tooMuch{
  text-align:center;
  padding-bottom:5px;
}
  #oldBins{
    margin-top: 40px;
    padding:7px 2px 2px 2px;
     border-radius:15px;
    height:370px;
    width:95%;
   }

#miniLandfill{
  text-align:left;
  padding-bottom:5px;
}

.style49{
  margin-top: 50px;
  font-weight:600;
  color:grey;
}
#style48{
  color:grey;
}
#style50{
  color:grey;
  font-family:Verdana, Geneva, Tahoma, sans-serif;
  font-weight: 600;
  font-size:large;
  padding-top:5px;
}
#example{
  padding-left: 65px;
}
.dumping{
  font-weight: 600;
}
a{
  text-decoration: none;
}
a:hover{
  color: crimson;
}
/* Footer link base style */
footer .nav-link {
  color: #000 !important;        /* ensure original black */
  position: relative;
  display: inline-block;         /* shrink underline to text width */
  padding-left: 0;
  padding-right: 0;
}
/* Footer hover colour override */
footer .nav-link:hover {
  color: #000 !important;        /* override global red hover */
  font-weight: bold;             /* optional, matches navbar behaviour */
}
/* Footer underline animation */
footer .nav-link::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  width: 0%;
  height: 2px;
  background-color: #000;
  transition: width 0.25s ease;
}
footer .nav-link:hover::after {
  width: 100%;
}
.trademark{
  font-weight: 500;
}
#footerMenu{
  margin-bottom: -40px;
}

#truckOwners{
padding-left: 57px;
padding-top:5px;
}