--- /dev/null
+/**\r
+ * TestCMS' default theme\r
+ */\r
+ \r
+::-webkit-selection {\r
+ background: #ffc;\r
+ color: #222;\r
+}\r
+::-moz-selection {\r
+ background: #ffc;\r
+ color: #222;\r
+}\r
+::selection {\r
+ background: #ffc;\r
+ color: #222;\r
+}\r
+\r
+html {\r
+ min-height: 100%;\r
+}\r
+\r
+body, input, textarea, button {\r
+ color: #777;\r
+ font: 16px/26px "Helvetica Neue", sans-serif;\r
+}\r
+\r
+h1 {\r
+ font-size: 40px;\r
+ line-height: 48px;\r
+ font-weight: bold;\r
+ \r
+ color: #333;\r
+\r
+ margin-bottom: 30px;\r
+}\r
+\r
+a, a * {\r
+ -webkit-transition: color .25s;\r
+ -moz-transition: color .25s;\r
+ -ms-transition: color .25s;\r
+ -o-transition: color .25s;\r
+ transition: color .25s;\r
+}\r
+ a:active {\r
+ -webkit-transform: translateY(1px);\r
+ }\r
+ \r
+.content a, .comments a {\r
+ color: #2082ab;\r
+}\r
+ .content a:hover, .comments a:hover {\r
+ color: #222;\r
+ }\r
+\r
+.wrap, .content {\r
+ width: 900px;\r
+ margin: 0 auto;\r
+ \r
+ text-align: left;\r
+}\r
+ .content { \r
+ width: 730px;\r
+ margin: 60px auto 80px;\r
+ \r
+ padding-left: 170px;\r
+ }\r
+ .content img, .content .items {\r
+ margin-left: -170px;\r
+ \r
+ width: 900px;\r
+ height: auto;\r
+ }\r
+ .content p {\r
+ padding-bottom: 15px;\r
+ }\r
+\r
+form#search {\r
+ position: relative;\r
+ background: #ddd;\r
+ \r
+ padding: 10px 0;\r
+}\r
+ form#search input {\r
+ padding: 8px 12px;\r
+ color: #333;\r
+ \r
+ border: none;\r
+ width: 900px;\r
+ }\r
+ \r
+button {\r
+ background: #2082ab;\r
+\r
+ color: #fff;\r
+ font-weight: bold;\r
+\r
+ border: none;\r
+ \r
+ padding: 8px 15px;\r
+ \r
+ -webkit-border-radius: 3px;\r
+ -moz-border-radius: 3px;\r
+ border-radius: 3px;\r
+}\r
+\r
+header#top {\r
+ background: #f3f3f3;\r
+ padding: 50px 0 20px;\r
+}\r
+ header#top div {\r
+ position: relative;\r
+ }\r
+ header#top a#logo {\r
+ color: #444;\r
+ font-size: 18px;\r
+ line-height: 21px;\r
+ \r
+ text-decoration: none;\r
+ \r
+ display: block;\r
+ width: 130px;\r
+ \r
+ padding-bottom: 4px;\r
+ }\r
+ header#top a#logo:hover, header#top nav li.active a, header#top nav li.active a:hover {\r
+ color: #2082ab;\r
+ }\r
+ header#top nav {\r
+ position: absolute;\r
+ left: 170px;\r
+ bottom: 0;\r
+ }\r
+ header#top nav li {\r
+ float: left;\r
+ position: relative;\r
+ \r
+ margin-right: 50px;\r
+ }\r
+ header#top nav li.active:after {\r
+ content: '';\r
+ display: block;\r
+\r
+ position: absolute;\r
+ left: 50%;\r
+ bottom: -20px;\r
+ \r
+ width: 0;\r
+ height: 0;\r
+ \r
+ border-left: 8px solid transparent;\r
+ border-right: 8px solid transparent;\r
+ border-bottom: 8px solid #fff;\r
+ \r
+ margin-left: -8px;\r
+ }\r
+ header#top nav li a {\r
+ color: #888;\r
+ \r
+ font-weight: bold;\r
+ font-size: 14px;\r
+ \r
+ text-decoration: none;\r
+ \r
+ display: block;\r
+ }\r
+ header#top nav li a:hover {\r
+ color: #444;\r
+ }\r
+ header#top img#search {\r
+ cursor: pointer;\r
+ \r
+ position: absolute;\r
+ right: 0;\r
+ bottom: 0;\r
+ }\r
+ \r
+ul.items {\r
+ list-style: none;\r
+ \r
+ padding: 60px 0 80px;\r
+}\r
+ ul.items li {\r
+ clear: both;\r
+ overflow: hidden;\r
+ \r
+ padding-bottom: 20px;\r
+ }\r
+ ul.items li a {\r
+ display: block;\r
+ text-decoration: none;\r
+ }\r
+ ul.items li a time {\r
+ display: block;\r
+ float: left;\r
+ \r
+ color: #aaa;\r
+ font-size: 13px;\r
+ line-height: 34px;\r
+ \r
+ width: 130px;\r
+ padding-right: 40px;\r
+ text-align: right;\r
+ }\r
+ ul.items li a:hover time {\r
+ color: #7ac1df;\r
+ }\r
+ ul.items li a h2 {\r
+ font-size: 28px;\r
+ line-height: 30px;\r
+ \r
+ color: #555;\r
+ \r
+ display: block;\r
+ float: left;\r
+ \r
+ width: 730px;\r
+ }\r
+ ul.items li a:hover h2 {\r
+ color: #2082ab;\r
+ }\r
+ \r
+section.comments {\r
+ width: 900px;\r
+ margin: 0 auto 50px;\r
+ padding-top: 30px;\r
+ \r
+ text-align: left;\r
+ \r
+ border-top: 1px solid #eee;\r
+}\r
+ section.comments h1, section.comments form.commentform legend {\r
+ font-weight: bold;\r
+ font-size: 22px;\r
+ \r
+ color: #555;\r
+ }\r
+ section.comments h1 a {\r
+ float: right;\r
+ font-size: 15px;\r
+ }\r
+ section.comments ul {\r
+ list-style: none;\r
+ overflow: hidden;\r
+ \r
+ padding-left: 170px;\r
+ padding-bottom: 30px;\r
+ }\r
+ section.comments ul li {\r
+ float: left;\r
+ width: 670px;\r
+ \r
+ margin-bottom: 30px;\r
+ padding: 30px;\r
+ \r
+ background: #fafafa;\r
+ }\r
+ section.comments h2 {\r
+ color: #555;\r
+ font-size: 18px;\r
+ line-height: 30px;\r
+ \r
+ float: left;\r
+ width: 250px;\r
+ }\r
+ section.comments time {\r
+ float: right;\r
+ \r
+ font: italic 13px/30px Georgia, serif;\r
+ }\r
+ section.comments div.content {\r
+ clear: both;\r
+ width: auto;\r
+\r
+ margin: 0;\r
+ padding: 20px 0 0;\r
+ \r
+ font-size: 15px;\r
+ line-height: 25px;\r
+ }\r
+ \r
+ section.comments form.commentform {\r
+ clear: both;\r
+ padding-left: 170px;\r
+ padding-top: 40px;\r
+ \r
+ border-top: 1px solid #eee;\r
+ }\r
+ section.comments form.commentform p.notification {\r
+ clear: both;\r
+ float: none;\r
+ padding-bottom: 25px;\r
+ \r
+ font-weight: bold; \r
+ }\r
+ section.comments form.commentform p.notification.error {\r
+ color: #c22a0a;\r
+ }\r
+ section.comments form.commentform legend {\r
+ margin-left: -170px;\r
+ margin-bottom: 20px;\r
+ }\r
+ section.comments form.commentform p {\r
+ float: left;\r
+ width: 365px;\r
+ \r
+ position: relative;\r
+ }\r
+ section.comments form.commentform p.email {\r
+ position: relative;\r
+ right: -15px;\r
+ }\r
+ section.comments form.commentform p.textarea {\r
+ width: 630px;\r
+ }\r
+ section.comments form.commentform p em {\r
+ font: italic 13px Georgia, serif;\r
+ \r
+ position: absolute;\r
+ top: 5px;\r
+ right: 15px;\r
+ \r
+ color: #aaa;\r
+ }\r
+ section.comments form.commentform label {\r
+ display: block;\r
+ font-size: 15px;\r
+ \r
+ padding-bottom: 8px;\r
+ }\r
+ section.comments form.commentform input, section.comments form.commentform textarea {\r
+ width: 320px;\r
+ padding: 8px 14px;\r
+ margin-bottom: 20px;\r
+ \r
+ border: 1px solid #bbb;\r
+ }\r
+ section.comments form.commentform textarea {\r
+ width: 700px;\r
+ min-height: 150px;\r
+ max-height: 400px;\r
+ resize: vertical;\r
+ }\r
+ section.comments form.commentform button {\r
+ margin-bottom: 50px;\r
+ }\r
+ \r
+section.footnote {\r
+ clear: both;\r
+ width: 730px;\r
+\r
+ font: italic 12px/19px Georgia, serif;\r
+ text-align: left;\r
+ color: #aaa;\r
+ \r
+ margin: 0 auto 60px;\r
+ padding-left: 170px;\r
+}\r
+ \r
+footer#bottom {\r
+ width: 130px;\r
+ height: 80px;\r
+ \r
+ border-top: 1px solid #f5f5f5;\r
+ padding-top: 20px;\r
+ \r
+ text-align: left;\r
+ position: relative;\r
+}\r
+ footer#bottom small {\r
+ width: 730px;\r
+ display: block;\r
+ float: left;\r
+ \r
+ font-size: 13px;\r
+ color: #999;\r
+ }\r
+ footer#bottom small a {\r
+ color: #666;\r
+ }\r
+ footer#bottom small a:hover {\r
+ color: #333;\r
+ }\r
+ footer#bottom ul {\r
+ clear: both;\r
+ list-style: none;\r
+ \r
+ position: relative;\r
+ top: -8px;\r
+ \r
+ width: 730px;\r
+ }\r
+ footer#bottom ul li {\r
+ display: inline-block;\r
+ float: left;\r
+ }\r
+ footer#bottom ul a {\r
+ color: #aaa;\r
+ font-size: 11px;\r
+ line-height: 11px;\r
+ \r
+ padding-right: 15px;\r
+ }\r
+ footer#bottom ul a:hover {\r
+ color: #777;\r
+ }\r
+ footer#bottom a#attribution {\r
+ display: block;\r
+ \r
+ position: absolute;\r
+ left: 876px;\r
+ top: 18px;\r
+ \r
+ width: 24px;\r
+ height: 22px;\r
+ \r
+ background: url('../img/attribution.gif');\r
+ text-indent: -999em;\r
+ \r
+ opacity: .5;\r
+ \r
+ -webkit-transition: opacity .25s;\r
+ -moz-transition: opacity .25s;\r
+ -ms-transition: opacity .25s;\r
+ -o-transition: opacity .25s;\r
+ transition: opacity .25s;\r
+ }\r
+ footer#bottom a#attribution:hover {\r
+ opacity: 1;\r
+ }\r
+ \r
+@media only screen and (max-width: 900px), only screen and (max-device-width: 480px) {\r
+\r
+ .wrap, .content {\r
+ width: 90%;\r
+ margin: 0 5%;\r
+ padding-left: 0;\r
+ }\r
+ .content h1 {\r
+ padding-top: 50px;\r
+ }\r
+ \r
+ form#search {\r
+ padding: 10px 5%;\r
+ }\r
+ form#search input {\r
+ width: 100%;\r
+ }\r
+\r
+ header#top {\r
+ overflow: hidden;\r
+ padding-top: 40px;\r
+ }\r
+ header#top a#logo {\r
+ width: 100%;\r
+ padding-bottom: 15px;\r
+ }\r
+ header#top nav {\r
+ position: static;\r
+ }\r
+ header#top nav li {\r
+ margin-right: 30px;\r
+ }\r
+ header#top img#search {\r
+ bottom: -20px;\r
+ }\r
+ \r
+ ul.items {\r
+ padding-bottom: 20px;\r
+ }\r
+ ul.items li a {\r
+ overflow: hidden;\r
+ padding-bottom: 20px;\r
+ }\r
+ ul.items li a time, ul.items li a h2 {\r
+ float: none;\r
+ clear: both;\r
+ \r
+ width: 100%;\r
+ }\r
+ ul.items li a time {\r
+ line-height: 22px;\r
+ text-align: left;\r
+ }\r
+ \r
+ section.comments {\r
+ margin-top: 40px;\r
+ width: auto;\r
+ }\r
+ section.comments h1 {\r
+ padding: 0 20px;\r
+ line-height: 20px;\r
+ }\r
+ section.comments ul {\r
+ padding: 0;\r
+ }\r
+ section.comments ul li {\r
+ width: 90%;\r
+ padding: 20px 5%;\r
+ margin-bottom: 0;\r
+ border-bottom: 1px solid #ddd;\r
+ \r
+ position: relative;\r
+ }\r
+ section.comments ul li:last-child {\r
+ border-bottom: none;\r
+ }\r
+ section.comments ul li time {\r
+ position: absolute;\r
+ right: 20px;\r
+ top: 20px;\r
+ }\r
+ section.comments div.content {\r
+ width: auto;\r
+ padding-top: 0;\r
+ }\r
+ section.comments form.commentform {\r
+ padding: 20px 20px;\r
+ position: relative;\r
+ }\r
+ section.comments form.commentform legend {\r
+ margin-left: 0;\r
+ }\r
+ section.comments form.commentform p, section.comments form.commentform p.textarea {\r
+ float: none; \r
+ width: 100%;\r
+ }\r
+ section.comments form.commentform p.email {\r
+ right: 0;\r
+ }\r
+ \r
+ section.comments form.commentform input, section.comments form.commentform textarea {\r
+ width: 93%;\r
+ }\r
+ \r
+ section.footnote {\r
+ width: 90%;\r
+\r
+ margin: 30px 5%;\r
+ padding: 0;\r
+ }\r
+ \r
+ footer#bottom, footer#bottom small, footer#bottom ul {\r
+ width: 100%;\r
+ }\r
+ footer#bottom a#attribution {\r
+ left: auto;\r
+ right: 0;\r
+ \r
+ top: 30px;\r
+ }\r
+}
\ No newline at end of file