/**
* @copyright	Copyright (C) 2012 JoomSpirit. All rights reserved.
* @license		GNU General Public License version 2 or later
*/

/** 		Social presence - CSS			**/


#social_presence img {
padding : 4px 2px 0 2px;
}


/** 		Size 			**/

#social_presence li.very_small img {
max-width:16px;
}

#social_presence li.small img {
max-width:20px;
}

#social_presence li.medium img {
max-width:26px;
}

#social_presence li.large img {
max-width:32px;
}

#social_presence li.very_large img {
max-width:40px;
}

/** 		to fix a problem with IE 		**/
.google_button {
overflow : hidden;
}



#social_presence {
position : fixed;
z-index:999;
}

.bottom_right_vertically {
bottom:5px;
right:0;
}

.bottom_left_vertically {
bottom:5px;
left:0;
}

.top_left_vertically {
top:5px;
left:0;
}

.top_right_vertically {
top:5px;
right:0;
}

.bottom_right_horizontally {
bottom:0px;
right:5px;
}

.bottom_left_horizontally {
bottom:0px;
left:5px;
}

.top_left_horizontally {
top:0px;
left:5px;
}

.top_right_horizontally {
top:0px;
right:5px;
}			

#social_presence ul {
margin:0;
padding:0;
list-style:none;
}

/**		CSS3 transition  							**/

#social_presence li {
display : block;
position:relative;
padding:0;
list-style:none;
-webkit-transition : all 0.4s ease-in-out;
-moz-transition : all 0.4s ease-in-out;
-ms-transition : all 0.4s ease-in-out;
-o-transition : all 0.4s ease-in-out;
transition : all 0.4s ease-in-out;
}

.bottom_right_vertically li, .bottom_left_vertically li {
margin:5px 0 0 0;
}

.top_right_vertically li, .top_left_vertically li {
margin: 0 0 5px 0;
}

.top_left_horizontally li, .bottom_left_horizontally li {
margin: 0 5px 0 0;
float:left;
}			

.top_right_horizontally li, .bottom_right_horizontally li {
margin: 0 0 0 5px;
float:left;
}


/**		box shadow if background enable 		**/

#social_presence li.bg {
-moz-box-shadow:0px 0px 2px #777;
-webkit-box-shadow:0px 0px 2px #777;
box-shadow:0px 0px 2px #777;
}

#social_presence li.bg:hover {
-moz-box-shadow:0px 0px 4px #555;
-webkit-box-shadow:0px 0px 4px #555;
box-shadow:0px 0px 4px #000;
}

.bottom_right_vertically li, .top_right_vertically li {
-moz-border-radius: 6px 0 0 6px;
-webkit-border-radius: 6px 0 0 6px;
-khtml-border-radius: 6px 0 0 6px;
border-radius: 6px 0 0 6px;
}

.bottom_left_vertically li, .top_left_vertically li {
-moz-border-radius: 0 6px 6px 0;
-webkit-border-radius: 0 6px 6px 0;
-khtml-border-radius: 0 6px 6px 0;
border-radius: 0 6px 6px 0;
}

.top_left_horizontally li, .top_right_horizontally li {
-moz-border-radius: 0 0 6px 6px;
-webkit-border-radius: 0 0 6px 6px;
-khtml-border-radius: 0 0 6px 6px;
border-radius: 0 0 6px 6px;
}

.bottom_left_horizontally li, .bottom_right_horizontally li {
-moz-border-radius: 6px 6px 0 0;
-webkit-border-radius: 6px 6px 0 0;
-khtml-border-radius: 6px 6px 0 0;
border-radius: 6px 6px 0 0;
}

/** 	Opacity 		**/

#social_presence ul li.normal-10, #social_presence ul li.hover-10:hover {
opacity : 1.0;
filter : alpha(opacity=100);
}

#social_presence ul li.normal-09, #social_presence ul li.hover-09:hover {
opacity : 0.9;
filter : alpha(opacity=90);
}

#social_presence ul li.normal-08, #social_presence ul li.hover-08:hover {
opacity : 0.8;
filter : alpha(opacity=80);
}

#social_presence ul li.normal-07, #social_presence ul li.hover-07:hover {
opacity : 0.7;
filter : alpha(opacity=70);
}

#social_presence ul li.normal-06, #social_presence ul li.hover-06:hover {
opacity : 0.6;
filter : alpha(opacity=60);
}

#social_presence ul li.normal-05, #social_presence ul li.hover-05:hover {
opacity : 0.5;
filter : alpha(opacity=50);
}

#social_presence ul li.normal-04, #social_presence ul li.hover-04:hover {
opacity : 0.4;
filter : alpha(opacity=40);
}

#social_presence ul li.normal-03, #social_presence ul li.hover-03:hover {
opacity : 0.3;
filter : alpha(opacity=30);
}

#social_presence ul li.normal-02, #social_presence ul li.hover-02:hover {
opacity : 0.2;
filter : alpha(opacity=20);
}

#social_presence ul li.normal-01, #social_presence ul li.hover-01:hover {
opacity : 0.1;
filter : alpha(opacity=10);
}


/** 		CSS3 Tooltips 			**/

#social_presence a {
text-decoration : none;
}

#social_presence li span {
position: absolute;
padding: 9px 12px;
width: auto;
height: auto;;
line-height: 16px;
font-size: 100%;
font-weight: normal;
white-space: nowrap;	/* to keep the text on a single line */
-webkit-border-radius:	6px;
-moz-border-radius:	6px;
-o-border-radius:	6px;
border-radius:		6px;
opacity: 0;
filter: progid:DXImageTransform.Microsoft.Alpha(opacity=0);
-webkit-transform:	scale(0);			/**		to hide the tooltip with the transition 		**/
-moz-transform:		scale(0);
-o-transform:		scale(0);
transform:		scale(0);
-webkit-transition:	opacity .4s ease-in-out;
-moz-transition: opacity .4s ease-in-out;
-o-transition: opacity .4s ease-in-out;
transition:	opacity .4s ease-in-out;
z-index: 30;
}

#social_presence li span.white {
color: #444;
border: solid 1px #ccc;
-webkit-box-shadow: inset 0 1px 1px rgba(255,255,255,.8), 0 5px 16px #bbb;
-moz-box-shadow: inset 0 1px 1px rgba(255,255,255,.8), 0 5px 16px #bbb;
-o-box-shadow: inset 0 1px 1px rgba(255,255,255,.8), 0 5px 16px #bbb;
box-shadow: inset 0 1px 1px rgba(255,255,255,.8), 0 5px 16px #bbb;
background-color: #fff; /* Old browsers */
background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSI0MiUiIHN0b3AtY29sb3I9IiNmZmZmZmYiIHN0b3Atb3BhY2l0eT0iMSIvPgogICAgPHN0b3Agb2Zmc2V0PSIxMDAlIiBzdG9wLWNvbG9yPSIjZGRkZGRkIiBzdG9wLW9wYWNpdHk9IjEiLz4KICA8L2xpbmVhckdyYWRpZW50PgogIDxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxIiBoZWlnaHQ9IjEiIGZpbGw9InVybCgjZ3JhZC11Y2dnLWdlbmVyYXRlZCkiIC8+Cjwvc3ZnPg==);
background: -moz-linear-gradient(top,  #ffffff 42%, #dddddd 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(42%,#ffffff), color-stop(100%,#dddddd)); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top,  #ffffff 42%,#dddddd 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top,  #ffffff 42%,#dddddd 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top,  #ffffff 42%,#dddddd 100%); /* IE10+ */
background: linear-gradient(to bottom,  #ffffff 42%,#dddddd 100%); /* W3C */	
}

#social_presence li span.black {
color: #eee;
border: solid 1px #222;
-webkit-box-shadow: inset 0 1px 2px rgba(255,255,255,.58), 0 5px 16px #666;
-moz-box-shadow: inset 0 1px 2px rgba(255,255,255,.58), 0 5px 16px #666;
-o-box-shadow: inset 0 1px 2px rgba(255,255,255,.58), 0 5px 16px #666;
box-shadow: inset 0 1px 2px rgba(255,255,255,.58), 0 5px 16px #666;
background-color: #444; /* Old browsers */
background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSI0MiUiIHN0b3AtY29sb3I9IiM0NDQ0NDQiIHN0b3Atb3BhY2l0eT0iMSIvPgogICAgPHN0b3Agb2Zmc2V0PSIxMDAlIiBzdG9wLWNvbG9yPSIjMDAwMDAwIiBzdG9wLW9wYWNpdHk9IjEiLz4KICA8L2xpbmVhckdyYWRpZW50PgogIDxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxIiBoZWlnaHQ9IjEiIGZpbGw9InVybCgjZ3JhZC11Y2dnLWdlbmVyYXRlZCkiIC8+Cjwvc3ZnPg==);
background: -moz-linear-gradient(top,  #444444 42%, #000000 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(42%,#444444), color-stop(100%,#000000)); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top,  #444444 42%,#000000 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top,  #444444 42%,#000000 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top,  #444444 42%,#000000 100%); /* IE10+ */
background: linear-gradient(to bottom,  #444444 42%,#000000 100%); /* W3C */
}

#social_presence li:hover span, #social_presence li:focus span {
opacity: 1;
filter: progid:DXImageTransform.Microsoft.Alpha(opacity=100);
z-index: 40;
-webkit-transform:	scale(1);
-moz-transform:		scale(1);
-o-transform:		scale(1);
transform:		scale(1);
-webkit-transition:	opacity .3s ease-in-out;
-moz-transition:	opacity .4s ease-in-out;
-o-transition:		opacity .3s ease-in-out;
transition:		opacity .3s ease-in-out;
}

.bottom_left_horizontally li span:before, .top_left_horizontally li span:before, .top_right_horizontally li span:before, .bottom_right_horizontally li span:before {
content: '';
display: block;
position: absolute;
width: 0;
height: 0;
border: solid 9px transparent;
}

.bottom_left_vertically li span:before, .top_left_vertically li span:before, .top_right_vertically li span:before, .bottom_right_vertically li span:before {
content: '';
display: block;
position: absolute;
width: 0;
height: 0;
border: solid 7px transparent;
}			


/** 		Position of tooltips 		**/

.bottom_left_horizontally li span {
left: 0;
top: 100px;
}
.bottom_left_horizontally li:hover span {
top: -58px;
}
.bottom_left_horizontally li span:before {			
left: 20px;
}		
.bottom_left_horizontally li span:before {
margin-left: -9px;
bottom: -18px;
}
.bottom_left_horizontally li span.white:before {
border-top-color: #ddd;
border-top-color: rgba(230,230,230,.8);
}
.bottom_left_horizontally li span.black:before {
border-top-color: #000;
border-top-color: rgba(0,0,0,.8);
}



.top_left_horizontally li span {
left: 0;
top: -100px;
}			
.top_left_horizontally li:hover span {
top: 58px;
}
.top_left_horizontally li span:before {			
left: 20px;
}		
.top_left_horizontally li span:before {
margin-left: -9px;
top: -18px;
}
.top_left_horizontally li span.white:before {
border-bottom-color: #fff;
border-bottom-color: rgba(255,255,255,.8);
}
.top_left_horizontally li span.black:before {
border-bottom-color: #444;
border-bottom-color: rgba(40,40,40,.8);
}



.top_right_horizontally li span {
right: 0;
top: -100px;
}			
.top_right_horizontally li:hover span {
top: 58px;
}
.top_right_horizontally li span:before {			
right: 20px;
}		
.top_right_horizontally li span:before {
margin-right: -9px;
top: -18px;
}
.top_right_horizontally li span.white:before {
border-bottom-color: #fff;
border-bottom-color: rgba(255,255,255,.8);
}
.top_right_horizontally li span.black:before {
border-bottom-color: #444;
border-bottom-color: rgba(40,40,40,.8);
}					


.bottom_right_horizontally li span {
right: 0;
top: 100px;
}			
.bottom_right_horizontally li:hover span {
top: -58px;
}
.bottom_right_horizontally li span:before {			
right: 20px;
}		
.bottom_right_horizontally li span:before {
margin-right: -9px;
bottom: -18px;
}
.bottom_right_horizontally li span.white:before {
border-top-color: #ddd;
border-top-color: rgba(230,230,230,.8);
}
.bottom_right_horizontally li span.black:before {
border-top-color: #000;
border-top-color: rgba(0,0,0,.8);
}



.bottom_left_vertically li span {
left: -100px;
top: 0px;
}			
.bottom_left_vertically li:hover span {
left: 58px;
}
.bottom_left_vertically li span:before {			
left: 0px;
}		
.bottom_left_vertically li span:before {
margin-left: -14px;
bottom: 16px;
}
.bottom_left_vertically li span.white:before {
border-right-color: #fff;
border-right-color: rgba(255,255,255,.8);
}
.bottom_left_vertically li span.black:before {
border-right-color: #444;
border-right-color: rgba(40,40,40,.8);
}


.top_left_vertically li span {
left: -100px;
top: 0px;
}			
.top_left_vertically li:hover span {
left: 58px;
}
.top_left_vertically li span:before {			
left: 0px;
}		
.top_left_vertically li span:before {
margin-left: -14px;
bottom: 16px;
}
.top_left_vertically li span.white:before {
border-right-color: #ffff;
border-right-color: rgba(255,255,255,.8);
}
.top_left_vertically li span.black:before {
border-right-color: #444;
border-right-color: rgba(40,40,40,.8);
}

.bottom_right_vertically li span {
right: -100px;
top: 0px;
}			
.bottom_right_vertically li:hover span {
right: 58px;
}
.bottom_right_vertically li span:before {			
right: 0px;
}		
.bottom_right_vertically li span:before {
margin-right: -14px;
bottom: 16px;
}
.bottom_right_vertically li span.white:before {
border-left-color: #fff;
border-left-color: rgba(255,255,255,.8);
}
.bottom_right_vertically li span.black:before {
border-left-color: #444;
border-left-color: rgba(40,40,40,.8);
}


.top_right_vertically li span {
right: -100px;
top: 0px;
}			
.top_right_vertically li:hover span {
right: 58px;
}
.top_right_vertically li span:before {			
right: 0px;
}		
.top_right_vertically li span:before {
margin-right: -14px;
bottom: 16px;
}
.top_right_vertically li span.white:before {
border-left-color: #fff;
border-left-color: rgba(255,255,255,.8);
}
.top_right_vertically li span.black:before {
border-left-color: #444;
border-left-color: rgba(40,40,40,.8);
}