@import url('https://fonts.googleapis.com/css?family=Poppins');

.u-body {
    font-size: 0.9rem;
}

.my_grid {
  /* width: 100%; */
  /* width: fit-content; */
  /* margin: 0px auto;
  height: fit-content; */
}

/*  */

#imgProfile{
  width: 100%;
  transition-duration: .3s;
  display:block;
  overflow:hidden;
  height: 100%;
  object-fit: cover;
}

.img_thumbnail:hover   {
  -webkit-filter: brightness(50%);
}


.title{
  position: absolute;
  display: block;
  top: 94%;
  left: 47.5%;
  margin-right: -50%;
  transform: translate(-50%, -50%);
  font-size: 1.0em;
  text-shadow: 1px 1px 1px #393939;
  transition-duration: .3s;
  color: white;
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
  width: 95%;
  text-align: left;
  height: 12%;
  background-image: linear-gradient(to right, rgba(202, 191, 42, 0.74), rgba(6, 6, 6, 0));
  /* background-image: linear-gradient(to right, rgb(107, 179, 196), rgba(6, 6, 6, 0)); */
  /* background-image: linear-gradient(to right, rgb(202, 191, 42), rgba(6, 6, 6, 0)); */
  /* background-image: linear-gradient(to right, rgb(238, 223, 8), rgba(6, 6, 6, 0)); */
  /* background-image: linear-gradient(to right, rgb(148, 183, 86), rgba(6, 6, 6, 0)); */
  /* background-image: linear-gradient(to right, rgb(223, 210, 19), rgba(6, 6, 6, 0)); */
  /* opacity: 100%; */
  /* background-image: linear-gradient(to right, rgba(26, 25, 25, 0.89), rgba(6, 6, 6, 0)); */

}
.DisplayName {
  /* background-color: red; */
  position: absolute;
  top: 77%;
  /* cursor: pointer; */
  max-width: 80%;
  text-align: center;
  color: white;
  text-align: left;
  text-shadow: 1px 1px 1px black;
  font-size: 1em;
  display: block;
  margin-right: -50%;
  transition-duration: .3s;
  width: 95%;
  left: 0%;
  background-image: linear-gradient(to right, rgba(136, 198, 0, 0.74), rgba(6, 6, 6, 0));
  /* background-image: linear-gradient(to right, rgba(177, 204, 118, 0.74), rgba(6, 6, 6, 0)); */
  /* background-image: linear-gradient(to right, rgb(156, 208, 63), rgba(6, 6, 6, 0)); */
  /* background-image: linear-gradient(to right, rgb(156, 208, 63), rgba(6, 6, 6, 0)); */
  /* background-image: linear-gradient(to right, rgb(120, 183, 6), rgba(6, 6, 6, 0)) */
  /* background-image: linear-gradient(to right, rgb(198, 251, 103), rgba(6, 6, 6, 0)); */
  height: 12%;
}
.btnPlay {
  position:absolute;
  top: 35%;
  left: 36%;
  max-width: 26%;
  text-align:center;
}

.btnPlay:hover {
  transition-duration: .3s;
  transform: scale(1.1);
}
/* .container:hover img{

  transition-duration: .5s;
  filter: grayscale(50%);
  opacity: .7;
} */

.container:hover span{
  color:white;
  display: block;
  transition-duration: .3s;
}

@media (max-width: 576px) {
  .explore-more .btn {
    margin-top: 30px;
  }
}

@media (min-width: 576px) {
  /* .sec-2-cell1 {
      width:99%;
  } */
  .explore-more .btn {
    margin-top: 30px;
  }
}

@media (min-width: 660px) {
  /* .sec-2-cell1 {
      width: 46%;
  } */
  .explore-more .btn {
    margin-top: 30px;
  }
}


@media (min-width: 768px) {
  /* .sec-2-cell1 {
      width: 21%;
  } */
  .explore-more .btn {
    margin-top: 0px;
  }
}

@media (min-width: 992px){
  .sec-2-cell1 {
      width: 22%;
  }
  .explore-more .btn {
    margin-top: 0px;
  }
}

@media (min-width: 1200px) {
    .sec-2-cell1 {
        width: 22%;
    }
    .explore-more .btn {
      margin-top: 0px;
    }
}



/* @media (min-width: 576px) {
.my_container {
    width: 45%;
}
  .explore-more {
    margin-top: 30px;
  }
} */

@media (max-width: 575px){
  /* .sec-2-cell1 {
      width: 99%;
  } */

  .explore-more {
    /* margin-top: 30px; */
    /* padding-top: 30px; */
  }
}

.section2-title {
  /* background: blue; */
  display: block;
  padding-top: 20px;
}

.section2-title .u-text.text1 {
  text-align: center;
}


.explore-more {
    margin-left: auto;
    margin-right: auto;
    display: block;
    text-align: center;
    padding-bottom: 50px;
    /* margin-top: -10px; */

}

.explore-more  .btn {
  font-size: 20px;
  box-shadow: 1px 1px 3px 0 rgba(128,128,128,1);
  width : 300px;
}

.explore-more .btn-primary {
    color: #fff;
    background-color: #478ac9;
    border-color: #3e6ba2;
}

.u-clearfix .u-sheet .u-sheet-1 .u-btn-1 {
  border-radius: 20px;

}
/* ********************************************************************************* */
/* ********************************************************************************* */

.u-section-1 {margin-top:0px;padding-bottom:100px;background-image: linear-gradient(0deg, rgba(0,0,0,0.55), rgba(0,0,0,0.55)), url("../imgs/home-banner.jpeg")}
.u-section-1 .u-sheet-1 {min-height: 579px}
.u-section-1 .u-text-1 {font-weight: 700; font-family: 'Roboto', sans-serif; letter-spacing: 9px; animation-duration: 1000ms; text-shadow: 2px 0 8px rgba(128,128,128,1); padding-bottom: 15px;width: 602px; font-size: 4.5rem; margin: 241px auto 0}
.u-section-1 .u-text-2 {font-family: 'Roboto', sans-serif; background-image: none; font-size: 1.875rem; text-shadow: 2px 0 8px rgba(128,128,128,1); animation-duration: 1000ms; text-transform: none; width: 871px; margin: 0 auto;font-weight: lighter;}
.u-section-1 .u-btn-1 {text-transform: uppercase; border-style: none; animation-duration: 1000ms; font-size: 1.25rem; font-weight: normal; margin: 58px auto 60px; padding: 9px 22px 10px 21px}

@media (max-width: 1199px){
.u-section-1 {background-position: 50% 50%; margin-top: 0px;}
.u-section-1 .u-sheet-1 {min-height: 477px}
.u-section-1 .u-text-2 {margin-left: 35px; margin-right: 35px}
.u-section-1 .u-btn-1 {margin-top: 42px}
}

@media (max-width: 991px){ .u-section-1 .u-sheet-1 {min-height: 365px}
.u-section-1 .u-text-1 {margin-left: 59px; margin-right: 59px;padding-bottom: 15px;}
.u-section-1 .u-text-2 {margin-left: 0; margin-right: 0; width: 720px; }
.u-section-1 {margin-top: 0px;}}

@media (max-width: 767px){
.u-section-1 .u-sheet-1 {min-height: 274px}
.u-section-1 .u-text-1 {
  margin-left: 0; margin-right: 0; width: 540px; font-size: 3.75rem;
  margin-top: 120px;
  font-family: 'Roboto', sans-serif;
  padding-bottom: 15px;
  font-weight: lighter;
}
.u-section-1 .u-text-2 {font-size: 1.5rem; width: 540px; }
}

@media (max-width: 575px){ .u-section-1 .u-sheet-1 {min-height: 173px}
.u-section-1 .u-text-1 {font-weight: normal; letter-spacing: normal; font-size: 2.25rem; width: 340px}
.u-section-1 .u-text-2 {font-size: 1rem; width: 340px; font-weight: lighter;}
.u-section-1 .u-btn-1 {border-style: solid; font-size: 0.85rem; padding-right: 11px; padding-left: 9px} }
.u-section-2 .u-layout-wrap-1 {width: 1140px; margin: 55px auto}
.u-section-2 .u-image-1 {min-height: 386px; background-image: url("imgs/1.jpg"); background-position: 50% 50%}
.u-section-2 .u-container-layout-1 {padding: 30px}
.u-section-2 .u-layout-cell-2 {min-height: 393px; background-image: none}
.u-section-2 .u-container-layout-2 {padding: 30px 60px}
.u-section-2 .u-text-1 {text-transform: uppercase; margin: 0}
.u-section-2 .u-text-2 {font-weight: 600; font-style: italic; margin: 17px 0 0}
.u-section-2 .u-link-1 {border-style: solid; padding-bottom: 2px; text-transform: uppercase; margin: 20px 0 0}
.u-section-2 .u-image-2 {min-height: 350px; background-image: url("imgs/2.jpg"); background-position: 50% 50%}
.u-section-2 .u-container-layout-3 {padding: 30px}
.u-section-2 .u-image-3 {min-height: 350px; background-image: url("imgs/3.jpg"); background-position: 50% 50%}
.u-section-2 .u-container-layout-4 {padding: 30px}
.u-section-2 .u-image-4 {min-height: 350px; background-image: url("imgs/4.jpg"); background-position: 50% 50%}
.u-section-2 .u-container-layout-5 {padding: 30px 60px}

@media (max-width: 1199px){ .u-section-2 {height:fit-content;}
.u-section-2 .u-layout-wrap-1 {width: 940px; margin-left: calc(((100% - 1140px) / 2) + 100px)}
.u-section-2 .u-image-1 {min-height: 318px}
.u-section-2 .u-layout-cell-2 {min-height: 324px}
.u-section-2 .u-image-2 {min-height: 289px}
.u-section-2 .u-image-3 {min-height: 289px}
.u-section-2 .u-image-4 {min-height: 289px} }

@media (max-width: 991px){
.u-section-2 .u-layout-wrap-1 {width: 720px; margin-left: calc(((100% - 720px) / 2))}
.u-section-2 .u-image-1 {min-height: 244px}
.u-section-2 .u-layout-cell-2 {min-height: 100px}
.u-section-2 .u-container-layout-2 {padding-left: 30px; padding-right: 30px}
.u-section-2 .u-image-2 {min-height: 885px}
.u-section-2 .u-image-3 {min-height: 443px}
.u-section-2 .u-image-4 {min-height: 221px}
.u-section-2 .u-container-layout-5 {padding-left: 30px; padding-right: 30px} }

@media (max-width: 767px){ .u-section-2 .u-layout-wrap-1 {width: 540px; margin-left: calc(((100% - 540px) / 2))}
.u-section-2 .u-image-1 {min-height: 366px}
.u-section-2 .u-container-layout-1 {padding-left: 10px; padding-right: 10px}
.u-section-2 .u-image-2 {min-height: 664px}
.u-section-2 .u-container-layout-3 {padding-left: 10px; padding-right: 10px}
.u-section-2 .u-image-3 {min-height: 665px}
.u-section-2 .u-container-layout-4 {padding-left: 10px; padding-right: 10px}
.u-section-2 .u-image-4 {min-height: 332px}
.u-section-2 .u-container-layout-5 {padding-left: 10px; padding-right: 10px} }

@media (max-width: 575px){ .u-section-2 .u-layout-wrap-1 {width: 340px; margin-left: calc(((100% - 340px) / 2))}
.u-section-2 .u-image-1 {min-height: 230px}
.u-section-2 .u-image-2 {min-height: 418px}
.u-section-2 .u-image-3 {min-height: 419px}
.u-section-2 .u-image-4 {min-height: 209px} }
.u-section-3 {background-image: linear-gradient(#f2f2f2, #f2f2f2)}
.u-section-3 .u-sheet-1 {min-height: 612px}
.u-section-3 .u-text-1 {width: 740px; margin: 60px auto 0}
.u-section-3 .u-text-2 {width: 740px; margin: 20px auto 0}
.u-section-3 .u-list-1 {min-height: 388px; grid-gap: 10px 10px; grid-template-columns: calc(33.3333% - 7px) calc(33.3333% - 7px) calc(33.3333% - 7px); grid-template-rows: auto; width: 1140px; margin: 20px auto 60px}
.u-section-3 .u-container-layout-1 {padding: 30px}
.u-section-3 .u-icon-1 {height: 100px; width: 100px; background-image: none; margin: 0 auto}
.u-section-3 .u-text-3 {margin: 30px auto 0}
.u-section-3 .u-text-4 {margin: 20px 23px 0}
.u-section-3 .u-container-layout-2 {padding: 30px}
.u-section-3 .u-icon-2 {height: 100px; width: 100px; background-image: none; margin: 0 auto}
.u-section-3 .u-text-5 {margin: 30px auto 0}
.u-section-3 .u-text-6 {margin: 20px 23px 0}
.u-section-3 .u-container-layout-3 {padding: 30px}
.u-section-3 .u-icon-3 {height: 100px; width: 100px; background-image: none; margin: 0 auto}
.u-section-3 .u-text-7 {margin: 30px auto 0}
.u-section-3 .u-text-8 {margin: 20px 23px 0}

@media (max-width: 1199px){ .u-section-1 { margin-top:0px;}
  .u-section-3 .u-list-1 {min-height: 320px; grid-template-columns: repeat(3, calc(33.333333333333336% - 7px)); width: 940px; height: auto}
.u-section-3 .u-text-4 {margin-left: 0; margin-right: 0}
.u-section-3 .u-text-6 {margin-left: 0; margin-right: 0}
.u-section-3 .u-text-8 {margin-left: 19px; margin-right: 19px} }

@media (max-width: 991px){
  .u-section-3 .u-text-1 {width: 720px}
  .u-section-1 { margin-top:0px;}

.u-section-3 .u-text-2 {width: 720px}
.u-section-3 .u-list-1 {min-height: 735px; grid-template-columns: repeat(2, calc(((100% - 720px) / 2)  + 355px)); width: 720px}
.u-section-3 .u-text-8 {margin-left: 14px; margin-right: 14px} }

@media (max-width: 767px){ .u-section-3 .u-text-1 {width: 540px}
.u-section-3 .u-text-2 {width: 540px}
.u-section-3 .u-list-1 {grid-template-columns: repeat(1, calc(100% - 0)); width: 540px}
.u-section-3 .u-container-layout-1 {padding-left: 10px; padding-right: 10px}
.u-section-3 .u-container-layout-2 {padding-left: 10px; padding-right: 10px}
.u-section-3 .u-container-layout-3 {padding-left: 10px; padding-right: 10px}
.u-section-3 .u-text-8 {margin-left: 11px; margin-right: 11px} }

@media (max-width: 575px){ .u-section-3 .u-text-1 {width: 340px}
.u-section-3 .u-text-2 {width: 340px}
.u-section-3 .u-list-1 {grid-template-columns: 100%; width: 340px}
.u-section-3 .u-text-8 {margin-left: 7px; margin-right: 7px}
.u-section-1  {
  margin-top: 15px;
  padding-bottom: 100px;
  }

}

.col-sm-3 {
  /* background: red; */
}

.col-sm-3 .sec-2-cell1 {
  /* background-color: red; */
  /* border-radius:8px; */
  /* width:calc(33% - 6px); */
  border-radius: 10px;
  width:100%;
  overflow:hidden;
  /* height: fit-content; */
  height:260px;
  /* margin:3px; */
  /* padding: 0; */
  margin-top:25px;
  /* margin-left:5px;
  margin-right:17px; */
  display:block;
  position:relative;
  float:left;
  box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.5), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}



#section-2-row {
    margin-top: 85px;
}

/* .col-sm-3 {
    width: 23%;
    height: 200px;
    margin-right: 19px;
  } */

#video-wrapper-1 {
  /* width: calc(33% - 6px);
  overflow:hidden;
  height: fit-content;
  height:220px;
  margin:3px;
  padding: 0;
  display:block;
  position:relative;
  float:left;
  box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.5), 0 6px 20px 0 rgba(0, 0, 0, 0.19); */
    /* border-radius: 10px; */
}

#video-wrapper-2 {
    /* border-radius: 10px; */
}

#video-wrapper-3 {
    /* border-radius: 10px; */
}

#video-wrapper-4 {
    /* border-radius: 10px; */
}