/* ********************************************* */
/*           SOCIAL FOLLOW STYLES                */
/* ********************************************* */

/* ********************************************* */
/*           SOCIAL FOLLOW (Applies to ALL)      */
/* ********************************************* */
/* Center align icons if 'dh_social_follow_centered' class is set */
ul.dh_social_follow_centered.et_pb_social_media_follow {
    text-align: center;
	margin-left: auto!important;
	margin-right: auto!important;
}
.dh_social_follow_centered.et_pb_social_media_follow li {
    float: none;
    display: inline-block;
}

.dh_social_follow_centered.et_pb_social_media_follow li a {
	margin: auto 4px;	
}

/* Rotation effect for icons */
@-webkit-keyframes rotateY {
  to { -webkit-transform: rotateY(360deg); }
}
@keyframes rotateY {
  to { transform: rotateY(360deg); }
}

/* Apply fully round border radius to social icon container if 'dh_round' class is set */
ul.dh_social_follow_style1.dh_round,ul.dh_social_follow_style2.dh_round,ul.dh_social_follow_style3.dh_round {
    border-radius: 30px;
}

/* Apply rounded border radius to social icon container if 'dh_rounded' class is set */
ul.dh_social_follow_style1.dh_rounded, ul.dh_social_follow_style2.dh_rounded, ul.dh_social_follow_style3.dh_rounded {
    border-radius: 4px;
}

/* Apply box shadow to main container permanently if 'dh_boxshadow' class is set */
ul.dh_boxshadow {
    box-shadow: 0 0 10px 2px rgba(0,0,0,0.1);
}

/* Apply box shadow to main container on hover if 'dh_boxshadow_hover' class is set */
ul.dh_boxshadow_hover:hover {
    box-shadow: 0 0 10px 2px rgba(0,0,0,0.1);
}

/* Apply rotate animation to icons if 'dh_social_icons_rotate' class is set */
.dh_social_icons_rotate a:hover {
  -webkit-animation: rotateY 1s linear;
  animation: rotateY 1s linear;
}

/* Apply box shadow to social icons if 'dh_social_icons_boxshadow' class is set */
.dh_social_icons_boxshadow a {
    box-shadow: 0 0 10px 2px rgba(0,0,0,0.1);
}

/* Apply box shadow on hover only to social icons if 'dh_social_icons_boxshadow_hover' class is set */
.dh_social_icons_boxshadow_hover a:hover {
    box-shadow: 0 0 10px 2px rgba(0,0,0,0.1);
}

/* ********************************************* */
/*           SOCIAL FOLLOW STYLE 1               */
/* ********************************************* */

/* General settings for social follow container */
ul.dh_social_follow_style1 {
	transition: 0.5s all;
}

/* Set timings for smooth transitions */
ul.dh_social_follow_style1 a {
	transition: 0.5s all;
}
ul.dh_social_follow_style1 a:before {
	transition: 0.5s all;
}
/* Set CSS for when NOT hovering over the icons, so the default backgrounds and icon colors apply only when you DO hover */
ul.dh_social_follow_style1 a:not(:hover) {
	background-color: white!important;
}
ul.dh_social_follow_style1 a:not(:hover):before {
  color: #666; /* Sets the icon color when not hovering */
}

/* Force the on hover color of the icon to white, otherwise Divi sets a slightly off gray color */
ul.dh_social_follow_style1 a:hover:before {
  color: white; /* Sets the icon color when hovering */
}

/* On Hover, hide the border and apply a light box-shadow */
.dh_social_follow_style1 a:hover {
	border-color: transparent!important;
}

/* ********************************************* */
/*           SOCIAL FOLLOW STYLE 2               */
/* ********************************************* */

/* General settings for social follow container */
ul.dh_social_follow_style2 {
	transition: 0.5s all;
}

/* Set timings for smooth transitions */
ul.dh_social_follow_style2 a {
	transition: 0.5s all;
}
ul.dh_social_follow_style2 a:before {
	transition: 0.5s all;
}
/* Set CSS for when NOT hovering over the icons, so the default backgrounds and icon colors apply only when you DO hover */
ul.dh_social_follow_style2 a:not(:hover) {
	background-color: white!important;
}
ul.dh_social_follow_style2 a:not(:hover):before {
  color: #666; /* Sets the icon color when not hovering */
}

/* Force the on hover color of the icon to white, otherwise Divi sets a slightly off gray color */
ul.dh_social_follow_style2 a:hover:before {
  color: white; /* Sets the icon color when hovering */
}

/* On Hover, hide the border and apply a light box-shadow */
.dh_social_follow_style2 a:hover {
	border-color: transparent!important;
    box-shadow: 0 0 10px 2px rgba(0,0,0,0.1);
}

/* ********************************************* */
/*           SOCIAL FOLLOW STYLE 3               */
/* ********************************************* */

/* General settings for social follow container */
ul.dh_social_follow_style3 {
	transition: 0.5s all;
}

/* Set timings for smooth transitions */
ul.dh_social_follow_style3 a {
	transition: 0.5s all;
}
ul.dh_social_follow_style3 a:before {
	transition: 0.5s all;
}

/* Force the on hover color of the icon to white, otherwise Divi sets a slightly off gray color */
ul.dh_social_follow_style3 a:hover:before {
  color: white; /* Sets the icon color when hovering */
}