@charset "utf-8";

/* CSS Document */

@media (max-width: 400px) {

  h1, .h1 {

    font-size: 25px;

  }

  .page-404 {

    padding-top: 150px;

  }

  .work-slider .slick-dots li {

    margin: 0 2px;

  }

  .work-slider .slick-dots li button {

    width: 10px;

  }

  .hero-slider .slick-dots li {

    width: 5%;

  }

  .slick-prev:before, .slick-next:before {

    font-size: 20px;

  }

  .slick-next {

    right: 16px;

  }

  .content .icon-box i {

    margin: 0 40%;

    padding-right: 6px;

  }

  .content .row {

    display: inline-block;

  }

  #key .content {

    margin: 0 8px;

    clear: both;

  }

  #key .content .icon-box i {

    margin: 0 40%;

    padding-right: 6px;

  }

  #key .row {

    display: inline-block;

  }

}

@media (min-width: 1551px) and (max-width: 2300px) {

  .navigation {

        top: -530px !important;

/*    right: -170px;*/

      left: 0

  }

}



@media (min-width: 2561px) and (max-width: 3000px) {

  .navigation {

    top: -712px !important;

/*    right: -213px !important;*/

      left: 0

  }

}



@media (min-width: 1409px) and (max-width: 1550px) {

  .navigation {

    top: -406px !important;

/*    right: -109px !important;*/

  }

}



@media only screen and (min-width: 1216px) and (max-width: 1408px) {

    .navigation {

	position: relative;

	 top: 28px !important;

/*     right: -124px !important;*/

        left: 121px !important;

  }

  .btn-sm {

padding: 3px 19px !important;

    font-size: 15px !important;

    position: relative;

    top: -379px;

    right: 169px;

  }

  .openbtn {

	position: relative;

	top: -365px;

    right: 109px;

  }

    

    .key-points {

    display: flow;

    justify-content: left;

    align-items: center;

    align-items: flex-end;

    align-content: center !important;

}

}



@media only screen and (min-width: 1024px) and (max-width: 1215px) {

    .navigation {

	position: relative;

        top: 8px !important;

/*        right: -96px !important;*/

        left: 142px !important;

  }

  .btn-sm {

	padding: 3px 19px !important;

    font-size: 14px !important;

    position: relative;

    top: -321px;

    right: 197px;

  }

  .openbtn {

	position: relative;

	top: -304px;

    right: 136px;

  }

    #counter {

    text-align: center;

    display: flex;

    align-items: center;

    justify-content: center;

    /* background: #e6e6e7; */

    padding: 40px 0px;

    /* width: 100%; */

    flex-wrap: wrap;

    flex-direction: row;

}

    

    .key-points {

    display: flow;

    justify-content: left;

    align-items: center;

    align-items: flex-end;

    align-content: center !important;

}

    #counter .item span {

    color: #fff;

    margin-bottom: 5px;

    font-size: 40px;

    position: absolute;

    top: 26px;

    right: 420px !important;

}



}



/* For Desktop View */

@media only screen and (min-width: 960px) and (max-width: 1023px) {

    .navigation {

	position: relative;

	        top: 6px !important; 

/*        right: -25px !important;*/

        left: -25px !important;

  }

  .btn-sm {

	padding: 3px 19px !important;

    font-size: 13px !important;

    position: relative;

    top: -250px;

    right: 88px;

  }

  .openbtn {

	position: relative;

	top: -284px;

    right: -34px;

  }

    

    #counter {

    text-align: center;

    display: flex;

    align-items: center;

    justify-content: center;

    /* background: #e6e6e7; */

    padding: 40px 0px;

    /* width: 100%; */

    flex-wrap: wrap;

    flex-direction: row;

}

    

    #counter .item span {

    color: #fff;

    margin-bottom: 5px;

    font-size: 40px;

    position: absolute;

    top: 26px;

    right: 310px !important;

}

    

    .key-points {

    display: flow;

    justify-content: left;

    align-items: center;

    align-items: flex-end;

    align-content: center !important;

}

}

 

/* For Tablet View */

@media screen and (min-width: 768px) and (max-width: 959px) {

    .navigation {

	position: relative;

	        top: -161px !important;

/*        right: -126px !important;*/

        left: 0px !important;



  }

  .btn-sm {

	padding: 3px 19px !important;

	font-size: 14px !important;

    position: relative;

    top: -110px;

    right: 389px;

  }

	

.login-btn {

    margin-top: -45px;

}

	

.openbtn {

    position: relative;

    top: -47px;

    right: -134px;

}

  .right_bottun {

    margin: -128px 0 0 -31px !important;

  }

    .key-points {

    display: flow;

    justify-content: left;

    align-items: center;

    align-items: flex-end;

    align-content: center !important;

}

    #counter {

    text-align: center;

    display: flow !important;

    align-items: center;

    justify-content: center;

    padding: 40px 0px;

    

}

    

    #counter .item span {

    color: #fff;

    margin-bottom: 5px;

    font-size: 40px;

    position: absolute;

    top: 26px;

    right: 320px !important;

}

}

 

 

@media screen and (min-width: 641px) and (max-width: 767px) {

    .navigation {

	position: relative;

	top: -163px !important;

/*        right: -111px !important;*/

        left: 79px !important;

  }

  .btn-sm {

    padding: 3px 19px !important;

    font-size: 13px !important;

    position: relative;

	top: -76px;

    right: 367px;

  }

  .openbtn {

	position: relative;

	top: -28px;

    right: 78px;

  }

        .u-section-4 .u-text-2 {

        width: 469px !important;

    }

    

    #counter {

    text-align: center;

    display: flow !important;

    padding: 40px 0px;

   

}

    

    #counter .item span {

    color: #fff;

    margin-bottom: 5px;

    font-size: 40px;

    position: absolute;

    top: 26px;

    right: 231px !important;

}



}



/* For Mobile Landscape View */

@media screen and (min-width: 577px) and (max-width: 640px) {

    .navigation {

	position: relative;

        top: -157px !important;

/*        right: -105px !important;*/

        left: 80px !important;

  }

  .btn-sm {

    padding: 3px 19px !important;

    font-size: 13px !important;

    position: relative;

    top: -47px;

    right: 366px;

      

  }

  .openbtn {

	position: relative;

    top: -9px;

    right: 78px;

  }

    

    #counter {

    text-align: center;

    display: flow !important;

    align-items: center;

    justify-content: center;

    /* background: #e6e6e7; */

    padding: 40px 0px;

    /* width: 100%; */

}



            #counter .item span {

    color: #fff;

    margin-bottom: 5px;

    font-size: 40px;

    position: absolute;

    top: 26px;

    right: 230px !important;

}

    

        .u-section-4 .u-text-2 {

        width: 469px !important;

    }

    

}

 

@media only screen and (min-width: 481px) and (max-width: 576px) {

    .navigation {

	position: relative;

	        top: -108px !important;

/*        right: -258px !important;*/

        left: -122px !important;

  }

.btn-sm {

padding: 3px 19px !important;

    font-size: 10px !important;

    position: relative;

    top: -79px;

    right: 27px;

}

  .openbtn {

position: relative;

    top: -26px;

    right: -129px;

  }

        #counter {

    text-align: center;

    display: flow !important;

    align-items: center;

    justify-content: center;

    /* background: #e6e6e7; */

    padding: 40px 0px;

    /* width: 100%; */

}

        #counter .item span {

    color: #fff;

    margin-bottom: 5px;

    font-size: 40px;

    position: absolute;

    top: 26px;

    right: 127px !important;

}

	

}

@media screen and (min-width: 280px) and (max-width: 319px) {

.navigation {

    top: -76px !important;

    /* right: -213px !important; */

    left: 44px !important;

    display: flex !important;

    justify-content: end;

}

}

@media screen and (min-width: 320px) and (max-width: 480px) {

/*

    .navigation {

display: none;

  }

*/

	.navigation {

top: -176px !important;

}

.btn-sm {

	padding: 3px 19px !important;

    font-size: 10px !important;

    position: relative;

    top: -33px;

    right: 116px;

}

.openbtn {

    position: relative;

    top: 89px !important;

    right: -67px !important;

}

.right_bottun {

  margin: 9px 0 0 9px !important;

}

    p.u-text.u-text-2 {

            text-align: justify;

        word-break: break-all;

        padding-left: 20px;

        font-size: 17px;

        margin: 0;

        padding-top: 21px;

}

    .c-head{

        font-size: 29px !important;

    }

    #counter {

    text-align: center;

    display: flow !important;

    align-items: center;

    justify-content: center;

    /* background: #e6e6e7; */

    padding: 40px 0px;

    /* width: 100%; */

}

    #counter .item span {

    color: #fff;

    margin-bottom: 5px;

    font-size: 40px;

    position: absolute;

    top: 26px;

    right: 127px !important;

}

    .col-md-5.key-points {

    margin-bottom: 30px;

}

    

    header {

    background: #002833;

    height: 97px !important;

}

    .contact{

        

        text-align: center !important;

    }

    

    #counter .item {

    background-image: url("extra/images/counter-img.png");

    background-position: top center;

    background-origin: padding-box;

    padding: 65px 7px;

    margin: 10px;

    text-align: center;

    position: relative;

    background-repeat: no-repeat;

     width: 88% !important; 

}



}







@media (max-width: 576px) {

  .top-header ul {

    text-align: center;

  }

  .top-header ul li {

    margin: 10px 0;

  }

  .top-header ul li a {

    border: 0;

  }

  .hero-slider .prevArrow, .hero-slider .nextArrow {

    display: none;

  }

  .section {

    padding: 60px 0;

  }

  .page-404 {

    padding-top: 250px;

  }

  .slick-prev:before, .slick-next:before {

    font-size: 20px;

  }

  .slick-next {

    right: 16px;

  }

  .content .icon-box i {

    padding: 0 12px 15px;

  }

  .content .row {

    display: inline-block;

  }

  #key .content {

    margin: 0 8px;

    clear: both;

  }

  #key .content .icon-box i {

    padding-right: 6px;

  }

  #key .row {

    display: inline-block;

  }

  .col-sm-5 {

    max-width: 100%;

  }

  .col-sm-6 {

    max-width: 100%;

  }

  h1 {

    font-size: 30px;

  }

}

@media (max-width: 767px) {

  .page-404 {

    padding: 450px 0 50px;

  }

  .hero-slider .slick-dots li a i {

    margin: 0;

  }

  .hero-slider .slick-dots li a span {

    display: none;

  }

  .content .icon-box i {

    padding: 0 12px 15px;

  }

  .content .row {

    display: inline-block;

  }

  #key .content {

    margin: 0 8px;

    clear: both;

  }

  #key .content .icon-box i {

    padding-right: 6px;

  }

  #key .row {

    display: inline-block;

  }

  .col-sm-5 {

    max-width: 100%;

  }

  .col-sm-6 {

    max-width: 100%;

  }

  h1 {

    font-size: 30px;

  }

}

@media (max-width: 991px) {

  .navigation .navbar-brand {

    position: relative;

    height: unset;

    width: unset;

    box-shadow: none;

    top: 24px;

    background: none;

  }

  .navigation .navbar-brand img {

    height: 50px;

    width: auto;

  }

  .navigation .navbar .nav-item {

    padding: 0;

  }

  .navigation .navbar .nav-item .nav-link {

    padding: 15px 0;

    font-size: 14px;

    text-align: center;

  }

  .navigation .navbar .nav-item:last-child {

    padding: 0;

    margin-bottom: 20px;

  }

  .navigation .navbar .dropdown-menu {

    display: none;

    opacity: 1;

    visibility: visible;

    -webkit-transform: scaleY(1);

    transform: scaleY(1);

    -webkit-transform-origin: unset;

    transform-origin: unset;

  }

  .navigation .navbar .dropdown-menu.show {

    display: block;

  }

  .navigation .navbar .dropdown-item {

    text-align: center;

  }

  .navigation .navbar .dropdown-item::before {

    display: none;

  }

  .hero-slider .slick-dots li a i {

    font-size: 20px;

    margin-right: 5px;

  }

  .hero-slider .slick-dots li a span {

    font-size: 15px;

  }

  .clients {

    background-size: cover !important;

    background-position: center center;

    text-align: center;

  }

  .mb-md-50 {

    margin-bottom: 50px;

  }

  .content .icon-box i {

    padding: 0 6px 15px;

  }

  #key .row {

    display: inline-block;

  }

  .col-sm-6 {

    max-width: 100%;

  }

  h1 {

    font-size: 40px;

  }

}

@media (max-width: 1199px) {

  .pb-xl-200-lg-100 {

    padding-bottom: 100px;

  }

  .mb-xl-150-lg-100 {

    margin-bottom: 100px;

  }

  .navigation .navbar .nav-item .nav-link {

    font-size: 12px;

    padding: 15px 6px;

  }

}

/*--------------------------------------------------------------



# Inner page



--------------------------------------------------------------*/

@media (max-width: 576px) {

  .breadcrumb .breadcrumb_tittle h2 {

    font-size: 35px;

  }

  .breadcrumb .breadcrumb_content {

    float: left;

    text-align: left !important;

  }

  .about_part .about_part_text p {

    margin-bottom: 10px;

  }

}

@media only screen and (min-width: 576px) and (max-width: 767px) {

  .breadcrumb .breadcrumb_tittle h2 {

    font-size: 35px;

  }

  .about_part .about_part_text p {

    margin-bottom: 20px;

  }

}

@media only screen and (min-width: 768px) and (max-width: 991px) {

  .breadcrumb .breadcrumb_tittle h2 {

    font-size: 40px;

  }

  .about_part .about_part_text p {

    margin-bottom: 20px;

  }

}

@media (max-width: 991px) {

  .about_part {

    margin-top: 0;

    background-image: none;

    padding: 70px 0 0;

  }

  .about_part .about_part_text {

    padding-left: 0;

  }

  .about_part .about_part_text h2 {

    font-size: 25px;

    margin-bottom: 10px;

    line-height: 35px;

    margin-top: 15px;

  }

}

@media only screen and (min-width: 992px) and (max-width: 1200px) {

  .about_part {

    margin-top: 80px;

    background-image: none;

  }

  .about_part .about_part_text {

    padding-left: 0;

  }

  .about_part .about_part_text h2 {

    font-size: 28px;

    margin-bottom: 20px;

    line-height: 40px;

  }

}

/* For 1366 Resolution */

@media only screen and (min-width: 1030px) and (max-width: 1366px) {

  .img-responsive {

    display: none !important;

  }

  .img-responsive.mobile {

    display: block !important;

  }

    .navigation {

        top: 40px !important;

        right: -213px !important;

        left: -45px !important;

        display: flex !important;

        justify-content: end;

    }

	a.login-btn {

    margin-top: -302px;

}

	a.btn.btn-danger.btn-sm.register-btn {

    position: absolute;

    right: 44px;

    top: -295px;

}

}

@media only screen and (min-width: 990px) and (max-width: 1366px) {

  .right_bottun {

    margin-left: 80px !important;

  }

    .navigation {

        top: -62px !important;

        right: -213px !important;

        left: -45px !important;

        display: flex !important;

        justify-content: end;

    }

	a.login-btn {

    margin-top: -302px;

}

.register-btn {

    position: absolute;

    right: 83px;

    top: -295px;

}

	a.login-btn {

    margin-top: -272px;

}

/*

	a.login-btn {

    margin-top: -300px;

    margin-right: -12px;

}

*/

/*

	.openbtn {

    position: relative;

    top: -300px;

    right: -2px;

}

*/

 a.login-btn {

    margin-top: -311px;

    margin-right: -12px;

}

 .openbtn {

    position: relative;

    top: -310px;

    right: 4px;

}

 .logout {

    position: absolute;

    top: 79px;

    right: -82px;

}

/*
	.logout-btn {

    position: absolute;

    top: -301px !important;

    right: 64px !important;

}
*/

}





@media (min-width: 1081px) and (max-width: 1299px) {

 

#ourclients .clients-wrap ul li {

    display: block;

    float: left;

    position: relative;

    width: 280px;

    height: 100px;

    line-height: 100px;

    text-align: center;

}

	#ourclients .clients-wrap {

  display: block;

  width: 100%;

  margin: 0 auto;

  overflow: hidden;

}

}