.clearfix:after {
  content: '';
  display: block;
  clear: both;
}

.ellipsis {
  white-space: nowrap;
  /* 1 */
  text-overflow: ellipsis;
  /* 2 */
  overflow: hidden;
}

@media (max-width: 1600px) {
  body.boxed-v #wrapper {
    max-width: 95%;
  }
}

@media (max-width: 1500px) {
  body.boxed-v #wrapper {
    max-width: 100%;
  }
}

@media (min-width: 1200px) {
  #header .nav-opener {
    display: none;
  }
}

@media (max-width: 1199px) {
  #header .nav-opener {
    padding: 17px 6px 0 0;
  }
  #header.fixed-position #nav {
    padding: 15px 0 35px;
  }
  #nav {
    position: absolute;
    left: 0;
    top: 100%;
    right: 0;
    text-align: center;
    padding: 15px 0;
    opacity: 0;
    visibility: hidden;
    transition: all 0.25s linear;
  }
  #nav ul a:before {
    top: 30px;
  }
  #nav .drop-down {
    top: 30px;
    text-align: left;
  }
  .nav-active #nav {
    opacity: 1;
    visibility: visible;
  }
  .service-list .txt-holder {
    width: 85%;
  }
  .btn2 {
    font-size: 13px;
    padding: 14px 16px 18px;
    margin: 0 0 0 9px;
  }
  .btn2 .fa {
    font-size: 30px;
    margin: 0 10px 0 0;
  }
  .service-sec .service .txt-holder {
    width: 77%;
  }
  .blog-sec .blog-holder .blog {
    margin: 0 0 0 21px;
  }
  .contact-sec .contact-form {
    padding: 0;
  }
  #content .holder .blog {
    margin: 0 0 27px 22px;
  }
}

@media (max-width: 1023px) {
  .pad-top-sm {
    padding-top: 30px !important;
  }
  .pad-top-lg {
    padding-top: 60px !important;
  }
  .pad-bottom-sm {
    padding-bottom: 30px !important;
  }
  .mar-bottom-sm {
    margin-bottom: 30px !important;
  }
  .mar-bottom-lg {
    margin-bottom: 60px !important;
  }
  .pad-bottom-md {
    padding-bottom: 30px !important;
  }
  .pad-bottom-lg {
    padding-bottom: 60px !important;
  }
  #header.sticky #nav {
    padding: 20px;
  }
  #nav {
    text-align: left;
    background: #444;
    padding: 10px;
  }
  #nav ul li {
    display: block;
    margin: 0 0 15px;
  }
  #nav ul li:first-child {
    margin: 0 0 15px;
  }
  #nav ul li:hover.drop {
    margin-bottom: 0;
    padding-bottom: 0;
  }
  #nav ul li:hover .drop-down {
    display: block;
  }
  #nav ul a:before {
    display: none;
  }
  #nav .drop-down {
    position: static;
    display: none;
    opacity: 1;
    visibility: visible;
    margin: 10px 0;
  }
  .main-slider.slider3 .slide {
    min-height: calc(350px - 102px);
  }
  .main-slider.slider3 .slide h1 {
    font-size: 35px;
  }
  .main-slider .slide {
    min-height: calc(700px - 102px);
  }
  .main-slider .slide h1 {
    font-size: 36px;
    line-height: 40px;
    max-width: 570px;
  }
  .header br {
    display: none;
  }
  .heading {
    font-size: 33px;
    line-height: 37px;
  }
  .main-holder .header {
    margin: 0 0 30px;
  }
  .main-holder .header.header2 {
    margin: 0 0 30px;
  }
  .main-holder .img-holder {
    padding: 4px 44px 0 0;
  }
  .main-holder .img-holder.img2 {
    width: 220px;
  }
  .intro-sec .header {
    margin: 0 0 40px;
  }
  .fact-sec .img-holder {
    max-width: 650px;
    padding: 30px 59px 32px 58px;
    background-size: 100% auto;
  }
  .fact-sec .header {
    margin: 0 0 40px;
  }
  .fact-sec .counter-holder {
    margin: -250px 0 0;
    min-height: 520px;
    padding: 277px 0 0;
  }
  .fact-sec .counter-holder .icon {
    font-size: 60px;
    line-height: 62px;
  }
  .fact-sec .counter-holder .counter {
    font-size: 50px;
    line-height: 52px;
  }
  .btn2 {
    margin: 0;
  }
  .btn2:first-child {
    margin: 0 0 15px;
  }
  .video-sec .display-flex {
    display: block;
  }
  .video-sec .header {
    margin: 0 0 40px;
  }
  .video-sec .btn-holder {
    margin: 0 0 40px;
  }
  .video-sec .btn2 {
    margin: 0 0 0 20px;
  }
  .video-sec .btn2:first-child {
    margin: 0;
  }
  .video-sec img {
    width: 100%;
  }
  .video-sec .video {
    padding: 0;
  }
  .service-sec .service .icon {
    margin: 0 0 20px;
  }
  .service-sec .service .txt-holder {
    width: 100%;
    padding: 0;
  }
  .screenshot-sec .header {
    margin: 0 0 40px;
  }
  .price-sec .header {
    margin: 0 0 40px;
  }
  .price-holder .price-heading {
    padding: 20px;
  }
  .price-holder .price-heading strong {
    font-size: 23px;
  }
  .price-holder .price-heading .txt {
    font-size: 11px;
  }
  .price-holder li {
    padding: 0 0 0 18px;
  }
  .testimonail-sec .header {
    margin: 0 0 40px;
  }
  .testimonail-sec .testimonail {
    padding: 30px 10px;
  }
  .testimonail-sec .testimonail .img-holder {
    width: 17%;
  }
  .testimonail-sec .testimonail .img-holder .icon {
    width: 30px;
    height: 30px;
    bottom: -12px;
    left: -5px;
    padding: 8px 0;
  }
  .testimonail-sec .testimonail .txt-holder {
    padding: 0 0 0 16px;
    width: 83%;
  }
  .blog-sec .header {
    margin: 0 0 40px;
  }
  .blog-sec.style2 .blog .img-holder {
    margin: 0 -30px 25px;
  }
  .blog-sec.style3 #content {
    padding: 0;
  }
  .blog-sec .blog-holder {
    margin: 0;
    padding: 0;
  }
  .blog-sec .blog-holder .blog {
    width: 48.2%;
    padding: 0 16px 24px 13px;
  }
  .blog-sec .pagination {
    margin: 0 0 30px;
  }
  .blog {
    padding: 0 16px 28px;
  }
  .blog .img-holder {
    margin: 0 -16px 25px;
  }
  .app-sec {
    min-height: 450px;
  }
  .app-sec .btn2 {
    margin: 0 0 0 10px;
  }
  .app-sec .btn2:first-child {
    margin: 0;
  }
  .contact-sec {
    min-height: 750px;
  }
  .contact-sec .contact {
    padding: 54px 20px 57px;
    margin: 0;
  }
  #content {
    width: 100%;
    padding: 0;
  }
  #content .holder .blog .img-holder {
    margin: 0 -31px 25px;
  }
  #sidebar {
    width: 100%;
  }
  .widget {
    margin: 0 0 30px;
  }
  .widget .post-list .img-holder {
    width: 11%;
  }
  .comments-block .commment-onelevel {
    padding: 0 0 0 50px;
  }
}

@media (max-width: 767px) {
  .pad-top-lg {
    padding-top: 40px !important;
  }
  .mar-bottom-lg {
    margin-bottom: 0 !important;
  }
  .pad-bottom-lg {
    padding-bottom: 40px !important;
  }
  .pad-bottom-md {
    padding-bottom: 0 !important;
  }
  .bg-full {
    background-attachment: scroll;
  }
  #header {
    padding: 10px 20px;
  }
  #header.sticky {
    padding: 10px 20px;
  }
  #header .align-right .drop-down {
    top: 53px;
  }
  .sidenav {
    width: 300px;
    padding: 40px 29px;
  }
  .sidenav .logo-img {
    margin: 0 auto 20px;
  }
  .sidenav p {
    margin: 0 0 15px;
  }
  .sidenav strong {
    margin: 0 0 10px;
  }
  .sidenav .socail-network {
    display: none;
  }
  .banner h1 {
    font-size: 150px;
    line-height: 155px;
  }
  .main-slider.slider2 .slide {
    min-height: calc(600px - 74px);
  }
  .main-slider.slider3 .slide {
    text-align: left;
    min-height: calc(360px - 74px);
  }
  .main-slider.slider3 .slide h1 {
    float: none;
    margin: 0 0 10px;
  }
  .main-slider .slide {
    min-height: calc(480px - 74px);
  }
  .main-slider .slide h1 {
    font-size: 29px;
    max-width: 290px;
  }
  .main-slider .slide .txt {
    line-height: 15px;
  }
  .main-slider .slide .img {
    width: 80px;
    margin: 0 auto 30px;
  }
  .main-slider .slick-arrow {
    display: none !important;
  }
  .breadcrumbs {
    text-align: left;
  }
  img {
    width: 100%;
  }
  .heading {
    font-size: 28px;
    line-height: 33px;
  }
  .intro-sec .img-holder {
    margin: 0 0 30px;
  }
  .intro-sec .header {
    margin: 0 0 30px;
  }
  .service-list li {
    width: 100%;
    padding: 0;
    margin: 0 0 40px;
    float: none;
  }
  .service-list .txt-holder {
    width: 77%;
  }
  .main-holder .img-holder {
    width: 270px;
    margin: 0 auto 30px;
    padding: 0;
  }
  .main-holder .img-holder.fixed-position {
    position: static !important;
  }
  .fact-sec .img-holder {
    max-width: 290px;
    padding: 14px 26px 12px 26px;
  }
  .fact-sec .counter-holder {
    margin: -110px 0 0;
    padding: 130px 0 0;
  }
  .fact-sec .header {
    margin: 0 0 30px;
  }
  .magnify .magnify-lens {
    width: 50px;
    height: 50px;
  }
  .display-flex {
    display: block;
  }
  .video-sec .header {
    margin: 0 0 30px;
  }
  .video-sec .video .play {
    width: 50px;
    height: 50px;
    padding: 17px 5px;
  }
  .video-sec .btn-holder {
    margin: 0;
  }
  .video-sec .btn2 {
    margin: 0 0 30px;
  }
  .video-sec .btn2:first-child {
    margin: 0 0 30px;
  }
  .screenshot-sec .header {
    margin: 0 0 30px;
  }
  .screenshot-sec .screen-slider .slide {
    margin: 0;
  }
  .screenshot-sec .screen-slider .slide img {
    width: 100%;
  }
  .price-sec .header {
    margin: 0 0 30px;
  }
  .testimonail-sec .header {
    margin: 0 0 30px;
  }
  .blog-detail {
    padding: 0 20px;
  }
  .blog-detail .img-holder {
    margin: 0 -20px 20px;
  }
  .blog-detail h3 {
    font-size: 20px;
  }
  .blog-detail blockquote {
    font-size: 14px;
  }
  .blog-sec .header {
    margin: 0 0 30px;
  }
  .blog-sec .blog-holder .blog {
    width: 100%;
    float: none;
    margin: 0;
  }
  .blog-sec .blog-holder .blog:first-child {
    margin: 0 0 30px;
  }
  .abt-holder .block {
    padding: 20px;
  }
  .abt-holder .block .img-holder {
    width: 23%;
  }
  .abt-holder .block .txt-holder {
    padding: 0 0 0 18px;
    width: 77%;
  }
  .app-sec .header {
    margin: 0 0 30px;
  }
  .app-sec .btn2 {
    margin: 0;
  }
  .app-sec .btn2:first-child {
    margin: 0 0 15px;
  }
  .client-sec .line li {
    width: 120px;
    padding: 0 20px;
  }
  .newsletter-sec .newsletter-form {
    padding: 10px;
  }
  .newsletter-sec .newsletter-form .form-control {
    width: 69%;
  }
  .newsletter-sec .newsletter-form .btn {
    width: 31%;
  }
  .newsletter-sec .txt {
    margin: 0 0 30px;
  }
  #footer p {
    margin: 0 0 20px;
  }
  .socail-network {
    text-align: left;
  }
  .socail-network li {
    margin: 0 15px 0 0;
  }
  .newsletter-block {
    width: 100%;
  }
  .newsletter-block .holder {
    padding: 20px;
  }
  .newsletter-block .newsletter-form .form-control {
    width: 63%;
  }
  .newsletter-block .newsletter-form .btn {
    width: 37%;
  }
  #content .holder .blog {
    width: 100%;
    float: none;
    margin: 0 0 27px;
  }
  .widget .post-list .img-holder {
    width: 20%;
  }
  .comments-block .commment-area {
    padding: 20px 20px 1px;
  }
  .comments-block .commment-area .heading3 {
    float: none;
    margin: 0 0 10px;
  }
  .comments-block .commment-area .comment-nav {
    float: none;
  }
  .comments-block .commment-area .comment-nav li {
    margin: 0 5px 0 0;
  }
  .comments-block .commment-area .img {
    width: 21%;
  }
  .comments-block .commment-area .txt-holder {
    width: 79%;
    padding: 10px 0 0 20px;
  }
  .comments-block .commment-onelevel {
    padding: 0 0 0 20px;
  }
  .comments-block .commment-onelevel .commment-area .img {
    width: 20%;
  }
  .comments-block .commment-onelevel .commment-area .txt-holder {
    width: 80%;
  }
  .comments-form .leave-form {
    padding: 20px 20px 0;
  }
}