/*shadow*/
.box-shadow-01{
  box-shadow: rgba(149, 157, 165, 0.2) 0px 8px 24px!important;
}

/*********************
	featue box line
*********************/
.line-001 {
    border-bottom: 5px solid #152773; transition: 0.5s ease;
}
.line-001:hover {
    border-bottom: 5px solid #152773;
    transform: translate(0px,-10px);
    transition: 0.5s ease;
}

/*********************
		icon hover 
*********************/
.sppb-addon.sppb-addon-feature.hover-scale-icon:hover img {
    transform: translate(0px, -10px);
    transition: 0.3s ease; 
}

.sppb-addon.sppb-addon-feature.hover-scale-icon img {
    transition: 0.3s ease;
    
}

/*********************
	hover-effect
*********************/
.hover-up:hover {
    transform: translate(0px, -10px);
    transition: 0.3s ease; box-shadow: rgb(234 190 101 / 57%) 0px 10px 36px 0px, rgb(233 238 255) 0px 0px 0px 1px!important;
}
.hover-up {
    transition: 0.3s ease; 
}

/*********************
	feature-box-001
*********************/
.feature-box-001 img.sppb-img-responsive {
    background: white;width: 150px;
    border-radius: 50%;box-shadow: rgb(13 62 147 / 15%) 0px 10px 36px 0px, rgb(13 62 147 / 9%) 0px 0px 0px 1px!important;
}

.feature-box-001:hover h3:before{width: 120px;transition:0.3s ease;}


/*********************
	feature-box-002
*********************/
.feature-box-002 img.sppb-img-responsive {
    background: white;width: 100px;
    border-radius: 50%;box-shadow: rgb(13 62 147 / 15%) 0px 10px 36px 0px, rgb(13 62 147 / 9%) 0px 0px 0px 1px!important;
}

.feature-box-002:hover h3:before{width: 120px;transition:0.3s ease;}



/*********************
title-border-bottom
*********************/
.title-border-bottom h3{position:relative!important;}

.title-border-bottom h3:before{
  position:absolute!important;
  content:'';
  background: #0d3e93;
  width: 80px;
  height: 3px;
  top: 36px;
  right: 0;
  left: 0;
  margin: auto;
  transition:0.3s ease;}

@media screen and (max-width:480px){
.title-border-bottom h3:before{top: 30px;transition:0.3s ease;}
}



/*********************
line-002
*********************/
.line-002 h3{position:relative;}

.line-002 h3:before{
  position:absolute;
  content:'';background: #0d3e93;width: 80px;height: 3px;
  top: 36px!important;
  left: 0;
  transition:0.3s ease!important;}

@media screen and (max-width:480px){
.line-002 h3:before{
  top: 38px!important;
  transition:0.3s ease!important;
  }
}




/*********************
image-border-left
*********************/
.image-border-left {position:relative;}
.image-border-left:before{position:absolute;content:'';background: #0d3e93;width: 5px;height: 90px;top: 0px!important;/* right: 0; */left: -7%;z-index: 20;bottom: 0;margin: auto;transition:0.3s ease;}

.image-border-left:hover:before{height: 120px;}



/***************************
	img overlay
****************************/
.overlay-image-title {
    background: #172b43;
    width: 100%;
    text-align: center;
    padding:20px 10px;
}

.sppb-addon-overlay-image-content.title-subtitle-bottom-left {
    padding: 0px;
}

.title-subtitle-bottom-left .sppb-addon-title, .title-subtitle-center-left .sppb-addon-title, .title-subtitle-top-left .sppb-addon-title {
    transform: translate3d(0px,0,0);margin:0px;
}

/***************************
	shadow
****************************/
.shadow-001{
    box-shadow: rgba(100, 100, 111, 0.2) 0px 7px 29px 0px!important;
}
.shadow-box-01{
    box-shadow: rgb(0 0 0 / 18%) 0px 10px 36px 0px, rgba(0, 0, 0, 0.06) 0px 0px 0px 1px!important;
}

/***************************
	career hover
****************************/
.hover-001:hover {
  transition:0.3s ease!important;box-shadow: rgba(100, 100, 111, 0.2) 0px 7px 29px 0px!important;
}
.hover-001 {
   transition:0.3s ease!important;
}

/***************************
	zindex
****************************/
.zindex60{z-index:60!important;}
.zindex50{z-index:50!important;}

/***************************
	effect
****************************/
.float{
    -webkit-animation-name: float!important;
    -webkit-animation-duration: 3500ms!important;
    -webkit-animation-iteration-count: infinite!important;
    -webkit-animation-timing-function: linear!important;}
.spin{
    -webkit-animation-name: spin!important;
    -webkit-animation-duration: 3500ms;
    -webkit-animation-iteration-count: infinite;
    -webkit-animation-timing-function: linear;}



/*float*/
@keyframes float {
	0% {
	
		transform: translatey(0px);
	}
	50% {

		transform: translatey(-20px);
	}
	100% {

		transform: translatey(0px);
	}
}
/*spin*/
@-moz-keyframes spin {
    from { -moz-transform: rotate(0deg); }
    to { -moz-transform: rotate(360deg); }
}
@-webkit-keyframes spin {
    from { -webkit-transform: rotate(0deg); }
    to { -webkit-transform: rotate(360deg); }
}
@keyframes spin {
    from {transform:rotate(0deg);}
    to {transform:rotate(360deg);}
}


/*texture*/
.dotted-background{
background-color: #008e9a;
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='4' height='4' viewBox='0 0 4 4'%3E%3Cpath fill='%23ffffff' fill-opacity='0.3' d='M1 3h1v1H1V3zm2-2h1v1H3V1z'%3E%3C/path%3E%3C/svg%3E");}


/*slanted*/
.slanted-shaped-001:after {
    position: absolute;
    background: #f5f5f5;
    bottom: 0;
    right: -2%;
    width: 39.8%;
    height: 30px;
    -webkit-transform: skew(-34deg);
    transform: skew(-34deg);
    content: " ";
}

.slanted-shaped-001:before, .slanted-shaped-002:before {
    content:" ";
    position: absolute;
    background:#293940;
    top: -30px;
    right: -10px;
    width: 70%;
    height: 30px;
    -webkit-transform: skew(-34deg);
    transform: skew(-34deg);
}
@media(max-width:767px){
  .slanted-shaped-001:after, .slanted-shaped-002:before, .slanted-shaped-001:before{display:none;}
}