linear;-o-transition: box-shadow .3s linear, background .2s linear;transition: box-shadow .3s linear, background .2s linear;}.mok-metro-social .fd{background:url(https://lh3.googleusercontent.com/-TqPZ-v642ZE/UYSi1cM11EI/AAAAAAAAAQU/64BY1HhedMA/h120/feed.png) no-repeat center center #e9a01c;width:70px;height:70px;-webkit-transition: box-shadow .3s linear, background .2s linear;-moz-transition: box-shadow .3s linear, background .2s linear;-ms-transition: box-shadow .3s linear, background .2s linear;-o-transition: box-shadow .3s linear, background .2s linear;transition: box-shadow .3s linear, background .2s linear;}.mok-metro-social li:hover .fb{background:url(https://lh6.googleusercontent.com/-UN0N7Qnfx_s/UYSi1XRsRgI/AAAAAAAAAQY/h8-R0wSZz24/h120/facebookfh.png) no-repeat center center #1f69b3; box-shadow:0px 0px 6px 3px #217BC0;-webkit-box-shadow:0px 0px 6px 3px #217BC0;-moz-box-shadow:0px 0px 6px 3px #217BC0;-o-box-shadow:0px 0px 6px 3px #217BC0;-ms-box-shadow:0px 0px 6px 3px #217BC0;}.mok-metro-social li:hover .tw{background:url(https://lh4.googleusercontent.com/-w8hfqwI1fro/UYSi26Ys2mI/AAAAAAAAAQ4/S6bh1T3WZw8/h120/twitter-bird-dark-bgsx.png) no-repeat center center #43b3e5; box-shadow:0px 0px 6px 3px #38D1F7;-webkit-box-shadow:0px 0px 6px 3px #38D1F7;-moz-box-shadow:0px 0px 6px 3px #38D1F7;-o-box-shadow:0px 0px 6px 3px #38D1F7;-ms-box-shadow:0px 0px 6px 3px #38D1F7;}.mok-metro-social li:hover .gp{background:url(https://lh4.googleusercontent.com/-srzm-9YDILE/UYSi2bX-v1I/AAAAAAAAAQw/BenmWbVnjbM/h120/google%2Bplush.png) no-repeat center center #da4a38; box-shadow:0px 0px 6px 3px #F43431;-webkit-box-shadow:0px 0px 6px 3px #F43431;-moz-box-shadow:0px 0px 6px 3px #F43431;-o-box-shadow:0px 0px 6px 3px #F43431;-ms-box-shadow:0px 0px 6px 3px #F43431;}.mok-metro-social li:hover .fd{background:url(https://lh6.googleusercontent.com/-6bVW---kuQ8/UYSi2N7ReOI/AAAAAAAAAQo/rRWRy2uqGl8/h120/feedh.png) no-repeat center center #e9a01c; box-shadow:0px 0px 6px 3px #e9a01c;-webkit-box-shadow:0px 0px 6px 3px #e9a01c;-moz-box-shadow:0px 0px 6px 3px #e9a01c;-o-box-shadow:0px 0px 6px 3px #e9a01c;-ms-box-shadow:0px 0px 6px 3px #e9a01c;}.cf:before, .cf:after{ content:""; display:table;}.cf:after{ clear:both;}.cf{ zoom:1;} /* Form wrapper styling */.form-wrapper { width: 280px;}/* Form text input */.form-wrapper input { width: 215px; height: 20px; padding: 10px 5px; float: left; font: bold 12px 'lucida sans', 'trebuchet MS', 'Tahoma'; border: 0;box-shadow: 0 0 6px rgba(0,0,0,.3) inset;webkit-transition: box-shadow .3s linear, background .2s linear;-moz-transition: box-shadow .3s linear, background .2s linear;-ms-transition: box-shadow .3s linear, background .2s linear;-o-transition: box-shadow .3s linear, background .2s linear;transition: box-shadow .3s linear, background .2s linear;}.form-wrapper input:focus { outline: 0; background: #fff; border-color: #51a7e8; box-shadow: 0 0 2px rgba(0,0,0,.8) inset;}.form-wrapper input::-webkit-input-placeholder { color: #999; font-weight: normal; font-style: italic;}.form-wrapper input:-moz-placeholder { color: #999; font-weight: normal; font-style: italic;}.form-wrapper input:-ms-input-placeholder { color: #999; font-weight: normal; font-style: italic;} /* Form submit button */.form-wrapper button { overflow: visible; position: relative; float: right; border: 0; padding: 0; cursor: pointer; height: 40px; width: 75px; background:url(https://lh5.googleusercontent.com/-bfasMiPvfZA/UYSkiD6sABI/AAAAAAAAARY/ecjiB_C8oyk/h120/1367665345_search.png) no-repeat center center #26B11E; border-radius: 0 0 0 0; text-shadow: 0 -1px 0 rgba(0, 0 ,0, .3);webkit-transition: box-shadow .3s linear, background .2s linear;-moz-transition: box-shadow .3s linear, background .2s linear;-ms-transition: box-shadow .3s linear, background .2s linear;-o-transition: box-shadow .3s linear, background .2s linear;transition: box-shadow .3s linear, background .2s linear;} .form-wrapper button:hover{ background:url(https://lh5.googleusercontent.com/-bfasMiPvfZA/UYSkiD6sABI/AAAAAAAAARY/ecjiB_C8oyk/h120/1367665345_search.png) no-repeat center center #26B11E;box-shadow:0px 0px 6px 3px #44D816;-webkit-box-shadow:0px 0px 6px 3px #44D816;-moz-box-shadow:0px 0px 6px 3px #44D816;-o-box-shadow:0px 0px 6px 3px #44D816;-ms-box-shadow:0px 0px 6px 3px #44D816;} .form-wrapper button:active,.form-wrapper button:focus{ background:url(https://lh5.googleusercontent.com/-bfasMiPvfZA/UYSkiD6sABI/AAAAAAAAARY/ecjiB_C8oyk/h120/1367665345_search.png) no-repeat center center #26B11E; outline: 0; }.form-wrapper button:before { /* left arrow */ content: ''; position: absolute; border-width: 8px 8px 8px 0; border-style: solid solid solid none; border-color: transparent #26B11E transparent; top: 12px; left: -6px;}.form-wrapper button:hover:before{ border-right-color: #26B11E;}.form-wrapper button:focus:before,.form-wrapper button:active:before{ border-right-color: #26B11E;} .form-wrapper button::-moz-focus-inner { /* remove extra button spacing for Mozilla Firefox */ border: 0; padding: 0;} ATENCAO! Para esses itens escritos INCLUA O SEU voce deve configurar com seus dados de acesso em cada rede social.5) Salve e veja o resultado4a- POSTAGENS RECENTES COM EFEITO E RESUMOEste codigo tem como finalidade mostrar as postagens recentes do seu blog na lateral (sidebar). O diferencial dele e que os quadrinhos de postagem se movem, ficam sombreados e abaixo aparece um trecho da postagem escrita. Bora para o codigo!1) entre no layout do blog2) adicionar gadget3) html/javascript4) copie e cole o codigo abaixo#post-gallery {width:100%;