This week only. Pastebin PRO Accounts Christmas Special! Don't miss out!Want more features on Pastebin? Sign Up, it's FREE!
Guest

style

By: brunoscunha on Jan 11th, 2013  |  syntax: CSS  |  size: 16.31 KB  |  views: 32  |  expires: Never
download  |  raw  |  embed  |  report abuse  |  print
Text below is selected. Please press Ctrl+C to copy to your clipboard. (⌘+C on Mac)
  1. /*  
  2. Theme Name: picolight
  3. Theme URI: http://picomol.de/picolight/
  4. Description: picolight is a neutral, light, clean and professional looking WordPress theme. You can set your own header image and favicon. You can configure the menu bar and the link color.
  5. Version: 1.1.10
  6. Author: Valentin
  7. Author URI: http://picomol.de/about/
  8. Tags: light, two-columns, right-sidebar, flexible-width, custom-colors, custom-header, custom-background, custom-menu, theme-options, sticky-post, translation-ready
  9.  
  10. License: GNU/GPL Version 2 or later
  11. License URI: http://www.gnu.org/licenses/gpl.html
  12. */
  13.  
  14.  
  15.  
  16. /* ubuntu fonts */
  17.  
  18.  
  19. @font-face {
  20.   font-family: 'Ubuntu';
  21.   src: url('ubuntu-r.woff') format('woff');
  22.   font-weight: normal;
  23.   font-style: normal;
  24. }
  25.  
  26.  
  27.  
  28. /* elements */
  29.  
  30.  
  31. body {
  32.         font-family: Arial,sans-serif;
  33.         margin:0 auto;
  34.         font-size:14px;
  35.         color: #292929;
  36.         }
  37.        
  38. img {
  39.         border:0;
  40.         }
  41.  
  42. a:link ,a:active ,a:visited {
  43.         text-decoration: none;
  44.         border: none;
  45.         text-decoration: none;
  46.         }
  47.  
  48. input::-moz-focus-inner {
  49.         border:0;
  50.         }
  51.  
  52. p a:link, p a:active, p a:visited, .entry li a:link, .entry li a:active, .entry li a:visited {
  53.         text-decoration: underline;
  54.         }
  55.  
  56. a:hover {
  57.         text-decoration: none;
  58.         color: #000;
  59.         border: none;
  60.         }
  61.  
  62. a:focus {
  63.         outline: none;
  64.         text-shadow: 0 0 5px #BFBFBF;
  65.         }
  66.  
  67. textarea {
  68.         border: 1px solid #F0F0F0;     
  69.         width: 80%;
  70.         font-family: Arial,sans-serif;
  71.         font-size: 13px;
  72.         }
  73.        
  74. input {
  75.         width: 150px;
  76.         }
  77.  
  78. input:focus {
  79.         outline: none;
  80.         }
  81.  
  82. .alignright {
  83.         float: right;
  84.         }
  85.        
  86. .alignleft {
  87.         float: left
  88.         }
  89.        
  90. acronym, abbr, span.caps {
  91.         cursor: help;
  92.         }
  93. acronym, abbr {
  94.         border-bottom: 1px dashed #999;
  95.         }
  96.        
  97. .center {
  98.         text-align: center;
  99.         }
  100.        
  101. .hidden {
  102.         display: none;
  103.         }
  104.        
  105. .aligncenter,div.aligncenter {
  106.         display: block;
  107.         margin-left: auto;
  108.         margin-right: auto;
  109.         }
  110.  
  111.  
  112.  
  113. /* main structure elements */
  114.  
  115.  
  116. #wrapper {
  117.         margin:0 auto;
  118.         clear: both;
  119.         background: #fff;
  120.         }
  121.                        
  122. #wrapper #main {
  123.         clear:both;
  124.         overflow:hidden;
  125.         }
  126.  
  127. #wrapper #header #image {
  128.         text-align: center;
  129.         }
  130.  
  131. #headerimage {
  132.         width: 100%;
  133.         clear: both;
  134.         }
  135.  
  136. #wrapper #header, #wrapper #footer {
  137.         font-family: Ubuntu, Arial, 'sans serif';
  138.         padding-top: 2px;
  139.         }
  140.  
  141. #wrapper #header {
  142.         background: #f0f0f0;
  143.         border-top: 1px solid #CCCCCC;
  144.         margin-bottom: 20px;
  145.         }
  146.  
  147. #wrapper #header h1 {
  148.         font-weight: normal;
  149.         font-size: 30px;
  150.         margin: 0;
  151.         float: left;
  152.         text-transform: uppercase;
  153.         text-shadow: 0 1px 0 #fff;
  154.         }
  155.  
  156. #wrapper #header h1 a {
  157.         color: #808080;
  158.         }
  159.  
  160. #wrapper #header h1 a:hover {
  161.         color: #292929;
  162.         }
  163.  
  164. #wrapper #header .description {
  165.         font-size: 16px;
  166.         text-transform: uppercase;
  167.         color: #808080;
  168.         text-shadow: 0 1px 0 #fff;
  169.         }
  170.        
  171. #wrapper #footer {
  172.         padding: 15px;
  173.         margin-top: 40px;
  174.         min-height: 30px;
  175.         color: #808080;
  176.         background: #f0f0f0;
  177.         border-top: 1px solid #ccc;
  178.         }
  179.  
  180. #footer a {
  181.         }
  182.  
  183. #main #content {
  184.         margin-top: 7px;
  185.         padding: 0;
  186.         }
  187.        
  188. #main #sidebar {
  189.         line-height:18px;
  190.         color: #292929;
  191.         }
  192.  
  193. #main #sidebar a:link, #main #sidebar a:visited {
  194.         text-decoration: none;
  195.         }
  196.  
  197. #main #sidebar a:hover, #main #sidebar a:active {
  198.         }
  199.  
  200. #footer .left {
  201.         margin: 10px;
  202.         }
  203.        
  204. #footer .right {
  205.         margin: 10px;
  206.         }
  207.  
  208. #footer .right a:link, #footer .right a:visited {
  209.         text-decoration: none;
  210.         }
  211.  
  212. #footer .right a:hover, #footer .right a:active {
  213.         }
  214.  
  215.  
  216.  
  217. /* navigation */
  218.  
  219.  
  220. #mainnav {
  221.         margin: 0 auto;
  222.         display: block;
  223.         font-size: 13px;
  224.         text-transform: uppercase;
  225.         clear: both;
  226.         }
  227.        
  228. #mainnav ul {
  229.         padding: 0;
  230.         margin: 0;
  231.         min-height: 27px;
  232.         }
  233.  
  234. #mainnav ul li {
  235.         list-style: none;
  236.         position: relative;
  237.         float: left;
  238.         margin: 0 0 1px 0;
  239.         padding: 0;
  240.         border-bottom: none;
  241.         }
  242.  
  243. #mainnav ul ul li {
  244.         padding: 0;
  245.         margin-bottom: 0;
  246.         border: none;
  247.         }
  248.  
  249. #mainnav ul ul li a {
  250.         padding: 5px;
  251.         }
  252.  
  253. #mainnav ul li a {
  254.         margin: 0;
  255.         display: block;
  256.         color: #808080;
  257.         padding: 3px 0 0 15px;
  258.         line-height: 38px;
  259.         text-shadow: 0 1px 0 #fff;
  260.         background: #f0f0f0;
  261.         border-bottom: 1px solid #ccc;
  262.         }
  263.  
  264. #mainnav ul li:last-child a {
  265.         padding-right: 15px;
  266.         }
  267.  
  268. #mainnav ul li a:hover {
  269.         text-decoration: none;
  270.         color: #292929;
  271.         text-shadow: none;
  272.         }
  273.  
  274. #mainnav ul ul {
  275.         display: none;
  276.         float: left;
  277.         position: absolute;
  278.         top: 42px;
  279.         left: 2px;
  280.         z-index: 500;
  281.         font-size: 12px;
  282.         padding: 0;
  283.         padding-left: 8px;
  284.         background: #f0f0f0;
  285.         border-bottom: 1px solid #ccc;
  286.         }
  287.  
  288. #mainnav ul ul ul {
  289.         left: 100%;
  290.         top: 0;
  291.         font-size: 12px;
  292.         }
  293.  
  294. #mainnav ul ul a {
  295.         width: 9em;
  296.         height: auto;
  297.         line-height: 15px;
  298.         border: none;
  299.         }
  300.        
  301. #mainnav ul li:hover > ul {
  302.         display: block;
  303.         }
  304.  
  305. .navigation {
  306.         padding: 15px;
  307.         }
  308.  
  309.  
  310.  
  311. /* widgets */
  312.  
  313.  
  314. .widget {
  315.         overflow:hidden;
  316.         clear:both;
  317.         margin-bottom: 25px;
  318.         font-size: 13px;
  319.         }
  320.  
  321. .widget .textwidget, .widget .tagcloud {
  322.         padding: 0 10px 0 10px;
  323.         margin-bottom: 10px;
  324.         }
  325.  
  326. .widget table {
  327.         padding: 0 0 10px 10px;
  328.         margin-right: 10px;
  329.         }
  330.        
  331. .widget h4 {
  332.         font-size:12px;
  333.         margin: 0 0 10px 0;
  334.         padding: 8px 5px 5px 8px;
  335.         text-transform: uppercase;
  336.         color: #808080;
  337.         }
  338.        
  339. .widget ul {
  340.         margin: 0;
  341.         padding: 0;
  342.         }
  343.        
  344. .widget ul li {
  345.         background:url(images/icon_bullet.png) 5px 2px no-repeat;
  346.         padding:0 7px 7px 24px;
  347.         list-style-type: none;
  348.         }
  349.        
  350. .widget_categories ul li {
  351.         width:40%;
  352.         float:left;
  353.         margin:0;
  354.         }
  355.        
  356. .widget select {
  357.         margin: 10px;
  358.         }
  359.  
  360. .widget_search {
  361.         max-width: 300px;
  362.         }
  363.  
  364. .widget_search form {
  365.         border-top: 1px solid #ccc;
  366.         border-bottom: 1px solid #ccc;
  367.         height: 35px;
  368.         margin: 0 15px;
  369.         }
  370.        
  371. .widget_search input{
  372.         width:65%;
  373.         border: none;
  374.         background: transparent;
  375.         height: 25px;
  376.         padding: 5px 5px 5px 15px;
  377.         color: #808080;
  378.         text-shadow: 0 1px 0 #fff;
  379.         }
  380.  
  381. .widget_search input:focus {
  382.         color: #292929;
  383.         }
  384.        
  385. .widget_search input#searchsubmit {
  386.         width: 30px;
  387.         color: transparent;
  388.         background: transparent;
  389.         border: none;
  390.         background: url(images/lupe.png) 0 -21px no-repeat;
  391.         text-shadow: none;
  392.         position: relative;
  393.         left: 15px;
  394.         }
  395.  
  396. .widget_search input#searchsubmit:hover {
  397.         background: url(images/lupe.png) 0 0px no-repeat;      
  398.         }
  399.  
  400. .widget_calendar table {
  401.         width: 100%;
  402.         text-align: center;
  403.         padding-left: 0;
  404.         }
  405.  
  406. .search-title {
  407.         padding: 0 15px;
  408.         }
  409.  
  410.  
  411.  
  412. /* posts and pages */
  413.  
  414.  
  415. .post, .pages {
  416.         margin-bottom: 25px;
  417.         }
  418.        
  419. .post .title, .pages .title {
  420.         float:left;
  421.         width: 100%;
  422.         }
  423.  
  424. .post .title h1, .pages .title  h1, .post .title h2, .pages .title h2 {
  425.         font-size: 22px;
  426.         margin: 7px 15px;
  427.         padding: 0;
  428.         }
  429.  
  430. .post .meta, .pages .meta {
  431.         font-size: 13px;
  432.         color: #808080;
  433.         padding: 5px 15px;
  434.         clear: both;
  435.         border-top: 1px solid #ccc;
  436.         }
  437.        
  438. .post .thumbnail {
  439.         float: left;
  440.         margin: 10px 15px 10px 10px;
  441.         }
  442.        
  443. .post .entry, .pages .entry {
  444.         line-height:24px;
  445.         display:block;
  446.         clear:both;
  447.         overflow:hidden;
  448.         color:#292929;
  449.         text-align: justify;
  450.         padding: 10px 15px 16px 15px;
  451.         }
  452.  
  453. .post p, .pages p {
  454.         margin:0;
  455.         padding: 6px 0;
  456.         }
  457.        
  458. .post blockquote, .pages blockquote {
  459.         background:transparent url(images/quote.png) no-repeat scroll 0 0;
  460.         font-style:italic;
  461.         margin:5px 0 5px 0;
  462.         padding:10px 15px 10px 60px;
  463.         }
  464.  
  465. .post ul.split3cols,.post ul.split2cols,.pages ul.split3cols,.pages ul.split2cols  {
  466.         font-size: 13px;
  467.         overflow:auto;
  468.         width:520px;
  469.         }
  470.        
  471. .post ul, .pages ul {
  472.         list-style-type:none;
  473.         margin:10px 0;
  474.         padding:0 0 0 10px;
  475.         }
  476.  
  477. .post ul.split3cols li, .pages ul.split3cols li {
  478.         float:left;
  479.         width:155px;
  480.         margin-right:5px;
  481.         }
  482.        
  483. .post ul.split2cols li, .pages ul.split2cols li {
  484.         float:left;
  485.         width:240px;
  486.         margin-right:5px;
  487.         }
  488.  
  489. .pages ul.split3cols,.pages ul.split2cols {
  490.         font-size: 13px;
  491.         overflow:auto;
  492.         width:520px;
  493.         }
  494.        
  495. .pages ul {
  496.         list-style-type:none;
  497.         margin:10px 0;
  498.         padding:0 0 0 10px;
  499.         }
  500.  
  501. .post ul li, .pages ul li {
  502.         background:url(images/icon_bullet.png) 5px 2px no-repeat;
  503.         line-height: 24px;
  504.         margin:4px 0;
  505.         padding:0 0 0 25px;
  506.         }
  507.  
  508. .post .entry h1,.post .entry h2,.post .entry h3,.post .entry h4, .pages .entry h1,.pages .entry h2,.pages .entry h3,.pages .entry h4, #comment-form h3, .commentform h3 {
  509.         padding: 5px 5px 2px 0;
  510.         }
  511.  
  512. h1, h2, h3, h4 {
  513.         font-family: Ubuntu, Arial, 'sans serif';
  514.         font-weight: normal;
  515.         }
  516.        
  517. .post .entry h1, .pages .entry h1 {
  518.         font-size:20px;
  519.         }
  520.        
  521. .post .entry h2, .pages .entry h2, #comment-form h3,.commentform h3 {
  522.         font-size:18px;
  523.         margin-top: 20px;
  524.         }
  525.        
  526. .post .entry h3, .pages .entry h3 {
  527.         font-size:16px;
  528.         margin-top: 20px;
  529.         }
  530.        
  531. .post .entry h4, .pages .entry h4 {
  532.         font-size:14px;
  533.         margin-top: 5px;
  534.         }
  535.  
  536. .pages h1,.pages h2,.pages  h3,.pages h4 {
  537.         margin: 10px 0 5px 0;
  538.         padding: 5px 0 0 5px;
  539.         color: #292929;
  540.         }
  541.  
  542. .pagelinks {
  543.         clear: both;
  544.         color: #808080;
  545.         margin-top: 25px;
  546.         }
  547.  
  548. .pagelinks p {
  549.         border-top: 1px solid #ccc;
  550.         border-bottom: 1px solid #ccc;
  551.         text-shadow: 0 1px 0 #fff;
  552.         background: #f0f0f0;
  553.         padding: 10px;
  554.         display: inline;
  555.         }
  556.  
  557. .pagelinks a:link, .pagelinks a:visited {
  558.         text-decoration: none;
  559.         }
  560.  
  561. .pagelinks a:hover {
  562.         }
  563.  
  564.  
  565.  
  566. /* tables */
  567.  
  568.  
  569. .post table th, .pages table th, .comment table th {
  570.         font-size: 13px;
  571.         font-weight: normal;
  572.         color: #808080;
  573.         text-transform: uppercase;
  574.     padding: 2px 4px;
  575.     text-align: left;
  576.         }
  577.  
  578. .post table, .pages table, .comment table {
  579.         margin: 10px 0;
  580.         width: 100%;
  581.         border-collapse: collapse;
  582.         }
  583.  
  584. .post td, .pages td, .comment td {
  585.     border-bottom: 1px solid #ccc;
  586.     border-top: 1px solid #ccc;
  587.     padding: 2px 4px;
  588.         }
  589.  
  590.  
  591.  
  592. /* comments */
  593.  
  594.  
  595. #comments {
  596. }
  597.  
  598. .comment {
  599.         overflow: hidden;
  600.         }
  601.  
  602. #comments h3, h3#reply-title {
  603.         font-size: 22px;
  604.         margin: 0;
  605.         padding: 10px 15px 7px;
  606.         background: #fff;
  607.         border-bottom: 1px solid #ccc;
  608.         }
  609.        
  610. .commentlist {
  611.         padding: 15px;
  612.         list-style:none;
  613.         overflow:hidden;
  614.         clear:both;
  615.         margin: 0;
  616.         }
  617.  
  618. .commentlist li {
  619.         list-style:none;
  620.         }
  621.  
  622. .children li {
  623.         border: 0px;
  624.         }
  625.  
  626. .children p {
  627.         clear: left;
  628.         }
  629.  
  630. .commentlist p {
  631.         color:#292929;
  632.         line-height:24px;
  633.         clear: left;
  634.         text-align: justify;
  635.         }
  636.  
  637. .comment-body {
  638.         padding: 6px 0px;
  639.         margin-bottom: 10px;
  640.         margin-right: 5px;
  641.         margin-left: 5px;
  642.         }
  643.  
  644. .comment-body ul li {
  645.         list-style-type: disc;
  646.         }
  647.  
  648. .comment-body ol li {
  649.         list-style-type: decimal;
  650.         }
  651.  
  652. .comment-body ul, .comment-body ol {
  653.         margin-top: 15px;
  654.         }
  655.  
  656. .comment-body li {
  657.         border: none;
  658.         padding:0 7px 7px 4px;
  659.         margin: 0 0 0 10px;
  660. }
  661.  
  662. .comment-author .says {
  663.         display: none;
  664.         }
  665.  
  666. .commentlist cite, .commentlist cite a {
  667.         font-style: normal;
  668.         }
  669.  
  670. .avatar {
  671.         float: left;
  672.         margin: 0 15px 0 0;
  673.         }
  674.  
  675. .comment-meta-date a, .reply a {
  676.         color: #808080;
  677.         }
  678.  
  679. .comment-meta-date a:hover, .reply a:hover {
  680.         color: #000;
  681.         }
  682.  
  683. .comment-meta-date {
  684.         font-size: 12px;
  685.         }
  686.  
  687. .commentlist .reply {
  688.         padding:0px 5px 5px 10px;
  689.         text-align:right;
  690.         font-size: 13px;
  691.         }
  692.  
  693. .comment .fn, .comment .fn a:link {
  694.         font-size: 15px;
  695.         display: block;
  696.         }
  697.  
  698. .pingback p {
  699.         margin: 10px 0 10px 0;
  700.         }
  701.  
  702. .pingback a:link {
  703.         text-decoration: none;
  704.         }
  705.  
  706. #respond {
  707.         margin-top: 25px;
  708.         }
  709.  
  710. #comment-form, #respond a {
  711.         text-decoration: none;
  712.         }
  713.  
  714. #comment-form {
  715.         }
  716.  
  717. #commentform {
  718.         padding: 5px 20px 10px 15px;
  719.         margin-top: 10px;
  720.         color: #292929;
  721.         text-shadow: 0 1px 0 #fff;
  722.         font-size: 13px;
  723.         }
  724.  
  725. #comment-form span .required {
  726.         width: 20px;
  727.         }
  728.  
  729. #comment-form input, #respond input {
  730.         display: block;
  731.         background: #fff;
  732.         padding: 7px 10px;
  733.         margin: 5px 5px 5px 0;
  734.         width: 97%;
  735.         max-width: 300px;
  736.         color: #7F7F7F;
  737.         border: none;
  738.         border-top: 1px solid #ccc;
  739.         border-bottom: 1px solid #ccc;
  740.         background: #f0f0f0;
  741.         text-shadow: 0 1px 0 #fff;
  742.         }
  743.  
  744. #comment-form #submit, #respond #submit {
  745.         width: 250px;
  746.         height: 30px;
  747.         }
  748.        
  749. #comment-form input:focus, #respond input:focus {
  750.         color: #292929;
  751.         outline: none;
  752.         }
  753.  
  754. #comment-form #submit:hover, #respond #submit:hover, #comment-form #submit:focus, #respond #submit:focus {
  755.         outline: none;
  756.         color: #292929;
  757.         }
  758.  
  759. #comment-form textarea, #respond textarea {
  760.         width: 97%;
  761.         padding: 10px;
  762.         margin: 5px 5px 5px 0;
  763.         color: #7F7F7F;
  764.         border-top: 1px solid #ccc;
  765.         border-bottom: 1px solid #ccc;
  766.         background: #f0f0f0;
  767.         text-shadow: 0 1px 0 #fff;
  768.         }
  769.  
  770. #comment-form textarea:focus, #respond textarea:focus {
  771.         color: #292929;
  772.         outline: none;
  773.         }
  774.  
  775. #cancel-comment-reply-link {
  776.         font-size: 13px;
  777.         }
  778.  
  779. .comment-notes {
  780.         }
  781.  
  782. .comment-nav {
  783.         margin: 10px 15px 0 15px;
  784.         font-size: 13px;
  785.         }
  786.  
  787.  
  788.  
  789. /* images and videos */
  790.  
  791.  
  792. #content .wp-caption {
  793.         max-width: 100%!important;
  794.         margin-top: 25px!important;
  795.         margin-bottom: 25px!important;
  796.         }
  797.  
  798. img.centered, img.aligncenter {
  799.         display: block;
  800.         margin:0 auto;
  801.         overflow:hidden;
  802.         }
  803.        
  804. img.alignright {
  805.         display: inline;
  806.         }
  807.        
  808. img.alignleft {
  809.         display: inline;
  810.         }
  811.  
  812. #content img {
  813.         max-width:100%;
  814.         height: auto;
  815. }
  816.  
  817. #content img.aligncenter, #content .wp-caption.aligncenter {
  818.         margin: 0 auto;
  819.         margin-top: 25px;
  820.         margin-bottom: 25px;
  821. }
  822.  
  823. #content img.alignleft, #content .wp-caption.alignleft {
  824.         margin: 15px 20px 0 0;
  825. }
  826.  
  827. #content img.alignright, #content .wp-caption.alignright {
  828.         margin: 15px 0 0 20px;
  829. }
  830.  
  831.  
  832. #content img.alignnone {
  833.         margin: 20px 0;
  834. }
  835. #content .wp-caption.alignnone {
  836.         margin: 0 0 20px 0;
  837. }
  838.  
  839. #content .single-entry-content .wp-caption {
  840.         max-width: 100%;
  841.         text-align: center;
  842. }
  843.  
  844. .wp-caption-text {
  845.         font-size: 13px;
  846.         color: #808080;
  847.         text-align: center;
  848. }
  849.  
  850. #content object,
  851. #content embed,
  852. #content iframe {
  853.         max-width: 100%;
  854.         margin: 25px 0 25px 0;
  855.         display: block;
  856. }
  857.  
  858.  
  859.  
  860. /* other */
  861.  
  862.  
  863. .more-link {
  864.         }
  865.  
  866. .sticky {
  867.         background: #f0f0f0;
  868.         border-top: 1px solid #ccc;
  869.         border-bottom: 1px solid #ccc;
  870.         padding-top: 15px;
  871.         text-shadow: 0 1px 0 #fff;
  872.         }
  873.        
  874. .gallery-caption {
  875.         }
  876.  
  877. .bypostauthor {
  878.         }
  879.  
  880. .form-allowed-tags {
  881.         display: none;
  882.         }
  883.  
  884. .nocomments {
  885.         margin-left: 15px;
  886.         color: #7F7F7F;
  887.         }
  888.  
  889. .results {
  890.         background: #f0f0f0;
  891.         padding: 5px 15px 5px 15px;
  892.         margin: 0 0 10px 0;
  893.         }
  894.  
  895. .comment-awaiting-moderation {
  896.         font-size: 12px;
  897.         font-style: normal;
  898.         }
  899.        
  900. a, input, submit {
  901.         -webkit-transition: color 0.2s;
  902.         -moz-transition: color 0.2s;
  903.         -o-transition: color 0.2s;
  904.         -ms-transition: color 0.2s;
  905.         transition: color 0.2s;
  906.         }
  907.  
  908.  
  909.  
  910. /* media queries for responsive design */
  911.  
  912.  
  913. @media screen and (max-width: 850px) {
  914.         #wrapper #header h1 {
  915.                 padding: 10px 0 0 15px;                        
  916.         }
  917.        
  918.         #content {
  919.                 max-width: 643px;
  920.                 margin: 0 auto;
  921.                 }
  922.  
  923.         #sidebar {
  924.                 width: 100%;
  925.                 clear: left;
  926.                 margin-top: 40px;
  927.                 border-top: 1px solid #ccc;
  928.                 border-bottom: 1px solid #ccc;
  929.                 background: #f0f0f0;
  930.                 padding: 10px 10px 0 10px;
  931.                 text-shadow: 0 1px 0 #fff;
  932.                 }
  933.  
  934.         .widget {
  935.                 max-width: 300px;
  936.                 margin: 0 auto;
  937.                 margin-bottom: 20px;
  938.                 }
  939.                
  940.         .right {
  941.                 clear: left;
  942.                 text-align: left;
  943.                 }
  944.  
  945.         .left {
  946.                 clear: left;
  947.                 text-align: left;
  948.                 }
  949.  
  950.         .description {
  951.                 clear: left;
  952.                 margin: 15px 15px 10px;
  953.                 font-size: 14px!important;
  954.                 }
  955.  
  956.         .widget_search form {
  957.                 background: #fff;
  958.                 }
  959. }
  960.  
  961.  
  962.  
  963. @media screen and (min-width: 851px) {
  964.         #content {
  965.                 float: left;
  966.                 max-width: 67%;
  967.                 margin-left: 2%;
  968.                 }
  969.  
  970.         #wrapper #header h1 {
  971.                 padding: 10px 0 8px 15px;              
  972.         }
  973.                        
  974.         #sidebar {
  975.                 min-width: 180px;
  976.                 width: 25%;
  977.                 float: right;
  978.                 margin-top: 7px;
  979.                 margin-right: 2%;
  980.                 padding-right: 0px;
  981.                 padding-left: 0px;
  982.                 }
  983.  
  984.         #wrapper {
  985.                 max-width: 1050px;
  986.                 padding: 25px 25px 0 25px;
  987.                 }
  988.                
  989.         .right {
  990.                 float:right;
  991.                 width:40%;
  992.                 text-align:right;
  993.                 }
  994.  
  995.         .left {
  996.                 width: 40%;
  997.                 text-align: left;
  998.                 float: left;
  999.                 }
  1000.  
  1001.         .description {
  1002.                 float: right;
  1003.                 position: relative;
  1004.                 top: 1px;
  1005.                 right: 15px;
  1006.                 }
  1007.        
  1008.         .widget_search form {
  1009.                 background: #f0f0f0;
  1010.                 }
  1011. }
  1012.  
  1013.  
  1014.  
  1015. @media screen and (min-width: 501px) {
  1016.         #mainnav {
  1017.                 padding-bottom: 14px;
  1018.                 }
  1019.  
  1020.         #header {
  1021.                 border-bottom: 1px solid #CCCCCC;
  1022.                 }
  1023.  
  1024.         .indexexzerpt {
  1025.                 margin-left: 180px;
  1026.                 }
  1027.  
  1028.         .comment-content {
  1029.                 margin: 15px 5px 0 0;
  1030.                 }
  1031.  
  1032.         .pingback p {
  1033.                 margin-left: 75px;
  1034.                 }
  1035. }
  1036.  
  1037.  
  1038.  
  1039. @media screen and (max-width: 500px) {
  1040.  
  1041.         #mainnav ul {
  1042.                 min-height: 34px;
  1043.                 border-bottom: none;
  1044.                 }
  1045.  
  1046.         #mainnav ul li {
  1047.                 width: 50%;
  1048.                 height: 34px;
  1049.                 overflow: hidden;
  1050.                 }
  1051.  
  1052.         #mainnav ul li a {
  1053.                 line-height: 30px;
  1054.                 }
  1055.  
  1056.         #main {
  1057.                 padding-top: 20px;
  1058.                 }
  1059.                                
  1060.         #header {
  1061.                 border-bottom: none;
  1062.                 }
  1063.  
  1064.         #mainnav {
  1065.                 border-bottom: none;
  1066.                 }
  1067.  
  1068.         .thumbnail {
  1069.                 display: none;
  1070.                 }
  1071.  
  1072.         .avatar {
  1073.                 width: 40px;
  1074.                 }
  1075.  
  1076.         ul.children {
  1077.                 padding-left: 15px;
  1078.                 }
  1079.                
  1080.         .comment-content {
  1081.                 margin-top: 5px;
  1082.                 }
  1083. }
clone this paste RAW Paste Data