/* ==========================================================================
   Big Layout: 1370px.
   ========================================================================== */
@media only screen and (min-width: 1401px) and (max-width: 1600px) { 
    #familly_area .right_familly_area {padding: 50px 50px 15px;width: 58%;}
    #familly_area .left_familly_area {width: 42%;}  
}
/* ==========================================================================
   Laptop Layout: 1370px.
   ========================================================================== */
@media only screen and (min-width: 1220px) and (max-width: 1400px) { 
   
    #familly_area .left_familly_area {width: 45%;}
    #familly_area .right_familly_area h2 {font-size: 25px;margin-bottom: 10px;}
    #familly_area .right_familly_area {padding: 50px 30px 15px;width: 55%;}
}

/* ==========================================================================
   Medium Layout: 1280px.
   ========================================================================== */
@media only screen and (min-width: 992px) and (max-width: 1219px) { 
    #header_area .schedule_area a {border: 1px solid #028097; padding: 8px 20px;font-size: 12px;}
    #familly_area .right_familly_area h2 {font-size: 40px;}
    #familly_area .left_familly_area {width: 45%;}
    #familly_area .right_familly_area {padding: 30px 25px 10px;width: 55%;}
    #familly_area .right_familly_area h2 {font-size: 25px;margin-bottom: 8px;}
    #familly_area .right_familly_area p {font-size: 14px;line-height: 1.5em;}
    #familly_area .right_familly_area a {font-size: 14px; margin-top: 10px;}
    #appoinment_area .right_icon_area {width: 390px;}    
    #appoinment_area .left_appoinment_area {padding: 50px 20px;}  
    #appoinment_area .right_icon_area h2 {font-size: 30px;} 
    #appoinment_area .right_appoinment_area {padding: 50px 40px 10px;}    
}
/* ==========================================================================
   Tablet Layout: 768px. 
   ========================================================================== */
@media only screen and (min-width: 200px) and (max-width: 991px) { 
    #top_header_area .col-md-6, #top_header_area .col-md-6:last-child {text-align: center;margin-bottom: 10px}
    #top_header_area .col-md-6:last-child {margin-bottom: 0px}
    #header_area .col-md-2 {text-align: center;}
    #main_menu ul#nav { text-align: center;}
    #main_menu ul#nav li a {font-size: 14px;padding: 10px;}
    #service_area .col-md-3 {margin-bottom: 25px;}
    #familly_area .left_familly_area { width: 100%;}  
    #familly_area .left_familly_area img {width: 100%;height: auto;}  
    #familly_area .right_familly_area {padding: 15px 20px;width: 100%;}
    #familly_area .right_familly_area h2 {font-size: 25px;}  
    #testimonial_area .item h3 {bottom: -205px;}
    #testimonial_area .item h4 {bottom: -220px;}
    #appoinment_area .left_appoinment_area, #appoinment_area .right_appoinment_area {padding: 30px 10px;width: 100%;} 
    #appoinment_area .left_icon_area { width: 10%;}
    #appoinment_area .right_icon_area {width: 90%;} 
    #appoinment_area .right_icon_area h2, #appoinment_area .right_appoinment_area h3 {font-size: 25px;}
    #appoinment_area .right_appoinment_area i {font-size: 30px;}
    #footer_area {padding: 30px 0 20px;}       
}
/* ==========================================================================
   Wide Mobile Layout: 480px.
   ========================================================================== */
@media only screen and (min-width: 200px) and (max-width: 767px) { 
    .slicknav_menu {display: block;}
    .slicknav_btn {top: 30px;position: absolute;}
    #header_area {padding: 12px 0;}    
    #header_area .col-md-2 {float: left;text-align: left;width: 50%;}  
    #header_area .schedule_area {margin-top: 15px;}    
    #header_area .schedule_area a {border: 1px solid #028097;float: right;font-size: 12px;padding: 5px 15px;}    
    #main_menu {display: none;} 
    #slider_area .inner_slider {display: none;}  
    #service_area {padding: 30px 0 50px;}    
    #service_area .col-md-3 h2 {font-size: 30px;}    
    #service_area .col-md-3 h6 {right: 15px;}   
    #testimonial_area {padding: 30px 0;}  
    #testimonial_area .row:first-child h1 {font-size: 25px;}  
    #service_area .col-md-3 a { font-size: 13px; padding: 8px 25px 7px;}  
    #familly_area .right_familly_area h2 {font-size: 20px;margin-bottom: 10px;}    
    #familly_area .right_familly_area h5 {font-size: 18px;letter-spacing: 2px;margin-bottom: 5px}    
    #testimonial_area .row:first-child {margin-bottom: 0;} 
    #quote-carousel {margin-top: 10px;}
    #testimonial_area .item {padding: 0 10px;}
    #testimonial_area .item h3 {bottom: 0; position: relative;margin-bottom: 0}
    #testimonial_area .item h4 {bottom: 0; position: relative;}
    #quote-carousel .carousel-indicators {bottom: -20px;margin: 0;right: 0;top: auto;width: 100%;left: 0;}   
    #quote-carousel .carousel-indicators li {border: 2px solid #ccc;height: 50px;width: 50px;} 
    #quote-carousel .carousel-indicators .active {height: 50px;top: 0px;width: 50px;} 
    #testimonial_area .col-md-12 {padding-bottom: 35px;}  
    #appoinment_area .left_icon_area i {font-size: 20px;}
    #appoinment_area .right_icon_area h4 {font-size: 15px;}  
    #appoinment_area .right_appoinment_area ul li {font-size: 12px;padding: 5px;}
    #appoinment_area .left_appoinment_area, #appoinment_area .right_appoinment_area {padding: 30px 10px;}    
    #content_area .col-md-4 {width: 100% !important;} 
    #pagenavi .wp-pagenavi span.pages, #pagenavi .wp-pagenavi .page-numbers {font-size: 12px;padding: 5px 10px;}   
}