KITASENJU DESIGN BLOG

memo, html, javascript, unity

CSS of this blog

/* <system section="theme" selected="life"> */
@import "/css/theme/life/life.css";
/* </system> */

/* <system section="background" selected="pattern-06"> */
body{ background-image: url('/images/theme/backgrounds/2014/pattern-06.png'); background-repeat: repeat; background-attachment: fixed; background-position: 0 0; background-size: 120px 115px; } @media (-webkit-min-device-pixel-ratio: 2) { body {background-image: url('/images/theme/backgrounds/2014/pattern-06@2x.png');} }
/* </system> */


body{
font-family: Helvetica,Arial,Sans-serif;
    border-left: 20px dotted #fff;
    border-right: 20px dotted #fff;
}

.entry-header{
padding: 25px;

/*filter: url(#noiseEffect);*/
}

.entry-footer-section{
display: none;
}

.archive-heading{
text-align: center;
}

h1{

}

p{

line-height: 200%;



}

.entry-footer-section{
margin: 50px;
text-align: center;
}

 .test-google-rectangle-ads{
display: none;
visibility: hidden;
height: 0px;

  position: absolute;
  left: 1000px;
}



.adsbygoogle,#touch-top-entry-header-ad,.google-afc-user-container{
border: double 10px #00ff00;
background-color: #0f0;
height: 0;
position: absolute;
right: 0px;
  animation: rotate-anime 3s linear infinite;
  transform: scale(0.1);
}

@keyframes rotate-anime {
  0%  {transform: rotate3d(0.2,0.7,0.1,0deg) scale(0.3);}
  100%  {transform: rotate3d(0.4,0.3,0.3,360deg) scale(0.3);}
}

@keyframes rotate-anime3 {
  0%  {transform: rotate3d(0,0,1,0deg) scale(0.3);}
  50%  {transform: rotate3d(0,0,1,360deg) scale(0.4);}
  100%  {transform: rotate3d(0,0,1,-360deg) scale(0.3);}
}

#title {
  /*animation: rotate-anime2 1s linear infinite;*/
}

@keyframes rotate-anime2 {
  0%  {transform: rotate3d(0,1,0,0deg) scale(1);}
  50%  {transform: rotate3d(0,1,0,90deg) scale(1);}
  100%  {transform: rotate3d(0,1,0,0deg) scale(1);}
}


.open-pro-modal{
color:#fff;
  filter: opacity(0);
}

article{
border: dotted 1px #996600;
padding-top: 15px;
}

#globalheader-container{
filter: url(#noiseEffect2);

background-color:#0f0;
color: #fff;
transform: scale(1,1.4);
transform-origin: 0 0;
/*animation: bg-anime 1s linear infinite;*/
background-image: linear-gradient(90deg, rgb(96,132,20) 0%, rgb(220,19,102) 5%, rgb(72,189,218) 9%, rgb(40,27,247) 17%, rgb(197,165,218) 22%, rgb(133,35,0) 44%, rgb(238,152,131) 56%, rgb(33,77,87) 75%, rgb(167,45,203) 82%, rgb(190,149,97) 90%);
}

@keyframes bg-anime {
  0%  {background-color: #0f0;}
  25%  {background-color: #0ff;}
  50%  {background-color: #f0f;}
  75%  {background-color: #ff0;}
  100%  {background-color: #0f0;}
}


#box2-inner{
transform: scale(1,0.8);
transform-origin: 0 0
}

#container-inner{
background-color: rgba(255,0,0,0);
}

#container{
/*background-color: rgba(255,255,255,0.4);
backdrop-filter: blur(8px);*/
}

.entry-title-link{
color: #000;
}

.entry-title {
font-size: 28px;
/*filter: blur(2px);*/
text-align: left;
margin-top: 25px;
max-height: 230px;
    -ms-writing-mode: tb-rl;
    writing-mode: vertical-rl;
    display: inline-block;
    text-align: right;
    border: 1px solid #888;
    border-radius: 50% 50% 0 0;
    padding: 20px 50px;
    /*transform: scale(1.5,0.7);*/
background: repeating-linear-gradient(0deg, #fff, #8ff 10%, #fff 20%);
}


#title{

    /*filter: drop-shadow(0px 0px 1px #000);*/
    /*text-shadow: -5px -5px 0px #f00, 5px 5px #00f;*/
    animation: blur-anime 2s linear infinite;
}

@keyframes blur-anime {
  0%  {filter: blur(8px);letter-spacing: 10px;}
  45%  {filter: blur(0px);letter-spacing: 0px;}
  55%  {filter: blur(0px);letter-spacing: 0px;}
  100%  {filter: blur(8px);letter-spacing: 10px;}
}

.hatena-module-category{

}


/* width */
::-webkit-scrollbar {
  width: 80px;
background-image: linear-gradient(0deg, rgb(255,10,91) 0%, rgb(76,72,45) 8%, rgb(51,124,195) 19%, rgb(142,131,173) 28%, rgb(51,254,111) 31%, rgb(46,23,55) 37%, rgb(166,52,102) 48%, rgb(166,64,76) 61%, rgb(106,99,125) 72%, rgb(87,25,65) 80%, rgb(209,224,21) 85%, rgb(205,139,96) 96%);
}
::-webkit-scrollbar:hover {
}


/* Track */
::-webkit-scrollbar-track {
  box-shadow: inset 0 0 0px grey; 
  border-radius: 10px;
}
 
/* Handle */
::-webkit-scrollbar-thumb {
  border-radius: 40px;
  border: 10px ridge #ccc;

  animation: bg-animeS 1s linear infinite;
  background: #00f;
  background-image: linear-gradient(180deg, rgba(0,255,0,1) 0%, rgba(0,0,255,1) 25%, rgba(255,0,255,1) 50%, rgba(255,255,0,1) 75%, rgba(255,0,0,1) 100%);
}

/* Handle on hover */
::-webkit-scrollbar-thumb:hover {
  background: #0f0;

  background-image: linear-gradient(90deg, rgba(0,255,0,1) 0%, rgba(0,0,255,1) 25%, rgba(255,0,255,1) 50%, rgba(255,255,0,1) 75%, rgba(255,0,0,1) 100%);
}

::selection {
 color: #f00;
 background-color:#0f0;
 }

@keyframes bg-animeS {
  0%  {background: #0f0;}
  25%  {background: #0ff;}
  50%  {background: #f0f;}
  75%  {background: #ff0;}
  100%  {background: #0f0;}
}

#footer-inner{

  background-image: linear-gradient(90deg, rgba(0,255,0,1) 0%, rgba(0,0,255,1) 25%, rgba(255,0,255,1) 50%, rgba(255,255,0,1) 75%, rgba(255,0,0,1) 100%);  
}

.entry-title-link{
}


.hatena-urllist li{
padding:0;
margin:0;
display: inline-block;
font-size: 20px;
list-style-type: circle;
}

.entry-content a{
text-decoration: none;
}

a{
/*text-decoration: none;*/
/* border: 1px solid rgba(0,0,0,0); */
/*border: 6px ridge rgba(0, 0, 255, 0.8);*/
}

a:hover{
color: #f00;

}

#container{
}





#myFooter{
  background: repeating-linear-gradient(-45deg, #000, #ff0 20px, #f00 40px, #f0f 60px, #00f 80px, #0ff 100px, #000 120px); 
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  
  background-position: 0% 0%;
    background-size: 500px 500px;  
  animation: gradient 4s linear infinite;    
  border: 4px solid #fff;
}

@keyframes gradient {
    0% {
        background-position: 0 500px;
    }
    100% {
        background-position: 500px 500px;
    }
}

.entry-content pre{
  border: 6px ridge #00ff00;
  background: #f5f5f5;
  color: #000;
  font-size: 15px;
  
}

.pager-next a{
font-size: 80px;
margin-bottom: 80px;
background: repeating-linear-gradient(90deg, #fff, #8ff 10%, #fff 20%);
border: 1px solid #00f;
border-radius: 0px 100px 100px 00px;

}

.pager-prev a{
font-size: 80px;
margin-bottom: 80px;
background: repeating-linear-gradient(90deg, #fff, #8ff 10%, #fff 20%);
border: 10px solid #00f;
box-shadow: 0px 0px 40px rgba(255,255,0,1);
}

#box2{

}

"FOOTER"