Bambi's BLOG @ hatena

ブログ運営 カスタマイズ テーマ制作 アフィリエイト いろいろ (ずぼらでも頑張るブログ)

Kool Rotterdam(クールロッテルダム)

勝手にオランダのロッテルダムのイメージで好きな色を並べてみました(笑)
自分の中ではクール&おしゃれなイメージです。

f:id:zuboraca:20180630125220j:plain

サンプルブログ

↓↓テーマ「パレット」をインストール後、
こちらを「デザイン」→「カスタマイズ」→「{}デザインCSS」にコピペしてください。

/*==============================
Kool Rotterdam
==============================*/

/*=== main-color ===*/
a,.date a,.categories a,
.hatena-module-profile .id a,
.hatena-urllist .urllist-date-link a,
:not(.permalink)>.pager-next a,
.hatena-urllist .urllist-category-link a 
{color:#3FC1C9;}
.entry-content pre.code:before
{background-color:	#3FC1C9;}
.entry-content blockquote 
{border-left:35px solid #3FC1C9;}

/*=== border ===*/
.entry-content hr,
.urllist-item,
.page-archive .archive-entry,
ul.table-of-contents:before,
.comment-box .entry-comment 
{border-bottom: 1px solid #364f6b;}
.entry-header,
.hatena-module-title
{border-bottom: 3px solid #364f6b;}
.comment-box .entry-comment:first-child
{border-top: 1px solid #364f6b;}
.categories a,
.leave-comment-title,
:not(.permalink)>.pager-next a
{border: 1px solid #364f6b;}

/*=== sub-color ===*/
#title a:hover,a:hover,
h1 a:hover, h2 a:hover, h3 a:hover, 
h4 a:hover, h5 a:hover, h6 a:hover,
.entry-title a:hover,
ul.table-of-contents li a:hover,
:not(.permalink)>.pager-next a:hover
{color: #fc5185;}

/*=== background-color ===*/
.date a,
.hatena-urllist .urllist-date-link a,
.hatena-urllist .urllist-category-link a,
.entry-content blockquote,
.entry-content pre.code,
ul.table-of-contents
{background-color:	#f5f5f5;}

/*=== h1~h5 ===*/
h1,h2,h3,h1 a,h2 a,h3 a
{color:#f5f5f5;}
.entry-content h3
{border-top: 3px solid #fc5185;}
.entry-content h3
{border-bottom: 3px solid #fc5185;}
.entry-content h1
{border-bottom: 7px solid #fc5185;}
.entry-content h2, .entry-content h4
{border-left: 7px solid #fc5185;}
.entry-content h1, .entry-content h2, 
.entry-content h3
{background-color:	#364f6b;}		

/*=== globalheader ===*/
#globalheader-container
{background-color:#364f6b;
color:white;}
#globalheader-container
{border-bottom:1px solid #364f6b;}

/*=== title ===*/
#blog-title
{padding:20px;border-bottom:5px solid #364f6b;}
#title a{color:#fc5185}#title a:hover{color:#3FC1C9}
#blog-description{color:#3FC1C9}
html,body{background-color:#f5f5f5;}
#title{display:block;}

/*=== navi-top ===*/
ul.navi-top a:hover{color:#3FC1C9;}
ul.navi-top li a::before{letter-spacing: 0.5em;}
ul.navi-top,ul.navi-top a{background-color:#364f6b;}

/*=== bottom-menu ===*/
.bottom-menu li a{color:white;}
ul.bottom-menu{border-top: 3px solid #3FC1C9;border-bottom:0px solid #3FC1C9;}
ul.bottom-menu, ul.bottom-menu li{background-color:#364f6b;}
ul.menu-second-level li a{background-color:#f5f5f5;color:#3FC1C9;}
ul.menu-second-level li a:hover{background-color:#364f6b;color:white;}
ul.menu-second-level li a{border-top:1px solid #3FC1C9;}
.bottom-menu li a:hover{color:#3FC1C9}

/*== icon ==*/
ul.navi-top li a::before,
ul.table-of-contents li:before,
.hatena-module-title::before
{font-family:"blogicon";
content:"\f023";/*=== add ===*/
color: #3FC1C9;}

/*=== footer ===*/
#footer{margin-top:0}
#footer, #footer a{background-color:#364f6b;color:white}

/*=== title font + size ===*/
body{font-family:'Calibri','Corbel','Trebuchet MS', 'Avenir','Avenir Next',YuGothic,'Yu Gothic',sans-serif;}
#title{font-size:2rem;}