@charset "utf-8";
/* CSS Document */

@media handheld,
    only screen and (max-width: 1360px),
    only screen and (max-device-width: 1360px) and (orientation: portrait) {
    #ad-works .owl-nav {
        display: none;
    }
}

@media handheld,
    only screen and (max-width: 1200px),
    only screen and (max-device-width: 1200px) and (orientation: portrait) {
    .center {
        padding: 0px 20px;
    }

    #top-info,
    #menu {
        padding: 0 20px 0 0;
    }

    /* Homepage */
    #main-image .text .center {
        margin: 0px;
    }

    #web .wrapper .text h2 {
        margin: 0px 0px 10px;
    }

    #reviews .item {
        max-width: 700px;
        margin: 0 auto;
    }
    #reviews .body p {
        font-size: 16px;
        line-height: 27px;
    }
    #reviews .body .owl-prev {
        left: 0px;
        top: 60%;
    }
    #reviews .body .owl-next {
        right: 0px;
        top: 60%;
    }

    .blog-post .image {
        height: auto;
        display: block;
    }
    .blog-post .text {
        padding-top: 10px;
    }
    .blog-post .text h3 a {
        font-size: 18px;
        line-height: 22px;
    }
    .blog-post .text p {
        font-size: 15px;
        line-height: 21px;
    }

    /* Blog post page */
    #single-post.blog-page-post .toc {
        left: 20px;
    }
    #single-post.blog-page-post > .wrapper {
        padding: 0px 0px 50px 255px;
    }
    #single-post.blog-page-post .toc.fixed {
        margin: 0px;
        left: 20px;
    }

    /* About us page */
    #about-us .row p {
        font-size: 15px;
    }

    /* Adwords page */
    .two-col .wrapper .text h2 {
        margin: 0px 0px 10px;
    }
    .adwords-page #testimonials .owl-item {
        height: 400px;
    }
    #footer-top.adwords div.clutch {
        margin: 38px 60px 0px 0px !important;
    }

    /* Footer */
    #footer-top .columns .col {
        padding: 0px 20px;
    }
}

@media (max-width: 1080px) {
    #offer .left,
    #offer .right {
        float: none;
    }
}

@media handheld,
    only screen and (max-width: 1010px),
    only screen and (max-device-width: 1010px) and (orientation: portrait) {
    /* Header */
    header {
        padding: 5px 0px;
    }
    header .logo {
        margin: 0px;
    }
    header #menu {
        display: none;
    }
    header #mobile-menu {
        display: block;
    }
    #top-info {
        display: none;
    }

    header #menu {
        padding: 0px;
    }
    header #menu > ul > li {
        margin: 0px 0px 0px 20px;
    }

    header #top-info {
        padding: 0px;
    }

    /* Homepage */
    #about-new {
        padding: 55px 0 35px;
    }
    #about-new .body .box {
        width: 48%;
        margin: 0px 0px 40px;
    }
    #about-new .body .box h3,
    #about-new .body .box p {
        font-size: 15px;
    }

    #web .wrapper {
        flex-wrap: wrap;
    }
    #web .wrapper .image,
    #web .wrapper .text {
        width: 100%;
    }
    #web .wrapper .text {
        margin: 20px 0px 0px;
    }

    #reviews .body {
        width: 100%;
        padding: 20px 0px 0px;
    }
    #reviews .quote {
        display: none;
    }
    #reviews .item {
        max-width: 90%;
        height: 380px;
        display: flex;
        align-items: center;
        flex-direction: column;
        justify-content: center;
    }

    #blog .blog-post {
        padding: 0px 0px 50px;
        height: auto;
    }
    .blog-post .image img {
        width: 100%;
    }

    /* Adwords page */
    .adwords-page #main-image .text h1 {
        font-size: 46px;
    }
    .adwords-page .about-new {
        padding: 55px 0 35px;
    }
    .adwords-page .about-new .body .box {
        width: 48%;
        margin: 0px 0px 40px;
    }
    .adwords-page .about-new .body .box h3,
    .adwords-page .about-new .body .box p {
        font-size: 15px;
    }
    .two-col h2 {
        max-width: 75%;
    }
    .two-col .wrapper {
        flex-wrap: wrap;
    }
    .two-col .wrapper .image,
    .two-col .wrapper .text {
        width: 100%;
    }
    .two-col .wrapper .text {
        margin: 20px 0px 0px;
    }

    .adwords-page #testimonials .owl-item,
    .adwords-page #testimonials .testimonial {
        height: auto;
    }

    .adwords-page #testimonials .testimonial {
        padding: 40px 45px 140px 45px;
    }

    #custom-dev .text {
        margin-bottom: 20px;
    }

    /* Blog page */
    .blog-page .blog a.post-container {
        width: 48%;
        margin: 0% 2% 2% 0%;
    }
    .blog-page .blog a.post-container:nth-child(3n + 3) {
        margin-right: 2%;
    }
    .blog-page .blog a.post-container:nth-child(2n + 2) {
        margin-right: 0px;
    }

    /* Blog post page */
    #single-post.blog-page-post .toc {
        display: none !important;
    }
    #single-post.blog-page-post .wrapper {
        padding: 0px 20px 50px;
        max-width: 700px;
        margin: 0px auto;
    }
    #single-post .post-social .number {
        padding: 0px 15px 0px 0px;
    }
    #single-post .post-social .buttons {
        padding: 0px 0px 0px 15px;
    }
    #single-post .post-social a {
        margin: 0px 7px 0px 0px;
    }
    #single-post .post-social a:last-child {
        margin: 7px 0px 0px;
    }

    /* Contact page */
    /* #contact .cols {
        flex-wrap: wrap;
    }
    #contact .col {
        margin: 0% 4% 1% 0%;
    }
    #contact .col1 {
        width: 100%;
    }
    #contact .col2,
    #contact .col3 {
        width: 48%;
    }
    #contact .col3 {
        margin-right: 0px;
    } */
    #testimonials .wrapper {
        flex-wrap: wrap;
    }
    #testimonials .wrapper .testimonial {
        width: 100%;
        margin: 0px;
    }

    /* About us page */
    #about-us .row > div,
    #about-us .row > div img {
        width: 100%;
    }
    #about-us .row h2 {
        margin: 20px 0px;
    }
    #about-us .row a.button {
        position: relative;
        bottom: auto;
        margin: 20px 0px;
    }
    #offer {
        height: auto;
    }

    #offer .right {
        padding: 20px 0px;
    }

    /* Services pages */
    #service {
        margin: 40px 0px;
    }
    #service .text div img,
    #service .text div p,
    #service .text div h2 {
        width: 100%;
        margin: 0px;
    }
    #service .text div p,
    #service .text div h2 {
        margin: 10px 0px;
        padding: 0px;
    }
    #service .text div {
        margin: 0px 0px 20px;
    }
    #service .text div ol,
    #service .text div ul {
        width: 100%;
        margin: 0px 0px 20px 20px;
    }

    /* Landing pages */
    #landing,
    #landing .row {
        margin: 40px 0px;
    }
    #landing h2 {
        margin: 0px 0px 10px;
    }
    #landing img {
        width: 100%;
    }
    #landing .left,
    #landing .right {
        width: 100%;
        margin: 0px;
    }

    /* Meta */
    #meta #breadcrumb {
        padding: 0px 20px 0px 0px;
    }

    /* Blog post */
    #blog .body.wrapper {
        flex-wrap: wrap;
        justify-content: center;
    }
    #blog .body.wrapper .post-container {
        width: 100%;
        max-width: 640px;
        margin: 0px 0px 30px;
    }
    #blog .body.wrapper .blog-post {
        height: auto;
    }

    /* Adwords page */
    #footer-top.adwords div.clutch {
        margin: 0px !important;
        display: inline-block;
    }
    #footer-top.adwords div.footer-logo {
        display: inline-block;
    }

    /* Footer */
    #footer-top .columns {
        flex-wrap: wrap;
    }
    #footer-top .columns .col.about {
        width: 100%;
        margin: 0px 0px 20px;
    }
    #footer-top .columns .col.contact,
    #footer-top .columns .col.call-back {
        width: 50%;
    }
}

@media handheld,
    only screen and (max-width: 760px),
    only screen and (max-device-width: 760px) and (orientation: portrait) {
    /* Header */

    header #top-info {
        width: 100%;
        float: none;
    }
    header #top-info .contact {
        display: none;
    }
    header #top-info .search-container {
        display: none;
    }
    header #top-info form input[type='text'] {
        width: 100%;
    }
    header #mobile-menu {
        top: 29px;
        display: flex;
        align-items: center;
    }

    /* Homepage */
    #main-image {
        position: relative;
        height: auto !important;
        border: none;
    }
    #main-image img {
        max-width: 100%;
    }
    #main-image .text {
        top: 35%;
    }
    #main-image .text h1 {
        font-size: 34px !important;
        line-height: 30px !important;
        margin: 0px;
        max-width: 100%;
    }
    #main-image .text h1 span.top {
        font-size: 18px;
        margin: 0px;
    }
    #main-image .text h1 span.top img {
        margin-top: 10px;
    }
    #main-image .text h1 span.small {
        font-size: 16px;
        margin: 0px;
    }
    #main-image .works {
        display: none;
    }

    #web {
        margin-top: 0px;
    }

    #about-new {
        margin: 0px;
    }
    #about-new .body .box {
        width: 100%;
        margin: 0px 0px 20px;
    }

    .adwords-page .about-new {
        margin: 0px;
    }
    .adwords-page .body .box {
        width: 100% !important;
        margin: 0px 0px 20px !important;
    }

    #blog .blog-post .text {
        padding: 0px 20px;
    }

    #counter .wrapper {
        flex-wrap: wrap;
    }
    #counter .wrapper .col {
        width: 50%;
    }
    #counter .wrapper .col.year {
        margin: 0px 0px 40px;
    }

    /* Single post page */
    #single-post .center {
        padding: 50px 20px;
    }
    .single-post-page #meta h1 {
        font-size: 28px;
    }

    /* Works page 
	#works .wrapper .work{ width: 48.6%; }
	#works .wrapper .work:nth-child(3n+3){ margin-right: 2.7%; }
	#works .wrapper .work:nth-child(2n+2){ margin-right: 0px; }	
	*/

    /* Works */
    #our-works .row .center > div {
        width: 100%;
    }
    #our-works .row .center > div.right .image img {
        max-width: 100%;
        width: 100%;
        height: auto;
    }

    /* Works details */
    .works-details-page .actions {
        display: flex;
        flex-wrap: wrap;
    }
    .works-details-page .actions a.prev,
    .works-details-page .actions a.all,
    .works-details-page .actions a.next {
        position: relative;
        transform: none;
        left: auto;
        width: 100%;
        margin: 10px 0px;
        text-align: center;
    }

    /* Sitemap */
    #sitemap {
        margin: 40px 0px;
    }
    #sitemap .left,
    #sitemap .right {
        width: 100%;
        margin: 0px;
    }
    #sitemap .left {
        margin: 0px 0px 40px;
    }

    /* Error page */
    #error .wrapper {
        display: flex;
        align-items: center;
        flex-wrap: wrap;
    }
    #error .left {
        float: left;
        width: 100%;
        margin: 0px 0px 20px 0px;
    }
    #error .right {
        float: left;
        width: 100%;
    }

    /* Tudástár */
    #library {
        margin: 40px 0px;
    }
    #library .lead {
        margin: 0px 0px 40px;
    }
    #library .left,
    #library .right {
        width: 100%;
    }
    #library .left {
        margin: 0px 0px 20px;
    }

    /* Services */
    #single-post .offer {
        background: #e7e7e7;
    }

    /* AdWords */
    .adwords-page #customers {
        margin: 0px;
    }
    .adwords-page #main-image .text {
        top: 20%;
    }
    .adwords-works .left,
    .adwords-works .right {
        width: 100%;
        float: left;
    }
    .adwords-works .left {
        margin: 0px;
    }
    #read-about-us .body .item {
        width: 33%;
    }
    #custom-dev {
        margin: 0px;
        padding-top: 0px;
        padding-bottom: 20px;
    }

    #references .images {
        flex-wrap: wrap;
        grid-template-columns: repeat(2, 1fr);
    }

    #references .images .item {
        /* width: 50%; */
    }

    .adwords-page .two-col{
        padding-top: 20px;
        padding-bottom: 20px;
    }

    .adwords-page #google-reviews{
        padding-top: 20px;
        padding-bottom: 20px;
    }

    .adwords-page .faq{
        padding-top: 20px;
        padding-bottom: 20px;
    }

    /* Footer */
    #footer-top .columns .col.about,
    #footer-top .columns .col.contact,
    #footer-top .columns .col.call-back,
    #footer-top .columns .col.services {
        width: 100% !important;
        margin: 0px 0px 20px;
    }
    #footer-top.adwords .col.contact {
        text-align: center;
    }

    #footer-bottom .left {
        margin: 0px 0px 20px;
    }
    #footer-bottom .left,
    #footer-bottom .right {
        width: 100%;
        text-align: center;
    }
}

@media handheld,
    only screen and (max-width: 640px),
    only screen and (max-device-width: 640px) and (orientation: portrait) {
    /* Homepage */
    #main-image .text h1 {
        font-size: 30px !important;
        line-height: 30px !important;
        margin: 0px;
        max-width: 100%;
    }
    #main-image .text h1 span.top {
        font-size: 16px;
        margin: 0px;
    }
    #main-image .text h1 span.top img {
        margin-top: 10px;
    }
    #main-image .text h1 span.small {
        font-size: 15px;
        margin: 0px;
    }

    .blog-post .text h3 {
        margin: 20px 0px;
    }

    /* Blog page */
    .blog-page .blog .blog-post {
        height: auto;
        padding: 0px 0px 30px;
    }
    .blog-page .blog a.post-container {
        width: 100%;
        margin: 0px 0px 20px;
    }
    .blog-page .blog a.post-container .blog-post .text h3 {
        margin: 10px 0px;
    }

    /* Blog post page */
    #single-post .post-social a {
        width: 100%;
        margin: 10px 0px;
    }

    /* Contact page */

    #contact .col2,
    #contact .col3 {
        width: 100%;
    }

    #reviews .body p {
        font-size: 15px;
        line-height: 23px;
    }
    #reviews .body p.sign {
        margin: 5px 0px;
        font-size: 15px;
        line-height: 19px;
    }

    /* AdWords page */
    .adwords-page #customers {
        padding: 20px 0px;
    }
    .adwords-page .about-new,
    #ad-works,
    .adwords-page #testimonials,
    .adwords-page #counter .wrapper {
        padding: 20px 0px;
    }

    /* Footer AdWords */
    #footer-top.adwords .col.about .footer-logo {
        margin: 0px 0px 20px;
    }
    #footer-top.adwords .col.about > div {
        display: flex;
        justify-content: center;
        width: 100%;
    }
}

@media handheld,
    only screen and (max-width: 480px),
    only screen and (max-device-width: 480px) and (orientation: portrait) {
    header .logo {
        max-width: 160px;
    }
    header #mobile-menu {
        top: 12px;
    }

    /* Homepage */
    p,
    .button {
        font-size: 16px !important;
    }

    #main-image .text {
        top: 5% !important;
    }
    #main-image .text h1 {
        font-size: 24px !important;
        line-height: 22px !important;
    }
    #main-image .text h1 span.top img {
        display: none;
    }

    #about-new .body .box h3 {
        font-size: 16px;
    }
    .adwords-page .about-new .body .box h3 {
        font-size: 16px;
    }

    #blog .blog-post {
        margin: 0px;
    }
    #blog .owl-nav {
        top: -37px;
    }

    #reviews .body .owl-prev {
        top: 10px;
        right: 60px;
        left: auto;
    }
    #reviews .body .owl-next {
        right: 0px;
        top: 10px;
    }

    #counter .wrapper .col span.number {
        font-size: 55px;
    }

    /* Single post page */
    #single-post h1 {
        font-size: 32px;
        line-height: 40px;
    }
    #single-post h2 {
        font-size: 26px;
        line-height: 38px;
    }
    #single-post h3 {
        font-size: 20px;
        line-height: 30px;
    }
    #single-post p,
    #single-post ul li,
    #single-post ol li {
        font-size: 18px !important;
        line-height: 30px;
    }
    .single-post-page #meta h1 {
        font-size: 26x;
    }
    #single-post p.figcaption {
        font-size: 12px !important;
        line-height: 15px !important;
        margin: -30px 0 0 !important;
    }

    /* Blog page */
    .blog-page .blog {
        padding: 40px 0px;
    }

    /* Blog post page */
    #single-post .post-social .social-wrapper {
        flex-wrap: wrap;
    }
    #single-post .post-social .buttons {
        width: 100%;
        margin: 0px 0px 20px;
    }
    #single-post .post-social .number {
        width: 100%;
        text-align: center;
        border: none;
        margin: 0px 0px 10px 0px;
    }

    /* Single post offer */
    #single-post .offer {
        padding: 20px;
    }
    #single-post .offer a {
        font-size: 16px;
        padding: 10px 20px;
    }

    #author .center {
        padding: 50px 0px;
    }
    #author .wrapper {
        flex-wrap: wrap;
    }
    #author .wrapper .image,
    #author .wrapper .content {
        width: 100%;
    }
    #author .wrapper .content {
        padding: 0px;
        margin: 20px 0px 0px;
    }

    /* Contact page */
    #contact {
        margin: 20px 0px;
    }
    #testimonials .wrapper .testimonial {
        padding: 20px;
    }
    #testimonials .testimonial .quote.open {
        left: 5px;
    }

    #testimonials .wrapper .testimonial {
        margin: 60px 0px 0px;
    }
    #testimonials .owl-carousel {
        padding: 0px;
    }
    #testimonials .owl-prev {
        left: auto;
        top: 0px;
        right: 50px;
    }
    #testimonials .owl-next {
        top: 0px;
        right: 0px;
    }

    /* Adwords page */
    .adwords-page #contact {
        padding: 20px;
    }
    .adwords-page #contact .col1 p {
        display: none;
    }
    .adwords-page #main-image .text {
        top: 15% !important;
    }
    .adwords-page #main-image .text .center {
        padding: 0px;
    }
    #read-about-us .body .item {
        width: 50%;
    }

    .adwords-page #testimonials .testimonial {
        padding: 40px 25px 140px 25px;
    }

    /* Works page */
    #works {
        padding: 40px 0px;
    }
    #works .wrapper .work {
        width: 100%;
        margin: 0px 0px 20px;
    }
    #works .wrapper .work img {
        width: 100%;
    }

    /* About us page */
    #about-us {
        padding: 40px 0px;
    }
    #staff .wrapper .worker {
        width: 100%;
        margin: 0px 0px 20px;
    }

    /* Other */
    #meta h1 {
        font-size: 32px;
    }
    #meta #breadcrumb {
        display: none;
    }

    /* Reviews */
    #customer-reviews .review {
        padding: 35px 20px;
    }
    #customer-reviews .review p {
        color: #555555;
    }
    #customer-reviews .author {
        font-size: 15px;
        padding: 0px 0px 0px 23px;
    }

    /* Tudástár */
    #library ul {
        margin: 0px 0px 0px 30px;
    }
    #library ul li,
    #library ul li a {
        font-size: 16px;
        line-height: 23px;
    }

    /* Works page */
    #our-works .row {
        padding: 40px 0px;
    }
    #our-works .row .center .more-images {
        flex-wrap: wrap;
        margin: 0px;
    }
    #our-works .row .center .more-images .image {
        width: 100%;
        margin: 20px 0px 0px !important;
    }

    /* Footer */
    #footer-bottom .left {
        margin: 0px;
    }
    #footer-bottom span {
        display: none;
    }
    #footer-bottom a {
        display: block;
        margin: 10px 0px 0px;
    }

    /* Pager */
    .pager a,
    .pager .active,
    .pager .gap {
        padding: 5px 10px;
    }
}

@media handheld,
    only screen and (max-width: 320px),
    only screen and (max-device-width: 320px) and (orientation: portrait) {
    #main-image .text h1 {
        font-size: 22px;
        line-height: 22px;
    }
    #main-image .text h1 span.top img {
        display: none;
    }

    #reviews .body p {
        line-height: 17px;
    }

    /* Footer */
    #footer-top .columns .col.contact .social i {
        width: 35px;
        height: 35px;
    }
}