@media only screen and (max-width:980px) and (min-width:320px) {
  nav.mobile-view,
  section {
    overflow:hidden
  }
  .nav-bar ul.menu li a,
  a#cross {
    color:#fff
  }
  .cta h3,
  h2 {
    line-height:30px
  }
  header ul.menu li {
    display:block!important;
    padding:15px 30px!important;
    text-align:left;
    transition:.25s
  }
  #menu-list {
    display:block
  }
  .mobile-screen {
    position:relative;
    display:block
  }
  .social-medias,
  a#cross {
    display:none
  }
  .mobile-screen #list-btn {
    display:block;
    color: #ffffff;
    position:absolute;
    top: -15px;
    right:10px;
    font-size: 18px;
    transition:.5s;
    -webkit-transition:.25s;
    z-index:999999999;
    background: #1d4687;
    padding: 2px 10px;
  }
  a#cross {
    position:fixed;
    top:35px;
    right:30px;
    font-size: 14px;
    z-index:9999999999;
    -webkit-transition:.5s;
    transition:.5s;
    animation:2s linear infinite heartBeat;
    background: #1e4787;
  }
  nav.mobile-view {
    background:#1c1c1c;
    position:fixed;
    height:100%;
    width:100%!important;
    left:150%;
    top:0;
    bottom:0;
    padding-top:70px;
    z-index:99911!important;
    overflow-y:scroll;
    display:none;
    transition:ease-In-Out .8s;
    -webkit-transition:ease-In-Out .8s
  }
  header {
    padding:0
  }
  header nav ul li.dropdown:hover .dropdown-menu {
    left:8px;
    top:38px;
    padding:10px 0
  }
  header nav ul li .dropdown-menu a {
    padding:7px 15px!important;
    font-size:14px!important;
    text-align:left
  }
  .submenu-list:hover .dropdown-menu-submenu {
    position:absolute;
    left:40%;
    top:30px;
    z-index:999!important;
    background:#195878
  }
  .nav-bar ul.menu li a.active {
    color:#fad011!important
  }
  .container {
    width:auto!important
  }
  h2 {
    font-size:28px
  }
  p {
    font-size:15px!important;
    line-height:22px!important
  }
  footer ul.menu li a {
    font-size: 14px;
    line-height:22px;
    text-align:center
  }
  h1 {
    letter-spacing:-1px;
    padding-top:10px;
    font-size:31px;
    line-height:33px;
    letter-spacing:0
  }
  .top-bar .menu li {
    display:inline-block!important;
    padding:2px 0!important
  }
  .top-bar ul.menu {
    display:block;
    text-align:center
  }
  footer ul.menu li.f-logo {
    position:relative;
    top:0;
    left:0;
    padding-bottom:19px
  }
  footer nav ul.menu {
    padding-bottom:15px
  }
  footer img.f-logo {
    max-width:70%
  }
  footer h3 {
    font-size:19px;
    padding:20px 0 5px
  }
  .copyright {
    text-align:center;
    margin:0;
    padding:20px 0
  }
  .main-banner {
    background-size:cover
  }
  .nav-bar a.logo img {
    max-width: 85%;
    height: auto;
  }
  h1 span {
    display:contents
  }
  .get-started-form form {
    width: 98%;
    margin:30px auto 0
  }
  .counter-area .count {
    width: 48%;
    /* justify-content:end; */
    /* flex-wrap: wrap; */
  }
  .counter-area {
    padding-bottom:0
  }
  .d-block {
    display:contents!important
  }
  .pub-img img {
    float:left;
    padding:30px 20px 0 0;
    animation:2s linear infinite swing;
    -webkit-animation:2s linear infinite swing;
    -moz-animation:2s linear infinite swing
  }
  .pub-img h4,
  .pub-img p {
    display:inline-block;
    width:73%
  }
  .pub-img {
    padding:20px 10px;
    margin-top:20px
  }
  .cta h3 {
    font-size:30px
  }
  .cta img {
    top:-30px;
    opacity:.4
  }
  .cta::after,
  .signup .input-control,
  .signup select#ser-select,
  .signup textarea.input-control.form-control {
    width:100%
  }
  .book-stone img {
    max-width:100%
  }
  .self-pub {
    margin:5px
  }
  .cta-get-started img {
    bottom:-40px;
    opacity:.3
  }
  .testmonial .text-right {
    text-align:center!important;
    padding-top:30px
  }
  .testmonial .self-pub [class*=col-md-6] {
    width:50%;
    padding-top:0!important
  }
  .faq-sec .card-header a {
    font-size:14px
  }
  .faq-sec .card-header {
    padding:12px 0 12px 10px
  }
  .faq-sec .card-header a.card-link.collapsed:after,
  .faq-sec .card-header a.card-link:after {
    right:7px
  }
  .testimonial-videos video {
    margin:20px 0
  }
  .borrow-tab ul.nav.nav-tabs li a {
    padding:8px 17px;
    font-size:14px
  }
  .web-tabs .tab-pane {
    height:250px
  }
}

@media only screen and (max-width:767px) {
    
    .nav-bar a.logo img {
        width: 160px !important;
    }
    .mobile-screen #list-btn {
       
        top: -40px;
    }
    .self-pub img {
        filter: invert(1) hue-rotate(325deg);
        width: 50px;
    }
    .borrow-tab ul.nav.nav-tabs li, .borrow-tab ul.nav.nav-tabs li a {
        width: 100%;
        flex: 0 0 100%;
        max-width: 100%;
        display: block;
        margin-bottom: 8px;
    }
    .copyright .col-md-4.text-right {
        text-align: center !important;
    }
    .counter-area .count .timer {
        font-size: 42px;
    }
    .counter-area .count {
      
        padding: 0px 20px;
    }

    
}

@media only screen and (max-width:480px) {
    .nav-bar a.logo img {
        width: 137px !important;
        height: auto !important;
    }
    .counter-area .count {
        width: 100%;
        padding: 0px 20px;
    }
    .pub-img h4, .pub-img p {
        display: inline-block;
        width: 80%;
    }
    .h4, h4 {
        font-size: 1.3rem;
    }
    body {
        position: relative !important;
    }
}