/*����ֻ����ʾ���롣Դ����������: http://www.bootstrapmb.com/item/7108(���˵��������ʾ��ῴ��,���ص�Դ����û��)*//*============================================================================== * Template Name: Creatopo- Agency and Business HTML5 Template * Author: ixtheme - (https://themeforest.net/user/theuxlab) * Description: Agency and Business HTML5 Template * Version: 1.0 * Copyright 2019 theuxlab ==============================================================================*//* Extra large devices (large desktops, 1200px and up) */@media (max-width: 1199px) {  body {    font-size: 16px;  }  header {    padding: 25px 0;  }  .navigation-close,  .navigation-show {    display: block;  }  .navigation {    text-align: left;    position: fixed;    width: 100%;    max-width: 300px;    right: -300px;    background-color: #0c0a15;    background-image: url(../img/hero-home/hero-bg.png);    background-size: cover;    background-repeat: no-repeat;    background-position: right;    top: 0;    height: 100%;    padding-top: 30px;    overflow-y: auto;    z-index: 9999;    box-shadow: 0 0 35px #7f838e;    transition: 0.3s;    -webkit-transition: 0.3s;    -moz-transition: 0.3s;    -ms-transition: 0.3s;    -o-transition: 0.3s;    opacity: 0;    visibility: hidden;  }  .navigation.navigation_show {    right: 0;    opacity: 1;    visibility: visible;  }  .navigation ul li {    display: block;    font-size: 17px;    padding: 10px 15px;    color: #fff;  }  .dropWrap {    position: static;    opacity: 1;    visibility: visible;    margin-top: 0;    -webkit-transition-delay: 0s;    transition-delay: 0s;    width: auto;    padding: 0;    margin-top: 7px;    margin-bottom: -10px;    border-radius: 0;    -webkit-border-radius: 0;    -moz-border-radius: 0;    -ms-border-radius: 0;    -o-border-radius: 0;    transition: 0s;    -webkit-transition: 0s;    -moz-transition: 0s;    -ms-transition: 0s;    -o-transition: 0s;    display: none;  }  .dropToggle:hover .dropWrap {    margin-top: 7px;    opacity: 1;  }  .dropToggle i {    font-size: 15px;    position: absolute;    top: 15px;    left: auto;    right: 15px;    transition: 0.3s;    -webkit-transition: 0.3s;    -moz-transition: 0.3s;    -ms-transition: 0.3s;    -o-transition: 0.3s;    display: block;  }  .dropToggle.show i {    transform: rotateX(180deg);    -webkit-transform: rotateX(180deg);    -moz-transform: rotateX(180deg);    -ms-transform: rotateX(180deg);    -o-transform: rotateX(180deg);  }  .navigation ul li:last-child {    margin-bottom: 50px;  }  .dropWrap li:last-child {    margin-bottom: 0 !important;  }  .hero-info h2 {    font-size: 38px;  }  .hero-info p {    line-height: 28px;    margin-bottom: 40px;  }  .creatopo-btn {    height: 45px;    line-height: 45px;    padding: 0 25px;    font-size: 15px;  }  .wrapper-header h3 {    font-size: 32px;    margin-top: 20px;    margin-bottom: 35px;  }  .wrapper-info p.mb-65 {    margin-bottom: 45px !important;  }  .service-item {    padding: 35px 45px;  }  .seervice-info h4 {    font-size: 20px;    margin-bottom: 18px;  }  .seervice-info a {    margin-top: 20px;  }  .service-icon {    left: 45px;    top: 35px;  }  .award-item {    padding: 35px 30px;  }  .count-text {    font-size: 28px;    margin-top: 18px;    margin-bottom: 10px;  }  .client-img {    position: static;  }  .client-item {    padding: 40px 24px;  }  .clients-bio {    margin-left: 0;    margin-top: 30px;  }  .clients-text {    margin-top: 20px;    margin-bottom: 20px;  }  .whycu-item p {    line-height: 30px;  }  .wrap-gap.pr-70 {    padding-right: 50px !important;  }  .wrap-gap.pl-70 {    padding-left: 50px !important;  }  .blog-info {    padding: 35px;  }  .blog-title {    line-height: 1.5;  }  .blog-item-text {    margin-top: 20px;    line-height: 1.7;  }  .blog-info .more {    margin-top: 20px;  }  .footer-about p {    font-size: 16px;    line-height: 32px;    margin-bottom: 30px;  }  .footer-about .logo {    width: 150px;    margin-bottom: 30px;  }  .footer-header {    font-size: 20px;  }  .footer-links li {    font-size: 16px;    margin-bottom: 10px;  }  .footer-img-group img {    height: 60px;    width: 60px;  }  .whycu-wrapper::after {    height: 80%;    background-size: 400px;  }  .testimonials-carousel-2 .client-img {    height: 70px !important;    width: 70px !important;  }  .testimonials-wrapper-2 .clients-bio {    margin-left: 0 !important;    margin-top: 25px;  }  .pricing-tabs.nav-tabs .nav-link {    height: 45px;    line-height: 45px;    width: 120px;  }  .service-carousel-bullets, .blog-carousel-bullets {    margin-bottom: 40px;  }  .wrapper-header p {    margin-bottom: 20px;  }}/* Large devices (desktops, 991px and down) */@media (max-width: 991px) {  .hero-wrapper,  .wrapper {    padding: 100px 0;  }  .hero-info h2 {    line-height: 50px;  }  .hero-info h2 span {    line-height: 71px;  }  .wrapper-header h3 {    font-size: 28px;    line-height: 1.5;    margin-bottom: 30px;  }  .wrapper-header p {    margin-bottom: 0;  }  .wrap-gap.pr-70 {    padding-right: 0 !important;  }  .wrap-gap.pl-70 {    padding-left: 0 !important;  }  .wrapper-info p {    line-height: 28px;  }  .wrapper-info p.mb-65 {    margin-bottom: 25px !important;  }  .wrapper-info p.mb-25 {    margin-bottom: 15px !important;  }  .services-wrapper::after {    height: 80%;    background-position: right bottom;  }  .services-wrapper .wrapper-info {    margin-bottom: 50px;  }  .wrapper.award-wrapper {    padding-bottom: 70px;  }  .award-item {    margin-bottom: 30px;  }  .footer-about {    margin-bottom: 50px;  }  .footer-wrapper::after {    display: none;  }  .hero-info h2 {    line-height: 30px;    font-size: 32px;  }  .blog-carousel-bullets,  .service-carousel-bullets {    text-align: left;    margin-bottom: 30px;  }  .testimonials-wrapper-2 .client-item {    padding: 40px 30px;  }  .footer-wrapper-2 {    padding-top: 100px;  }  .contact-form .input-field {    height: 50px;  }  .contact-form textarea.input-field {    padding: 20px;    margin-bottom: 45px;  }  .breadcrumb-wrapper {    background-position: left;  }  .pricing-wrapper::after {    display: none;  }  .case-study-sidebar {    margin-bottom: 50px;  }  .case-study-item-info p {    font-size: 16px;    margin-top: 20px;  }  .case-study-item-info a {    margin-top: 25px;  }  .case-study-sidebar h2 {    font-size: 28px;    font-weight: 600;  }  .blog-sidebar {    margin-top: 70px;  }  .pricing-tabs {    margin-bottom: 40px;  }   .about-img {    margin-bottom: 50px;  }  .about-img.top-gap {    margin-top: 50px;    margin-bottom: 0;  }  .whycu-img,  .video-warp-img,  .contact-img {    margin-bottom: 50px;  }}/* Medium devices (tablets, 768px and down) */@media (max-width: 767px) {  .whycu-wrapper::after {    height: 40%;    background-size: 300px;  }  .hero-img,  .footer-header {    margin-top: 50px;  }  .whycu-item img {    width: 45px;    height: 45px;  }  .case-study-img.mt-0 {    margin-top: 50px !important;  }  .pricing-item {    padding: 40px 30px;    margin-top: 30px;  }  .pricing-item h3 {    font-size: 34px;    margin-bottom: 30px;  }  .case-study-item-img {    margin-bottom: 35px;  }  .wrap-gap.pr70 .blog-post-img {    margin-bottom: 35px;  }  .blog-post-wrapper .border-wrap .social {    text-align: left;    margin-top: 12px;  }  .person-bio p {    margin-top: 15px;  }  .blog-post-comment-heading {    margin-bottom: 40px;  }  .blog-sidebar form input {    height: 60px;    width: calc(100% - 60px);  }  .blog-sidebar form button {    height: 60px;    width: 60px;  }  .blog-item img {    width: 100%;  }  .team-info h4 {    font-size: 21px;    margin-bottom: 10px;  }  .blog-post-title {    margin-top: 40px;  }  .blog-post-info {    margin-bottom: 30px;  }  .blog-post-text.mb-40,  .row.align-items-center.mb-40 {    margin-bottom: 30px !important;  }  .img-group-item {    width: auto;  }  .case-study-item-pop {    margin-top: 10px;  }  .case-study-item-pop h4 {    font-weight: 500;  }  .case-study-item-img img {    height: 300px;    object-fit: cover;    width: 100%;  }  .case-study-item-info p,  .case-study-item-info a {    margin-top: 15px;  }    .case-study-item {    margin-bottom: 40px;  }  .footer-header {    margin-bottom: 25px;  }  .owl-dots {    margin-top: 30px;  }  .case-study-wrapper-2 .col-md-12.text-center.mt-25 {    margin-top: 15px !important;  }}/* Small devices (mobile, 575px and down) */@media (max-width: 575px) {  .wrapper {    padding: 70px 0;  }  .hero-wrapper {    padding: 70px 0;  }  .hero-wrapper.breadcrumb-wrapper {    padding: 100px 0;  }  .hero-info {    text-align: center;  }  .creatopo-btn {    height: 42px;    line-height: 42px;    padding: 0 20px;    font-size: 14px;  }  .whycu-wrapper::after {    display: none;  }  .footer-wrapper {    padding: 70px 0;  }  .service-item {    padding: 30px 35px;  }  .service-icon {    left: 35px;    top: 30px;  }  .award-item {    text-align: center;  }  .award-img {    margin: 0 auto;    text-align: left;  }  .scrollUp {    height: 40px;    width: 40px;    right: 15px;  }  .scrollUp.show {    bottom: 58px;  }  .scrollUp span {    line-height: 40px;  }  .scrollUp:hover span:first-child {    margin-top: -40px;  }  .pricing-tabs.nav-tabs .nav-link {    height: 42px;    line-height: 42px;    width: initial;    padding: 0 19px;  }  .pricing-feature img {    margin-right: 10px;  }  .breadcrumb-info h2 {    font-size: 35px;    margin-bottom: 15px;  }  .blog-post-comment {    margin-top: 60px;  }  .blog-post-comment-item img {    position: static;    margin-bottom: 20px;  }  .person-bio {    margin-left: 0;  }  .sidebar-post li img {    height: 80px;    width: 80px;  }  .video-pop {    height: 50px;    width: 50px;  }  .video-pop span {    line-height: 50px;    font-size: 20px;  }  .blog-sidebar form input,  .blog-sidebar form button {    height: 50px;  }  .whycu-item {    padding-left: 60px;  }  .whycu-item img {    width: 40px;    height: 40px;  }}/* extraSmall devices ( 400px and down) */@media (max-width: 400px) {  .case-study-wrapper-2 .zoom-gallery .col-6 {    -ms-flex: 0 0 100%;    flex: 0 0 100%;    max-width: 100%;  }  .hero-img {    margin-top: 35px;  }  .video-warp-img,  .about-img,  .whycu-img {    margin-bottom: 35px;  }  .about-img.top-gap {    margin-top: 35px;    margin-bottom: 0;  }  .case-study-img.mt-0 {    margin-top: 35px !important;  }  .wrapper-header h3 {    margin-top: 15px;  }  .award-wrapper .col-6 {    -ms-flex: 0 0 100%;    flex: 0 0 100%;    max-width: 100%;  }  .service-icon {    position: static;    height: 50px;    width: 50px;    margin-bottom: 25px;  }  .seervice-info {    margin-left: 0;  }  .footer-img-group img {    height: 80px;    width: 80px;  }  .hero-info h2 {    margin-bottom: 30px;  }  .hero-info p {    margin-bottom: 35px;  }  .team-wrapper .col-8 {    -ms-flex: 0 0 100%;    flex: 0 0 100%;    max-width: 100%;  }  .creatopo-pagination li:first-child,  .creatopo-pagination li:last-child {    display: block;  }  .creatopo-pagination li:first-child {    margin-bottom: 15px;  }  .creatopo-pagination li:last-child {    margin-top: 15px;  }  .creatopo-pagination li:first-child a,  .creatopo-pagination li:last-child a {    display: inline-block;    padding: 0 30px;  }}/*����ֻ����ʾ���롣Դ����������: http://www.bootstrapmb.com/item/7108(���˵��������ʾ��ῴ��,���ص�Դ����û��)*/