/** page-title **/



.page-title{

  position: relative;

}



.page-title .bg-layer{

  position: absolute;

  left: 0px;

  top: 0px;

  width: 100%;

  height: 100%;

  background-size: cover;

  background-repeat: no-repeat;

  background-position: center;

}



.page-title .bg-layer:before{

  position: absolute;

  content: '';

  background: #000;

  width: 100%;

  height: 100%;

  left: 0px;

  top: 0px;

  opacity: 0.6;

}



.page-title h1{

  display: block;

  font-size: 70px;

  line-height: 70px;

  color: #fff;

  margin-bottom: 40px;

}



.page-title .bread-crumb{

  position: relative;

  display: inline-flex;

  align-items: center;

  justify-content: center;

  background: rgba(255, 255, 255, 0.20);

  border: 1px solid #fff;

  border-radius: 50px;

  gap: 25px;

  padding: 5px 20px;

}



.page-title .bread-crumb li{

  position: relative;

  display: inline-block;

  font-size: 18px;

  line-height: 28px;

  color: #fff;

  font-weight: 500;

  text-transform: uppercase;

}



.page-title .bread-crumb li a{

  display: inline-block;

  color: #fff;

}



.page-title .bread-crumb li a:hover{

  color: #0077B6;

}



.page-title .bread-crumb li:before{

  position: absolute;

  content: "\f105";

  font-family: 'Font Awesome 5 Pro';

  top: 0px;

  right: -16px;

  font-weight: 400;

}



.page-title .bread-crumb li:last-child:before{

  display: none;

}







/** rtl-css **/



.rtl .page-title .bread-crumb li:before{

  right: inherit;

  left: -16px;

}



/** responsive-css **/



@media only screen and (max-width: 1200px){



}



@media only screen and (max-width: 991px){



}



@media only screen and (max-width: 767px){

  .page-title{

    padding: 65px 0px 70px 0px;

  }



  .page-title h1{

    font-size: 50px;

    line-height: 60px;

  }

}



@media only screen and (max-width: 599px){



}



@media only screen and (max-width: 499px){



}