/* 
   ------------------------------------------------------
     Responsive Styles
   ------------------------------------------------------
*/


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

 /*------------------------------------------*/
 /*  INTRO CONTENT
 /*------------------------------------------*/
 
 #intro h2 { font-size: 70px; line-height: 80px;}
 .intro_text p { font-size: 16px; }
 
 /*------------------------------------------*/
 /*  INTRO REGISTER FORM 
 /*------------------------------------------*/

 .form_register form { margin: 0 15px;}
 
 /*------------------------------------------*/
 /* TABS HOLDER IMAGE
 /*------------------------------------------*/

 #tabs-holder img { margin-top: 40px;} 
 
 /*------------------------------------------*/
 /* ACCORDION HOLDER IMAGE
 /*------------------------------------------*/

 #accordion-holder img { margin-top: 60px;} 

 /*------------------------------------------*/
 /*   STATISTIC BLOCK
 /*------------------------------------------*/ 

 .statistic-number {font-size: 80px; line-height: 80px; }
 .statistic-text {font-size: 22px;}
  
 /*------------------------------------------*/
 /*  Portfolio Overlay Content 
 /*------------------------------------------*/
 
 .overlay-content h4 {font-size: 20px;}
 .portfolio-item:hover .overlay-content { bottom: 35%; }
 
 /*------------------------------------------*/
 /*  Table Body
 /*------------------------------------------*/

 .pricing-table ul.features {font-size: 14px;padding: 5px 30px;}
 
 /*------------------------------------------*/
 /*  NEWSLETTER
 /*------------------------------------------*/
 
 #newsletter_form {width: 60%;}
 
 /*------------------------------------------*/
 /*   Newsletter Form Input
 /*------------------------------------------*/

 #newsletter form input[type="email"] { width: 70%;}
 #newsletter form input[type="submit"] {width: 29%;}
 
 
}


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

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

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

 /*------------------------------------------*/
 /*  INTRO CONTENT
 /*------------------------------------------*/
 
 #intro_content {padding-top: 190px; padding-bottom: 140px; text-align: center; }
 #intro h2 { font-size: 70px; line-height: 80px; padding: 0 4%;}
 #intro h3 { font-size: 32px; }
 .intro_text p { padding: 0 15%; }
 
 /*------------------------------------------*/
 /*  INTRO BUTTONS
 /*------------------------------------------*/

 .intro_buttons { margin-bottom: 40px; text-align: center; }
 
 /*------------------------------------------*/
 /*  INTRO REGISTER FORM  
 /*------------------------------------------*/

 #intro_form { width: 76%; margin-left: 12%;}
 
 /*------------------------------------------*/
 /*   FEATURE BOX
 /*------------------------------------------*/
 
 .features-box { text-align: center;}

 /*------------------------------------------*/
 /*   Feature Icon
 /*------------------------------------------*/

 .icon-box { width: auto; height: auto; float: none !important;margin-bottom: 10px;}
 .icon-box i {margin-top: 0;}
 
 /*------------------------------------------*/
 /*   Feature Text
 /*------------------------------------------*/

 .features-text { padding: 0px;}
 .features-text p {padding-right: 0;}

 /*------------------------------------------*/
 /* TABS HOLDER IMAGE
 /*------------------------------------------*/

 #tabs-holder img { margin-top: 30px; margin-bottom: 20px;} 
 
 /*------------------------------------------*/
 /* ACCORDION HOLDER IMAGE
 /*------------------------------------------*/

 #accordion-holder img { margin-bottom: 40px;} 
 
 /*------------------------------------------*/
 /*  Message Text
 /*------------------------------------------*/

 .client-msg p {font-size: 16px; line-height: 24px;}
 
 /*------------------------------------------*/
 /*   STATISTIC BLOCK
 /*------------------------------------------*/ 

 .statistic-number {font-size: 75px; line-height: 75px; }
 .statistic-text {font-size: 20px;}
 
 /*------------------------------------------*/
 /* Timeline Item Content
 /*------------------------------------------*/
 
 .timeline-item-content { text-align: center;}
 
 /*------------------------------------------*/
 /* Timeline Item Content Arrow
 /*------------------------------------------*/

 .timeline-item:before,
 .timeline-item-content:before, 
 .timeline-item-content.pull-right:before { display: none;}  
   
 /*------------------------------------------*/
 /*  Portfolio Overlay Content 
 /*------------------------------------------*/
 
 .overlay-content h4 {font-size: 20px;}
 .portfolio-item:hover .overlay-content { bottom: 35%; }
 
 /*------------------------------------------*/
 /*    Button Settings
 /*------------------------------------------*/ 

 #gallery-filter .btn-group > .btn {font-size: 14px;margin: 0 3px;padding: 6px 12px;}
 
 /*------------------------------------------*/
 /*  Clients Carousel Navigation
 /*------------------------------------------*/

 .customNavigation {right: 47%;}
 
 /*------------------------------------------*/
 /*  Google Map
 /*------------------------------------------*/ 
 
 .map-canvas { height: 450px;}
 
 /*------------------------------------------*/
 /*  NEWSLETTER
 /*------------------------------------------*/
 
 #newsletter_form {width: 75%;}
 
 /*------------------------------------------*/
 /*   Newsletter Form Input
 /*------------------------------------------*/

 #newsletter form input[type="email"] { width: 65%;}
 #newsletter form input[type="submit"] {width: 34%;}

 
}


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

 /*------------------------------------------*/
 /*  Section Titlebar
 /*------------------------------------------*/

 .titlebar h2 {font-size: 32px;}
 .titlebar h3 {font-size: 22px;}
 .titlebar h2:after { width: 140px;}

 #services, #features, #about, #about-1, #skills, #history, #team, #pricing, #blog, #contact-info, #testimonials, #contact { padding-left: 30px; padding-right: 30px; }
 
 /*------------------------------------------*/
 /*  Logo Image    
 /*------------------------------------------*/

 .navbar-brand {padding: 20px 30px;}  
 
 /*------------------------------------------*/
 /*  Navigation Menu    
 /*------------------------------------------*/

 .navbar { background-color: #262626; padding: 0px; }
 
 /*------------------------------------------*/
 /*  Responsive Menu
 /*------------------------------------------*/
 
 .navbar-nav { margin: 0 -15px; border-top: 1px solid #444; background-color: #262626;} 
 .navbar-nav > li { text-align: center;}
 .navbar-nav > li > a { line-height: 45px; text-align: center;} 
 
 /*------------------------------------------*/
 /*  INTRO CONTENT
 /*------------------------------------------*/
 
 #intro_content {padding-top: 160px; padding-bottom: 120px;text-align: center; }
 #intro h2 { font-size: 60px; line-height: 70px; padding: 0 8%;}
 #intro h3 { font-size: 30px; }
 .intro_text p { padding: 0 15%;}
 
 /*------------------------------------------*/
 /*  INTRO BUTTONS
 /*------------------------------------------*/

 .intro_buttons .btn-theme {font-size: 16px; padding: 8px 16px;}
  
 /*------------------------------------------*/
 /*  Circle Progress Bars
 /*------------------------------------------*/

 #skills {padding-bottom: 20px;}
 #skills .col-sm-3 { margin-bottom: 60px;}
 
 /*------------------------------------------*/
 /*   STATISTIC BLOCK
 /*------------------------------------------*/ 

 .statistic-number {font-size: 60px; line-height: 55px; }
 .statistic-text {font-size: 18px;}
 
 /*------------------------------------------*/
 /*  Portfolio Overlay Content 
 /*------------------------------------------*/
 
 .portfolio-item:hover .overlay-content { bottom: 38%; }
 
 /*------------------------------------------*/
 /*  PROMO LINE CONTENT
 /*------------------------------------------*/  

 #promo_line h2 {font-size: 30px;line-height: 36px;}
 #promo_line p {font-size: 16px;line-height: 30px;}
 
 /*------------------------------------------*/
 /*   TESTIMONIALS
 /*------------------------------------------*/ 

 .testimonial { padding: 0 10%; margin-bottom: 30px;}
 
 /*------------------------------------------*/
 /*  NEWSLETTER
 /*------------------------------------------*/

 #newsletter_form {width: 85%;}
 
 /*------------------------------------------*/
 /*   Newsletter Form Input
 /*------------------------------------------*/

 #newsletter form input[type="email"] { width: 65%;}
 #newsletter form input[type="submit"] {width: 34%;}

 
}


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

 /*------------------------------------------*/
 /*  INTRO CONTENT
 /*------------------------------------------*/
 
 #intro_content {padding-top: 80px; padding-bottom: 100px; }
    #intro h1 {
        font-size: 28px;
        line-height: 45px;
        padding: 0 5%;
        color: #fff;
    }
 #intro h2 { font-size: 38px; line-height: 45px; color: #fff; padding: 0 5%;}
 #intro li {text-align: left; padding-left: 40px; font-size: 25px; color: #fff; }
 #intro h3 { font-size: 28px; }
 .intro_text p { font-size: 16px; padding: 0 12%;}
 
 /*------------------------------------------*/
 /*  INTRO REGISTER FORM  
 /*------------------------------------------*/

 #intro_form { width: 80%; margin-left: 10%; margin-top: 30px;}
 
 /*------------------------------------------*/
 /*   Service Box
 /*------------------------------------------*/

 .service-box h4 {font-size: 18px;}
 .service-box p {font-size: 14px; line-height: 24px;}
 
 /*------------------------------------------*/
 /*   como-lo-viste-en
 /*------------------------------------------*/
    

 #como-lo-viste-en{
  height:auto;
  background: #fff;
 }

    .content-gris{
  padding-left: 30px;
 padding-right: 30px;
 padding-top: 35px;
    width: 100%;
    height: 100%;
    border-radius: 23px;
    background: #EDEDED;
 text-align: center;
 }
 
 #como-lo-viste-en h3 {
  padding-left: 30px;
  padding-right: 30px;
  padding-top: 50px;
  font-size: 50px;
    color: #005A6B;
    font-weight: 700;
    line-height: 50px;
    margin-bottom: 15px;
    letter-spacing: 1px;
 }


    .img-telefono{
  text-align: center;
    width: 100% \9;
    max-width: 100%;
    height: 100%;
 }





/*------------------------------------------*/
 /*   Como funciona
 /*------------------------------------------*/
    
 #pos-como-funciona h3{
  padding-left: 30px;
  padding-right: 30px;
  padding-top: 50px;
  font-size: 40px;
    color: #005A6B;
    font-weight: 700;
    line-height: 50px;
    margin-bottom: 15px;
    letter-spacing: 1px;
 }

 #pos-como-funcina .img-2{
  display:block;
margin:auto;
  text-align: center;
 }
.agenda-tu-cita{
 text-align: center;
 width: 100%;
 height: auto;
}
#como-funciona .content-caja-1{
 display: flex;
    flex-direction: column;
    justify-content: flex-start;
    flex-wrap: nowrap;
    align-items: center;
}

#como-funciona .content-caja-2{
 display: flex;
    flex-direction: column;
    justify-content: flex-start;
    flex-wrap: nowrap;
    align-items: center;
}

     /*------------------------------------------*/
 /*   FEATURE BOX TEXT
 /*------------------------------------------*/

 .features-text p {font-size: 14px; line-height: 22px;}
 
 /*------------------------------------------*/
 /* TABS
 /*------------------------------------------*/

 .nav-tabs > li > a {font-size: 20px;}

 /*------------------------------------------*/
 /* Tab Description
 /*------------------------------------------*/

 .tab-content > .tab-pane p {font-size: 14px; line-height: 24px;}
  
 /*------------------------------------------*/
 /* Panel Title
 /*------------------------------------------*/

 .panel-title {font-size: 18px;}
 
 /*------------------------------------------*/
 /* Panel Title Icon
 /*------------------------------------------*/

 .panel-title i {font-size: 24px;}

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

 .panel-body {font-size: 14px;line-height: 24px;}
 
 /*------------------------------------------*/
 /*   Team Member
 /*------------------------------------------*/
 
 .team_members_wrapper .col-xs-6 { width: 100%; float: none !important;  }
 .team-img-meta p {padding: 0 10%;}
 
 /*------------------------------------------*/
 /*  Pricing
 /*------------------------------------------*/
 
 .price-row .col-xs-6 { width: 100%; float: none !important; }
 .pricing-table {margin: 0 40px;}

 /*------------------------------------------*/
 /*   STATISTIC BLOCK
 /*------------------------------------------*/ 

 .statistic-number {font-size: 50px; line-height: 50px; }
 .statistic-text {font-size: 18px;}
 
 /*------------------------------------------*/
 /*  TIMELINE ITEM 
 /*------------------------------------------*/
 
 .timeline-item-content {font-size: 14px;line-height: 24px;}
 
 /*------------------------------------------*/
 /*   TESTIMONIALS
 /*------------------------------------------*/ 

 .testimonial { padding: 0 5%;}
 
 /*------------------------------------------*/
 /*  PROMO LINE CONTENT
 /*------------------------------------------*/  

 #promo_line h2 {font-size: 24px;line-height: 30px;}
 #promo_line p {font-size: 14px;line-height: 24px;}
 
 /*------------------------------------------*/
 /*   NEWSLETTER
 /*------------------------------------------*/ 
 
 #newsletter p {font-size: 14px;line-height: 24px;}
 
 /*------------------------------------------*/
 /*   Newsletter Form Input
 /*------------------------------------------*/

 #newsletter form input[type="email"] {width: 65%; padding: 10px 15px;}
 #newsletter form input[type="submit"] {width: 34%; padding: 10px 15px;}
  
 
}


@media (max-width: 480px) {

 #stlChanger {display: none;}

 /*------------------------------------------*/
 /*  Section Titlebar
 /*------------------------------------------*/

 .titlebar h2 {font-size: 30px;}
 .titlebar h3 {font-size: 20px;}
 .titlebar h2:after { width: 120px;}

 #services, #features, #about,  #about-1, #skills, #history, #team, #pricing, #blog, #contact-info, #testimonials, #contact { padding-left: 15px; padding-right: 15px; }
 
 /*------------------------------------------*/
 /*  INTRO CONTENT
 /*------------------------------------------*/
 
 #intro_content {padding-top: 150px; padding-bottom: 100px; }
 #intro h2 { font-size: 50px; line-height: 55px; padding: 0 5%;}
 #intro h3 { font-size: 24px; margin-bottom: 20px; }
 .intro_text p { font-size: 16px; padding: 0 5%;}
 
 /*------------------------------------------*/
 /*  INTRO BUTTONS
 /*------------------------------------------*/
 
 .intro_buttons .btn-theme {font-size: 14px; padding: 7px 14px;}
 
 /*------------------------------------------*/
 /*  INTRO REGISTER FORM  
 /*------------------------------------------*/

 #intro_form { width: 100%; margin-left: 0%;}
 .form_register form { margin: 0 15px;}
 
 /*------------------------------------------*/
 /*  Circle Progress Bars
 /*------------------------------------------*/

 #skills .col-sm-3 { width: 100%; float: none!important;}
 
 /*------------------------------------------*/
 /*   Statistic Banner
 /*------------------------------------------*/ 
 
 #statistic_banner {padding-top: 80px; padding-bottom: 80px;}
 #statistic_banner .titlebar {margin-bottom: 30px;}
 .statistic-block {width: 100%; float: none; margin-top: 40px;}
 .statistic-number {font-size: 60px; line-height: 60px; }
 .statistic-text {font-size: 20px;}

 /*------------------------------------------*/
 /*   Portfolio Item
 /*------------------------------------------*/
 
 .portfolio-item { width: 100%; float: none !important; }
 
 /*------------------------------------------*/
 /*    Portfolio Button Settings
 /*------------------------------------------*/ 

 #gallery-filter .btn-group > .btn {font-size: 14px; margin: 0 3px 5px; padding: 5px 10px;}
 
 /*------------------------------------------*/
 /*   Team Member Meta
 /*------------------------------------------*/

 .team-img-meta p {padding: 0;}
 
 /*------------------------------------------*/
 /*  Our Clients
 /*------------------------------------------*/
 
 #clients {padding-bottom: 80px;}
 .customNavigation {display: none;}
 
 /*------------------------------------------*/
 /*  PROMO LINE CONTENT
 /*------------------------------------------*/  

 #promo_line h2 {font-size: 20px;line-height: 24px;}
 #promo_line p {font-size: 14px;line-height: 20px;}
 
 /*------------------------------------------*/
 /*   TESTIMONIALS
 /*------------------------------------------*/ 

 #testimonials h3 { font-size: 24px; line-height: 32px;}
 .testimonial { padding: 0;}
 
 /*------------------------------------------*/
 /*   Newsletter Form Input
 /*------------------------------------------*/

 #newsletter form input[type="email"], 
 #newsletter form input[type="submit"] { font-size: 14px;}
 
 /*------------------------------------------*/
 /*  NEWSLETTER
 /*------------------------------------------*/

 #newsletter_form {width: 100%;}
 #newsletter h3 { font-size: 20px;}
 
 /*------------------------------------------*/
 /*   Newsletter Form Input
 /*------------------------------------------*/

 #newsletter form input[type="email"] { width: 65%;}
 #newsletter form input[type="submit"] {width: 34%;}
 
 /*------------------------------------------*/
 /*  Contact Info
 /*------------------------------------------*/  
 
 .contact-info { width: 100%; float: none !important; }
 
 /*------------------------------------------*/
 /*  Google Map
 /*------------------------------------------*/ 
 
 .map-canvas { height: 400px;}

 
}


@media (max-width: 320px) {

 /*------------------------------------------*/
 /*  Theme Button
 /*------------------------------------------*/

 .btn-theme {font-size: 13px; padding: 6px 12px;}

 /*------------------------------------------*/
 /*  Section Titlebar
 /*------------------------------------------*/

 .titlebar h2 {font-size: 28px; line-height: 34px;}
 .titlebar h3 {font-size: 18px;}
 .titlebar h2:after { width: 100px;}

 #services, #features, #about,  #about-1, #skills, #history, #team, #pricing, #blog, #contact-info, #testimonials, #contact { padding-left: 5px; padding-right: 5px; }
 
 /*------------------------------------------*/
 /*  INTRO CONTENT
 /*------------------------------------------*/
 
 #intro_content {padding-top: 130px; padding-bottom: 80px; }
 #intro h2 { font-size: 32px; line-height: 42px; margin-bottom: 5px; padding: 0;}
 #intro h3 { font-size: 16px; margin-bottom: 20px; }
 .intro_text p { font-size: 14px; line-height: 22px; padding: 0;}
 
 /*------------------------------------------*/
 /*  INTRO BUTTONS
 /*------------------------------------------*/
 
 .intro_buttons .btn-theme {margin-bottom: 15px;}
 
 /*------------------------------------------*/
 /*  INTRO REGISTER FORM  
 /*------------------------------------------*/
 
 .form_register h4 { font-size: 18px; }
 .form_register form { margin: 0;}
 
 /*------------------------------------------*/
 /*   Service Box Buttons
 /*------------------------------------------*/

 #service-buttons a {margin-bottom: 10px;}
 
 /*------------------------------------------*/
 /* TABS
 /*------------------------------------------*/

 .nav-tabs > li > a {font-size: 16px;}
 
 /*------------------------------------------*/
 /*   Statistic Banner
 /*------------------------------------------*/ 
 
 .statistic-number {font-size: 40px; line-height: 30px; }
 .statistic-text {font-size: 18px;}
 
 /*------------------------------------------*/
 /*  Pricing
 /*------------------------------------------*/
 
 .pricing-table {margin: 0;}
 
 /*------------------------------------------*/
 /*  PROMO LINE CONTENT
 /*------------------------------------------*/  

 #promo_line a {margin-bottom: 10px;}
 #promo_line p {font-size: 14px;line-height: 20px;}
 
 /*------------------------------------------*/
 /*   NEWSLETTER
 /*------------------------------------------*/
 
 #newsletter h3 {font-size: 16px; line-height: 22px;}
 #newsletter p {font-size: 14px;line-height: 20px;}
 
 /*------------------------------------------*/
 /*   Newsletter Form Input
 /*------------------------------------------*/
 
 #newsletter form input[type="email"] {width: 100%; font-size: 14px; margin-bottom: 10px;}
 #newsletter form input[type="submit"] {width: 100%; font-size: 14px;} 
 .message {font-size: 16px;}
 
 #footer_copyright p {line-height: 24px;}

 
}