body{width: 100%; background:#fbf9ff; padding: 0; margin: 0; font-family: "Rethink Sans", sans-serif; }

a{text-decoration: none !important; border: none; outline: none; outline: none; font-family: "Rethink Sans", sans-serif; }

h1, h2, h3, h4, h5, h6, p{ padding: 0; margin: 0; font-family: "Rethink Sans", sans-serif;  font-style: normal; }

ul{ padding: 0; margin: 0; }

li{ list-style: none; border: none; outline: none; }

*{padding: 0;margin: 0;}





/*Header Top Start*/

.header-top{ width: 100%; position: relative; display: block; background: linear-gradient(35deg, rgb(251, 249, 255) 30%, rgb(9, 90, 179) 30%) ; padding: 0 10px 0px 0; margin: 0; z-index: 99;  border-radius: 5px;}

.header-top .logo{ width: 80%; padding: 0; margin: 0; position: relative; }

.header-top .logo img{ width: 100%; position: absolute; content: ""; top: -60px; }



.header-top .click-link{ width: 100%; padding: 10px 0; margin: 0; text-align: right; }

.header-top .click-link ul{ padding: 0; margin: 0; }

.header-top .click-link ul li{ font-size: 16px; line-height: 18px; padding: 0 20px 0 0; margin: 0; display: inline-block; }

.header-top .click-link ul li a{ padding: 0; margin: 0; transition: all 400ms ease-in-out; color: #fff; font-size: 14px;  outline: none; font-family: "Rethink Sans", sans-serif; letter-spacing: 0.5px; }

.header-top .click-link ul li a:hover{ opacity: 1; letter-spacing: 0.5px; font-style: italic; transition: all 500ms ease-in-out; }

.header-top .click-link ul li a i{ font-size: 14px; color: #fff; padding: 0 10px 0px 0; border-right: 0.5px solid #34ace0; margin: 0 10px 0 0; }



.header-top .header-social-link{ width: 100%; float: right; padding: 0; margin: 0; text-align: right; }

.header-top .header-social-link ul{ padding: 8px 0 0; margin: 0; display: inline-block; }

.header-top .header-social-link ul li{ display: inline-block; float: left; padding: 0 0 0 12px; margin: 0; }

.header-top .header-social-link ul li a{ padding: 0; font-size: 14px; color: #fbf9ff; margin: 0 0 0 2px; display: inline-block; transition: all 400ms ease-in-out; text-align: center; border-radius: 4px;  width: 25px; height: 25px; background: #1a60b5; line-height: 25px; -webkit-box-shadow: -10px 0 14px -11px rgb(0, 0, 0);border-left: 1px solid #cccccc4d;}

.header-top .header-social-link ul li a:hover{ color: #042381; transition: all 400ms ease-in-out; }



/*Header Bottom Start*/

.header-bottom{ width: 100%; position: relative;  display: block; padding: 0; margin: 0; z-index: 99; background: linear-gradient(90deg, rgb(255, 255, 255) 15.5%, rgb(251, 249, 255) 15.5%);}

.header-bottom .logo{ width: 75%; padding: 0; margin: 0; position: absolute; float: right;content: "";top: -30px;left: 50px;}

.header-bottom .logo img{ width: 50%; position: relative;      height: auto;}

.header-bottom .menu{ float: right; padding: 15px 0; margin: 0; }

.header-bottom .menu ul{ padding: 1px 0; margin: 0; width: auto; }

.header-bottom .menu ul li a{ transition: all 600ms ease-in-out; font-weight: 400; color: #01255e; font-size: 16px; outline: none; font-family: "Rethink Sans", sans-serif;  margin: 0;  -webkit-box-shadow: -10px 0 14px -11px rgba(0, 0, 0, 0.17);  border-radius: 10px; padding: 12px 25px; background: none; text-transform: uppercase; letter-spacing: 1.5px;}



.header-bottom .menu ul li ul li a{ color: #052c57;  padding: 7px 0 6px 0;font-family: -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,"Helvetica Neue",sans-serif;font-weight: 400;letter-spacing: 0;font-size: 16px;border-bottom: 1px solid #ccc;border-radius: 0;}

.header-bottom .menu ul li a:hover{ box-shadow:none; color: #095e97; transition: all 600ms ease-in-out;}

.snip1189 { text-align: center;text-transform: uppercase;font-weight: 500;letter-spacing: 1px;}

.snip1189 * { -webkit-box-sizing: border-box; box-sizing: border-box; -webkit-transition: all 0.35s ease; transition: all 0.35s ease; }

.snip1189 li { display: inline-block; list-style: outside none none; margin: 0 0 0 10px; padding: 0; }

.snip1189 a { margin: 0.2em 0; display: block; color: rgb(0, 0, 0); position: relative; }

.snip1189 a:hover{color: #0a8ce3; }

.snip1189 a:before,

.snip1189 a:after { height: 14px; width: 14px; position: absolute; content: ''; -webkit-transition: all 0.35s ease; transition: all 0.35s ease; opacity: 0; }

.snip1189 a:before {left: -5px; top: 10px; border-left: 2px solid #a9acaec4; border-top: 2px solid #a9acaec4; -webkit-transform: translate(100%, 50%); transform: translate(100%, 50%); }

.snip1189 a:after { right: -5px; bottom: -5px; border-right: 2px solid #a9acaec4; border-bottom: 2px solid #a9acaec4; -webkit-transform: translate(-100%, -50%); transform: translate(-100%, -50%); }

.snip1189 a::after {right: -1px; bottom: 10px; border-right: 2px solid #a9acaec4; border-bottom: 2px solid #a9acaec4; }

.snip1189 a:hover,

.snip1189 .active a { color: #0a8ce3;transition: all 600ms ease-in-out; }

.snip1189 a:hover:before,

.snip1189 .active a:before,

.snip1189 a:hover:after,

.snip1189 .active a:after { color: #0a8ce3;  -webkit-transform: translate(0%, 0%); transform: translate(0%, 0%); opacity: 1; }



.particle-network-animation { position: fixed; top: 0; left: 0; right: 0; height: 600px; z-index: 2; }



.about-block-down-content{position: relative;width: 100%;display: block;padding: 0px 0;margin: 0 0;z-index: 9;background: linear-gradient(90deg,rgb(0, 50, 104) 1%, rgb(0, 76, 255) 50%, rgb(0, 71, 149) 100%);}

.about-block-down-content .border-up{width: 100%; top: -5px; position: relative;}

.about-block-down-content .border-down{width: 100%;}

.about-block-down-content ul{width: 100%;padding: 40px 0;margin: 0;display: inline-block;}

.about-block-down-content ul li{width: 22%;float: left;text-align: center;background: #fff;padding: 20px 10px;margin: 0 17px;border-radius: 5px;font-size: 40px;font-weight: bold;color: #031d48;line-height: 45px;-webkit-box-shadow: -1px 9px 16px -3px rgba(0, 0, 0, 0.37);transition: all 600ms ease-in-out;}

.about-block-down-content ul li span{display: block;font-size: 20px;font-weight: normal;color: #000;}



/*banner-new new*/

.banner-new{width: 100%; position: relative; display: block; padding: 0; margin: 0; overflow: hidden; background: #fff;}

.banner-new img.banner-img{ width: 100%; height: 530px;}

.banner-new .banner-dec{ position: absolute; content: ""; left: 0; right: 0; top: 35%; width: 100%; z-index: 9999; text-align: center;}

.banner-new .banner-dec .banner-dec-text{padding: 30px 0 15px;  background: #000000a1;width: 85%;margin: 0 auto;border-radius: 15px;}

.banner-new .banner-dec .banner-dec-text h5{ margin: 0; padding: 10px 0 20px 0;font-size: 70px;line-height: 60px;font-weight: 900;color: #fff;text-transform: uppercase;font-family: "Rethink Sans", sans-serif;text-shadow: 2px 2px 4px #105;letter-spacing: 2px;}

.banner-new .banner-dec .banner-dec-text h2{margin: 0; padding: 5px 0 10px; font-size: 30px; line-height: 40px; font-weight: 600; color: #f0f0f0; text-shadow: 2px 2px 4px #105; text-transform: uppercase;}

.banner-new .banner-dec .banner-dec-text a{  margin: 15px auto 20px;text-align: center;font-size: 19px;letter-spacing: 0.5px;box-shadow: 0px 10px 30px -5px rgb(0, 0, 0);display: block;padding: 10px 0;transition: all 600ms ease-in-out;background: linear-gradient(to top, #001b53, #0343bf);color: #fff;border: 0.5px solid #0950dd;border-radius: 100px;width: 18%;font-weight: bold;letter-spacing: 2px;}

.banner-new .banner-dec .banner-dec-text a:hover{transition: all 600ms ease-in-out; background: linear-gradient(to top, #291076, #000); color: #ffffffbf; border: 0.5px solid #fff;}



/*Banner Start*/

.banner{ width: 100%; position: relative; display: block;   position: relative; padding: 50px 0 20px; margin: 0 0; background: url(../images/ser-bg.jpg) repeat; overflow: hidden;z-index: 9;}

.banner .banner-image-block{ width: 100%; padding: 0; margin: 0; opacity: 1; }

.banner .banner-image-block img{ width: 100%; margin: -60px 0 0 0;}



.banner .circle-image{ position: absolute; content: ""; top: 60px; left: 0; right: 0; z-index: 9; padding: 0; margin: 0; }

.banner .circle-image .circle-image-block{ width: 48%; float: left; display: block; padding: 0; margin: 0; }

ul.ab {

  width:70vmin;

  height:70vmin;

  position:relative;

}



li.a { 

  /*

    |a|d|a|

    -------  -           

    |/   \|  | 0.5h

    |\   /|  ^          

    ------- 

    |  w  |

  

    a = 0.5h/tan60 = 0.28867513459h

    d = 0.5h/sin60 = 0.57735026919h

    w = a + d + a  = 1.15470053838h

  

    [zoom out]

  

        |a|_d_|         _____    _

        /|     \       /     \   |

  ang=60_|      \__d__/       \  | h     

       \        /     \       /  |

        \_____|/|      \_____/  _|

              a     

       |--------|

           w

  */

  --h: calc(100% / 3);

  --w: calc(1.15470053838 * var(--h));

  --a: calc(0.28867513459 * var(--h));

  --d: calc(0.57735026919 * var(--h));

  height:var(--h);

  width:var(--w);

  position:absolute;

}



ul.ab li.a img {

  display:block;

  width:100%;

  height:100%;

  object-fit:cover;

  /* 

  

   [clip-path coordinates]

  

    --A-F--

   B|/   \|E    coord.

    |\   /|       A(a/w, 0)

    --C-D--       B(0, 50%)

                  C(a/w, 100%)

                  D(100% - a/w, 100%)

                  E(100%, 50%)

                  F(100% - a/w, 0)

                where a/w = 0.24999999999

  */

  --aw:24.99999999999%;

  clip-path:polygon(

    var(--aw) 0,

    0 50%,

    var(--aw) 100%,

    calc(100% - var(--aw)) 100%,

    100% 50%,

    calc(100% - var(--aw)) 0

  );

}



li.a:nth-of-type(1) {

  left:calc(50% - var(--a) - var(--d) * 0.5);

  top:0;

}

li.a:nth-of-type(2) {

  left:calc(50% - var(--a) * 2 - var(--d) * 1.5);

  top:calc(var(--h) * 0.5);

}

li.a:nth-of-type(3) {

  left:calc(50% - var(--a) * 2 - var(--d) * 1.5);

  top:calc(var(--h) * 1.5);

}

li.a:nth-of-type(4) {

  left:calc(50% - var(--a) - var(--d) * 0.5);

  top:calc(var(--h) * 2);

}

li.a:nth-of-type(5) {

  left:calc(50% + var(--d) * 0.5);

  top:calc(var(--h) * 0.5);

}

li.a:nth-of-type(6) {

  left:calc(50% + var(--d) * 0.5);

  top:calc(var(--h) * 1.5);

}







/* 

style 

*/



ul.ab {

  filter:drop-shadow(0 0 10px hsla(0,0%,0%,0.3));

}



li.a:hover {

  filter:drop-shadow(0 0 20px #001b85);

  z-index:10;

}



/*

anim

*/



ul.ab {

  animation:r 4s forwards;

} @keyframes r {

  from {transform:rotate(180deg)}

  to {transform:rotate(0)}

}



li.a {

  animation:ir 4s forwards;

} @keyframes ir {

  from {transform:rotate(-360deg)}

  to {transform:rotate(0)}

}



.banner .circle-image .circle-text-block{ width: 50%; float: right; display: block; padding: 70px 0 0; margin: 0; }

.banner .circle-image .circle-text-block h5{ font-size: 24px; line-height: 18px; color: #001e5b; padding: 0; margin: 0; font-weight: 400; }

.banner .circle-image .circle-text-block h1{ font-size: 45px; line-height: 40px; color: #041840; padding: 20px 0 15px; margin: 0; font-weight: bold; text-transform: uppercase; }

.banner .circle-image .circle-text-block p{ font-size: 25px; line-height: 40px; color: #02153c; padding: 0 50px 30px 0; margin: 0;  text-align: justify; font-family: -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,"Helvetica Neue",sans-serif;font-weight: 300;}

.banner .circle-image .circle-text-block 

.wrap {

  height: 100%;

  display: flex;

  align-items: center;

  justify-content: center;

}



.button {

  min-width: 200px;

  min-height: 50px;

  display: inline-flex;

  font-size: 16px;

  align-items: center;

  justify-content: center;

  text-transform: uppercase;

  text-align: center;

  letter-spacing: 0px;

  font-weight: 700;

  color: #fff;

  background: linear-gradient(90deg, #0045b4 0%, #002767 100%);

  border: none;

  border-radius: 1000px;

  box-shadow: 2px 2px 11px #001e4fd4;

  transition: all 0.3s ease-in-out 0s;

  cursor: pointer;

  outline: none;

  position: relative;

  padding: 8px 0;

  }



/*.button::before {

content: '';

  border-radius: 1000px;

  min-width: calc(300px + 12px);

  min-height: calc(60px + 12px);

  border: 2px solid #0045b4;

  box-shadow: 0 0 60px #001e4fd4;

  position: absolute;

  top: 50%;

  left: 50%;

  transform: translate(-50%, -50%);

  opacity: 0;

  transition: all .3s ease-in-out 0s;

}*/



.button:hover, 

.button:focus {

  color: #fff;

  transform: translateY(-6px);

}



.button:hover::before, 

.button:focus::before {

  opacity: 1;

}



.button::after {

  content: '';

  width: 10px; height: 10px;

  border-radius: 100%;

  border: 2px solid #0045b4;

  position: absolute;

  z-index: -1;

  top: 50%;

  left: 50%;

  transform: translate(-50%, -50%);

  animation: ring 1.5s infinite;

}



.button:hover::after, 

.button:focus::after {

  animation: none;

  display: none;

}



@keyframes ring {

  0% {

    width: 30px;

    height: 30px;

    opacity: 1;

  }

  100% {

    width: 300px;

    height: 300px;

    opacity: 0;

  }

}







/*About Start*/

.about{       width: 100%;position: relative;display: block;padding: 20px 0 70px;margin: 0 0;background: url(../images/ser-bg.jpg) repeat;overflow: hidden;z-index: 9;}

.about .about-block-content-image{ width: 100%; position: 0; margin: 0; }

.about .about-block-content-image img{ width: 98%; margin: 10px 0 0 0;}

.about .about-block-content-dec{ width: 100%; position: 0; margin: 0; }

.about .about-block-content-dec h5{ font-size: 20px; line-height: 24px; color: #0045b4; padding: 0; margin: 0; font-weight: bold; }

.about .about-block-content-dec h2{ font-size: 25px; line-height: 35px; color: #03112d; padding: 10px 0; margin: 0; font-weight: bold; text-align: justify; }

.about .about-block-content-dec p{ font-size: 19px; line-height: 28px; color: #020f2fe5; padding: 0; margin: 0; text-align: justify; font-family: -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,"Helvetica Neue",sans-serif;font-weight: 300;}



.about .about-block-down-content{ width: 100%; padding: 30px 0; margin: 0; display: inline-block; }

.about .about-block-down-content ul{ padding: 0; margin: 0; }

.about .about-block-down-content ul li{ width: 33%; float: left; display: inline-block; padding: 0; margin: 0; font-size: 18px; line-height: 20px; color: #000; font-size: 40px; line-height: 60px; color: #0045b4; font-weight: bold; padding: 0; margin: 0; }

.about .about-block-down-content ul li span{ display: block; font-size: 18px; line-height: 24px; font-weight: 600; color: #000; }

.about .about-block-down-img-content{ width: 100%; padding: 0; margin: 0;}

.about .about-block-down-img-content img {     width: 100%; position: absolute; top: -60px; left: -70px; border: 3px solid #fff; z-index: 9; }



/*Product*/

.product{ width: 100%; display: block; position: relative; background: url(../images/pro-banner.png) no-repeat bottom left; background-size: cover; padding: 50px 0; margin: 0; z-index: 9;}

.product h5{ font-size: 20px; line-height: 24px; color: #0045b4; padding: 0; margin: 0; font-weight: bold; text-align: center; }

.product h2{ font-size: 38px; line-height: 42px; color: #000; padding: 10px 0 30px; margin: 0; font-weight: bold; text-align: center; }

.product .card{ background: white; margin: 0; width: 100%; padding: 30px 30px; box-shadow: 1px 1px 6px rgba(9, 25, 153, 0.56), 1px 1px 6px rgba(255, 255, 255, 0.08); transition: all 0.3s cubic-bezier(.25,.8,.25,1); transition: all 400ms ease-in-out; -webkit-box-shadow: -1px 9px 16px -3px rgba(0, 0, 0, 0.37);border-radius: 10px;height: 430px;}

.product .card:hover { border-top-left-radius: 10px; border-bottom-left-radius: 10px; animation-name: example; animation-duration: 0.25s; border-left: 8px solid #0145bd; box-shadow: 13px 14px 29px rgba(34, 113, 198, 0.25), 0 10px 10px rgba(0, 54, 138, 0.22); transition: all 400ms ease-in-out; }

.product .card img{ width: 10%; margin: 0 auto 5px;display: block;}

.product .card h4{ font-size: 20px; line-height: 29px; color: #053177; padding: 10px 0 0px; margin: 0; font-weight: 500; height: 56px; border-bottom: 1px solid #d9d9d9; text-transform: uppercase;text-align: center;}

.product .card p{ font-size: 16px; line-height: 28px; color: #1d1d1dd6; padding: 0; margin: 0; text-align: center; font-weight: 400; height: auto; overflow: hidden;}

.product .card a{ font-size: 14px; line-height: 18px; color: #fff; background: linear-gradient(90deg, #0045b4 0%, #002767 100%); width: 60%; padding: 8px 0; margin: 0; text-align: center; font-weight: 500; text-transform: uppercase; transition: all 400ms ease-in-out; display: block;margin: 0 auto;}

.product .card a:hover{ letter-spacing: 1.2px; transition: all 400ms ease-in-out; }

img.product-prot-icon{}





/*Counter*/

.counter{ width: 100%; display: block; position: relative; background: url(../images/fixed-bg-2.png) no-repeat bottom left; background-size: cover; background-attachment: fixed; padding: 0; margin: 0; display: none;}

.counter .counter-block{ width: 100%; padding: 30px 0; margin: 0; display: inline-block; text-align: center; z-index: 9;position: relative;}

.counter .counter-block ul{ padding: 0; margin: 0; }

.counter .counter-block ul li{ width: 22%; float: left; display: inline-block; font-size: 40px; line-height: 60px; color: #fff; font-weight: bold; padding: 30px 15px; margin: 30px 15px; background: #023db7cf; border-left: 3px solid #5882ffdb; box-shadow: -13px 0px 22px #000711ad; border-radius: 15px;}

.counter .counter-block ul li span{ display: block; font-size: 18px; line-height: 24px; font-weight: 600; color: #fff; height: 60px; }

.counter .border-up{width: 100%;position: relative;top: -3px;}

.counter .border-down{width: 100%;position: relative;bottom: -1px;}



/*Solutions*/

.solution{ width: 100%; display: block; position: relative; background: url(../images/pro-banner-2.png) no-repeat top left; background-size: cover; padding: 50px 0 70px; margin: 0; z-index: 9;}

.solution h5{ font-size: 20px; line-height: 24px; color: #0045b4; padding: 0; margin: 0; font-weight: bold; text-align: center; }

.solution h2{ font-size: 38px; line-height: 42px; color: #000; padding: 10px 0 30px; margin: 0; font-weight: bold; text-align: center; }

.solution .card{ width: 100%; padding: 0; margin: 10px 0 50px; position: relative; transition: all 400ms ease-in-out; overflow: hidden;  border: 15.5px solid #030e60; border-radius: 15px; height: 540px;box-shadow: 0px 10px 10px #0007113d;}

.solution .card:hover{ transform: translateY(-15px); transition: all 400ms ease-in-out; border-radius: 20px 60px 30px 100px; box-shadow: 4px 4px 30px #05287f; }

.solution .card img{ width: 100%; height: inherit;}

.solution .card .solution-text-block{ position: absolute; content: ""; top: 0; left: 0; right: 0; text-align: center; padding: 15px; margin: 0; }

.solution .card .solution-text-block h4{ font-size: 25px; line-height: 30px; color: #fff; padding: 10px 0; margin: 0; font-weight: bold;  text-transform: uppercase;border-bottom: 2px solid #ccc;border-radius: 10px;}

.solution .card .solution-text-block a{ font-size: 14px; line-height: 18px; color: #fff;  width: 60%; padding: 8px 0; margin: 20px 0 0; text-align: center; font-weight: 500; text-transform: uppercase;     background: linear-gradient(90deg, #0062ff 0%, #003fa6 100%);border-radius: 1000px;box-shadow: 0px 10px 30px #000000ba;transition: all 0.3s ease-in-out 0s;border: 1px solid #498fff;}

.solution .card .solution-text-block a:hover{ letter-spacing: 1.2px; transition: all 400ms ease-in-out; }

.solution .card .solution-text-block h4 span{display: block;font-size: 18px;line-height: 25px;color: #fff;padding: 20px 0 10px 0px;margin: 0 0 0;text-transform: capitalize;height: 70px;border: none !important;font-style: italic;font-family: -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,"Helvetica Neue",sans-serif;font-weight: 300;}

.solution .card .solution-text-block p{padding: 20px 0 0 0;margin: 0 0;text-align: center;color: #ffffffbd;font-size: 16px;line-height: 25px;height: 220px;overflow: hidden;}

.solution .card .solution-text-block img{width: 40%;background: #f0f0f0;border-radius: 15px;height: 80px;border: 5px solid #024566;}

/*-Testimonil-*/

.testimonials {width: 100%; background: #fff; padding: 20px 0 40px; margin: 0; z-index: 9; display: block; position: relative; display: none;}

.testimonials .title-all h5{ font-size: 20px; line-height: 24px; color: #0045b4; padding: 0; margin: 0; font-weight: bold; text-align: center; }

.testimonials .title-all h2{ font-size: 38px; line-height: 42px; color: #000; padding: 5px 0 40px; margin: 0; font-weight: bold; text-align: center; }



.testimonials .footer-top-w3layouts-grid-sec{ }

.testimonials .footer-top-w3layouts-grid-sec .mail-grid-icon {float: left; width: 90px; height: 90px; border-radius: 50%; }

.testimonials .footer-top-w3layouts-grid-sec .mail-grid-icon img{ width: 100%; }

.testimonials .footer-top-w3layouts-grid-sec .mail-grid-text-info{ width: 65%; float: right; padding: 0 0; margin: 0 0; }

.testimonials .footer-top-w3layouts-grid-sec .mail-grid-text-info h3 {letter-spacing: 0px; font-weight: 600; position: relative; padding: 0 0 0;  margin: 0 0 0 0; font-size: 16px; text-transform: uppercase; color: #041e37; line-height: 22px;}

.testimonials .footer-top-w3layouts-grid-sec .mail-grid-text-info p {text-align: left; color: #000; font-family: -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,"Helvetica Neue",sans-serif; font-weight: 300; font-size: 18px; line-height: 22px; padding: 5px 0 0; margin: 0;transition:all 600ms ease-in-out;}

.testimonials .footer-top-w3layouts-grid-sec .mail-grid-text-info p:hover{ text-decoration: underline;transition:all 600ms ease-in-out; }

.testimonials img.border-down-img{ width: 100%;  position: absolute; z-index: 9; top:-5px; left: 0;padding: 0; margin: 0; height: auto; opacity: 1; }

.testimonials img.border-up-img{ width: 100%;  position: absolute; z-index: 9; bottom:-5px;left: 0; padding: 0; margin: 0; height: auto; opacity: 1;  }

.testimonials .border-up { width: 100%; position: relative; top: -40px; }



/*footer*/

.footer{ width: 100%; display: block; padding: 60px 0 0; margin: 0;  background: url(../images/footer-bg.png) no-repeat top left; background-size: cover;  position: relative;  z-index: 9;}

.footer h5{ font-size: 20px; line-height: 22px; color: #fff; font-weight: bold; padding: 0; margin: 0 0 15px; }

.footer .footer-logo{ width: 9%; background: #fff; display: block; margin: 0 auto 30px; padding: 10px; box-shadow: 0px 0px 45px #fff; border-radius: 10px; }

.footer .footer-logo img{ width: 100%; }



.footer .footer-about{ width: 100%; padding: 0; margin: 0; }

.footer .footer-about h5{ font-size: 20px; line-height: 22px; color: #fff; font-weight: bold; padding: 0; margin: 0 0 15px; }

.footer .footer-about p{ font-size: 16px; line-height: 24px; color: #cecece; padding: 0 0 20px; margin: 0; }

.footer .footer-about p i{ color: #fff; padding: 0 10px 0 0; }

.footer .footer-about ul{ padding: 0; margin: 0; }

.footer .footer-about ul li{ display: inline-block; width: 100%; font-size: 15px; line-height: 18px; padding: 0; margin: 0 0 10px; }

.footer .footer-about ul li a{ color: #cecece; transition: all 500ms ease-in-out; }

.footer .footer-about ul li a:hover{ color: #fff; font-style: italic; transition: all 500ms ease-in-out; }

.footer .footer-about ul li a i{ color: #fff; padding: 0 10px 0 0; }



.footer .footer-brochure{ width: 100%; padding: 0; margin: 0; }

.footer .footer-brochure h5{ font-size: 20px; line-height: 22px; color: #fff; font-weight: bold; padding: 0; margin: 0 0 15px; }

.footer .footer-brochure a{display: inline-block; font-size: 16px; line-height: 18px; padding: 12px 0; margin: 0; transition: all 400ms ease-in-out; width: 80%; text-align: center; border: 1px solid #fff; background: transparent linear-gradient(276deg,rgba(13, 64, 187, 0.64),#00ebff) 0 0 no-repeat padding-box; color: #fff; box-shadow: 3px 3px 6px #fff,-3px -3px 6px #fff; border-radius: 25px; font-weight: bold; opacity: 0.8; }

.footer .footer-brochure a:hover{ letter-spacing: 1.5px; transition: all 400ms ease-in-out;opacity: 1; opacity: 1;}



.footer .footer-social{ width: 100%; padding: 15px 0 0; margin: 0; }

.footer .footer-social h5{ font-size: 20px; line-height: 22px; color: #fff; font-weight: bold; padding: 0; margin: 0 0 15px; }

.footer .footer-social ul{ padding: 0; margin: 0; }

.footer .footer-social ul li { width: auto; display: inline-block; padding: 0; margin: 0 10px 0 0; }



.footer .footer-social ul li a {

  width: 40px;

  height: 40px;

  background: #000784bf;

  text-align: center;

  line-height: 37px;

  font-size: 16px;

  margin: 0;

  display: block;

  border-radius: 23px;

  position: relative;

  overflow: hidden;

  border: 2px solid #fff;

  z-index: 1;

}



.footer .footer-social ul li a i {

  position: relative;

  color: #fff;

  transition: .5s;

  z-index: 3; padding: 0;

}



.footer .footer-social ul li a:hover i {

  color: #fff;

  transform: rotateY(360deg);

}



.footer .footer-social ul li a:before {

  content: "";

  position: absolute;

  top: 100%;

  left: 0;

  width: 100%;

  height: 100%;

  background: #f00;

  transition: .5s;

  z-index: 2;

}



.footer .footer-social ul li a:hover:before {

  top: 0;

}



.footer .footer-social ul li:nth-child(1) a:before{

  background: #3b5999;

}



.footer .footer-social ul li:nth-child(2) a:before{

  background: #d70252;

}



.footer .footer-social ul li:nth-child(3) a:before {

  background: #0077b5;

}



.footer .footer-social ul li:nth-child(4) a:before {

  background: #b50000;

}









/*Copyright Start*/

.copyright{ width: 100%; position: relative; background: #00044ec9; display: block; border-top: 2px solid #003caf; padding: 20px 0; margin: 30px 0 0; text-align: center; box-shadow: 0 -5px 7px #000d3d; }

.copyright p{ font-size: 16px; line-height: 20px; color: #fff; padding: 0; margin: 0; }

.copyright p a{ color: #a1a1a1; transition: 400ms ease-in-out; margin: 0 0 0 15px; font-style: italic; }

.copyright p a:hover{ color: #fff; transition: all 400ms ease-in-out; font-style: normal; }



/*.inner-title*/

.inner-title{position: relative; width: 100%; padding:0 0px; margin: 0px 0;}

.inner-title h2{text-align: center; color: #323030; font-family: -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,"Helvetica Neue",sans-serif; font-weight: 600; font-size: 30px; line-height: 60px; padding: 0px 0 0;}

.inner-title h3{  text-align: center; color: #000; font-family: -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,"Helvetica Neue",sans-serif; font-weight: 300; font-size: 19px; line-height: 20px; padding: 0 0 35px;}



/*inner-banner*/

.inner-banner{ position: relative; width: 100%; padding:0 0px; margin: 0px 0;height: 250px; overflow: hidden; background: #4b6e74;}

.inner-banner .inner-banner-img{ width: 100%;  padding:0 0px; margin: -100px 0 0 0; opacity:1;}

.inner-banner ul{ position: absolute; content: ""; left: 0; bottom: 0;   color: #fff; width: 100%; z-index: 9; background: #00000082; padding: 0 0; margin: 0; }

.inner-banner ul li{list-style: none; display: inline-block; padding: 0 20px; margin: 0 0; color: #fff;}

.inner-banner ul li a{position: relative;  margin: 0 0 0 0px; font-size: 16px; text-transform: uppercase; color: #fff; line-height: 30px; padding: 7px 0 8px; display: block;font-family: "Helvetica Neue",Helvetica,Arial,sans-serif;}

.inner-banner ul li a:hover{color: #ff9800;  transition:all 600ms ease-in-out; }

.inner-banner ul li a.active{position: relative;  margin: 0 0 0 100px; font-size: 15px; text-transform: uppercase; color: #fff; line-height: 30px; padding: 7px 0 8px; display: block;font-weight: bold;font-family: "Helvetica Neue",Helvetica,Arial,sans-serif;letter-spacing: 1.5px;}

.inner-banner .border-up{width: 100%; z-index: 9; position: relative; top: -5px; box-shadow: 0 10px 22px #000711;}

.inner-banner .border-down{position: relative; width: 100%; z-index: 9; bottom: 180px; }



/*About*/

.about-inner{  width: 100%; height: auto; background: #fff; padding: 30px 0 50px; margin: 0; position: relative; background: url(../images/ser-bg.jpg) repeat;

  overflow: hidden;}

.about-inner .left-text-top h2{text-align: left;  font-size: 35px;  line-height: 44px; padding: 10px 0 10px; margin: 0; color: #192f33;color: #000;font-family: -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,"Helvetica Neue",sans-serif;font-weight: 600;}

.about-inner .left-text-top p{text-align: justify;  font-size: 20px;  line-height: 33px; padding: 0 0 10px; margin: 0; color: #000;font-family: -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,"Helvetica Neue",sans-serif;font-weight: 300;}

.about-inner .left-text-top ul{ position: relative;  padding: 0 0; margin: 0 0; }

.about-inner .left-text-top ul li{ list-style: none; padding: 0 0; font-size: 20px; line-height: 40px; color: #192f33de; font-weight: 200; margin: 0 0 0 10px; font-family: "Helvetica Neue",Helvetica,Arial,sans-serif;}





.terms{background: #ececec8a; padding: 20px 0 80px; margin: 0; width: 100%; position: relative; display: block;}

.terms p{font-family: -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,"Helvetica Neue",sans-serif; font-weight: 300; font-size: 18px; line-height: 34px; color: #101c1e;}



/*faq-us*/

.faq{  width: 100%; height: auto; background: #fff; padding: 35px 30px; margin: 0px 0;background: url(../images/ser-bg.jpg) repeat; }

.faq .accordion-box .accordion { background-color: #006191; color: #fff; cursor: pointer; padding: 10px 20px; width: 100%; border: none; text-align: left; outline: 0; font-size: 18px; transition: .4s; line-height: 28px;  border-bottom: 1px solid #cccccc70; font-family: -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,"Helvetica Neue",sans-serif;font-weight: 500;}

.faq .accordion-box  button.accordion::after { content: '\002B'; color: #fff; font-weight: 700; float: right; margin-left: 5px; }

.faq .accordion-box  button.accordion.active::after { content: "\2212";}

.faq .accordion-box .panel { padding: 0 18px; display: none; background-color: #f9f9f9; overflow: hidden; color: #000; }

.faq .accordion-box .accordion:hover{background-color: #094a88;}





/*contact-us*/

.contact-inner { width: 100%; position: relative; background: #fff; padding: 30px 0 40px; margin: 0; background: url(../images/ser-bg.jpg) repeat; overflow: hidden; z-index: 9; }

.contact-inner .con-left { width: 50%; float: left; display: block; padding: 10px 0 0 0; margin: 0; background: #102540b2; height: 300px; }

.contact-inner .con-left h5 { display: block; margin: 20px 0 5px; font-family: "Manrope", sans-serif; padding: 0 0 0 20px;}

.contact-inner .con-left h5 span { font-size: 18px; line-height: 20px; color: #ffffffe3; padding: 0px 0 0px 0; margin: 0;   font-family: -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,"Helvetica Neue",sans-serif;font-weight: 700;display: block;}

.contact-inner .con-left h5 a { display: block; color: #fffffff2; font-size: 19px; font-weight: lighter; line-height: 30px; padding: 0 0 0 20px; margin: 2px 0 0;  transition: all 500ms ease-in-out;  font-family: "Helvetica Neue",Helvetica,Arial,sans-serif;letter-spacing: 2px;outline: none;}

.contact-inner .con-left h5 span i { font-size: 14px; line-height: 17px; padding: 0 10px 0 0; margin: 0; color: #fffffff7; }

.contact-inner .con-right { width: 50%; float: right; display: block; padding: 0; margin: 0; }

.contact-inner .con-right .con-img-block { background: #fff; border: 1px solid #1932511c; width: 90%; margin: -40px 0 0; box-shadow: 10px 10px 20px 8px #00000017; padding: 15px; height: 380px; border-radius: 15px; }

.contact-inner .con-right .con-img-block img{ width: 100%; }

.banner-inner ul li.rightcontact { text-align: right; float: right; font-size: 14px; margin: 0 50px 0 0; }

.con-right .con-img-block label { font-size: 18px; line-height: 20px; color: #0f2e53eb; padding: 5px 0 0 5px; margin: 0; font-family: -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,"Helvetica Neue",sans-serif; font-weight: 500; width: 40%; height: 33px; float: left; }

.con-right .con-img-block input{font-family: "Helvetica Neue",Helvetica,Arial,sans-serif;width: 60%;float: right;height: 33px;padding: 0 0 0 10px;font-size: 15px;color: #000;font-weight: 200;letter-spacing: 1px;margin: 0;outline: none;background: url(../images/ser-bg.jpg) repeat;border: none;border-bottom: 0.5px solid #dfdfdf;}

.con-right .con-img-block textarea{font-family: "Helvetica Neue",Helvetica,Arial,sans-serif;width: 60%;float: right;height: 33px;padding: 0 0 0 10px;font-size: 15px;color: #000;font-weight: 200;letter-spacing: 1px;margin: 0;outline: none;background: url(../images/ser-bg.jpg) repeat;border: none;border-bottom: 0.5px solid #dfdfdf;}

.con-right .con-img-block .form-left-to-w3l{width: 100%; padding: 0 0; margin: 4px 0 1px; display: inline-block;}

.con-right .con-img-block input:hover{ background: #fff;}

.con-right .con-img-block textarea:hover{ background: #fff;}

.con-right .con-img-block .form-sub {width: 100%;display: inline-flex;}

.con-right .con-img-block .form-sub input[type="submit"] { padding: 11px 0; border-radius: 50px; color: #fff; font-family: "Roboto", Sans-serif; font-size: 17px; line-height: 25px; box-shadow: 0 15px 17px -10px #575a8982; border: 3px solid #fff; transition: all 600ms ease-in-out; height: auto; width: 30%; text-align: center; margin: 0; display: block; background: linear-gradient(90deg, #0062ff 0%, #002767 100%); }

.con-right .con-img-block .form-sub input[type="submit"]:hover{background: linear-gradient(90deg, #1e3d5e 0%, #0061ff 100%);}

.con-right .con-img-block h6{font-family: -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,"Helvetica Neue",sans-serif; font-weight: 700; text-align: center; font-size: 22px; text-transform: uppercase; color: #14437b; line-height: 30px; padding: 0 0 5px; margin: 0 0 0;}



/*product*/

.pro-Portfolio{ width: 100%; height: auto; background: #fff; padding: 30px 0 50px; margin: 0; position: relative; background: url(../images/ser-bg.jpg) repeat; overflow: hidden; }

.pro-Portfolio .Portfolio-left{width: 100%;position: relative;padding: 20px;margin: 10px 0 40px;border-radius: 10px;text-align: center;}

.pro-Portfolio .Portfolio-left h4{font-family: -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,"Helvetica Neue",sans-serif;font-weight: 700;color: #fff;text-transform: uppercase;font-size: 25px;line-height: 40px;padding: 15px 0 15px;background: #0276a6;border-radius: 5px;border: 4px solid #0d94cc;margin: 0 0 20px;box-shadow: 0px 6px 10px #00071124;}

.pro-Portfolio .Portfolio-left h5{font-size: 35px;line-height: 45px;color: #035577;padding: 0 0 10px;margin: 0;text-align: left;}

.pro-Portfolio .Portfolio-left p{text-align: justify;font-size: 23px;line-height: 40px;padding: 0 0 10px 0;margin: 0;}

.pro-Portfolio .Portfolio-left ul{width: 100%;text-align: left;display: inline-block;padding: 0 0 0 15px;margin: 0 0 10px 0;}

.pro-Portfolio .Portfolio-left ul li{font-family: "Helvetica Neue",Helvetica,Arial,sans-serif;font-weight: 200;width: 50%;float: left;list-style: conic-gradient;font-size: 15px;line-height: 22px;color: #044b68;}

.pro-Portfolio .Portfolio-box{width: 100%;position: relative;padding: 5px;margin: 10px 0 40px;background: #fff;border-radius: 10px;box-shadow: 0px 10px 22px #00071112;text-align: center;display: inline-block;}

.pro-Portfolio .Portfolio-box h6{font-family: -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,"Helvetica Neue",sans-serif;font-weight: 700;color: #fff;text-transform: uppercase;font-size: 16px;line-height: 25px;padding: 7px 0 9px;background: #025375;border-radius: 5px;border: 4px solid #096991;margin: 0 0 20px;box-shadow: 0px 6px 10px #00071124;letter-spacing: 2px;}

.pro-Portfolio .Portfolio-box p{font-family: -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,"Helvetica Neue",sans-serif;font-weight: 100;color: #063346;font-size: 15px;line-height: 25px;text-align: justify;height: 550px;overflow: auto;padding: 10px;margin: 0 0;}

.pro-Portfolio .Portfolio-left a.web-go-head{width: 49%;float: left;display: block;border-radius: 4px;padding: 7px 0;margin: 15px 0 10px 0;font-family: "Helvetica Neue",Helvetica,Arial,sans-serif;font-weight: 600;color: #fff;background: linear-gradient(90deg, #00b4ff 0%, #025c82 100%);text-transform: uppercase;font-size: 13px;letter-spacing: 0.5px;border: 3px solid #099fdd;text-shadow: 2px 2px 4px #00000040;}

.pro-Portfolio .Portfolio-left a.web-go-head:hover{background: linear-gradient(90deg, #095ab3 0%, #013771 100%);

  border: 3px solid #005dc4;}

.pro-Portfolio .Portfolio-left a.cont-form{width: 49%;display: block;border-radius: 4px;padding: 7px 0;margin: 15px 0 10px 0;font-family: "Helvetica Neue",Helvetica,Arial,sans-serif;font-weight: 600;color: #fff;background: linear-gradient(90deg, #00b4ff 0%, #025375 100%);text-transform: uppercase;font-size: 13px;letter-spacing: 0.5px;border: 3px solid #02557847;float: right;text-shadow: 2px 2px 4px #00000040;}

.pro-Portfolio .Portfolio-left a.cont-form:hover{background: linear-gradient(90deg, #095ab3 0%, #013771 100%);

  border: 3px solid #005dc4;}

img.Portfolio-img-right{width: 100%;

  float: right;

  height: auto;

  border: 5px solid #fff;

  padding: 0 0 0 0px;

  margin: 30px 0 0 0;

  border-radius: 5px;

box-shadow: -10px 10px 10px 1px rgba(0, 0, 0, 0.07);

}









/*//-------------------TAB / All Mobile Responsiv view RAAJ-------------------//*/









@media(max-width:786px) {

.header-top { width: 100%; position: relative; display: block; background: linear-gradient(35deg, rgb(251, 249, 255) 20%, rgb(9, 90, 179) 20%);}

.header-top .header-social-link{ text-align: center;display: none; }

.header-bottom .logo{width: 8%; left: 10px; top: -35px}

.header-bottom .logo img{width: 100%;}

.banner-new .banner-dec{z-index: 9;}

#menu-icon{top: -10px; left: -48px;}

.sf-menu { clear: both; position: absolute; top: 20px; background: #1043bf;width: 310px;}

.header-bottom .menu ul li a{transition: all 600ms ease-in-out; font-weight: 500; color: #fff !important; font-size: 13px !important; padding: 7px 0 !important; background: #1043bf !important; border-bottom: 0.5px solid #cccccc5e; border-radius: 0 !important;}

 .sf-menu li ul { background: #ccc !important; box-shadow: none; padding: 0 0 !important; margin: 0 0 !important;}

.header-bottom .menu ul li ul li{}

.header-bottom .menu ul li ul li a { color: #b7cde6 !important; padding: 7px 0 6px 0 !important; font-weight: 400; font-size: 13px !important; border-bottom: 1px dotted #b7cde6; letter-spacing: 1px; }

.banner-new img.banner-img{width: 100%; height: 350px;}

.banner-new .banner-dec { top: 17%;}

.banner-new .banner-dec .banner-dec-text h5{font-size:50px;}

.banner-new .banner-dec .banner-dec-text h2{font-size:22px}

.banner { width: 100%; padding: 50px 0 10px;}

.banner .circle-image { position: relative; width: 100%; margin: 0 auto 0px;top: 0;}

.banner .banner-image-block{display: none;}

.banner .circle-image .circle-image-block { width: 80%; float: none; display: block; padding: 0; margin: 0 auto 20px;}

.banner .circle-image .circle-text-block { width: 100%; float: none;padding: 0;}

.about .about-block-content-image img { width: 90%; margin: 0 auto 20px; display: block;}

.about { width: 100%; position: relative; display: block; padding: 20px 0 70px;}

.about .about-block-content-image { width: 100%; position: relative; margin: 0; }

.about .about-block-content-image img { width: 90%; margin: 0 auto 20px; display: block; }

.about .about-block-content-dec { width: 90%; position: relative; margin: 0 auto; display: block; }

.about .about-block-content-dec h5 { font-size: 45px; line-height: 60px; color: #041840; padding: 0; margin: 0; font-weight: bold; }

.about .about-block-content-dec p { font-size: 25px; line-height: 40px; color: #020f2fe5; padding: 0; margin: 0; text-align: left;}

.product .card { background: white; margin: 0 auto 35px; width: 80%; padding: 30px 30px; -webkit-box-shadow: -1px 9px 16px -3px rgba(0, 0, 0, 0.37); border-radius: 25px; height: auto;}

.solution .card { width: 80%; padding: 0; margin: 0 auto 50px; position: relative; transition: all 400ms ease-in-out; overflow: hidden; border: 15.5px solid #030e60; border-radius: 15px; height: 450px; box-shadow: 0px 10px 10px #0007113d;}

.solution .card .solution-text-block img { width: 15%; background: #f0f0f0; border-radius: 15px; height: auto;}

.solution .card .solution-text-block p { padding: 20px 0 0 0; margin: 0 0; text-align: center; color: #ffffffbd; font-size: 20px; line-height: 35px; height: auto; overflow: hidden;}

.solution .card .solution-text-block h4 span { display: block; font-size: 20px; line-height: 25px; color: #fff; padding: 20px 0 10px 0px; margin: 0 0 0; text-transform: capitalize; height: auto;}

.solution{padding: 10px 0 50px;}

.copyright { width: 100%; position: relative; background: #00044ec9; display: block; border-top: none; padding: 20px 0; margin: 30px 0 0; text-align: center; box-shadow: 0 -5px 7px #d0d5e6;}

.inner-banner { height: 200px;}

.inner-banner .border-up { top: -7px;}

.inner-banner .border-down { bottom: 10px; }

.con-right .con-img-block .form-sub input[type="submit"]{width: 50%;}

.contact-inner .con-right .con-img-block { background: #fff; border: 1px solid #1932511c; width: 100%;}

.con-right .con-img-block label { font-size: 15px;}





}







@media(max-width:600px) {

.header-top .click-link { width: 100%; padding: 2px 0;}

.header-top .click-link ul li { font-size: 13px; line-height: 14px; padding: 0 0;}

.header-top .click-link ul li a{ font-size: 12px;}

.header-top .click-link ul li a i { font-size: 11px; color: #fff; padding: 0 5px 0px 0;}

.header-bottom { width: 100%; position: relative; display: block; padding: 5px 0;}

.header-bottom .logo { width: 10%; left: 5px; top: -28px; }

.solution .card{ height: 500px; }

.footer .footer-about{ text-align: center;}

.inner-banner {   height: 140px; }

.con-right .con-img-block label { font-size: 13px;}

.pro-Portfolio .Portfolio-left h5{ font-size: 30px; line-height: 45px;}

.pro-Portfolio .Portfolio-left p { text-align: left; font-size: 20px; line-height: 35px;}

img.Portfolio-img-right { width: 100% !important;}

.pro-Portfolio .Portfolio-left { width: 100%; position: relative; padding: 0 10px; margin: 0px 0 40px;} 

.inner-title h2{font-size: 30px; line-height: 40px; padding: 0px 0 0;}

.inner-title h3{font-size: 18px; line-height: 20px; padding: 0 0 25px;}

.snip1189 li { display: inline-block; list-style: outside none none; margin: 0; padding: 0}



}







@media(max-width:500px) {

.header-bottom .logo { width: 13%; left: 5px; top: -25px; }

.header-top {  background: linear-gradient(35deg, rgb(251, 249, 255) 13%, rgb(9, 90, 179) 13%);}

.header-top .click-link ul li { font-size: 10px; line-height: 14px; padding: 0 0; }

.header-top .click-link ul li a { font-size: 12px; padding: 0 5px 0 0; }

.header-top .click-link ul li a i { font-size: 11px; color: #fff; padding: 0 1px 0px 0; border: none; margin: 0; }

.banner-new .banner-dec .banner-dec-text h5 {

font-size: 30px;

padding: 0px 0 0px 0;

line-height: 50px;

}

.banner-new .banner-dec {

top: 25%;

}

.banner-new img.banner-img {

width: 100%;

height: 260px;

}

.banner-new .banner-dec .banner-dec-text {

padding: 20px 0 15px;

width: 95%;

border-radius: 15px;

}

.banner-new .banner-dec .banner-dec-text h2 {

font-size: 19px;

line-height: 30px;

}

.banner .circle-image .circle-text-block h1 {

font-size: 35px;

line-height: 40px;}

.banner .circle-image .circle-text-block p {

font-size: 25px;

line-height: 40px;

color: #02153c;

padding: 0 0px 30px 0;

margin: 0;

text-align: left;}

.about .about-block-content-dec h5 {

font-size: 35px;

line-height: 50px;}

.about .about-block-content-dec p {

font-size: 20px;

line-height: 33px;}

.product .card {

background: white;

margin: 0 auto 35px;

width: 90%;}

.product .card h4 {

font-size: 20px;

line-height: 30px;

color: #05214f;

padding: 5px 0 10px;

margin: 0;

font-weight: 500;

height: auto;}

.product .card img {

width: 20%;

margin: 4px auto 9px;

display: block;

}

.product .card p {

font-size: 20px;

line-height: 30px;

color: #1d1d1dd6;

padding: 0 0 10px;}

.solution .card {

height: 600px;

width: 90%;

padding: 0;

}

.solution .card .solution-text-block img {

width: 30%;}

.footer .footer-logo {

width: 25%;

background: #fff;

display: block;

margin: 30px auto 30px;}

.footer .footer-about h5 {

font-size: 25px;

line-height: 35px;}

.footer .footer-about ul li a {

color: #e8e8e8;

transition: all 500ms ease-in-out;

font-size: 18px;

line-height: 22px;

}

.footer .footer-about ul li a:hover {

color: #fff;}



.inner-banner {

height: 140px;

}

.inner-banner .inner-banner-img {

width: 100%;

padding: 0 0px;

margin: -50px 0 0 0;

opacity: 1;

}

.inner-banner ul {

z-index: 9;

background: #001439ba;

padding: 0 0;

margin: 0;

}

.inner-banner ul li {

list-style: none;

display: inline-block;

padding: 0 10px;}

.inner-banner ul li a.active {

margin: 0 0 0 10px;

font-size: 11px;

color: #fff;

line-height: 20px;

padding: 5px 0 8px;}

.inner-banner ul li a {

font-size: 12px;

color: #fff;

line-height: 20px;

padding: 5px 0 8px;}

.inner-banner .border-up {

top: -10px;

}

.contact-inner .con-left {

width: 100%;}

.contact-inner .con-right .con-img-block {

background: #fff;

border: 1px solid #0000001c;

width: 100%;

box-shadow: 0px 0px 20px 10px #fff;

}

.con-right .con-img-block label {

font-size: 16px;

}

.contact-inner .con-right {

width: 100%;

float: right;

display: block;

padding: 0;

margin: 0;

}

ul.ab {

animation: r 4s forwards;

margin: 0 auto;

}



}







@media(max-width:450px) {

.header-top {

background: linear-gradient(35deg, rgb(251, 249, 255) 0%, rgb(9, 90, 179) 0%);

}

.header-top .click-link {

width: 100%;

padding: 0;

text-align: center;

}

.header-bottom {

width: 100%;

position: relative;

display: block;

padding: 10px 0;

}

.header-bottom .logo {

width: 11%;

left: 15px;

top: -8px;

}

.banner .circle-image .circle-image-block {

width: 100%;

float: none;

display: block;

padding: 0;

margin: 0 auto 20px;

}



.about .about-block-content-image img {

width: 100%;}

.about .about-block-content-dec {

width: 100%;}

.product h2 {

font-size: 25px;

line-height: 35px;}



.inner-banner {

height: 125px;

}

.footer .footer-social ul li a i {

  position: relative;

  color: #fff;

  transition: .5s;

  z-index: 3;

  padding: 11px 0 0 0;

}

.contact-inner .con-left h5 a {

  display: block;

  color: #fffffff2;

  font-size: 15px;

  font-weight: lighter;

  line-height: 30px;}



}







@media(max-width:420px) {

  .inner-banner {

    height: 120px;

  }

  .inner-title h2 {

    font-size: 25px;

    line-height: 30px;

    padding: 0px 0 0;

  }

 .pro-Portfolio .Portfolio-left h5 {

    font-size: 24px;

    line-height: 35px;

  }





}







@media(max-width:399px) {

 .header-top .click-link ul li a {

    font-size: 13px;

    padding: 0 0px;

    letter-spacing: 1px;

  }

  .banner .circle-image .circle-text-block h1 {

    font-size: 30px;

    line-height: 25px;

  }

 .banner .circle-image .circle-text-block p {

    font-size: 20px;

    line-height: 35px;}

 .solution .card .solution-text-block p {

    padding: 20px 0 0 0;

    margin: 0 0;

    text-align: center;

    color: #ffffffbd;

    font-size: 18px;

    line-height: 29px;}

.solution .card .solution-text-block h4 span {

    display: block;

    font-size: 17px;

    line-height: 20px;

    color: #fff;

    padding: 15px 0 10px 0px;

    margin: 0 0 0;

    text-transform: capitalize;

    height: auto;

  }

  .footer .footer-about ul li a {

    color: #e8e8e8;

    transition: all 500ms ease-in-out;

    font-size: 15px;

    line-height: 20px;

  }

  .inner-banner {

    height: 110px;

  }





}







@media(max-width:379px) {}





@media(max-width:350px) {

  .inner-banner {

    height: 90px;

  }

.contact-inner .con-left h5 {

  display: block;

  margin: 20px 0 5px;

  font-family: "Manrope", sans-serif;

  padding: 0 0 0 10px;

}

.contact-inner .con-left h5 a {

  display: block;

  color: #fffffff2;

  font-size: 14px;

  font-weight: lighter;

  line-height: 30px;

  padding: 0 0 0 10px;}



 .con-right .con-img-block label {

    font-size: 12px;

  }

.con-right .con-img-block input{   font-size: 12px;}

.con-right .con-img-block textarea{    font-size: 12px;}



.banner-new .banner-dec .banner-dec-text h5 {

    font-size: 20px;

    padding: 0px 0 0px 0;

    line-height: 40px;

  }

 .banner-new .banner-dec .banner-dec-text h2 {

    font-size: 15px;

    line-height: 22px;

  }

.header-bottom .logo {

    width: 14%;

    left: 15px;

    top: -8px;

  }

.banner .circle-image .circle-text-block h1 {

    font-size: 25px;

    line-height: 23px;

  }

.banner .circle-image .circle-text-block h5 {

  font-size: 19px;

  line-height: 8px;}

 .product .card h4 {

    font-size: 17px;

    line-height: 23px;}

 .product .card p {

    font-size: 16px;

    line-height: 25px;

    color: #1d1d1dd6;

    padding: 0 0 10px;

  }

 .solution .card .solution-text-block p {

    padding: 20px 0 0 0;

    margin: 0 0;

    text-align: center;

    color: #ffffffbd;

    font-size: 15px;

    line-height: 25px;

  }

.inner-banner {

    height: 90px;

  }





}