/*-----------animate banner -----*/
@-webkit-keyframes zoomIn {  from {    opacity: 0;    -webkit-transform: scale3d(0.8, 0.8, 0.8);    transform: scale3d(0.8, 0.8, 0.8);  }
  50% {
    opacity: 1;
  }
}

@keyframes zoomIn {
  from {
    opacity: 0;
    -webkit-transform: scale3d(0.8, 0.8, 0.8);
    transform: scale3d(0.8, 0.8, 0.8);
  }

  50% {
    opacity: 1;
  }
}

.zoomIn {
  -webkit-animation-name: zoomIn;
  animation-name: zoomIn;
}

@-webkit-keyframes zoomOut {
  from {
    opacity: 1;
  }

  50% {
    opacity: 0;
    -webkit-transform: scale3d(0.8, 0.8, 0.8);
    transform: scale3d(0.8, 0.8, 0.8);
  }

  to {
    opacity: 0;
  }
}

@keyframes zoomOut {
  from {
    opacity: 1;
  }

  50% {
    opacity: 0;
    -webkit-transform: scale3d(0.8, 0.8, 0.8);
    transform: scale3d(0.8, 0.8, 0.8);
  }

  to {
    opacity: 0;
  }
}

.zoomOut {
  -webkit-animation-name: zoomOut;
  animation-name: zoomOut;
}

/*-----------animate banner-----*/

.row{display: -ms-flexbox;display: flex;-ms-flex-wrap: wrap;flex-wrap: wrap;}
.wrap{width:100%; margin:0 auto; height:170px; border:0px solid #F00;}
.banner{background: url(banner-bg--.jpg) no-repeat center top;display: block; padding: 10px 0px;background-size: cover;}
.banner .lft{width:300px; height:160px; margin: 5px; display:block; float:left;}
.banner .lft img {width:230px; height:125px; margin:10px auto; border-radius:10px;}
.banner .rgt{width: calc(100% - 320px); display:block; float:left;} 
.rgt a {font-size:17px; text-decoration:none; line-height: 25px; color:#fff; display:block; font-weight: 600;margin: 20px 0px 10px 5px;}
.banner p { color: #fff; font-weight: 400; margin: 5px 15px;}
.rgt strong {color: #ea1c3a;    border-bottom: 2px solid #ea1c3a;}

.owl-carousel .owl-dots{text-align: center; margin: 5px; margin-top:-20px;}
.owl-carousel .owl-dots button{ outline:0;}
.owl-carousel .owl-dots span{    padding: 4px 4px;    background-color: #848484;   display: block;    border-radius: 40px;    margin: 0% 5px;    border: 4px solid #d7d8d8;}
.owl-carousel .owl-dots .active span{
	background-color: #c00;
	border: 4px solid #fc6;
}


@media only screen and (max-width: 1024px) {
.banner p{font-size: 13px;}
.banner h1{margin-top: 0%;}
}

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

}

@media only screen and (max-width: 800px) {
.wrap{height:auto;}
.banner .lft{width:100%; height:auto; float:none;}
.banner .rgt{width:100%; height:auto; float:none;} 
.owl-carousel .owl-dots span{padding: 4px 4px;border: 2px solid #d7d8d8;margin: 30px 3px 0px;}
.owl-carousel .owl-dots .active span{border-width: 2px;}
.banner h1{font-size:15px; width:90%; line-height: 25px; text-align:center;}
}

@media only screen and (max-width: 640px) {
.banner p{display:none;}

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

}

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

}