body { background: #516062; } /*font reset*/ body, input.text, select, textarea, div, p, td, input.button, table.tblSorter, #main_table tfoot th, #main_table tfoot th div { font: normal 16px/22px "Lucida Grande", Lucida, Verdana, sans-serif; } /*main text color*/ body, table.tblSorter tbody td { color: #191e1f; text-shadow: 0 1px 0 rgba(255,255,255,.1); } #wrap { max-width: 920px; width: auto; border-radius: 0; border: none; background: none; padding: 2%; } .sub_wrap { width: 100%; } #new_url, table.tblSorter, table.tblSorter tbody td, table.tblSorter thead tr th, table.tblSorter tfoot tr th, table.tblSorter th.header, table.tblSorter tfoot tr { background: none; } table.tblSorter tbody tr:hover td, .sub_wrap span, tt, code, table.tblSorter thead tr .headerSortDown, table.tblSorter thead tr .headerSortUp, tr.edit-row td, a.bookmarklet { background: rgba(0,0,0,.2) !important; } tr.plugin.inactive { opacity: .5; } #new_url, table.tblSorter thead tr th, table.tblSorter tfoot tr th, table.tblSorter th.header { border: none; } a, a:link, a:active, a:visited { color: #28cbc3; text-decoration: none; text-shadow: 0 1px 0 #000; } a:hover { color: #fff; } #wrap > h1:first-child { display: none; } ::-moz-selection { background: #000; color: #fff; } ::selection { background: #000; color: #fff } /* ============================================================== */ /* Forms & Inputs */ /* ============================================================== */ input.text, select, textarea { border: 1px solid #2c3637; padding: .5em; outline: none; background: rgba(0, 0, 0, .2); -webkit-box-shadow: 0 1px 0 rgba(255, 255, 255, .2); -moz-box-shadow: 0 1px 0 rgba(255, 255, 255, .2); box-shadow: 0 1px 0 rgba(255, 255, 255, .2); color: #fff; } input.text:focus, textarea:focus { border: 1px solid #28cbc3; outline: none; -webkit-box-shadow: 0 0 8px #28cbc3 !important; -moz-box-shadow: 0 0 8px #28cbc3 !important; box-shadow: 0 0 8px #28cbc3 !important; margin: 1px; background: rgba(0, 0, 0, .4); } ::-webkit-input-placeholder, ::-moz-input-placeholder { color: rgba(255,255,255,.2); font-weight: normal; } input.button { margin: .5em 0; padding: .6em 2em !important; display: inline-block; background-color: #28cbc3; background-image: -moz-linear-gradient(top, rgba(0,0,0,0) 0%, rgba(0,0,0,0.4) 100%); background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(0,0,0,0)), color-stop(100%,rgba(0,0,0,0.4))); background-image: -webkit-linear-gradient(top, rgba(0,0,0,0) 0%,rgba(0,0,0,0.4) 100%); background-image: -o-linear-gradient(top, rgba(0,0,0,0) 0%,rgba(0,0,0,0.4) 100%); background-image: -ms-linear-gradient(top, rgba(0,0,0,0) 0%,rgba(0,0,0,0.4) 100%); background-image: linear-gradient(top, rgba(0,0,0,0) 0%,rgba(0,0,0,0.4) 100%); color: #082a28; -webkit-box-shadow: 0 1px 0 rgba(255,255,255,.2), inset 0 1px 0 rgba(255,255,255,.6); -moz-box-shadow: 0 1px 0 rgba(255,255,255,.2), inset 0 1px 0 rgba(255,255,255,.6); box-shadow: 0 1px 0 rgba(255,255,255,.2), inset 0 1px 0 rgba(255,255,255,.6); border: 1px solid #0b3836; border-top-color: #000; text-shadow: 0 1px 0 rgba(255,255,255,.4); border-radius: 5px; font-size: .9em; font-weight: bold; } input.button:hover { background-color: #2adbd4; } .edit-row input.text { margin-bottom: 1em; } /* ============================================================== */ /* Admin Menu */ /* ============================================================== */ ul#admin_menu { min-height: 10px; position: relative; border-top: 1px dashed rgba(255,255,255,.1); border-bottom: 1px dashed rgba(255,255,255,.1); margin-bottom: 2em; position: relative; } ul#admin_menu:after { content: ""; width: 100%; height: 1px; position: absolute; left: 0; bottom: 0; border-bottom: 1px dashed #2f393b; } ul#admin_menu li { display: inline; } ul#admin_menu a { padding: .5em 2em; display: inline-block; } ul#admin_menu a:hover { background: rgba(255,255,255,.1); text-decoration: none; } ul#admin_menu li, ul#admin_menu a { text-shadow: 0 1px 0 #000; } ul#admin_menu li#admin_menu_logout_link { position: absolute; top: -100%; right: 0; color: #191e1f; text-shadow: 0 1px 0 rgba(255,255,255,.1); font-size: .8em; } ul#admin_menu li#admin_menu_logout_link a { padding: .5em; } /* ============================================================== */ /* New URL */ /* ============================================================== */ #new_url { margin-bottom: 2em; background-color: rgba(0,0,0,.1); background-image: -moz-linear-gradient(-45deg, rgba(255,255,255,0.1) 0%, rgba(255,255,255,0.1) 40%, rgba(255,255,255,0) 41%, rgba(255,255,255,0) 100%); background-image: -moz-linear-gradient(-45deg, rgba(255,255,255,0.03) 0%, rgba(255,255,255,0.03) 40%, rgba(255,255,255,0) 41%, rgba(255,255,255,0) 100%); background-image: -webkit-gradient(linear, left top, right bottom, color-stop(0%,rgba(255,255,255,0.03)), color-stop(40%,rgba(255,255,255,0.03)), color-stop(41%,rgba(255,255,255,0)), color-stop(100%,rgba(255,255,255,0))); background-image: -webkit-linear-gradient(-45deg, rgba(255,255,255,0.03) 0%,rgba(255,255,255,0.03) 40%,rgba(255,255,255,0) 41%,rgba(255,255,255,0) 100%); background-image: -o-linear-gradient(-45deg, rgba(255,255,255,0.03) 0%,rgba(255,255,255,0.03) 40%,rgba(255,255,255,0) 41%,rgba(255,255,255,0) 100%); background-image: -ms-linear-gradient(-45deg, rgba(255,255,255,0.03) 0%,rgba(255,255,255,0.03) 40%,rgba(255,255,255,0) 41%,rgba(255,255,255,0) 100%); background-image: linear-gradient(-45deg, rgba(255,255,255,0.03) 0%,rgba(255,255,255,0.03) 40%,rgba(255,255,255,0) 41%,rgba(255,255,255,0) 100%); border-radius: 5px; border: 1px solid #354143; box-shadow: 0 2px 5px #354143, inset 0 1px 0 rgba(255,255,255,.2); margin-top: 2em; } #new_url div { background: none; padding: 0; text-align: left; } #new_url_form { padding: 1em; } #new_url_form label { display: block; } #new_url div { position: relative; } #new_url_form p { margin-top: 0; margin-bottom: .5em; } #new_url_form input { border-color: #2c3637; font-weight: bold; } input#add-url { width: 98%; } input#add-keyword { width: 4em; position: absolute; bottom: .4em; right: 0; } #new_url_form input.button { clear: both; } /* ============================================================== */ /* Main Table */ /* ============================================================== */ table { border-spacing: 0; } table.tblSorter thead th.header, table.tblSorter thead th#main_table_head_actions { border-bottom: 1px solid #333; } table.tblSorter tbody td { padding: 1.3em .3em; border-bottom: 1px dashed #333; border-top: 1px dashed rgba(255,255,255,.2); margin: 0; } table.tblSorter tbody tr:first-child td { border-top: 1px solid rgba(255,255,255,.2); } table.tblSorter tbody tr:last-child td { border-bottom: 1px dashed #333; } table.tblSorter td.timestamp, table.tblSorter td.ip { font-size: .8em; color: rgba(0,0,0,.5); } table.tblSorter td.timestamp:hover, table.tblSorter td.ip:hover { color: #000; } table.tblSorter td.clicks { font-size: 2em; font-family: Georgia, serif; font-style: italic; padding: .3em; } #filter_form { margin-top: 4em; opacity: .2; } #filter_form:hover { opacity: 1; } #main_table tfoot th div { font-size: .8em; } /* ============================================================== */ /* Global Footer */ /* ============================================================== */ #footer { display: none; } /* ============================================================== */ /* Animations */ /* ============================================================== */ a, input, td, #public footer { -webkit-transition: all .2s ease-in-out; -moz-transition: all .2s ease-in-out; -o-transition: all .2s ease-in-out; -ms-transition: all .2s ease-in-out; transition: all .2s ease-in-out; } /* ============================================================== */ /* Login */ /* ============================================================== */ #login { width: auto; max-width: 320px; margin: 15% auto 0px auto; } #login:before { content: "krt.mn"; font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; font-weight: 100; font-size: 3em; border-bottom: 1px dashed #2f393b; width: 100%; padding-bottom: .5em; display: block; color: #a8b5b9; text-shadow: 0 -1px 0 #2f393b; } #login .text { width: 94%; } #login p { text-align: left !important; } #login input.button { display: block; width: 100%; margin-top: 1.5em; } #login p.error { text-align: center !important; padding: 1em; border-radius: 5px; background: rgba(255, 238, 238, .3); color: #4e1b1c; } /* ============================================================== */ /* Public Page */ /* ============================================================== */ body#public { text-align: center; max-width: 600px; margin: 0 auto; padding: 5%; } #public h1 { font-weight: 100; font-style: normal; margin-bottom: 0; line-height: 1em; color: #a8b5b9; text-shadow: 0 -1px 0 #2f393b; } #public header h1 { font-size: 6em; font-family: 'Lato', sans-serif; font-weight: 100; font-style: normal; margin-bottom: 30px; } #public article, #public footer { position: relative; border-top: 1px dashed rgba(255,255,255,.2); } #public article:before, #public footer:before, ul#admin_menu:before { content: ""; width: 100%; height: 1px; position: absolute; left: 0; top: -2px; border-top: 1px dashed #2f393b; } #public footer { padding-top: 1em; font-size: .8em; opacity: .5; } #public footer:hover { opacity: 1; } #public article p { margin: 1em 0; } @media only screen and (max-width: 600px){ table, table tbody, table tr, table td, table a { position: relative; display: block; width: auto !important; margin: 0; padding: 0; background-color: transparent ; } table tr { position: relative; padding: 1em 0; } tbody td { padding-top: 0 !important; padding-bottom: 0 !important; } thead, tfoot, table br { display: none; } table.tblSorter tbody tr:hover td, .sub_wrap span, tt, code, table.tblSorter thead tr .headerSortDown, table.tblSorter thead tr .headerSortUp, tr.edit-row td, a.bookmarklet { background: transparent !important; } table.tblSorter tbody td, table.tblSorter tbody tr:first-child td, table.tblSorter tbody tr:last-child td { border: none; } table.tblSorter tbody tr { border-bottom: 1px dashed #333; border-top: 1px dashed rgba(255,255,255,.2); } table.tblSorter td.keyword a { display: inline-block; background: rgba(0, 0, 0, .1); padding: .3em 1em; margin-bottom: .5em; border-radius: 5px; border-bottom: 1px solid rgba(255,255,255,.1); } table.tblSorter td.timestamp, table.tblSorter td.ip { display: inline; } table.tblSorter td.clicks { position: absolute; top: 1em; right: 0; } table.tblSorter td.actions { overflow: hidden; } td.actions .button { width: 32px !important; height: 32px; display: inline-block; } input#add-url { width: 94%; } ul#admin_menu a { padding: .5em; display: inline-block; font-size: .8em; } ul#admin_menu li#admin_menu_logout_link { position: absolute; top: -2.2em; right: 0; color: #191e1f; text-shadow: 0 1px 0 rgba(255,255,255,.1); font-size: .8em; } li#admin_menu_help_link { display: none !important; } }