/* 
   ------------------------------------------------------
        RESPONSIVE STYLES
   ------------------------------------------------------
*/



/* ------------------------------------------------------------------------ */
/* ------------------------------------------------------------------------ */
/* ------------------------------------------------------------------------ */

@media (min-width: 1440px) and (max-width: 2880px) {

    /*------------------------------------------*/
    /*	 Intro
    /*------------------------------------------*/

    #intro-4-content { padding-top: 220px; padding-bottom: 190px; }

    /*------------------------------------------*/
    /*	 Content
    /*------------------------------------------*/	

    .portfolio-item .overlay-content p { font-size: 17px; line-height: 25px; font-weight: 300; padding: 0 20px; }



}



/* ------------------------------------------------------------------------ */
/* ------------------------------------------------------------------------ */
/* ------------------------------------------------------------------------ */

@media (min-width: 992px) and (max-width: 1199px) { 

    /*------------------------------------------*/
    /*	 Base
    /*------------------------------------------*/

    h4.h4-lg { font-size: 18px; line-height: 24px; }
    h4 { font-size: 17px; line-height: 17px; margin-bottom: 10px; }
    h3, h3.h3-thin { font-size: 26px; line-height: 32px; }
    .section-title-thin h3 { font-size: 28px; line-height: 36px; }
    p.p-lg { font-size: 18px; line-height: 26px; } 

    /*------------------------------------------*/
    /*	 Intro Content
    /*------------------------------------------*/

    #intro-1-content, #intro-2-content { padding-top: 200px; padding-bottom: 160px; }
    #intro-3-content, #intro-7-content { padding-top: 220px; padding-bottom: 180px; }	
    #intro-5-content .intro_slider { height: 600px; }
    #intro-9-content { padding-top: 140px; }		

    .intro-txt h2 { font-size: 45px; line-height: 48px; }
    #intro-4 .intro-txt h2 { font-size: 56px; line-height: 62px; }
    #intro-5-content .intro-txt h2 { padding-top: 178px; }
    #intro-8 .intro-txt h3 { font-size: 30px; line-height: 30px; }
    #intro-9 .intro-txt h2 { font-size: 38px; line-height: 42px; }

    .intro-txt p { font-size: 18px; line-height: 24px; }	
    #intro-6 .intro-txt { margin-top: 40px; }
    #intro-9 .intro-txt p { padding: 0 5%; }
    #intro-form form { margin: 0 5px; }

    /*------------------------------------------*/
    /*	 Content
    /*------------------------------------------*/	

    .portfolio-item .overlay-content h4 { font-size: 16px; line-height: 16px; }

    .content-3-txt.m-top-30 { margin-top: 0; }
    .cbox-3 h3 { margin-bottom: 10px; }

    .testimonial-txt p { padding: 10px 0; }

    .team_members_wrapper .col-md-3, #blog .col-md-4 { padding: 0 8px; }     

    #call-to-action { padding-top: 100px; padding-bottom: 100px; }
    #call-to-action h2 { font-size: 40px; line-height: 50px; }

    .blog-post-link a { font-size: 17px; line-height: 23px; }

    #contact-form #input_name { padding-right: 0; }
    #contact-form #input_email { padding-left: 0; }

    .footer-newsletter-widget p.no-spam { font-size: 14px; line-height: 22px; }



}



/* ------------------------------------------------------------------------ */
/* ------------------------------------------------------------------------ */
/* ------------------------------------------------------------------------ */

@media only screen and (max-width: 991px) {

    /*------------------------------------------*/
    /*	 Base
    /*------------------------------------------*/
    .fw-main-row {
        height: auto! important;
    }
    .contact-form .form-builder-item {
       padding: 0! important;
    }
    .contact-form .m-top-10{
       margin-left:15px! important;
    }
    .division .p-left-30, .division .p-left-45, .division .p-left-60 { padding-left: 15px;}
    .division .p-right-30, .division .p-right-45, .division .p-right-60 { padding-right: 15px;}

    h4.h4-lg { font-size: 18px; line-height: 24px; }
    h4 { font-size: 17px; line-height: 17px; margin-bottom: 10px; }
    h3, h3.h3-thin { font-size: 26px; line-height: 32px; }
    .section-title-thin h3 { font-size: 28px; line-height: 36px; }
    .section-title-thin h4 { font-size: 14px; line-height: 14px; }
    p.p-lg { font-size: 18px; line-height: 26px; } 

    /*------------------------------------------*/
    /*	 Navigation Menu
    /*------------------------------------------*/

    .navbar-nav > li > a { padding: 0 8px; }

    /*------------------------------------------*/
    /*	 Intro Content 
    /*------------------------------------------*/

    #intro-1-content, #intro-2-content { padding-top: 200px; padding-bottom: 160px; text-align: center; }
    #intro-3-content, #intro-7-content { padding-top: 220px; padding-bottom: 180px; }	
    #intro-5-content .intro_slider { height: 600px; text-align: center; }
    #intro-9-content { padding-top: 140px; }	

    #intro-4-content .intro-txt.text-right, #intro-6-content { text-align: center; }

    .intro-txt h2, #intro-4 .intro-txt h2 { font-size: 45px; line-height: 49px; }
    #intro-5-content .intro-txt h2 { padding-top: 178px; }
    #intro-8 .intro-txt h2 { font-size: 42px; line-height: 46px; }
    #intro-8 .intro-txt h3 { font-size: 28px; line-height: 28px; }
    #intro-9 .intro-txt h2 { font-size: 30px; line-height: 34px; }

    .intro-txt p { font-size: 18px; line-height: 24px; }
    #intro-9 .intro-txt p { padding: 0; }

    #intro-6 .intro-txt { margin-top: 0; }
    #intro-6 .intro-btn.m-top-30 { margin-top: 20px; }
    #intro-form form { width: 66%; margin: 50px auto 0; }

    /*------------------------------------------*/
    /*	 Content 
    /*------------------------------------------*/

    #content-1.wide-50 { padding-bottom: 100px; }
    .content-1-img, .content-2-img { background-position: center center; position: relative; height: 500px; width: 720px; padding-right: 15px; padding-left: 15px; margin-right: auto; margin-left: auto; }
    .content-2-img { height: 550px; left: 0; }

    .pricing-row .col-md-4 { padding: 0 3px; }
    .pricing-table .price span { font-size: 70px; line-height: 50px; }
    .pricing-table ul.features { font-size: 15px; padding: 10px 40px; }

    .statistic-number { font-size: 45px; line-height: 45px; }
    .statistic-block p { font-size: 14px; line-height: 14px; font-weight: 700; }

    #reviews { padding-top: 80px; padding-bottom: 80px; }
    .reviews-img { display: none; }

    #call-to-action { padding-top: 100px; padding-bottom: 100px; }
    #call-to-action h2 { font-size: 36px; line-height: 46px; }

    #contacts .container, #contacts .row, .contacts-form, .contacts-txt { display: block; }
    .contacts-form { padding: 60px; }
    .contact-form > div { padding: 0 15px; }

    .contact-form .form-control { padding-right: 15px; }
    .contact-form .form-control { padding-left: 15px; }	
    .form-group .btn { margin-top: 15px; }

    .footer h4 { margin-bottom: 10px; }
    .footer-icons li { margin-right: 10px; }
    .foo-social i { margin-right: 3px; } 	
    .footer-links li { display: inline-block !important; margin-right: 10px; }	
    .footer-news li { display: block !important; padding-left: 0; margin: 0 auto; }

    .fw-col-inner {
        margin: 0 ;
        padding: 15px !important;
    }
    .fw-heading.fw-heading-center {
        margin-bottom: 40px ;
        width: 100% ;
    }
    .parallax-section {
        background-attachment: scroll !important;
    }


}



/* ------------------------------------------------------------------------ */
/* ------------------------------------------------------------------------ */
/* ------------------------------------------------------------------------ */

@media only screen and (max-width: 767px) {	

    /*------------------------------------------*/
    /*	 Base
    /*------------------------------------------*/
    .fw-main-row {
        height: auto! important;
    }
    .contact-form .form-builder-item {
        padding: 0! important;
    }
    .contact-form .m-top-10{
       margin-left:-15px! important;
    }
    .division, .footer #pre-footer, .footer .footer-bottom { padding-left: 30px; padding-right: 30px; }	
    #footer.division { padding-left: 0; padding-right: 0; }

    .wide-100 { padding-top: 80px; padding-bottom: 80px; }
    .wide-80 { padding-top: 80px; padding-bottom: 60px; }
    .wide-70 {padding-top: 80px; padding-bottom: 50px;}
    .wide-60 {padding-top: 80px; padding-bottom: 40px;}
    .wide-50 {padding-top: 80px; padding-bottom: 30px;}
    .wide-40 {padding-top: 80px; padding-bottom: 20px;}

    .section-title h3 { font-size: 27px; line-height: 27px; }
    .section-title-thin h3 { font-size: 26px; line-height: 32px; }
    .section-title-thin h4 { font-size: 14px; line-height: 14px; }

    /*------------------------------------------*/
    /*	 Navigation Menu
    /*------------------------------------------*/

    .header.no-bg { margin-bottom: 60px; }

    .navbar-brand { padding: 22px 30px; }

    .navbar-nav { background: #f9f9f9; margin-top: 0; margin-bottom: 0; border-top: 1px solid #ddd; }	
    .navbar-nav > li { text-align: center; }
    .navbar-nav > li > a { color: #333; line-height: 40px; text-align: center; }
    .navbar-nav > li > p, .navbar-nav > li > p i, .navbar-nav > li > p a i { line-height: 45px; margin-left: 0; }

    .navbar-nav > li > a.demos, .navbar-nav > li > a.download {	margin-top: 0px; margin-left: 0; -webkit-border-radius: 0; -moz-border-radius: 0; border-radius: 0; }

    .header.no-bg .navbar { padding: 0; background-color: #fff; }	
    .header.no-bg .navbar .logo-white { display: none; }
    .header.no-bg .navbar .logo-black { display: block; }

    .no-bg .navbar-nav > li > a { color: #333; }
    .no-bg .navbar-nav > li > a:hover { color: #00c1f0; background-color: transparent; }
    .no-bg .navbar-nav > li > a.demos, .no-bg .navbar-nav > li > a.download { background-color: #00c1f0; border-color: #00c1f0; color: #fff; }
    .no-bg .navbar-nav > li > a.demos:hover, .no-bg .navbar-nav > li > a.download:hover { background-color: #444; border-color: #444; color: #fff; }

    /*------------------------------------------*/
    /*	 Intro Content
    /*------------------------------------------*/

    #intro-1-content, #intro-2-content, #intro-4-content { padding-top: 150px; padding-bottom: 150px; }
    #intro-3-content, #intro-7-content { padding-top: 170px; padding-bottom: 170px; }
    #intro-5-content .intro_slider { height: 560px; }
    #intro-6-content { padding-top: 100px; }
    #intro-8 { top: -60px; }
    #intro-9-content { padding-top: 80px; }

    .intro-txt h2, #intro-4 .intro-txt h2 { font-size: 40px; line-height: 43px; margin-bottom: 10px; }
    #intro-5-content .intro-txt h2 { padding-top: 165px; }

    #intro-8 .intro-txt h2 { font-size: 35px; line-height: 39px; }
    #intro-8 .intro-txt h3 { font-size: 24px; line-height: 24px; }

    .slides-navigation .next.fa-angle-right { font-size: 60px; margin-right: 20px; }
    .slides-navigation .prev.fa-angle-left { font-size: 60px;  margin-left: 20px; }

    .intro-txt p { font-size: 18px; line-height: 22px; padding: 0 8%; }
    #intro-9 .intro-txt p { font-size: 16px; line-height: 22px; }

    #intro-form form { width: 65%; }

    .intro-section .btn.m-top-20 { margin-top: 10px; }

    /*------------------------------------------*/
    /*	 Content 
    /*------------------------------------------*/

    #content-1.wide-50 { padding-bottom: 80px; }
    .content-1-img, .content-2-img { background-position: center center; position: relative; height: 500px; width: 660px; padding-right: 15px; padding-left: 15px; margin-right: auto; margin-left: auto; }
    .content-2-img { height: 500px; left: 0; }

    .portfolio-item { margin-bottom: 50px; }
    .portfolio-item:last-child { margin-bottom: 0; }

    #call-to-action { padding-top: 80px; padding-bottom: 80px; }
    #call-to-action h2 { font-size: 32px; line-height: 40px; }

    .footer-bottom.p-top-20.p-bottom-20 { padding-top: 30px; padding-bottom: 30px; }
    #footer-links.text-right { text-align: left; margin-top: 5px; }
    .foo-link { margin: 0 8px 0 0; }



}



/* ------------------------------------------------------------------------ */
/* ------------------------------------------------------------------------ */
/* ------------------------------------------------------------------------ */

@media only screen and (max-width: 640px) {

    /*------------------------------------------*/
    /*	 Base
    /*------------------------------------------*/

    h3, h3.h3-thin { font-size: 24px; line-height: 30px; }
    .section-title-thin h3 { font-size: 25px; line-height: 28px; }
    .section-title p { font-size: 16px; line-height: 24px; padding: 0; }

    /*------------------------------------------*/
    /*	 Intro Content
    /*------------------------------------------*/

    .intro-txt h2, #intro-4 .intro-txt h2 { font-size: 38px; line-height: 41px; }
    .intro-txt p { font-size: 17px; line-height: 22px; padding: 0; }

    #intro-form form { width: 78%; }

    .slides-navigation { display: none;}

    .content-1-img, .content-2-img { height: 400px; width: 530px; }
    .content-2-img { height: 350px; }

    #call-to-action h2 { font-size: 30px; line-height: 36px; }



}



/* ------------------------------------------------------------------------ */
/* ------------------------------------------------------------------------ */
/* ------------------------------------------------------------------------ */

@media only screen and (max-width : 479px) {

    /*------------------------------------------*/
    /*	 Base
    /*------------------------------------------*/

    .division, .footer #pre-footer { padding-left: 10px; padding-right: 10px; }	
    #footer.division { padding-left: 0; padding-right: 0; }	

    h4.h4-lg { font-size: 17px; line-height: 17px; }
    h3, h3.h3-thin, .section-title h3 { font-size: 24px; line-height: 30px; }
    .section-title-thin h3 { font-size: 24px; line-height: 28px; }
    .section-title-thin h4 { font-size: 13px; line-height: 13px; }
    .section-title p { font-size: 15px; line-height: 23px; padding: 0; }

    .btn { font-size: 12px; font-weight: 500; padding: 9px 20px; margin-right: 5px; }
    .btn.btn-lg { font-size: 12px; font-weight: 700; padding: 9px 20px; }

    #stlChanger { display: none; }
    #scrollUp { width: 40px; height: 40px; }

    /*------------------------------------------*/
    /*	 Navigation Menu
    /*------------------------------------------*/

    .navbar-brand { padding: 22px 15px; }
    .navbar-toggle { margin: 11px 15px 11px 0; }

    /*------------------------------------------*/
    /*	 Intro Content
    /*------------------------------------------*/

    #intro-1-content, #intro-2-content, #intro-4-content { padding-top: 140px; padding-bottom: 140px; }
    #intro-3-content, #intro-7-content { padding-top: 160px; padding-bottom: 160px; }
    #intro-5-content .intro_slider { height: 500px; }
    #intro-6-content { padding-top: 80px; padding-bottom: 80px; }
    #intro-8 .intro-txt { width: 100%; } 
    #intro-9-content { padding-top: 120px; padding-bottom: 100px; }

    .intro-txt h2, #intro-4 .intro-txt h2 { font-size: 32px; line-height: 35px; }
    #intro-5-content .intro-txt h2 { padding-top: 128px; }
    #intro-8 .intro-txt h2 { font-size: 30px; line-height: 34px; }
    #intro-8 .intro-txt h3 { font-size: 22px; line-height: 22px; }	
    #intro-9 .intro-txt h2 { font-size: 28px; line-height: 32px; }

    .intro-txt p { font-size: 16px; line-height: 22px; }	

    #intro-form form { width: 90%; }	
    #intro-form .form-control { height: 42px; }
    #intro-form h4 { font-size: 18px;  line-height: 24px; }

    #intro-9-content img { display: none; }

    /*------------------------------------------*/
    /*	 Content
    /*------------------------------------------*/

    .slogan-txt h4.h4-lg { font-size: 19px; line-height: 25px; }

    .content-1-img, .content-2-img { height: 300px; width: 406px; }
    .content-2-img { height: 300px; }

    .cbox-3 p { font-size: 15px; line-height: 23px; }

    .barWrapper h5 { font-size: 13px; }
    .tooltip > .tooltip-inner { font-size: 14px; }

    .pricing-notice p { font-size: 15px; line-height: 23px; }

    .cbox-3 h3 { margin-bottom: 10px; }

    #reviews { padding-top: 60px; padding-bottom: 60px; }
    .testimonial-txt p { font-size: 17px; line-height: 24px; }
    .review p.author { font-size: 16px; margin-bottom: 0; }	
    .review span { font-size: 12px; }
    .testimonial-txt.m-bottom-20 { margin-bottom: 0; }
    .review span { margin: 0 0 40px; }

    #call-to-action h2 { font-size: 26px; line-height: 32px; margin-bottom: 12px; }

    .contacts-txt, .contacts-form { padding: 50px 40px; }
    #form_btn .btn { font-size: 13px; font-weight: 900;	padding: 14px 30px;	}


}



/* ------------------------------------------------------------------------ */
/* ------------------------------------------------------------------------ */
/* ------------------------------------------------------------------------ */

@media (max-width: 320px) {	

    /*------------------------------------------*/
    /*	 Base
    /*------------------------------------------*/

    .division, .footer #pre-footer { padding-left: 5px; padding-right: 5px; }	
    #footer.division { padding-left: 0; padding-right: 0; }

    h4.h4-lg { font-size: 17px; line-height: 23px; }
    h4 { font-size: 16px; line-height: 16px; margin-bottom: 10px; }

    h3, h3.h3-thin, .section-title-thin h3, .section-title h3 { font-size: 20px; line-height: 24px; }
    p.p-lg { font-size: 16px; line-height: 23px; }

    .btn { margin-top: 8px; margin-right: 0; }

    /*------------------------------------------*/
    /*	 Intro Content 
    /*------------------------------------------*/

    #intro-1-content, #intro-2-content, #intro-3-content, #intro-4-content, #intro-7-content { padding-top: 120px; padding-bottom: 120px; }
    #intro-5-content .intro_slider { height: 460px; }
    #intro-9-content { padding-top: 100px; padding-bottom: 80px; }

    .intro-txt h2, #intro-4 .intro-txt h2 { font-size: 26px; line-height: 30px; }
    #intro-5-content .intro-txt h2 { padding-top: 80px; }
    #intro-8 .intro-txt h2 { font-size: 24px; line-height: 28px; }
    #intro-8 .intro-txt h3 { font-size: 18px; line-height: 18px; }		
    #intro-9 .intro-txt h2 { font-size: 24px; line-height: 28px; }

    .intro-txt p { font-size: 15px; line-height: 20px; }

    #intro-form form { width: 100%; }	
    #intro-form h4 { font-size: 16px;  line-height: 22px; }
    #intro-form p { padding: 0 5px; }

    .intro-btn.m-top-30 { margin-top: 10px; }

    .abox-icon { float: none; text-align: center; }	
    .abox-txt { margin-top: 15px; padding-left: 0; text-align: center; }

    .content-1-img, .content-2-img { height: 250px; width: 290px; }
    .content-2-img { height: 180px; }

    .portfolio-item .overlay-content h4 { font-size: 15px; line-height: 15px; }

    .pricing-table h3 { font-size: 20px; line-height: 20px; }
    .pricing-table .price span { font-size: 60px; line-height: 40px; }
    .pricing-table ul.features { font-size: 14px; padding: 10px 40px; }

    #statistic {  padding-top: 80px; padding-bottom: 40px; }
    .statistic-number { font-size: 35px; line-height: 35px; }

    .sbox { text-align: center; }
    .sbox span { float: none; }
    .sbox-txt { margin-left: 0; margin-top: 10px; }

    .testimonial-txt p { font-size: 18px; line-height: 24px; }

    #call-to-action h2 { font-size: 22px; line-height: 28px; }

    .blog-post-link a { font-size: 16px; line-height: 22px; padding: 0 20px; }
    .blog-post-meta { font-size: 12px; line-height: 12px; padding: 12px 20px 10px; }
    .blog-post-text p { padding: 0 20px 30px; }

    .contacts-txt, .contacts-form { padding: 30px 20px; }
    #form_btn { text-align: center; }
    #form_btn .btn { font-size: 13px; margin-top: 5px; font-weight: 700; padding: 12px 20px; }
    #form_btn p { font-size: 14px; line-height: 20px; }

    #footer { text-align: center; }

    .footer-newsletter-widget p.no-spam { font-size: 13px; line-height: 20px; }
    #footer-copyright, .footer-links { text-align: center; }
    #footer-copyright p { font-size: 14px; line-height: 20px; }
    .footer-icons, .footer-links, .footer-icons li, .footer-links li { display: block !important; }
    .footer-links { margin-top: 12px; }
    .foo-link { font-size: 14px; line-height: 20px; margin: 0 auto 3px; }

    .newsletter-form .input-group { display: block; text-align: center; }	
    .input-group .form-control { height: 45px; display: block; float:none!important; width: 100%; text-align: center; padding: 5px 20px; }	
    #pre-footer .newsletter-form .form-control { height: 45px; }
    #pre-footer .newsletter-form .btn { height: 45px; display: inline-block; float:none!important; width: 100%!important; margin-top: 5px; }



}