$main-color : #000000; $font1 : "Trebuchet MS", Arial, sans-serif; $font2:"Trebuchet MS", Arial, sans-serif; $font_title : "Trebuchet MS", Arial, sans-serif; body{ line-height:1.3em; } html, body, section, nav, article, aside, h1, h2, h3, h4, h5, h6, hgroup, header, footer, address, p, hr, pre, blockquote, ol, ul, li, dl, dt, dd, figure, figcaption, div, a, em, strong, small, s, cite, q, dfn, abbr, time, code, var, samp, kbd, sub, sup, i, b, mark, span, br, ins, del, img, iframe, embed, object, video audio, canvas, map, area, table, caption, colgroup, tbody, thead, tfoot, tr, td, th, form, fieldset, legend, label, input, button, select, textarea, details, summary, command, menu { font-size: 100%; font-style: normal; text-align: left; text-decoration: none; vertical-align: baseline; margin: 0; outline: 0; border: 0 none; padding: 0; } body { color: ($main-color*40); font: 0.9em / 1 $font1; -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility; } pre, select, input, textarea, button { color: ($main-color*40); font: 300 1em / 1 $font1; -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility; } h1 { color: ($main-color*30); font: 300 2.5em / 1 $font_title; letter-spacing: 0.05em; word-wrap: break-word; margin: 0.8em 0 0.6em; } h2 { font: 300 1.8em / 1 $font_title; letter-spacing: 0; margin: 1.3333em 0 0; padding: 0.3333em 0; } h3 { color: ($main-color*30); font: 400 1.125em / 1.333 $font_title; margin: 1em 0 0; border-top: 0 none; } h4 { color: ($main-color*40); font: 600 1em / 1 $font2; margin: 1.5em 0 0; } h5 { color: ($main-color*50); font: 600 0.875em / 1.143 $font_title; text-transform: uppercase; letter-spacing: 0.1429em; margin: 1.7143em 0 0; } h6 { color: ($main-color*60); font: 600 0.875em / 1.143 $font_title; text-transform: uppercase; letter-spacing: 0.1429em; margin: 1.7143em 0 0; } p, pre, blockquote, ul, ol, dl, figure, figcaption, table, fieldset { font-size: 1em; line-height: 1.5; margin: 0.5em 0; } hr { } pre { margin: 0.5em 0 0.5em 1.5em; white-space: pre; white-space: pre-wrap; white-space: pre-line; word-wrap: break-word; } blockquote { color: ($main-color*60); font: 300 0.938em / 1.6 $font2; border-left: 4px solid ($main-color*235); margin: 1.0667em 0 1.6em; padding: 0 1.6em 0 1.334em; } blockquote p { line-height: 1.6; margin: 0.5333em 0; } ul li { list-style-type: square; margin-left: 1.5em; } ul li ul li { list-style-type: circle; } ol li { list-style-type: decimal; margin-left: 1.5em; } li { ul li, ol li { margin: 0 0 0 1.5em; } } dt { font: 600 1em / 1.5 $font2; } dd { padding: 0 1.5em 0; } dd>* { margin-top: 0; } p+figure { margin: 1em 0 2em; } figure{ margin: 0 0 2em 0; img{ max-width:100%; } } figure br { clear: both; } figcaption * { color: ($main-color*60); font: 300 0.875em / 1.143 $font2; margin: 0.5714em 0; clear: left; } figcaption * * { font-size: 1em; line-height: 1.1429; } figcaption h4 { color: ($main-color*40); font: 600 0.875em / 1.143 $font2; clear: left; } a { color: #17b; &:hover, &:active { color: #39e; background-color: none; outline: none; } &:link, &:visited, &:hover { -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -o-transition: all 0.3s ease; transition: all 0.3s ease; } &:active { color: #b41; -webkit-transition: none; -moz-transition: none; -o-transition: none; transition: none; } } em { font: italic 300 1em / 90% $font1; a { font: italic 300 1em / 90% $font1 } } i, var, samp, cite, cite a { font: italic 300 1em / 90% $font1 } strong, b { color: ($main-color*30); font: normal 600 1em / 90% $font2; } small { font-size: 0.8125em; line-height: 1.2308; display: inline-block; opacity: 0.9; } abbr { font-size: 0.875em; line-height: 90%; letter-spacing: 0.0357em; opacity: 0.9; } h1 abbr, h2 abbr, h3 abbr, strong abbr { font-weight: 300; line-height: 10%; opacity: 1; } abbr[title]:hover, dfn[title] { border-bottom: 1px dotted rgba(0, 0, 0, 0.3); cursor: help; } code { font: 0.875em / 90% "Monaco", "Courier New", Courier, monospace; color: #abd37f; &.comment { color: #888; } } kbd { color: ($main-color*60); font: normal 300 0.875em / 90% $font2; background-color: #fcfcfc; margin: 0 0.25em; border: 1px solid #e6e6e6; border-radius: 4px; padding: 0.1429em 0.4286em; } sub { font-size: smaller; line-height: 90%; vertical-align: sub; } sup { font-size: smaller; line-height: 90%; vertical-align: super; } mark { background-color: #fff9dd; line-height: 90%; padding: 0 0.125em; } ins { background-color: #fff9dd; line-height: 90%; padding: 0 0.125em; background-color: #f0f0f0; } del, s { line-height: 90%; text-decoration: line-through; } table { color: ($main-color*50); font: 300 0.938em / 1.6 $font2; font-variant-numeric: lining-nums tabular-nums; margin: 1.1429em 0; border-collapse: collapse; border-spacing: 0; } caption { color: ($main-color*60); font: 300 0.933em / 1.143 $font2; caption-side: bottom; padding: 1.1429em 0 0.5714em; } td { text-align: left; border-bottom: 1px solid #eee; padding: 0.2667em 1.0667em 0.2em 0; vertical-align: top; } th { text-align: left; border-bottom: 1px solid #eee; padding: 0.2667em 1.0667em 0.2em 0; color: ($main-color*60); font: 600 1em / 1.6 $font2; border-bottom-color: #ccc; } .message{ border: 4px solid black; border-radius:10px; padding:5px; margin:20px; -webkit-box-shadow: rgba(0,0,0,0.5) 1px 1px 40px; -moz-box-shadow: rgba(0,0,0,0.5) 1px 1px 40px; box-shadow: rgba(0,0,0,0.5) 1px 1px 40px; } .alert{ border-color: rgb(242,237,161); background: rgba(254,252,219,0.8); } .notice{ border-color:rgb(205,230,245); background:rgba(236,248,254,0.8); } #flash{ position:fixed; bottom:0px; width:100%; } a img{ border:0px; } table{ border-collapse:collapse; width:100%; } h1, h2, h3, h4, h5, h6 { margin:0px; padding:0px; } a{ color : #3C74A8; text-decoration:none; } a:hover{ color:#3F94EB; }