@font-face {
    font-family: segoeuil;
    src: url(../assets/SEGOEUIL.ttf)
}

body {
    background: url(/images/mosaic.png);
    margin: 0
}

*,
input {
    font-family: segoeuil!important;
    -webkit-font-smoothing: antialiased;
    color: #fff
}

img {
    vertical-align: middle
}

textarea {
    resize: vertical
}

br {
    clear: both
}

h1 {
    margin: 0
}

dl,
menu,
ol,
ul {
    margin: 0;
    list-style-type: none
}

nav ol,
nav ul {
    list-style: none;
    list-style-image: none
}

button,
input,
select,
textarea {
    font-size: 100%;
    margin: 0;
    vertical-align: baseline;
    *vertical-align: middle
}

table {
    border-collapse: collapse;
    border-spacing: 0
}

div#container {
    width: 640px;
    margin: 0 auto
}

a {
    text-decoration: none;
    color: inherit
}

p {
    margin: 0
}

::-webkit-scrollbar {
    width: 10px
}

::-webkit-scrollbar-track {
    background: #151515
}

::-webkit-scrollbar-thumb {
    background: #454545
}

#leave_kom,
#priznaj,
#leave_comm_btn {
    padding: 0 25px;
    height: 40px;
    display: block;
    border: 1px solid rgba(60, 60, 60, .3);
    margin: 0 auto;
    font-size: 16px;
    letter-spacing: 1px;
    background-color: rgba(60, 60, 60, .2)
}

#leave_kom:hover,
#priznaj:hover,
#leave_comm_btn:hover {
    opacity: 1;
    background-color: rgba(75, 75, 75, .4);
    border: 1px solid rgba(75, 75, 75, .5)
}

#leave_kom:active,
#priznaj:active,
#leave_comm_btn:active {
    background-color: rgba(85, 85, 85, .5);
    border: 1px solid rgba(85, 85, 85, .7)
}

#leave_kom {
    width: 200px;
    line-height: 40px;
    text-align: center;
    cursor: pointer
}

#content {
    margin-bottom: 20px;
    background-color: rgba(50, 50, 50, .3);
    box-shadow: 0 0 8px rgba(0, 0, 0, .7);
    -moz-box-shadow: 0 0 8px rgba(0, 0, 0, .7);
    -webkit-box-shadow: 0 0 8px rgba(0, 0, 0, .7);
    width: 600px;
    float: left;
    padding-top: 3px
}

#content2 {
    display: inline-block;
    float: right;
    background-color: rgba(50, 50, 50, .3);
    box-shadow: 0 0 8px rgba(0, 0, 0, .7);
    -moz-box-shadow: 0 0 8px rgba(0, 0, 0, .7);
    -webkit-box-shadow: 0 0 8px rgba(0, 0, 0, .7);
    margin-left: 15px;
    width: 300px;
    padding: 8px 10px;
    position: relative
}

.c2 {
    background-color: rgba(50, 50, 50, .25);
    margin-top: 3px;
    cursor: pointer;
    letter-spacing: 1px;
    box-shadow: 0 0 3px rgba(0, 0, 0, .3)
}

.c2:hover {
    background-color: rgba(70, 70, 70, .3)
}

.mct {
    display: inline-block;
    margin: 9px 15px
}

.mimgw {
    float: right;
    margin: 7px 5px 0 0
}

.smallInfo {
    opacity: .4;
    font-size: 11px;
    letter-spacing: 0;
    margin: 15px 0 5px;
    text-align: center
}

.snet_wrap {
    float: left;
    width: 300px;
    margin: 0 6px
}

#desc-and-sort {
    padding: 10px;
    margin-bottom: 12px;
    border-bottom: 1px solid rgba(100, 100, 100, .2)
}

.small-conf-text {
    font-size: 14px;
    letter-spacing: 1px;
    color: #fefec7;
    cursor: pointerl
}

.safety-net-box-wrap,
.side-content-box-wrap {
    padding: 10px;
    background: rgba(50, 50, 50, .2)
}

.side-content-box-wrap:hover {
    background: rgba(50, 50, 50, .3)
}

.comm-text,
[id^=isptext] {
    color: #fefec7
}

.confession-kom {
    font-size: 20px;
    padding: 10px;
    width: 563px;
    margin: 15px auto
}

.isp {
    background-color: transparent
}

#confessField,
#leave_conf_field {
    color: #fdfdc7;
    width: 400px;
    margin: 40px auto 0;
    display: block;
    outline: 0;
    border: 1px solid rgba(60, 60, 60, .4);
    font-size: 18px;
    padding: 8px;
    opacity: .7;
    background: rgba(50, 50, 50, .3);
    -webkit-box-shadow: 0 0 5px rgba(50, 50, 50, .1);
    -moz-box-shadow: 0 0 4px rgba(50, 50, 50, .1);
    box-shadow: 0 0 5px rgba(50, 50, 50, .1);
    transition: background-color .2s linear;
    -webkit-transition: background-color .2s linear;
}

#confessField:focus,
#leave_conf_field:focus {
    opacity: 1;
    background: rgba(255, 255, 255, 0);
    border: 1px solid rgba(253, 253, 199, .5);
    -moz-box-shadow: inset 1px 3px 4px rgba(0, 0, 0, 0);
    -webkit-box-shadow: inset 1px 3px 4px rgba(0, 0, 0, 0);
    shadow: inset 1px 3px 4px rgba(0, 0, 0, 0);
}

#msg-wrapper,
#msg-wrapper-cerr {
    display: none;
    opacity: 0;
    width: 100%;
    position: fixed;
    z-index: 9;
    box-shadow: 1px 0 4px rgba(0, 0, 0, .5);
    -webkit-box-shadow: 1px 0 4px rgba(0, 0, 0, .5)
}

#conf-posted,
#conf-posted-cerr {
    height: 50px;
    text-align: center;
    padding-top: 15px;
    font-size: 22px
}

#conf-posted {
    background-color: #fdfdc7;
    color: #000
}

#conf-posted-cerr {
    background-color: #aa0e08
}

#komime {
    opacity: .7;
    display: block;
    background: rgba(50, 50, 50, .3);
    border: 1px solid rgba(60, 60, 60, .4);
    outline: 0;
    -webkit-box-shadow: 0 0 5px rgba(50, 50, 50, .1);
    -moz-box-shadow: 0 0 4px rgba(50, 50, 50, .1);
    box-shadow: 0 0 4px rgba(50, 50, 50, .1);
    margin-bottom: 20px;
    transition: background .2s linear;
    -webkit-transition: background-color .2s linear;
    -webkit-transition: opacity .2s linear;
    -webkit-transition: border .2s linear;
    -webkit-transition: border .2s linear
}

#komime:focus {
    opacity: 1;
    box-shadow: inset 1px 1px 3px rgba(0, 0, 0, .1);
    display: block;
    background: rgba(255, 255, 255, 0);
    border: 1px solid rgba(253, 253, 199, .5);
    -moz-box-shadow: inset 1px 3px 4px rgba(0, 0, 0, 0);
    -webkit-box-shadow: inset 1px 3px 4px rgba(0, 0, 0, 0)
}

.commText {
    color: #fdfdc7;
    font-size: 14px;
    margin-left: 9px;
    display: block;
    margin-top: -15px;
    width: 400px;
    word-wrap: break-word
}

.commTime {
    float: right;
    font-size: 10px;
    color: #fff;
    opacity: 0;
    margin-top: 3px;
    margin-right: 17px
}

.commTime2 {
    float: right;
    font-size: 10px;
    color: #fff;
    opacity: .6
}

.report-comm {
    width: 18px;
    height: 18px;
    float: right;
    opacity: 0;
    margin: 2px 2px 0 0;
    background: url(/images/isp-sprite-3.png) no-repeat -355px -175px;
    cursor: pointer
}

.report-comm:hover {
    opacity: 1
}

.report-div-wrap,
.dialog-div-wrap {
    display: none;
    position: fixed;
    top: 50px;
    width: 100%;
    height: 100%;
    z-index: 999;
    opacity: 0
}

.report-div,
.dialog-div {
    display: block;
    position: relative;
    top: 50px;
    width: 600px;
    height: 150px;
    margin: 0 auto;
    background: #333;
    padding: 10px
}

.report-title,
.dialog-title {
    clear: both;
    color: #fff;
    margin: 0 auto;
    width: 300px;
    font-size: 16px;
    text-align: center
}

.rep-btn {
    width: 85px;
    height: 20px;
    text-align: center;
    text-decoration: none;
    background: #555;
    padding: 5px;
    border-radius: 2px;
    cursor: pointer;
    color: #fff
}

.rep-btn:hover {
    background: #777
}

.rep-btn-yes,
.dialog-btn-yes {
    margin-left: 170px;
    float: left
}

.report-text,
.dialog-text {
    color: #fff
}

.rep-btn-no,
.dialog-btn-no {
    margin-right: 170px;
    float: right
}

#repText,
#dialogText {
    color: #fff;
    background: #555;
    border: 1px solid #777;
    display: block;
    width: 550px;
    padding: 5px;
    margin: 8px auto;
    outline: 0
}

#repText:focus,
#dialogText:focus {
    border: 1px solid #aaa
}

.rep-isp {
    cursor: pointer;
    float: right;
    margin-top: -5px;
    display: block;
    width: 65px;
    height: 20px;
    text-align: right;
    background: url(/images/rep_isp_spr.png) 0 -1px no-repeat;
    color: #fff;
    opacity: .8
}

.rep-isp:hover {
    background: url(/images/rep_isp_spr.png) 0 -29px no-repeat;
    opacity: 1
}

#p-autora-wrap {
    display: none;
    opacity: 0;
    width: 100%;
    position: absolute;
    z-index: 9999;
    top: 20px
}

#sort {
    margin-left: 30px
}

#sortwrap {
    display: block;
    width: 50px;
    color: #fdfdc7;
    cursor: pointer;
    background: url(../images/isp-sprite-3.png) no-repeat -25px -113px;
    opacity: .7;
    height: 50px
}

#sortwrap:hover,
#submenu-wrap:hover {
    opacity: 1
}

#submenu-wrap {
    display: block;
    width: 50px;
    color: #fdfdc7;
    cursor: pointer;
    background: url(../images/isp-sprite-3.png) no-repeat -252px -119px;
    opacity: .7;
    height: 50px
}

#sort-list,
#submenu-list {
    display: block;
    width: 103px;
    position: absolute;
    top: 100%;
    z-index: 99999;
    float: left;
    border-top: 2px solid #fff;
    background: #222;
    color: #fff;
    box-shadow: 0 0 2px #000
}

.dropItem {
    display: block;
    padding: 3px 6px 7px;
    font-size: 14px
}

.dropItem:hover {
    background: #111
}

.dropItem:active {
    background: #000
}

#admin2,
#ispovedi2 {
    background: #2a2a2a;
    margin: 0;
    height: 100%;
    opacity: .9;
    float: right
}

#admin2:hover,
#ispovedi2:hover {
    background: #222;
    opacity: 1
}

.dropItem a {
    display: block
}

#admin2img,
#ispovedi2img {
    width: 40px;
    height: 35px;
    float: right
}

#admin2img {
    background: url(/../images/isp-sprite-3.png) -187px -188px no-repeat
}

#ispovedi2img {
    background: url(/images/isp-sprite-3.png) -26px -183px no-repeat
}

#p-autora {
    position: relative;
    width: 800px;
    margin-right: auto;
    margin-left: auto;
    display: block;
    background-color: #fdfdc7;
    text-align: justify;
    padding: 30px;
    line-height: 1;
    font-size: 22px;
    box-shadow: 0 0 7px rgba(255, 255, 255, .55)
}

#miniLink,
.miniLink {
    width: 100px;
    line-height: 5px;
    padding-top: 8px;
    height: 15px;
    margin: 0 auto;
    font-size: 12px;
    margin-bottom: 5px;
    display: block;
    text-align: center;
    background-color: rgba(50, 50, 50, .2);
    border: 1px solid rgba(50, 50, 50, .3)
}

#miniLink:hover,
.miniLink:hover {
    background-color: rgba(65, 65, 65, .3);
    border: 1px solid rgba(65, 65, 65, .4)
}

#miniLink:active {
    background-color: rgba(75, 75, 75, .5);
    border: 1px solid rgba(75, 75, 75, .7)
}

header#top-nav {
    background-color: #333;
    width: 100%
}

#nav-wrap {
    width: 940px;
    height: 50px;
    margin: 0 auto;
    position: relative
}

#nav-items {
    float: right
}

#top-nav#nav-wrap h1 {
    width: 270px;
    height: 50px;
    float: left
}

#nav-wrap h1 a {
    display: block;
    height: 50px;
    width: 290px;
    text-indent: -9999px;
    overflow: hidden;
    background: url(../images/isp-sprite-3.png) -22px -242px no-repeat;
    /*background: url(../images/logo-snow.png) no-repeat;*/
}

.nav-item {
    float: right;
    border-left: 1px solid #444;
    border-right: 1px solid #151515;
    height: 50px
}

.nav-item.last {
    border-right: 1px solid #444
}

.nav-item.first {
    border-left: 1px solid #151515
}

.sideLink {
    display: block;
    width: 30px;
    height: 30px
}

#budiModerator {
    background: url(/../images/isp-sprite-3.png) -193px -191px no-repeat
}

#randLink {
    background: url(/../images/isp-sprite.png) -190px -80px
}

#ispDana {
    background: url(/../images/isp-sprite-3.png) -262px -23px
}

#ispNed {
    background: url(/../images/isp-sprite-3.png) -190px -130px
}

#ispMes {
    background: url(/../images/isp-sprite-3.png) -116px -190px
}

#arh {
    background: url(/../images/isp-sprite-3.png) -265px -79px no-repeat
}

#confess {
    width: 170px;
    padding-left: 10px;
    display: block;
    font-size: 18px;
    background: url(/images/per1.png) no-repeat 140px 8px;
    color: #cacaca;
    border-right: 1px solid #000;
    line-height: 50px
}

#confess:hover {
    color: #fff
}

#main-logo {
    float: left;
    margin-left: -25px
}

.fixed {
    position: fixed;
    top: 0
}

.absolute {
    position: absolute
}

#sticky-nav {
    box-shadow: 0 3px 1px rgba(0, 0, 0, .3);
    background-color: #55f;
    width: 100%;
    z-index: 3
}

.options {
    float: left;
    width: 580px
}

.options ul {
    display: table-row
}

.options ul li {
    display: inline-block;
    height: 35px;
    list-style-type: none;
    margin: 0 10px;
    vertical-align: middle;
    line-height: 32px
}

.options ul li a {
    text-decoration: none;
    color: #fff;
    border-bottom: 2px solid transparent;
    display: block;
    opacity: .85
}

.options ul li a:hover {
    opacity: 1
}

#width-limit {
    width: 940px;
    margin: 0 auto
}

#socWrap {
    padding: 3px 0 0 3px;
    position: fixed;
    bottom: 15px;
    left: 20px;
    width: 100px;
    height: 50px;
    background: rgba(50, 50, 50, 0);
    opacity: .6
}

#twWrap {
    overflow: hidden;
    width: 98px;
    border-radius: 4px;
    height: 20px;
    opacity: 0
}

#socWrap:hover {
    opacity: 1
}

.miniSocWrap {
    margin-top: 24px;
    margin-right: 5px;
    display: block;
    float: right;
    margin-left: 10px;
    width: 60px;
    background: rgba(255, 255, 255, 0)
}

.fbshare a,
.twshare a {
    transition: background-color .3s linear;
    -webkit-transition: background-color .3s linear;
    -moz-transition: background-color .3s linear;
    margin: 1px;
    width: 25px;
    height: 25px;
    display: block;
    clear: none;
    float: right;
    margin-right: 4px;
    cursor: pointer;
    box-shadow: 0 0 2px rgba(255, 255, 255, .2)
}

.fbshare a {
    background: rgba(50, 50, 50, 0)url(../images/isp-sprite-3.png) -312px -78px no-repeat
}

.fbshare a:hover {
    background: #4b6daa url(../images/isp-sprite-3.png) -312px -78px no-repeat
}

.twshare a {
    background: rgba(50, 50, 50, 0) url(../images/isp-sprite-3.png) -340px -78px no-repeat
}

.twshare a:hover {
    background: #00aced url(../images/isp-sprite-3.png) -340px -78px no-repeat
}

#lupa {
    width: 45px;
    height: 50px;
    float: left;
    display: block;
    background: url(../images/isp-sprite-3.png) -102px -65px no-repeat;
    opacity: .6;
    border-left: 1px solid #444
}

#lupa:hover {
    cursor: pointer;
    opacity: 1
}

#search_input {
    background: 0 0;
    border: 1px solid rgba(253, 253, 199, 0);
    outline: 0;
    float: right;
    width: 0;
    padding-left: 2px;
    color: #fdfdc7;
    font-family: inherit;
    font-size: 14px;
    margin-top: 15px
}

#search_input:focus {
    background: 0 0;
    border: 1px solid rgba(253, 253, 199, 0)
}

#search_id {
    height: 50px
}

.ui-progress-bar {
    z-index: 9;
    position: fixed;
    top: 48px;
    width: 100%;
    opacity: 0
}

.ui-progress {
    display: block;
    height: 2px;
    box-shadow: 0 0 2px rgba(255, 255, 255, 1);
    background-color: #fff;
    width: 1%
}

a[id^=modda],
a[id^=modne] {
    padding: 3px 10px
}

a[id^=modda] {
    float: left;
    border: 1px solid rgba(255, 255, 255, .7)
}

a[id^=modda]:hover {
    border: 1px solid rgba(0, 158, 0, 1)
}

a[id^=modda]:active {
    color: rgba(0, 158, 0, 1)
}

a[id^=modne] {
    float: right;
    border: 1px solid rgba(255, 255, 255, .7)
}

a[id^=modne]:hover {
    border: 1px solid rgba(191, 44, 15, 1)
}

a[id^=modne]:active {
    color: rgba(191, 44, 15, 1)
}

.ad-k-p2,
.ad-m-p2,
.ad-p2 {
    width: 300px;
    height: auto;
    display: block;
    opacity: 1;
    margin-left: -10px
}

.ad-k-p2:hover,
.ad-m-p2:hover,
.ad-p2:hover,
.ad-p3:hover {
    opacity: 1
}

.ad-p3 {
    width: 300px;
    height: auto;
    display: block
}

.title_1 {
    color: #f2f2f2;
    font-size: 18px
}

#pravilnik {
    color: #fff;
    line-height: 37px;
    background-color: rgba(100, 100, 100, 0.5);
    text-align: center;
    cursor: pointer
}

#pravilnik:hover {
    background-color: #444
}

#small-logo {
    display: none;
    margin: 0 auto;
    background: url(/images/isp-sprite-3.png) no-repeat -240px -188px;
    width: 70px;
    height: 33px
}

.leavecomm {
    width: 160px;
    display: block;
    height: 15px;
    font-size: 14px;
    padding: 5px;
    line-height: 1em;
    text-align: center;
    border: 1px solid rgba(255, 255, 255, 0.15);
    margin: 10px auto
}

.leavecomm:hover {
    background-color: rgba(65, 65, 65, 0.3)
}

.leavecomm:active {
    background-color: rgba(65, 65, 65, 0.5)
}


/*
 New styles v2
*/

@import url('https://fonts.googleapis.com/css?family=Roboto:100');
* {
    font-family: 'Roboto', sans-serif;
}

body {
    background: url("/images/mosaic.png");
    margin: 0;
    background-color: #222;
}

#container-main {
    width: 940px;
    padding-top: 10px;
    margin: 0 auto;
}

#content {
    width: 600px;
    display: inline-block;
    background-color: rgba(50, 50, 50, .3);
}

.confession {
    background-color: rgba(50, 50, 50, .2);
    letter-spacing: 1px;
    box-shadow: 0 0 3px rgba(0, 0, 0, .3);
    -moz-box-shadow: 0 0 3px rgba(0, 0, 0, .3);
    -webkit-box-shadow: 0 0 3px rgba(0, 0, 0, .3);
    cursor: pointer;
    margin: 10px;
}

.confession:hover {
    background-color: rgba(50, 50, 50, .4);
}

.confession-top-content {
    top: 0;
    padding: 8px;
    height: 15px;
}

.confession-id,
.confession-timestamp {
    color: #FEFEFE;
    opacity: .5;
    font-size: 12px;
    transition: opacity .2s linear;
    text-decoration: none;
}

.confession-id {
    float: left;
}

.confession-timestamp {
    float: right;
}

.confession-text {
    color: #fefec7;
    padding: 10px;
    padding-bottom: 20px;
}

.confession-data {
    width: 100%;
}

.confession-values {
    height: 28px;
}

.confession-value {
    width: 25%;
    text-align: center;
    color: #FEFEFE;
    opacity: .65;
    font-size: 10px;
    float: left;
    margin-top: 10px;
}

.confession-actions {
    border-top: 1px solid rgba(200, 200, 200, .1);
    height: 40px;
    line-height: 32px;
    box-sizing: border-box;
    position: relative;
}

.confession-action {
    color: #DEDEDE;
    float: left;
    font-size: 12px;
    width: 144px;
    text-align: center;
    box-sizing: border-box;
    height: 40px;
}

.confession-action:hover {
    background-color: rgba(40, 40, 40, .5)
}

.comments-icon {
    background-image: url("/images/comment.png");
    background-size: 22px;
    background-repeat: no-repeat;
    background-position: 63px 10px;
    opacity: 0.8;
}

.share-icon {
    line-height: 30px;
    opacity: 0.9;
}

.confession-action:active {
    background-color: rgba(10, 10, 10, .2);
}

.action-separator {
    width: 0px;
    height: 26px;
    margin-top: 7px;
    float: left;
    border-right: 1px solid rgba(200, 200, 200, .1);
}

.invisible-append {
    display: none;
    border-top: 1px solid rgba(200, 200, 200, .1);
}

.comments-append {
    display: none;
    padding: 10px;
}

.slider {
    top: 0;
    width: 0;
    height: 2px;
    margin: 0 auto;
}

.approve .slider {
    background-color: #3eabff;
}

.disapprove .slider {
    background-color: #bf2c0f;
}