/** *********************************************************************************************** **/  
/** navbar CSS DEFINITIONS ************************************************************************ **/  
.navbar .navbar-brand > img {height:33px;}
.navbar .navbar-toggler {width:35px;height:35px; text-align:center;padding:0;}
.navbar [aria-expanded="true"].navbar-toggler .fa-solid::before {content:"\f00d";} 

.navbar .dropdown-menu li:not(:first-child) {
  border-top: dashed 1px #999999;
}
.navbar .active {background:#555555;}
.navbar .nav-item:hover {background:#444444;}

/** Large devices (desktops, 992px and down) **/
@media (max-width: 992px) { 
  .navbar .nav-item { border-top: dashed 1px #999999; }
  .navbar .dropdown-menu { 
    --bs-dropdown-border-radius: none; 
    --bs-dropdown-border-width: none;
    border-top: dashed 1px #999999;
    text-align: center;
  }
  
}

.navbar .dropdown-menu {background:rgba(85, 85, 85, 0.9);}


/** navbar CSS DEFINITIONS ************************************************************************ **/  
/** *********************************************************************************************** **/  


/** *********************************************************************************************** **/  
/** app icon link CSS DEFINITIONS ***************************************************************** **/  
.app_icon { display: flex !important; align-items: center !important; } /** .d-flex .align-items-center **/
.app_icon::before {
  content:' ';
  display:inline-block;
  width: 25px;
  height:25px;
  margin-right:0.5em;
  background:transparent url(../images/photo_perfect365_icon.png) left center/auto 100% no-repeat;
}
.app_video::before {background-image:url(../images/video_perfect365_icon.png);} 
.app_studio::before {background-image:url(../images/studio_perfect365_icon.png);} 
.app_ai::before {background-image:url(../images/ai_perfect365_icon.png);} 

.app_web_world::before {background-image:url(../images/ai_travel_icon.png);} 
.app_web_style::before {background-image:url(../images/ai_style_icon.png);} 
.app_web_look::before {background-image:url(../images/ai_perfect365_icon.png);} 
.app_web_skin::before {background-image:url(../images/skin_softener_perfect365_icon.png);} 
.app_web_hair::before {background-image:url(../images/hair_dye_perfect365_icon.png);} 
/** app icon link CSS DEFINITIONS ***************************************************************** **/  
/** *********************************************************************************************** **/    



    /** *********************************************************************************************** **/ 
    /** social_wrapper CSS DEFINITIONS **************************************************************** **/ 
    .social_wrapper .fa-circle {color:#ffffff;}       /** default circle color **/
    .social_wrapper .fa-brands, .social_wrapper .fa-solid:not(:first-child) {color:#000000;} /** default icon color **/
    
    .social_wrapper .instagram .fa-circle {	
      background: linear-gradient(135deg, #405DE6, #833AB4, #FD1D1D, #fccb0a);
      -webkit-text-fill-color: transparent; /** necessary to cap the graident area within the circle **/
      -webkit-background-clip: text;        /** necessary to cap the graident area within the circle **/
    }      
    .social_wrapper .instagram .fa-brands {color:#ffffff;}  
    
    .social_wrapper .facebook .fa-circle {color:#0575ec;}       
    .social_wrapper .facebook .fa-brands {color:#ffffff;}  
    
    .social_wrapper .youtube .fa-circle {color:#fe0000;}       
    .social_wrapper .youtube .fa-brands {color:#ffffff;}  
    /** social_wrapper CSS DEFINITIONS **************************************************************** **/  
    /** *********************************************************************************************** **/   


/** *********************************************************************************************** **/  
/** header related CSS DEFINITIONS **************************************************************** **/ 
header {

  background:transparent url(bg_header.png) center bottom/cover no-repeat;
}
@media (max-width: 992px) { 
header {
  background: linear-gradient(to bottom,rgba(0,0,0,0.8), rgba(0,0,0,0)),
  url(bg_header.png) center bottom/cover no-repeat;
}
  
}
/** header related CSS DEFINITIONS **************************************************************** **/
/** *********************************************************************************************** **/  
 


/** *********************************************************************************************** **/  
/** footer related CSS DEFINITIONS **************************************************************** **/  
footer {
  min-height:400px;
  background:transparent url(bg_footer.png) center top/cover no-repeat;
}
footer .footer_logo {width:100%;max-width:200px;}
footer .app_wrapper {max-width:315px;}   
footer .app_wrapper a {
  border-radius: var(--bs-border-radius-pill) !important; /** rounded-pill **/

  background-color:#333333;
  
  padding:0.3em 0.6em 0.3em 1em;
     
}   
@media (min-width: 768px) { /** Medium devices (tablets, 768px and up) **/
  footer .app_wrapper {max-width:650px;} 
}
/** footer related CSS DEFINITIONS **************************************************************** **/  
/** *********************************************************************************************** **/ 





 

.img_hover_zoom img { 
  transition: all .3s ease;
}

.img_hover_zoom:hover img {
  transform: scale(1.2);
}


.ratio_test {
  --bs-aspect-ratio: 40%;
}


.txt_gradient {

  
      background: linear-gradient(45deg, #ffb606, #ff6101);

  -webkit-background-clip: text;
      -webkit-text-fill-color: transparent;

}

.btn_gradient,.btn_gradient:hover {
  background: linear-gradient(45deg,#fbb905, #fba905);
  color:#000000;
  
}

 
.blur {filter: blur(5px); }

.carousel_body {height:520px;}
.carousel_footer {height:45px;}
.w_85 {width:85%;}

.abs_center_x {
  position: absolute;
 left: 50%;
 transform: translateX(-50%);
}

.abs_center_y {
  position: absolute;
top: 50%; 
 transform: translateY(-50%);
}

.abs_center {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}



.icon_thumbs {width:50px;height:50px;}


.bg_opacity_90 {
  --bs-bg-opacity: 0.90;
}


.ratio_hero {
  --bs-aspect-ratio: 43.3481153%;
}