body{
    margin:0;
    padding:0;
    box-sizing: border-box;
    /* background-color: aqua; */
}
#header {
    position:static;
    background-color: whitesmoke;
}
#camppage{
    width:90%;
    height:auto;
    /* border:1px solid red; */
    margin:auto;
    margin-top:20px;
    display:flex;
    gap:25px;
    border-radius: 15px;;
    background-image: linear-gradient(to right, #75ccf2, #88f5c0, #b8f9d9, #a1e7c5);
    box-shadow: 0 4px 15px 0 rgba(160, 251, 248, 0.75);
}
#camp-sortby{
    width:30%;
    height:500px;
    /* border:1px solid red; */
    border-radius: 15px;
}
#camp-sortby>h1{
    font-size: 20px;
    font-family: 'Franklin Gothic Medium', 'Arial Narrow', Arial, sans-serif;
    color:green;
}
#camp-data{
    width:100%;
    height:auto;
    /* border:1px solid green; */
    display: flex;
    flex-direction: column;
    align-items: center;
    align-content: space-around;

   /* display:grid;
   grid-template-columns: repeat(2,1fr); */

    row-gap:30px;
    /* overflow-y:auto; */
    border-radius: 15px;
}
.camp-activity{
    width:100%;
    height:500px;
    /* border:1px solid blue; */
    float:right;
    background-color: whitesmoke;
    border-radius: 5px;
    border-top-right-radius: 15px;;
    /* box-shadow: rgba(0, 0, 0, 0.1) 0px 4px 6px -1px, rgba(0, 0, 0, 0.06) 0px 2px 4px -1px; */
    
    background-image: linear-gradient(to right, #75ccf2, #88f5c0, #b8f9d9, #a1e7c5);
    box-shadow: 0 4px 15px 0 rgba(160, 251, 248, 0.75);
}
.camp-activity:hover{
    moz-transition: all .14s ease-in-out;
    -o-transition: all .14s ease-in-out;
    -webkit-transition: all .4s ease-in-out;
    transition: all .14s ease-in-out;
    background-image: linear-gradient(to right, #25aae1, #40e495, #30dd8a, #2bb673);
    box-shadow: 0 4px 15px 0 rgba(49, 196, 190, 0.75);
}
.camp-child-image{
    width:100%;
    height:300px;
    /* border:1px solid black; */
    display: flex;
    border-radius: 5px;
}
.camp-child-image>div{
 width:60%;
 height:100%;
 /* border:1px solid green; */
 margin-left: 10px;
 margin-top:5px;
 border-radius: 5px;

}
.camp-child-image>div>img{
    width:100%;
    height:100%;
    object-fit: cover;
    border-radius: 6px;;
}
span{
    float:right;
    margin-left:55px;
}
.camp-list{
  font-size: 20px;
  margin-left: 20px;
  margin-top:30px;
}
.campchild-description{
    height:250px;
}
table{
    width:90%;
    height:100%;
    margin-left:20px;
    /* background-color: red; */
}
td{
    margin-left: 3px;;
    /* background-color: aqua; */
    font-size: 17px;
    font-family: 'Poppins', sans-serif;
}
td:nth-child(1){
    padding-right: 30px;;
    text-decoration: underline;
    /* background-color: blue; */
}

.camp-Description{
    font-size: 30px;
    font-family: 'Poppins', sans-serif;
    color:#374f6d;
    word-wrap: break-word;
    text-align: center;
}
.camp-Description~p{
    font-size: 17px;
    font-family: 'Poppins', sans-serif;
    color:#303a5f;
    word-wrap: break-word;
    text-align: justify;
    margin:8px;
}
/* #camp-buttons{
  
    width:100%;
    height:50px;
    background-color:red;
    margin-top: 20px;
    margin-bottom: 50px;;
    display: flex;
    justify-content: center;
    align-content: center;
    flex-wrap: wrap;
    gap:20px;
}
.campbutton{
    width:60px;
    height:35px;
    color: red;
    background-color: aqua;
} */

* {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}

#camp-buttons {
    text-align: center;
}

.campbutton {
    width: 60px;
    font-size: 20px;
    font-weight: 800;
    color: white;
    cursor: pointer;
    margin: 20px;
    height: 55px;
    text-align:center;
    border: none;
    background-size: 300% 100%;
    box-shadow: rgba(0, 0, 0, 0.24) 0px 3px 8px;

    border-radius: 50px;
    moz-transition: all .4s ease-in-out;
    -o-transition: all .4s ease-in-out;
    -webkit-transition: all .4s ease-in-out;
    transition: all .4s ease-in-out;
}

.campbutton:hover {
    background-position: 100% 0;
    moz-transition: all .4s ease-in-out;
    -o-transition: all .4s ease-in-out;
    -webkit-transition: all .4s ease-in-out;
    transition: all .4s ease-in-out;
}

.campbutton:focus {
    outline: none;
}

.campbutton{
    background-image: linear-gradient(to right, #25aae1, #40e495, #30dd8a, #2bb673);
    box-shadow: 0 4px 15px 0 rgba(49, 196, 190, 0.75);
}
/* .campbutton {
    background-image: linear-gradient(to right, #25aae1, #4481eb, #04befe, #3f86ed);
    box-shadow: 0 4px 15px 0 rgba(65, 132, 234, 0.75);
} */
/* 
#footer{
    position: static;
} */

#campingdetail{
    width:80%;
    word-wrap:break-word;
    /* background-color:blue; */
    margin: auto;
    
  }
  #campingdetail>h1{
      font-size: 30px;
      color:#374f6d;
      font-family: 'Poppins', sans-serif;
       /* box-shadow: rgba(0, 0, 0, 0.1) 0px 4px 6px -1px, rgba(0, 0, 0, 0.06) 0px 2px 4px -1px; */
  }
  #campingdetail>h1~p{
      font-size: 20px;
      color:#374f6d;
      font-family: 'Poppins', sans-serif;
  }
  #moretext{
      font-size: 20px;
      color:#374f6d;
      font-family: 'Poppins', sans-serif;
  }
  #morelessbutton{
      font-size: 20px;;
      text-decoration: none;
      padding-top: 10px;;
      color:orangered;
  }
  
.locationName{
    /* display: inline-block; */
    font-size: 20px;
    font-family: 'Poppins', sans-serif;
    font-weight: 900;
    color:rgb(7, 26, 65);
    margin:20px;
    background-color: #2bb673;
    cursor: pointer;
    text-align: center;
    border-radius: 8px;
}
.locationName:hover{
    moz-transition: all .14s ease-in-out;
    -o-transition: all .14s ease-in-out;
    -webkit-transition: all .4s ease-in-out;
    transition: all .14s ease-in-out;
    background-image: linear-gradient(to right, #25aae1, #40e495, #30dd8a, #2bb673);
    box-shadow: 0 4px 15px 0 rgba(49, 196, 190, 0.75);
}
.sortbyDest{
    color:#303a5f;
    font-size: 20px;
    font-family: 'Poppins', sans-serif;
    font-weight: 900;
    cursor: not-allowed;
    text-align: center;
}



/* -------media query <<------- */

@media (min-width: 100px) and (max-width: 767px){



   } 

  