/* Theme Name: Behold Theme URI: http://slatebalapa.wordpress.com/2013/02/15/behold-wordpress-theme-demo/ Author: Venkatakrishna Rao K S Author URI: http://slatebalapa.wordpress.com/about/ Description: Behold is lightweight theme built with support for Custom Menu, Header Image, In-Built Featured Post/Image slider, Footer Widget area. With wide featured posts slider, and content area, Social icons, Behold theme can help your blog content standout quite well on any device as it is optimized adjust the layout accordingly. Version: 1.0.4 License: GNU General Public License v2 or later License URI: http://www.gnu.org/licenses/gpl-2.0.html Tags: light, white, one-column, two-columns, right-sidebar, fixed-width, custom-header, custom-menu, featured-image-header, featured-images, post-formats, sticky-post, theme-options */ /* =Global */ * { margin:0; padding:0; } div, span, applet, object, iframe, blockquote, pre, a, abbr, acronym, address, cite, code, del, dfn, em, font, ins, kbd, q, s, samp, sub, sup, tt, var, textarea, select, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, textarea { border: 0; font-family: inherit; font:inherit; font-size: 100%; font-style: inherit; font-weight: inherit; margin: 0; outline: 0; padding: 0; vertical-align: baseline; } body { color: #333333; font: 400 13px/18px verdana,arial,sans-serif; font-size: 13px; line-height: 1.4; margin: 0 auto; } :focus { outline: 0; } a { color: #0072C6; text-decoration: none; transition: color 0.1s linear 0s; } a:hover , a:focus { color: #0072C6; text-decoration:underline; } .group:after { clear: both; content: "."; display: block; height: 0; visibility: hidden; } img { max-width:100%; image-rendering: optimizequality; } blockquote { font-style: italic; font-weight: normal; color: #2B2B2B; font-style: italic; } h2, h3, h4, h5, h6 { clear:both; font-weight:normal; } address { display: block; font-family: courier new; margin: 15px 0; } abbr, acronym, dfn { border-bottom: 1px dotted #666666; cursor: help; } dt { font-weight:bold; } dd { margin-bottom: 10px; } .eachpost blockquote{ background-image:url("images/quote-small.png"); background-position:3px 3px; padding-left:21px; background-repeat:no-repeat; } cite, em, i { font-style: italic; } pre { background: none repeat scroll 0 0 #F4F4F4; font: 13px/1.5 "Courier 10 Pitch",Courier,monospace; margin-bottom: 1.625em; overflow: auto; padding: 0.75em 1.625em; } code, kbd, samp, var { font: 13px Monaco,Consolas,"Andale Mono","DejaVu Sans Mono",monospace; } ins { background: none repeat scroll 0 0 #FFF9C0; text-decoration: none; } sup { bottom: 1ex; } sup, sub { font-size: 10px; height: 0; line-height: 1; position: relative; vertical-align: baseline; } strong { font-weight: bold; } /* =Main container */ #mimba { background-color: white; margin: 0 auto; padding-left: 0; width: 93.3%; } #container-404 .searchform { margin-top:10px; } #main { float: left; width: 82.4%; } .error404 #main { margin: 76px 128px auto; } .search-no-results .search-results{ margin: 38px 128px auto; } /* =Header area */ #header { background: none repeat scroll 0 0 #222222; box-shadow: 1px 0 #2A2A2A; color: white; padding: 4% 10% 1.2%; } #header-li { display:block; } #blog-title-wrap { clear: both; padding-bottom: 8px; text-align: left; } #blog-title-wrap a:hover, #blog-title-wrap a:focus { opacity:0.9; transition: all 0.3s ease-in 0.3s; text-decoration:none; } #blog-title { font-size: 32px; font-weight: 300; line-height: 50px; padding-bottom: 5px; text-align:center; } #header-search-form .searchform input[type="text"] { background-image: url("images/search.png"); background-position: 3px 3px; background-repeat: no-repeat; border: 1px solid #222222; border-radius: 50% 50% 50% 50%; box-shadow: 0 2px 5px rgba(100, 100, 100, 0.1); color: #7E7E7E; padding: 4px 4px 4px 21px; width: 0; } #blog-title-wrap a, #blog-desc { color: white; } #blog-desc { color: #7E7E7E; font-size: 11px; font-weight: 400; letter-spacing: 0.4px; text-align: center; } #blog-desc > p:before { content:"¶"; font-size:13px; margin-right:4px; } #header-search-form { margin-top:10px; clear:both; } #header-img, #post-thumbnail-img, .slider-featured-img img { margin:0 auto; overflow: hidden; border:1px solid transparent; display:block; } #slider-nav { clear: both; margin-left: 2.5%; } #slider-navigator-right, #slider-navigator-left { cursor: pointer; display: inline-block; height: 15px; width: 15px; } #slider-navigator-right { text-align:right; } #slider-navigator-right:hover, #slider-navigator-left:hover { color:#CCC; transition: all 0.4s ease-out 0s; } .now-showing { color: #F2F2F2; } #header-img, .slide { display: block; overflow: hidden; } .slide { display:none; } .slide:hover > .featured-post-details, .featured-post-details:hover { background: none repeat scroll 0 0 #292929; transition: all 0.4s ease-out 0s; color:#CCC; } #header .attachment-post-thumbnail, #header .wp-post-image { display: block; margin: 0 auto; } #help-slide { background-image:url("images/slider-play.png"); background-repeat:no-repeat; } /* Featured posts slider */ #header #header-featured-img ul, #header #header-featured-img li { list-style:none; } #header #header-featured-img { margin:0 auto; } #header #header-featured-img li { margin: 0 auto; width: 96%; } .featured-post-details { background: none repeat scroll 0 0 rgba(0, 0, 0, 0.4); border-radius: 10px 10px 10px 10px; margin: -2.7% 0.3% auto; padding: 0.5%; position: absolute; text-shadow: 0 0 2px black, 0 0 3px black; width: auto; } .featured-post-details a { color:#FFF; } .slider-read-more { color:#CCC; font-family: Tahoma; font-size: small; text-decoration: underline; } .featured-post-details h2 > a { color: black; font-family: Tahoma; font-size: 13px; font-weight: bold; } /* =Posts area */ .player { direction: ltr; margin: 0 0 10px 0; } .eachpost { margin: 10px 0 30px; width: 100%; } .single .eachpost { margin: 0 0 26px 0; } .page #mimba { background-color: white; margin: 0 auto; width: 100%; } .page #main { float: left; width: 777px; } .page #sidebar-container { float: right; width: 204px; } .page .eachpost { float:none; width:100%; } .page .eachpost .blgcontent { float: none; padding: 5px 10px 12px 0; } .page .entry-header { margin-left: 0px; } .eachpost .blgcontent { border-bottom: 1px solid #E1E1E1; border-right: 1px solid #E1E1E1; float: right; margin-right: 5px; min-height: 100px; overflow: hidden; padding: 5px 16px 15px 3px; width: 75%; } .eachpost .blgcontent .attachment-medium { border: 1px solid #E1E1E1; float: left; margin: 3px; min-height: 100px; overflow: hidden; padding: 2px; width: 63%; } .eachpost li { list-style-position: inside; } .post p, .page p { margin-bottom: 16px; } .page-link { clear:both; margin: 3px 3px 0 0; } .page-link a { /* such as Pages: 1 2 3 */ background-color: #E1E1E1; padding: 3px; border-radius:25%; } .page-link a:hover, page-link a:focus { /* such as Pages: 1 2 3 */ background-color: whitesmoke; } .gallery-thumb a img { border: 1px solid rgb(238, 238, 238); box-shadow: 3px 3px 3px whitesmoke; -webkit-box-shadow:3px 3px 3px whitesmoke; padding: 2px; } .post-meta { background-color: #EDEDED; border: 1px solid #EDEDED; border-radius: 18px 18px 18px 18px; float: left; font-size: 11px; margin-top: 14px; min-height: 74px; padding: 9px; vertical-align: middle; width: 17.56%; } .m-arrow { border-bottom: 24px solid white; border-left: 19px solid #EDEDED; height: 0; margin-left: 14.25%; margin-top: 5px; position: absolute; width: 0; } .post-date-time, .post-by { margin:2px 0; } .meta-type { color:#353535; border-bottom:1px dotted black; } .post-by { background-image: url("images/author.png"); background-position: 17px 3px; background-repeat: no-repeat; } .post-meta-comments { color:red; } .eachpost p { line-height: 1.58; } #posts-container, #container-404, #mimba #main { padding-bottom:15px; } #container-404 { min-height: 180px; padding: 10px; } .attachment #posts-container { margin: 0 200px auto; width: 100%; } .entry-header .entry-title { font-size: 26px; font-weight: normal; line-height: 40px; margin-bottom:5px; } .single .entry-header .entry-title, .page .entry-header .entry-title { color: #09121A; } .page .entry-header .comments-link{ font-style:normal; line-height:normal; margin-top:-14px; } .post-meta-cat, .post-meta-tag, .publish-time-with-author { margin: 3px 0; } .attachment .entry-header { margin-bottom:20px; } .entry-format { /* the sticky post, or featured post! */ font-size: 15px; letter-spacing:1px; font-weight: normal; color: grey; } .publish-datestamp { margin-top:7px; } .publish-datestamp p { margin-top:7px; } #archive-type-title span, .b-search-results span{ font-weight:bold; } #archive-type-title { color: #6F6F6F; display: block; font-size: 13px; font-weight: normal; padding: 9px 3px; } .header-title-wrapper { top: -15px; display:inline-block; position:relative; } .edit-link a { background-image: url("images/edit.png"); background-position: 24px center; background-repeat: no-repeat; display: block; width: 42px; border:1px solid #CCCCCC; background-color:white; border-radius:3px; } .post-edit-link { background-image: url("images/edit.png"); background-repeat: no-repeat; display: inline-block; height: 14px; line-height: normal; width: 16px; border:1px solid white; } .post-edit-link:hover { border:1px solid #D8DFEA; } .edit-gallery-img { float:right; padding-bottom:4px; } .edit-gallery-img a { border-radius: 4px 4px 4px 4px; color: white; padding: 8px; } .entry-header .format-gallery , .entry-header .format-image { background-image: url("images/gallery.png"); } .entry-header .format-audio { background-image: url("images/audio.png"); } .entry-header .format-quote { background-image: url("images/quote.png"); } .entry-header .format-video { background-image: url("images/video.png"); } .entry-header .format-link { background-image: url("images/link.png"); } .entry-header .image-attachment { background-image: url("images/gallery.png"); } .entry-header .format-chat { background-image: url("images/chat.png"); background-position: 0 5px; background-repeat: no-repeat; padding-left: 36px; } .entry-header .format-gallery , .entry-header .format-image, .entry-header .format-audio, .entry-header .format-quote, .entry-header .image-attachment, .entry-header .format-link, .entry-header .format-video { background-position: 0 2px; background-repeat: no-repeat; padding-left: 36px; } .entry-title-link { color:#0072C6; } .entry-title-link:focus { border-bottom:1px dotted #0072C6; } .entry-title-link:hover { color:#0072C6; text-decoration:none; text-shadow:1px 1px whitesmoke, 1px 1px #444; } img.size-full, img.size-large { height: auto; max-width: 97.5%; width: auto; border: 1px solid #E0E0E0; border-radius: 4px 4px 4px 4px; box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2); } img[class*="align"], img[class*="wp-image-"], #content .gallery .gallery-icon img { border: 1px solid #EEEEEE; box-shadow: 3px 3px 3px whitesmoke; padding: 2px; } .post-entry img { -moz-border-bottom-colors: none; -moz-border-left-colors: none; -moz-border-right-colors: none; -moz-border-top-colors: none; border-color: #DDDDDD #CCCCCC #CCCCCC #DDDDDD; border-image: none; border-style: solid; border-width: 1px; box-shadow: 4px 4px 12px #CCCCCC; -webkit-box-shadow:4px 4px 12px #CCCCCC; left: -4px; padding: 3px; position: relative; } #attachment-image { border:medium none; } /* =Sidebar */ #sidebar-container { float: right; padding: 19px 0; width: 17.39%; } #sidebar-container #toggleable-sidebar-primary .widget, #sidebar-container #sidebar-primary .widget { margin: 10px 0 0; overflow: hidden; padding: 10px 0px; } #sidebar-container .widget li { border-bottom: 1px dotted #E5E5E5; background-color:#F8F8F8; } #sidebar-container .widget li:hover { background-color:#FFF; } #sidebar-footer { padding:10px 80px; } /* + is the adjacent sibling selector. Now, I'm riskily assuming that widget-title will follow "the widget content" or maybe, I'm not assuming but it will be that way.. */ #toggleable-sidebar-primary .widget .widget-title + * { display:none; } #toggleable-sidebar-primary .widget .widget-title { background-color: #F1EFF1; background-image: url("images/tggle.gif"); background-position: -6px 0px; background-repeat: no-repeat; color: #565456; cursor: pointer; display: inline-block; font: 8pt/100% Georgia,serif; letter-spacing: 1px; padding: 11px 21px; text-transform: uppercase; width: 100%; } #sidebar-primary .widget .widget-title { background-color: #F1EFF1; color: #565456; display: inline-block; font: 8pt/100% Georgia,serif; letter-spacing: 1px; padding: 11px 21px; text-transform: uppercase; width: 185px; } #sidebar-container .widget .widget-title + * { padding-top:5px; } #sidebar-container select, #sidebar-container option { background-color:#F8F8F8; padding:4px 2px; } #sidebar-footer-text-widget { border-bottom: 1px solid #333333; padding:10px 0px; margin:0px 80px; width: 37%; } .widget li { list-style: circle inside none;; padding:3px 4px; } #sidebar-footer ul li { margin: 3px 0; } #sidebar-footer a:focus, #sidebar-footer a:hover { color:#FFF; } .widget_search input[type="text"] { -moz-border-bottom-colors: none; -moz-border-left-colors: none; -moz-border-right-colors: none; -moz-border-top-colors: none; background-color: transparent; background-image: url("images/search.png"); background-position: 3px 3px; background-repeat: no-repeat; border-style: none none solid solid; border-width: medium medium 1px; font-size: 13px; padding: 4px 4px 4px 21px; width: 100%; } #wp-calendar { background: none repeat scroll 0 0 transparent; empty-cells: hide; font: 11px/200% Verdana,Arial,Helvetica,sans-serif; width: 100%; border-spacing: 0; } #sidebar-footer #wp-calendar td { background-color: inherit; } #wp-calendar td { background-color: #E1E1E1; padding: 0; text-align: center; } #wp-calendar a { background-color: #CDCDCD; color: #333333; display: block; text-decoration: none; } #wp-calendar caption { text-align: center; width: 100%; } #wp-calendar caption { font-weight: bold; text-align: center; } #wp-calendar .pad, #wp-calendar .pad:hover { background: none repeat scroll 0 0 #F3F3F3; } #wp-calendar a:hover, #wp-calendar a:focus { background-color:#B9B9B9; color:white; } /* =Footer */ #footer { border-bottom: 1px solid #000000; border-top: 1px solid #000000; clear: both; display: block; padding: 1px 0; } #footer a { text-decoration:underline; } #footer-container { background: none repeat scroll 0 0 #222222; } #footer-container .widget_search input[type="text"] { background-color:white; } #footer-container * { color: #717171; } #footer-container .widget-title { color: #CDCDCD; font-size: 16px; font-weight: bold; margin-bottom: 5px; } #sidebar-footer ul { line-height:1; } #sidebar-footer .widget { float: left; font-size: 12px; padding-right: 10%; width: 14%; } #site-generator { clear:both; background-color: black; color: white; font-size: 10.3px; padding: 10px 80px; text-align: right; } #footer #site-generator a { border-bottom: 1px solid #757575; color: white; text-decoration: none; } #theme-author-credits { width: 50%; float:right; } #blog-author-credits { float: left; text-align: left; width: 50%; } #blog-author-credits > span:before { content:":"; } /* = WP Standard CSS Classes */ .sticky .entry-header .entry-title:before { clear: both; color: grey; content: "* Featured"; font-size: 13px; margin-left: 0; margin-top: -21px; position: absolute; } img.alignright { float:right; margin:0 0 1em 1em; border: 1px solid #E0E0E0; border-radius: 4px 4px 4px 4px; box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2); } img.alignleft { float:left; margin:0 1em 1em 0; border: 1px solid #E0E0E0; border-radius: 4px 4px 4px 4px; box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2); } img.aligncenter { display: block; margin-left: auto; margin-right: auto; border: 1px solid #E0E0E0; border-radius: 4px 4px 4px 4px; box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2); } .alignright { float:right; } .alignleft { float:left; } .aligncenter { display: block; margin-left: auto; margin-right: auto } p img, .wp-caption { margin-top: 0.4em; } .wp-caption { margin-bottom: 1.625em; max-width: 96%; padding: 9px; } .wp-caption img { display: block; margin: 0 auto; max-width: 98%; } .wp-caption .wp-caption-text, .gallery-caption { font-family: arial; font-size: 12px; } .wp-caption .wp-caption-text { margin-bottom: 0.6em; padding: 10px 0 5px 40px; position: relative; } .comment-content img, .widget img { max-width: 97.5%; } p img, .wp-caption { margin-top: 0.4em; } .wp-caption { margin-bottom: 1.625em; max-width: 96%; padding: 9px; } .wp-caption img { display: block; margin: 0 auto; max-width: 98%; } .wp-caption .wp-caption-text, .gallery-caption { color: #666; font-family: Georgia, serif; font-size: 12px; } .wp-caption .wp-caption-text { margin-bottom: 0.6em; padding: 10px 0 5px 40px; position: relative; } .wp-caption .wp-caption-text:before { color: #666; content: '\2014'; font-size: 14px; font-style: normal; font-weight: bold; margin-right: 5px; position: absolute; left: 10px; top: 7px; } /* = behold page navigation */ .nav-previous { float:left; text-align:left; } .nav-next { float:right; text-align:right; } .nav-previous a, .nav-next a{ color: red; padding: 8px 3px; } .nav-previous a:focus, .nav-next a:focus, .nav-previous a:hover, .nav-next a:hover { background-color: whitesmoke; text-decoration:none; text-decoration:underline; } .attachment .nav-previous, .attachment .nav-next { float:none; } .attachment .nav-previous { margin-right:4px; } .nav-previous, .nav-next { line-height:1.8; width:50%; } #archive-type-title { margin: 12px 0 0 18.4%; } #nav-below { margin: 12px 0 0 22.8%; } .attachment #nav-below, .attachment #nav-above, .attachment #archive-type-title { margin:0 auto; width:100%; } .b-search-results { } .b-search-results h3 { background-color: #F9EDBE; background-image: url("images/cls-s.png"); background-repeat: no-repeat; border-color: #F0C36D; color: black; cursor: pointer; display: block; font-size: 12px; font-weight: normal; margin: 0 auto; min-width: 211px; padding: 7px; text-align: center; width: 25%; } #nav-above { color: #777777; margin: 3px 18.3% 0; } /* =Custom menu */ #access { display: block; margin-top: 10px; position: absolute; right: 10px; top: 17px; cursor:pointer; float:right; } #access ul { float:right; font-size: 13px; list-style: none outside none; } #access-responsive { float:left; display:none; } #access li { /* no float:left? Think about it */ float: left; padding-left: 7px; position: relative; } #access > ul > li > a { border-bottom: 1px solid #565656; } #access li a { background: none repeat-x scroll 0 0 #222222; border-bottom: 3px double transparent; border-top: 3px double transparent; color: #D6D6D6; font-size:10px; display: block; line-height: 20px; min-width: 66px; padding: 0 4px; text-decoration: none; text-transform:uppercase; } #access ul ul { display: none; float: left; left: 0; margin: 0; position: absolute; z-index: 99999; } #access ul ul ul { left: 100%; top: 0; } #access ul ul a { position:relative; } #sub-menu li { margin-right:3px; } #access ul li:hover > ul { display: block; } #access li a:hover { border-bottom:3px solid #1E8CBE; } #access .current-menu-item a { border-bottom:3px solid #1E8CBE; } /* =Comments */ #posts-container #comments { margin-left: 23%; } .attachment #posts-container #comments { margin-left:0px; } .single #posts-container { margin-top: 22px; } .page #posts-container #comments { margin: 0 23% auto; } #comments-title { background: url("images/comments-bubble-big.gif") no-repeat scroll 0 13px transparent; color: #777777; display: block; font-size: 15px; font-weight: normal; padding: 10px 0 0 26px; } .commentlist { margin-top: 10px; max-width: 729px; } .page .commentlist { max-width: 96.2%; } #comments #respond { background: none repeat scroll 0 0 1px solid #DDDDDD; } #comment-nav-above, #comment-nav-below { width:78%; } #comments li { list-style:none; } .commentlist .depth-1 { border-left:1px dotted #E1E1E1; } .commentlist .depth-1 > div { background:none repeat scroll 0 0 #F3F3F3; font-size: 13px; padding: 20px 20px 10px; } .comment-meta { font-size: 12px; } .comment-meta .comment-author { border-bottom: 1px dotted #CCCCCC; color: #010101; font-size: 88%; font-weight: bold; } .commentlist > li.comment { padding: 1em 0 1em 5em; position: relative; } .commentlist > .even { } .commentlist > li:hover { } .comment-content { font-size:13px; padding: 3px 0; } .commentlist .avatar { border-radius: 3px 3px 3px 3px; box-shadow: 0 1px 2px #CCCCCC; left: 5px; position: absolute; top: 13px; } #cancel-comment-reply-link { font-size:13px; } .reply { margin-top:10px; font-weight:bold; } .reply a { border-bottom: 1px dotted; } .logged-in-as { margin-bottom:5px; } .edit-link { float:right; } #reply-title { color: #DD4B39; font-weight: bold; margin: 4px 0; } #commentform p { margin: 15px 0; max-width: 696px; } #commentform #url, #commentform #email , #commentform #author{ float: left; font-size: 13px; height: 22px; margin-right: 6px; width: 280px; } .comment-form-author, .comment-form-email, .comment-form-url, .comment-form-comment{ min-width:100%; } #commentform #comment { height: 150px; padding: 2px; resize: none; width: 75%; } #commentform label { font-weight:bold; } .commentlist .children li > div { background-color: #F8F3E4; padding: 20px 20px 10px; } .commentlist .children li.comment { border-radius: 0 3px 3px 0; padding: 1.625em 0 0 1.625em; position: relative; } .commentlist > li { border-bottom:1px solid #E1E1E1; } .commentlist .children .avatar { box-shadow: none; left: -31px; padding: 0; top: 22px; } .commentlist .avatar:hover { border-color: #FFFFFF; border-style: solid; border-width: 5px; box-shadow: 0 0 4px rgba(0, 0, 0, 0.4); -webkit-box-shadow: 0 0 4px rgba(0, 0, 0, 0.4);; } .commentlist .pingback { background: none repeat scroll 0 0 #F3F3F3; margin: 1em 0 1.625em; padding: 20px 10px 6px 71px; } .nocomments { font-size:125%; color:#AAAAAA; } .comment-content td, .post td { border-top: 1px solid #ddd; padding: 6px 10px 6px 0; } .comment-content table, .post table { border-bottom: 1px solid #ddd; margin: 0 0 1.625em; width: 100%; } .comment-content th, .post th { color: #666; text-align:left; font-size: 10px; font-weight: 500; letter-spacing: 0.1em; line-height: 2.6em; text-transform: uppercase; } .comment-content h1, .comment-content h2, .comment-content h3, .comment-content h4, .comment-content h5, .comment-content h6, { color: #000; font-weight: bold; margin: 5px 0px; } ul { line-height: 1.75; list-style: square; } ol { line-height: 1.75; list-style-type: decimal; } ol ol { list-style: upper-alpha; } ol ol ol { list-style: lower-roman; } ol ol ol ol { list-style: lower-alpha; } #comments .comment-content ol ol, #comments .comment-content ul ul, .post ol, .post ul, .post ul ul { margin-left:30px; } .commentlist .bypostauthor > div, .commentlist .children .bypostauthor > div { background-color: #EAFFCE; background-repeat: no-repeat; } .commentlist .bypostauthor > div:before { clear: both; content: "*"; font-size: 17px; font-variant: small-caps; margin: -19px auto 0 -16px; position: absolute; } .commentlist > li.even { border-left: 5px solid #F8F3E4; } .commentlist > li.odd { border-left: 5px solid #E1E1E1; } /* =Forms */ input[type=text], input[type=password], textarea { padding:2px; background: #fafafa; border: 1px solid #ddd; color: black; } input[type=text]:focus, textarea:focus { background-color: white; border-color: rgba(82, 168, 236, 0.8); } #container-404 .searchform #s { background-color: #FFFFFF; background-image: url("images/search.png"); background-position: 3px 3px; background-repeat: no-repeat; border: 1px solid #29CF9E; border-radius:3px; font-size: 13px; margin-bottom: 3px; width:190px; padding: 4px 4px 4px 21px; } /* =Misc */ .scroll_to_top { bottom: 56px; position: fixed; width:19px; height:19px; right: 20px; cursor:pointer; background-image:url("images/up.png"); } /* =Social media */ #social-media { background-color: white; border-top: 4px solid skyblue; border-right: 4px solid skyblue; border-bottom: 4px solid skyblue; left: -34px; padding: 3px 2px 3px 4px; position: fixed; top: 257px; transition: all 0.3s ease-in 0s; } #social-media:hover { transition: all 0.3s ease-in 0s; left:0; text-decoration:none; } #social-media a { text-decoration:none; background-repeat: no-repeat; border: 1px solid transparent; display: block; height: 23px; transition: all 0.3s ease-in 0s; width: 23px; padding:3px; } #social-media a:hover { transform:rotate(16deg); -ms-transform:rotate(16deg); /* IE 9 */ -moz-transform:rotate(16deg); /* Firefox */ -webkit-transform:rotate(16deg); /* Safari and Chrome */ -o-transform:rotate(16deg); /* Opera */ } .behold-fb { background-image:url("images/icon-fb.png"); } .behold-tw { background-image:url("images/icon-tw.png"); } .behold-gp { background-image:url("images/icon-gp.png"); } .behold-li { background-image:url("images/icon-li.png"); } .behold-pi { background-image:url("images/icon-pi.png"); } .behold-rs { background-image:url("images/icon-rs.png"); } .hidethis { visibility:hidden; } /* Responsive design! */ @media only screen and (max-width: 800px) { body { } } @media only screen and (max-width: 991px) { } @media (max-width: 925px) { .post-meta { float:none; background-color:transparent; border: 1px solid transparent; border-radius: 7% 7% 7% 7%; font-size: 10px; margin-left: 0; margin-top: 14px; padding: 4px; width: 19%; } .eachpost .blgcontent { width:65%; } .m-arrow { display:none; } #blog-title, #blog-desc { margin-left: 1.8%; text-align:left; } #access ul { display:none; } #access ul li{ float:none; } #access-responsive { display:block; background-image: url("images/menu.png"); background-position: 0px 7px; background-repeat: no-repeat; height: 25px; width: 19px; float:left; text-decoration:none; } #access-responsive:focus + ul { display:block; } }