Social-popout

Footer

<?php 
  if (is_home() or is_page_template('team.php') or is_page_template('clients.php')){
		$socialmargin = '';
	}else{
		$socialmargin = ' class="social-margin"';
	}
?>
	
	<!-- Social Network -->
	<div id="social1"<?php echo $socialmargin; ?>>
		<!-- Latest Twitts -->
		<?php if (CircleLaw_option('twitter-user-latest') != ""): ?>
		<ul class="latest-twitts"></ul>
		<?php endif ?>
		<!-- Social Icons -->
		<div class="social">
			
			<?php if (CircleLaw_option('social-network-fc') != ""): ?>
				<a href="<?php echo CircleLaw_option('social-network-fc') ?>"><div class="facebook-popout social-popout"></div></a>
				<!--<a href="<?php echo CircleLaw_option('social-network-fc') ?>" target="_blank" alt="Facebook" title="Facebook" class="fc"></a>-->
			<?php endif ?>
<?php if (CircleLaw_option('social-network-google') != ""): ?>
				<a href="<?php echo CircleLaw_option('social-network-google') ?>"><div class="google-popout social-popout"></div></a>
				<!--<a href="<?php echo CircleLaw_option('social-network-google') ?>" target="_blank" alt="Google" title="Google" class="go"></a>-->
			<?php endif ?>
			<?php if (CircleLaw_option('social-network-in') != ""): ?>
				<a href="<?php echo CircleLaw_option('social-network-in') ?>"><div class="linkedin-popout social-popout"></div></a>
				<!--<a href="<?php echo CircleLaw_option('social-network-in') ?>" target="_blank" alt="Linkedin" title="Linkedin" class="in"></a>-->
			<?php endif ?>
			<br>
			<div style="font-size:10px">
				Copyright &copy; 2013 Mc Leg, LLC All rights reserved
			</div>
		</div>
		<!-- Social Icons -->
	<div class="clear"></div>
	</div>
	<!-- Social Network -->

  </div><!--End Main Content-->
  <div class="clear"></div>
<!-- end .container --></div>

<!--BackGround Slider-->
<?php $getbgslide = CircleLaw_option('background-sLider'); if (is_array($getbgslide)): ?>
<div id="slideshow">
	<?php if (count($getbgslide) > 1):  $i = 0; foreach ($getbgslide as $bgslide): $i++; ?>
	    <img src="<?php print $bgslide; ?>"<?php if ($i==1) print ' class="active"'; ?> />
	<?php endforeach; else: ?>
	    <img src="<?php print $getbgslide['0']; ?>" class="active" />
	    <img src="<?php print $getbgslide['0']; ?>" />
	<?php endif; ?>
</div><?php endif; ?><!--End BackGround Slider-->
<?php
wp_footer();
?>
</body>
</html>

Style

/*======================================
Theme Name: CircleLaw
Theme URI: http://thebebel.com/
Description: CircleLaw WordPress Theme , can be used for business , lawyer .... 
Version: 1.7
Author: Bebel
Author URI: http://themeforest.net/user/Bebel
License: GNU General Public License v2.0
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Tags: threaded-comments, custom-menu, theme-options, translation-ready
======================================*/
@import "http://fonts.googleapis.com/css?family=Oxygen:300";
@import "css/style.css";
@import "css/shortcodes.css";
@font-face{
    font-family: 'Titil';
    src: url('css/fonts/TitilliumText22L_Rg_Bold.otf');
}
/* =WordPress Core
-------------------------------------------------------------- */
.alignnone {
    margin: 5px 20px 20px 0;
}

.aligncenter,
div.aligncenter {
    display: block;
    margin: 5px auto 5px auto;
}

.alignright {
    float:right;
    margin: 5px 0 20px 20px;
}

.alignleft {
    float: left;
    margin: 5px 20px 20px 0;
}

.aligncenter {
    display: block;
    margin: 5px auto 5px auto;
}

a img.alignright {
    float: right;
    margin: 5px 0 20px 20px;
}

a img.alignnone {
    margin: 5px 20px 20px 0;
}

a img.alignleft {
    float: left;
    margin: 5px 20px 20px 0;
}

a img.aligncenter {
    display: block;
    margin-left: auto;
    margin-right: auto
}

.wp-caption {
    background: #fff;
    border: 1px solid #f0f0f0;
    max-width: 96%; /* Image does not overflow the content area */
    padding: 5px 3px 10px;
    text-align: center;
}

.wp-caption.alignnone {
    margin: 5px 20px 20px 0;
}

.wp-caption.alignleft {
    margin: 5px 20px 20px 0;
}

.wp-caption.alignright {
    margin: 5px 0 20px 20px;
}

.wp-caption img {
    border: 0 none;
    height: auto;
    margin: 0;
    max-width: 98.5%;
    padding: 0;
    width: auto;
}

.wp-caption p.wp-caption-text {
    font-size: 11px;
    line-height: 17px;
    margin: 0;
    padding: 0 4px 5px;
}
.sticky {
  background-color: #FBFBFB;
    margin-bottom: 30px;
    margin-left: 10px;
    padding: 25px 20px 32px;
}
.sticky .break {
    display: none;
}
.gallery .gallery-caption {color: #888;margin: 0 0 12px;}

.facebook-popout {
	background-image: url('/wp-content/themes/CircleLaw/images/facebook-popout.png');
}

.google-popout {
	background-image: url('/wp-content/themes/CircleLaw/images/google-popout.png');
}

.linkedin-popout {
	background-image: url('/wp-content/themes/CircleLaw/images/linkedin-popout.png');
}

.social-popout {
	height: 24px;
	width: 24px;
	margin: 6px;
	float: left;
	-webkit-transition: all ease 0.5s;
	-moz-transition: all ease 0.5s;
	-o-transition: all ease 0.5s;
	-ms-transition: all ease 0.5s;
	transition: all ease 0.5s;
}
.social-popout img {
	border-radius: 50%;
	margin: 8px;
	width: 100%;
	box-shadow: 0px 0px 4px 1px rgba(0,0,0,0.8);
	-webkit-transition: all ease 0.5s;
	-moz-transition: all ease 0.5s;
	-o-transition: all ease 0.5s;
	-ms-transition: all ease 0.5s;
	transition: all ease 0.5s;
}
.social-popout img:hover {
	margin: 0px;
	box-shadow: 6px 6px 4px 4px rgba(0,0,0,0.3);
}