@charset "utf-8";
/* CSS Document */
.banner .row{
    min-height: 100vh;
}


.logo {
    width: 150px;
    height: 100px;
    display: block;

}

.more-btn {
    box-shadow: 0 5px 11px 5px #ebebeb;
    background: #fff;
    padding: 10px 20px;
        padding-right: 20px;
    border-radius: 100px;
    color: #071d50;
    font-size: 16px;
    text-decoration: none !important;
    position: relative;
    padding-right: 45px;
    transition: 0.3s ease-in all;
}
.more-btn:hover{
   color: #071d50 !important;
}
.more-btn:hover i{
     color: #00b8ff;
    font-size: 27px;
    margin: 7px;
    position: absolute;
    right: -3px;
    top: 3px;
    transition: 0.3s ease-in all;
}
.fas.fa-arrow-circle-right {
    color: #00b8ff;
    font-size: 27px;
    margin: 7px;
    position: absolute;
    right: 3px;
    top: 3px;
    transition: 0.3s ease-in all;
}

.ictabset-tab a.tab05::after {
    background-position-x: -185px;
}
.ictabset-tab a.tab06::after {
    background-position-x: -230px;
}
.profile p{
    text-align:center !important;
    width:100% !important;
}

.sersec {
    padding:50px 0 !important;
    overflow:hidden;
}

.contact-txt {

    text-align: center;
    margin-top: 15px;
    color: #071d50;
    font-weight: 600;

}
.menubtn {
    color: #00b8ff !important;
    position: absolute;
    top: 31px;
    right: 30px;
    font-size: 35px;
    cursor: pointer;
}

.menubtn {
    display: none !important;
}
.menu-item-has-children{
	position:relative;
}
.menu-item-has-children:before {
    content: "";
    border-left: 4px solid transparent;
    border-right: 4px solid transparent;
    border-top: 4px solid #3a3a3a;
    border-bottom: 4px solid transparent;
    position: absolute;
    top: 15px;
    right: 0px;
    transform: translatey(-50%);
}

.menu-item-has-children:hover ::before{
	border-top-color:#00b8ff;
}
.clrbg{
    background:#f4f4f4;
}
.contacticon{
    width: 50px;
    height: 50px;
    display: block;
    background: #F0F0F0;
    border-radius: 50px;
    margin: 0 auto;
        margin-top: 0px;
    margin-top: 32px;
    padding: 14px 17px;
    color: #00b8ff;
}
.vdo{
    height:40vh;
    width:100%;
    background:#757575;
    
}
.form{
    padding:40px;
    border-left: 1px dashed #C9C9CB;
}

.topbdr{
    border-top: 1px dashed #C9C9CB;
}

input {
    color: #000;
    width: 100%;
    margin-top: 15px;
    border-radius: 4px;
    padding: 10px;
    border: 1px solid #EBEBEB;
}

textarea {
   color: #000;
    width: 100%;
    margin-top: 15px;
    border-radius: 4px;
    padding: 10px;
    border: 1px solid #EBEBEB;
    height:100px;
}
.vdo video{
    width:100%;
    height:100%;
    object-fit:cover;
}

 .sersec .card-work {
    background: #fff;
    padding: 35px 0;
    min-height: 500px;
    height: 100%;
}
p span {
    color: #2b99ff;
    font-size: 14px;
    line-height: ;
}


.sersec li {
    color: #636363;
    line-height: 35px;
    font-size: 15px;
    text-align: center;
    position: relative;
    padding-left:35px;
    margin-bottom:15px !important;
    display:inline-block;
}

.titletxt {
    background: #E1E1E1;
    padding: 15px;
    color: #fff;
    font-weight: 700;
    font-size: 50px;
    text-align: center;
}
.innerpage h1 {
    color: #071d50;
    font-weight: 600;
    font-size: 30px;
    text-transform: none;
    line-height: 45px;
}
.clear{
    clear:both !important;
    display:block;
}

.sersec li:after{
    
    background:url(../img/tik.svg);
    height:28px;
    width:28px;
    display:block;
    content:'';
    top:3px;
    position:absolute;
    left:0;
}

.card-work .icon1{
    height:81px;
    width:81px;
    display:block;
    background:url(../img/iconset05.svg);
    margin:0 auto;
}

.card-work .icon2 {
    height: 81px;
    width: 90px;
    display: block;
    background: url(../img/iconset05.svg);
    margin: 0 auto;
    background-position-x: -85px;
}

.card-work .icon3 {
    height: 81px;
    width: 81px;
    display: block;
    background: url(../img/iconset05.svg);
        background-position-x: 0%;
    margin: 0 auto;
    background-position-x: 80px;
}

.ftr-logo {
  text-align: center;
}
.ftr-logo svg{
  width: 250px;
}
header{
    background: #fff;
    position: fixed;
    width: 100%;
    border-bottom: 1px solid #EAEAEA;
    z-index: 1000;
    top: 0;
    text-align: center;
}
.search{
   width: 37px;
    height: 37px;
    display: inline-block;
    background: url(../img/iconset04.svg);
        background-color: rgba(0, 0, 0, 0);
        background-position-x: 0%;
        background-position-y: 0%;
    background-position-x: 0%;
    background-position-y: 0%;
    transition: 0.3s ease-in all;
    background-color: #e2e2e2;
    border-radius: 4px;
    background-position-x: 79px;
    margin-left: 10px;
}

.social-head {
    width: 37px;
    height: 37px;
    display: inline-block;
    background: url(../img/iconset04.svg);
        background-color: rgba(0, 0, 0, 0);
        background-position-x: 0%;
        background-position-y: 0%;
    background-position-x: 0%;
    background-position-y: 0%;
    transition: 0.3s ease-in all;
    background-color: #e2e2e2;
    border-radius: 4px;

      transition: all;
    transform-style: flat;
transform-origin: left;
    -webkit-animation: sociaicon 3s, infinite;
  animation: sociaicon 3s infinite;
}

@-webkit-keyframes sociaicon {
  0% {
     background-position-x:-2px;
  }
  
  12.5% {
  background-position-x:-43px;
  }

  25% {
  background-position-x:-84px;
  }

  37.5% {
    background-position-x:-124px;
  }
  
  50% {
   background-position-x:-167px;
  }

  62.5% {
   background-position-x:-209px;
  }

  75% {
  background-position-x:-252px;
  }

   87.5% {
  background-position-x:-2px;
  }

  100% {
  background-position-x:-2px;
  }

}

header a {
    color: #000 !important;
    font-size: 15px;
    font-weight: 600;
    padding: 5px 10px;
     transition: 0.3s ease-in all;
     position: relative;
     overflow:hidden;
}


header ul a:hover{
  color:#00b8ff !important;
  transition: 0.3s ease-in all;
  text-decoration:none !important;

}

header ul a.active{
  color:#00b8ff !important;
  transition: 0.3s ease-in all;
  text-decoration:none !important;

}

header ul a.active:after{
  display: block;
  text-decoration:none !important;
}


header ul a:hover:after{
  display: block;
  text-decoration:none !important;
}

header ul a::after {
    background:#00b8ff !important;
    height: 3px;
    width: 20px;
    display: block;
    position: absolute;
    content: "";
    bottom: 0;
    left: calc(50% - 18px);
    transition: all;
    transform-style: flat;
    transform-origin: left;
    -webkit-animation:move_bare 1s, infinite;
    animation: move_bar 1s infinite;
    display: none;
}




@-webkit-keyframes move_bar {
  0% {
    left:20%; 
  }



  50% {
   left:50%; 
  }
  
   100% {
   left:20%; 
  }
}






.phone{
  color: #071d50 !important;
}
.fas.fa-phone {
    transform: rotate(100deg);
}
.phone .fas.fa-phone {
    color: #00b8ff;
    margin-right: 6px;
}

header ul {
    margin: 0 auto;
    display: inline-block;
}
header li {

    list-style: none;
    display: inline-block;

}
.inner-top{
  margin-top: 100px;
}
h1 {
    color: #071d50;
    font-weight: 700;
    font-size: 40px;
    text-transform: uppercase;
}
h2 {
    color: #071d50;
    font-weight: 800;
    font-size: 35px !important;
    margin-bottom: 10px !important;
    display: block;
    text-transform: uppercase;
}

h2 span{
    color: #00b8ff;
    font-weight: 800;
    font-size: 35px;
    text-transform: uppercase;
}



@-webkit-keyframes logo-txt {
  0% {
    transform:  scale(.5) rotateX(0deg);

  }
  50% {
   transform:  scale(1)  rotateX(400deg);
  }

  100% {
    transform:  scale(.5)  rotateX(0deg);

  }

 
}

.social:hover{
   transition: 0.3s ease-in all; 
   background-position-y:-84px;
}


.social {
    width: 37px;
    height: 37px;
    display: inline-block;
    background: url(../img/iconset03.svg);
    background-position-y:-44px;
    transition: 0.3s ease-in all;
    
}

.social.icon1 {
    background-position-x: -3px;
}

.social.icon2 {
    background-position-x: -44px;
}


.social.icon3 {
    background-position-x: -87px;
}
.social.icon4 {
    background-position-x: -129px;
}

.social.icon5 {
    background-position-x: -170px;
}

.social.icon6 {
    background-position-x: -212px;
}

.social.icon7 {
    background-position-x: -254px;
}

.cprt {

    background: #0f0f0f;
    color: #fff;
    font-size: 12px;
    text-align: center;
    padding: 10px;

}

.logo-txt{
 

  transform-origin: center;
  -webkit-animation: logo-txt 5s infinite;
  animation: logo-txt 5s infinite;
}

.logo-rotate{
  transform-origin: center;
  -webkit-animation: logo-rotate 5s infinite;
  animation: logo-rotate 5s infinite;

}


@-webkit-keyframes logo-rotate {
  0% {
    transform: rotate(0deg) scale(.5);

  }
  50% {
   transform: rotate(360deg) scale(1);
  }

  100% {
    transform: rotate(0deg) scale(.5);

  }

 
}


@-webkit-keyframes cloudone {
  0% {
    transform: rotateY(0deg);
  }
  50% {
   transform: rotateY(168deg);
  }

  100% {
   transform: rotateY(0deg);
  }
}


@-webkit-keyframes cloudonetwo {
  0% {
    transform: rotate(0deg);
  }
  50% {
   transform: rotate(168deg);
  }

  100% {
   transform: rotate(0deg);
  }
}



@-webkit-keyframes pencil {
  0% {
    transform: rotateY(168deg);
  }
  50% {
   transform: rotateY(0deg);
  }

  100% {
   transform: rotateY(168deg);
  }
}


@-webkit-keyframes lader {
  0% {
    transform: translateX(0%);
  }
  50% {
   transform:  translateX(10%);
  }

  100% {
   transform:  translateX(0%);
  }
}


@-webkit-keyframes picker-clr {
  0% {
    transform: translateX(0%);
  }
  50% {
   transform:  translateX(-10%);
  }

  100% {
   transform:  translateX(0%);
  }
}



@-webkit-keyframes rotate-sec {
  0% {
    transform: rotate(0deg);
  }

  100% {
   transform: rotate(360deg);
  }
}


@-webkit-keyframes rotate-sec_normal {
  0% {
     transform: rotate(360deg);
  }

  100% {
   transform: rotate(0deg);
  }
}



.card-ser:hover span{
    -webkit-animation: rotate-sec 1s ;
  animation: rotate-sec 1s ;
   transition: all;
}


.card-ser span{
    -webkit-animation: rotate-sec_normal 1s ;
  animation: rotate-sec_normal 1s ;
   transition: all;
}


.pencil{
     transition: all;
    transform-style: flat;
    transform-origin: center;
    -webkit-animation: pencil 5s infinite;
  animation: pencil 5s infinite;
}


.lader{
     transition: all;
    transform-style: flat;
    transform-origin: center;
    -webkit-animation: lader 5s, infinite;
  animation: lader 5s infinite;
}


.picker-clr{
     transition: all;
    transform-style: flat;
    transform-origin: center;
    -webkit-animation: picker-clr 5s, infinite;
  animation: picker-clr 5s infinite;
}

.man_left{

     transition: all;
    transform-style: flat;
    transform-origin: left;
    -webkit-animation: man_left 3s, infinite;
  animation: man_left 3s infinite;

}
@-webkit-keyframes man_left {
  0% {
    transform: translateX(0%) ;
  }
  50% {
   transform:  translateX(-2%);
  }

  100% {
   transform:  translateX(0%) ;
  }
}


.man_right{

     transition: all;
    transform-style: flat;
    transform-origin: left;
    -webkit-animation: man_right 3s, infinite;
  animation: man_right 3s infinite;

}
@-webkit-keyframes man_right {
  0% {
    transform: translateX(0%) ;
  }
  50% {
   transform:  translateX(2%);
  }

  100% {
   transform:  translateX(0%) ;
  }
}

.passleft{

     transition: all;
    transform-style: flat;
    transform-origin: center;
    -webkit-animation: passleft 5s, infinite;
  animation: passleft 5s infinite;

}
@-webkit-keyframes passleft {
  0% {
    transform: translateX(0%) ;
  }
  50% {
   transform:  translateX(60%);
  }

  100% {
   transform:  translateX(0%) ;
  }
}

.passright{

     transition: all;
    transform-style: flat;
    transform-origin: center;
    -webkit-animation: passright 5s, infinite;
  animation: passright 5s infinite;

}
@-webkit-keyframes passright {
  0% {
    transform: translateX(0%) ;
  }
  50% {
   transform:  translateX(-30%);
  }

  100% {
   transform:  translateX(0%) ;
  }
}

.laptop{

     transition: all;
    transform-style: flat;
    transform-origin: center;
    -webkit-animation: laptop 2.5s, infinite;
  animation: laptop 2.5s infinite;

}
@-webkit-keyframes laptop {
  0% {
    transform: translateY(0%) ;
  }
  50% {
   transform:  translateY(-2%);
  }

  100% {
   transform:  translateY(0%) ;
  }
}


.movefullright{
  transition: all;
    transform-style: flat;
    transform-origin: center;
    -webkit-animation: movefullright 5s, infinite;
  animation: movefullright 5s infinite;
}


@-webkit-keyframes movefullright {
  0% {
    transform: translateX(0%) ;
  }
  50% {
   transform:  translateX(5%);
  }

  100% {
   transform:  translateX(0%) ;
  }
}

.footware{
  transition: all;
    transform-style: flat;
transform-origin: left;
    -webkit-animation: footware 1s, infinite;
  animation: footware 1s infinite;
}


@-webkit-keyframes footware {
  0% {
    transform: rotate(0deg);

  }
  50% {
   transform: rotate(1deg);
  }

  100% {
  transform: rotate(0deg);
  }
}

.hand_type{
  transition: all;
    transform-style: flat;
/*transform-origin: left;*/
    -webkit-animation: hand_type 1s, infinite;
  animation: hand_type 1s infinite;
}


@-webkit-keyframes hand_type {
  0% {
    transform: rotate(0deg);
    transform: translateY(0px);

  }
  50% {
   transform: rotate(1deg) ;
   transform: translateY(-1px);
  }

  100% {
  transform: rotate(0deg);
  transform: translateY(0px);
  }
}







.manhead{

     transition: all;
    transform-style: flat;
    transform-origin: center;
    -webkit-animation: manhead 3s, infinite;
  animation: manhead 3s infinite;

}
@-webkit-keyframes manhead {
  0% {
    transform: rotate(-3deg);
  }
  50% {
   transform:   rotate(0deg);
  }

  100% {
   transform:   rotate(-3deg) ;
  }
}


.scale{
/*     transition: all;
    transform-style: flat;*/
    transform-origin: center;
    -webkit-animation: scale 3s, infinite;
     animation: scale 3s infinite; 
}




@-webkit-keyframes scale {
  0% {
    transform: rotateX(0deg);
  }
  50% {
   transform: rotateX(500deg);
  }

  100% {
   transform: rotateX(0deg);
  }
}



@-webkit-keyframes brush {
  0% {
    transform: rotate(0deg);
  }
  50% {
   transform: rotate(10deg);
  }

  100% {
   transform: rotate(0deg);
  }
}


@-webkit-keyframes brushtop {
  0% {
    transform: rotatey(0deg);
  }
  50% {
   transform: rotatey(5deg);
  }

  100% {
   transform: rotatey(0deg);
  }
}


@-webkit-keyframes screenmove {
  0% {
    fill:#071d50;
  }


  60% {
   fill:#00b8ff;
  }


}


.screen{
     transform-origin: center;
    -webkit-animation: screenmove 2s, infinite;
     animation: screenmove 2s infinite; 
}




.brush{
     transform-origin: center;
    -webkit-animation: brush 5s, infinite;
     animation: brush 5s infinite; 
}


.brushtop{
     transform-origin: center;
    -webkit-animation: brushtop 3s, infinite;
     animation: brushtop 3s infinite; 
}


.cloudone {
    transition: all;
    transform-style: flat;
    transform-origin: center;
    -webkit-animation: cloudone 5s, bounce 5s infinite;
  animation: cloudone 5s infinite;
}
.cloudonetwo {
    transition: all;
    transform-style: flat;
    transform-origin: center;
    -webkit-animation: cloudone 5s, bounce 5s infinite;
  animation: cloudone 5s infinite;
}



.buld-blink{
 transition: all;
    transform-style: flat;
    transform-origin: center;
    -webkit-animation: buldblink 3s,;
  animation: buldblink 3s infinite;
}


.buld-blink2{
 transition: all;
    transform-style: flat;
    transform-origin: center;
    -webkit-animation: buldblink2 3s,;
  animation: buldblink2 3s infinite;
}

@-webkit-keyframes buldblink {


  0% {
    fill:#dbe2e8;
  }


  50% {
   fill:#00b8ff;
  }


  100% {
   fill:#dbe2e8;
  }


}


@-webkit-keyframes buldblink2 {


  0% {
 fill:#fdd247;
    
   
  }


  50% {
   fill:#dbe2e8;
  }


  100% {
     fill:#fdd247;
  }


}


.typewriter-text {
  padding-right: 10px;
  color: #00b8ff;
  border-right: solid #00b8ff 7px;
  animation: cursor 1s ease-in-out infinite;
  font-weight: bold;
}
@keyframes cursor {
  from { border-color: #00b8ff; }
  to { border-color: transparent; }
}




.btn-large {
    background: #071d50;
    color: #fff;
    padding: 15px 25px;
    border-radius: 5px;
    font-size: 15px;
    text-decoration: none;
    display: inline-block;
    font-weight: 600;
}
.btn-short {
    background: #00b8ff;
    color: #fff;
    padding: 15px 20px;
    border-radius: 5px;
    font-size: 15px;
    text-decoration: none;
    display: inline-block;
    font-weight: 600;
    display:none !important;

}

.btn-large:hover{
      color: #fff !important;
      text-decoration: none !important;
}

.btn-short:hover{
      color: #fff !important;
      text-decoration: none !important;
}




.sec2{
    background: #f4f4f4;
    padding: 100px 0 !important;
    overflow: hidden;
}

.sec3{
    padding: 100px 0 !important;
     overflow: hidden;
}
h3 {

    color: #00b8ff;
    font-size: 14px;
    font-weight: 500;
    letter-spacing: 8px;
    margin-bottom: 15px !important;
    text-transform: uppercase;

}

h4{
    text-transform: uppercase;
}
.card-ser {
    background: #fff;
    padding: 40px;
    box-shadow: 0 3px 10px 1px #ebebeb;
    border-radius: 15px;
    border: 1px solid #EAEAEA;
    display: block;
    cursor: pointer;
    margin-bottom: 30px;
    min-height: 380px;
}

.card-ser p{

}

.profile{
    width: 100%;
    height: 250px;
    overflow: hidden;
    border-radius: 15px;
    position: relative;
    transition: 0.3s ease-in all;
}
h6 {
    color: #fff;
    font-size: 18px;
    font-weight: 600;
}


.profile span p{
    font-size: 14px;
    font-style: italic;
    font-weight: 600;
    color:#fff;
}


.profile span{
    padding-top: 80px;

    width: calc(100% - 20px);
    height:calc(100% - 20px);
    position: absolute;
    top: 260px;
    left: 10px;
    display: block;
    border-radius: 10px;
    text-align: center;
    background-color: rgba(39,204,255,0.9);
    transition: 0.7s ease-in all;
}

.tc.head {
    width: 50%;
    margin: 0 auto;
}

.profile:hover img{
     transition: 0.3s ease-in all;
    filter: grayscale(100%);
}


.fa-times-circle {
    color: #898989;
    font-size: 18px;
}


.profile:hover span{
    top:10px;
     transition: 0.7s ease-in all;
}

.profile img{
    width: 100%;
    width: 100%;
    object-fit: cover;
    transition: 0.3s ease-in all;
   
}
.search-box {
    background: #e2e2e2;
    padding: 6px 10px;
    width: 84%;
    border-radius: 4px;
    float: left;
    font-size: 16px;
    color: #000;
}
h4 {
    color: #071d50;
    font-weight: 600;
    font-size: 20px;
    margin-bottom: 15px;
}

.fas.fa-search {
    color: #071d50;
    font-size: 18px;
}
.icon-ser{
    height: 81px;
    width: 81px;
    display: block;
    background: url(../img/iconset02.svg);
}
.icon-ser.icon2 {
    background-position-x: -90px;
}

.icon-ser.icon3 {
    background-position-x: -183px;
}


.icon-ser.icon4 {
    background-position-x: -275px;
}
.ictabset-tab{
    text-align: center;
}
.ictabset-tab a.tab01{
    border-radius: 10px 0  0 10px;

}
.ictabset-tab a.tab06{
    border-radius: 0 10px  10px 0  ;
}

.ictabset-tab a.tab01:after{
    background-position-x: 3px;
}

.ictabset-tab a.tab02:after{
    background-position-x: -42px;
}


.ictabset-tab a.tab03:after{
    background-position-x: -93px;
}


.ictabset-tab a.tab04:after{
    background-position-x: -140px;
}




.ictabset-tab a::after {
    width: 50px;
    height: 50px;
    background: url(../img/iconset01.svg);
        background-repeat: repeat;
    position: absolute;
    content: "";
    display: block;
    left: calc(50% - 25px);
    background-repeat: no-repeat;
    overflow: hidden;
    border-radius: 100px;
    opacity: 0;
    transform: scale(0);
    transition: 0.3s ease-in all;
    bottom: -30px;
}

.ictabset-tab a {
    display: inline-block;
    margin: 5px 1px 5px -3px;
    width: auto;
    min-width: 120px;
    background-color: #fff;
    color: #667691 !important;
    text-align: center;
    line-height: 30px;
    font-size: 18px;
    padding: 5px 10px;
    transition: 0.3s ease-in all;
    padding: 20px 20px;
    box-shadow: 0 3px 10px 1px #ebebeb;
    position: relative;

}
.ictabset-tab a:hover{
    transition: 0.3s ease-in all;
   /* background-color: #4183D7aa;*/
    color: #071d50 !important;
    text-decoration: none !important;
}


.ictabset-tab a:hover:after{
    transition: 0.3s ease-in all;
    opacity: 100;
    transform: scale(1.2);
}


.ictabset-tab a.tabActive:after{
    transition: 0.3s ease-in all;
    opacity: 100;
    transform: scale(1);
}

.ictabset-tab a.tabActive{
    transition: 0.3s ease-in all;
    /*background-color: #4183D7;*/
    color: #071d50  !important;
}
.ictabset-detailbox .tabdetail-each{
    padding: 15px;
    margin-top: 15px;

    width: 100%;
    display: none;
}
.ictabset-detailbox .tabdetail-each.active{
    display: block;
}
.bg-with-black{
    position:relative;
    overflow:hidden;
    transition: 0.3s ease-in all;
}
.bg-with-black span{
    background: #00b8ff;
    width: 50px;
    height: 50px;
    display: block;
    padding: 12px;
        padding-left: 12px;
    color: #fff;
    border-radius: 100px;
    padding-left: 17px;
    position: absolute;
    bottom: -50px;
    left: calc(50% - 25px);
    transition: 0.3s ease-in all;
}
.bg-with-black:hover span{
    background: #00b8ff;
    width: 50px;
    height: 50px;
    display: block;
    padding: 12px;
        padding-left: 12px;
    color: #fff;
    border-radius: 100px;
    padding-left: 17px;
    position: absolute;
    bottom: calc(50% - 25px);
    left: calc(50% - 25px);
    transition: 0.3s ease-in all;
}
.content {
    padding: 10px;
}
.date {
    color: #00b8ff;
    font-size: 14px;
    font-weight: 500;
    margin-top: 7px;
    border-top: 1px solid #E1E1E1 !important;
    padding-top: 11px;
}

.h2-single-blog {
    width: 100%;
    overflow: hidden;
    border: 4px solid #fff;
    background:#fff;
    border-radius: 10px;
    box-shadow: 0 5px 11px 5px #ebebeb;
    margin-bottom: 30px;
    animation-iteration-count: 1;
    animation-duration: 3s !important;
    position:relative;
     transition: 0.3s ease-in all;
}
.card-work {
    width: 100%;
    overflow: hidden;
    height: 300px;
    border: 4px solid #fff;
    border-radius: 10px;
    box-shadow: 0 5px 11px 5px #ebebeb;
    margin-bottom: 30px;
    animation-iteration-count: 1;
    animation-duration: 3s !important;
    position:relative;
     transition: 0.3s ease-in all;
}

.card-work:hover .view-btn{
    bottom: 40px;
    transition: 0.3s ease-in all;
}
.view-btn:hover{
     text-decoration: none !important;
     color:#FFF !important;
}

.view-btn {
    width: 100%;
    position: absolute;
    background: #00b8ff;
    bottom: -45px;
    z-index: 9999;
    display: block;
    text-align: center;
    color: #fff;
    padding: 10px;
    text-decoration: none;
    transition: 0.3s ease-in all;
}




.card-work img{
    width: 100%;
    height: 100%;
    object-fit: cover;
}


.carousel-control-prev {
    left: -50px;
    background: #D6D6D6;
    width: 40px;
    height: 40px;
    border-radius: 100px;
    top:  calc(50% - 20px);
}
.name {
    font-size: 13px !important;
    font-weight: 300;
    font-style: italic;
}
.comment{
    margin: 0 auto;
    animation-name: pop-in;
    animation-duration: 1s;
  animation-iteration-count: infinite;
}



@keyframes pop-in {
    0%{
           
          transform: scale(.8);
          }
  
  
    50% {
         transform: scale(1);
       }
  
    100%{
           
          transform: scale(.8);
          }
}

.btm-bar a {
    background-color: #00b8ff;
    color: #fff !important;
    width: 100%;
    display: block;
    text-align: center;
    padding: 10px;
    font-size: 25px;
    text-decoration: none !important;
}
.carousel-control-next {
    right: -50px;
    background: #D6D6D6;
    width: 40px;
    height: 40px;
    border-radius: 100px;
    top:  calc(50% - 20px);
}
.carousel-item {
    padding: 20px;
}


.contact-head {
    color: #fff;
    font-size: 26px;
    font-weight: 700;
}
.ftr-txt {
    display: block;
    color: #fff;
    margin: 15px 0;
    text-decoration: none !important;
}

.ftr-txt:hover {

    color: #fff;

}




footer{
    background: #000;
}

@media (max-width: 1400.98px) {

}


@media (max-width: 1199.98px) {

    .ictabset-tab a {
    font-size: 15px !important;

}

}


@media (max-width: 991.98px) {

.tc.head {
    width: 100%;
    margin: 0 auto;
}

.phone{
  display: none;
}


}


@media (max-width: 767.98px) {
.ictabset-tab a {
    font-size: 18px !important;
    margin-bottom: 16px;
    padding: 14px;
    border-radius: 4px !important;
}
.menu-item-has-children:hover 
.sub-menu{
opacity:1;
pointer-events:auto;
transform:translateY(0);
position: relative;
 top: 0;
text-align:center;
display:block;
}

h1 {
    color: #071d50;
    font-weight: 800;
    font-size: 25px !important;
    width: 100%;
    text-align: center;
}

p {
    color: #757575;
    line-height: 30px;
    font-size: 14px;
    font-weight: 400;
    z-index: 88;
    position: relative;
    text-align: center;
    margin-top: 15px;
}
.typewriter {
    font-size: 20px !important;
    text-align: center;
}
.row.align-items-center {
    text-align: center;
}
.card-ser {
    text-align: center;
}
.typewriter span{
    font-size: 20px !important;
    text-align: center;
}

.icon-ser {
    height: 81px;
    width: 81px;
    display: block;
    background: url(../img/iconset02.svg);
        background-position-x: 0%;
    margin: 0 auto;
}
.btm-bar a {
    background-color: #00b8ff;
    color: #fff !important;
    width: 100%;
    display: block;
    text-align: center;
    padding: 10px;
    font-size: 15px;
    text-decoration: none !important;
}
  .wow{
        animation-name: none !important;
        visibility: visible !important;
    }

    .sec2 {
    background: #f4f4f4;
    padding: 50px 0 !important;
    overflow: hidden;
}

.sec3 {
    padding: 50px 0 !important;
    overflow: hidden;
}
.menu{
  display: none;
}
.banner {
    padding-top: 120px;
}
.logo {
    width: 120px;
    height: 100px;
    display: block;
    padding: 10px;
}
.social-wrap{
 display: none;
}
.inner-top{
  margin-top: 50px;
}
.form {
    padding: 40px;
    border-left: none;
}


.menubtn{
    display:block !important;
}
header li {
    list-style: none;
    display: inline-block;
    width: 100%;
    padding:10px 0;
}

.menu {
    height: 100vh;
    border-top: 1px solid #D1D1D1 !important;
    padding-top: 35px;
    overflow-y: scroll;
}
.ftrsocial{
    text-align:center;
}
.social{
    margin:0 auto;
}
.ftr-txt {
    display: block;
    color: #fff;
    margin: 15px 0;
    text-decoration: none !important;
    text-align: center;
}

.titletxt {
    background: #E1E1E1;
    padding: 15px;
    color: #fff;
    font-weight: 700;
    font-size: 25px;
    text-align: center;
}
	
	.menu-item-has-children:before {
    top: 18px;
    right: 45px;
}
}




@media (max-width: 575.98px) {

}

/* consulting */
.consulting{
    display: grid;
    place-items: center;
    min-height: 100vh;

}
.consulting h3, .consulting-2 h3{
        color: #00b8ff;
        font-size: 18px;
        font-weight: 500;
        letter-spacing: 8px;
        margin-bottom: 15px !important;
        text-transform: uppercase;
	overflow-wrap: anywhere;
}

.consulting-2 .container{
    background-color: #f4f4f4;
    display: grid;
    place-items: center;
    text-align: center;
    padding: 3rem;
}

p , .cybersicherheit ul li ,.cyberbedrohung ol li {
    color: #636363;
    line-height: 28px !important;
    font-size: 16px;
    font-weight: 300;
    z-index: 88;
    display: block;
    text-align: justify;
    text-justify: inter-word;
}
section{
    margin-bottom: 45px!important;
}
h1 {
    color: #071d50;
    font-weight: 500;
    text-transform: uppercase;
    overflow-wrap: anywhere;
}
strong{
    color: #3a3a3a;
    font-weight: 600;
}
.cybersicherheit{
    width: 100%;
    background: url(../img/Backgraund_Image_Netz_good\ .jpg) repeat center/contain;
    padding: 4rem 0;
}


.list-style li, 
.list-style li{
    list-style: none;
    margin-bottom: 12px;
    position: relative;
}
.list-style li::before ,
.list-style li::before{
    content: "";
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background-color: #89D4CA;
    margin-right: 12px;
    position: absolute;
    left: -30px;
    top: 10px;
}
.cybersicherheit img{
    width: 100%;
    display: block;
    margin: auto;
}
.cyberbedrohung h3,
.cyberattacks h3{
    font-weight: 600;
    font-size: 1.4rem;
    margin-bottom: 18px;
    overflow-wrap: anywhere;
}
.cyberbedrohung h4{
    font-weight: 600;
    font-size: 1.1rem;
    margin-bottom: 20px;
}

.cyberbedro-lft p{
    line-height: 1.8 !important;
}
.cyberbedrohung span{
    color: #308073;
    font-weight: 600;
}
.cyberbedrohung ol{
    list-style: none;
    counter-reset: li;
}
.cyberbedrohung ol li {
    counter-increment: li;
    margin-bottom: 12px;
}
.cyberbedrohung ol li::before {
    content: counter(li); 
    color: #3a3a3a;
    display: inline-block; width: 1em;
    margin-left: -1em;
    font-weight: 600;
}
.cyberattacks{
    background: url(../img/Backgraund_Image_Netz_good\ .jpg) no-repeat;
    background-position: bottom;
    background-size: contain;
    width:100%;
    padding: 30px 0;
}
.consulting-2 {
    margin: 20px 0;
}

.menu-item-has-children{
position: relative;
}

.sub-menu {
    position: absolute;
    top: 25px;
    left: 0;
    background: white;
    width: 300px;
    text-align:left;
    padding: 8px 14px;
    border-bottom: 3px solid #00b8ff;
    transform:translateY(-10px);
    opacity:0;
    pointer-events:none;
    transition:0.4s ease-in-out;
	box-shadow: 0px 10px 10px #efefef;
}

.sub-menu .menu-item-object-custom{
    background: white;
    width: 100%;
    padding:12px 0;
}

.menu-item-has-children:hover 
.sub-menu{
opacity:1;
pointer-events:auto;
transform:translateY(0);
}
.sub-menu li.menu-item-object-custom a{
color:#00b8ff;
font-weight:400;
}
.sub-menu li:hover{
color:#00b8ff;
}