1
0
Fork 0
mirror of https://github.com/Oreolek/ifhub.club.git synced 2024-07-09 01:44:25 +03:00
ifhub.club/templates/skin/new-jquery/css/grid.css

177 lines
10 KiB
CSS

/* Blocks
-------------------- */
#container { margin: 0 auto 20px; max-width: 1600px; min-width: 960px; }
#header { min-width: 960px; height: 80px; margin: 0 auto; max-width: 1570px; position: relative; overflow: hidden; zoom: 1; padding: 0 15px; background: #222; }
#wrapper { overflow: hidden; zoom: 1; padding: 0 20px 20px; }
#wrapper.show-update-button { padding-right: 55px; }
#wrapper.white-back { background: #fff; margin: 0 20px 30px 20px;}
#wrapper.white-back #content { }
#content { width: 66.5%; float: left; margin-right: 1.5%; background: #fff; }
#content-inner { padding: 20px; }
#sidebar { width: 32%; float: left; }
#footer { overflow: hidden; zoom: 1; margin: 0 0 20px; color: #777; border-top: 1px solid #DADADA; }
#footer-inner { border-top: 1px solid #fff; padding: 15px 20px 10px; }
/* Header
-------------------- */
#header a.logo { font-size: 20px; float: left; padding: 30px 40px 0 5px; text-decoration: none; }
#header a.logo span { color: #77D115; }
#header a { color: #fff; }
#header .pages { overflow: hidden; zoom: 1; padding: 32px 0 0; list-style: none; float: left; font-size: 15px; }
#header .pages li { float: left; margin-right: 10px; position: relative; }
#header .pages li a { color: #BEBEBE; text-decoration: underline; padding: 2px 5px 3px; }
#header .pages li.active a { color: #FFFFFF; font-size: 24px; line-height: 24px; text-decoration: none; }
#header .pages li.active { top: -5px; }
#header .profile { color: #777; text-align: right; position: absolute; top: 15px; right: 23px; padding-right: 60px; font-size: 11px; color: #AFAFAF; line-height: 12px; }
#header .profile li { margin-bottom: 6px; }
#header .profile .message { background: url(../images/icons.gif) no-repeat scroll right 3px; margin-right: 5px; padding-right: 18px; zoom: 1; text-decoration: none; }
#header .profile .message.new { background: url(../images/icons.gif) no-repeat right -17px; color: #ffea00; }
#header .profile .create { color: #f79cf3; }
#header .profile .logout { color: #AFAFAF; text-decoration: none; }
#header .profile .avatar { position: absolute; top: 0; right: 0; }
#header .profile a:hover { color: #ddd; }
#header .auth { position: absolute; top: 28px; right: 33px; color: #ddd; }
#header .auth .login-link { font-size: 18px; }
/* Navigation
-------------------- */
#nav { margin: 0 auto 15px; max-width: 1600px; min-width: 960px; background: url(../images/nav.png) no-repeat; position: relative; }
#nav-inner { height: 92px; padding: 0 0 0 0; margin-left: 20px; background: url(../images/nav.png) 100% 0 no-repeat; overflow: hidden; zoom: 1; }
/* Menu */
#nav .menu { padding-bottom: 30px; float: left; font-size: 15px; margin: 11px 0 0 0; }
#nav .menu li { float: left; color: #51B038; padding: 3px 10px 4px 10px; margin-right: 5px; position: relative; }
#nav .menu li a.new { color: #390; }
#nav .menu li a { text-decoration: none; color: #838383; }
#nav .menu li a:hover { color: #333; }
#nav .menu li.active { position: relative; background: #fff; border-bottom: 1px solid #ddd; }
#nav .menu li.active a { color: #333; }
#nav .menu li.active:before { content: ""; position: absolute; bottom: -5px; left: 10px; width: 9px; height: 5px; background: url(../images/arrows.png) no-repeat; }
/* Sub-menu */
#nav .sub-menu { position: absolute; top: 35px; left: 0; width: 500px; font-size: 11px; }
#nav .sub-menu li { margin-right: 5px; line-height: 12px; padding: 3px 10px 5px 10px !important; border-radius: 12px; }
#nav .sub-menu li a { color: #777 !important; text-decoration: underline; }
#nav .sub-menu li a:hover { text-decoration: none !important; }
#nav .sub-menu li.active { background: #555; color: #fff; font-weight: bold; background: #83DC5F; box-shadow: 0 2px 0 #75C656 inset; }
#nav .sub-menu li.active a { color: #fff !important; text-decoration: none; }
#nav .sub-menu li.active:before { display: none; }
/* Search */
#nav .search { position: absolute; bottom: 25px; right: 20px; }
#nav .search .text { width: 200px; border: 1px solid #ccc; border-radius: 13px; padding: 4px 13px; color: #777; box-shadow: 0 2px 2px #eee inset; }
#nav .search .button { width: 18px; height: 18px; position: absolute; top: 4px; right: 3px; border: none; background: url(../images/search.png) no-repeat; cursor: pointer; }
/* Search */
#nav .button-publish { float: left; text-decoration: none; background: url(../images/button_publish.gif) no-repeat; color: #333; margin-top: 45px; margin-right: 35px; }
#nav .button-publish span { float: left; background: url(../images/button_publish.gif) 100% 0 no-repeat; margin-left: 25px; padding: 2px 25px 3px 0; }
/* Misc blocks
-------------------- */
/* Blog profile */
.blog { padding: 20px 20px 0; margin-bottom: 20px; color: #666; position: relative; }
.blog .voting { position: absolute; top: 10px; right: 20px; z-index: 100; }
.blog .voting .total { font-weight: normal; padding: 4px 10px 5px; font-size: 14px; }
.blog .voting .plus { margin: 4px 6px 0 0; }
.blog .voting .minus { margin: 4px 0 0 6px; }
.blog .voting .text { font-size: 10px; color: #aaa; text-align: center; clear: both; }
.blog .voting.positive .total { background: #68BF46; color: #fff; }
.blog .voting.negative .total { background: #FF3B3C; color: #fff; }
.blog .blog-header { overflow: hidden; zoom: 1; position: relative; padding: 0 100px 0 30px; }
.blog .blog-header img { position: absolute; top: 0; left: 0; }
.blog .blog-header h2 { font-size: 24px; float: left; line-height: 1.2em; margin-top: -4px; }
.blog .blog-header h2 a { text-decoration: none; border-bottom: 1px dashed #70AAE0; }
.blog .blog-header h2.inactive a { color: #ccc; border-color: #ccc; }
.blog .actions { margin-bottom: 10px; }
.blog .blog-info { display: none; background: #F4F4F6; padding: 25px 30px; border-radius: 10px; }
.blog .blog-info h3 { font-size: 22px; color: #555; font-family: Verdana, sans-serif; }
.blog .blog-info p { border-bottom: 1px solid #DADADA; padding-bottom: 15px; margin-bottom: 0; }
.blog .blog-info .user { margin-right: 5px; }
.blog .blog-wrapper { overflow: hidden; zoom: 1; margin-bottom: 40px; border-top: 1px solid #fff; padding: 20px 0 0; }
.blog .blog-wrapper .blog-admins { float: left; width: 50%; }
.blog .blog-wrapper .blog-mods { float: left; width: 50%; }
.blog .blog-wrapper .user-list li { float: left; width: 60px;text-align: center; overflow: hidden; }
.blog .blog-wrapper .user-list li img { display: block; margin: 0 auto 2px; }
.blog-list-table { }
.blog-list-table tbody { color: #999; }
.blog-list-table td .avatar { float: left; position: relative; top: 2px; }
.blog-list-table td .title { font-size: 18px; }
.blog-list-table td .user { font-weight: bold; color: #999; background: url(../images/icons.gif) 0 -108px no-repeat; }
.blog-list-table td .private { position: relative; top: 2px; }
.blog-list-table td p { margin-bottom: 0; color: #999; }
/* User profile */
.user-profile { margin-bottom: 20px; overflow: hidden; zoom: 1; position: relative; }
.user-profile .avatar { float: left; margin-right: 15px; }
.user-profile h3 { font-size: 24px; line-height: 1em; margin-bottom: 10px; }
.user-profile p.realname { font-size: 18px; color: #999; }
.user-profile .voting { position: absolute; top: 0px; right: 75px; z-index: 100; }
.user-profile .voting .total { font-weight: normal; padding: 4px 10px 5px; font-size: 14px; }
.user-profile .voting .plus { margin: 4px 6px 0 0; }
.user-profile .voting .minus { margin: 4px 0 0 6px; }
.user-profile .voting .text { font-size: 10px; color: #aaa; text-align: center; clear: both; }
.user-profile .voting.positive .total { background: #68BF46; color: #fff; }
.user-profile .voting.negative .total { background: #FF3B3C; color: #fff; }
.user-profile .strength { float: right; }
.user-profile .strength .total { background: #70AAE0; font-size: 14px; padding: 4px 10px 5px; font-weight: normal; color: #fff; }
.user-profile .strength .text { font-size: 10px; color: #aaa; text-align: center; }
.user-profile-header { font-size: 18px; margin-bottom: 7px; border-bottom: 1px solid #ccc; }
.user-profile-table { width: 100%; }
.user-profile-table td { vertical-align: top; padding: 0 0 5px; }
.user-profile-table td.var { width: 150px; font-weight: bold; color: #999; }
.user-profile-table td .user { margin-right: 7px; }
/* Stat */
.stat-performance { padding: 15px 20px; background: #fff; border-top: 1px solid #eee; border-bottom: 1px solid #eee; }
.stat-performance table { }
.stat-performance table td { width: 200px; vertical-align: top; }
.stat-performance h4 { font-weight: bold; }
/* Userfeed */
.userfeed-get-more { display:block; width: 90%; margin: 0px auto; text-align: center; height: 2.5em; padding-top: 1em;}
.userfeed-get-more:hover { background: #f0f7fd;}
.userfeed_loading {background: #F7F7F7 url(../images/loader.gif) no-repeat center;}
/* Stream */
.stream-get-more { display: block; text-align: center; padding: 12px 0; background: #fafafa; color: #aaa; border-top: 1px solid #eee; text-decoration: none; }
.stream-get-more:hover { background: #f0f7fd; }
.stream_loading { background: #f7f7f7 url(../images/loader.gif) no-repeat center; }
.stream-comment-preview { padding: 5px 10px; background: #f3f3f3; margin-top: 5px; }
.stream-list { margin: 0 0 20px; }
.stream-list li { margin-bottom: 5px; min-height: 48px; _height: 48px; background: #fafafa; padding: 10px 15px 10px 70px; position: relative; }
.stream-list li .avatar { position: absolute; top: 10px; left: 10px; }
.stream-list li .date { display: block; color: #999; }
.stream-list li a { text-decoration: none; }
.stream-list li a:hover { text-decoration: underline; }
/* Userfields */
.userfield-list { width: 450px; }
.userfield-list li { background: #f7f7f7; margin-bottom: 1px; padding: 10px 5px; overflow: hidden; zoom: 1; line-height: 12px; color: #777; }
.userfield-list li .uf-actions { float: right; }
.userfield-list li .uf-actions img { vertical-align: top; }
.userfield-list li .userfield_admin_name { font-weight: bold; color: #333; }
.userfield-add { text-decoration: none; border-bottom: 1px dashed #70AAE0; }
.userfield-add:hover { color: #333; border-color: #333; }