html {
font-size: 20px;
}
body {
margin:0 auto;
padding: 0px;
}
/* Wrapper */
.icon-button {
box-shadow: 0 0 0 30px transparent;
background: rgba(255, 255, 255, 0.1);
cursor: pointer;
display: inline-block;
font-size: 20px;
height: 1.6rem;
line-height:0;
margin: 0;
position: relative;
text-align: center;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
width: 1.6rem;
}
.icon-button:hover{
background-color: #2a3036;
color: white;
border: 1px solid #fff;
box-shadow: 0 0 0 0 rgba(255, 255, 255, 0.2);
-webkit-transition: box-shadow 0.4s ease-in-out, border-color 0.4s ease-in;
-moz-transition: box-shadow 0.4s ease-in-out, border-color 0.4s ease-in;
-o-transition: box-shadow 0.4s ease-in-out, border-color 0.4s ease-in;
-ms-transition: box-shadow 0.4s ease-in-out, border-color 0.4s ease-in;
transition: box-shadow 0.4s ease-in-out, border-color 0.4s ease-in;
}
/* Circle */
.icon-button span {
border-radius: 0;
display: block;
height: 0;
left:36px;
margin: 0;
position: absolute;
top:36px;
-webkit-transition: all 0.3s;
-moz-transition: all 0.3s;
-o-transition: all 0.3s;
transition: all 0.3s;
width: 0;
}
.icon-button:hover span {
width: 1.6rem;
height: 1.6rem;
margin: -36px;
}
.twitter span {
background-color: #4099ff;
}
.facebook span {
background-color: #3B5998;
}
.google-plus span {
background-color: #db5a3c;
}
.pinterest span {
background-color: #C92228;
}
.envelope-alt span {
background-color: #69d376;
}
/* Icons */
.icon-button i {
background: none;
color: white;
height: 1.6rem;
left: 0;
line-height: 1.6rem;
position: absolute;
top: 0;
-webkit-transition: all 0.3s;
-moz-transition: all 0.3s;
-o-transition: all 0.3s;
transition: all 0.3s;
width: 1.6rem;
z-index: 10;
}
.icon-button .icon-twitter {
color: #4099ff;
}
.icon-button .icon-facebook {
color: #3B5998;
}
.icon-button .icon-google-plus {
color: #db5a3c;
}
.icon-button .icon-pinterest {
color: #C92228;
}
.icon-button .icon-envelope-alt {
color: #000000;
}
.icon-button:hover .icon-twitter,
.icon-button:hover .icon-facebook,
.icon-button:hover .icon-google-plus,
.icon-button:hover .icon-pinterest,
.icon-button:hover .icon-envelope-alt {
color: white;
}
.title
{
background-color:#3C3B3B;
width:100%;
height:auto;
float:left;
position:relative;
z-index:999;
padding-top:6px;
}
.heading
{
margin-top:10px;
width: 300px;
}
.fb
{
width:100%;
height:auto;
float:left;
margin-top:6px;
}
.logo-img
{
width:11%;
margin-top: -4%;
}