<link href="//netdna.bootstrapcdn.com/twitter-bootstrap/2.3.2/css/bootstrap-combined.min.css" rel="stylesheet" id="bootstrap-css">
<script src="//netdna.bootstrapcdn.com/twitter-bootstrap/2.3.2/js/bootstrap.min.js"></script>
<script src="//code.jquery.com/jquery-1.11.1.min.js"></script>
<!------ Include the above in your HEAD tag ---------->
<!doctype html>
<html xmlns="http://www.w3.org/1999/xhtml"
xmlns:og="http://ogp.me/ns#"
xmlns:fb="https://www.facebook.com/2008/fbml">
<head>
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Free Glowing Neon Social Icon Theme in Pure CSS</title>
<link rel="stylesheet" href="http://rayanthony.io/assets/fonts/foundation-icons.css">
<link rel="stylesheet" href="http://fonts.googleapis.com/css?family=Fira+Sans:300,400,500">
<link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/font-awesome/4.2.0/css/font-awesome.min.css?family=FontAwesome:300,400,500,800">
<style>
html,body{
margin:0;
margin: auto;
padding:0;
position: absolute;
top: 0; left: 0; bottom: 0; right: 0;
min-height:100%;
}
html,body,div,span,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,abbr,address,cite,code,del,dfn,em,img,ins,kbd,q,samp,small,strong,sub,sup,var,b,i,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,figcaption,figure,footer,header,hgroup,menu,nav,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;outline:0;font-size:100%;vertical-align:baseline;background:transparent}article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}nav ul{list-style:none}blockquote,q{quotes:none}blockquote:before,blockquote:after,q:before,q:after{content:'';content:none}a{margin:0;padding:0;font-size:100%;vertical-align:baseline;background:transparent}ins{background-color:#ff9;color:#000;text-decoration:none}mark{background-color:#ff9;color:#000;font-style:italic;font-weight:bold}del{text-decoration:line-through}abbr[title],dfn[title]{border-bottom:1px dotted;cursor:help}table{border-collapse:collapse;border-spacing:0}hr{display:block;height:1px;border:0;border-top:1px solid #ccc;margin:1em 0;padding:0}input,select{vertical-align:middle}body{font:13px/1.231 sans-serif;*font-size:small}select,input,textarea,button{font:99% sans-serif}pre,code,kbd,samp{font-family:monospace,sans-serif}h1,h2,h3,h4,h5,h6{font-weight:bold}a:hover,a:active{outline:none}a,a:active,a:visited{color:#607890}a:hover{color:#036}ul,ol{margin-left:2em}ol{list-style-type:decimal}nav ul,nav li{margin:0}small{font-size:85%}strong,th{font-weight:bold}td,td img{vertical-align:top}sub,sup{font-size:75%;line-height:0;position:relative}sup{top:-0.5em}sub{bottom:-0.25em}pre{padding:15px;white-space:pre;white-space:pre-wrap;white-space:pre-line;word-wrap:break-word}textarea{overflow:auto}.ie6 legend,.ie7 legend{margin-left:-7px}input[type="radio"]{vertical-align:text-bottom}input[type="checkbox"]{vertical-align:bottom}.ie7 input[type="checkbox"]{vertical-align:baseline}.ie6 input{vertical-align:text-bottom}label,input[type="button"],input[type="submit"],input[type="image"],button{cursor:pointer}button,input,select,textarea{margin:0}input:invalid,textarea:invalid{border-radius:1px;-moz-box-shadow:0 0 5px red;-webkit-box-shadow:0 0 5px red;box-shadow:0 0 5px red}.no-boxshadow input:invalid,.no-boxshadow textarea:invalid{background-color:#f0dddd}::-moz-selection{background:#ff5e99;color:#fff;text-shadow:none}::selection{background:#ff5e99;color:#fff;text-shadow:none}a:link{-webkit-tap-highlight-color:#ff5e99}button{width:auto;overflow:visible}.ie7 img{-ms-interpolation-mode:bicubic}.ir{display:block;text-indent:-999em;overflow:hidden;background-repeat:no-repeat;text-align:left;direction:ltr}.hidden{display:none;visibility:hidden}.visuallyHidden{border:0!important;clip:rect(0 0 0 0);height:1px!important;margin:-1px!important;overflow:hidden!important;padding:0!important;position:absolute!important;width:1px!important}.invisible{visibility:hidden}.clearfix:before,.clearfix:after{content:"\0020";display:block;height:0;visibility:hidden}.clearfix:after{clear:both}.clearfix{zoom:1}
/* fontawesome */
[class*="fontawesome-"]:before {
font-family: 'FontAwesome', sans-serif;
}
*{
margin:0;
padding:5px;
margin: auto;
color:white;
}
html{ min-width:640px;
}
body{
font-family: 'Fira Sans', sans-serif;
background-color:#333;
margin: auto;
position: absolute;
top: 0; left: 0; bottom: 0; right: 0;
}
.container{
position:relative;
height:760px;
min-width:30rem;
max-width:60rem;
width:auto;
background-color:white;
margin: auto;
border-radius:4px;
overflow:fixed;
box-shadow: 0 2px 6px rgba(0,0,0,0.3);
}
/*icon name*/
.container > section:first-child {
height: 400px;/*300*/
margin:auto;
background: url(https://s3-us-west-2.amazonaws.com/webmx-cdn-static/assets/img/bgboxnew.png);
background-position: bottom;
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size: cover;
}
/*icon*/
.container > section:nth-child(2) {
margin:auto;
height:320px;
background:url(http://d39dlwgeopmdw0.cloudfront.net/assets/img/bgblurnew.png);
background-position: top;
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size: cover;
}
.about{
margin:auto;
padding:20px;
color:white;
text-shadow: 0px 1px 0px rgba(0,0,0,0.3);
}
h1{
font-weight:400;
text-transform:uppercase;
}
h2{
font-weight:300;
text-transform:uppercase;
font-size:30px;
letter-spacing:1px;
}
.connect-icons{
list-style-type: none;
text-align: center;
margin: auto;
padding:40px;
line-height:3rem;
max-width:60rem;
}
.connect-icons li{
position: relative;
display: inline-block;
text-align: center;
width: 80px;
font-size:3em;
margin: 0 6px;
}
.connect-icons li:nth-child(1){
margin-left: 0;
}
.connect-icons li:nth-child(4){
margin-right: 0;
}
.connect-icons li > a{
text-decoration:none;
width: 80px;
display: inline-block;
line-height:10px;
text-align: center;
color: rgba(0,0,0,0.3);
}
.connect-icons li > a, .connect-icons li > a:visited{
display: block;/*inline chanhed*/
min-width: 40px;
position:absolute;/*did the trick*/
padding:20px;
}
.connect-icons li > a:hover{
color: #fff;
text-shadow:none;
-webkit-transition: all 0.2s; /* For Safari 3.1 to 6.0 */
transition: all 0.2s;
-ms-transform: scale(1.1,1.1); /* IE 9 */
-webkit-transform: scale(1.1,1.1); /* Chrome, Safari, Opera */
transform: scale(1.1,1.1);
/*inline changed*/
display: inline-block;
/*recent edits*/
font-size:3.9rem;
color: #fb0078;
text-shadow: 0 0 5px #fff,0 0 10px #fff,0 0 15px #fff,0 0 20px #fb0078,0 0 25px #fb0078,0 0 25px #fb0078,0 0 30px #fb0078,0 0 30px #fb0078;
text-transform: italic;
line-height: inherit;
*, *:before, *:after {
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
box-sizing: border-box;
}
.connect-icons li > a:active {
-ms-transform: scale(0.9,0.9); /* IE 9 */
-webkit-transform: scale(0.9,0.9); /* Chrome, Safari, Opera */
transform: scale(0.9,0.9);
line-height:inherit;
}
.connect-icons li > [class*="text-"] {
display:inline-block;
color:white;
font-size:3.5rem;
font-weight:400;
text-transform:uppercase;
letter-spacing:3px;
-webkit-transition: all 0.2s; /* For Safari 3.1 to 6.0 */
transition: all 0.2s;
opacity: 0;
line-height:inherit;
}
.connect-icons li > [class*="text-"].show{
opacity: 1;
-ms-transform: translateY(-12px); /* IE 9 */
-webkit-transform: translateY(-12px); /* Chrome, Safari, Opera */
transform: translateY(-12px);
}
.connect-box {
-webkit-transition: all .2s ease-out;
-moz-transition: all .2s ease-out;
-ms-transition: all .2s ease-out;
-o-transition: all .2s ease-out;
transition: all .2s ease-out;
}
</style>
<style>
.Absolute-Center {
margin: auto;
position: absolute;
top: 0; left: 0; bottom: 0; right: 0;
}
.Center-Container {
position: relative;
}
.Absolute-Center {
width: 80%;
height: 100%;
overflow: auto;
margin: auto;
position: absolute;
top: 0; left: 0; bottom: 0; right: 0;
}
.Absolute-Center.is-Fixed {
position: fixed;
z-index: 999;
}
.Absolute-Center.is-Responsive {
width: 60%;
height: 60%;
min-width: 200px;
max-width: 400px;
padding: 40px;
}
.Absolute-Center.is-Resizable {
min-width: 20%;
max-width: 80%;
min-height: 20%;
max-height: 80%;
resize: both;
overflow: auto;
}
footer {
height: 80px;
color: #777;
text-align: center;
margin-bottom: 20px;
border-top: 1px solid #e5e5e5;
text-decoration:none;
line-height:16px;
text-align: center;
text-shadow: 0 0 ;
font-size: 14px;
line-height: 1.4;
}
</style>
</head><body>
<div class="container">
<section class="about">
<span class="conect connect-box">
<ul class="connect-icons">
<p style="font-size:3.4em;max-width:30rem;display:inline-block;text-align:center;">I <span class="fa fa-heart" style="font-size:2em;">Social Icons </span> An icon theme concept in CSS
by <a href="http://rayanthony.io" class="github"><span class="fa fa-github">ray anthony</span></a></p>
</ul>
</span>
</section>
<section class="connect">
<div class="box connect-box">
<ul class="connect-icons">
<li><a href="#" class="heart" target="_blank"><span class="fi-heart"></span></a><i class="text-heart"></i></a></li>
<li><a href="#" class="paw" target="_blank"><i class="fi-paw"></i></a></li>
<li><a href="#" class="vimeo" target="_blank"><i class="fi-social-vimeo"></i></a></li>
<li><a href="#" class="github" target="_blank"><i class="fi-social-github"></i></a></li>
<li><a href="#" class="twitter" target="_blank"><i class="fi-social-twitter"></i></a></li>
<li><a href="#" class="medium" target="_blank"><i class="fi-social-medium"></i></a></li>
<li><a href="#" class="tumblr" target="_blank"><i class="fi-social-tumblr"></i></a></li>
<li><a href="#" class="lastfm" target="_blank"><i class="fi-social-lastfm"></i></a></li>
<li><a href="#" class="linkedin" target="_blank"><i class="fi-social-linkedin"></i></a></li>
<li><a href="#" class="stumbleupon" target="_blank"><i class="fi-social-stumbleupon"></i></a></li>
<li><a href="#" class="reddit" target="_blank"><i class="fi-social-reddit"></i></a></li>
<li><a href="#" class="home" target="_blank"><i class="fi-home"></i></a></li>
<li><a href="#" class="pinterest" target="_blank"><i class="fi-social-pinterest"></i></a></li>
<li><a href="#" class="youtube" target="_blank"><i class="fi-social-youtube"></i></a></li>
<li><a href="#" class="facebook" target="_blank"><i class="fi-social-facebook"></i></a></li>
<li><a href="#" class="yahoo" target="_blank"><i class="fi-social-yahoo"></i></a></li>
<li><a href="#" class="google-plus" target="_blank"><i class="fi-social-google-plus"></i></a></li>
<li><a href="#" class="digg" target="_blank"><i class="fi-social-digg"></i></a></li>
<li><a href="#" class="spotify" target="_blank"><i class="fi-social-spotify"></i></a></li>
<li><a href="#" class="amazon" target="_blank"><i class="fi-social-amazon"></i></a></li>
<li><a href="#" class="picasa" target="_blank"><i class="fi-social-picasa"></i></a></li>
<li><a href="#" class="behance" target="_blank"><i class="fi-social-behance"></i></a></li>
<li><a href="#" class="dribbble" target="_blank"><i class="fi-social-dribbble"></i></a></li>
<li><a href="#" class="instagram" target="_blank"><i class="fi-social-instagram"></i></a></li>
<li><a href="#" class="delicious" target="_blank"><i class="fi-social-delicious"></i></a></li>
<li><a href="#" class="smashing-mag" target="_blank"><i class="fi-social-smashing-mag"></i></a></li>
<li><a href="#" class="social-stack-overflow" target="_blank"><i class="fi-social-stack-overflow"></i></a></li>
<li><a href="#" class="codepen" target="_blank"><i class="fa fa-codepen"></i></a></li>
</ul>
</div></div>
</section>
<footer>
<iframe allowtransparency="true" frameborder="0" scrolling="no"
src="//platform.twitter.com/widgets/follow_button.html?screen_name=rayanthonyrcc"
style="width:236px; height:20px;" class="twitter-follow-button twitter-follow-button">
</iframe>
<p>copyright 2015 <a href="http://rayanthony.io">ray anthony </a> © all applicable rights reserved all liabilities waived</p>
<p> <a href="http://oneworldlicense.com"> oneworldlicense.com</a> means open source, free, and made with<i class="fi-heart" alt="made with love icon font ♡ "></i></p>
</footer>
<script> $(window).ready(function() {
$(".connect-icons a").hover(function(){
$(".connect-box").toggleClass("color-"+ this.className );
$(".text-"+ this.className).toggleClass("show");
});
});</script>
<script type="text/javascript" src="https://code.jquery.com/jquery-2.1.1.min.js"></script>
<script src="http://statspring.com/springboard.js"></script><script>Springboard.replaceAssets();</script></body></html>
/*
OF COURSE THIS IS THE HTML5 ✰ Boilerplate
*/
html,body,div,span,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,abbr,address,cite,code,del,dfn,em,img,ins,kbd,q,samp,small,strong,sub,sup,var,b,i,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,figcaption,figure,footer,header,hgroup,menu,nav,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;outline:0;font-size:100%;vertical-align:baseline;background:transparent}article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}nav ul{list-style:none}blockquote,q{quotes:none}blockquote:before,blockquote:after,q:before,q:after{content:'';content:none}a{margin:0;padding:0;font-size:100%;vertical-align:baseline;background:transparent}ins{background-color:#ff9;color:#000;text-decoration:none}mark{background-color:#ff9;color:#000;font-style:italic;font-weight:bold}del{text-decoration:line-through}abbr[title],dfn[title]{border-bottom:1px dotted;cursor:help}table{border-collapse:collapse;border-spacing:0}hr{display:block;height:1px;border:0;border-top:1px solid #ccc;margin:1em 0;padding:0}input,select{vertical-align:middle}body{font:13px/1.231 sans-serif;*font-size:small}select,input,textarea,button{font:99% sans-serif}pre,code,kbd,samp{font-family:monospace,sans-serif}h1,h2,h3,h4,h5,h6{font-weight:bold}a:hover,a:active{outline:none}a,a:active,a:visited{color:#607890}a:hover{color:#036}ul,ol{margin-left:2em}ol{list-style-type:decimal}nav ul,nav li{margin:0}small{font-size:85%}strong,th{font-weight:bold}td,td img{vertical-align:top}sub,sup{font-size:75%;line-height:0;position:relative}sup{top:-0.5em}sub{bottom:-0.25em}pre{padding:15px;white-space:pre;white-space:pre-wrap;white-space:pre-line;word-wrap:break-word}textarea{overflow:auto}.ie6 legend,.ie7 legend{margin-left:-7px}input[type="radio"]{vertical-align:text-bottom}input[type="checkbox"]{vertical-align:bottom}.ie7 input[type="checkbox"]{vertical-align:baseline}.ie6 input{vertical-align:text-bottom}label,input[type="button"],input[type="submit"],input[type="image"],button{cursor:pointer}button,input,select,textarea{margin:0}input:invalid,textarea:invalid{border-radius:1px;-moz-box-shadow:0 0 5px red;-webkit-box-shadow:0 0 5px red;box-shadow:0 0 5px red}.no-boxshadow input:invalid,.no-boxshadow textarea:invalid{background-color:#f0dddd}::-moz-selection{background:#ff5e99;color:#fff;text-shadow:none}::selection{background:#ff5e99;color:#fff;text-shadow:none}a:link{-webkit-tap-highlight-color:#ff5e99}button{width:auto;overflow:visible}.ie7 img{-ms-interpolation-mode:bicubic}.ir{display:block;text-indent:-999em;overflow:hidden;background-repeat:no-repeat;text-align:left;direction:ltr}.hidden{display:none;visibility:hidden}.visuallyHidden{border:0!important;clip:rect(0 0 0 0);height:1px!important;margin:-1px!important;overflow:hidden!important;padding:0!important;position:absolute!important;width:1px!important}.invisible{visibility:hidden}.clearfix:before,.clearfix:after{content:"\0020";display:block;height:0;visibility:hidden}.clearfix:after{clear:both}.clearfix{zoom:1}
/*green dull iridescent text links*/
body,select,input,textarea{color:hsl(188,73%,90%);text-shadow:1px 1px 1px hsl(300,0%,0%);font:14px/24px helvetica,arial,sans-serif}
a, a:visited {color:hsl(188,73%,85%); }
a:hover { color:hsl(188,73%,75%);}
/*overide above*/
body,select,input,textarea{color:#999;text-shadow:1px 1px 1px hsl(300,0%,0%);font:14px/24px helvetica,arial,sans-serif}
a, a:visited {color:#777; }
a:hover { color:#bbb;}
/* Primary Styles
Author: Paul Irish and some hookups from Divya Manian
*/
/* Thanks Lea Verou: leaverou.me/demos/css3-patterns.html and Divya Manian for the implementation. */
html { min-height: 100%; }
html {
background: hsl(68, 1%, 28%);
background-image: -webkit-gradient(linear, 0 50%, 0 100%, from(transparent), to(hsla(300, 0%, 0%, 0.8))),
-webkit-gradient(linear, 0 100%, 100% 0,
color-stop(.25, hsla(300, 0%, 100%, 0.08)), color-stop(.25, transparent),
color-stop(0.5, transparent), color-stop(0.5, hsla(300, 0%, 100%, 0.08)),
color-stop(.75, hsla(300, 0%, 100%, 0.08)), color-stop(.75, transparent),
to(transparent)),
-webkit-gradient(linear, 0 0, 100% 100%,
color-stop(.25, hsla(300, 0%, 100%, 0.08)), color-stop(.25, transparent),
color-stop(0.5, transparent), color-stop(0.5, hsla(300, 0%, 100%, 0.08)),
color-stop(.75, hsla(300, 0%, 100%, 0.08)), color-stop(.75, transparent),
to(transparent));
background-image: -moz-linear-gradient(transparent, hsla(300, 0%, 0%, 0.8)),
-moz-linear-gradient(45deg, hsla(300, 0%, 0%, 0.08) 25%, transparent 25%,
transparent 50%, hsla(300, 0%, 0%, 0.08) 50%, hsla(300, 0%, 0%, 0.08) 75%,
transparent 75%, transparent),
-moz-linear-gradient(-45deg, hsla(300, 0%, 0%, 0.08) 25%, transparent 25%,
transparent 50%, hsla(300, 0%, 0%, 0.08) 50%, hsla(300, 0%, 0%, 0.08) 75%,
transparent 75%, transparent);
background-image: -o-linear-gradient(transparent, hsla(300, 0%, 0%, 0.8)),
-o-linear-gradient(45deg, hsla(300, 0%, 0%, 0.08) 25%, transparent 25%,
transparent 50%, hsla(300, 0%, 0%, 0.08) 50%, hsla(300, 0%, 0%, 0.08) 75%,
transparent 75%, transparent),
-o-linear-gradient(-45deg, hsla(300, 0%, 0%, 0.08) 25%, transparent 25%,
transparent 50%, hsla(300, 0%, 0%, 0.08) 50%, hsla(300, 0%, 0%, 0.08) 75%,
transparent 75%, transparent);
background-image: linear-gradient(transparent, hsla(300, 0%, 0%, 0.8)),
linear-gradient(45deg, hsla(300, 0%, 0%, 0.08) 25%, transparent 25%,
transparent 50%, hsla(300, 0%, 0%, 0.08) 50%, hsla(300, 0%, 0%, 0.08) 75%,
transparent 75%, transparent),
linear-gradient(-45deg, hsla(300, 0%, 0%, 0.08) 25%, transparent 25%,
transparent 50%, hsla(300, 0%, 0%, 0.08) 50%, hsla(300, 0%, 0%, 0.08) 75%,
transparent 75%, transparent);
}
body { margin:0; padding: 0px; font-family: 'PT Sans', 'Corben', sans-serif; font-weight: bold;}
#main { margin: 20px auto 0; padding:20px 20px 10px; width: 908px; position: relative;
-moz-border-radius: 6px; -webkit-border-radius:6px; border-radius: 6px;
}
h1 { font: 60px/68px Sniglet, 'ChunkFiveRegular', Arial, sans-serif; margin: 0 auto; text-align: center; }
h1 span { display: block; color: white; }
canvas {
height: 250px; width: 99%;
outline: 4px solid rgba(255,255,255,.6); margin-bottom: .4em; position:relative; cursor: crosshair;
-moz-outline-radius:3px; -webkit-outline-radius:3px; -o-outline-radius: 3px; outline-radius: 3px;
-moz-box-shadow: 0 1px 10px hsla(200, 5%, 10%, .5);
-webkit-box-shadow: 0 1px 10px hsla(200, 5%, 10%, .5);
box-shadow: 0 1px 10px hsla(200, 5%, 10%, .5);
}
/*
* media queries for responsive design
* these follow after primary styles so they will successfully override.
*/
@media all and (orientation:portrait) {
}
@media all and (orientation:landscape) {
}
@media screen and (max-device-width: 480px) {
}
/*
* print styles
* inlined to avoid required HTTP connection www.phpied.com/delay-loading-your-print-css/
*/
@media print {
* { background: transparent !important; color: black !important; text-shadow: none !important; filter:none !important;
-ms-filter: none !important; } /* black prints faster: sanbeiji.com/archives/953 */
a, a:visited { color: #444 !important; text-decoration: underline; }
a[href]:after { content: " (" attr(href) ")"; }
abbr[title]:after { content: " (" attr(title) ")"; }
.ir a:after, a[href^="javascript:"]:after, a[href^="#"]:after { content: ""; } /* don't show links for images, or javascript/internal links */
pre, blockquote { border: 1px solid #999; page-break-inside: avoid; }
thead { display: table-header-group; } /* css-discuss.incutio.com/wiki/Printing_Tables */
tr, img { page-break-inside: avoid; }
@page { margin: 0.5cm; }
p, h2, h3 { orphans: 3; widows: 3; }
h2, h3{ page-break-after: avoid; }
}
.zsocial {
font-size: 60px;
color: #fb0078;
text-shadow: 0 0 5px #fff,0 0 10px #fff,0 0 15px #fff,0 0 20px #fb0078,0 0 25px #fb0078,0 0 25px #fb0078,0 0 30px #fb0078,0 0 30px #fb0078;
margin-right: 5px;
font-style: italic;
line-height: inherit;
*, *:before, *:after {
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
box-sizing: border-box;
}
Pseudo ::before element
.connect-icons
.fi-heart:before {
content: "\f159";
}
font-family: 'zocial', sans-serif;
font-style: normal;
font-weight: normal;
font-variant: normal;
text-transform: none;
line-height: 1;
-webkit-font-smoothing: antialiased;
display: inline-block;
text-decoration: inherit;
}
.connect-icons
*, *:before, *:after {
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
box-sizing: border-box;
}
Pseudo ::after element
.connect-icons
*, *:before, *:after {
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
box-sizing: border-box;
}
Inherited from li
.connect-icons
div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, form, p, blockquote, th, td {
margin: 0;
padding: 0;
direction: ltr;
}
user agent stylesheetli {
display: list-item;
text-align: -webkit-match-parent;
}
Inherited from ul.icon-styles.large-block-grid-5.small-block-grid-3
.icon-styles {
text-align: center;
}
.connect-icons
ul, ol, dl {
font-size: 1rem;
line-height: 2rem;
margin-bottom: 1rem;
list-style-position: outside;
font-family: inherit;
}
.connect-icons
div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, form, p, blockquote, th, td {
margin: 0;
padding: 2px;
direction: ltr;
}
