Menu responsive

viernes, 25 de marzo de 2016

alert-message




<div style="text-align: left;"><b><span style="font-family: inherit; font-size: large;">Alert Message</span></b></div><br />

<div class="alert-message success">success message : You successfully read this important message.<i class="fa fa-check-circle"></i></div><br />

<div class="alert-message alert">Alert message : This alert needs your attention.<i class="fa fa-info-circle"></i></div><br />

<div class="alert-message warning">Warning message : Warning! Best check yo self.<i class="fa fa-exclamation-triangle"></i></div><br />

<div class="alert-message error">Error message : Oh snap! Change a few things up.<i class="fa fa-exclamation-circle"></i></div><br />



.alert-message{position:relative;display:block;background-color:#f7f8fa;padding:20px;margin:20px 0;border-radius:2px;color:#39484d;}
.alert-message p{margin:0!important;padding:0;line-height:22px;font-size:13px;color:#39484d}
.alert-message span{font-size:14px!important}
.alert-message i{font-size:22px;text-align:left;display:inline-block;
position:absolute;right:0;top:0;padding:20px;opacity:0.8;}
.alert-message.success{background-color:#00acd6;color:#fff}
.alert-message.success a,.alert-message.success span{color:#fff}
.alert-message.alert{background-color:#0073b7;color:#fff}
.alert-message.alert a,.alert-message.alert span{color:#fff}
.alert-message.warning{background-color:#efa666;color:#fff}
.alert-message.warning a,.alert-message.warning span{color:#fff}
.alert-message.error{background-color:#f56c7e;color:#fff}
.alert-message.error a,.alert-message.error span{color:#fff}
.fa-check-circle:before{content:"\f058"}
.fa-info-circle:before{content:"\f05a"}
.fa-exclamation-triangle:before{content:"\f071"}
.fa-exclamation-circle:before{content:"\f06a"}



Alert Message
success message : You successfully read this important message.

Alert message : This alert needs your attention.

Warning message : Warning! Best check yo self.

Error message : Oh snap! Change a few things up.









download demo






.btn{list-style:none;text-align:center;margin:10px!important;padding:10px!important;font-size:14px;clear:both;display:inline-block;text-decoration:none!important;color:#FFF!important}
.btn ul {margin:0;padding:0}
.btn li{display:inline;margin:5px;padding:0;list-style:none;}
.demo,.download{padding:12px 15px!important;color:#fff!important;font-weight:700;font-size:14px;font-family:Open Sans,sans-serif;text-align:center;text-transform:uppercase;border-radius:3px;opacity:.95;border:0;letter-spacing:2px;transition:all .2s ease-out}
.demo {background-color:#3498DB;}
.download {background-color:#1ABC84;}
.demo:hover {background-color:#60B8F4;color:#fff;border-bottom:2px solid #3498DB; opacity:1;} .download:hover {background-color:#49DDAA;color:#fff;border-bottom:2px solid #1ABC84;opacity:1;} .demo:before {content:&#39;\f135&#39;;display:inline-block;font-weight:normal;vertical-align:top;margin-right:10px;width:16px;height:16px;line-height:24px;font-family:fontawesome;transition:all 0.5s ease-out;} .download:before {content:&#39;\f019&#39;;display:inline-block;font-weight:normal;vertical-align:top;margin-right:10px;width:16px;height:16px;line-height:24px;font-family:fontawesome;transition:all 0.5s ease-out;}



<div style="text-align: center;"> <ul class="btn"> <li><a class="demo" href="YOUR-LINK-HERE" target="_blank">DEMO</a></li> <li><a class="download" href=" YOUR-LINK-HERE" target="_blank">DOWNLOAD</a></li> </ul> </div>





botones



<h3 class="shortcodeh">

&nbsp;Buttons</h3> <a class="button" href="#">Button</a> <a class="button red" href="#">red Button</a> <a class="button orange" href="#">orange Button</a> <a class="button green" href="#">green Button</a> <a class="button blue" href="h#">blue Button</a> <a class="button purple" href="#">purple Button</a> <a class="button yellow" href="#">yellow Button</a> <a class="button mint" href="#">mint Button</a> <a class="button aqua" href="#">aqua Button</a> <a class="button pink" href="#">pink Button</a> <a class="button white" href="#">white Button</a> <a class="button grey" href="#">grey Button</a> <a class="button dark-grey" href="#">dark-grey Button</a> <br /> <a class="button transparent" href="#">Button</a> <a class="button transparent red" href="#">red Button</a> <a class="button transparent orange" href="#">orange Button</a> <a class="button transparent green" href="#">green Button</a> <a class="button transparent blue" href="#">blue Button</a> <a class="button transparent purple" href="#">purple Button</a> <a class="button transparent yellow" href="#">yellow Button</a> <a class="button transparent mint" href="#">mint Button</a> <a class="button transparent aqua" href="#">aqua Button</a> <a class="button transparent pink" href="#">pink Button</a> <a class="button transparent grey" href="#">grey Button</a> <a class="button transparent dark-grey" href="#">dark-grey Button</a> <br /> <a class="button" href="#"><i class="fa fa-bolt"></i>Button</a> <a class="button red" href="#"><i class="fa fa-bookmark"></i>red Button</a> <a class="button orange" href="#"><i class="fa fa-cart-arrow-down"></i>orange Button</a> <a class="button green" href="#"><i class="fa fa-bars"></i>green Button</a> <a class="button blue" href="#"><i class="fa fa-cloud-download"></i>blue Button</a> <a class="button purple" href="#"><i class="fa fa-fighter-jet"></i>purple Button</a> <a class="button yellow" href="#"><i class="fa fa-external-link"></i>yellow Button</a> <a class="button mint" href="#"><i class="fa fa-gavel"></i>mint Button</a> <a class="button aqua" href="#"><i class="fa fa-life-ring"></i>aqua Button</a> <a class="button pink" href="#"><i class="fa fa-magic"></i>pink Button</a> <a class="button white" href="#"><i class="fa fa-location-arrow"></i>white Button</a> <a class="button grey" href="#"><i class="fa fa-leaf"></i>grey Button</a> <a class="button dark-grey" href="#"><i class="fa fa-meh-o"></i>dark-grey Button</a> <br />



.button,input.button{position:relative;display:inline-block;margin-right:1em;margin-bottom:1.34em;padding:0.667em 2em;border-bottom:none;-webkit-border-radius:0.333em;-moz-border-radius:0.333em;border-radius:0.333em;background-color:rgba(84,87,102,1);color:#FFFFFF!important;text-decoration:none!important;text-transform:uppercase;font-size:0.778em!important;line-height:1.714em!important;cursor:pointer}


.button,input.button{-webkit-transition:background-color 0.3s linear,color 0.3s linear;-moz-transition:background-color 0.3s linear,color 0.3s linear;transition:background-color 0.3s linear,color 0.3s linear}.button:hover,input.button:hover{border-bottom:none;background-color:rgba(84,87,102,0.9)}.button:active,input.button:active{box-shadow:inset 0 3px 1px rgba(0,0,0,0.1);-webkit-box-shadow:inset 0 3px 1px rgba(0,0,0,0.1);-moz-box-shadow:inset 0 3px 1px rgba(0,0,0,0.1)}.button i{margin-right:0.667em;vertical-align:middle;line-height:1em!important}.button.red,input.button.red{background-color:rgba(253,104,91,1)}.button.red:hover,input.button.red:hover{background-color:rgba(253,104,91,0.9)}.button.orange,input.button.orange{background-color:rgba(250,111,87,1)}.button.orange:hover,input.button.orange:hover{background-color:rgba(250,111,87,0.9)}.button.yellow,input.button.yellow{background-color:rgba(254,205,94,1)}.button.yellow:hover,input.button.yellow:hover{background-color:rgba(254,205,94,0.9)}.button.green,input.button.green{background-color:rgba(161,210,110,1)}.button.green:hover,input.button.green:hover{background-color:rgba(161,210,110,0.9)}.button.mint,input.button.mint{background-color:rgba(79,206,173,1)}.button.mint:hover,input.button.mint:hover{background-color:rgba(79,206,173,0.9)}.button.aqua,input.button.aqua{background-color:rgba(85,193,231,1)}.button.aqua:hover,input.button.aqua:hover{background-color:rgba(85,193,231,0.9)}.button.blue,input.button.blue{background-color:rgba(96,158,234,1)}.button.blue:hover,input.button.blue:hover{background-color:rgba(96,158,234,0.9)}.button.purple,input.button.purple{background-color:rgba(171,148,233,1)}.button.purple:hover,input.button.purple:hover{background-color:rgba(171,148,233,0.9)}.button.pink,input.button.pink{background-color:rgba(234,137,191,1)}.button.pink:hover,input.button.pink:hover{background-color:rgba(234,137,191,0.9)}.button.white,input.button.white{background-color:rgba(255,255,255,1);color:#545766!important}.button.white:hover,input.button.white:hover{background-color:rgba(255,255,255,0.9)}.button.grey,input.button.grey{background-color:rgba(170,178,188,1)}.button.grey:hover,input.button.grey:hover{background-color:rgba(170,178,188,0.9)}.button.dark-grey,input.button.dark-grey{background-color:rgba(84,87,102,1)}.button.dark-grey:hover,input.button.dark-grey:hover{background-color:rgba(84,87,102,0.9)}.button.transparent,input.button.transparent{border:2px solid rgba(84,87,102,1);background-color:transparent;color:rgba(84,87,102,1)!important}.button.transparent:hover,input.button.transparent:hover{border:2px solid rgba(84,87,102,1);background-color:rgba(84,87,102,1);color:#fff!important}.button.transparent.red,input.transparent.button.red{border:2px solid rgba(253,104,91,1);color:rgba(253,104,91,1)!important}.button.transparent.red:hover,input.button.transparent.red:hover{border:2px solid rgba(253,104,91,1);background-color:rgba(253,104,91,1);color:#fff!important}.button.transparent.orange,input.transparent.button.orange{border:2px solid rgba(250,111,87,1);color:rgba(250,111,87,1)!important}.button.transparent.orange:hover,input.button.transparent.orange:hover{border:2px solid rgba(250,111,87,1);background-color:rgba(250,111,87,1);color:#fff!important}.button.transparent.yellow,input.transparent.button.yellow{border:2px solid rgba(254,205,94,1);color:rgba(254,205,94,1)!important}.button.transparent.yellow:hover,input.button.transparent.yellow:hover{border:2px solid rgba(254,205,94,1);background-color:rgba(254,205,94,1);color:#fff!important}.button.transparent.green,input.transparent.button.green{border:2px solid rgba(161,210,110,1);color:rgba(161,210,110,1)!important}.button.transparent.green:hover,input.button.transparent.green:hover{border:2px solid rgba(161,210,110,1);background-color:rgba(161,210,110,1);color:#fff!important}.button.transparent.mint,input.transparent.button.mint{border:2px solid rgba(79,206,173,1);color:rgba(79,206,173,1)!important}.button.transparent.mint:hover,input.button.transparent.mint:hover{border:2px solid rgba(79,206,173,1);background-color:rgba(79,206,173,1);color:#fff!important}.button.transparent.aqua,input.transparent.button.aqua{border:2px solid rgba(85,193,231,1);color:rgba(85,193,231,1)!important}.button.transparent.aqua:hover,input.button.transparent.aqua:hover{border:2px solid rgba(85,193,231,1);background-color:rgba(85,193,231,1);color:#fff!important}.button.transparent.blue,input.transparent.button.blue{border:2px solid rgba(96,158,234,1);color:rgba(96,158,234,1)!important}.button.transparent.blue:hover,input.button.transparent.blue:hover{border:2px solid rgba(96,158,234,1);background-color:rgba(96,158,234,1);color:#fff!important}.button.transparent.purple,input.transparent.button.purple{border:2px solid rgba(171,148,233,1);color:rgba(171,148,233,1)!important}.button.transparent.purple:hover,input.button.transparent.purple:hover{border:2px solid rgba(171,148,233,1);background-color:rgba(171,148,233,1);color:#fff!important}.button.transparent.pink,input.transparent.button.pink{border:2px solid rgba(234,137,191,1);color:rgba(234,137,191,1)!important}.button.transparent.pink:hover,input.button.transparent.pink:hover{border:2px solid rgba(234,137,191,1);background-color:rgba(234,137,191,1);color:#fff!important}.button.transparent.white,input.transparent.button.white{border:2px solid rgba(255,255,255,1);color:rgba(255,255,255,1)!important}.button.transparent.white:hover,input.button.transparent.white:hover{border:2px solid rgba(255,255,255,1);background-color:rgba(255,255,255,1);color:#545766!important}.button.transparent.grey,input.transparent.button.grey{border:2px solid rgba(170,178,188,1);color:rgba(170,178,188,1)!important}.button.transparent.grey:hover,input.button.transparent.grey:hover{border:2px solid rgba(170,178,188,1);background-color:rgba(170,178,188,1);color:#fff!important}.button.transparent.dark-grey,input.transparent.button.dark-grey{border:2px solid rgba(84,87,102,1);color:rgba(84,87,102,1)!important}.button.transparent.dark-grey:hover,input.button.transparent.dark-grey:hover{border:2px solid rgba(84,87,102,1);background-color:rgba(84,87,102,1);color:#fff!important}.demo,.download{padding:12px 15px!important;color:#fff!important;font-weight:700;font-size:14px;font-family:Karla,sans-serif;text-align:center;text-transform:uppercase;border-radius:3px;opacity:.95;border:0;letter-spacing:2px;transition:all .2s ease-out}.demo {background-color:#3498DB;}.download {background-color:#825AA0;}.demo:hover,.download:hover {background-color:#36424a;color:#fff;opacity:1;}.demo:before {content:'\f135';display:inline-block;font-weight:normal;vertical-align:top;margin-right:10px;width:16px;height:16px;line-height:24px;font-family:fontawesome;transition:all 0.5s ease-out;}.download:before {content:'\f019';display:inline-block;font-weight:normal;vertical-align:top;margin-right:10px;width:16px;height:16px;line-height:24px;font-family:fontawesome;transition:all 0.5s ease-out;}kbd{border:1px solid gray;line-height: 1.9em;font-size:1.2em;box-shadow:1px 0 1px 0 #eee, 0 2px 0 2px #ccc, 0 2px 0 3px #444;-webkit-border-radius:3px;-moz-border-radius:3px;border-radius:3px;margin:2px 3px;padding:1px 5px;}.alert-del-btn{position:absolute;top:12px;right:15px;font-size:19px;font-weight:700;font-family:initial;cursor:pointer}.alert-del-btn:before{font-family:font-awesome; content:&quot;\f00d&quot;;font-family:FontAwesome;font-weight:400;font-size:15px;color:rgba(0,0,0,0.3)}.alert-del-btn:hover:before{color:rgba(0,0,0,0.4)}.alert-content{margin-left:95px}.alert-message{position:relative;display:block;background-color:#FAFAFA;padding:12px 20px;margin:20px 0;-webkit-border-radius:2px;-moz-border-radius:2px;border-radius:2px;color:#2f3239;border:1px solid}.alert-message p{margin:0!important;padding:0;line-height:22px;font-size:13px;color:#2f3239}.alert-message span{font-size:14px!important}.alert-message i{font-size:18px;line-height:20px;margin-right:5px}.alert-message.success{background-color:#c1faa8;border-color:#9cff70;color:#6db74c}.alert-message.success a,.alert-message.success span{color:#1d9d74}.alert-message.error{background-color:#ffcdc7;border-color:#fdb1a8;color:#ff391f}.alert-message.error a,.alert-message.error span{color:#378FFF}.alert-message.warning{background-color:#fff4bb;border-color:#fc6;color:#e99b00}.alert-message.warning a,.alert-message.warning span{color:#8a6d3b}.alert-message.alert{background-color:#bceeff;border-color:#8ae1ff;color:#21c2f8}.alert-message.alert a,.alert-message.alert span{color:#F55D5D}

 Buttons

Button red Button orange Button green Button blue Button purple Button yellow Button mint Button aqua Button pink Button white Button grey Button dark-grey Button
Button red Button orange Button green Button blue Button purple Button yellow Button mint Button aqua Button pink Button grey Button dark-grey Button
Button red Button orange Button green Button blue Button purple Button yellow Button mint Button aqua Button pink Button white Button grey Button dark-grey Button










martes, 23 de febrero de 2016

suscripcion






/* Subscribe Box  */ #feedsignup{position:relative;padding:5px 0;background:#2D363E;overflow:hidden;border-top:4px solid #eee;} .subscribe-wrapper{color:#fff;font-size:16px;line-height:normal;margin:0;text-align:center;text-transform:none;font-weight:400;float:right;width:50%} .subscribe-form{clear:both;display:block;overflow:hidden} form.subscribe-form{clear:both;display:block;margin:0;width:auto;overflow:hidden} .feedsignup-email-field{background:#252C33;color:#ccc;margin:10px 0;padding:15px 20px;width:50%;border:0} .feedsignup-email-button{background:#2AA9E0;color:#fff;cursor:pointer;font-weight:700;padding:11px 30px;margin-left:15px;text-transform:none;font-size:16px;border:0;transition:all .6s} .feedsignup-email-button:hover{background:#00AEEF;} #feedsignup p.feedtext{margin:16px;text-align:center;color:rgba(255,255,255,.6);font-size:200%;float:left;font-weight:400;line-height:normal;width:45%} #feedsignup p.feedtext span {position:relative;overflow:hidden;font-weight:700;transition:all .5s} #feedsignup p.feedtext span.feedtext1 {font-weight:400;font-style:italic;color:rgba(255,255,255,.6);text-transform:lowercase} #feedsignup p.feedtext span.feedtext1:before,#feedsignup p.feedtext span.feedtext1:after{display:none} #feedsignup p.feedtext span:before{content:'';position:absolute;bottom:-2px;left:0;width:0;height:3px;margin:10px 0 0;background:rgba(255,255,255,.1);transition:all .5s} #feedsignup:hover p.feedtext span:before{width:100%;} @media only screen and (max-width:767px){ #feedsignup p.feedtext{margin:0 0 20px 0;width:100%;} .subscribe-wrapper {width:100%;} }


<data:post.body/> <div class='post-footer'> 



<b:if cond='data:blog.pageType != &quot;index&quot;'> <b:if cond='data:blog.pageType != &quot;archive&quot;'> <b:if cond='data:blog.pageType == &quot;item&quot;'> <div id='feedsignup'> <p class='feedtext'><span>READY TO GROW</span> <span class='feedtext1'>with</span> Hustlers</p> <div class='subscribe-wrapper'> <div class='subscribe-form'> <form action='http://feedburner.google.com/fb/a/mailverify?uri=BloggerSpice' class='subscribe-form' method='post' onsubmit='window.open (&apos;http://feedburner.google.com/fb/a/mailverify?uri=BloggerSpice&apos;, &apos;popupwindow&apos;, &apos;scrollbars=yes,width=550,height=520&apos;);return true' target='popupwindow'> <input name='uri' type='hidden' value='BloggerSpice'/><input name='loc' type='hidden' value='en_US'/><input autocomplete='off' class='feedsignup-email-field' name='email' placeholder='Enter your Email Here...'/><input class='feedsignup-email-button' title='SIGN UP' type='submit' value='SIGN UP!'/></form> </div> </div> </div> </b:if> </b:if></b:if>


http://codepen.io/BloggerSpice/full/zrmpaq/

mensaje notificacion


]]></b:skin>




/* Notification Message */ .bstext{color:#FFF;margin-bottom:15px;border-radius:3px;padding:10px} .bssuccess{background-color:#AA5CB8} .bsalert{background-color:#5BA5DE} .bswarning{background-color:#C619CC} .bsupdate{background-color:#1D89E5} .bsinfo{background-color:#18A8AA} .bserror{background-color:#d9534f} .headertext{font-size:16px;background-color:rgba(0,0,0,0.30);padding:8px 10px;margin:-10px;margin-bottom:10px} .headertext > .fa{margin-right:5px} .bloggerspice {overflow: hidden;}

 </head> 

<link href='//netdna.bootstrapcdn.com/font-awesome/4.5.0/css/font-awesome.min.css' rel='stylesheet'/>



<div class="bloggerspice bsupdate bstext" icon="info-circle" title="Update message"> <div class="message-wrapper"> <div class="headertext"> <i class="fa bloggerspice-icon fa-bullhorn"></i>Update message</div> Este es un ejemplo de mensaje de actualización de la caja.</div> </div>


<div class="bloggerspice bsalert bstext" icon="info-circle" title="Alert message"> <div class="message-wrapper"> <div class="headertext"> <i class="fa bloggerspice-icon fa-cut"></i>Alert message</div> Este es un ejemplo de mensaje de Alerta Box. </div> </div>






paginacion



/* Blog pager*/

#blog-pager{
clear:both;
text-align:center;
margin:10px;
padding:5px 0 0 0;
height:30px;
}
#blog-pager a,.showpagePoint,.showpageOf,.showpageNum a{
text-decoration:none;
color:#fff;
background:#222;
-moz-border-radius:3px;
-khtml-border-radius:3px;
-webkit-border-radius:3px;
border-radius:3px;
margin:0 2px 0 0;
padding:4px 10px 5px;
border:1px solid #000;
text-transform: uppercase;
font:normal normal 12px Oswald;
text-shadow:0 -1px 1px rgba(0,0,0,0.25);
}
#blog-pager a:visited{
color:#fff;
}
#blog-pager a:hover,.showpagePoint {
background-color: #264778;
border: 1px solid #000;
color: #fff;
}
#blog-pager-newer-link{
float:left;
}



</body>


<!--Page Navigation Starts--> <script type='text/javascript'>var pageCount=1;
var var displayPageNum=3;
var upPageWord =&#39;Previous&#39;;
var downPageWord =&#39;Next&#39;;
</script>
<script src='http://bloggerspicebd.googlecode.com/files/pagenavi.js' type='text/javascript'/>
<!--Page Navigation by www.bloggerspice.com Ends-->var upPageWord =&#39;Previous&#39;; var downPageWord =&#39;Next&#39;; </script> <script src='http://bloggerspicebd.googlecode.com/files/pagenavi.js' type='text/javascript'/> <!--Page Navigation by www.bloggerspice.com Ends--><div class='clear'></div>

resumen 2



Paso 1 : entra en Plantilla / Edición de HTML

Presionamos Ctrl+F y colocamos


<data:post.body/>


La eliminamos y la remplazamos con el siguiente código:


<b:if cond='data:blog.pageType != &quot;item&quot;'>
<b:if cond='data:blog.pageType != &quot;static_page&quot;'>
<div expr:id='&quot;summary&quot; + data:post.id'><data:post.body/></div>
<script type='text/javascript'>createSummaryAndThumb(&quot;summary<data:post.id/>&quot;);</script>
<span class='rmlink' style='float:right'><a expr:href='data:post.url'>Leer más...</a></span>
</b:if></b:if>
<b:if cond='data:blog.pageType == &quot;item&quot;'><data:post.body/></b:if>
<b:if cond='data:blog.pageType == &quot;static_page&quot;'><data:post.body/></b:if>


Paso 2 :

Presionamos Ctrl+F y colocamos


</head>

Ahora pega antes de </head> lo siguiente:




<script type='text/javascript'>
summary_noimg = 200;
summary_img = 80;
img_thumb_height = 50;
img_thumb_width = 50;
</script>
<script type='text/javascript'>
//<![CDATA[
/******************************************
(C)2008 by Anhvo
visit http://en.vietwebguide.com to get more cool hacks
********************************************/
function removeHtmlTag(strx,chop){
if(strx.indexOf("<")!=-1)
{
var s = strx.split("<");
for(var i=0;i<s.length;i++){
if(s[i].indexOf(">")!=-1){
s[i] = s[i].substring(s[i].indexOf(">")+1,s[i].length);
}
}
strx = s.join("");
}
chop = (chop < strx.length-1) ? chop : strx.length-2;
while(strx.charAt(chop-1)!=' ' && strx.indexOf(' ',chop)!=-1) chop++;
strx = strx.substring(0,chop-1);
return strx+'...';
}
function createSummaryAndThumb(pID){
var div = document.getElementById(pID);
var imgtag = "";
var img = div.getElementsByTagName("img");
var summ = summary_noimg;
if(img.length>=1) {
imgtag = '<span style="float:left; padding:0px 10px 5px 0px;"><img src="'+img[0].src+'" width="'+img_thumb_width+'px" height="'+img_thumb_height+'px"/></span>';
summ = summary_img;
}
var summary = imgtag + '<div>' + removeHtmlTag(div.innerHTML,summ) + '</div>';
div.innerHTML = summary;
}
//]]>
</script>
Y debajo de el pega también esto:


<b:if cond='data:blog.pageType != &quot;static_page&quot;'>
<b:if cond='data:blog.pageType != &quot;item&quot;'>
<style type='text/css'>
.post {
border: 1px solid #2E2E2E; /*Tamaño Tipo Color borde de las entradas */
float:left;
height: 210px; /* alto de las entradas */
width: 280px; /* ancho de las entradas */
overflow: hidden;
}
.post h3 a {
padding-left: 5px;
color: #5A606D; /* color del título de las entradas */}
h2.date-header { /* Con esto escondemos la fecha */
height:0px;
visibility:hidden;
display:none
}
.post-footer { /* Estilos del post-footer */
text-transform: uppercase;
font: normal normal 68% &#39;Trebuchet MS&#39;, Trebuchet, Arial;
line-height: 1.4em;
}
#blog-pager {
clear:both;
}
.post img{
height: 160px;/* alto de las imagenes */
width: 275px;/* ancho de las imagenes */
margin-top: -10px;
}
.post.hentry {/* Estilo de las entradas Principal */
margin-top: -50px!important;/*Quitar si sus entradas se ponen muy ariba */
font-size: 11px;/*Tamaño del texto */
color: #736F70;/* Color del texto */
border: 5px solid #7ACAC1;/*Tamaño Tipo Color borde de las entradas */
background: #FFF9E7;/* Fondo de las entradas*/
margin: 1px 8px 60px;/* Separacion de las entradas,si elimino el azul poner en 8 el 60 */
padding: 15px 13px;
}
</style>
</b:if>
</b:if>


Ahora lo importante para terminarlo

Buscamos


.post-outer {

lo que tengamos dentro lo borramos antes de }

Luego agregamos Antes de ]]></b:skin> lo siguiente :


.post {/* Estilo de las entradas Secundario */
font-size: 11px!important;/*Tamaño del texto */
color: #736F70!important;/* Color del texto */
border: 5px solid #7ACAC1!important;/*Tamaño Tipo Color borde de las entradas */
background: #FFF9E7!important;/* Fondo de las entradas*/
margin: 4px 2px 30px!important;/* Separacion de las entradas*/
padding: 15px 13px!important;
border-radius: 7px!important;
margin-bottom: -15px!important;
}
#comments {/* Estilo de caja de Comentarios*/
font-size: 11px;/*Tamaño del texto */
color: #736F70;/* Color del texto */
border: 5px solid #7ACAC1;/*Tamaño Tipo Color borde de caja comentario */
background: #FFF9E7;/* Fondo de la caja comentario*/
margin: 4px 2px 30px;
padding: 15px 13px;
margin-bottom: -15px;
border-radius: 7px;
margin-top: 30px!important;
margin-bottom: -15px;
}

resumen



* </script>
<script type='text/javascript'>
summary_noimg = 550;
summary_img = 450;
img_thumb_height = 150;
img_thumb_width = 200;
</script>
<script type='text/javascript'>
//<![CDATA[
function removeHtmlTag(strx,chop){
if(strx.indexOf("<")!=-1)
{
var s = strx.split("<");
for(var i=0;i<s.length;i++){
if(s[i].indexOf(">")!=-1){
s[i] = s[i].substring(s[i].indexOf(">")+1,s[i].length);
}
}
strx = s.join("");
}
chop = (chop < strx.length-1) ? chop : strx.length-2;
while(strx.charAt(chop-1)!=' ' && strx.indexOf(' ',chop)!=-1) chop++;
strx = strx.substring(0,chop-1);
return strx+'...';
}
function createSummaryAndThumb(pID){
var div = document.getElementById(pID);
var imgtag = "";
var img = div.getElementsByTagName("img");
var summ = summary_noimg;
if(img.length>=1) {
imgtag = '<span style="float:left; padding:0px 10px 5px 0px;"><img src="'+img[0].src+'" width="'+img_thumb_width+'px" height="'+img_thumb_height+'px"/></span>';
summ = summary_img;
}
var summary = imgtag + '<div>' + removeHtmlTag(div.innerHTML,summ) + '</div>';
div.innerHTML = summary;
}
//]]>
</script>

<style type='text/css'>
.clearfix:after{content:&quot;020&quot;;display:block;height:0;clear:both;visibility:hidden;overflow:hidden}
#container,#header,#main,#main-fullwidth,#footer,.clearfix{display:block}
.clear{clear:both}
h1,h2,h3,h4,h5,h6{margin-bottom:16px;font-weight:normal;line-height:1}
h1{font-size:40px}
h2{font-size:30px}
h3{font-size:20px}
h4{font-size:16px}
h5{font-size:14px}
h6{font-size:12px}
h1 img,h2 img,h3 img,h4 img,h5 img,h6 img{margin:0}
table{margin-bottom:20px;width:100%}
th{font-weight:bold}
thead th{background:#c3d9ff}
th,td,caption{padding:4px 10px 4px 5px}
tr.even td{background:#e5ecf9}
tfoot{font-style:italic}
caption{background:#eee}
li ul,li ol{margin:0}
ul,ol{margin:0 20px 20px 0;padding-left:40px}
ul{list-style-type:disc}
ol{list-style-type:decimal}
dl{margin:0 0 20px 0}
dl dt{font-weight:bold}
dd{margin-left:20px}
blockquote{margin:20px;color:#666;}
pre{margin:20px 0;white-space:pre}
pre,code,tt{font:13px &#39;andale mono&#39;,&#39;lucida console&#39;,monospace;line-height:18px}
#search {overflow:hidden;}
#header h1{font-family:&#39;Oswald&#39;,Arial,Helvetica,Sans-serif;}
#header .description{font-family:Arial,Helvetica,Sans-serif;}
.post-title {font-family:&#39;Oswald&#39;,sans-serif;}
.sidebar h2{font-family:&#39;Oswald&#39;,sans-serif;}
#footer-widgets .widgettitle{font-family:Arial,Helvetica,Sans-serif;}
.menus,.menus *{margin:0;padding:0;list-style:none;list-style-type:none;line-height:1.0}
.menus ul{position:absolute;top:-999em;width:100%}
.menus ul li{width:100%}
.menus li:hover{visibility:inherit}
.menus li{float:left;position:relative}
.menus a{display:block;position:relative}
.menus li:hover ul,.menus li.sfHover ul{left:0;top:100%;z-index:99}
.menus li:hover li ul,.menus li.sfHover li ul{top:-999em}
.menus li li:hover ul,.menus li li.sfHover ul{left:100%;top:0}
.menus li li:hover li ul,.menus li li.sfHover li ul{top:-999em}
.menus li li li:hover ul,.menus li li li.sfHover ul{left:100%;top:0}
.sf-shadow ul{padding:0 8px 9px 0;-moz-border-radius-bottomleft:17px;-moz-border-radius-topright:17px;-webkit-border-top-right-radius:17px;-webkit-border-bottom-left-radius:17px}
.menus .sf-shadow ul.sf-shadow-off{background:transparent}
.menu-primary-container{padding:0;position:relative;height:34px;background:none;z-index:400;margin-top:10px}
.menu-primary{}
.menu-primary ul{min-width:160px}
.menu-primary li a{color:#555;padding:11px 15px;text-decoration:none;text-transform:uppercase;font:normal 11px/11px Arial,Helvetica,Sans-serif}
.menu-primary li a:hover,.menu-primary li a:active,.menu-primary li a:focus,.menu-primary li:hover &gt; a,.menu-primary li.current-cat &gt; a,.menu-primary li.current_page_item &gt; a,.menu-primary li.current-menu-item &gt; a{color:#217CC7;outline:0;background:none}
.menu-primary li li a{color:#fff;text-transform:none;background:#147FB7;padding:10px 15px;margin:0;border:0;font-weight:normal}
.menu-primary li li a:hover,.menu-primary li li a:active,.menu-primary li li a:focus,.menu-primary li li:hover &gt; a,.menu-primary li li.current-cat &gt; a,.menu-primary li li.current_page_item &gt; a,.menu-primary li li.current-menu-item &gt; a{color:#fff;background:#2396D2;outline:0;border-bottom:0;text-decoration:none}
.menu-primary a.sf-with-ul{padding-right:20px;min-width:1px}
.menu-primary .sf-sub-indicator{position:absolute;display:block;overflow:hidden;right:0;top:0;padding:10px 10px 0 0}
.menu-primary li li .sf-sub-indicator{padding:9px 10px 0 0}
.wrap-menu-primary .sf-shadow ul{background:url(&#39;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgt5Ou7zX6NLgctZv62RZE71bb-iMScgtGk1-acEfGOs4JNabHXC3WSLA0PAI21H70RV8AvMZjM8JZqcq6MDLhMvjJdcErjLVungVWShBYNEyNwMLQPnbtplq_5E70IW-eQ8dMG9JQmwj1S/s0/menu-primary-shadow.png&#39;) no-repeat bottom right}
.menu-secondary-container{position:relative;height:40px;z-index:300;background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgzfzLHuEZYBMZoorxYQ_n3eEW7KJUtgxLPecvABk54MGdwOUtjciVWlP63FWSa4QLN8YQxiPzAudN5-ZoI3fAEPRT_W-BP44tHxkqrHbqM4c-rDmDle65mJsOM3QIzmGencSQ6BfZXCetv/s0/menu-secondary-bg.png) left top repeat-x;margin-bottom:30px}
.menu-secondary{}
.menu-secondary ul{min-width:160px}
.menu-secondary li a{color:#555;padding:14px 15px 13px 15px;text-decoration:none;text-transform:uppercase;font:normal 13px/13px &#39;Oswald&#39;,sans-serif;text-shadow:0 1px 0 #FFF}
.menu-secondary li a:hover,.menu-secondary li a:active,.menu-secondary li a:focus,.menu-secondary li:hover &gt; a,.menu-secondary li.current-cat &gt; a,.menu-secondary li.current_page_item &gt; a,.menu-secondary li.current-menu-item &gt; a{color:#FFF;background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgzfzLHuEZYBMZoorxYQ_n3eEW7KJUtgxLPecvABk54MGdwOUtjciVWlP63FWSa4QLN8YQxiPzAudN5-ZoI3fAEPRT_W-BP44tHxkqrHbqM4c-rDmDle65mJsOM3QIzmGencSQ6BfZXCetv/s0/menu-secondary-bg.png) left -140px repeat-x;outline:0;text-shadow:0 1px 0 #045985}
.menu-secondary li li a{color:#fff;background:#1882B9;padding:10px 15px;text-transform:none;margin:0;font-weight:normal;text-shadow:none}
.menu-secondary li li a:hover,.menu-secondary li li a:active,.menu-secondary li li a:focus,.menu-secondary li li:hover &gt; a,.menu-secondary li li.current-cat &gt; a,.menu-secondary li li.current_page_item &gt; a,.menu-secondary li li.current-menu-item &gt; a{color:#fff;background:#3596CA;outline:0;text-shadow:none}
.menu-secondary a.sf-with-ul{padding-right:26px;min-width:1px}
.menu-secondary .sf-sub-indicator{position:absolute;display:block;overflow:hidden;right:0;top:0;padding:13px 13px 0 0}
.menu-secondary li li .sf-sub-indicator{padding:9px 13px 0 0}
.wrap-menu-secondary .sf-shadow ul{background:url(&#39;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiw9P8gXr7qd6ubd6UUPD5KMpQbT_HY7ZSjTKrXTZeMTsNIPBeIaKdyXW2UtN0s4sXBurZWUQJqAdzlIHtU4n71me9dJkKc7nX2HqR6TKV60_Ej2Aa_SWvsSPS-XpU2JKNMNbsRU3HjUN7b/s0/menu-secondary-shadow.png&#39;) no-repeat bottom right}
.fp-slider{margin:0 auto 15px auto;padding:0px;width:615px;height:332px;overflow:hidden;position:relative;}
.fp-slides-container{}
.fp-slides,.fp-thumbnail,.fp-prev-next,.fp-nav{width:615px;}
.fp-slides,.fp-thumbnail{height:300px;overflow:hidden;position:relative}
.fp-title{color:#fff;text-shadow:0px 1px 0px #000;font:bold 18px Arial,Helvetica,Sans-serif;padding:0 0 2px 0;margin:0}
.fp-title a,.fp-title a:hover{color:#fff;text-shadow:0px 1px 0px #000;text-decoration:none}
.fp-content{position:absolute;bottom:0;left:0;right:0;background:#111;opacity:0.7;filter:alpha(opacity = 70);padding:10px 15px;overflow:hidden}
.fp-content p{color:#fff;text-shadow:0px 1px 0px #000;padding:0;margin:0;line-height:18px}
.fp-more,.fp-more:hover{color:#fff;font-weight:bold}
.fp-nav{height:12px;text-align:center;padding:10px 0;background:#333;}
.fp-pager a{background-image:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEil6tiyBoZeNpBjP5k-lUyI8ttAx6hwVFNhFeRecAAB8ud-ZRqXlQDs8Wou2O7Io3uUCA7OoFpfpL6wGHtLrER3_qy6qizM2VrN6CXver1YXJ20969wdJiAt_iIGRC94259QQ3drlYKnNEO/s0/featured-pager.png);cursor:pointer;margin:0 8px 0 0;padding:0;display:inline-block;width:12px;height:12px;overflow:hidden;text-indent:-999px;background-position:0 0;float:none;line-height:1;opacity:0.7;filter:alpha(opacity = 70)}
.fp-pager a:hover,.fp-pager a.activeSlide{text-decoration:none;background-position:0 -112px;opacity:1.0;filter:alpha(opacity = 100)}
.fp-prev-next-wrap{position:relative;z-index:200}
.fp-prev-next{position:absolute;bottom:130px;left:0;right:0;height:37px}
.fp-prev{margin-top:-180px;float:left;margin-left:14px;width:37px;height:37px;background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjCnwXINbe2VAvvmxwUcTjz_J_AHfvVvZGeUSxUPm9O8AwxTePBMshEKlp_nYo-LSNARnbVjvb_Q8ZMEvJQIhooGbgesTDZ1MpVYWDopQKyloeCCos_mroe5BhDoDfXFozao7UwCEhlmtvt/s0/featured-prev.png) left top no-repeat;opacity:0.6;filter:alpha(opacity = 60)}
.fp-prev:hover{opacity:0.8;filter:alpha(opacity = 80)}
.fp-next{margin-top:-180px;float:right;width:36px;height:37px;margin-right:14px;background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi4qjyNyzIax6rlyz-kKhQtnqN-fsbkYuLAjz0wDfgQTG7t0NRub2SKcHikhyphenhyphenXiDenLPYu-jZ8mxSbCn6zCp8mip-iCaCSxvvsgLhvx856wWwHr7h7zdtV35meocKkwoIWB_UYGrTkX8zHS/s0/featured-next.png) right top no-repeat;opacity:0.6;filter:alpha(opacity = 60)}
.fp-next:hover{opacity:0.8;filter:alpha(opacity = 80)}
/* -- number page navigation -- */
#blog-pager {padding:6px;font-size:11px;}
#comment-form iframe{padding:5px;width:580px;height:275px;}
.tabs-widget{list-style:none;list-style-type:none;margin:0 0 10px 0;padding:0;height:26px}
.tabs-widget li{list-style:none;list-style-type:none;margin:0 0 0 4px;padding:0;float:left}
.tabs-widget li:first-child{margin:0}
.tabs-widget li a{color:#777;background:#FFF;padding:6px 16px;display:block;text-decoration:none;font:bold 12px/12px Arial,Helvetica,Sans-serif;border:1px solid #E0E0E0}
.tabs-widget li a:hover,.tabs-widget li a.tabs-widget-current{background:#FFF;color:#468DB5;border:1px solid #468DB5;text-decoration:none}