Halloween Tumblr Layouts - XquisiteKisses.com

★ Color Schemes ★ Brushes ★ Font ★ Tumblr Themes ★ Patterns ★ Models

Preview Layout

Put this code under tumblr custom css

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"> <head> <meta http-equiv="content-type" content="text/html; charset=utf-8" /> <title>{Title}</title> <link rel="shortcut icon" href="{Favicon}"> <link rel="alternate" type="application/rss+xml" href="{RSS}"> {block:Description} <meta name="description" content="{MetaDescription}" /> {/block:Description} <style type="text/css"> body{ background-image:url('https://res.cloudinary.com/girlycutegraphics/image/upload/v1539815331/backgrounds/halloween/halloween13.jpg'); background-repeat:repeat; background-position:center; background-color:#8d847a; font:10pt arial; color:#ffffff; line-height:16px;} a,a:link,a:visited,a:active{ color:#ffffff; text-decoration:none;} a:hover{ color:#cac6c1; text-decoration:none;} .old a{ background-color:#110e0c; position:fixed; top:50%; right:50px; width:80px; height:57px; display:block; text-align:center; padding-top:23px; font-size:45pt; filter:alpha(opacity=90); opacity:0.9; -moz-border-radius:10px; border-radius:10px;} .old a:hover, .new a:hover{ color:#8b837a; background-color:#221d19;} .new a{ background-color:#110e0c; position:fixed; top:50%; left:50px; width:80px; height:57px; display:block; text-align:center; padding-top:23px; font-size:45pt; filter:alpha(opacity=90); opacity:0.9; -moz-border-radius:10px; border-radius:10px;} #container{ position:absolute; top:20px; left:50%; margin-left:-315px; width:630px; overflow:visible; background-color:transparent; border:none;} a.nav, .bottom a{ font-size:12pt; letter-spacing:-1px; padding:5px; background-color:#635b53; color:#110e0c; font-weight:bold; margin-right:5px; -moz-border-radius:5px; border-radius:5px;} a.nav:hover, .bottom a:hover{ background-color:#8d847a;} #main{margin:0;} #mainbox{ width:630px;} .content{ float:right; width:500px; background-color:#110e0c; padding:15px; margin-bottom:20px; border-bottom:10px solid #221d19; filter:alpha(opacity=90); opacity:0.9; -moz-border-radius:10px; border-radius:10px; min-height:80px;} #info{ float:left; width:100px;} .datebubble{ background-color:#221d19; padding:15px 0 0 0; text-align:center; font-weight:bold; margin:0 0 0 10px; width:64px; height:49px; filter:alpha(opacity=90); opacity:0.9; -moz-border-radius:10px; border-radius:10px;} .datebubble a{font-size:12pt;} .datebubble a:hover{color:#110e0c;} .notesbubble{ background-color:#cac6c1; padding:12px 0 0 0; text-align:center; font-weight:bold; margin:10px 0 0 45px; width:40px; height:28px; filter:alpha(opacity=90); opacity:0.9; -moz-border-radius:10px; border-radius:10px;} .notesbubble a{font-size:9pt; color:#110e0c;} .notesbubble a:hover{color:#635b53;} .portraitbubble{ margin:0 0 0 10px; width:64px; height:64px; filter:alpha(opacity=90); opacity:0.9;} .portraitbubble img{ -moz-border-radius:10px; border-radius:10px;} .clear{clear:both;} .bottom{ margin-top:20px; text-align:center;} .photo{text-align:center;} #footer{ clear:both; height:35px; width:630px margin:20px 0 20px 0; text-align:center; font-size:12pt; font-weight:bold; letter-spacing:-1px; color:#110e0c;} #footer a{color:#221d19!important;} #footer a:hover{color:#110e0c!important;} ul.chat{ list-style-type:none; margin:0 0 5px 0; padding:0;} li.odd{ font-weight:bold;} li.even{ font-weight:bold; color:#8b837a;} .quote{ line-height:18px; color:#635b53; letter-spacing:-2px; font-weight:bold; margin-bottom:5px; font-size:14pt; text-align:center;} .source, .caption{ text-align:center; font-weight:bold; font-size:11pt;} .audio{ padding:0; margin-left:10px; overflow:hidden; text-align:left; display:inline-block;} .ask{ background-color:#cac6c1; padding:10px; color:#110e0c!important; font-weight:bold; display:block; margin-bottom:5px; -moz-border-radius:10px; border-radius:10px;} .ask a:hover{ color:#110e0c!important;} h1, h1 a, a.link{ line-height:24px; font-size:20pt; letter-spacing:-2px; color:#ffffff !important; padding:0; margin-top:0; margin-bottom:5px; font-weight:bold;} h1 a:hover, a.link:hover{ color:#cac6c1 !important;} ul{list-style-type:dot;} blockquote{ font-style:normal !important; text-align:left !important; margin:0 0 0 10px; border-left:3px solid #8b837a; padding:0 0 0 6px;} ol.notes { margin:0 0 20px 60px; width:530px; list-style-type: none;} ol.notes li.note { color:#cac6c1; border:none; padding:4px; background-color:#110e0c; border-bottom:3px solid #221d19; filter:alpha(opacity=90); opacity:0.9; -moz-border-radius:3px; border-radius:3px;} ol.notes li.note img.avatar { vertical-align:-4px; margin-right:10px; width:16px; height:16px;} {CustomCSS} </style> </head> <body> <div id="container"> <div class="old"> {block:Pagination} {block:NextPage} <a href="{NextPage}"> » </a> {/block:NextPage} {/block:Pagination} </div> <div class="new"> {block:Pagination} {block:PreviousPage} <a href="{PreviousPage}"> « </a> {/block:PreviousPage} {/block:Pagination} </div> <div id="main"> <div id="mainbox"> <div id="info"> <div class="portraitbubble"> <img decoding="async" src="{PortraitURL-64}"> </div> </div> <div class="content"> <h1>{Title}</h1> {Description}<br><br> <center> <a class="nav" href="/">Home</a> <a class="nav" href="/archive">Archive</a> <a class="nav" href="{RSS}">RSS</a> <a class="nav" href="/ask">Ask</a> {block:HasPages} {block:Pages} <a class="nav" href="{URL}">{Label}</a> {/block:Pages} {/block:HasPages} </center> </div> </div> <div class="clear"></div> {block:Posts} <div id="mainbox"> <div id="info"> <div class="datebubble"> {block:Date} <a href="{Permalink}"> {MonthNumber}.{DayOfMonth}<br>{Year} </a> {/block:Date} </div> <div class="notesbubble"> {block:NoteCount} <a href="{Permalink}#notes">{NoteCount}</a> {/block:NoteCount} </div> </div> <div class="content"> {block:Text} {block:Title} <h1><a href="{Permalink}">{Title}</a></h1> {/block:Title} {Body} {/block:Text} {block:Photo} <div class="photo"> {LinkOpenTag}<img decoding="async" src="{PhotoURL-500}" alt="{PhotoAlt}" border="0"/>{LinkCloseTag} </div> {block:Caption} {Caption} {/block:Caption} {/block:Photo} {block:Photoset} <div class="photo"> {Photoset-500} </div> {block:Caption} {Caption} {/block:Caption} {/block:Photoset} {block:Quote} <div class="quote"> {Quote} </div> {block:Source} <div class="source"> {Source} </div> {/block:Source} {/block:Quote} {block:Link} <a href="{URL}" class="link" {Target}>{Name}</a> {block:Description} {Description} {/block:Description} {/block:Link} {block:Chat} {block:Title} <h2><a href="{Permalink}">{Title}</a></h2> {/block:Title} <ul class="chat"> {block:Lines} <li class="{Alt} user_{UserNumber}"> {block:Label} <span class="label">{Label}</span> {/block:Label} {Line} </li> {/block:Lines} </ul> </li> {/block:Chat} {block:Photoset} <div class="bigthings"> {Photoset-500} </div> {block:Caption} {Caption} {/block:Caption} {/block:Photoset} {block:Video} {Video-500} {block:Caption} {Caption} {/block:Caption} {/block:Video} {block:Answer} <div class="ask">{Asker} asked, “{Question}”</div> {Answer} {/block:Answer} {block:Audio} <table> <tr> <td> {block:AlbumArt} <img decoding="async" src="{AlbumArtURL}" style="width:120px; height:120px;"> {/block:AlbumArt} </td> <td> <div class="audio"> {AudioPlayerBlack}<br> {block:TrackName}”{TrackName}”{/block:TrackName} by {block:Artist}{Artist}{/block:Artist}<br> {block:Album}<strong>{Album}</strong>{/block:Album} </td></tr><tr><td colspan="2"> {block:Caption} {Caption} {/block:Caption} </td> </tr> </table> {/block:Audio} {block:HasTags} <div class="bottom"> {block:Tags} <a class="tags" href="{TagURL}">#{Tag}</a> {/block:Tags} </div> {/block:HasTags} </div></div><div class="clear"></div><div class="clear"></div> {PostNotes} {/block:Posts} </div> <div id="footer"> Designed by X Q U I S I T E K I S S E S. C O M <a href="http://xquisitekisses.com" target="_new"X Q U I S I T E K I S S E S . C O M</a>. Powered by <a href="http://tumblr.com" target="_new" rel="noopener noreferrer">Tumblr</a>. </div> </body> </html>

Preview Layout

Put this code under tumblr custom css

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"> <head> <meta http-equiv="content-type" content="text/html; charset=utf-8" /> <title>{Title}</title> <link rel="shortcut icon" href="{Favicon}"> <link rel="alternate" type="application/rss+xml" href="{RSS}"> {block:Description} <meta name="description" content="{MetaDescription}" /> {/block:Description} <style type="text/css"> body{ background-image:url('https://res.cloudinary.com/girlycutegraphics/image/upload/v1539815327/backgrounds/halloween/halloween12.jpg'); background-repeat:repeat; background-position:center; background-color:#8d847a; font:10pt arial; color:#ffffff; line-height:16px;} a,a:link,a:visited,a:active{ color:#ffffff; text-decoration:none;} a:hover{ color:#cac6c1; text-decoration:none;} .old a{ background-color:#110e0c; position:fixed; top:50%; right:50px; width:80px; height:57px; display:block; text-align:center; padding-top:23px; font-size:45pt; filter:alpha(opacity=90); opacity:0.9; -moz-border-radius:10px; border-radius:10px;} .old a:hover, .new a:hover{ color:#8b837a; background-color:#221d19;} .new a{ background-color:#110e0c; position:fixed; top:50%; left:50px; width:80px; height:57px; display:block; text-align:center; padding-top:23px; font-size:45pt; filter:alpha(opacity=90); opacity:0.9; -moz-border-radius:10px; border-radius:10px;} #container{ position:absolute; top:20px; left:50%; margin-left:-315px; width:630px; overflow:visible; background-color:transparent; border:none;} a.nav, .bottom a{ font-size:12pt; letter-spacing:-1px; padding:5px; background-color:#635b53; color:#110e0c; font-weight:bold; margin-right:5px; -moz-border-radius:5px; border-radius:5px;} a.nav:hover, .bottom a:hover{ background-color:#8d847a;} #main{margin:0;} #mainbox{ width:630px;} .content{ float:right; width:500px; background-color:#110e0c; padding:15px; margin-bottom:20px; border-bottom:10px solid #221d19; filter:alpha(opacity=90); opacity:0.9; -moz-border-radius:10px; border-radius:10px; min-height:80px;} #info{ float:left; width:100px;} .datebubble{ background-color:#221d19; padding:15px 0 0 0; text-align:center; font-weight:bold; margin:0 0 0 10px; width:64px; height:49px; filter:alpha(opacity=90); opacity:0.9; -moz-border-radius:10px; border-radius:10px;} .datebubble a{font-size:12pt;} .datebubble a:hover{color:#110e0c;} .notesbubble{ background-color:#cac6c1; padding:12px 0 0 0; text-align:center; font-weight:bold; margin:10px 0 0 45px; width:40px; height:28px; filter:alpha(opacity=90); opacity:0.9; -moz-border-radius:10px; border-radius:10px;} .notesbubble a{font-size:9pt; color:#110e0c;} .notesbubble a:hover{color:#635b53;} .portraitbubble{ margin:0 0 0 10px; width:64px; height:64px; filter:alpha(opacity=90); opacity:0.9;} .portraitbubble img{ -moz-border-radius:10px; border-radius:10px;} .clear{clear:both;} .bottom{ margin-top:20px; text-align:center;} .photo{text-align:center;} #footer{ clear:both; height:35px; width:630px margin:20px 0 20px 0; text-align:center; font-size:12pt; font-weight:bold; letter-spacing:-1px; color:#110e0c;} #footer a{color:#221d19!important;} #footer a:hover{color:#110e0c!important;} ul.chat{ list-style-type:none; margin:0 0 5px 0; padding:0;} li.odd{ font-weight:bold;} li.even{ font-weight:bold; color:#8b837a;} .quote{ line-height:18px; color:#635b53; letter-spacing:-2px; font-weight:bold; margin-bottom:5px; font-size:14pt; text-align:center;} .source, .caption{ text-align:center; font-weight:bold; font-size:11pt;} .audio{ padding:0; margin-left:10px; overflow:hidden; text-align:left; display:inline-block;} .ask{ background-color:#cac6c1; padding:10px; color:#110e0c!important; font-weight:bold; display:block; margin-bottom:5px; -moz-border-radius:10px; border-radius:10px;} .ask a:hover{ color:#110e0c!important;} h1, h1 a, a.link{ line-height:24px; font-size:20pt; letter-spacing:-2px; color:#ffffff !important; padding:0; margin-top:0; margin-bottom:5px; font-weight:bold;} h1 a:hover, a.link:hover{ color:#cac6c1 !important;} ul{list-style-type:dot;} blockquote{ font-style:normal !important; text-align:left !important; margin:0 0 0 10px; border-left:3px solid #8b837a; padding:0 0 0 6px;} ol.notes { margin:0 0 20px 60px; width:530px; list-style-type: none;} ol.notes li.note { color:#cac6c1; border:none; padding:4px; background-color:#110e0c; border-bottom:3px solid #221d19; filter:alpha(opacity=90); opacity:0.9; -moz-border-radius:3px; border-radius:3px;} ol.notes li.note img.avatar { vertical-align:-4px; margin-right:10px; width:16px; height:16px;} {CustomCSS} </style> </head> <body> <div id="container"> <div class="old"> {block:Pagination} {block:NextPage} <a href="{NextPage}"> » </a> {/block:NextPage} {/block:Pagination} </div> <div class="new"> {block:Pagination} {block:PreviousPage} <a href="{PreviousPage}"> « </a> {/block:PreviousPage} {/block:Pagination} </div> <div id="main"> <div id="mainbox"> <div id="info"> <div class="portraitbubble"> <img decoding="async" src="{PortraitURL-64}"> </div> </div> <div class="content"> <h1>{Title}</h1> {Description}<br><br> <center> <a class="nav" href="/">Home</a> <a class="nav" href="/archive">Archive</a> <a class="nav" href="{RSS}">RSS</a> <a class="nav" href="/ask">Ask</a> {block:HasPages} {block:Pages} <a class="nav" href="{URL}">{Label}</a> {/block:Pages} {/block:HasPages} </center> </div> </div> <div class="clear"></div> {block:Posts} <div id="mainbox"> <div id="info"> <div class="datebubble"> {block:Date} <a href="{Permalink}"> {MonthNumber}.{DayOfMonth}<br>{Year} </a> {/block:Date} </div> <div class="notesbubble"> {block:NoteCount} <a href="{Permalink}#notes">{NoteCount}</a> {/block:NoteCount} </div> </div> <div class="content"> {block:Text} {block:Title} <h1><a href="{Permalink}">{Title}</a></h1> {/block:Title} {Body} {/block:Text} {block:Photo} <div class="photo"> {LinkOpenTag}<img decoding="async" src="{PhotoURL-500}" alt="{PhotoAlt}" border="0"/>{LinkCloseTag} </div> {block:Caption} {Caption} {/block:Caption} {/block:Photo} {block:Photoset} <div class="photo"> {Photoset-500} </div> {block:Caption} {Caption} {/block:Caption} {/block:Photoset} {block:Quote} <div class="quote"> {Quote} </div> {block:Source} <div class="source"> {Source} </div> {/block:Source} {/block:Quote} {block:Link} <a href="{URL}" class="link" {Target}>{Name}</a> {block:Description} {Description} {/block:Description} {/block:Link} {block:Chat} {block:Title} <h2><a href="{Permalink}">{Title}</a></h2> {/block:Title} <ul class="chat"> {block:Lines} <li class="{Alt} user_{UserNumber}"> {block:Label} <span class="label">{Label}</span> {/block:Label} {Line} </li> {/block:Lines} </ul> </li> {/block:Chat} {block:Photoset} <div class="bigthings"> {Photoset-500} </div> {block:Caption} {Caption} {/block:Caption} {/block:Photoset} {block:Video} {Video-500} {block:Caption} {Caption} {/block:Caption} {/block:Video} {block:Answer} <div class="ask">{Asker} asked, “{Question}”</div> {Answer} {/block:Answer} {block:Audio} <table> <tr> <td> {block:AlbumArt} <img decoding="async" src="{AlbumArtURL}" style="width:120px; height:120px;"> {/block:AlbumArt} </td> <td> <div class="audio"> {AudioPlayerBlack}<br> {block:TrackName}”{TrackName}”{/block:TrackName} by {block:Artist}{Artist}{/block:Artist}<br> {block:Album}<strong>{Album}</strong>{/block:Album} </td></tr><tr><td colspan="2"> {block:Caption} {Caption} {/block:Caption} </td> </tr> </table> {/block:Audio} {block:HasTags} <div class="bottom"> {block:Tags} <a class="tags" href="{TagURL}">#{Tag}</a> {/block:Tags} </div> {/block:HasTags} </div></div><div class="clear"></div><div class="clear"></div> {PostNotes} {/block:Posts} </div> <div id="footer"> Designed by X Q U I S I T E K I S S E S. C O M <a href="http://xquisitekisses.com" target="_new"X Q U I S I T E K I S S E S . C O M</a>. Powered by <a href="http://tumblr.com" target="_new" rel="noopener noreferrer">Tumblr</a>. </div> </body> </html>

Preview Layout

Put this code under tumblr custom css

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"> <head> <meta http-equiv="content-type" content="text/html; charset=utf-8" /> <title>{Title}</title> <link rel="shortcut icon" href="{Favicon}"> <link rel="alternate" type="application/rss+xml" href="{RSS}"> {block:Description} <meta name="description" content="{MetaDescription}" /> {/block:Description} <style type="text/css"> body{ background-image:url('https://res.cloudinary.com/girlycutegraphics/image/upload/v1539815327/backgrounds/halloween/halloween11.jpg'); background-repeat:repeat; background-position:center; background-color:#8d847a; font:10pt arial; color:#ffffff; line-height:16px;} a,a:link,a:visited,a:active{ color:#ffffff; text-decoration:none;} a:hover{ color:#cac6c1; text-decoration:none;} .old a{ background-color:#110e0c; position:fixed; top:50%; right:50px; width:80px; height:57px; display:block; text-align:center; padding-top:23px; font-size:45pt; filter:alpha(opacity=90); opacity:0.9; -moz-border-radius:10px; border-radius:10px;} .old a:hover, .new a:hover{ color:#8b837a; background-color:#221d19;} .new a{ background-color:#110e0c; position:fixed; top:50%; left:50px; width:80px; height:57px; display:block; text-align:center; padding-top:23px; font-size:45pt; filter:alpha(opacity=90); opacity:0.9; -moz-border-radius:10px; border-radius:10px;} #container{ position:absolute; top:20px; left:50%; margin-left:-315px; width:630px; overflow:visible; background-color:transparent; border:none;} a.nav, .bottom a{ font-size:12pt; letter-spacing:-1px; padding:5px; background-color:#635b53; color:#110e0c; font-weight:bold; margin-right:5px; -moz-border-radius:5px; border-radius:5px;} a.nav:hover, .bottom a:hover{ background-color:#8d847a;} #main{margin:0;} #mainbox{ width:630px;} .content{ float:right; width:500px; background-color:#110e0c; padding:15px; margin-bottom:20px; border-bottom:10px solid #221d19; filter:alpha(opacity=90); opacity:0.9; -moz-border-radius:10px; border-radius:10px; min-height:80px;} #info{ float:left; width:100px;} .datebubble{ background-color:#221d19; padding:15px 0 0 0; text-align:center; font-weight:bold; margin:0 0 0 10px; width:64px; height:49px; filter:alpha(opacity=90); opacity:0.9; -moz-border-radius:10px; border-radius:10px;} .datebubble a{font-size:12pt;} .datebubble a:hover{color:#110e0c;} .notesbubble{ background-color:#cac6c1; padding:12px 0 0 0; text-align:center; font-weight:bold; margin:10px 0 0 45px; width:40px; height:28px; filter:alpha(opacity=90); opacity:0.9; -moz-border-radius:10px; border-radius:10px;} .notesbubble a{font-size:9pt; color:#110e0c;} .notesbubble a:hover{color:#635b53;} .portraitbubble{ margin:0 0 0 10px; width:64px; height:64px; filter:alpha(opacity=90); opacity:0.9;} .portraitbubble img{ -moz-border-radius:10px; border-radius:10px;} .clear{clear:both;} .bottom{ margin-top:20px; text-align:center;} .photo{text-align:center;} #footer{ clear:both; height:35px; width:630px margin:20px 0 20px 0; text-align:center; font-size:12pt; font-weight:bold; letter-spacing:-1px; color:#110e0c;} #footer a{color:#221d19!important;} #footer a:hover{color:#110e0c!important;} ul.chat{ list-style-type:none; margin:0 0 5px 0; padding:0;} li.odd{ font-weight:bold;} li.even{ font-weight:bold; color:#8b837a;} .quote{ line-height:18px; color:#635b53; letter-spacing:-2px; font-weight:bold; margin-bottom:5px; font-size:14pt; text-align:center;} .source, .caption{ text-align:center; font-weight:bold; font-size:11pt;} .audio{ padding:0; margin-left:10px; overflow:hidden; text-align:left; display:inline-block;} .ask{ background-color:#cac6c1; padding:10px; color:#110e0c!important; font-weight:bold; display:block; margin-bottom:5px; -moz-border-radius:10px; border-radius:10px;} .ask a:hover{ color:#110e0c!important;} h1, h1 a, a.link{ line-height:24px; font-size:20pt; letter-spacing:-2px; color:#ffffff !important; padding:0; margin-top:0; margin-bottom:5px; font-weight:bold;} h1 a:hover, a.link:hover{ color:#cac6c1 !important;} ul{list-style-type:dot;} blockquote{ font-style:normal !important; text-align:left !important; margin:0 0 0 10px; border-left:3px solid #8b837a; padding:0 0 0 6px;} ol.notes { margin:0 0 20px 60px; width:530px; list-style-type: none;} ol.notes li.note { color:#cac6c1; border:none; padding:4px; background-color:#110e0c; border-bottom:3px solid #221d19; filter:alpha(opacity=90); opacity:0.9; -moz-border-radius:3px; border-radius:3px;} ol.notes li.note img.avatar { vertical-align:-4px; margin-right:10px; width:16px; height:16px;} {CustomCSS} </style> </head> <body> <div id="container"> <div class="old"> {block:Pagination} {block:NextPage} <a href="{NextPage}"> » </a> {/block:NextPage} {/block:Pagination} </div> <div class="new"> {block:Pagination} {block:PreviousPage} <a href="{PreviousPage}"> « </a> {/block:PreviousPage} {/block:Pagination} </div> <div id="main"> <div id="mainbox"> <div id="info"> <div class="portraitbubble"> <img decoding="async" src="{PortraitURL-64}"> </div> </div> <div class="content"> <h1>{Title}</h1> {Description}<br><br> <center> <a class="nav" href="/">Home</a> <a class="nav" href="/archive">Archive</a> <a class="nav" href="{RSS}">RSS</a> <a class="nav" href="/ask">Ask</a> {block:HasPages} {block:Pages} <a class="nav" href="{URL}">{Label}</a> {/block:Pages} {/block:HasPages} </center> </div> </div> <div class="clear"></div> {block:Posts} <div id="mainbox"> <div id="info"> <div class="datebubble"> {block:Date} <a href="{Permalink}"> {MonthNumber}.{DayOfMonth}<br>{Year} </a> {/block:Date} </div> <div class="notesbubble"> {block:NoteCount} <a href="{Permalink}#notes">{NoteCount}</a> {/block:NoteCount} </div> </div> <div class="content"> {block:Text} {block:Title} <h1><a href="{Permalink}">{Title}</a></h1> {/block:Title} {Body} {/block:Text} {block:Photo} <div class="photo"> {LinkOpenTag}<img decoding="async" src="{PhotoURL-500}" alt="{PhotoAlt}" border="0"/>{LinkCloseTag} </div> {block:Caption} {Caption} {/block:Caption} {/block:Photo} {block:Photoset} <div class="photo"> {Photoset-500} </div> {block:Caption} {Caption} {/block:Caption} {/block:Photoset} {block:Quote} <div class="quote"> {Quote} </div> {block:Source} <div class="source"> {Source} </div> {/block:Source} {/block:Quote} {block:Link} <a href="{URL}" class="link" {Target}>{Name}</a> {block:Description} {Description} {/block:Description} {/block:Link} {block:Chat} {block:Title} <h2><a href="{Permalink}">{Title}</a></h2> {/block:Title} <ul class="chat"> {block:Lines} <li class="{Alt} user_{UserNumber}"> {block:Label} <span class="label">{Label}</span> {/block:Label} {Line} </li> {/block:Lines} </ul> </li> {/block:Chat} {block:Photoset} <div class="bigthings"> {Photoset-500} </div> {block:Caption} {Caption} {/block:Caption} {/block:Photoset} {block:Video} {Video-500} {block:Caption} {Caption} {/block:Caption} {/block:Video} {block:Answer} <div class="ask">{Asker} asked, “{Question}”</div> {Answer} {/block:Answer} {block:Audio} <table> <tr> <td> {block:AlbumArt} <img decoding="async" src="{AlbumArtURL}" style="width:120px; height:120px;"> {/block:AlbumArt} </td> <td> <div class="audio"> {AudioPlayerBlack}<br> {block:TrackName}”{TrackName}”{/block:TrackName} by {block:Artist}{Artist}{/block:Artist}<br> {block:Album}<strong>{Album}</strong>{/block:Album} </td></tr><tr><td colspan="2"> {block:Caption} {Caption} {/block:Caption} </td> </tr> </table> {/block:Audio} {block:HasTags} <div class="bottom"> {block:Tags} <a class="tags" href="{TagURL}">#{Tag}</a> {/block:Tags} </div> {/block:HasTags} </div></div><div class="clear"></div><div class="clear"></div> {PostNotes} {/block:Posts} </div> <div id="footer"> Designed by X Q U I S I T E K I S S E S. C O M <a href="http://xquisitekisses.com" target="_new"X Q U I S I T E K I S S E S . C O M</a>. Powered by <a href="http://tumblr.com" target="_new" rel="noopener noreferrer">Tumblr</a>. </div> </body> </html>

Preview Layout

Put this code under tumblr custom css

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"> <head> <meta http-equiv="content-type" content="text/html; charset=utf-8" /> <title>{Title}</title> <link rel="shortcut icon" href="{Favicon}"> <link rel="alternate" type="application/rss+xml" href="{RSS}"> {block:Description} <meta name="description" content="{MetaDescription}" /> {/block:Description} <style type="text/css"> body{ background-image:url('https://res.cloudinary.com/girlycutegraphics/image/upload/v1539815325/backgrounds/halloween/halloween10.jpg'); background-repeat:repeat; background-position:center; background-color:#8d847a; font:10pt arial; color:#ffffff; line-height:16px;} a,a:link,a:visited,a:active{ color:#ffffff; text-decoration:none;} a:hover{ color:#cac6c1; text-decoration:none;} .old a{ background-color:#110e0c; position:fixed; top:50%; right:50px; width:80px; height:57px; display:block; text-align:center; padding-top:23px; font-size:45pt; filter:alpha(opacity=90); opacity:0.9; -moz-border-radius:10px; border-radius:10px;} .old a:hover, .new a:hover{ color:#8b837a; background-color:#221d19;} .new a{ background-color:#110e0c; position:fixed; top:50%; left:50px; width:80px; height:57px; display:block; text-align:center; padding-top:23px; font-size:45pt; filter:alpha(opacity=90); opacity:0.9; -moz-border-radius:10px; border-radius:10px;} #container{ position:absolute; top:20px; left:50%; margin-left:-315px; width:630px; overflow:visible; background-color:transparent; border:none;} a.nav, .bottom a{ font-size:12pt; letter-spacing:-1px; padding:5px; background-color:#635b53; color:#110e0c; font-weight:bold; margin-right:5px; -moz-border-radius:5px; border-radius:5px;} a.nav:hover, .bottom a:hover{ background-color:#8d847a;} #main{margin:0;} #mainbox{ width:630px;} .content{ float:right; width:500px; background-color:#110e0c; padding:15px; margin-bottom:20px; border-bottom:10px solid #221d19; filter:alpha(opacity=90); opacity:0.9; -moz-border-radius:10px; border-radius:10px; min-height:80px;} #info{ float:left; width:100px;} .datebubble{ background-color:#221d19; padding:15px 0 0 0; text-align:center; font-weight:bold; margin:0 0 0 10px; width:64px; height:49px; filter:alpha(opacity=90); opacity:0.9; -moz-border-radius:10px; border-radius:10px;} .datebubble a{font-size:12pt;} .datebubble a:hover{color:#110e0c;} .notesbubble{ background-color:#cac6c1; padding:12px 0 0 0; text-align:center; font-weight:bold; margin:10px 0 0 45px; width:40px; height:28px; filter:alpha(opacity=90); opacity:0.9; -moz-border-radius:10px; border-radius:10px;} .notesbubble a{font-size:9pt; color:#110e0c;} .notesbubble a:hover{color:#635b53;} .portraitbubble{ margin:0 0 0 10px; width:64px; height:64px; filter:alpha(opacity=90); opacity:0.9;} .portraitbubble img{ -moz-border-radius:10px; border-radius:10px;} .clear{clear:both;} .bottom{ margin-top:20px; text-align:center;} .photo{text-align:center;} #footer{ clear:both; height:35px; width:630px margin:20px 0 20px 0; text-align:center; font-size:12pt; font-weight:bold; letter-spacing:-1px; color:#110e0c;} #footer a{color:#221d19!important;} #footer a:hover{color:#110e0c!important;} ul.chat{ list-style-type:none; margin:0 0 5px 0; padding:0;} li.odd{ font-weight:bold;} li.even{ font-weight:bold; color:#8b837a;} .quote{ line-height:18px; color:#635b53; letter-spacing:-2px; font-weight:bold; margin-bottom:5px; font-size:14pt; text-align:center;} .source, .caption{ text-align:center; font-weight:bold; font-size:11pt;} .audio{ padding:0; margin-left:10px; overflow:hidden; text-align:left; display:inline-block;} .ask{ background-color:#cac6c1; padding:10px; color:#110e0c!important; font-weight:bold; display:block; margin-bottom:5px; -moz-border-radius:10px; border-radius:10px;} .ask a:hover{ color:#110e0c!important;} h1, h1 a, a.link{ line-height:24px; font-size:20pt; letter-spacing:-2px; color:#ffffff !important; padding:0; margin-top:0; margin-bottom:5px; font-weight:bold;} h1 a:hover, a.link:hover{ color:#cac6c1 !important;} ul{list-style-type:dot;} blockquote{ font-style:normal !important; text-align:left !important; margin:0 0 0 10px; border-left:3px solid #8b837a; padding:0 0 0 6px;} ol.notes { margin:0 0 20px 60px; width:530px; list-style-type: none;} ol.notes li.note { color:#cac6c1; border:none; padding:4px; background-color:#110e0c; border-bottom:3px solid #221d19; filter:alpha(opacity=90); opacity:0.9; -moz-border-radius:3px; border-radius:3px;} ol.notes li.note img.avatar { vertical-align:-4px; margin-right:10px; width:16px; height:16px;} {CustomCSS} </style> </head> <body> <div id="container"> <div class="old"> {block:Pagination} {block:NextPage} <a href="{NextPage}"> » </a> {/block:NextPage} {/block:Pagination} </div> <div class="new"> {block:Pagination} {block:PreviousPage} <a href="{PreviousPage}"> « </a> {/block:PreviousPage} {/block:Pagination} </div> <div id="main"> <div id="mainbox"> <div id="info"> <div class="portraitbubble"> <img decoding="async" src="{PortraitURL-64}"> </div> </div> <div class="content"> <h1>{Title}</h1> {Description}<br><br> <center> <a class="nav" href="/">Home</a> <a class="nav" href="/archive">Archive</a> <a class="nav" href="{RSS}">RSS</a> <a class="nav" href="/ask">Ask</a> {block:HasPages} {block:Pages} <a class="nav" href="{URL}">{Label}</a> {/block:Pages} {/block:HasPages} </center> </div> </div> <div class="clear"></div> {block:Posts} <div id="mainbox"> <div id="info"> <div class="datebubble"> {block:Date} <a href="{Permalink}"> {MonthNumber}.{DayOfMonth}<br>{Year} </a> {/block:Date} </div> <div class="notesbubble"> {block:NoteCount} <a href="{Permalink}#notes">{NoteCount}</a> {/block:NoteCount} </div> </div> <div class="content"> {block:Text} {block:Title} <h1><a href="{Permalink}">{Title}</a></h1> {/block:Title} {Body} {/block:Text} {block:Photo} <div class="photo"> {LinkOpenTag}<img decoding="async" src="{PhotoURL-500}" alt="{PhotoAlt}" border="0"/>{LinkCloseTag} </div> {block:Caption} {Caption} {/block:Caption} {/block:Photo} {block:Photoset} <div class="photo"> {Photoset-500} </div> {block:Caption} {Caption} {/block:Caption} {/block:Photoset} {block:Quote} <div class="quote"> {Quote} </div> {block:Source} <div class="source"> {Source} </div> {/block:Source} {/block:Quote} {block:Link} <a href="{URL}" class="link" {Target}>{Name}</a> {block:Description} {Description} {/block:Description} {/block:Link} {block:Chat} {block:Title} <h2><a href="{Permalink}">{Title}</a></h2> {/block:Title} <ul class="chat"> {block:Lines} <li class="{Alt} user_{UserNumber}"> {block:Label} <span class="label">{Label}</span> {/block:Label} {Line} </li> {/block:Lines} </ul> </li> {/block:Chat} {block:Photoset} <div class="bigthings"> {Photoset-500} </div> {block:Caption} {Caption} {/block:Caption} {/block:Photoset} {block:Video} {Video-500} {block:Caption} {Caption} {/block:Caption} {/block:Video} {block:Answer} <div class="ask">{Asker} asked, “{Question}”</div> {Answer} {/block:Answer} {block:Audio} <table> <tr> <td> {block:AlbumArt} <img decoding="async" src="{AlbumArtURL}" style="width:120px; height:120px;"> {/block:AlbumArt} </td> <td> <div class="audio"> {AudioPlayerBlack}<br> {block:TrackName}”{TrackName}”{/block:TrackName} by {block:Artist}{Artist}{/block:Artist}<br> {block:Album}<strong>{Album}</strong>{/block:Album} </td></tr><tr><td colspan="2"> {block:Caption} {Caption} {/block:Caption} </td> </tr> </table> {/block:Audio} {block:HasTags} <div class="bottom"> {block:Tags} <a class="tags" href="{TagURL}">#{Tag}</a> {/block:Tags} </div> {/block:HasTags} </div></div><div class="clear"></div><div class="clear"></div> {PostNotes} {/block:Posts} </div> <div id="footer"> Designed by X Q U I S I T E K I S S E S. C O M <a href="http://xquisitekisses.com" target="_new"X Q U I S I T E K I S S E S . C O M</a>. Powered by <a href="http://tumblr.com" target="_new" rel="noopener noreferrer">Tumblr</a>. </div> </body> </html>

Preview Layout

Put this code under tumblr custom css

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"> <head> <meta http-equiv="content-type" content="text/html; charset=utf-8" /> <title>{Title}</title> <link rel="shortcut icon" href="{Favicon}"> <link rel="alternate" type="application/rss+xml" href="{RSS}"> {block:Description} <meta name="description" content="{MetaDescription}" /> {/block:Description} <style type="text/css"> body{ background-image:url('https://res.cloudinary.com/girlycutegraphics/image/upload/v1539815325/backgrounds/halloween/halloween9.jpg'); background-repeat:repeat; background-position:center; background-color:#8d847a; font:10pt arial; color:#ffffff; line-height:16px;} a,a:link,a:visited,a:active{ color:#ffffff; text-decoration:none;} a:hover{ color:#cac6c1; text-decoration:none;} .old a{ background-color:#110e0c; position:fixed; top:50%; right:50px; width:80px; height:57px; display:block; text-align:center; padding-top:23px; font-size:45pt; filter:alpha(opacity=90); opacity:0.9; -moz-border-radius:10px; border-radius:10px;} .old a:hover, .new a:hover{ color:#8b837a; background-color:#221d19;} .new a{ background-color:#110e0c; position:fixed; top:50%; left:50px; width:80px; height:57px; display:block; text-align:center; padding-top:23px; font-size:45pt; filter:alpha(opacity=90); opacity:0.9; -moz-border-radius:10px; border-radius:10px;} #container{ position:absolute; top:20px; left:50%; margin-left:-315px; width:630px; overflow:visible; background-color:transparent; border:none;} a.nav, .bottom a{ font-size:12pt; letter-spacing:-1px; padding:5px; background-color:#635b53; color:#110e0c; font-weight:bold; margin-right:5px; -moz-border-radius:5px; border-radius:5px;} a.nav:hover, .bottom a:hover{ background-color:#8d847a;} #main{margin:0;} #mainbox{ width:630px;} .content{ float:right; width:500px; background-color:#110e0c; padding:15px; margin-bottom:20px; border-bottom:10px solid #221d19; filter:alpha(opacity=90); opacity:0.9; -moz-border-radius:10px; border-radius:10px; min-height:80px;} #info{ float:left; width:100px;} .datebubble{ background-color:#221d19; padding:15px 0 0 0; text-align:center; font-weight:bold; margin:0 0 0 10px; width:64px; height:49px; filter:alpha(opacity=90); opacity:0.9; -moz-border-radius:10px; border-radius:10px;} .datebubble a{font-size:12pt;} .datebubble a:hover{color:#110e0c;} .notesbubble{ background-color:#cac6c1; padding:12px 0 0 0; text-align:center; font-weight:bold; margin:10px 0 0 45px; width:40px; height:28px; filter:alpha(opacity=90); opacity:0.9; -moz-border-radius:10px; border-radius:10px;} .notesbubble a{font-size:9pt; color:#110e0c;} .notesbubble a:hover{color:#635b53;} .portraitbubble{ margin:0 0 0 10px; width:64px; height:64px; filter:alpha(opacity=90); opacity:0.9;} .portraitbubble img{ -moz-border-radius:10px; border-radius:10px;} .clear{clear:both;} .bottom{ margin-top:20px; text-align:center;} .photo{text-align:center;} #footer{ clear:both; height:35px; width:630px margin:20px 0 20px 0; text-align:center; font-size:12pt; font-weight:bold; letter-spacing:-1px; color:#110e0c;} #footer a{color:#221d19!important;} #footer a:hover{color:#110e0c!important;} ul.chat{ list-style-type:none; margin:0 0 5px 0; padding:0;} li.odd{ font-weight:bold;} li.even{ font-weight:bold; color:#8b837a;} .quote{ line-height:18px; color:#635b53; letter-spacing:-2px; font-weight:bold; margin-bottom:5px; font-size:14pt; text-align:center;} .source, .caption{ text-align:center; font-weight:bold; font-size:11pt;} .audio{ padding:0; margin-left:10px; overflow:hidden; text-align:left; display:inline-block;} .ask{ background-color:#cac6c1; padding:10px; color:#110e0c!important; font-weight:bold; display:block; margin-bottom:5px; -moz-border-radius:10px; border-radius:10px;} .ask a:hover{ color:#110e0c!important;} h1, h1 a, a.link{ line-height:24px; font-size:20pt; letter-spacing:-2px; color:#ffffff !important; padding:0; margin-top:0; margin-bottom:5px; font-weight:bold;} h1 a:hover, a.link:hover{ color:#cac6c1 !important;} ul{list-style-type:dot;} blockquote{ font-style:normal !important; text-align:left !important; margin:0 0 0 10px; border-left:3px solid #8b837a; padding:0 0 0 6px;} ol.notes { margin:0 0 20px 60px; width:530px; list-style-type: none;} ol.notes li.note { color:#cac6c1; border:none; padding:4px; background-color:#110e0c; border-bottom:3px solid #221d19; filter:alpha(opacity=90); opacity:0.9; -moz-border-radius:3px; border-radius:3px;} ol.notes li.note img.avatar { vertical-align:-4px; margin-right:10px; width:16px; height:16px;} {CustomCSS} </style> </head> <body> <div id="container"> <div class="old"> {block:Pagination} {block:NextPage} <a href="{NextPage}"> » </a> {/block:NextPage} {/block:Pagination} </div> <div class="new"> {block:Pagination} {block:PreviousPage} <a href="{PreviousPage}"> « </a> {/block:PreviousPage} {/block:Pagination} </div> <div id="main"> <div id="mainbox"> <div id="info"> <div class="portraitbubble"> <img decoding="async" src="{PortraitURL-64}"> </div> </div> <div class="content"> <h1>{Title}</h1> {Description}<br><br> <center> <a class="nav" href="/">Home</a> <a class="nav" href="/archive">Archive</a> <a class="nav" href="{RSS}">RSS</a> <a class="nav" href="/ask">Ask</a> {block:HasPages} {block:Pages} <a class="nav" href="{URL}">{Label}</a> {/block:Pages} {/block:HasPages} </center> </div> </div> <div class="clear"></div> {block:Posts} <div id="mainbox"> <div id="info"> <div class="datebubble"> {block:Date} <a href="{Permalink}"> {MonthNumber}.{DayOfMonth}<br>{Year} </a> {/block:Date} </div> <div class="notesbubble"> {block:NoteCount} <a href="{Permalink}#notes">{NoteCount}</a> {/block:NoteCount} </div> </div> <div class="content"> {block:Text} {block:Title} <h1><a href="{Permalink}">{Title}</a></h1> {/block:Title} {Body} {/block:Text} {block:Photo} <div class="photo"> {LinkOpenTag}<img decoding="async" src="{PhotoURL-500}" alt="{PhotoAlt}" border="0"/>{LinkCloseTag} </div> {block:Caption} {Caption} {/block:Caption} {/block:Photo} {block:Photoset} <div class="photo"> {Photoset-500} </div> {block:Caption} {Caption} {/block:Caption} {/block:Photoset} {block:Quote} <div class="quote"> {Quote} </div> {block:Source} <div class="source"> {Source} </div> {/block:Source} {/block:Quote} {block:Link} <a href="{URL}" class="link" {Target}>{Name}</a> {block:Description} {Description} {/block:Description} {/block:Link} {block:Chat} {block:Title} <h2><a href="{Permalink}">{Title}</a></h2> {/block:Title} <ul class="chat"> {block:Lines} <li class="{Alt} user_{UserNumber}"> {block:Label} <span class="label">{Label}</span> {/block:Label} {Line} </li> {/block:Lines} </ul> </li> {/block:Chat} {block:Photoset} <div class="bigthings"> {Photoset-500} </div> {block:Caption} {Caption} {/block:Caption} {/block:Photoset} {block:Video} {Video-500} {block:Caption} {Caption} {/block:Caption} {/block:Video} {block:Answer} <div class="ask">{Asker} asked, “{Question}”</div> {Answer} {/block:Answer} {block:Audio} <table> <tr> <td> {block:AlbumArt} <img decoding="async" src="{AlbumArtURL}" style="width:120px; height:120px;"> {/block:AlbumArt} </td> <td> <div class="audio"> {AudioPlayerBlack}<br> {block:TrackName}”{TrackName}”{/block:TrackName} by {block:Artist}{Artist}{/block:Artist}<br> {block:Album}<strong>{Album}</strong>{/block:Album} </td></tr><tr><td colspan="2"> {block:Caption} {Caption} {/block:Caption} </td> </tr> </table> {/block:Audio} {block:HasTags} <div class="bottom"> {block:Tags} <a class="tags" href="{TagURL}">#{Tag}</a> {/block:Tags} </div> {/block:HasTags} </div></div><div class="clear"></div><div class="clear"></div> {PostNotes} {/block:Posts} </div> <div id="footer"> Designed by X Q U I S I T E K I S S E S. C O M <a href="http://xquisitekisses.com" target="_new"X Q U I S I T E K I S S E S . C O M</a>. Powered by <a href="http://tumblr.com" target="_new" rel="noopener noreferrer">Tumblr</a>. </div> </body> </html>

Preview Layout

Put this code under tumblr custom css

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"> <head> <meta http-equiv="content-type" content="text/html; charset=utf-8" /> <title>{Title}</title> <link rel="shortcut icon" href="{Favicon}"> <link rel="alternate" type="application/rss+xml" href="{RSS}"> {block:Description} <meta name="description" content="{MetaDescription}" /> {/block:Description} <style type="text/css"> body{ background-image:url('https://res.cloudinary.com/girlycutegraphics/image/upload/v1539815323/backgrounds/halloween/halloween7.jpg'); background-repeat:repeat; background-position:center; background-color:#8d847a; font:10pt arial; color:#ffffff; line-height:16px;} a,a:link,a:visited,a:active{ color:#ffffff; text-decoration:none;} a:hover{ color:#cac6c1; text-decoration:none;} .old a{ background-color:#110e0c; position:fixed; top:50%; right:50px; width:80px; height:57px; display:block; text-align:center; padding-top:23px; font-size:45pt; filter:alpha(opacity=90); opacity:0.9; -moz-border-radius:10px; border-radius:10px;} .old a:hover, .new a:hover{ color:#8b837a; background-color:#221d19;} .new a{ background-color:#110e0c; position:fixed; top:50%; left:50px; width:80px; height:57px; display:block; text-align:center; padding-top:23px; font-size:45pt; filter:alpha(opacity=90); opacity:0.9; -moz-border-radius:10px; border-radius:10px;} #container{ position:absolute; top:20px; left:50%; margin-left:-315px; width:630px; overflow:visible; background-color:transparent; border:none;} a.nav, .bottom a{ font-size:12pt; letter-spacing:-1px; padding:5px; background-color:#635b53; color:#110e0c; font-weight:bold; margin-right:5px; -moz-border-radius:5px; border-radius:5px;} a.nav:hover, .bottom a:hover{ background-color:#8d847a;} #main{margin:0;} #mainbox{ width:630px;} .content{ float:right; width:500px; background-color:#110e0c; padding:15px; margin-bottom:20px; border-bottom:10px solid #221d19; filter:alpha(opacity=90); opacity:0.9; -moz-border-radius:10px; border-radius:10px; min-height:80px;} #info{ float:left; width:100px;} .datebubble{ background-color:#221d19; padding:15px 0 0 0; text-align:center; font-weight:bold; margin:0 0 0 10px; width:64px; height:49px; filter:alpha(opacity=90); opacity:0.9; -moz-border-radius:10px; border-radius:10px;} .datebubble a{font-size:12pt;} .datebubble a:hover{color:#110e0c;} .notesbubble{ background-color:#cac6c1; padding:12px 0 0 0; text-align:center; font-weight:bold; margin:10px 0 0 45px; width:40px; height:28px; filter:alpha(opacity=90); opacity:0.9; -moz-border-radius:10px; border-radius:10px;} .notesbubble a{font-size:9pt; color:#110e0c;} .notesbubble a:hover{color:#635b53;} .portraitbubble{ margin:0 0 0 10px; width:64px; height:64px; filter:alpha(opacity=90); opacity:0.9;} .portraitbubble img{ -moz-border-radius:10px; border-radius:10px;} .clear{clear:both;} .bottom{ margin-top:20px; text-align:center;} .photo{text-align:center;} #footer{ clear:both; height:35px; width:630px margin:20px 0 20px 0; text-align:center; font-size:12pt; font-weight:bold; letter-spacing:-1px; color:#110e0c;} #footer a{color:#221d19!important;} #footer a:hover{color:#110e0c!important;} ul.chat{ list-style-type:none; margin:0 0 5px 0; padding:0;} li.odd{ font-weight:bold;} li.even{ font-weight:bold; color:#8b837a;} .quote{ line-height:18px; color:#635b53; letter-spacing:-2px; font-weight:bold; margin-bottom:5px; font-size:14pt; text-align:center;} .source, .caption{ text-align:center; font-weight:bold; font-size:11pt;} .audio{ padding:0; margin-left:10px; overflow:hidden; text-align:left; display:inline-block;} .ask{ background-color:#cac6c1; padding:10px; color:#110e0c!important; font-weight:bold; display:block; margin-bottom:5px; -moz-border-radius:10px; border-radius:10px;} .ask a:hover{ color:#110e0c!important;} h1, h1 a, a.link{ line-height:24px; font-size:20pt; letter-spacing:-2px; color:#ffffff !important; padding:0; margin-top:0; margin-bottom:5px; font-weight:bold;} h1 a:hover, a.link:hover{ color:#cac6c1 !important;} ul{list-style-type:dot;} blockquote{ font-style:normal !important; text-align:left !important; margin:0 0 0 10px; border-left:3px solid #8b837a; padding:0 0 0 6px;} ol.notes { margin:0 0 20px 60px; width:530px; list-style-type: none;} ol.notes li.note { color:#cac6c1; border:none; padding:4px; background-color:#110e0c; border-bottom:3px solid #221d19; filter:alpha(opacity=90); opacity:0.9; -moz-border-radius:3px; border-radius:3px;} ol.notes li.note img.avatar { vertical-align:-4px; margin-right:10px; width:16px; height:16px;} {CustomCSS} </style> </head> <body> <div id="container"> <div class="old"> {block:Pagination} {block:NextPage} <a href="{NextPage}"> » </a> {/block:NextPage} {/block:Pagination} </div> <div class="new"> {block:Pagination} {block:PreviousPage} <a href="{PreviousPage}"> « </a> {/block:PreviousPage} {/block:Pagination} </div> <div id="main"> <div id="mainbox"> <div id="info"> <div class="portraitbubble"> <img decoding="async" src="{PortraitURL-64}"> </div> </div> <div class="content"> <h1>{Title}</h1> {Description}<br><br> <center> <a class="nav" href="/">Home</a> <a class="nav" href="/archive">Archive</a> <a class="nav" href="{RSS}">RSS</a> <a class="nav" href="/ask">Ask</a> {block:HasPages} {block:Pages} <a class="nav" href="{URL}">{Label}</a> {/block:Pages} {/block:HasPages} </center> </div> </div> <div class="clear"></div> {block:Posts} <div id="mainbox"> <div id="info"> <div class="datebubble"> {block:Date} <a href="{Permalink}"> {MonthNumber}.{DayOfMonth}<br>{Year} </a> {/block:Date} </div> <div class="notesbubble"> {block:NoteCount} <a href="{Permalink}#notes">{NoteCount}</a> {/block:NoteCount} </div> </div> <div class="content"> {block:Text} {block:Title} <h1><a href="{Permalink}">{Title}</a></h1> {/block:Title} {Body} {/block:Text} {block:Photo} <div class="photo"> {LinkOpenTag}<img decoding="async" src="{PhotoURL-500}" alt="{PhotoAlt}" border="0"/>{LinkCloseTag} </div> {block:Caption} {Caption} {/block:Caption} {/block:Photo} {block:Photoset} <div class="photo"> {Photoset-500} </div> {block:Caption} {Caption} {/block:Caption} {/block:Photoset} {block:Quote} <div class="quote"> {Quote} </div> {block:Source} <div class="source"> {Source} </div> {/block:Source} {/block:Quote} {block:Link} <a href="{URL}" class="link" {Target}>{Name}</a> {block:Description} {Description} {/block:Description} {/block:Link} {block:Chat} {block:Title} <h2><a href="{Permalink}">{Title}</a></h2> {/block:Title} <ul class="chat"> {block:Lines} <li class="{Alt} user_{UserNumber}"> {block:Label} <span class="label">{Label}</span> {/block:Label} {Line} </li> {/block:Lines} </ul> </li> {/block:Chat} {block:Photoset} <div class="bigthings"> {Photoset-500} </div> {block:Caption} {Caption} {/block:Caption} {/block:Photoset} {block:Video} {Video-500} {block:Caption} {Caption} {/block:Caption} {/block:Video} {block:Answer} <div class="ask">{Asker} asked, “{Question}”</div> {Answer} {/block:Answer} {block:Audio} <table> <tr> <td> {block:AlbumArt} <img decoding="async" src="{AlbumArtURL}" style="width:120px; height:120px;"> {/block:AlbumArt} </td> <td> <div class="audio"> {AudioPlayerBlack}<br> {block:TrackName}”{TrackName}”{/block:TrackName} by {block:Artist}{Artist}{/block:Artist}<br> {block:Album}<strong>{Album}</strong>{/block:Album} </td></tr><tr><td colspan="2"> {block:Caption} {Caption} {/block:Caption} </td> </tr> </table> {/block:Audio} {block:HasTags} <div class="bottom"> {block:Tags} <a class="tags" href="{TagURL}">#{Tag}</a> {/block:Tags} </div> {/block:HasTags} </div></div><div class="clear"></div><div class="clear"></div> {PostNotes} {/block:Posts} </div> <div id="footer"> Designed by X Q U I S I T E K I S S E S. C O M <a href="http://xquisitekisses.com" target="_new"X Q U I S I T E K I S S E S . C O M</a>. Powered by <a href="http://tumblr.com" target="_new" rel="noopener noreferrer">Tumblr</a>. </div> </body> </html>

Preview Layout

Put this code under tumblr custom css

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"> <head> <meta http-equiv="content-type" content="text/html; charset=utf-8" /> <title>{Title}</title> <link rel="shortcut icon" href="{Favicon}"> <link rel="alternate" type="application/rss+xml" href="{RSS}"> {block:Description} <meta name="description" content="{MetaDescription}" /> {/block:Description} <style type="text/css"> body{ background-image:url('https://res.cloudinary.com/girlycutegraphics/image/upload/v1539815321/backgrounds/halloween/halloween6.jpg'); background-repeat:repeat; background-position:center; background-color:#8d847a; font:10pt arial; color:#ffffff; line-height:16px;} a,a:link,a:visited,a:active{ color:#ffffff; text-decoration:none;} a:hover{ color:#cac6c1; text-decoration:none;} .old a{ background-color:#110e0c; position:fixed; top:50%; right:50px; width:80px; height:57px; display:block; text-align:center; padding-top:23px; font-size:45pt; filter:alpha(opacity=90); opacity:0.9; -moz-border-radius:10px; border-radius:10px;} .old a:hover, .new a:hover{ color:#8b837a; background-color:#221d19;} .new a{ background-color:#110e0c; position:fixed; top:50%; left:50px; width:80px; height:57px; display:block; text-align:center; padding-top:23px; font-size:45pt; filter:alpha(opacity=90); opacity:0.9; -moz-border-radius:10px; border-radius:10px;} #container{ position:absolute; top:20px; left:50%; margin-left:-315px; width:630px; overflow:visible; background-color:transparent; border:none;} a.nav, .bottom a{ font-size:12pt; letter-spacing:-1px; padding:5px; background-color:#635b53; color:#110e0c; font-weight:bold; margin-right:5px; -moz-border-radius:5px; border-radius:5px;} a.nav:hover, .bottom a:hover{ background-color:#8d847a;} #main{margin:0;} #mainbox{ width:630px;} .content{ float:right; width:500px; background-color:#110e0c; padding:15px; margin-bottom:20px; border-bottom:10px solid #221d19; filter:alpha(opacity=90); opacity:0.9; -moz-border-radius:10px; border-radius:10px; min-height:80px;} #info{ float:left; width:100px;} .datebubble{ background-color:#221d19; padding:15px 0 0 0; text-align:center; font-weight:bold; margin:0 0 0 10px; width:64px; height:49px; filter:alpha(opacity=90); opacity:0.9; -moz-border-radius:10px; border-radius:10px;} .datebubble a{font-size:12pt;} .datebubble a:hover{color:#110e0c;} .notesbubble{ background-color:#cac6c1; padding:12px 0 0 0; text-align:center; font-weight:bold; margin:10px 0 0 45px; width:40px; height:28px; filter:alpha(opacity=90); opacity:0.9; -moz-border-radius:10px; border-radius:10px;} .notesbubble a{font-size:9pt; color:#110e0c;} .notesbubble a:hover{color:#635b53;} .portraitbubble{ margin:0 0 0 10px; width:64px; height:64px; filter:alpha(opacity=90); opacity:0.9;} .portraitbubble img{ -moz-border-radius:10px; border-radius:10px;} .clear{clear:both;} .bottom{ margin-top:20px; text-align:center;} .photo{text-align:center;} #footer{ clear:both; height:35px; width:630px margin:20px 0 20px 0; text-align:center; font-size:12pt; font-weight:bold; letter-spacing:-1px; color:#110e0c;} #footer a{color:#221d19!important;} #footer a:hover{color:#110e0c!important;} ul.chat{ list-style-type:none; margin:0 0 5px 0; padding:0;} li.odd{ font-weight:bold;} li.even{ font-weight:bold; color:#8b837a;} .quote{ line-height:18px; color:#635b53; letter-spacing:-2px; font-weight:bold; margin-bottom:5px; font-size:14pt; text-align:center;} .source, .caption{ text-align:center; font-weight:bold; font-size:11pt;} .audio{ padding:0; margin-left:10px; overflow:hidden; text-align:left; display:inline-block;} .ask{ background-color:#cac6c1; padding:10px; color:#110e0c!important; font-weight:bold; display:block; margin-bottom:5px; -moz-border-radius:10px; border-radius:10px;} .ask a:hover{ color:#110e0c!important;} h1, h1 a, a.link{ line-height:24px; font-size:20pt; letter-spacing:-2px; color:#ffffff !important; padding:0; margin-top:0; margin-bottom:5px; font-weight:bold;} h1 a:hover, a.link:hover{ color:#cac6c1 !important;} ul{list-style-type:dot;} blockquote{ font-style:normal !important; text-align:left !important; margin:0 0 0 10px; border-left:3px solid #8b837a; padding:0 0 0 6px;} ol.notes { margin:0 0 20px 60px; width:530px; list-style-type: none;} ol.notes li.note { color:#cac6c1; border:none; padding:4px; background-color:#110e0c; border-bottom:3px solid #221d19; filter:alpha(opacity=90); opacity:0.9; -moz-border-radius:3px; border-radius:3px;} ol.notes li.note img.avatar { vertical-align:-4px; margin-right:10px; width:16px; height:16px;} {CustomCSS} </style> </head> <body> <div id="container"> <div class="old"> {block:Pagination} {block:NextPage} <a href="{NextPage}"> » </a> {/block:NextPage} {/block:Pagination} </div> <div class="new"> {block:Pagination} {block:PreviousPage} <a href="{PreviousPage}"> « </a> {/block:PreviousPage} {/block:Pagination} </div> <div id="main"> <div id="mainbox"> <div id="info"> <div class="portraitbubble"> <img decoding="async" src="{PortraitURL-64}"> </div> </div> <div class="content"> <h1>{Title}</h1> {Description}<br><br> <center> <a class="nav" href="/">Home</a> <a class="nav" href="/archive">Archive</a> <a class="nav" href="{RSS}">RSS</a> <a class="nav" href="/ask">Ask</a> {block:HasPages} {block:Pages} <a class="nav" href="{URL}">{Label}</a> {/block:Pages} {/block:HasPages} </center> </div> </div> <div class="clear"></div> {block:Posts} <div id="mainbox"> <div id="info"> <div class="datebubble"> {block:Date} <a href="{Permalink}"> {MonthNumber}.{DayOfMonth}<br>{Year} </a> {/block:Date} </div> <div class="notesbubble"> {block:NoteCount} <a href="{Permalink}#notes">{NoteCount}</a> {/block:NoteCount} </div> </div> <div class="content"> {block:Text} {block:Title} <h1><a href="{Permalink}">{Title}</a></h1> {/block:Title} {Body} {/block:Text} {block:Photo} <div class="photo"> {LinkOpenTag}<img decoding="async" src="{PhotoURL-500}" alt="{PhotoAlt}" border="0"/>{LinkCloseTag} </div> {block:Caption} {Caption} {/block:Caption} {/block:Photo} {block:Photoset} <div class="photo"> {Photoset-500} </div> {block:Caption} {Caption} {/block:Caption} {/block:Photoset} {block:Quote} <div class="quote"> {Quote} </div> {block:Source} <div class="source"> {Source} </div> {/block:Source} {/block:Quote} {block:Link} <a href="{URL}" class="link" {Target}>{Name}</a> {block:Description} {Description} {/block:Description} {/block:Link} {block:Chat} {block:Title} <h2><a href="{Permalink}">{Title}</a></h2> {/block:Title} <ul class="chat"> {block:Lines} <li class="{Alt} user_{UserNumber}"> {block:Label} <span class="label">{Label}</span> {/block:Label} {Line} </li> {/block:Lines} </ul> </li> {/block:Chat} {block:Photoset} <div class="bigthings"> {Photoset-500} </div> {block:Caption} {Caption} {/block:Caption} {/block:Photoset} {block:Video} {Video-500} {block:Caption} {Caption} {/block:Caption} {/block:Video} {block:Answer} <div class="ask">{Asker} asked, “{Question}”</div> {Answer} {/block:Answer} {block:Audio} <table> <tr> <td> {block:AlbumArt} <img decoding="async" src="{AlbumArtURL}" style="width:120px; height:120px;"> {/block:AlbumArt} </td> <td> <div class="audio"> {AudioPlayerBlack}<br> {block:TrackName}”{TrackName}”{/block:TrackName} by {block:Artist}{Artist}{/block:Artist}<br> {block:Album}<strong>{Album}</strong>{/block:Album} </td></tr><tr><td colspan="2"> {block:Caption} {Caption} {/block:Caption} </td> </tr> </table> {/block:Audio} {block:HasTags} <div class="bottom"> {block:Tags} <a class="tags" href="{TagURL}">#{Tag}</a> {/block:Tags} </div> {/block:HasTags} </div></div><div class="clear"></div><div class="clear"></div> {PostNotes} {/block:Posts} </div> <div id="footer"> Designed by X Q U I S I T E K I S S E S. C O M <a href="http://xquisitekisses.com" target="_new"X Q U I S I T E K I S S E S . C O M</a>. Powered by <a href="http://tumblr.com" target="_new" rel="noopener noreferrer">Tumblr</a>. </div> </body> </html>

Preview Layout

Put this code under tumblr custom css

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"> <head> <meta http-equiv="content-type" content="text/html; charset=utf-8" /> <title>{Title}</title> <link rel="shortcut icon" href="{Favicon}"> <link rel="alternate" type="application/rss+xml" href="{RSS}"> {block:Description} <meta name="description" content="{MetaDescription}" /> {/block:Description} <style type="text/css"> body{ background-image:url('https://res.cloudinary.com/girlycutegraphics/image/upload/v1539815319/backgrounds/halloween/halloween5.jpg'); background-repeat:repeat; background-position:center; background-color:#8d847a; font:10pt arial; color:#ffffff; line-height:16px;} a,a:link,a:visited,a:active{ color:#ffffff; text-decoration:none;} a:hover{ color:#cac6c1; text-decoration:none;} .old a{ background-color:#110e0c; position:fixed; top:50%; right:50px; width:80px; height:57px; display:block; text-align:center; padding-top:23px; font-size:45pt; filter:alpha(opacity=90); opacity:0.9; -moz-border-radius:10px; border-radius:10px;} .old a:hover, .new a:hover{ color:#8b837a; background-color:#221d19;} .new a{ background-color:#110e0c; position:fixed; top:50%; left:50px; width:80px; height:57px; display:block; text-align:center; padding-top:23px; font-size:45pt; filter:alpha(opacity=90); opacity:0.9; -moz-border-radius:10px; border-radius:10px;} #container{ position:absolute; top:20px; left:50%; margin-left:-315px; width:630px; overflow:visible; background-color:transparent; border:none;} a.nav, .bottom a{ font-size:12pt; letter-spacing:-1px; padding:5px; background-color:#635b53; color:#110e0c; font-weight:bold; margin-right:5px; -moz-border-radius:5px; border-radius:5px;} a.nav:hover, .bottom a:hover{ background-color:#8d847a;} #main{margin:0;} #mainbox{ width:630px;} .content{ float:right; width:500px; background-color:#110e0c; padding:15px; margin-bottom:20px; border-bottom:10px solid #221d19; filter:alpha(opacity=90); opacity:0.9; -moz-border-radius:10px; border-radius:10px; min-height:80px;} #info{ float:left; width:100px;} .datebubble{ background-color:#221d19; padding:15px 0 0 0; text-align:center; font-weight:bold; margin:0 0 0 10px; width:64px; height:49px; filter:alpha(opacity=90); opacity:0.9; -moz-border-radius:10px; border-radius:10px;} .datebubble a{font-size:12pt;} .datebubble a:hover{color:#110e0c;} .notesbubble{ background-color:#cac6c1; padding:12px 0 0 0; text-align:center; font-weight:bold; margin:10px 0 0 45px; width:40px; height:28px; filter:alpha(opacity=90); opacity:0.9; -moz-border-radius:10px; border-radius:10px;} .notesbubble a{font-size:9pt; color:#110e0c;} .notesbubble a:hover{color:#635b53;} .portraitbubble{ margin:0 0 0 10px; width:64px; height:64px; filter:alpha(opacity=90); opacity:0.9;} .portraitbubble img{ -moz-border-radius:10px; border-radius:10px;} .clear{clear:both;} .bottom{ margin-top:20px; text-align:center;} .photo{text-align:center;} #footer{ clear:both; height:35px; width:630px margin:20px 0 20px 0; text-align:center; font-size:12pt; font-weight:bold; letter-spacing:-1px; color:#110e0c;} #footer a{color:#221d19!important;} #footer a:hover{color:#110e0c!important;} ul.chat{ list-style-type:none; margin:0 0 5px 0; padding:0;} li.odd{ font-weight:bold;} li.even{ font-weight:bold; color:#8b837a;} .quote{ line-height:18px; color:#635b53; letter-spacing:-2px; font-weight:bold; margin-bottom:5px; font-size:14pt; text-align:center;} .source, .caption{ text-align:center; font-weight:bold; font-size:11pt;} .audio{ padding:0; margin-left:10px; overflow:hidden; text-align:left; display:inline-block;} .ask{ background-color:#cac6c1; padding:10px; color:#110e0c!important; font-weight:bold; display:block; margin-bottom:5px; -moz-border-radius:10px; border-radius:10px;} .ask a:hover{ color:#110e0c!important;} h1, h1 a, a.link{ line-height:24px; font-size:20pt; letter-spacing:-2px; color:#ffffff !important; padding:0; margin-top:0; margin-bottom:5px; font-weight:bold;} h1 a:hover, a.link:hover{ color:#cac6c1 !important;} ul{list-style-type:dot;} blockquote{ font-style:normal !important; text-align:left !important; margin:0 0 0 10px; border-left:3px solid #8b837a; padding:0 0 0 6px;} ol.notes { margin:0 0 20px 60px; width:530px; list-style-type: none;} ol.notes li.note { color:#cac6c1; border:none; padding:4px; background-color:#110e0c; border-bottom:3px solid #221d19; filter:alpha(opacity=90); opacity:0.9; -moz-border-radius:3px; border-radius:3px;} ol.notes li.note img.avatar { vertical-align:-4px; margin-right:10px; width:16px; height:16px;} {CustomCSS} </style> </head> <body> <div id="container"> <div class="old"> {block:Pagination} {block:NextPage} <a href="{NextPage}"> » </a> {/block:NextPage} {/block:Pagination} </div> <div class="new"> {block:Pagination} {block:PreviousPage} <a href="{PreviousPage}"> « </a> {/block:PreviousPage} {/block:Pagination} </div> <div id="main"> <div id="mainbox"> <div id="info"> <div class="portraitbubble"> <img decoding="async" src="{PortraitURL-64}"> </div> </div> <div class="content"> <h1>{Title}</h1> {Description}<br><br> <center> <a class="nav" href="/">Home</a> <a class="nav" href="/archive">Archive</a> <a class="nav" href="{RSS}">RSS</a> <a class="nav" href="/ask">Ask</a> {block:HasPages} {block:Pages} <a class="nav" href="{URL}">{Label}</a> {/block:Pages} {/block:HasPages} </center> </div> </div> <div class="clear"></div> {block:Posts} <div id="mainbox"> <div id="info"> <div class="datebubble"> {block:Date} <a href="{Permalink}"> {MonthNumber}.{DayOfMonth}<br>{Year} </a> {/block:Date} </div> <div class="notesbubble"> {block:NoteCount} <a href="{Permalink}#notes">{NoteCount}</a> {/block:NoteCount} </div> </div> <div class="content"> {block:Text} {block:Title} <h1><a href="{Permalink}">{Title}</a></h1> {/block:Title} {Body} {/block:Text} {block:Photo} <div class="photo"> {LinkOpenTag}<img decoding="async" src="{PhotoURL-500}" alt="{PhotoAlt}" border="0"/>{LinkCloseTag} </div> {block:Caption} {Caption} {/block:Caption} {/block:Photo} {block:Photoset} <div class="photo"> {Photoset-500} </div> {block:Caption} {Caption} {/block:Caption} {/block:Photoset} {block:Quote} <div class="quote"> {Quote} </div> {block:Source} <div class="source"> {Source} </div> {/block:Source} {/block:Quote} {block:Link} <a href="{URL}" class="link" {Target}>{Name}</a> {block:Description} {Description} {/block:Description} {/block:Link} {block:Chat} {block:Title} <h2><a href="{Permalink}">{Title}</a></h2> {/block:Title} <ul class="chat"> {block:Lines} <li class="{Alt} user_{UserNumber}"> {block:Label} <span class="label">{Label}</span> {/block:Label} {Line} </li> {/block:Lines} </ul> </li> {/block:Chat} {block:Photoset} <div class="bigthings"> {Photoset-500} </div> {block:Caption} {Caption} {/block:Caption} {/block:Photoset} {block:Video} {Video-500} {block:Caption} {Caption} {/block:Caption} {/block:Video} {block:Answer} <div class="ask">{Asker} asked, “{Question}”</div> {Answer} {/block:Answer} {block:Audio} <table> <tr> <td> {block:AlbumArt} <img decoding="async" src="{AlbumArtURL}" style="width:120px; height:120px;"> {/block:AlbumArt} </td> <td> <div class="audio"> {AudioPlayerBlack}<br> {block:TrackName}”{TrackName}”{/block:TrackName} by {block:Artist}{Artist}{/block:Artist}<br> {block:Album}<strong>{Album}</strong>{/block:Album} </td></tr><tr><td colspan="2"> {block:Caption} {Caption} {/block:Caption} </td> </tr> </table> {/block:Audio} {block:HasTags} <div class="bottom"> {block:Tags} <a class="tags" href="{TagURL}">#{Tag}</a> {/block:Tags} </div> {/block:HasTags} </div></div><div class="clear"></div><div class="clear"></div> {PostNotes} {/block:Posts} </div> <div id="footer"> Designed by X Q U I S I T E K I S S E S. C O M <a href="http://xquisitekisses.com" target="_new"X Q U I S I T E K I S S E S . C O M</a>. Powered by <a href="http://tumblr.com" target="_new" rel="noopener noreferrer">Tumblr</a>. </div> </body> </html>

Preview Layout

Put this code under tumblr custom css

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"> <head> <meta http-equiv="content-type" content="text/html; charset=utf-8" /> <title>{Title}</title> <link rel="shortcut icon" href="{Favicon}"> <link rel="alternate" type="application/rss+xml" href="{RSS}"> {block:Description} <meta name="description" content="{MetaDescription}" /> {/block:Description} <style type="text/css"> body{ background-image:url('https://res.cloudinary.com/girlycutegraphics/image/upload/v1539815319/backgrounds/halloween/halloween4.jpg'); background-repeat:repeat; background-position:center; background-color:#8d847a; font:10pt arial; color:#ffffff; line-height:16px;} a,a:link,a:visited,a:active{ color:#ffffff; text-decoration:none;} a:hover{ color:#cac6c1; text-decoration:none;} .old a{ background-color:#110e0c; position:fixed; top:50%; right:50px; width:80px; height:57px; display:block; text-align:center; padding-top:23px; font-size:45pt; filter:alpha(opacity=90); opacity:0.9; -moz-border-radius:10px; border-radius:10px;} .old a:hover, .new a:hover{ color:#8b837a; background-color:#221d19;} .new a{ background-color:#110e0c; position:fixed; top:50%; left:50px; width:80px; height:57px; display:block; text-align:center; padding-top:23px; font-size:45pt; filter:alpha(opacity=90); opacity:0.9; -moz-border-radius:10px; border-radius:10px;} #container{ position:absolute; top:20px; left:50%; margin-left:-315px; width:630px; overflow:visible; background-color:transparent; border:none;} a.nav, .bottom a{ font-size:12pt; letter-spacing:-1px; padding:5px; background-color:#635b53; color:#110e0c; font-weight:bold; margin-right:5px; -moz-border-radius:5px; border-radius:5px;} a.nav:hover, .bottom a:hover{ background-color:#8d847a;} #main{margin:0;} #mainbox{ width:630px;} .content{ float:right; width:500px; background-color:#110e0c; padding:15px; margin-bottom:20px; border-bottom:10px solid #221d19; filter:alpha(opacity=90); opacity:0.9; -moz-border-radius:10px; border-radius:10px; min-height:80px;} #info{ float:left; width:100px;} .datebubble{ background-color:#221d19; padding:15px 0 0 0; text-align:center; font-weight:bold; margin:0 0 0 10px; width:64px; height:49px; filter:alpha(opacity=90); opacity:0.9; -moz-border-radius:10px; border-radius:10px;} .datebubble a{font-size:12pt;} .datebubble a:hover{color:#110e0c;} .notesbubble{ background-color:#cac6c1; padding:12px 0 0 0; text-align:center; font-weight:bold; margin:10px 0 0 45px; width:40px; height:28px; filter:alpha(opacity=90); opacity:0.9; -moz-border-radius:10px; border-radius:10px;} .notesbubble a{font-size:9pt; color:#110e0c;} .notesbubble a:hover{color:#635b53;} .portraitbubble{ margin:0 0 0 10px; width:64px; height:64px; filter:alpha(opacity=90); opacity:0.9;} .portraitbubble img{ -moz-border-radius:10px; border-radius:10px;} .clear{clear:both;} .bottom{ margin-top:20px; text-align:center;} .photo{text-align:center;} #footer{ clear:both; height:35px; width:630px margin:20px 0 20px 0; text-align:center; font-size:12pt; font-weight:bold; letter-spacing:-1px; color:#110e0c;} #footer a{color:#221d19!important;} #footer a:hover{color:#110e0c!important;} ul.chat{ list-style-type:none; margin:0 0 5px 0; padding:0;} li.odd{ font-weight:bold;} li.even{ font-weight:bold; color:#8b837a;} .quote{ line-height:18px; color:#635b53; letter-spacing:-2px; font-weight:bold; margin-bottom:5px; font-size:14pt; text-align:center;} .source, .caption{ text-align:center; font-weight:bold; font-size:11pt;} .audio{ padding:0; margin-left:10px; overflow:hidden; text-align:left; display:inline-block;} .ask{ background-color:#cac6c1; padding:10px; color:#110e0c!important; font-weight:bold; display:block; margin-bottom:5px; -moz-border-radius:10px; border-radius:10px;} .ask a:hover{ color:#110e0c!important;} h1, h1 a, a.link{ line-height:24px; font-size:20pt; letter-spacing:-2px; color:#ffffff !important; padding:0; margin-top:0; margin-bottom:5px; font-weight:bold;} h1 a:hover, a.link:hover{ color:#cac6c1 !important;} ul{list-style-type:dot;} blockquote{ font-style:normal !important; text-align:left !important; margin:0 0 0 10px; border-left:3px solid #8b837a; padding:0 0 0 6px;} ol.notes { margin:0 0 20px 60px; width:530px; list-style-type: none;} ol.notes li.note { color:#cac6c1; border:none; padding:4px; background-color:#110e0c; border-bottom:3px solid #221d19; filter:alpha(opacity=90); opacity:0.9; -moz-border-radius:3px; border-radius:3px;} ol.notes li.note img.avatar { vertical-align:-4px; margin-right:10px; width:16px; height:16px;} {CustomCSS} </style> </head> <body> <div id="container"> <div class="old"> {block:Pagination} {block:NextPage} <a href="{NextPage}"> » </a> {/block:NextPage} {/block:Pagination} </div> <div class="new"> {block:Pagination} {block:PreviousPage} <a href="{PreviousPage}"> « </a> {/block:PreviousPage} {/block:Pagination} </div> <div id="main"> <div id="mainbox"> <div id="info"> <div class="portraitbubble"> <img decoding="async" src="{PortraitURL-64}"> </div> </div> <div class="content"> <h1>{Title}</h1> {Description}<br><br> <center> <a class="nav" href="/">Home</a> <a class="nav" href="/archive">Archive</a> <a class="nav" href="{RSS}">RSS</a> <a class="nav" href="/ask">Ask</a> {block:HasPages} {block:Pages} <a class="nav" href="{URL}">{Label}</a> {/block:Pages} {/block:HasPages} </center> </div> </div> <div class="clear"></div> {block:Posts} <div id="mainbox"> <div id="info"> <div class="datebubble"> {block:Date} <a href="{Permalink}"> {MonthNumber}.{DayOfMonth}<br>{Year} </a> {/block:Date} </div> <div class="notesbubble"> {block:NoteCount} <a href="{Permalink}#notes">{NoteCount}</a> {/block:NoteCount} </div> </div> <div class="content"> {block:Text} {block:Title} <h1><a href="{Permalink}">{Title}</a></h1> {/block:Title} {Body} {/block:Text} {block:Photo} <div class="photo"> {LinkOpenTag}<img decoding="async" src="{PhotoURL-500}" alt="{PhotoAlt}" border="0"/>{LinkCloseTag} </div> {block:Caption} {Caption} {/block:Caption} {/block:Photo} {block:Photoset} <div class="photo"> {Photoset-500} </div> {block:Caption} {Caption} {/block:Caption} {/block:Photoset} {block:Quote} <div class="quote"> {Quote} </div> {block:Source} <div class="source"> {Source} </div> {/block:Source} {/block:Quote} {block:Link} <a href="{URL}" class="link" {Target}>{Name}</a> {block:Description} {Description} {/block:Description} {/block:Link} {block:Chat} {block:Title} <h2><a href="{Permalink}">{Title}</a></h2> {/block:Title} <ul class="chat"> {block:Lines} <li class="{Alt} user_{UserNumber}"> {block:Label} <span class="label">{Label}</span> {/block:Label} {Line} </li> {/block:Lines} </ul> </li> {/block:Chat} {block:Photoset} <div class="bigthings"> {Photoset-500} </div> {block:Caption} {Caption} {/block:Caption} {/block:Photoset} {block:Video} {Video-500} {block:Caption} {Caption} {/block:Caption} {/block:Video} {block:Answer} <div class="ask">{Asker} asked, “{Question}”</div> {Answer} {/block:Answer} {block:Audio} <table> <tr> <td> {block:AlbumArt} <img decoding="async" src="{AlbumArtURL}" style="width:120px; height:120px;"> {/block:AlbumArt} </td> <td> <div class="audio"> {AudioPlayerBlack}<br> {block:TrackName}”{TrackName}”{/block:TrackName} by {block:Artist}{Artist}{/block:Artist}<br> {block:Album}<strong>{Album}</strong>{/block:Album} </td></tr><tr><td colspan="2"> {block:Caption} {Caption} {/block:Caption} </td> </tr> </table> {/block:Audio} {block:HasTags} <div class="bottom"> {block:Tags} <a class="tags" href="{TagURL}">#{Tag}</a> {/block:Tags} </div> {/block:HasTags} </div></div><div class="clear"></div><div class="clear"></div> {PostNotes} {/block:Posts} </div> <div id="footer"> Designed by X Q U I S I T E K I S S E S. C O M <a href="http://xquisitekisses.com" target="_new"X Q U I S I T E K I S S E S . C O M</a>. Powered by <a href="http://tumblr.com" target="_new" rel="noopener noreferrer">Tumblr</a>. </div> </body> </html>

Preview Layout

Put this code under tumblr custom css

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"> <head> <meta http-equiv="content-type" content="text/html; charset=utf-8" /> <title>{Title}</title> <link rel="shortcut icon" href="{Favicon}"> <link rel="alternate" type="application/rss+xml" href="{RSS}"> {block:Description} <meta name="description" content="{MetaDescription}" /> {/block:Description} <style type="text/css"> body{ background-image:url('https://res.cloudinary.com/girlycutegraphics/image/upload/v1539815319/backgrounds/halloween/halloween2.jpg'); background-repeat:repeat; background-position:center; background-color:#8d847a; font:10pt arial; color:#ffffff; line-height:16px;} a,a:link,a:visited,a:active{ color:#ffffff; text-decoration:none;} a:hover{ color:#cac6c1; text-decoration:none;} .old a{ background-color:#110e0c; position:fixed; top:50%; right:50px; width:80px; height:57px; display:block; text-align:center; padding-top:23px; font-size:45pt; filter:alpha(opacity=90); opacity:0.9; -moz-border-radius:10px; border-radius:10px;} .old a:hover, .new a:hover{ color:#8b837a; background-color:#221d19;} .new a{ background-color:#110e0c; position:fixed; top:50%; left:50px; width:80px; height:57px; display:block; text-align:center; padding-top:23px; font-size:45pt; filter:alpha(opacity=90); opacity:0.9; -moz-border-radius:10px; border-radius:10px;} #container{ position:absolute; top:20px; left:50%; margin-left:-315px; width:630px; overflow:visible; background-color:transparent; border:none;} a.nav, .bottom a{ font-size:12pt; letter-spacing:-1px; padding:5px; background-color:#635b53; color:#110e0c; font-weight:bold; margin-right:5px; -moz-border-radius:5px; border-radius:5px;} a.nav:hover, .bottom a:hover{ background-color:#8d847a;} #main{margin:0;} #mainbox{ width:630px;} .content{ float:right; width:500px; background-color:#110e0c; padding:15px; margin-bottom:20px; border-bottom:10px solid #221d19; filter:alpha(opacity=90); opacity:0.9; -moz-border-radius:10px; border-radius:10px; min-height:80px;} #info{ float:left; width:100px;} .datebubble{ background-color:#221d19; padding:15px 0 0 0; text-align:center; font-weight:bold; margin:0 0 0 10px; width:64px; height:49px; filter:alpha(opacity=90); opacity:0.9; -moz-border-radius:10px; border-radius:10px;} .datebubble a{font-size:12pt;} .datebubble a:hover{color:#110e0c;} .notesbubble{ background-color:#cac6c1; padding:12px 0 0 0; text-align:center; font-weight:bold; margin:10px 0 0 45px; width:40px; height:28px; filter:alpha(opacity=90); opacity:0.9; -moz-border-radius:10px; border-radius:10px;} .notesbubble a{font-size:9pt; color:#110e0c;} .notesbubble a:hover{color:#635b53;} .portraitbubble{ margin:0 0 0 10px; width:64px; height:64px; filter:alpha(opacity=90); opacity:0.9;} .portraitbubble img{ -moz-border-radius:10px; border-radius:10px;} .clear{clear:both;} .bottom{ margin-top:20px; text-align:center;} .photo{text-align:center;} #footer{ clear:both; height:35px; width:630px margin:20px 0 20px 0; text-align:center; font-size:12pt; font-weight:bold; letter-spacing:-1px; color:#110e0c;} #footer a{color:#221d19!important;} #footer a:hover{color:#110e0c!important;} ul.chat{ list-style-type:none; margin:0 0 5px 0; padding:0;} li.odd{ font-weight:bold;} li.even{ font-weight:bold; color:#8b837a;} .quote{ line-height:18px; color:#635b53; letter-spacing:-2px; font-weight:bold; margin-bottom:5px; font-size:14pt; text-align:center;} .source, .caption{ text-align:center; font-weight:bold; font-size:11pt;} .audio{ padding:0; margin-left:10px; overflow:hidden; text-align:left; display:inline-block;} .ask{ background-color:#cac6c1; padding:10px; color:#110e0c!important; font-weight:bold; display:block; margin-bottom:5px; -moz-border-radius:10px; border-radius:10px;} .ask a:hover{ color:#110e0c!important;} h1, h1 a, a.link{ line-height:24px; font-size:20pt; letter-spacing:-2px; color:#ffffff !important; padding:0; margin-top:0; margin-bottom:5px; font-weight:bold;} h1 a:hover, a.link:hover{ color:#cac6c1 !important;} ul{list-style-type:dot;} blockquote{ font-style:normal !important; text-align:left !important; margin:0 0 0 10px; border-left:3px solid #8b837a; padding:0 0 0 6px;} ol.notes { margin:0 0 20px 60px; width:530px; list-style-type: none;} ol.notes li.note { color:#cac6c1; border:none; padding:4px; background-color:#110e0c; border-bottom:3px solid #221d19; filter:alpha(opacity=90); opacity:0.9; -moz-border-radius:3px; border-radius:3px;} ol.notes li.note img.avatar { vertical-align:-4px; margin-right:10px; width:16px; height:16px;} {CustomCSS} </style> </head> <body> <div id="container"> <div class="old"> {block:Pagination} {block:NextPage} <a href="{NextPage}"> » </a> {/block:NextPage} {/block:Pagination} </div> <div class="new"> {block:Pagination} {block:PreviousPage} <a href="{PreviousPage}"> « </a> {/block:PreviousPage} {/block:Pagination} </div> <div id="main"> <div id="mainbox"> <div id="info"> <div class="portraitbubble"> <img decoding="async" src="{PortraitURL-64}"> </div> </div> <div class="content"> <h1>{Title}</h1> {Description}<br><br> <center> <a class="nav" href="/">Home</a> <a class="nav" href="/archive">Archive</a> <a class="nav" href="{RSS}">RSS</a> <a class="nav" href="/ask">Ask</a> {block:HasPages} {block:Pages} <a class="nav" href="{URL}">{Label}</a> {/block:Pages} {/block:HasPages} </center> </div> </div> <div class="clear"></div> {block:Posts} <div id="mainbox"> <div id="info"> <div class="datebubble"> {block:Date} <a href="{Permalink}"> {MonthNumber}.{DayOfMonth}<br>{Year} </a> {/block:Date} </div> <div class="notesbubble"> {block:NoteCount} <a href="{Permalink}#notes">{NoteCount}</a> {/block:NoteCount} </div> </div> <div class="content"> {block:Text} {block:Title} <h1><a href="{Permalink}">{Title}</a></h1> {/block:Title} {Body} {/block:Text} {block:Photo} <div class="photo"> {LinkOpenTag}<img decoding="async" src="{PhotoURL-500}" alt="{PhotoAlt}" border="0"/>{LinkCloseTag} </div> {block:Caption} {Caption} {/block:Caption} {/block:Photo} {block:Photoset} <div class="photo"> {Photoset-500} </div> {block:Caption} {Caption} {/block:Caption} {/block:Photoset} {block:Quote} <div class="quote"> {Quote} </div> {block:Source} <div class="source"> {Source} </div> {/block:Source} {/block:Quote} {block:Link} <a href="{URL}" class="link" {Target}>{Name}</a> {block:Description} {Description} {/block:Description} {/block:Link} {block:Chat} {block:Title} <h2><a href="{Permalink}">{Title}</a></h2> {/block:Title} <ul class="chat"> {block:Lines} <li class="{Alt} user_{UserNumber}"> {block:Label} <span class="label">{Label}</span> {/block:Label} {Line} </li> {/block:Lines} </ul> </li> {/block:Chat} {block:Photoset} <div class="bigthings"> {Photoset-500} </div> {block:Caption} {Caption} {/block:Caption} {/block:Photoset} {block:Video} {Video-500} {block:Caption} {Caption} {/block:Caption} {/block:Video} {block:Answer} <div class="ask">{Asker} asked, “{Question}”</div> {Answer} {/block:Answer} {block:Audio} <table> <tr> <td> {block:AlbumArt} <img decoding="async" src="{AlbumArtURL}" style="width:120px; height:120px;"> {/block:AlbumArt} </td> <td> <div class="audio"> {AudioPlayerBlack}<br> {block:TrackName}”{TrackName}”{/block:TrackName} by {block:Artist}{Artist}{/block:Artist}<br> {block:Album}<strong>{Album}</strong>{/block:Album} </td></tr><tr><td colspan="2"> {block:Caption} {Caption} {/block:Caption} </td> </tr> </table> {/block:Audio} {block:HasTags} <div class="bottom"> {block:Tags} <a class="tags" href="{TagURL}">#{Tag}</a> {/block:Tags} </div> {/block:HasTags} </div></div><div class="clear"></div><div class="clear"></div> {PostNotes} {/block:Posts} </div> <div id="footer"> Designed by X Q U I S I T E K I S S E S. C O M <a href="http://xquisitekisses.com" target="_new"X Q U I S I T E K I S S E S . C O M</a>. Powered by <a href="http://tumblr.com" target="_new" rel="noopener noreferrer">Tumblr</a>. </div> </body> </html>

AFFILIATES