/* my custom style */

/* Home */
.text-border {
    border-left: 10px solid #da291c !important;
 }

 .text-border1 {
    border-left: 10px solid #004a8f !important;
 }

.text2 {
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2; /* number of lines to show */
    -webkit-box-orient: vertical;
 }

 .text1 {
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 1; /* number of lines to show */
    -webkit-box-orient: vertical;
 }

 .text4 {
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 4; /* number of lines to show */
    -webkit-box-orient: vertical;
 }
 .img-container {
    position: relative;
    font-family: Arial;
  }
 .text-block {
    position: absolute;
    top: 20px;
    left: 20px;
    width: 135px;
    background-color: #da291c;
    color: white;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
  }
  .text-block1 {
    position: absolute;
    top: 55px;
    width: 135px;
    height: 100px;
    left: 20px;
    background-color: white;
    color: black;
    border-bottom-right-radius:5px;
    border-bottom-left-radius: 5px;
  }
.explore {
    background-color: #004a8f;
    border: none;color: white;
    padding: 10px 40px;
    border-radius: 5px;
}
.mred {
    color: #da291c !important;
}
.mblue {
    color: #004a8f !important;
}
.radius5 {
    border-radius: 5%;
}

.radius2 {
    border-radius: 2%;
}

.radius1 {
    border-radius: 1%;
}
.bg-dw {
    background-color: #f3f2ee !important;
}


.bg-mred {
    background-color: #da291c !important;
}

.bg-mblue {
    background-color: #004a8f !important;

}

.bg-ww {
    background-color: red !important;

}

.bg-wt {
    background-color: #f9f9f7 !important;
}
.red12 {
    color: white;
    background-color: #da291c !important;
    margin:10px -17px 0 0;
    padding:10px 10px;
    font-size:16;
}
.red90 {
    font-size:70px;
    color: white;
    background-color: #da291c !important;
    margin:10px 0 0 -17px;
    text-align:center;
}
.lab {
    font-size: 30px;
    border-radius: 50%;
    padding: 10px 17px;
    color:white !important;
    background-color: #004a8f !important;
}
.map {
    width: 100%;
    height: 500px;
}
.pad4 {
    padding-top: 4rem;
}
.login-btn {
    margin-left: 30px;
    background: #f3f2ee;
    color: #222221 !important;
    border-radius: 4px;
    text-decoration: none;
    padding: 8px 25px;
    white-space: nowrap;
    transition: 0.3s;
    font-size: 14px;
    font-weight: 600;
    display: inline-block;

}


/* about page */
.heading {
    max-width:350px !important;
    text-align:center;
    background-color:black;
    margin: 50px 20px 10px -50px !important;
    color:white;
    padding:10px 10px 10px 50px !important;
    font-size:16;
 }

 .card-container {
     padding: 40px auto;
 }
 .mp-btn {
    max-width:300px;text-align:center;
    margin: 50px auto 15px auto;
    color:white;
    background-color:#da291c !important;
    padding:10px 10px;
    font-size:16;
 }
 .mpd-btn {
    border-radius:2%;
    max-width:450px;
    text-align:center;
    margin: 50px auto 15px auto;
    color:white;
    background-color: #004a8f !important;
    padding:25px 25px; font-size:14;
 }
 .mar1 {
    margin: 10px 0 20px 20px !important;
 }
 .card-a1 {
    border-bottom: 7px solid #004a8c !important;
    max-width: 540px;
    background-color: #f9f9f7;
 }
 .card-a2 {
    border-bottom: 7px solid #da291c !important;
    max-width: 540px;
    background-color: #f9f9f7;
 }

 /* stories page */
 .img {
    width: 340px; /* You can set the dimensions to whatever you want */
    height: 220px;
    object-fit: cover;
}
.card1 {
        float: none; /* Added */
        margin: -50px auto 10px auto;
}
.social {
    background-color: white !important;
    border:1px solid #9e9e9d;
    padding:1px 2px;
}

/* data board */
* {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
    font-family: 'Montserrat', sans-serif
  }
  .text-center{
    text-align: center;
  }
  .font-size-24{
      font-size: 24px;
      color: #fff;
  }

  .mainContent {
    width: 80%;
    position: relative;
  }


  .sidebar {
  top: 130px !important;
  width: 16%;
  height: 250px;
  background-color: #f3f2ee;
  border-left: 5px solid red;
  position: fixed;
      top: 0
  }
  .content{
    float: right;
    width: 80%;
    background: #666c82;
    /* height: 1200px; */
    /* padding: 45px 15px; */
  }
  .collapse1{
  overflow-x:auto !important;
  /* height:200px; */
  }

  /* gallery */
  * {box-sizing: border-box;}

  .containers {
    position: relative;
    width: 90%;
    max-width: 290px;
  }
  .image {
      max-height:500px;
      max-width:290px;
      padding: 0 15px;
      margin: 40px 0 0 0;
  }
  .overlay {
    position: absolute;
    bottom: 0;
    background: rgb(0, 0, 0);
    background: rgba(0, 0, 0, 0.1); /* Black see-through */
    color: #f1f1f1;
    opacity: 0.3;
    width: 260px;
    transition: .5s ease;
    opacity:0;
    color: white;
    font-size: 12px;
    margin:0 0 0 16px;
    padding: 5px;
  }

  .containers:hover .overlay {
    opacity: 1;
  }

  .box {
      margin: 20px auto 40px auto !important;
  }


  /* contact page */
  .mp-btn1 {
    width: auto;
    text-align:center;
    margin: 40px auto 10px auto;
    color:white;
    background-color:black;
    padding:10px 10px;
    font-size:13;
 }
 .mp-btn2 {
    max-width: 50%;
    text-align:center;
    margin: 40px auto 10px auto;
    color:white;
    background-color:black;
    padding:10px 10px;
    font-size:13;
 }