@media(min-width: 1200px){
    .container{
        max-width: 1280px;
    }
}

@media(max-width: 1500px){
    .doctor-name-heading h1 {
        font-size: 70px;
    }
    .inner-banner {
        min-height: 75vh;
       
    }
    .content-heading {
        font-size: 60px;
    }
    .sec-tagline {
        font-size: 18px;
    }
    .contact-us-banner .banner-heading {
        font-size: 60px;
    }
}

@media(max-width: 1400px){
    .common-container {
        padding: 0 10%;
    }
    
}


@media(max-width: 1300px){
    .common-container {
        padding: 0 5%;
    }
    .featured-listings .listing-wrapper .listing-info .doctor-name {
        font-size: 30px;
    }
    .featured-listings .listing-wrapper .listing-info .price .price-text {
        font-size: 14px;
    }
    .featured-listings .listing-wrapper .listing-info .location p {
        font-size: 14px;
    }
    .featured-listings .listing-wrapper .listing-info .specialty p {
        font-size: 14px;
    }
    .pagination .page-number .page-number span, .pagination .page-number .dots span {
        font-size: 20px;
    }
    .pagination .page-number .page-number, .pagination .page-number .dots {
        height: 40px;
        width: 40px;
    }
}

@media(max-width: 991px){
    header .social-media-icons {
        display: none;
    }
    header .call-wrapper a h3 {
        display: none;
    }
    header .call-wrapper a p {
        display: none;
    }
    header .top-navigation {
        justify-content: flex-start;
    }
    header .call-wrapper {
        order: 2;
    }
    header .call-wrapper a img {
        margin-right: 0;
        margin-left: 20px;
    }
    .navbar-toggler{
        position: absolute;
        top: -5rem;
        right: 0; 
    }
    header .navbar-nav {
        margin: 20px 0;
        padding: 20px;
        border-radius: 10px;
    }
    header .navbar-nav li a {
        padding: 10px;
    }
  
    .navbar-toggler {
        border: 1px solid #02AAE8;
        border-radius: 0;
        padding: 20px 10px;
        width: 30px;
        background-color: #02AAE8;
    }
    .navbar-toggler:before, .navbar-toggler:after {
        width: 30px;
        height: 2px;
        background-color: #02AAE8;
    }
    .navbar-toggler--active{
        background-color: transparent;
    }
    .filter-row {
        display: flex;
        align-items: center;
        flex-direction: column;
    }
    .filter-panel {
        margin: 0 10px 20px;
    }
    .separator span {
        font-size: 21px;
        color: #02AAE8;
    }
    .separator {
        margin-top: 0px;
    }
    .desktop-btn{
        display: none;
    }
    .mobile-button-search{
        display: block;
        padding: 2px;
        border-radius: 45px;
        background-color: #fff;
        box-shadow: 0px 5px 10px 0px rgba(0,0,0,0.2);
        border: none;
        margin: 20px 0;
    }
    .mobile-button-search div{
        background: linear-gradient(180deg, rgba(152,227,255,1) 0%, rgba(2,170,232,1) 100%);
        padding: 20px;
        border-radius: 45px;
    }
    .mobile-button-search div i{
        color: #fff;
        font-size: 20px;
        margin-right: 10px;
    }
    .mobile-button-search div span{
        font-size: 20px;
        font-family: 'Gorditas', cursive;
        color: #fff;
    }
    .search-btn-wrapper{
        width: 100%;
        max-width: 322px;
    }
    .separator {
        padding-top: 0;
        margin-bottom: 10px;
    }
    .filter-tabs {
        justify-content: flex-start;
    }
    .search-result{
        margin-bottom: 20px;
    }
    .tool-directory{
        padding-top: 10rem;
    }
    .doctor-name-heading {
        margin-top: 0;
        padding-left: 20px;
    }
    .profile-side {
        margin-top: 50px;
    }
    .inner-banner {
        min-height: 64vh;
    }
}


@media(max-width: 768px){
    .navbar-brand img{
        max-width: 200px;
    }
    .homebanner .banner-content h1 {
        font-size: 70px;
    }
    .homebanner .banner-content p {
        font-size: 16px;
    }
    .homebanner {
        min-height: 75vh;
    }
    .graphic{
        margin: 20px 0;
    }
    .content-heading {
        font-size: 40px;
    }
    .content-body {
        font-size: 14px;
    }
    .common-btn span {
        font-size: 14px;
    }
    .common-btn span img {
        max-width: 20px;
    }
    .sec-tagline {
        font-size: 14px;
    }
    .p-100 {
        padding: 50px 0;
    }
    .portal-list li h2 {
        font-size: 20px;
    }
    .featured-listings .listing-wrapper {
        margin-top: 20px;
    }
    .featured-listings .listing-wrapper .listing-info .doctor-name {
        font-size: 30px;
    }
    .featured-listings .listing-wrapper .listing-info .price .price-text {
        font-size: 14px;
    }
    .featured-listings .listing-wrapper .listing-info .location p {
        font-size: 14px;
    }
    .featured-listings .listing-wrapper .listing-info .location img {
        object-fit: contain;
        max-width: 17px;
    }
    .featured-listings .listing-wrapper .listing-info .price img {
        max-width: 17px;
    }
    .featured-listings .listing-wrapper .listing-info .specialty p {
        font-size: 14px;
    }
    .featured-listings .listing-wrapper .book-btn {
        font-size: 14px;
    }
    .service-details .count-wrapper .count {
        font-size: 60px;
    }
    .service-details .count-wrapper p {
        font-size: 16px;
        color: #000000;
    }
    .service-details .count-wrapper{
        margin-bottom: 50px;
    }
    .service-details .count-wrapper img{
        max-width: 130px;
    }
    .faq-list li .toggle-button h2 {
        font-size: 20px;
    }
    footer .footer-1 .s-media {
        margin: 20px 0;
        justify-content: flex-start;
    }
    footer .main-link {
        margin: 0px 0 20px;
    }
    footer .main-link h2 {
        font-size: 20px;
    }
    footer .main-link ul li a {
        font-size: 12px;
    }
    .mobile-button-search {
        width: 100%;
    }
    .common-btn span {
        height: 50px !important;
    }
    footer .footer-1 .s-media a {
        height: 40px;
        width: 40px;
        font-size: 15px;
    }
    footer .footer-1 img {
        max-width: 250px;
    }
    .equal-padding-100 {
        padding: 30px;
    }
    .pagination .page-number .page-number span, .pagination .page-number .dots span {
        font-size: 20px;
    }
    .profile-side .info-wrapper .price .price-text {
        font-size: 16px;
    }
    .profile-side .info-wrapper ul li a {
        font-size: 16px;
    }
    .profile-side .info-wrapper ul li a img {
        height: 15px;
    }
    .profile-side .info-wrapper .price img {
        max-width: 20px;
    }
    .profile-side .info-wrapper .profile-social-media a {
        height: 50px;
        width: 50px;
        font-size: 20px;
    }
    .profile-side .info-wrapper .profile-social-media {
        margin: 20px 0 10px;
    }
    .more-info h2 {
        font-size: 30px;
    }
    .more-info p {
        font-size: 14px;
    }
    .doctor-name-heading h1 {
        font-size: 40px;
    }
    .doctor-name-heading p {
        font-size: 14px;
    }
    .navbar-toggler {
        top: -55px;
    }
    .contact-us-banner .banner-heading {
        font-size: 40px;
        margin-top: 11rem;
    }
    .text-paragraph{
        font-size: 14px;
    }
}


@media(max-width: 650px){
    .navbar-toggler {
        top: -49px;
        padding: 15px 10px;
        width: 19px;
    }
    .navbar-toggler:before, .navbar-toggler:after {
        width: 20px;
    }
    header .call-wrapper a img {
        margin-right: 0;
        margin-left: 10px;
        max-width: 50px;
    }
    .portal-list li {
        padding: 0 20px 20px;
        width: 100%;
    }
    .portal-list {
        flex-wrap: wrap;
    }   
    .portal-list li:not(:last-child):after {
        top: unset;
        transform: rotate(90deg);
        left: 0;
        right: 0;
        margin: auto;
        width: 20%;
        bottom: 39px;
    }
    .portal-list li h2 {
        font-size: 25px;
        z-index: 20;
        position: relative;
    }
    .pagination .page-number .page-number span, .pagination .page-number .dots span {
        font-size: 16px;
    }
    .pagination .page-number .page-number, .pagination .page-number .dots {
        margin: 5px;
    }
    .pagination a.left-arrow img,
    .pagination a.right-arrow img{
        max-width: 50px;
    }
    
}


@media(max-width: 500px){
    .homebanner .banner-content h1 {
        font-size: 40px;
    }
}
@media(max-width: 350px){
    .navbar-brand img {
        max-width: 150px;
    }
    header .call-wrapper a img {
        max-width: 35px;
    }
    .navbar-toggler {
        top: -42px;
    }
}