.pg_flip_dsn{
  display: flex; position: absolute; 
  border-image: linear-gradient(#268facdf, #dde5e8cd) 50;
  border-width: 20px;
  border-style: solid; width: 400px; height: 400px; box-sizing: border-box;
  animation: revCs 2s linear 1s infinite alternate;
    transition: all 0.6s;
      }
      .pg_design_l{
      transform: skew(-15deg, -15deg);
      }
      @keyframes revCs {
        0%{border-image: linear-gradient(#268facdf, #dde5e8cd) 50;}
        100%{
          border-image: linear-gradient(#dde5e8cd, #268facdf) 50;
        }                
      }
      .pg_design_r{
          transform: skew(15deg, 15deg);
      }
      @media screen and (max-width: 1024px) {
        .pg_flip_dsn{
        width: 350px; height: 350px;
      }
      }
      @media screen and (max-width: 850px) {
        .pg_flip_dsn{
        width: 300px; height: 300px;
      }
      }
      @media screen and (max-width: 550px) {
        /* .page-artic-wrapp{
         margin: 2rem auto !important;} */
        .pg_flip_dsn{ 
       display: none;
      }
      }
      .txt {
        max-width: 900px;
        margin-top: 0px;
        line-height: 1.7;
      } .hp_artic_img_wrapp{ height: auto; width: 96%; display: flex; justify-content: center; align-items: center; position: relative; box-sizing: border-box; max-width: 400px; margin-top: 0px;
} .hp_ilu_img{
width: 100%;
height: auto;
z-index: 10;
} #top_cont_holder{display: flex; 
/* background: radial-gradient(circle at bottom right, #268fac 0%, #fff 15%, #fff 95%, #268fac 100%);  */
justify-content: space-evenly; 
align-items: center; 
box-sizing: border-box; 
width: 100%; 
max-width: var(--page-max-width);
margin: auto;
height: auto;} #top_img_wrap{
    overflow: hidden; width: 45%; 
    border-radius: 2.5rem; display: flex; justify-content: center; align-items: center; 
    animation: shake 1s alternate 0s infinite;
transition: .3s; transform: scale(1); }
#hilight_txt{color: var(--color-main);}
@keyframes shake {
0%{
    transform: scale(1);
}100%{
    transform: scale(0.98);
} }
.sw_boxes_wrapper{ position: relative; max-width: var(--page-max-width); height: auto; min-height: 300px; width: 100%; display: flex; padding-bottom: 2rem; justify-content: space-evenly; align-items: center; flex-wrap: wrap; margin: auto;
}
.sw_boxes_wrapper article > figure{
height: 70px;
width: 70px;
color: var(--color-main);
border-radius: 35px;
box-sizing: border-box;
background-color: inherit;
border: 2px solid var(--color-main);
padding: 0.3rem;
position: absolute;
top: -50px;
left: -20px;
}
.sw_boxes_wrapper section{
width: calc(88% / 3);
background-color: #ffffff;
cursor: pointer;
color: var(--txt-color-normal);
position: relative;
padding: 1rem;
display: flex;
flex-direction: column;
height: auto;
min-height: 100px;
box-sizing: border-box;
border-radius: 1rem;
transition: all .6s;
box-shadow: 1px 1px 3px #3f3f3f;
}
.sw_boxes_wrapper section:hover, .sw_boxes_wrapper section:active, .sw_boxes_wrapper section:focus{
box-shadow: 0px 0px 10px #686868;
}
/* do biz styling.. */
.w_type_boxes h2{
font-size: 2.5rem;
}
.w_type_boxes{
justify-content: flex-start !important;
min-height: 258px !important;
text-align: left;
}
.do_biz_fig_wrap{
box-shadow: none !important;
}
#do_biz_wrapp{
min-height: 600px;
padding-top: 7rem; padding-bottom: 7rem;
height: auto;
background: radial-gradient(circle at top left, #268fac 0%, #282727 25%, #282727 100%);
}
.do_biz_figure{
background-color: transparent;
color: var(--color-main);
height: 60px;
width: 60px;
border-radius: 30px;
display: flex;
justify-content: center;
align-items: center;
}
.oversized_boxes{
margin: 3rem auto;
position: relative;
overflow: hidden;
box-sizing: border-box;
}
.curve_bigbox{
width: 100%;
border-radius: 2rem;
box-shadow: 0px 0px 15px #d8d8d8;
max-width: var(--page-max-width) !important;
padding-top: 2rem !important;
padding-bottom: 2rem !important;
overflow: visible !important;
background-color: #fafafa;
}
#do_biz_intro{
width: 100%;
margin: auto;
position: relative;
display: flex;
justify-content: flex-start;
align-items: flex-start;
text-align: left;
box-sizing: border-box;
flex-direction: column;
max-width: var(--page-max-width) !important;
}
#do_biz_intro p{
color: #cccaca;
max-width: 750px;
}
#do_biz_intro .hp_data_hd{
  color: #d6d5d5 !important;
  text-align: left !important;
}
.hp_data_hd{
font-weight: 800;
font-size: 2.7rem;
margin: auto; 
color: var(--txt-color-normal);
text-align: center; 
box-sizing: border-box; 
margin-bottom: 1rem; 
}
.hilight_txt{color: var(--color-main);}
/* the end.. */
#img_box{
display: block;
height: auto;
width: 100%;
}
#top-anim-holder{
height: auto;
min-height: 360px;
background-color: transparent;
width: 50%;
display: flex;
justify-content: center;
align-items: flex-start;
flex-direction: column;
box-sizing: border-box;
cursor: default;
}
#top-anim-header{
position: relative;
text-align: left;
font-weight: 900;
margin: 0px;
left: auto;
color: #252424;
font-family: Verdana, Geneva, Tahoma, sans-serif;
text-transform: uppercase;
padding: 0px;
font-size: 3.4rem;
line-height: 1.1;
}
#top-anim-body{
position: relative;
text-align: left;
font-size: 1.1rem;
font-weight: bold;
padding: 1.5rem;
line-height: 1.6;
color: #545353;
padding-top: 0px;
}
#top-anim-link, #top-anim-link2{
height: auto;
position: relative;
box-sizing: border-box;
left: 0px;
border-radius: 0.5rem;
width: auto;
background-color: var(--color-main);
color: white;
font-weight: bolder;
box-sizing: border-box;
padding: 12px 35px;
text-decoration: none;
font-size: 1.4rem;   
opacity: 1; 
transition: all 0.6s;
border: 2px solid var(--color-main);
}
#anim-btn{
      display: flex; padding-left: 1.5rem; justify-content: flex-start; align-items: center; flex-wrap: wrap; 
    }
    #top-anim-link:focus, #top-anim-link:hover, #top-anim-link:active{
      color: var(--color-main) !important;
      background-color: transparent !important;
    }
    #top-anim-link2{
      background-color: transparent;
      margin-left: 1rem;
      color: var(--color-main);
    }
.anim-btn{ 
opacity: 1; 
bottom: 0px;
animation: up 1s linear 0s 1;
}
@keyframes up {
  0%{
      opacity: 0;
  } 100%{
      bottom: 0px;
      opacity: 1;
  } }
#top-anim-link:hover, #top-anim-link:active, #top-anim-link:focus, #top-anim-link2:hover, #top-anim-link2:active, #top-anim-link2:focus{
  color: #ececec;
  background-color: var(--color-main);
}
#site-intro-banner{
margin: auto;
display: flex;
width: 100%;
height:calc(100vh - 60px); 
margin-top:0px;
max-height: calc(100vh - 60px) !important; 
box-sizing: border-box;
overflow: hidden;
}


/* .page-artic-wrapp{
  margin:6rem auto;
  display: flex; 
  align-items: center;
  justify-content: space-evenly;
  width: 90%;
  height: auto; 
  padding: 1rem;
  background-color: transparent;
  box-sizing: border-box;
} */
.arrow-spn{
  font-size: 1.6rem;
  padding: 0px !important;
  position: relative;
  display: block; 
  background-color: inherit;
  box-sizing: border-box;
  right: -2px; 
  transition: .4s; 
  cursor: pointer;
}
.img-wrapper{
  max-width: 300px;
  width: 96%;
  overflow: hidden !important;
  min-height: 250px;
  height: auto;
  justify-content: center;
  align-items: center;
  display: flex;
  box-sizing: border-box;
  background-color: #fff;
}
.info-wrapper{
  width: auto;
  box-sizing: border-box;
  display: flex;
  flex-direction: column;
  justify-content: left;
  align-items: flex-start;
  gap: 0.5rem;
  text-align: left;
}
.info-wrapper h2{
  margin: 0px;
  padding: 1rem; 
  font-size: 2rem;
  max-width: 500px;
  color: rgb(95, 94, 94);
}
.info-wrapper p{ 
  max-width: 550px;
  padding: 0px 1rem; 
  font-size: 1.1rem;
  color: #696868;
  line-height: 1.6;
}
.info-wrapper span{ 
  padding: 0px 1rem;
  display: flex;
  justify-content: left;
  align-items: center;
}
.w_type_boxes:focus, .w_type_boxes:hover, .w_type_boxes:active{
  margin-top: -10px !important;
}
.w_type_boxes{
  margin: 1rem !important;
}
.link_arrow_wrap{
width: 100%; font-size: 1.2rem; display: flex; justify-content: center; align-items: center;
}

.our_init_box_wrap::after {
  content: attr(num-data-content);
  height: 100%;
  width: 100%;
  display: block;
  position: absolute;
  top: 1rem;
  left: 1rem;
  opacity: 0.09;
  font-size: 150px;
  font-weight: 900;
  transition: .6s;
}
.our_init_box_wrap {
  display: flex;
  position: relative;
  height: 340px;
  width: 370px;
  justify-content: center;
  align-items: center;
  flex-direction: column;
  border-radius: 1rem;
  box-shadow: 0px 0px 10px #ebebeb;
  cursor: pointer;
  padding: 1.5rem;
  box-sizing: border-box;
  margin-bottom: 3rem;
  transition: .9s;
}
.our_init_box_wrap:hover, .our_init_box_wrap:focus, .our_init_box_wrap:active{
  box-shadow: 0px 0px 15px #a5a5a5;

}
#init_box_holder {
  display: flex;
  justify-content: space-evenly;
  max-width: 1300px;
  align-items: center;
  margin: auto;
  width: 100%;
  height: auto;
  min-height: 260px;
  background-color: transparent;
  flex-wrap: wrap;
}
.our_init_img_wrap{width: 100px; height: 100px; color: #3d76a1d8; margin-bottom: 1.5rem;}
.small_info_txt{font-size: 1rem; color: #292929; line-height: 1.5; font-weight: 500; text-align: center;}
.init_header_txt{font-size: 1.5rem; color: #1f87a4; text-align: center;}


.overlay-text > p{
color: #1f87a4; 
text-shadow: 0px 0px #f7f7f7; 
font-size: 4rem; font-weight: 900;
}
.trp-txt{
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    color: #1f87a4;
    font-size: 4rem;
    font-weight: 900;
    text-align: center;
    padding: 20px;
    border-radius: 10px;
}
.btn-link:hover, .btn-link:active, .btn-link:focus{
color: #1f87a4;
background-color: transparent;
}
.link-bgw:hover, .link-bgw:active, .link-bgw:focus{
color: #1f87a4;
background-color: white;
}
.btn-link, .link-bgw{
height: auto;
position: relative;
box-sizing: border-box;
left: 0px;
border-radius: 0.5rem;
width: auto;
background-color: #1f87a4;
color: white;
font-weight: bolder;
box-sizing: border-box;
padding: 12px 35px;
text-decoration: none;
font-size: 1.4rem;
opacity: 1;
transition: all 0.6s;
border: 2px solid #1f87a4;
}
/* partners.. */
.partneer-wrap{
display: flex;
margin: auto;
box-sizing: border-box;
justify-content: center;
align-items: center;
flex-wrap: wrap;
max-width: var(--page-max-width);
}
.partner-img img{
width: 100%;
filter: grayscale(1);
height: auto;
}
.partner-img{
padding: 1rem;
width: 250px;
height: auto;
box-sizing: border-box;
margin: auto;
}

@media screen and (max-width:1282px){
     /* top banners. */
#top_cont_holder{justify-content: center; align-items: center; width: 100%; min-height: auto;}

#top_img_wrap{
width: calc(45% - 5rem); }

#top-anim-holder{
width: 55%;
}
  #page-wrap{
    gap: 3rem;

    padding-top: 2rem;
    padding-bottom: 2rem;
  }
  .img-wrapper{
    margin-bottom: 2rem;
  }
}
@media screen and (max-width:1026px) {
/* top banners. */
#top_cont_holder{justify-content: center; padding-bottom: 0rem !important; align-items: center; flex-direction: column; width: 100%;}
#top_img_wrap{height: 600px; width: 75%; 
}
#top-anim-holder{
height: auto;
margin-top: 4rem;
width: 90%;
}
#site-intro-banner{
height: auto;
max-height: none !important;
}
  .sw_boxes_wrapper section{
  width: calc(83% / 2 - 2rem);
}
#img_box{
height: 100%;
width: auto;
}
#top-anim-holder{
align-self: center;
justify-content: flex-start;
}
}
@media screen and (max-width:770px) {
#top_cont_holder{padding-bottom: 2rem !important;}
#top-anim-holder{
align-self: center;
margin-right: auto; 
justify-content: center;
}
#top_img_wrap{height: auto; width: 70%; margin-top: 6rem; margin-bottom: 1rem;}
}  
@media screen and (max-width:550px){
  .partner-img{
    width: 80%;
    max-width: 380px;
    padding: 2rem;
    }  
.w_type_boxes{
margin: 0.5rem !important;
}
#do_biz_intro{
padding-left: 1rem;
padding-right: 1rem;
}
.w_type_boxes:focus, .w_type_boxes:hover, .w_type_boxes:active{
  margin-top:  0.5rem !important;
}
.sw_boxes_wrapper section{
width: 90%;
max-width: 450px;
}
.sw_boxes_wrapper section:hover, .sw_boxes_wrapper section:active, .sw_boxes_wrapper section:focus{
box-shadow: 0px 0px 10px #b7b7b7;
}
  .img-wrapper{
    margin-bottom: 1rem;
  }
  .rev_flx{
    flex-direction: column-reverse !important;
}
/* .page-artic-wrapp{
flex-direction: column;
width: 90%;
border-radius: 1rem;
padding: 1rem 0rem;
box-shadow: 0px 0px 5px #e0e0e0;
} */
#page-wrap{
    gap: 2rem;
    padding-top: 1rem;
    padding-bottom: 1rem;
  }
  .info-wrapper{
    gap: 0rem;
  }
  #top-anim-header{
    font-size: 2.1rem;
    padding:0rem;
  }
  #top-anim-holder{
justify-content: flex-start;
padding: 0rem;
width: 100%;
}
#top-anim-link2{
margin-left: 1rem !important;}
#top-anim-body{
font-size: 1rem;
padding: 0px;
}
#top-anim-link, #top-anim-link2{
font-size: 1.1rem;
height: auto;
padding: 0.6rem 3rem;
margin-top: 1.5rem;
} 
#top_img_wrap{
width: 100%; margin-top: 2rem; 
margin: auto;
margin-bottom: 0rem;}
#top_cont_holder{
height: auto !important;
padding-bottom: 5rem;
}
#site-intro-banner {
display: block;
height: auto !important;
min-width: 100% !important;
max-height: none !important;
overflow: visible;
}
.n-letter-btn {
display: block;
margin: auto;
margin-top: 1rem; 
}
}
@media screen and (max-width:480px){
#top-anim-link2{
     margin-left: 0px !important;
  }
  #anim-btn{
   padding-left: 0rem; 
   flex-direction: column;
  }
}
@media screen and (max-width:300px){
.img-wrapper{
    margin-bottom: 0.5rem;
  }
#top-anim-holder{
width: 96%;
margin-top: 150px !important;
justify-content: flex-start;
}
#top-anim-header{
font-size: 1rem;
font-weight: 500;
}
#top-anim-body{
font-size: 0.7rem;
font-weight: bold;
padding: 0px;
height: auto !important;
line-height: 1.2;
}
#top-anim-link, #top-anim-link2{
font-size: small !important;
padding: 0.3rem 0.5rem !important;
border-radius: 10px; 
} }

@media screen and (max-width: 760px) {
.overlay-text > p{
    font-size: 3rem;
}
.btn-link{
    height: auto;
    position: relative;
display: block;
margin: auto;
background-color: #1f87a4;
padding: 12px 30px;
font-size: 1.2rem;
border: 2px solid #1f87a4;
}
.multi_btn_wrap{
flex-direction: column;
justify-content: center;
align-items: center;
}
.overlay-text{
width: 100%;
padding: 1rem;
} 
.our_init_box_wrap {
  width: 86%;
  height: 340px;
  max-width: 370px;
}
}

/* home page blog section styling.. */
.page-sect-dimgb{
display: block;
position: relative;
width: 100%;
margin: auto;
box-sizing: border-box;
padding-top: 7rem;
padding-bottom: 7rem;
background-color: #e7e7e7;
}
.blog-section {
  padding: 1rem;
  max-width: 1200px;
  margin: 0 auto;
  text-align: left;
  background-color: transparent;
}
.blog-section h2 {
  text-align: center;
  font-size: 2.5rem;
  margin-bottom: 4rem;
  color: #333;
}
.blog-container {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
  gap: 2rem;
}
.blog-box {
  background-color: #fff;
  border-radius: 10px;
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
  overflow: hidden;
  transition: transform 0.3s ease;
}
.blog-box:hover {
  transform: translateY(-10px);
}
.blog-image {
  width: 100%;
  height: 200px;
  object-fit: cover;
  background-color: #252424;
  overflow: hidden;
}
.blog-content {
  padding: 20px;
}
.blog-title {
  font-size: 24px;
  color: #333;
  margin-bottom: 10px;
  text-decoration: none;
}
.blog-title:hover {
  color: #1f87a4;
}
.blog-excerpt {
  font-size: 16px;
  color: #666;
  margin-bottom: 20px;
}
.read-more {
  font-size: 14px;
  color: #1f87a4;
  text-decoration: none;
  font-weight: bold;
}
.read-more:hover {
  text-decoration: underline;
}
#anim{
  animation: show 1s linear 2s infinite alternate;
}
@keyframes show {
  0%{
      transform: scale(0, 0);
  }
  100%{
      transform: scale(1, 1);
  }
}