.wrap { width:100%; }

.container { max-width: 300px; min-width: 300px; width:100%; min-height: 250px; height: 250px; margin: auto; position: absolute; top: 0; left: 0; bottom: 0; right: 0; }
 

.container #connect { position: relative; }
.container #connect figure { min-width: 50px; min-height: 50px; display: inline-block; position: absolute; -webkit-perspective: 1000; }  
.container #connect figure a { display: inline-block; width: 100%; height: 100%; } 

.container #connect figure.me { overflow: hidden; width: 150px; height: 150px; top:   0px; left:   0px; }
.container #connect figure.me a { background-color: #eaeaea; }

.container #connect figure.tw { overflow: hidden; width: 100px; height: 100px; top: 150px; left:  50px; }
.container #connect figure.tw a { background-color: #28a9e2; }

.container #connect figure.in { overflow: hidden; width:  50px; height:  50px; top:  50px; left: 250px; }
.container #connect figure.in a { background-color: #007bb6; } 

.container #connect figure.yt { overflow: hidden; width:  50px; height:  50px; top: 150px; left:   0px; }
.container #connect figure.yt a { background-color: #e32c26; }

.container #connect figure.ig { overflow: hidden; width:  50px; height:  50px; top: 200px; left:   0px; }
.container #connect figure.ig a { background-color: #305b88; }

.container #connect figure.rc { overflow: hidden; width: 150px; height: 150px; top: 100px; left: 150px; }
.container #connect figure.rc a { background-color: #f26663; }   

.container #connect figure.fb { overflow: hidden; width:  50px; height:  50px; top:   0px; left: 250px; }
.container #connect figure.fb a { background-color: #eeeeee; }

.container #connect figure.widgif { overflow: hidden; width: 100px; height: 100px; top:   0px; left: 150px; }
.container #connect figure.widgif a { background-color: #3a559f; }


.container #connect figure a {
    -webkit-transition: all 2s ease-in-out; 
    -moz-transition: all 2s ease-in-out;
    -ms-transition: all 2s ease-in-out;
    -o-transition: all 2s ease-in-out;
    transition: all 2s ease-in-out;
}
.container #connect figure a:hover {
    -webkit-transform: scale(1.15); 
}

.container #connect figure {
    -webkit-transition: border 3s ease-in-out .5s; 
    -moz-transition: border 3s ease-in-out .5s;
    -ms-transition: border 3s ease-in-out .5s;
    -o-transition: border 3s ease-in-out .5s;
    transition: border 3s ease-in-out .5s;
    border: 80px solid #fff;
}
.container #connect figure.full {
    border: 2px solid #fff;
}