@media screen and (max-width: 1300px){
    .nav-phone {font-size: 40px;}

    /* .company-highlight {font-size: 130px;} */
}

@media screen and (max-width: 1200px){
    .nav-phone {font-size: 35px;}
    .nav-wa-icon {margin-top: 5px;}
    /* .home-article-slider .slick-prev, .home-article-slider .slick-next {top: 45%;} */
    /* .company-highlight {font-size: 120px;} */
}

@media screen and (max-width: 1100px){
    .nav-phone {font-size: 30px;}
    .nav-wa-icon {width: 35px; height: 35px;}

    /* .home-article-slider .slick-prev, .home-article-slider .slick-next {top: 40%;} */

    /* .company-highlight {font-size: 110px;} */

    .highlight-portfolio-subtitle {top: 34%; left: 20%; font-size: 60px;}
    .highlight-portfolio-title-wrapper {top: 40%;}
}

@media screen and (max-width: 1000px){
    .nav-left {width: 50%;}
    .nav-right {width: 50%;}

    .portfolio-block-heading {font-size: 70px;}
    .next-prev-portfolio-title {font-size: 68px;}

    .join-choice-right {width: 60%;}

    /* .home-article-slider .slick-prev, .home-article-slider .slick-next {top: 35%;} */
}

@media screen and (max-width: 900px){
    header .nav_right {width: 40%;}
    .home-marquee h2 {font-size: 150px;}

    .q_slide .arrows {left: -14.5vw;}

    .home-about-content {font-size: 40px;}

    .home-article-title {font-size: 35px;}
    .home-article-desc {font-size: 20px;}
    .home-article-item-title {font-size: 31px;}

    .popular-article-item-category {width: 25%;}

    .highlight-portfolio-subtitle {font-size: 55px;}

    .portfolio-block-heading {font-size: 65px;}
    .next-prev-portfolio-title {font-size: 63px;}
}

@media screen and (max-width: 800px){
    .q_slide .arrows {left: -17.5vw;}

    .home-about-content {font-size: 35px;}

    .home-portfolio-number {font-size: 80px;}
    .home-portfolio-item-title {font-size: 53px;}
    .home-portfolio-item-short-desc {font-size: 23px;}

    .footer-email {font-size: 40px;}
    .footer-content {font-size: 40px;}

    /* .nav-left {width: 100%; border-right: 0; padding-right: 5%;}
    .nav-right {width: 100%;} */

    .nav-item-label {font-size: 40px;}
    .nav-social-media-wrapper {font-size: 35px;}
    .nav-item-inner {margin-top: 2vh; margin-bottom: 2vh;}
    .nav-phone {font-size: 27px;}
    .nav-wa-icon {width: 25px; height: 25px;}

    .company-award-list-left {width: 100%; float: none; margin-right: 0;}
    .company-award-list-right {width: 100%; float: none; margin-left: 0;}
    
    .service-item {width: 50%; margin-bottom: 40px;}

    .article-item-title {font-size: 27px;}

    .highlight-portfolio-subtitle {font-size: 50px; left: 25%; top: 27%;}
    .highlight-portfolio-title-wrapper {top: 30%;}

    .portfolio-block-heading {font-size: 60px;}
    .next-prev-portfolio-title {font-size: 58px;}

    /* .home-article-slider .slick-prev, .home-article-slider .slick-next {top: 30%;} */

    .contact-form-intro br {display: none;}

    .join-choice-title {font-size: 36px;}

    .portfolio-block-title {font-size: 80px;}
}

@media screen and (max-width: 750px){
    .footer-email {font-size: 35px;}
    .footer-content {font-size: 35px;}
    .wa-icon-wrapper {width: 30px; height: 30px;}

    .popular-article-item-col {width: 100%;}
    .popular-article-item-category {margin-bottom: 20px;}
    .popular-article-item-title {margin-bottom: 30px;}
    .popular-article-item-short-desc {margin-bottom: 20px;}

    .portfolio-block-heading {font-size: 57px;}
    .next-prev-portfolio-title {font-size: 55px;}
}

@media screen and (max-width: 700px){
    header .nav_right {width: 50%;}

    /* .q_slide .arrows {left: -19.5vw;} */

    #section-home-about .section-content {display: block;}
    .home-about-content {margin-bottom: 65px;}
    .home-about-link {text-align: left; display: inline-block; top: unset; padding-left: 0;}

    .home-portfolio-item {height: auto;}
    .home-portfolio-image-wrapper {width: 100%; float: none; height: unset;}
    .home-portfolio-desc-wrapper {width: 100%; float: none; height: unset; padding: 15% 5%;}
    .home-portfolio-item-reverse .home-portfolio-desc-wrapper {float: left;}
    .home-portfolio-item-reverse .home-portfolio-item-short-desc {padding-right: 0;}
    .home-portfolio-image img {display: block; visibility: hidden;}
    .home-portfolio-item-title {font-size: 58px; position: static; margin-bottom: 30px; -ms-transform: none; transform: none;}
    .home-portfolio-item-short-desc {font-size: 27px; position: static; margin-bottom: 40px; -ms-transform: none; transform: none;}
    .home-portfolio-item-tags {position: static; -ms-transform: none; transform: none;}
    .home-portfolio-number {display: none;}
    .home-portfolio-number-mobile {display: block;}
    .home-portfolio-item-prev-bg {display: block;}

    .home-article-left {width: 100%; padding-right: 0; float: none; margin-bottom: 70px;}
    .home-article-right {width: 100%; float: none;}

    .footer-email {font-size: 30px;}
    .footer-content {font-size: 30px;}
    .wa-icon-wrapper {width: 27px; height: 27px; margin-top: 5px;}

    .article-item {width: 100%; margin-left: 0; margin-right: 0; float: none;}
    .portfolio-item {width: 100%; padding-top: 30px;}
    .portfolio-item.portfolio-item-right {padding-right: 0; padding-left: 0;}
    .portfolio-item.portfolio-item-left {padding-right: 0;}
    .portfolio-item-image {height: 460px;}
    .portfolio-item-image-inner {background-position: center;}

    .highlight-portfolio-title-wrapper {position: relative; transform: none;}
    .highlight-portfolio-title {margin-bottom: 30px;}
    .highlight-portfolio-image-wrapper {float: none; width: 100%; margin-bottom: 30px; height: auto; overflow: visible;}
    .highlight-portfolio-tags {display: none;}
    .highlight-portfolio-tags.mobile-version {display: block;}
    .highlight-portfolio-subtitle {display: none;}
    .highlight-portfolio-subtitle.mobile-version {display: block; width: auto; left: 0; text-align: left; top: unset; bottom: -67px}

    .portfolio-block-heading {font-size: 54px;}
    .next-prev-portfolio-title {font-size: 52px;}
    .portfolio-block-title {font-size: 70px;}

    .nav-item-label {font-size: 35px;}
    .nav-phone {font-size: 23px;}
    .nav-item-inner {margin-top: 2.4vh; margin-bottom: 2.4vh;}

    .join-choice-left {position: static;}
    .join-choice-title {font-size: 48px;}
    .join-choice-top {display: none;}
    .join-choice-right {float: none; width: 100%; padding-left: 0;}
    .join-choice-bottom .job-choice-item-number {display: block;}
}

@media screen and (max-width: 650px){
    .portfolio-block-heading {font-size: 50px;}
    .next-prev-portfolio-title {font-size: 48px;}
}

@media screen and (max-width: 600px){
    header .nav_right {display: none;}
    #nav-button-header {display: block;}
    #nav-button {display: none;}
    .home-marquee h2 {font-size: 130px;}
    .marquee-wrapper {padding-right: 0;}

    .section-slideshow-inner {margin-left: 15%;}

    .footer-email {font-size: 25px;}
    .footer-content {font-size: 25px;}
    .wa-icon-wrapper {width: 23px; height: 23px; margin-right: 10px;}
    .footer-content a {padding: 0 5px 0 5px;}

    .company-highlight {font-size: 19vw;}
    .company-highlight .animated-text-container {text-align: left !important;}
    .company-desc-left {width: 100%; float: none; margin-bottom: 60px; padding-right: 0;}
    .company-desc-right {width: 100%; float: none; padding-left: 0;}
    .company-award-image {padding-right: 0; width: 100%; float: none; margin-bottom: 50px;}
    .company-award-list-wrapper {padding-left: 0; width: 100%; float: none;}
    .company-award-title {font-size: 12vw;}

    #section-featured-client .inline-container {padding-right: 0;}
    .client-category {width: 100%; float: none; margin-bottom: 40px;}
    .client-list {width: 100%; float: none; padding-left: 20%; line-height: 1.8em;}
    .client-list-left {width: 100%; float: none; border-right: 0;}
    .client-list-right {width: 100%; float: none; border-left: 1px solid #49494b;}

    .works-highlight {width: 100%; padding-right: 0; float: none; margin-bottom: 40px; font-size: 47px;}
    .works-services {width: 100%; float: none; padding-left: 50%;}

    #section-portfolio-highlight .inline-container {padding-left: 0; padding-right: 0;}
    .highlight-portfolio-title, .highlight-portfolio-tags.mobile-version, .highlight-portfolio-subtitle.mobile-version {padding-left: 2%; padding-right: 5%;}
    .portfolio-item-image {height: 380px;}

    .portfolio-block-row .inline-container {display: block;}
    .portfolio-block-row p {margin-bottom: 50px;}
    .portfolio-block-row img {margin-bottom: 20px;}

    .next-prev-wrapper {flex-direction: column-reverse;}
    .next-wrapper {padding-bottom: 35px; border-bottom: 2px solid #373537;}
    .prev-wrapper {border-right: 0;}
    
    .nav-left {float: none; width: 100%; padding-right: 0; border-right: 0;}
    .nav-right {float: none; width: 100%;}
    .nav-contact-container {position: relative; padding-left: 0;}
    .nav-item-label {font-size: 4vh;}
    .nav-item-inner {margin-top: 1vh; margin-bottom: 1vh;}
    .nav-social-media-wrapper {margin-bottom: 2vh; font-size: 4vh;}
    .nav-content {padding-top: 5.4vh; padding-bottom: 5.1vh;}
    .nav-item-container {padding-bottom: 3vh;}
    .nav-phone {margin-bottom: 3vh;}

    .circle {display: none;}

    .home-article-right {margin-left: 10px; padding-right: 6px;}

    #section-popular-stories {margin-bottom: 80px;}

    .article-title-wrapper .article-category {font-size: 12px;}
    .article-title-wrapper .article-title {font-size: 40px;}
    #section-article-blocks .inline-container {padding-left: 2%; padding-right: 2%;}
    .article-block-type-text, .article-block-type-highlight, .article-block-type-title {padding-left: 0 !important; padding-right: 0 !important;}

    #contact-form {display: block;}
    .contact-form-left {padding-right: 0;}
    .field-contactform-body {display: block;}
    #contact-form textarea {height: 200px;}
    .job-choice-item {width: 100%; padding-right: 0; padding-left: 0;}
    .job-choice-item-right .job-choice-item-number, .job-choice-item-right .job-choice-item-title, .job-choice-item-right .job-choice-item-desc {border-left: 0; padding-left: 0;}
    #job-choice-item-1 {margin-bottom: 30px; padding-bottom: 40px; border-bottom: 2px solid #474749;}

    #section-slideshow .image-wrapper.desktop-version {display: none;}
    #section-slideshow .image-wrapper.mobile-version {display: block;}

    .portfolio-block-col-left div, .portfolio-block-col-right div, .portfolio-block-row div {padding: 0 !important; padding-left: 2% !important; padding-right: 2% !important;}
    .portfolio-one-block {margin-left: 0 !important; margin-right: 0 !important;}
    .portfolio-block-title {font-size: 60px;}
}

@media screen and (max-width: 500px) {
    .discuss-project-label {font-size: 40px;}
    
    .service-item {width: 100%;}
    .service-item-content {border-right: 0; border-bottom: 1px solid #58595b; padding-bottom: 40px;}

    .article-item-category {width: 100%; float: none; padding-right: 0; margin-bottom: 20px;}
    .article-item-title {float: none; width: 100%; padding-right: 0;}
    
    .portfolio-item-subtitle {width: 100%; float: none; padding-right: 0; margin-bottom: 20px; padding-bottom: 20px; border-bottom: 2px solid #414141;}
    .portfolio-item-tags {float: none; width: 100%; padding-right: 0; padding-left: 0;}
    .portfolio-item-info-wrapper {border-bottom: 0;}
    .portfolio-item {padding-top: 0px;}

    .works-highlight {font-size: 44px;}

    .contact-form-info {display: none;}
    .contact-form-info.mobile-version {display: block;}

    .portfolio-item-image {height: 340px;}
    /* .contact-button {float: none;} */
}

@media screen and (max-width: 450px) {
    .discuss-project-label {font-size: 35px;}

    .footer-email {font-size: 22px;}
    .footer-content {font-size: 22px;}
    .wa-icon-wrapper {width: 18px; height: 18px;}

    .works-highlight {font-size: 40px;}

    .portfolio-item-image {height: 300px;}
}

@media screen and (max-width: 400px) {
    .footer-email {font-size: 20px;}
    .footer-content {font-size: 20px;}

    .works-highlight {font-size: 37px;}
    .works-highlight .with-margin-left {margin-left: 5%;}

    .join-choice-title {font-size: 45px;}

    .portfolio-item-image {height: 260px;}
}

@media screen and (max-width: 350px) {
    .footer-social-media-wrapper {font-size: 17px;}
}