#logo { display:inline; } #social { float:right; } #social div { margin:2px 0; } #footer { margin:20px 0 200px 0; } #footer a { display:block; float:left; margin:0 10px; } .fb-like { height:20px; } .googleplus { position: relative; font-size: 12px; height: 2em; width: 2em; background: #2C2C2C; display: block; border-radius: 0.3em; overflow: hidden; } .googleplus::before { left: -0.1em; font-size: 2.9em; top: -0.36em; position: absolute; display: block; content: "g"; color: #EDEEE8; font-family: georgia; } .googleplus::after { left: 0.9em; top: -0.3em; position: absolute; display: block; content: "+"; font-size: 1.25em; font-weight: bold; color: #EDEEE8; font-family: georgia; } .facebook { position: relative; font-size: 12px; height: 2em; width: 2em; background: #2C2C2C; display: block; border-radius: 0.3em; } .facebook::before { left: 0.85em; top: 0.7em; position: absolute; display: block; content: ""; height: 0.3em; width: 0.85em; background: #EDEEE8; } .facebook::after { left: 1.1em; top: 0.1em; position: absolute; display: block; content: ""; height: 1.5em; width: 0.3em; border-radius: 0.4em 0 0 0; border: 0.3em solid #EDEEE8; border-right: 0; border-bottom: 0; } .twitter { position: relative; font-size: 12px; height: 2em; width: 2em; background: #2C2C2C; display: block; border-radius: 0.3em; } .twitter::before { left: 0.55em; top: 0.4em; position: absolute; display: block; content: ""; height: 1.2em; width: 0.32em; background: #2C2C2C; border-radius: 0.5em 0.5em 0 0.9em; box-shadow: 0 0 0 0.15em #EDEEE8; } .twitter::after { left: 0.87em; top: 1.143333em; position: absolute; display: block; content: ""; height: 0.32em; width: 0.62em; background: #2C2C2C; border-radius: 0 0.4em 0.4em 0; box-shadow: 0 -0.57em 0 -0.15em #2C2C2C,-0.2em -0.57em 0 -0.15em #2C2C2C,0 -0.57em 0 0em #EDEEE8; border: 0.15em solid #EDEEE8; border-left: 0; }