/*
Theme Name: Goldy Clinic
Theme URI: https://www.inverstheme.com/theme/goldy-clinic/
Author: inverstheme
Author URI: https://www.inverstheme.com/
Description: Goldy Clinic is a clean, modern, user friendly, responsive and highly customizable WordPress Theme. you’ll easily find the design of this theme impressive and suitable for your Website. This Goldy Clinic WordPress theme, carries an abundance of crucial features and functionalities. For instance, featured slider, featured Section, About Section, Our Portfolio, Our team Section, Testimonial Slider, Our Services, Our Sponsors, Sticky Header, Social Information, Sidebar, Excerpt Options, and many more. All of these highly customizable features and sections are completely responsive and absolutely easy to customize. 
Template: goldy-mex
Version: 1.0.6
Tested up to: 6.3
Requires PHP: 7.0
License: GPLv3 or later
License URI: https://www.gnu.org/licenses/gpl-3.0.html
Text Domain: Goldy Clinic
Tags: custom-background, custom-logo, blog, custom-colors, custom-header, custom-menu, two-columns, grid-layout, left-sidebar, news, one-column, right-sidebar, featured-images, threaded-comments, translation-ready
*/

/*--------------------------------------------------------------
# header
--------------------------------------------------------------*/

.social_icon .fa-facebook{
    background-color: #1877F2;
}
.social_icon .fa-linkedin{
    background-color: #0077B5 ;
}
.social_icon .fa-instagram{
    background-color: #C13584;
}
.social_icon .fa-twitter{
    background-color: #1DA1F2;
}
.social_data .social_icon {
  i {
    transition: border-radius 0.2s linear, transform 0.2s linear;
    transform: none;
    
    &:hover {
      border-radius: 0px;
      transform: none;
    }
  }
}
.top_bar_info{
    padding: 5px 0px;
}
.header_social_icon {
    background-color: #ffffff;
    padding: 5px 10px;
    border-radius: 5px;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.3);
    position: relative;
    z-index: 2;
}
.main_site_header::before {
    content: '';
    position: absolute;
    opacity: 0.5;
    z-index: 9999;
}
.main_site_header::after {
    content: '';
    width: 0;
    height: 0;
    border-top: 50px solid #1a1b1b7d;
    border-left: 50px solid transparent;
    position: absolute;
    background: var(--skin-color);
    z-index: 9999;
}
.header_topbar_info{
    flex-direction: row !important;
}
.header_social_icon {
    animation: swing ease-in-out 4s infinite alternate;
    transform-origin: center -20px;
    box-shadow: 5px 5px 10px rgba(0,0,0,0.5);
}
.header_social_icon {
    border: 3px solid #f8f8f8;
}
.header_social_icon:after{
    content: '';
    position: absolute;  
    width: 20px; height: 20px;  
    border: 2px solid #999;
    top: -10px; left: 46%;
    z-index: 0;
    border-bottom: none;
    border-right: none;
    transform: rotate(45deg);
}
.header_social_icon:before{
    content: '';
    position: absolute;
    width: 5px; height: 5px;
    top: -14px;left: 50%;
    z-index: 5;
    border-radius: 50% 50%;
    background: #000;
}
@media only screen and (max-width: 768px) {
    .header_social_icon:before{
        left: 54%
    }
    .main_site_header {
        padding: 0px 10px !important;
    }
    .main_site_header::after{
        left: 0px;
    }
    .call_button_info{
        margin-right: 50px !important;
    }
}

/*--------------------------------------------------------------
# About Section
--------------------------------------------------------------*/

.about_section_container{
    flex-direction: row-reverse !important;
}
.about_pic {
    background: unset !important;
    padding-right: 40px;
    padding-bottom: 40px;
}
.about_section_info .about_data .about_pic:hover img {
    transform: inherit !important;
    opacity: inherit;
}
.about_pic:before {
    content: "";
    border: 10px solid;
    border-color: var(--skin-color);
    top: 30px;
    right: 0;
    bottom: 0;
    left: 30px;
    position: absolute;
    z-index: -1;
}
@media only screen and (max-width: 768px) {
    .about_section_container {
        flex-direction: column !important;
    }
    .about_featured_image .about_pic:before, .about_featured_image .about_pic:after {
        width: 350px !important;
        height: 200px !important;
        top: 40px !important;
        left: 40px !important;
    }
    .about_section_info .about_pic img {
        height: 200px !important;
    }
}

/*--------------------------------------------------------------
# Featured Section
--------------------------------------------------------------*/

.section-featured-content .featured-icon {
    width: 60px;
    height:60px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 10px auto;
    border-radius: 50%;
    background: rgb(244 27 59 / 7%);
    font-size: 28px;
    transition: all ease 0.4s;
    position: relative;
}
 .section-featured-wrep .featured-icon:after {
    -webkit-transition: box-shadow 0.2s;
    -moz-transition: box-shadow 0.2s;
    transition: box-shadow 0.2s;
    webkit-animation: spinAround 9s linear infinite;
    -moz-animation: spinAround 9s linear infinite;
    animation: spinAround 9s linear infinite;
    opacity: 1;
}
.featured-icon:after {
    top: -8px;
    left: -8px;
    padding: 6px;
    z-index: 10;
    border: 2px dashed #000000;
    pointer-events: none;
    position: absolute;
    width: 100%;
    height: 100%;
    border-radius: 50%;
    content: '';
    -webkit-box-sizing: content-box;
    -moz-box-sizing: content-box;
    box-sizing: content-box;
    opacity: 0;
}
@keyframes spinAround{
    0% {
        transform: rotate(0deg);
    }
    100% {
        transform: rotate(360deg);
    }
}
.featured-section_data .section-featured-wrep:hover i {
    transform: none !important;
}
.featured-section_data .featured_content .featured-thumbnail:after{
    background: transparent !important;
}
.featured-section_data .card-container{
    filter: none !important;
}
.featured-title h4{
    border-bottom: 2px solid var(--skin-color);
}

/*--------------------------------------------------------------
# Portfolio Section
--------------------------------------------------------------*/

.fa-window-minimize:before{
    content: none !important;
}
i.fa.fa-arrow-right{
    border: none !important;
}
.our_port_containe{
    filter: none !important;
}
.our_portfolio_info .wrappers .parent{
    box-shadow: none !important;
}
.our_portfolio_info .wrappers .parent{
    background: #f9f9f9 !important;
}
.our_portfolio_container h3{
    background-color: #bdbdbd94;
    border-left: 3px solid black;
    border-right: 3px solid black;
}
.our_portfolio_btn a {
    transition: all 0.3s ease;
}
.our_portfolio_btn a:hover {
    padding-left: 20px;
}

/*--------------------------------------------------------------
# Appointment Section
--------------------------------------------------------------*/

.appointment_data{
    flex-direction: row-reverse;
}
.appointment_data  {
    position: relative;
    height: 600px;
}
.appointment_fields_data {
    position: absolute;
    top: 50%;
    left: 28%;
    height: 600px;
    transform: translate(-50%, -50%);
    box-shadow: 
        3px 3px 5px rgba(0, 0, 0, 0.2),
        6px 6px 10px rgba(0, 0, 0, 0.15),
        9px 9px 15px rgba(0, 0, 0, 0.1);
    padding: 20px;
}
.appointment_fields_data:before{
    background: linear-gradient(90deg, var(--skin-color), #000000);
    position: absolute;
    content: "";
    left: 0;
    bottom: 0;
    width: 100%;
    height: 4px;
}
.appointment_fields_data:after{
    background: linear-gradient(90deg, #000000, var(--skin-color));
    position: absolute;
    content: "";
    left: 0;
    top: 0;
    width: 100%;
    height: 4px;
}
.appointment_featured_image {
    width: 100% !important;
    height: 500px;
    margin: auto;
}
.bookan_appoinment_button{
    margin-top: 5px;
}
form.appoinment_reset input[type="text"], input[type="email"], input[type="number"], .af_table_data textarea{
    background: #00000033;
    border-bottom-color: #ffffff;
}
@media only screen and (max-width: 768px) {
    body .appointment_data {
        display: block !important;
        padding:10px;
    }
    .appointment_fields_data{
        top: 50%;
        left: 50%;
        padding-left: 20px !important;
        padding-right: 20px !important;
    }
    .appointment_featured_image{
        min-height: 570px !important;
    }
    .appointment_section_info .appointment_fields_data{
        background-color: #0000001c !important;
    }
    .appointment_title h2 {
        background: #eeeeee;
        line-height: 2;
    } 
}

/*--------------------------------------------------------------
# Team Section
--------------------------------------------------------------*/

.our_team_container_data:hover img{
    -webkit-animation: imghvr-zoom-out-right 1s linear;
            animation: imghvr-zoom-out-right 1s linear;
    -webkit-animation-iteration-count: 1;
            animation-iteration-count: 1;
    -webkit-animation-fill-mode: forwards;
            animation-fill-mode: forwards;
}

@-webkit-keyframes imghvr-zoom-out-right {
    50% {
        -webkit-transform: scale(0.8) translateX(0%);
                transform: scale(0.8) translateX(0%);
        opacity: 0.5;
    }
    100% {
        -webkit-transform: scale(0.8) translateX(150%);
                transform: scale(0.8) translateX(150%);
        opacity: 0.5;
    }
}

@keyframes imghvr-zoom-out-right {
    50% {
        -webkit-transform: scale(0.8) translateX(0%);
                transform: scale(0.8) translateX(0%);
        opacity: 0.5;
    }
    100% {
        -webkit-transform: scale(0.8) translateX(150%);
                transform: scale(0.8) translateX(150%);
        opacity: 0.5;
    }
}

/*--------------------------------------------------------------
# testimonials Section
--------------------------------------------------------------*/

.our_testimonials_container p{
    text-align: left !important;
}
.our_testimonials_container .image_testimonials img{
    border: none !important;
    filter: none !important;
    border-radius: 70% 30% 30% 70% / 60% 40% 60% 40%;
    height: 100px !important;
    width: 100px !important;
}
.image_testimonials{
    top: 50px;
    left: 30px;
}
.testinomial_description{
    padding: 25px !important;
    border-color: var(--skin-color) !important;
}
.our_testimonial_icon i{
    font-size: 30px !important;
    position: relative;
    top: 210px;
    left: 120px
}
.our_testimonial_section .our_testimonial_info .testinomial_owl_slider .our_testimonial_data_info{
    padding: 0px 30px !important;
    margin-top: -60px;
}
@media only screen and (max-width: 768px) {
    .image_testimonials{
        left: -80px;
    }
    .testinomial_description{
        padding: 45px !important;
    }
    .our_testimonial_icon i{
        top: 220px;
        left: 140px;
    }
}

/*--------------------------------------------------------------
# Sponsors Section
--------------------------------------------------------------*/

.our_sponsors_img {
    display: inline-block;
    overflow: hidden;
    border-radius: 10px;
}
.our_sponsors_img img {
    display: block;
    width: 100%;
    height: auto;
    transition: transform 0.3s ease;
}
.our_sponsors_img:hover img {
    transform: scale(1.2);
}

/*--------------------------------------------------------------
# Services Section
--------------------------------------------------------------*/

.widget_section_one, .widget_section_two, .widget_section_three{
    border-radius: 0px !important;
    border: 2px solid #000000;
}
.widget_section_two{
    margin: 50px 0px;
}
.first_widget_heading, .tdt_heading{
    background-color: var(--skin-color);
    padding: 0px 10px;
    border-radius: 40px;
    text-align: center;
    position: relative;
}

/*--------------------------------------------------------------
# Funfact Section
--------------------------------------------------------------*/

.goldy_mex_funfact_content{
    border: none !important;
    border-radius: 10px;
}
.heading_main_title h2::after{
    background-color: transparent !important;
}

/*--------------------------------------------------------------
# Blog
--------------------------------------------------------------*/

.blog main.site-main.content_boxed .main_containor.grid_view article{
    border: 2px solid #000000;
}

/*--------------------------------------------------------------
# Scrolling-btn
--------------------------------------------------------------*/

.scrolling-btn i{
    text-shadow: 0px -6px #ffffff;
}
.scrolling-btn{
    width: 30px !important;
    height: 36px !important;
    display: flex;
    justify-content: center;
    align-items: center;
    background-image: linear-gradient(to top, #30cfd0 0%, #330867 100%);
}

/*--------------------------------------------------------------
# Prev & Next
--------------------------------------------------------------*/

i.fa.fa-angle-right, i.fa.fa-angle-left{
    font-size: 40px !important;
}
.our_testimonial_section button.owl-next{
    right: -2% !important;
}
.our_testimonial_section button.owl-prev {
    left: -2% !important;
}
.our_testimonial_section .our_testimonial_info .owl-carousel .owl-nav button.owl-prev, .our_testimonial_section .our_testimonial_info .owl-carousel .owl-nav button.owl-next{
    top: 55% !important;
    height: 43px !important;
}
@media only screen and (max-width: 768px) {
    .owl-prev {
        left: 2% !important;
    }
    .owl-next {
        right: 2% !important;  
    }
}

/*--------------------------------------------------------------
# Button
--------------------------------------------------------------*/

.buttons:hover, .wp-block-search__button:hover, .nav-previous a:hover, .nav-next a:hover{
    background-color: black;
    color: white;
    animation: swing ease-in-out 1s;
}
.buttons{
    width: 140px !important;
    text-align: center; 
    border: none !important;
}
.wp-block-search__button{    
    border: none !important;
}
.wp-block-search__button:hover{
    background-color: #000000 !important;
    color: #ffffff !important;
}