/*
Theme Name: Shantal Marketing Médico
Text Domain: Shantal Marketing Médico
Version:1.2 
Description: Tema Criado em parceria com a Shantal Marketing Digital, desenvolvido por Joao Antonio Rocco (joao.a.rocco@gmail.com)
Tags: responsive,wordpress theme, bootstrap
Author: Joao Antonio
Author URI: https://marketingdigitalmedicos.com.br
Theme URI:  https://marketingdigitalmedicos.com.br
*/

/****** GLOBALS *****/
a:active,a:focus,input:active,input:focus,button:active,button:focus{outline:0!important;-moz-outline-style:none!important}
a {
text-decoration:none!important;
}
body{
    font-family: 'Maven Pro', sans-serif!important;
}

/****** GLOBALS ENDS *****/

/****** TIPOGRAFIA E CORES ******/
.color_1 {
    color:#22638d;
}
.color_2 {
    color:#08938f;
}

.color_txt {
  color:#707679;
}

.color_white {
color:#fff;
}
.color_dark{
color:#3b3b3b;
}

.fundo_color_1{
background-color:#e2fcff;
}
.fundo_color_2{
    background-color:#dce8ee;
    
}

    
/****** TIPOGRAFIA E CORES *****/
.h-135px{
    height:200px;
    }
.h-85px{
height:85px;
}
.h-55px{
    height:55px;
    }

/******** BUTTONS *******/
.bt {
    display: inline-block!important;
    margin: 10px 0px!important;
    padding: 0.4rem 1.5rem!important;
    box-shadow: 0px 2px 5px 0px rgba(0, 0, 0, 0.4)!important;
    transition: all 0.2s!important;
}
.bt-primary{
    background-color: #22638d!important;
    color:#fff!important;
}
.bt-secondary {
    background-color:#08938f!important;
    color: #fff!important;
}


.bt-primary:hover {
    background-color:#716c80!important;
    color:#fff!important;
}
.bt-secondary:hover{
    background-color:#22638d!important;
    color:#fff!important;
}

.bt-collapse.collapsed:after  {
    content: 'Ler mais';

}
.bt-collapse {
text-decoration:none!important;
}
.bt-collapse:not(.collapsed):after {
    content: '-fechar';
}
.bdr-5{
    border-radius:5px!important;
    }

.bdr-30, .loading{
border-radius:30px!important;
}


/******** BUTTONS ENDS *******/


/******** HEADER ****/
header{
background-color: #fff;
}
.top-bar{
    font-size:0.9rem
    }
    .top-bar a, .top-bar span, .top-bar h5{
        font-size:0.8rem!important;
    }
    .top-bar .clock-i{
    position:relative;
    top:-10px
    }
    .top-bar a {
    position:relative;
    left:6px;
    }
    .top-bar h5{
    margin-top:-6px;
    
    }



header a, header h5{
    color:#000!important;
    }
    header h5{
    position:relative;
    top:-6px;
    left:45px;
    }

    #banner .caption{
        position: absolute;         
        top: 50%;
        transform: translate(0, -50%);
        left:10%;
        }  
        
        #banner .caption h1{
        text-transform:uppercase;
        }

        .banner-interna{
            position:relative;
            }
            .caption-interna{
            position:absolute;
            top:50%;
            left:50%;
            transform: translate(-50%, -50%);
            }
            

.redes-menu .nav-link{
padding:0.5rem!important
}
.navbar-light .navbar-nav .nav-link{
color: #606062 !important;
padding-left:0.8rem !important;
padding-right:0.8rem!important;
font-size: 1.1rem;
}
.navbar-light .navbar-nav .nav-link:hover,
.navbar-light .navbar-nav .nav-item.active .nav-link {
color:#5d5d5d!important;
}
.nav-link svg{
    fill: #22638d !important; 
}
.nav-link:hover svg{
    fill: #606062 !important; 
}
.redes-menu{
	display:flex;
}

/******** HEADER ENDS********/

/***** *BANNERS ********/
#banner {
    position: relative;
    z-index:1;
}

/***** BANNERS ENDS ********/
.left-elm, .right-elm{
	position:absolute;
    top:15%;
}
.left-elm{
left:0;
}

.right-elm{
right:0;
}
/**** PARALLAX *******/
.parallax {
    background-attachment: fixed;
    background-size: cover;
    height: 325px;
    background-repeat: no-repeat;
    background-position: center center;
}
.parallax.home1{
background-image:url('dist/images/parallax.jpg');
}

/********* PARALLAX ENDS ******/
.boxT{
    border-radius: 20px;
   height:350px;
    box-shadow: 0px 2px 5px 0px rgba(0, 0, 0, 0.4);
  margin-bottom:1rem;
  }
  .boxT img{
  border-radius:20px 20px 0 0;
  }
  .boxT h3{
  padding:0 0.7rem;	
  }
  .boxT p{
  line-height:20px;
  padding:0 0.7rem 1rem;
  }
  
      .slick-prev:before, 
      .slick-next:before {
          color: #22638d!important;
          font-size: 35px!important;
          }

       .slick-T .slick-dots li button:before  {
            font-size:15px!important;
            color:#5d5d5d!important;
            }
       .slick-T .slick-dots li.slick-active button:before
                {
            color:#5d5d5d!important;
            }  

            .galeria-clinica .slick-T .slick-dots{
          bottom:-50px!important
            }
            .galeria-clinica .slick-T .slick-dots li button:before  {
color: #fff!important;
            }
                .galeria-clinica    .slick-T .slick-dots li.slick-active button:before{
                    color: #fff!important;
                }
.wp-block-column iframe{
width:100%!important;
}

/******* FIX WPP *********/
#fix-wpp {
    position:fixed;
    right:10px;
    bottom:10%;
}
    
#fix-wpp img{
  transition: width 0.5s;
  width:70px;
}
#fix-wpp:hover img{
  width:80px;
}
/********* FIX WPP ENDS *********/

.map-responsive {
    padding-bottom: 62.25%;
    position: relative;
    height: 0px;
    overflow: hidden;
}
.map-responsive iframe {
    left: 0px;
    top: 0;
    height: 100%;
    width: 100%;
    position: absolute;
}
/********** *CONTATO *********/
.share-links a{
	font-size:1.6rem;
margin:5px
}
.share-links .fa-whatsapp {
fill:	#25D366;
}
.share-links .fa-facebook {
fill:#3b5998;
}
.share-links .fa-linkedin-in {
fill:#0072b1;
}

.share-links a:hover svg{
fill:#22638d;
}
/********** FOOTER **********/
footer .dropdown-menu.show{
padding:0 1rem!important;
}
footer{
    background-color:#22638d;
    color:#fff;
    }
footer a{
color:#fff;
}
footer svg {
    fill:#fff;
    }
footer a:hover {
    color: #232323;
}
footer a:hover svg{
    fill:#232323!important;  
}

.bottom-div{
    position:absolute;
    bottom:0;
    }
    .nav-footer ul{
        list-style:none;
        padding:0;
        }
        .nav-footer li a{
        padding:0.2rem 0!important;
        
        }

/********** FOOTER ENDS **********/
/******* INTERNAS **********/
.wp-block-image img {
height: auto;
}
.extra-section h2,
.extra-section h3,
.extra-section h4,
.extra-section h5,
.extra-section h6,
.extra-section strong

.single-page h2,
.single-page h3,
.single-page h4,
.single-page h5,
.single-page h6{
color:#707679;
font-weight: bold;
}

/********** INTERNAS ENDS **********/
/********* BLOG *******/
h1.archive ul{
display: inline;
}
h1.archive a{
color:#fff;
}
.slickFeed .col-sm img{
object-fit: cover;
height:230px;
}



.youtube {
	background-color: #000;
	margin-bottom: 30px;
	position: relative;
	padding-top: 56.25%;
	overflow: hidden;
	cursor: pointer;
}
.youtube img {
	width: 100%;
	top: -16.82%;
	left: 0;
	opacity: 0.7;
}
.youtube .play-button {
	width: 90px;
	height: 60px;
	background-color: #22638d;
	box-shadow: 0 0 30px rgba( 0,0,0,0.6 );
	z-index: 1;
	opacity: 0.8;
	border-radius: 6px;
}
.youtube .play-button:before {
	content: "";
	border-style: solid;
	border-width: 15px 0 15px 26.0px;
	border-color: transparent transparent transparent #fff;
}
.youtube img,
.youtube .play-button {
	cursor: pointer;
}
.youtube img,
.youtube iframe,
.youtube .play-button,
.youtube .play-button:before {
	position: absolute;
}
.youtube .play-button,
.youtube .play-button:before {
	top: 50%;
	left: 50%;
	transform: translate3d( -50%, -50%, 0 );
}
.youtube iframe {
	height: 100%;
	width: 100%;
	top: 0;
	left: 0;
}

.vert-align{
    vertical-align:top;
    }
    



/****** *MEDIA QUERYS *******/
/****** MOBILE MENU ANIMATION ***/
.navbar-toggler {
  border: none!important;
  background: transparent !important;
}
.navbar-light .navbar-toggler {
color:rgba(0,0,0,0)!important;
}
.animated-icon{
width: 30px;
height: 20px;
position: relative;
margin: 0px;
-webkit-transform: rotate(0deg);
-moz-transform: rotate(0deg);
-o-transform: rotate(0deg);
transform: rotate(0deg);
-webkit-transition: .5s ease-in-out;
-moz-transition: .5s ease-in-out;
-o-transition: .5s ease-in-out;
transition: .5s ease-in-out;
cursor: pointer;
}

.animated-icon span{
display: block;
position: absolute;
height: 3px;
width: 100%;
border-radius: 9px;
opacity: 1;
left: 0;
-webkit-transform: rotate(0deg);
-moz-transform: rotate(0deg);
-o-transform: rotate(0deg);
transform: rotate(0deg);
-webkit-transition: .25s ease-in-out;
-moz-transition: .25s ease-in-out;
-o-transition: .25s ease-in-out;
transition: .25s ease-in-out;
}

.animated-icon span:nth-child(1) {
top: 0px;
}
.animated-icon span:nth-child(2), .animated-icon span:nth-child(3) {
top: 10px;
}
.animated-icon span:nth-child(4) {
top: 20px;
}
.animated-icon.open span:nth-child(1) {
top: 11px;
width: 0%;
left: 50%;
}
.animated-icon.open span:nth-child(2) {
-webkit-transform: rotate(45deg);
-moz-transform: rotate(45deg);
-o-transform: rotate(45deg);
transform: rotate(45deg);
}
.animated-icon.open span:nth-child(3) {
-webkit-transform: rotate(-45deg);
-moz-transform: rotate(-45deg);
-o-transform: rotate(-45deg);
transform: rotate(-45deg);
}
.animated-icon.open span:nth-child(4) {
top: 11px;
width: 0%;
left: 50%;
}
.animated-icon span {
background: #000;
}
/****** MOBILE MENU ANIMATION ENDS  *****/
@media only screen and (min-width: 1900px){
    .col-md-11 {
        
        width: 80.666667%!important;
}
}
@media only screen and (max-width: 768px){
.redes-menu{
    position:absolute;
    right:0;
    top:0;
}
.left-elm{
    top:10%;
    z-index:-1;
    opacity:0.2
}
.right-elm{
    top:auto;
    bottom:0;
    z-index:-1;
    opacity:0.2
    }
     .slick-prev,  .slick-next {
    top:45%!important;
    }

   .slick-3rws .slick-prev,  .slick-3rws .slick-next {
        top:37%!important;
        }  
    .slick-prev{
left:10px;
    }
    .slick-next {
        right:25px;
        }

     .slick-prev{
left:10px!important;
z-index: 9999!important;
    }
    .slick-next {
        right:25px!important;
        }       
}

@media only screen and (max-width: 570px){
#banner {
    position: relative;
    height: auto;
    }
#banner .caption{
position: inherit;
top:inherit;
transform:inherit;
left:inherit;
width:100%;
padding:1.5rem 0;
}
.caption h1{
    font-size:1.8rem;
    color:rgb(14, 39, 179) ;
    padding:0 1.3rem;
}
.caption h1 br{
display: none;

}

    .map-responsive {
        padding-bottom: 60.25%;
}
.parallax.home1{
    background-image:url('dist/images/parallax-mobile.jpg');
    
    }

    

    .bottom-div {
        position:initial;
        bottom: inherit;
        margin-top: 13px;
}
.h-135px{
    height:240px;
    }

}