@media (min-width: 1200px) {
    .hidden-lg {
        display: none !important;
    }
}

@media only screen and (max-width: 1200px) {
    .top-container .container {
        background: url(img/top-img.png) no-repeat right 30px center;
    }

    .example-container .right-block .nav li {
        padding: 0 3px;
    }

    .schema-container .left-block img {
        width: 100%;
    }
}

@media (min-width: 992px) and (max-width: 1199px) {
    .hidden-md {
        display: none !important;
    }
}

@media only screen and (max-width: 992px) {
    .top-container {
        height: 400px;
    }

    .top-container .container {
        background: url(img/top-img.png) no-repeat right center;
        height:     400px;
        background-size: 340px;
    }

    .top-container .container .h1 {
        font-size:   44px;
        line-height: 60px;
        margin-top:  20px;
    }

    .top-container .container .text {
        margin-top: 40px;
    }

    .top-container .container .try-button {
        margin-top: 20px;
    }

    .top-container .container .row div div:last-child {
        margin-top: 20px;
    }

    .social-container {
        /*height:      160px;*/
        line-height: 80px;
    }

    .example-container .left-block .h2 {
        margin-bottom: 23px;
    }

    .example-container .left-block .learn-button {
        margin-top: 28px;
    }

    .example-container .right-block .wrapper {
        margin-top: 43px;
    }

    .example-container .right-block .nav li {
        padding: 0 10px;
    }

    .schema-container .left-block img {
        width:         auto;
        margin-bottom: 45px;
    }

    .schema-container .right-block .h2 {
        margin-bottom: 23px;
    }

    .schema-container .right-block .learn-button {
        margin-top: 28px;
    }

    .feedback-container .jcarousel {
        padding: 0;
    }

    .example-container,
    .schema-container,
    .features-container,
    .companies-container,
    .feedback-container,
    .community-container {
        padding-top: 40px;
    }

    .example-container hr,
    .schema-container hr,
    .features-container hr,
    .feedback-container hr {
        margin-top: 40px;
    }

    .question-container,
    .donate-container {
        padding-top:    45px;
        padding-bottom: 40px;
    }

    .companies-container {
        padding-bottom: 40px;
    }

    .community-container {
        padding-bottom: 20px;
    }

    footer {
        height:      120px;
        line-height: 120px;
    }

    footer .social li {
        height: 120px;
    }
}

@media (min-width: 768px) and (max-width: 991px) {
    .hidden-sm {
        display: none !important;
    }
}

@media only screen and (max-width: 768px) {
    header nav li {
        padding: 0 15px;
    }

    body {
        font-size: 14px;
    }

    .example-container .left-block .h2,
    .schema-container .right-block .h2,
    .companies-container .h2,
    .feedback-container .h2,
    .community-container .h2 {
        font-size:   30px;
        line-height: 44px;
    }

    .example-container,
    .schema-container,
    .features-container,
    .companies-container,
    .feedback-container,
    .community-container {
        padding-top: 25px;
    }

    .example-container hr,
    .schema-container hr,
    .features-container hr,
    .feedback-container hr {
        margin-top: 25px;
    }

    .question-container,
    .donate-container {
        padding-top:    25px;
        padding-bottom: 20px;
    }

    .companies-container {
        padding-bottom: 25px;
    }

    .community-container {
        padding-bottom: 15px;
    }

    .question-container .h3,
    .donate-container .h3 {
        font-size:   26px;
        line-height: 44px;
    }

    .top-container {
        height: 438px;
    }

    .top-container .container {
        background:      url(img/top-img.png) no-repeat right 15px center;
        background-size: 50%;
        height:          438px;
    }

    .top-container .container .h1 {
        font-size:   40px;
        line-height: 52px;
        margin-top:  30px;
    }

    .top-container .container .text {
        margin-top: 20px;
    }

    .top-container .container .try-button {
        margin-top: 20px;
    }

    .top-container .container .row div div:last-child {
        margin-top: 20px;
    }

    .social-container {
        height:      120px;
        line-height: 60px;
    }

    .example-container .left-block .h2 {
        margin-bottom: 15px;
    }

    .example-container .left-block .text {
        font-size:   15px;
        line-height: 25px;
    }

    .example-container .left-block .learn-button {
        margin-top: 20px;
    }

    .example-container .right-block .wrapper {
        margin-top: 35px;
    }

    .schema-container .left-block img {
        margin-bottom: 25px;
    }

    .schema-container .right-block .h2 {
        margin-bottom: 15px;
    }

    .schema-container .right-block .text {
        font-size:   15px;
        line-height: 25px;
    }

    .schema-container .right-block .learn-button {
        margin-top: 20px;
    }

    .features-container img {
        margin-bottom: 10px;
        height:        95px;
    }

    .features-container .h3 {
        margin:      15px 0;
        font-size:   18px;
        line-height: 26px;
    }

    .features-container .row > div:not(:first-child) {
        margin-top: 30px;
    }

    .feedback-container .jcarousel ul {
        width: 600%;
    }

    .feedback-container .arrow {
        font-size:   24px;
        height:      40px;
        width:       40px;
        line-height: 35px;
    }

    .companies-container .h2 {
        margin-bottom: 20px;
    }

    .question-container,
    .donate-container {
        padding-top:    20px;
        padding-bottom: 25px;
    }

    .question-container .learn-button {
        margin-left:  auto;
        margin-right: auto;
        margin-top:   20px;
        display:      block;
    }

    footer {
        height:      100px;
        line-height: 100px;
    }

    footer .social li {
        width:  50px;
        height: 50px;
    }

    footer .social li span {
        height:      50px;
        line-height: 50px;
        width:       50px;
    }

    footer .copyright,
    footer .social {
        clear:       right;
        float:       left;
        text-align:  center;
        height:      50px;
        line-height: 50px;
    }

    footer .social li span:before {
        position: relative;
        top:      6px;
        display:  inline-block;
        left:     0;
    }

    footer .social li.twitter span:before {
        top: 8px;
    }

    footer .social li.slack span:before {
        left: -1px;
    }
}

@media only screen and (max-width: 640px) {
    header nav.navbar .navbar-header a {
        position: absolute;
        left:     0;
        padding:  0 15px;
    }

    header nav ul .active {
        border: none;
    }

    header nav ul .active a {
        border-bottom: 5px solid #1384df;
    }

    header nav li {
        height: 60px;
    }

    header nav li {
        height:      60px;
        line-height: 55px;
    }
}

@media only screen and (max-width: 480px) {
    .hidden-xs {
        display: none;
    }

    .example-container .left-block .h2,
    .schema-container .right-block .h2,
    .companies-container .h2,
    .feedback-container .h2,
    .community-container .h2 {
        font-size:   26px;
        line-height: 44px;
    }

    .top-container {
        height: 370px;
    }

    .top-container .container {
        background: none;
        height:     370px;
    }

    .top-container .container .h1 {
        margin-top:  20px;
        font-size:   32px;
        line-height: 44px;
    }

    .top-container .container .text {
        margin-top: 20px;
    }

    .top-container .container .try-button {
        margin-top:    15px;
        margin-bottom: 10px;
        margin-left:   auto;
        margin-right:  auto;
        display:       block;
        line-height:   12px;
    }

    .top-container .container .support-button {
        margin-top: 0px;
        margin-bottom: 15px;
        margin-left: auto;
        margin-right: auto;
        display: block;
        line-height: 12px;
    }

    .top-container .container .row div div:last-child {
        margin-top: 10px;
        text-align: center;
    }

    .social-container {
        height:      240px;
        line-height: 60px;
    }

    .social-container li {
        width: 100%;
    }

    .example-container .left-block .learn-button {
        margin-top:   10px;
        display:      block;
        margin-right: auto;
        margin-left:  auto;
    }

    .example-container .right-block .wrapper {
        margin-top: 25px;
    }

    .example-container .right-block .code {
        font-size:        13px;
        background-color: #fff;
        padding:          15px;
        margin:           0;
        line-height:      24px;
    }

    .schema-container .right-block .learn-button {
        margin-top:   10px;
        display:      block;
        margin-right: auto;
        margin-left:  auto;
    }

    .companies-container .h2 {
        margin-bottom: 10px;
    }

    .feedback-container .jcarousel ul {
        width: 1100%;
    }

    .feedback-container .jcarousel li {
        width: 9.09090909%;
    }

    .schema-container .left-block img {
        width: 100%
    }

    .question-container .h3, .donate-container .h3 {
        font-size:   22px;
        line-height: 40px;
        padding:     0 15px;
    }

    .question-container .learn-button {
        margin-top: 10px;
    }

    .community-container .h2 {
        margin-bottom: 20px;
        padding:       0 15px;
    }

    .community-container li {
        margin-bottom: 12px;
        line-height:   24px;
    }

    .donate-container ul {
        text-align: center;
    }

    .donate-container .donate-button {
        display:      block;
        margin-top:   15px;
        margin-left:  auto;
        margin-right: auto;
    }
}

@media only screen and (max-width: 380px) {
    header .orm-text {
        display: none;
    }
}