Customize Q Research with Hot Pink Red Text
(with shadow behind red text)
Cobalt Blue background
Blurred images that change to crisp and slowly fade back to blurred when hovering over and moving cursor away…
Nice clean font, etc… (Century Gothic)…
/ Enter here your own CSS rules… /
/* If you want to make a redistributable style, be sure to
have a Yotsuba B theme selected. */
/ These will be applied on top of whatever theme you choose below. /
/ You can include CSS files from remote servers, for example: /
/ @import "http://example.com/style.css"; /
body {
background: #6897bb;
color: white;
font-family: "Century Gothic", CenturyGothic, AppleGothic, sans-serif;
font-size: 10pt;
margin: 0 4px;
padding-left: 4px;
padding-right: 4px;
}
/ Decrease RED TEXT size and recolour to Hot Pink for teh lulz. /
span.heading {
color: #ff20bd; / Hot Pink /
font-size: 11pt; / Real small, default is 11pt /
text-shadow: 1px 1px 3px #0E2E2D;
}
/ Add a blur and opacity change to images that fades-to-normal when moused over /
.post-image {
opacity: .2; / Can be between .01 - 1 /
filter: blur(5px); / Can be 1 - 10+ /
transition: all 233ms;
/ Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#f3c5bd+0,e86c57+50,ea2803+51,ff6600+75,c72200+100;Red+Gloss /
background: rgb(243,197,189); / Old browsers /
background: -moz-linear-gradient(top, rgba(243,197,189,1) 0%, rgba(232,108,87,1) 50%, rgba(234,40,3,1) 51%, rgba(255,102,0,1) 75%, rgba(199,34,0,1) 100%); / FF3.6-15 /
background: -webkit-linear-gradient(top, rgba(243,197,189,1) 0%,rgba(232,108,87,1) 50%,rgba(234,40,3,1) 51%,rgba(255,102,0,1) 75%,rgba(199,34,0,1) 100%); / Chrome10-25,Safari5.1-6 /
background: linear-gradient(to bottom, rgba(243,197,189,1) 0%,rgba(232,108,87,1) 50%,rgba(234,40,3,1) 51%,rgba(255,102,0,1) 75%,rgba(199,34,0,1) 100%); / W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ /
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f3c5bd', endColorstr='#c72200',GradientType=0 ); / IE6-9 /
-webkit-border-radius: 12px 12px 12px 12px;
border-radius: 12px 12px 12px 12px;
-webkit-transition: all 2s ease-in-out;
-moz-transition: all 2s ease-in-out;
-ms-transition: all 2s ease-in-out;
-o-transition: all 2s ease-in-out;
transition: all 2s ease-in-out;
}
.post-image:hover {
opacity: 1; / Can be between .01 - 1 /
filter: blur(0px); / Can be 1 - 10+ /
transition: all 89ms;
}