body{
	font-family: "Verdana,sans-serif" !important;
}

h1,h2,h3,h4,h5,h6{
	font-family: serif !important;
}

p{
	letter-spacing: 0.6px;
	font-size: 18px !important;
}

.owl-carousel-item img{
	height: 700px;
	object-fit: fill;
}

.service-section{
	background-color: #f5f5f5;
	padding: 40px 0px;
}

.mr-20{
	margin-right: 20px;
}

.bg-color-i{
	    background-color: #2AADC7;
}

.service-item h4{
	display: contents;
}

.rounded-circle-style{
	width: 75px; 
	height: 75px;
	margin-right: 10px;
}

.product-item{
	text-align-last: center;
	padding: 23px 15px 5px 15px;
}

.product-item span {
  position: relative;
  display: inline-block;
  font-size: 20px;
  font-weight: 600;
  color: royalblue;
  overflow: hidden !important;
  background: linear-gradient(to right, midnightblue, midnightblue 50%, royalblue 50%) !important;
  background-clip: text !important;
  -webkit-background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  background-size: 200% 100% !important;
  background-position: 100% !important;
  transition: background-position 275ms ease !important;
  text-decoration: none !important;
}

.product-item:hover{
	cursor: pointer;
}

.product-item:hover span{
	background-position: 0 100% !important;
}

.outer {
  column-width: 11em;
  margin: 20px;
}

.box {
  color: white;
  background: blue;
  padding: 10px;
  margin-bottom: 20px;
  max-width: 5em;
  page-break-inside: avoid;   /* Chrome needs this */
  break-inside: avoid-column; /* IE10 and IE11 need this */
}

.hide{
  display: none !important;
}

.container-404{
  background-color: #f5f3f3;
}
    

.btn:focus, .btn:active, button:focus, button:active {
  outline: none !important;
  box-shadow: none !important;
}

#image-gallery .modal-footer{
  display: block;
}

.thumb{
  margin-top: 15px;
  margin-bottom: 15px;
  text-align-last: center;
}

.float-right{
  float: right !important;
}

.img-thumbnail{
    height: 350px;
    width: 300px;
}

#image-gallery .modal-body{
  margin: auto;
}

#image-gallery .col-md-12{
  width: auto;
}

.img-thumbnail:hover{
    box-shadow: 0px 1px 8px 3px #605d5d;
}

.modal-content-product{
  background-color: transparent !important;
  border: none;
}

.modal-header,
.modal-footer{
  border: none;
}

.modal-dialog {
  width: 100%;
  height: 100%;
  margin: auto;
  padding: 0;
}

.modal-content {
  height: auto;
  min-height: 100%;
  border-radius: 0;
}

.fa-xmark{
    color: #fff;
    background: #000;
    border-radius: 50%;
    border: none;
    padding: 6px 10px;
}

.btn-secondary-model{
  color: #fff;
  background: #000 !important;
  border-color: #6c757d; 
}





@media only screen and (max-width: 580px) {
  
    .ms-4{
      margin-left: 0.5rem !important; 
    }

    h5{
      font-size: 16px;
    }

    .product-item span {
        font-size: 16px;
    }

    .product-item {
        text-align-last: center;
        padding: 17px 15px 5px 15px;
    }

    .rounded-circle-style {
        width: 60px;
        height: 60px;
    }
}


@media only screen and (max-width: 680px) {
  
    .back-to-top{
      right: 15px;
      bottom: 15px;
      border: 1px solid #fff;
    }

    .list-section .rounded-pill{
      margin-bottom: 0px !important;
    }

    .owl-carousel-item img {
        height: 485px;
        object-fit: fill;
    }
}



@media only screen and (max-width: 440px) {
  
    .btn-lg-square{
      width: 30px;
      height: 30px;
      font-size: 1rem !important;
    }

    .rounded-circle-style {
        width: 50px;
        height: 50px;
    }

    .svg-inline--fa{
      font-size: 18px !important;
    }
}


@media only screen and (max-width: 310px) {
  
    .rounded-circle-style {
        width: 45px;
        height: 45px;
    }

    .svg-inline--fa{
      font-size: 17px !important;
    }

    .ms-4{
      margin-left: 0rem !important; 
    }

    h5{
      font-size: 14px;
    }
}