.banner{background: url(../images/banner.jpg) no-repeat center center; background-size: cover; height: 360px;}
.banner-content{padding-top: 100px;}
.banner-content h1{font-size: 3rem; color: #be1d2c; font-family: 'Helvetica Inserat LT Std', sans-serif; text-align: center;}
.banner-content p{color: #fff; font-size:1.6rem;}
.banner-content p,.bannerBtnBox{width: 100%;text-align: center;}
.page{padding: 4rem 0;}
.page h3,.page h4{text-align: center; font-size: 2rem; padding: 20px; padding-bottom: 20px; color: #0c3178; font-weight: bold;}
.page h4 i{font-size: 2.4rem;}
.gray{background:#f0f0f0;}
.text-box{text-align: left;padding-top: 15px;}
.video-bg {background: #fff; padding: 30px 15px; box-shadow: 1px 1px 12px #ccc; margin-top: 20px;}
.w640{width: 640px;}
.x-box {text-align: center; margin-bottom: 40px;}
.x-box p{width: 80px; height: 80px;  background: #dde1e7; border-radius: 60px; text-align:center; line-height: 80px;margin: 0 auto; margin-bottom: .6rem;}
.x-box i{font-size: 4.6rem; color: #0c3178; vertical-align: middle;}
#features{padding-bottom: 40px;}
.btn-center .xero-arrow-down{
  -webkit-animation: arrow 1.5s infinite ease-in-out;
}
.cp-main-content{line-height:1.8em;}

.xpt-box{margin-top: 10px; }
.xpt-box-img{max-width: 350px; overflow: hidden; }
.xpt-box img{    transition: .3s transform;}
.xpt-box h5{margin-top: 12px; text-align: center; color:#0c3178; font-weight: bold; font-size: 1.8rem;}
.btn-center{text-align: center; margin-top: 2rem;}
.btn-center i{vertical-align: middle; font-size: 1.4rem; line-height: 1.6rem;}
.xpt-box img:hover{
  transform: scale(1.3,1.3);
    transition: .3s transform;
}
.mt60{margin-top: 30px;}
.xr-box-one{margin-top: 60px; background: #fff; padding: 15px;border-bottom: 4px solid #0c3178;
}
.xr-box-one:first-child{margin-top: 10px;}
.xr-box-one:hover{border-bottom-color: #be1d2c;}

.xr-box-one h5{padding-top: 10px; color: #0c3178;font-weight: bold;font-size: 1.8rem;}
.formpage{ background: url(../images/form-bg.jpg) no-repeat right 18%; min-height: 600px; height: auto !important;}
.xeroform label{color: #fff !important;}
.xeroform span{color: #be1d2c;}
.xeroform h3{color: #fff; padding-bottom: 0; padding-top: 20px;}
.xeroform p{color: #999;}
.xeroform form{margin-top: 60px;}
.pb80{padding-bottom: 80px;}
.with-errors li{color: #be1d2c ;}
.has-error .form-control {
  border-color: #be1d2c;
  -webkit-box-shadow: inset 0 1px 1px rgb(0 0 0 / 8%);
  box-shadow: inset 0 1px 1px rgb(0 0 0 / 8%);
}
.has-error .form-control:focus {
  border-color: #be1d2c;
  -webkit-box-shadow: inset 0 1px 1px rgb(0 0 0 / 8%), 0 0 6px #ce8483;
  box-shadow: inset 0 1px 1px rgb(0 0 0 / 8%), 0 0 6px #ce8483;}
/*btn*/
.btn-danger:not(:disabled):not(.disabled).active:focus, .btn-danger:not(:disabled):not(.disabled):active:focus, .show>.btn-danger.dropdown-toggle:focus {
    box-shadow: 0 0 0 0.2rem rgb(225 83 97 / 50%);
}
.btn-danger:not(:disabled):not(.disabled).active, .btn-danger:not(:disabled):not(.disabled):active, .show>.btn-danger.dropdown-toggle {
    color: #fff;
    background-color: #dc3545;
    border-color: #dc3545;
}
.btn-danger.focus, .btn-danger:focus {
    color: #fff;
    background-color: #dc3545;
    border-color: #dc3545;
    box-shadow: 0 0 0 0.2rem rgb(225 83 97 / 50%);
}
.btn-danger:hover {
    color: #fff;
    background-color: #dc3545;
    border-color: #dc3545;
}
.btn-danger {
    color: #fff;
    background-color: #be1d2c;
    border-color: #be1d2c;
    border-radius: 40px;
   
}
#xr-video{
  width: 360px;
}
.w60{width: 180px; display: flex; justify-content:center; align-items:center;}
.btnshine{
    background: linear-gradient(-45deg, #be1d2c 50%, #f58c98 60%, #be1d2c 70%);
    background-size: 600% 100%;
    -webkit-animation: shine 10s infinite;
    animation: shine 10s infinite;
-webkit-animation-delay: 0s;
    animation-delay: 0s;
-webkit-animation-timing-function: linear;
    animation-timing-function: linear;
}
.gray2{
  background: #0c3178 url(/images/logo-bg.jpg) no-repeat left top; padding-top:30px; padding-bottom: 60px; 
}
.logobox{background: #fff; box-shadow: 1px 1px 12px #666; border-radius: 8px; margin-top:30px; }
#rModel{
  top:20%;
}
#rModel .modal-header{background: #0c3178;}
.modal-header h5{ color: #fff; font-size: 20px;}
.modal-header .close{color:#fff;}
@-webkit-keyframes shine {
    0% {
      background-position-x: 400%;
    }
    50% {
      background-position-x: 0%;
    }
    100% {
      background-position-x: -400%;
    }
  }
  
  @keyframes shine {
    0% {
      background-position-x: 400%;
    }
    50% {
      background-position-x: 0%;
    }
    100% {
      background-position-x: -400%;
    }
  }

 
@-webkit-keyframes arrow {
0% {
opacity:0;
-webkit-transform:translate(0, 0px)
}
50% {
opacity:1;
-webkit-transform:translate(0, -5px)
}
100% {
opacity:0;
-webkit-transform:translate(0, -10px)
}
}
@media (max-width: 375px){
  #xr-video{
    width: 315px !important;
    height: 177px !important;
  }
}
@media (max-width: 390px){
  #xr-video{
    width: 330px !important;
    height: 185px !important;
  }
}
@media (max-width: 767px){
.pb80 .row, #xeroForm .row{margin-left:0; margin-right:0;}
.page p{margin-bottom:30px;}
.xeroform form{margin-top: 30px;}
}
@media (min-width: 768px) {
  #xr-video{
    width: 708px !important;
    height: 398px !important;
  }
  .banner{background: url(../images/banner.jpg) no-repeat center center; background-size: cover; height: 420px;}
  .banner-content h1{font-size: 4rem;}
  .banner-content{padding-top: 140px;}
  .page h3,.page h4{ font-size: 2.4rem;}
  .x-box p{width: 120px; height: 120px;  background: #dde1e7; border-radius: 60px; text-align:center; line-height: 120px;margin: 0 auto; margin-bottom: .6rem;}
  .xr-box-one h5{padding-top: 30px;}
  .formpage{ background-position: center 18%; padding: 0;}
  .xeroform{padding: 4rem 15px; background:#0c3178; padding-left: 30px;}
}
@media (min-width: 992px){
  .banner-content h1{text-align: left;}
  #xr-video{
    width: 435px !important;
    height: 244px !important;
  }
  .banner-content p,.bannerBtnBox{width: 400px;} 
  .banner{background: url(../images/banner.jpg) no-repeat center center; background-size: cover; height: 520px;}
  .formpage{ background-position: center 18%;}

}
@media (min-width: 1200px){
  #xr-video{
    width: 525px !important;
    height: 295px !important;
  }
  .banner{background: url(../images/banner.jpg) no-repeat center center; background-size: cover; height: 520px;}
  .formpage{ background-position: left 18%;}
}