/* Medium Layout: 1280px. 

Checking Size: 1000px
*/

@media only screen and (min-width: 992px) and (max-width: 1200px){
    .container{
        width: 970px;
    }

    /* Section About Area */
    .history-left {
        flex-basis: 429px;
    }
    .history-right {
        flex-basis: 514px;
    }

    /* Section Services Area */
    .services {
        flex-direction: column;
    }
    .services-left {
        flex-basis: 100%;
        margin-left: 0;
    }
    .services-right {
        flex-basis: 100%;
    }
    .services-box {
        margin: 20px 0 0;
    }
    .box-left {
        flex-basis: 100%;
        margin-top: 0px;
    }
    .box-right {
        flex-basis: 100%;
    }
    .testimonial-area .section-title h5::before, .pricing-area .section-title h5::before, .action-area .section-title h5::before, .news-area .section-title h5::before, .about-action-area .section-title h5::before {
        margin: 0 213px;
    }

    /* Testimonial Area */
    .single-testi {
        flex-basis: 233px;
    }

    /* Pricing Area */
    .single-price {
        flex-basis: 292px;
    }
    .price-img {
        padding-top: 173px;
    }
    .img-info {
        margin-top: -142px;
        margin-left: 68px;
    }
    .single-price a {
        margin: 14px 21px;
    }
    .single-price:nth-child(2) {
        flex-basis: 373px;
    }
    .single-price:nth-child(2) .price-img {
        padding-top: 236px;
    }
    .single-price:nth-child(2) .img-info {
        margin-top: -175px;
        margin-left: 96px;
    }
    .single-price:nth-child(2) a {
        margin: 33px 58px;
    }

    /* Action Area */
    .vedio-play {
        margin: 206px 457px 0px;
    }
    .action input[type="email"] {
        margin-left: 126px;
    }
    .button {
        margin-left: 653px;
    }

    /* Blog Area */
    .single-blog {
        flex-basis: 314px;
    }
    .blog-img h5 {
        margin-top: -199px;
    }

    /* Footer Area */
    .footer {
        margin: 0 -6px;
    }
    .footer-menu {
        flex-basis: 182px;
    }
    .footer-middle {
        flex-basis: 151px;
    }

    /* About */

    /* About Banner Area */
    .about-banner {
        margin-left: 433px;
    }

    /* About Area */
    .about {
        flex-direction: column;
    }
    .about-img {
        flex-basis: 100%;
        margin-left: 0;
    }
    .about-info {
        flex-basis: 100%;
        margin-right:0;
    }
    .single {
        margin: 20px 8px 0;
    }
    .single-info {
        flex-basis: 303px;
    }

    /* Team Area */
    .team {
        margin: 67px 30px 0;
    }

    /* Services */

    /* Services Area */
    .single-service {
        flex-basis: 445px;
        margin-bottom: 100px;
        margin: 63px 16px;
    }

    /* Contact */

    /* Contact Area */
    .contact {
        margin: 60px 0 0;
        flex-direction: column;
    }
    .contact-form {
        flex-basis: 100%;
    }
    .contact-info {
        flex-basis: 100%;
        margin-top: 30px;
    }
}

/* Tablet Layout: 768px. 

Checking Size: 800px
*/

@media only screen and (min-width: 768px) and (max-width: 991px){
    .container{
        width: 750px;
    }
    .banner-area {
        background-position: 0;
        background-repeat: no-repeat;
    }
    .about-history {
        flex-direction: column;
    }
    .history-left {
        flex-basis: 100%;
    }
    .history-right {
        flex-basis: 100%;
    }
    @keyframes mymove {
        from {top: 20px;}
        to {top: 80px;}
    }
    .services {
        flex-direction: column;
    }
    .services-left {
        flex-basis: 100%;
        margin-left: 0;
    }
    .services-right {
        flex-basis: 100%;
    }
    .services-box {
        flex-direction: column;
    }
    .box-left {
        flex-basis: 100%;
    }
    .box-right {
        flex-basis: 100%;
    }
    .testimonial-area .section-title, .pricing-area .section-title, .action-area .section-title, .blog-area .section-title, .about-action-area .section-title, .services-area .section-title, .contact-area .section-title {
        max-width: 100%;
        text-align: center;
        margin: 0;
    }
    .single-testi {
        flex-basis: 338px;
        margin: 31px 0;
    }
    .pricing {
        flex-direction: column;
        margin: 130px 0 0;
    }
    .single-price {
        flex-basis: 100%;
        border: 1px solid transparent;
        background-color: white;
        border-radius: 10px;
        padding: 26px;
    }
    .price-img {
        padding-top: 517px;
        background-position: initial;
        margin-top: -128px;
    }
    .single-price {
        flex-basis: 100%;
        margin-bottom: 231px;
    }
    .single-price:nth-child(2) {
        flex-basis: 100%;
        margin: -34px 0 178px;
    }
    .single-price:nth-child(2) .price-img {
        padding-top: 516px;
        margin-top: -193px;
    }
    .img-info {
        margin-top: -333px;
        margin-left: 237px;
    }
    .img-info h4 {
        font-size: 46px;
    }
    .img-info p {
        font-size: 56px;
    }
    .img-info span {
        font-size: 23px;
    }
    .single-price:nth-child(2) .img-info {
        margin-top: -324px;
        margin-left: 225px;
    }
    .single-price:nth-child(2) .img-info h4{
        font-size: 51px;
    }
    .list span {
        padding: 14px 0;
        font-size: 23px;
    }
    .single-price a {
        font-size: 24px;
        margin: 15px 220px;
        padding: 12px 35px;
    }
    .single-price:nth-child(2) .list span {
        font-size: 24px;
    }
    .single-price:nth-child(2) a {
        margin: 33px 215px;
        font-size: 25px;
        padding: 16px 33px;
    }
    .vedio-play {
        margin: 168px 340px 0px;
    }
    .action input[type="email"] {
        width: 100%;
        height: 64px;
        margin-left: 0;
    }
    .button {
        margin-left: 598px;
    }
    .blog {
        flex-direction: column;
    }
    .single-blog {
        flex-basis: 100%;
        margin-bottom: 40px;
    }
    .img-link {
        margin-left: 14px;
        margin-top: 14px;
    }
    .blog-img h5 {
        margin-top: -468px;
        padding: 16px 33px;
        font-size: 18px;
        margin-left: 14px;
    }
    .blog-info h4 a {
        font-size: 30px;
    }
    .footer-left {
        flex-basis: 337px;
    }
    .footer-menu {
        flex-basis: 366px;
        margin-bottom: 55px;
    }
    .footer-middle {
        padding: 0;
        flex-basis: 45%;
    }
    .footer-right {
        flex-basis: 50%;
    }

    /* About Area */
    .about-banner {
        margin-left: 308px;
    }
    .about {
        flex-direction: column;
    }
    .about-img {
        flex-basis: 100%;
        margin-left: 0;
    }
    .about-info {
        flex-basis: 100%;
        margin-right: 0;
    }
    .team-area .section-title {
        max-width: 100%;
        margin: 0;
    }
    .team {
        margin: 67px 0;
    }
    .single-team {
        flex-basis: 360px;
    }
    .single-service {
        flex-basis: 100%;
    }
    .item-content a {
        font-size: 19px;
        margin: 10px 290px;
    }
    .contact {
        flex-direction: column;
    }
    .contact-form {
        flex-basis: 100%;
        margin: 50px 0;
    }
    .contact-info {
        flex-basis: 100%;
    }
}

/* Mobile Layout: 350px

Checking Size: 400px
*/
@media only screen and (max-width: 767px){
    .container{
        width: 350px;
    }
    .header-top {
        flex-direction: column;
    }
    .header-top ul {
        flex-direction: column;
        margin-left: 47px;
    }
    .header-top ul li {
        padding-top: 10px;
    }
    .header-link {
        margin-top: 18px;
    }
    .header {
        flex-direction: column;
    }
    .logo {
        margin: 25px 0;
    }
    .menu ul li {
        padding-left: 19px;
    }
    .banner-area {
        padding-top: 674px;
        background-position: 0;
    }
    .banner {
        margin-top: -492px;
        max-width: 100%;
    }
    .about-history {
        flex-direction: column;
    }
    .history-left {
        flex-basis: 100%;
    }
    .history-right {
        flex-basis: 100%;
    }
    .img-left {
        flex-basis: 171px;
        margin-right: 18px;
    }
    .img-right {
        flex-basis: 161px;
        margin-top: 70px;
    }
    @keyframes mymove {
        from {top: 20px;}
        to {top: 80px;}
    }
    .services {
        flex-direction: column;
    }
    .services-left {
        flex-basis: 100%;
        margin-left: 0;
    }
    .services-right {
        flex-basis: 100%;
    }
    .services-box {
        flex-direction: column;
    }
    .box-left {
        flex-basis: 100%;
    }
    .box-right {
        flex-basis: 100%;
    }
    .testimonial-area .section-title, .pricing-area .section-title, .action-area .section-title, .blog-area .section-title, .about-action-area .section-title, .services-area .section-title, .contact-area .section-title {
        max-width: 100%;
        margin: 0;
    }
    .testimonial {
        flex-direction: column;
    }
    .single-testi {
        flex-basis: 100%;
        margin-bottom: 40px;
    }
    .pricing {
        flex-direction: column;
    }
    .single-price {
        flex-basis: 100%;
        margin-bottom: 130px;
    }
    .single-price:nth-child(2) {
        flex-basis: 100%;
        margin: 0 0 130px;
    }
    .single-price:nth-child(2) .price-img {
        padding-top: 217px;
    }
    .single-price:nth-child(2) .img-info {
        margin-top: -164px;
        margin-left: 89px;
    }
    .single-price:nth-child(2) a {
        margin: 33px 30px;
        font-size: 20px;
        padding: 16px 39px;
    }
    .vedio-play {
        margin: 268px 144px 0;
    }
    .action input[type="email"] {
        width: 100%;
        margin-left: 0;
    }
    .button {
        margin-left: 199px;
    }
    .blog-img h5 {
        margin-top: -220px;
    }
    .footer {
        flex-direction: column;
    }
    .footer-left {
        flex-basis: 100%;
        margin-bottom: 32px;
    }
    .footer-menu {
        flex-basis: 100%;
        margin-bottom: 32px;
    }
    .footer-middle {
        flex-basis: 100%;
        margin-bottom: 32px;
        padding: 0;
    }
    .footer-right {
        flex-basis: 100%;
        margin-bottom: 32px;
    }
    .copyright p {
        font-size: 15px;
    }
    .about-banner {
        margin-top: -265px;
        max-width: 100%;
        margin-left: 90px;
    }
    .about {
        flex-direction: column;
    }
    .about-img {
        flex-basis: 100%;
        margin-left: 0;
    }
    .about-info {
        flex-basis: 100%;
        margin-right: 0;
    }
    .single {
        flex-direction: column;
    }
    .single-info {
        flex-basis: 100%;
        margin-right: 0;
        margin-bottom: 27px;
    }
    .team-area .section-title {
        max-width: 100%;
        margin: 0;
    }
    .team {
        margin: 67px 0 0;
    }
    .single-team {
        flex-basis: 100%;
    }
    .single-service {
        flex-basis: 100%;
        margin-left: 0;
    }
    .item-content a {
        font-size: 17px;
        margin: 10px 106px;
    }
    .contact {
        flex-direction: column;
    }
    .contact-form {
        flex-basis: 100%;
        margin-bottom: 30px;
    }
    .contact-form input {
        width: 45%;
    }
    .contact-form input[type="text"] {
        width: 95%;
    }
    .contact-form textarea {
        width: 95%;
    }
    .contact-info {
        flex-basis: 100%;
    }
    .contact-area .header-link {
        margin: 31px 36px 0;
    }
}

/* Wide Mobile Layout: 480px. */

@media only screen and (min-width: 480px) and (max-width: 767px){
    .container{
        width: 450px;
    }
}