/* Primary styles. (You may want to give your website your own style!) Author: Bruno Bichet For Those About to Rock. Fire! */ /** * =HTML * Tip: ask yourself if some CSS rules shouldn't be nested into markup.css */ a { -webkit-transition: background .4s ease; -moz-transition: background .4s ease; -o-transition: background .4s ease; transition: background .4s ease; -webkit-transition: color .3s linear; -moz-transition: color .3s linear; -o-transition: color .3s linear; transition: color .3s linear; } a:visited { color: #333 } a:hover { background: #fff; background: rgba(255,255,255,0.50); -moz-border-radius: 3px; border-radius: 3px; } a:focus { } a:focus, :focus { outline: 1px dotted #000; } a:hover, a:active { outline: none; } a:active { position: relative; top: 1px; } /** * =Document: global */ /* =Aspect */ html { background: #000 url(https://si1.twimg.com/profile_background_images/256487096/bg-basics-gothic.png) no-repeat top center; } body { background: #807666; background: rgba(128,118,102,0.8); } section, #banner, #content-info { background: #eee; background: rgba(255,255,255,0.8); } section, #banner, #content-info, .section-title { -moz-border-radius: 5px; border-radius: 5px; } #sidebar .section-title { font-size: 1.539em; } #logo a:hover, #branding a:hover { background: transparent; } /* =Horizontal Grid and Vertical Grid */ body { width: 960px; margin: 1.539em auto; } #page { width: 940px; margin: 0 auto; padding: 1em 0; /* Play with comments to toggle the 940 pixels grid */ /* background: url(grid.png) repeat-x; */ } #banner { padding: 0.539em 1.539em; } #main, #sidebar, #sidebar .sidebars { float: left; position: relative; } #main { width: 540px; clear: left; } .singular #main { width: 620px; } #sidebar { margin-left: 20px; } .home #sidebar { width: 380px; } .home #sidebar #search-in { width: 380px; } .singular #sidebar, .singular #sidebar .sidebars, .singular #sidebar #search-in { width: 300px; } #sidebar .sidebars { margin-left: 0px; width: 180px; } #sidebar .sidebars + .sidebars { margin-left: 20px; } #sidebar .sidebars > h1 { padding: .809em 0; margin-bottom: 1em; } #content-info { clear: both; } section, #content-info { padding: 1.539em; } #site-navigation:before, #site-navigation:after { content: "\0020"; display: block; height: 0; overflow: hidden; } #site-navigation:after { clear: both; } #site-navigation { zoom: 1; } #content, section, article { overflow: hidden; } #search-in, #banner, .home #content, .singular #content, footer > aside, section header, section[role="main"], section.widget { margin-bottom: 1.539em; } section > article { padding-top: 0; } .section-title { margin: 0 0 .27em 0 } .section-description { margin: .27em 0 .539em 1.539em; } /** * =Document: specifics */ /* =Banner -------------------------------------------------------------- */ #logo { position: relative; float: left; right: .539em; } #site-title { font-size: 4em; margin-top: 0; line-height: 1.439; margin-bottom: 0; color: #ECEBE8; text-shadow: #9285AD 0px 1px 1px; } #site-title a { text-decoration: none; } #site-description { font-size: 3em; margin-top: 0; line-height: 1.2; text-align: center; text-shadow: #9285AD 0px 1px 1px; } /* =Site Navigation -------------------------------------------------------------- */ /* =Navigation systems in the banner area -------------------------------------------------------------- */ /* =Top Menu */ .current-menu-item { font-weight: bold; } #widget-area-1 { float: right; margin-top: 1.539em; } #widget-area-1 li { display: inline-block; } #widget-area-1 li:before { content: " | "; } #widget-area-1 li:first-child:before { content: ""; } /* =Main Menu */ #site-navigation { text-transform: uppercase; } .site-navigation a { color: #333; background: #ECEBE8; text-decoration: none; padding: 0.27em .539em; -moz-border-radius: 5px; border-radius: 5px; box-shadow: #070609 0px 1px 1px; } .site-navigation a:hover { color: #eee; background: #807666; font-weight: normal; box-shadow: #000000 0px 1px 1px; } #site-navigation { margin-bottom: .539em; } .site-navigation li { list-style: none; } .site-navigation li + li { margin-left: 20px; } .site-navigation > ul > li { margin-left: 1.539em; text-align: center; } .site-navigation ul > li:first-child { margin-left: 0; } .site-navigation ul { /* all lists */ padding: 0; margin: 0; line-height: 1; } .site-navigation a { display: block; width: 10em; } .site-navigation li { /* all list items */ float: left; width: 10em; /* width needed or else Opera goes nuts */ } .site-navigation li ul { /* second-level lists */ position: absolute; background: transparent; width: 10em; left: -999em; /* using left instead of display to hide menus because display: none isn't read by screen readers */ text-align: left; } .site-navigation li ul ul { /* third-and-above-level lists */ margin: -1em 0 0 10em; } .site-navigation li:hover ul ul, .site-navigation li:hover ul ul ul, .site-navigation li.sfhover ul ul, .site-navigation li.sfhover ul ul ul { left: -999em; } .site-navigation li:hover ul, .site-navigation li li:hover ul, .site-navigation li li li:hover ul, .site-navigation li.sfhover ul, .site-navigation li li.sfhover ul, .site-navigation li li li.sfhover ul { /* lists nested under hovered list items */ left: auto; } /* =Search */ #search-in form { margin-bottom: 0; } form[role="search"] fieldset { padding: 0; margin: 0; } input#search { width: 70%; -moz-border-radius:3px; border-radius:3px; } /* =Other Navigation */ #nav-above, nav-below { overflow: hidden; } #nav-above { margin: 0 0 1.539em 0; } #nav-below { margin: 1.539em 0 0 0; } .nav-next { float: right; } .nav-previous { float: left; } .tagcloud { line-height: 1; text-align: center; } #menu-download-basics > li { list-style: none; margin-bottom: 1em; text-align: center; } #menu-download-basics a { color: #fff; padding: .27em .539em; background: #807666; background: rgba(128,118,102,0.8); -moz-border-radius: 5px; border-radius: 5px; } #menu-download-basics li:first-child a { font-weight: bold; } #menu-download-basics a:hover { } /* =Section Headings */ .section-title { } .section-description { line-height: 1.231em; font-style: italic; } .section-header { overflow: hidden; position: relative; } .author .section-description { margin-left: 80px; } .author-avatar { width: 60px; position: absolute; top: 2.73em; } #author-avatar { float: left; margin: 0.27em 1.539em 0 0; } /* =Sidebars */ #sidebar ul, #sidebar ol, #sidebar li { margin-left: 0; } #sidebar ul ul, #sidebar ul ol, #sidebar ol ul, #sidebar ol ol { margin-left: 1em; } #sidebar p { text-align: left; } #sidebar > aside > h1 { text-align: center; background: #eee; background: rgba(255,255,255,0.8); } /* =Sidebar 1 */ #sidebar-1 { } /* =Sidebar 2 */ #sidebar-2 { } /* =Posts */ article { margin-bottom: 2em; } article:last-child { margin-bottom: 0; } article header { margin-bottom: 1.539em; } .entry-thumbnail img { -moz-border-radius: 10px; border-radius: 10px; } .entry-thumbnail.thumb-small img { -moz-border-radius: 60px; border-radius: 60px; } .archive .entry-title { font-weight: bold; } .entry-title { margin-top: 0; text-shadow: #070609 0px 1px 1px; letter-spacing: 0.05em; } .entry-title a { text-decoration: none; } article footer { font-size: .85em; color: #000; } .entry-content p:first-child { font-size: 1.231em; } .entry-meta { clear: both; } /* =Footer */ #colophon { margin-top: 1.539em; background: #fff; background: rgba(255,255,255,0.50); } /* =Comments */ #comments-title { } #comments ul li, #comments ol li { list-style: none; } .comment-author, .comment-meta { margin-bottom: .539em; } .comment-author img { -moz-border-radius:20px; border-radius:20px; } .comment-author cite { font-style: normal; font-size: 1.539em; display: inline-block; position: relative; top: -.27em; left: .27em; } .comment-author .says { display: none; } #comments article { margin-bottom: 1.539em; } .reply a { font-weight: bold; } .reply a, #reply-title small a { display: inline-block; padding: 0.27em .539em; background: #eee; background: rgba(255,255,255,0.8); -moz-border-radius: 5px; border-radius: 5px; } #respond ul { margin-left: 0; } #respond li { list-style: none; margin-bottom: .539em; position: relative; } #respond label { display: inline-block; width: 10em; } #respond li .required { margin: -0.27em .539em; position: absolute; top: .539em; left: 8.5em; } #respond li input { width: 70%; } .nocomments { margin-bottom: 0; text-align: center; } /* =Responsive web design with media queries */ @media only screen and (max-width : 990px) { body { width: 100%; margin: 1.539em auto; } #page { width: 98%; } #main, #sidebar, #sidebar .sidebars { float: none; } #main, .singular #main { width: 100%; margin-bottom: 1.539em; } #sidebar { margin-left: 0; } .home #sidebar { width: 100%; } .home #sidebar #search-in { width: 100%; } .singular #sidebar, .singular #sidebar .sidebars, .singular #sidebar #search-in { width: 100%; } #sidebar .sidebars { margin-left: 0px; width: 100%; } #sidebar .sidebars + .sidebars { margin-left: 0; } } /* =Alignment for the logo "WordPress je thème". Keep it safe if possible ;-) */ #wpjt { display: inline-block; vertical-align: middle; } /* We Salute you! */