#wp-nt-aio-wrapper {
--backgroundIcon: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 455 455' width='512' height='512'%3E%3Cpath d='M227.5 0C101.855 0 0 101.855 0 227.5c0 47.551 14.598 91.688 39.544 128.193L9.662 445.338l89.646-29.881C135.812 440.403 179.949 455 227.5 455 353.145 455 455 353.145 455 227.5S353.145 0 227.5 0z' fill='%23FFF'/%3E%3C/svg%3E");
--backgroundIconCustomApp: url(//procoding.rs/wp-content/plugins/support-chat/assets/home/images/custom-app.svg);
--backgroundSize: 60%;
--backgroundColor: #007cc4;
--backgroundColorCustomApp: #007cc4;
position: fixed;
right: 35px;
z-index: 99999999;
font-family: Roboto, sans-serif;
}
#wp-nt-aio-wrapper *,
#wp-nt-aio-wrapper :after,
#wp-nt-aio-wrapper :before {
-webkit-box-sizing: border-box;
box-sizing: border-box;
}
#wp-nt-aio-wrapper .nt-aio-active {
position: relative;
z-index: 20;
width: 60px;
height: 60px;
background-color: var(--backgroundColor);
cursor: pointer;
overflow: hidden;
border-radius: 100%;
-webkit-border-radius: 100%;
-moz-border-radius: 100%;
box-shadow: none;
-webkit-box-shadow: none;
-moz-box-shadow: none;
}
#wp-nt-aio-wrapper .nt-aio-active,
#wp-nt-aio-wrapper .nt-aio-active:after,
#wp-nt-aio-wrapper .nt-aio-active:before {
-o-transition: 0.4s ease all;
-o-transition: all 0.4s ease;
transition: all 0.4s ease;
-webkit-transition: all 0.4s ease;
-moz-transition: 0.4s ease all;
}
#wp-nt-aio-wrapper .nt-aio-active:after,
#wp-nt-aio-wrapper .nt-aio-active:before {
content: "";
width: 100%;
height: 100%;
position: absolute;
top: 0;
left: 0;
bottom: 0;
right: 0;
}
#wp-nt-aio-wrapper .nt-aio-active:before {
z-index: 10;
background: var(--backgroundIcon) 50% no-repeat;
background-size: var(--backgroundSize);
overflow: hidden;
font-size: 100%;
}
#wp-nt-aio-wrapper .nt-aio-active:after {
opacity: 0;
z-index: 20;
background: url(//procoding.rs/wp-content/plugins/support-chat/assets/home/images/close-button.svg) 50% no-repeat;
background-size: 16px 16px;
-ms-transform: scale(0) rotate(-1turn);
transform: scale(0) rotate(-1turn);
-webkit-transform: scale(0) rotate(-1turn);
-moz-transform: scale(0) rotate(-1turn);
}
#wp-nt-aio-wrapper .nt-aio-content,
#wp-nt-aio-wrapper .nt-aio-item {
position: absolute;
bottom: 0;
left: 0;
}
#wp-nt-aio-wrapper .nt-aio-item {
backface-visibility: hidden;
-webkit-backface-visibility: hidden;
visibility: hidden;
opacity: 0;
}
#wp-nt-aio-wrapper .nt-aio-item,
#wp-nt-aio-wrapper .nt-aio-item .nt-aio-item-icon {
-o-transition: 0.4s ease all;
-o-transition: all 0.4s ease;
transition: all 0.4s ease;
-webkit-transition: all 0.4s ease;
-moz-transition: 0.4s ease all;
}
#wp-nt-aio-wrapper .nt-aio-item .nt-aio-item-icon {
width: 60px;
height: 60px;
position: relative;
cursor: pointer;
background-size: 32px 32px !important;
border-radius: 100%;
-webkit-border-radius: 100%;
-moz-border-radius: 100%;
box-shadow: none;
-webkit-box-shadow: none;
-moz-box-shadow: none;
}
#wp-nt-aio-wrapper .nt-aio-item .nt-aio-item-txt {
opacity: 0;
visibility: hidden;
position: absolute;
top: 50%;
right: calc(100% + 10px);
padding: 0 10px;
background: rgba(54, 54, 54, 0.8);
color: #fff;
font-size: 12px;
line-height: 22px;
margin-top: -11px;
font-weight: 500;
white-space: nowrap;
border-radius: 2px;
-webkit-border-radius: 2px;
-moz-border-radius: 2px;
-o-transition: 0.4s ease all;
-o-transition: all 0.4s ease;
transition: all 0.4s ease;
-webkit-transition: all 0.4s ease;
-moz-transition: 0.4s ease all;
-ms-transform: translate(10px);
transform: translate(10px);
-webkit-transform: translate(10px);
-moz-transform: translate(10px);
}
#wp-nt-aio-wrapper .nt-aio-item .nt-aio-email {
background: #3a68fe url(//procoding.rs/wp-content/plugins/support-chat/assets/home/images/close-envelope.svg) 50% no-repeat;
}
#wp-nt-aio-wrapper .nt-aio-item .nt-aio-phone {
background: #ff5a00 url(//procoding.rs/wp-content/plugins/support-chat/assets/home/images/phone-receiver.svg) 50% no-repeat;
}
#wp-nt-aio-wrapper .nt-aio-item .nt-aio-viber {
background: #7b519c url(//procoding.rs/wp-content/plugins/support-chat/assets/home/images/viber.svg) 50% no-repeat;
}
#wp-nt-aio-wrapper .nt-aio-item .nt-aio-line {
background: #00b900 url(//procoding.rs/wp-content/plugins/support-chat/assets/home/images/line-logo.svg) 50% no-repeat;
}
#wp-nt-aio-wrapper .nt-aio-item .nt-aio-snapchat {
background: #fdfb1c url(//procoding.rs/wp-content/plugins/support-chat/assets/home/images/snapchat.svg) 50% no-repeat;
}
#wp-nt-aio-wrapper .nt-aio-item .nt-aio-whatsapp {
background: #14d61e url(//procoding.rs/wp-content/plugins/support-chat/assets/home/images/whatsapp-logo.svg) 50% no-repeat;
}
#wp-nt-aio-wrapper .nt-aio-item .nt-aio-facebook-messenger {
background: #0084ff url(//procoding.rs/wp-content/plugins/support-chat/assets/home/images/facebook-messenger.svg) 50% no-repeat;
}
#wp-nt-aio-wrapper .nt-aio-item .nt-aio-telegram {
background: #089be5 url(//procoding.rs/wp-content/plugins/support-chat/assets/home/images/telegram.svg) 50% no-repeat;
}
#wp-nt-aio-wrapper .nt-aio-item .nt-aio-skype {
background: #00a8f4 url(//procoding.rs/wp-content/plugins/support-chat/assets/home/images/skype.svg) 50% no-repeat;
}
#wp-nt-aio-wrapper .nt-aio-item [class*="nt-aio-custom-app"] {
background: var(--backgroundColorCustomApp) var(--backgroundIconCustomApp) 50%
no-repeat;
}
#wp-nt-aio-wrapper .nt-aio-item:hover .nt-aio-item-icon {
-webkit-box-shadow: 0 4px 15px 0 rgba(0, 0, 0, 0.21) !important;
box-shadow: 0 4px 15px 0 rgba(0, 0, 0, 0.21) !important;
}
@media (min-width: 1025px) {
#wp-nt-aio-wrapper .nt-aio-item:hover .nt-aio-item-txt {
opacity: 1;
visibility: visible;
-ms-transform: translate(0);
transform: translate(0);
-webkit-transform: translate(0);
-moz-transform: translate(0);
}
}
#wp-nt-aio-wrapper .nt-aio-popup {
visibility: hidden;
opacity: 0;
width: 350px;
position: absolute;
bottom: 75px;
right: 0;
overflow: hidden;
border-radius: 8px;
-webkit-border-radius: 8px;
-moz-border-radius: 8px;
-o-transition: 0.4s ease all;
-o-transition: all 0.4s ease;
transition: all 0.4s ease;
-webkit-transition: all 0.4s ease;
-moz-transition: 0.4s ease all;
-ms-transform: translateY(15px);
transform: translateY(15px);
-webkit-transform: translateY(15px);
-moz-transform: translateY(15px);
}
#wp-nt-aio-wrapper .nt-aio-popup .nt-aio-popup-header {
padding: 0 45px;
color: #fff;
font-size: 16px;
line-height: 45px;
font-weight: bold;
}
#wp-nt-aio-wrapper .nt-aio-popup .nt-aio-popup-header .nt-aio-popup-title-icon {
position: absolute;
height: 45px;
width: 40px;
top: 0;
left: 5px;
background-size: 36px 36px;
background-repeat: no-repeat;
background-position: 50%;
}
#wp-nt-aio-wrapper .nt-aio-popup .nt-aio-popup-header .nt-aio-popup-close {
opacity: 0.6;
width: 45px;
height: 45px;
position: absolute;
top: 0;
right: 0;
background: url(//procoding.rs/wp-content/plugins/support-chat/assets/home/images/close-button.svg) 50% no-repeat;
background-size: 16px 16px;
cursor: pointer;
-o-transition: 0.4s ease opacity;
-o-transition: opacity 0.4s ease;
transition: opacity 0.4s ease;
-webkit-transition: opacity 0.4s ease;
-moz-transition: 0.4s ease opacity;
}
#wp-nt-aio-wrapper
.nt-aio-popup
.nt-aio-popup-header
.nt-aio-popup-close:hover {
opacity: 1;
}
#wp-nt-aio-wrapper .nt-aio-popup .nt-aio-popup-content {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
min-height: 275px;
padding: 13px 25px;
background: #fff;
color: #434a54;
font-size: 19px;
line-height: 24px;
}
#wp-nt-aio-wrapper .nt-aio-popup .nt-aio-popup-content p {
margin: 0 0 24px;
}
#wp-nt-aio-wrapper .nt-aio-popup .nt-aio-popup-content a:only-child {
margin-top: -20px;
}
#wp-nt-aio-wrapper .nt-aio-popup .nt-aio-popup-content h1,
#wp-nt-aio-wrapper .nt-aio-popup .nt-aio-popup-content h2,
#wp-nt-aio-wrapper .nt-aio-popup .nt-aio-popup-content h3,
#wp-nt-aio-wrapper .nt-aio-popup .nt-aio-popup-content h4,
#wp-nt-aio-wrapper .nt-aio-popup .nt-aio-popup-content h5 {
font-weight: 400;
margin: 0 0 24px;
}
#wp-nt-aio-wrapper .nt-aio-popup .nt-aio-popup-content h5 {
font-size: 14px;
line-height: 24px;
}
#wp-nt-aio-wrapper .nt-aio-popup .nt-aio-popup-content h4 {
font-size: 18px;
line-height: 28px;
}
#wp-nt-aio-wrapper .nt-aio-popup .nt-aio-popup-content h3 {
font-size: 24px;
line-height: 34px;
}
#wp-nt-aio-wrapper .nt-aio-popup .nt-aio-popup-content h2 {
font-size: 30px;
line-height: 40px;
}
#wp-nt-aio-wrapper .nt-aio-popup .nt-aio-popup-content h1 {
font-size: 40px;
line-height: 50px;
}
#wp-nt-aio-wrapper .nt-aio-popup.nt-aio-messenger-popup .nt-aio-popup-header,
#wp-nt-aio-wrapper .nt-aio-popup.nt-aio-facebook-messenger-popup .nt-aio-popup-header {
background: #0084ff;
}
#wp-nt-aio-wrapper .nt-aio-popup.nt-aio-wechat-popup .nt-aio-popup-header {
background: #008000;
}
#wp-nt-aio-wrapper .nt-aio-popup.nt-aio-kakaotalk-popup .nt-aio-popup-header {
background: #ffde00;
color: #000;
}
#wp-nt-aio-wrapper .nt-aio-popup.nt-aio-zalo-popup .nt-aio-popup-header {
background: #00b1ff;
}
#wp-nt-aio-wrapper
.nt-aio-popup.nt-aio-messenger-popup
.nt-aio-popup-header
.nt-aio-popup-title-icon,
#wp-nt-aio-wrapper
.nt-aio-popup.nt-aio-facebook-messenger-popup
.nt-aio-popup-header
.nt-aio-popup-title-icon {
background-image: url(//procoding.rs/wp-content/plugins/support-chat/assets/home/images/facebook-messenger.svg);
background-size: 22px 22px;
}
#wp-nt-aio-wrapper
.nt-aio-popup.nt-aio-wechat-popup
.nt-aio-popup-header
.nt-aio-popup-title-icon {
background-image: url(//procoding.rs/wp-content/plugins/support-chat/assets/home/images/wechat.svg);
background-size: 22px 22px;
}
#wp-nt-aio-wrapper
.nt-aio-popup.nt-aio-kakaotalk-popup
.nt-aio-popup-header
.nt-aio-popup-title-icon {
background-image: url(//procoding.rs/wp-content/plugins/support-chat/assets/home/images/kakaotalk.svg);
background-size: 22px 22px;
}
#wp-nt-aio-wrapper
.nt-aio-popup.nt-aio-zalo-popup
.nt-aio-popup-header
.nt-aio-popup-title-icon {
background-image: url(//procoding.rs/wp-content/plugins/support-chat/assets/home/images/zalo.svg);
background-size: 22px 22px;
}
#wp-nt-aio-wrapper
.nt-aio-popup.nt-aio-zalo-popup
.nt-aio-popup-header
.nt-aio-popup-title-icon {
background-image: url(//procoding.rs/wp-content/plugins/support-chat/assets/home/images/zalo.svg);
background-size: 22px 22px;
}
#wp-nt-aio-wrapper .nt-aio-popup.nt-aio-whatsapp-popup .nt-aio-popup-header {
background: #14d61e;
}
#wp-nt-aio-wrapper
.nt-aio-popup.nt-aio-whatsapp-popup
.nt-aio-popup-header
.nt-aio-popup-title-icon {
background-image: url(//procoding.rs/wp-content/plugins/support-chat/assets/home/images/whatsapp-logo.svg);
background-size: 22px 22px;
}
#wp-nt-aio-wrapper .nt-aio-popup.nt-aio-snapchat-popup .nt-aio-popup-header {
background: #fdfb1c;
color: #434a54;
}
#wp-nt-aio-wrapper
.nt-aio-popup.nt-aio-snapchat-popup
.nt-aio-popup-header
.nt-aio-popup-title-icon {
background-image: url(//procoding.rs/wp-content/plugins/support-chat/assets/home/images/snapchat.svg);
background-size: 22px 22px;
}
#wp-nt-aio-wrapper .nt-aio-popup.nt-aio-snapchat-popup .nt-aio-popup-close {
background-image: url(//procoding.rs/wp-content/plugins/support-chat/assets/home/images/close-button-black.png);
background-size: 45px 45px;
}
#wp-nt-aio-wrapper .nt-aio-popup.nt-aio-line-popup .nt-aio-popup-header {
background: #00b900;
}
#wp-nt-aio-wrapper
.nt-aio-popup.nt-aio-line-popup
.nt-aio-popup-header
.nt-aio-popup-title-icon {
background-image: url(//procoding.rs/wp-content/plugins/support-chat/assets/home/images/line-logo.svg);
background-size: 22px 22px;
}
#wp-nt-aio-wrapper .nt-aio-popup.nt-aio-viber-popup .nt-aio-popup-header {
background: #7b519c;
}
#wp-nt-aio-wrapper
.nt-aio-popup.nt-aio-viber-popup
.nt-aio-popup-header
.nt-aio-popup-title-icon {
background-image: url(//procoding.rs/wp-content/plugins/support-chat/assets/home/images/viber.svg);
background-size: 22px 22px;
}
#wp-nt-aio-wrapper .nt-aio-popup.nt-aio-phone-popup .nt-aio-popup-header {
background: #ff5a00;
}
#wp-nt-aio-wrapper
.nt-aio-popup.nt-aio-phone-popup
.nt-aio-popup-header
.nt-aio-popup-title-icon {
background-image: url(//procoding.rs/wp-content/plugins/support-chat/assets/home/images/phone-receiver.svg);
background-size: 22px 22px;
}
#wp-nt-aio-wrapper .nt-aio-popup.nt-aio-email-popup .nt-aio-popup-header {
background: #3a68fe;
}
#wp-nt-aio-wrapper
.nt-aio-popup.nt-aio-email-popup
.nt-aio-popup-header
.nt-aio-popup-title-icon {
background-image: url(//procoding.rs/wp-content/plugins/support-chat/assets/home/images/close-envelope.svg);
background-size: 22px 22px;
}
#wp-nt-aio-wrapper .nt-aio-popup.nt-aio-telegram-popup .nt-aio-popup-header {
background: #089be5;
}
#wp-nt-aio-wrapper
.nt-aio-popup.nt-aio-telegram-popup
.nt-aio-popup-header
.nt-aio-popup-title-icon {
background-image: url(//procoding.rs/wp-content/plugins/support-chat/assets/home/images/telegram.svg);
background-size: 22px 22px;
}
#wp-nt-aio-wrapper .nt-aio-popup.nt-aio-skype-popup .nt-aio-popup-header {
background: #00a8f4;
}
#wp-nt-aio-wrapper
.nt-aio-popup.nt-aio-skype-popup
.nt-aio-popup-header
.nt-aio-popup-title-icon {
background-image: url(//procoding.rs/wp-content/plugins/support-chat/assets/home/images/skype.svg);
background-size: 22px 22px;
}
#wp-nt-aio-wrapper .nt-aio-popup.nt-aio-custom-app-popup .nt-aio-popup-header {
background: var(--backgroundColorCustomApp);
}
#wp-nt-aio-wrapper
.nt-aio-popup.nt-aio-custom-app-popup
.nt-aio-popup-header
.nt-aio-popup-title-icon {
background-image: var(--backgroundIconCustomApp);
background-size: 22px 22px;
}
@media (max-width: 480px) {
#wp-nt-aio-wrapper .nt-aio-popup {
position: fixed;
bottom: auto;
top: 0;
right: 0;
padding: 30px 15px 100px;
width: 100%;
height: 100%;
background: rgba(0, 0, 0, 0.6);
overflow: visible;
border-radius: 0;
-webkit-border-radius: 0;
-moz-border-radius: 0;
}
#wp-nt-aio-wrapper .nt-aio-popup .nt-aio-popup-header {
position: relative;
}
#wp-nt-aio-wrapper .nt-aio-popup .nt-aio-popup-content {
position: relative;
max-height: calc(100% - 45px);
overflow: auto;
}
}
#wp-nt-aio-wrapper.nt-aio-active .nt-aio-active {
-webkit-box-shadow: 0 4px 15px 0 rgba(0, 0, 0, 0.35);
box-shadow: 0 4px 15px 0 rgba(0, 0, 0, 0.35);
}
#wp-nt-aio-wrapper.nt-aio-active .nt-aio-active:before {
opacity: 0;
-ms-transform: scale(0) rotate(1turn);
transform: scale(0) rotate(1turn);
-webkit-transform: scale(0) rotate(1turn);
-moz-transform: scale(0) rotate(1turn);
}
#wp-nt-aio-wrapper.nt-aio-active .nt-aio-active:after {
opacity: 1;
-ms-transform: scale(1) rotate(0deg);
transform: scale(1) rotate(0deg);
-webkit-transform: scale(1) rotate(0deg);
-moz-transform: scale(1) rotate(0deg);
}
#wp-nt-aio-wrapper.nt-aio-show-list .nt-aio-content .nt-aio-item {
visibility: visible;
opacity: 1;
}
#wp-nt-aio-wrapper.nt-aio-show-list .nt-aio-content .nt-aio-item:first-child {
-webkit-transform: translateY(-70px);
-ms-transform: translateY(-70px);
transform: translateY(-70px);
}
#wp-nt-aio-wrapper.nt-aio-show-list .nt-aio-content .nt-aio-item:nth-child(2) {
-webkit-transform: translateY(-140px);
-ms-transform: translateY(-140px);
transform: translateY(-140px);
}
#wp-nt-aio-wrapper.nt-aio-show-list .nt-aio-content .nt-aio-item:nth-child(3) {
-webkit-transform: translateY(-210px);
-ms-transform: translateY(-210px);
transform: translateY(-210px);
}
#wp-nt-aio-wrapper.nt-aio-show-list .nt-aio-content .nt-aio-item:nth-child(4) {
-webkit-transform: translateY(-280px);
-ms-transform: translateY(-280px);
transform: translateY(-280px);
}
#wp-nt-aio-wrapper.nt-aio-show-list .nt-aio-content .nt-aio-item:nth-child(5) {
-webkit-transform: translateY(-350px);
-ms-transform: translateY(-350px);
transform: translateY(-350px);
}
#wp-nt-aio-wrapper.nt-aio-show-list .nt-aio-content .nt-aio-item:nth-child(6) {
-webkit-transform: translateY(-420px);
-ms-transform: translateY(-420px);
transform: translateY(-420px);
}
#wp-nt-aio-wrapper.nt-aio-show-list .nt-aio-content .nt-aio-item:nth-child(7) {
-webkit-transform: translateY(-490px);
-ms-transform: translateY(-490px);
transform: translateY(-490px);
}
#wp-nt-aio-wrapper.nt-aio-show-list .nt-aio-content .nt-aio-item:nth-child(8) {
-webkit-transform: translateY(-560px);
-ms-transform: translateY(-560px);
transform: translateY(-560px);
}
#wp-nt-aio-wrapper.nt-aio-show-list .nt-aio-content .nt-aio-item:nth-child(9) {
-webkit-transform: translateY(-630px);
-ms-transform: translateY(-630px);
transform: translateY(-630px);
}
#wp-nt-aio-wrapper.nt-aio-show-list .nt-aio-content .nt-aio-item:nth-child(10) {
-webkit-transform: translateY(-700px);
-ms-transform: translateY(-700px);
transform: translateY(-700px);
}
#wp-nt-aio-wrapper.nt-aio-show-list
.nt-aio-content
.nt-aio-item
.nt-aio-item-icon {
-webkit-box-shadow: 0 2px 7px 0 rgba(0, 0, 0, 0.19);
box-shadow: 0 2px 7px 0 rgba(0, 0, 0, 0.19);
}
#wp-nt-aio-wrapper.nt-aio-show-popup .nt-aio-content {
display: none;
}
#wp-nt-aio-wrapper.nt-aio-show-popup .nt-aio-popup-active {
visibility: visible;
opacity: 1;
-ms-transform: translateY(0);
transform: translateY(0);
-webkit-transform: translateY(0);
-moz-transform: translateY(0);
-webkit-box-shadow: -3px 20px 20px 0 rgba(0, 0, 0, 0.1);
box-shadow: -3px 20px 20px 0 rgba(0, 0, 0, 0.1);
}
#nt-aio-popup-line .nt-aio-popup-content {
overflow: hidden;
}
#nt-aio-popup-line .nt-aio-popup-content iframe {
border: none;
height: 490px;
margin-top: -115px;
overflow: hidden;
width: 300px;
}
#nt-aio-popup-custom-app .nt-aio-popup-content a,
#nt-aio-popup-email .nt-aio-popup-content a,
#nt-aio-popup-phone .nt-aio-popup-content a,
#nt-aio-popup-skype .nt-aio-popup-content a,
#nt-aio-popup-telegram .nt-aio-popup-content a,
#nt-aio-popup-viber .nt-aio-popup-content a,
#nt-aio-popup-whatsapp .nt-aio-popup-content a,
#nt-aio-popup-zalo .nt-aio-popup-content a,
#nt-aio-popup-wechat .nt-aio-popup-content a,
#nt-aio-popup-kakaotalk .nt-aio-popup-content a {
display: block;
font-size: 19px;
font-weight: 700;
padding: 0;
word-break: break-all;
text-align: center;
}
#nt-aio-popup-custom-app .nt-aio-popup-content a:focus,
#nt-aio-popup-email .nt-aio-popup-content a:focus,
#nt-aio-popup-phone .nt-aio-popup-content a:focus,
#nt-aio-popup-skype .nt-aio-popup-content a:focus,
#nt-aio-popup-telegram .nt-aio-popup-content a:focus,
#nt-aio-popup-viber .nt-aio-popup-content a:focus {
outline: none;
}
#nt-aio-popup-snapchat .nt-aio-popup-content {
text-align: center;
}
#nt-aio-popup-snapchat .nt-aio-popup-content .content-snapchat-name {
font-size: 20px;
font-weight: 700;
}
@media (max-height: 767px) {
#wp-nt-aio-wrapper .nt-aio-active:after {
background-size: 14px 14px;
}
#wp-nt-aio-wrapper {
--backgroundSize: 25px 25px;
}
#wp-nt-aio-wrapper .nt-aio-active,
#wp-nt-aio-wrapper .nt-aio-content .nt-aio-item-icon {
width: 44px;
height: 44px;
background-size: 25px 25px !important;
}
#wp-nt-aio-wrapper.nt-aio-show-list .nt-aio-content .nt-aio-item:first-child {
-webkit-transform: translateY(-50px);
-ms-transform: translateY(-50px);
transform: translateY(-50px);
}
#wp-nt-aio-wrapper.nt-aio-show-list
.nt-aio-content
.nt-aio-item:nth-child(2) {
-webkit-transform: translateY(-100px);
-ms-transform: translateY(-100px);
transform: translateY(-100px);
}
#wp-nt-aio-wrapper.nt-aio-show-list
.nt-aio-content
.nt-aio-item:nth-child(3) {
-webkit-transform: translateY(-150px);
-ms-transform: translateY(-150px);
transform: translateY(-150px);
}
#wp-nt-aio-wrapper.nt-aio-show-list
.nt-aio-content
.nt-aio-item:nth-child(4) {
-webkit-transform: translateY(-200px);
-ms-transform: translateY(-200px);
transform: translateY(-200px);
}
#wp-nt-aio-wrapper.nt-aio-show-list
.nt-aio-content
.nt-aio-item:nth-child(5) {
-webkit-transform: translateY(-250px);
-ms-transform: translateY(-250px);
transform: translateY(-250px);
}
#wp-nt-aio-wrapper.nt-aio-show-list
.nt-aio-content
.nt-aio-item:nth-child(6) {
-webkit-transform: translateY(-300px);
-ms-transform: translateY(-300px);
transform: translateY(-300px);
}
#wp-nt-aio-wrapper.nt-aio-show-list
.nt-aio-content
.nt-aio-item:nth-child(7) {
-webkit-transform: translateY(-350px);
-ms-transform: translateY(-350px);
transform: translateY(-350px);
}
#wp-nt-aio-wrapper.nt-aio-show-list
.nt-aio-content
.nt-aio-item:nth-child(8) {
-webkit-transform: translateY(-400px);
-ms-transform: translateY(-400px);
transform: translateY(-400px);
}
#wp-nt-aio-wrapper.nt-aio-show-list
.nt-aio-content
.nt-aio-item:nth-child(9) {
-webkit-transform: translateY(-450px);
-ms-transform: translateY(-450px);
transform: translateY(-450px);
}
#wp-nt-aio-wrapper.nt-aio-show-list
.nt-aio-content
.nt-aio-item:nth-child(10) {
-webkit-transform: translateY(-500px);
-ms-transform: translateY(-500px);
transform: translateY(-500px);
}
} #wp-nt-aio-wrapper .nt-aio-item .nt-aio-zalo {
background: #00b1ff url(//procoding.rs/wp-content/plugins/support-chat/assets/home/images/zalo.svg) 50% no-repeat;
}
#wp-nt-aio-wrapper .nt-aio-popup .nt-aio-zalo-popup .nt-aio-popup-header {
background: #f5f5f5;
color: #434a54;
}
#wp-nt-aio-wrapper
.nt-aio-popup
.nt-aio-zalo-popup
.nt-aio-popup-header
.nt-aio-popup-title-icon {
background-image: url(//procoding.rs/wp-content/plugins/support-chat/assets/home/images/zalo.svg);
background-size: 22px 22px;
}
#nt-aio-popup-zalo .nt-aio-popup-content {
text-align: center;
}
#nt-aio-popup-zalo .nt-aio-popup-content .content-zalo-name {
font-size: 20px;
font-weight: 700;
} #wp-nt-aio-wrapper .nt-aio-item .nt-aio-kakaotalk {
background: yellow url(//procoding.rs/wp-content/plugins/support-chat/assets/home/images/kakaotalk.svg) 50% no-repeat;
}
#wp-nt-aio-wrapper .nt-aio-popup .nt-aio-kakaotalk-popup .nt-aio-popup-header {
background: black;
color: yellow;
}
#wp-nt-aio-wrapper
.nt-aio-popup
.nt-aio-kakaotalk-popup
.nt-aio-popup-header
.nt-aio-popup-title-icon {
background-image: url(//procoding.rs/wp-content/plugins/support-chat/assets/home/images/kakaotalk.svg);
background-size: 22px 22px;
}
#nt-aio-popup-kakaotalk .nt-aio-popup-content {
text-align: center;
}
#nt-aio-popup-kakaotalk .nt-aio-popup-content .content-kakaotalk-name {
font-size: 20px;
font-weight: 700;
} #wp-nt-aio-wrapper .nt-aio-item .nt-aio-wechat {
background: green url(//procoding.rs/wp-content/plugins/support-chat/assets/home/images/wechat.svg) 50% no-repeat;
}
#wp-nt-aio-wrapper .nt-aio-popup .nt-aio-wechat-popup .nt-aio-popup-header {
background: green;
color: white;
}
#wp-nt-aio-wrapper
.nt-aio-popup
.nt-aio-wechat-popup
.nt-aio-popup-header
.nt-aio-popup-title-icon {
background-image: url(//procoding.rs/wp-content/plugins/support-chat/assets/home/images/wechat.svg);
background-size: 22px 22px;
}
#nt-aio-popup-wechat .nt-aio-popup-content {
text-align: center;
}
#nt-aio-popup-wechat .nt-aio-popup-content .content-wechat-name {
font-size: 20px;
font-weight: 700;
}:root { --font-naslov: "Bricolage Grotesque", "Hanken Grotesk", -apple-system, sans-serif;
--font-tekst: "Hanken Grotesk", -apple-system, "Segoe UI", sans-serif; --mera: 58ch; --prelom-usko: 640px;
--prelom-srednje: 980px;
--prelom-siroko: 1240px; --podloga: #ffffff;
--podloga-mirna: #f2f6f9;
--podloga-tamna: #2d3e50;
--tekst: #2d3e50; --tekst-blagi: #5c6f82; --tekst-na-tamnom: #e8eef4;
--tekst-na-tamnom-blagi: #b9c9d8;
--akcenat: #0398db; --akcenat-tamni: #0272a6;  --dugme-podloga: #0272a6; --dugme-podloga-jaca: #01608c; --istaknuto: #ffc94a;  --tekst-na-zutom: #3d4d5e;  --radius-polje: 14px;
--greska: #c0392b;
--istaknuto-jaci: #ffd977;
--crta: rgba(45, 62, 80, .12);
--crta-jaka: rgba(45, 62, 80, .28); --bela: #ffffff;
--mrak: #0b1219; --tekst-na-tamnom-jaci: #dce6ee;
--tekst-na-tamnom-mekan: #cfdce7;
--tekst-blagi-tamniji: #3d4f61;
--dugme-na-zutom-jaci: #1d2b3a; --blok-dogadjaj: #ffbf00;
--blok-kontrola: #ff8c1a;
--blok-kretanje: #4c97ff;
--blok-podaci:   #ff8c1a;
--blok-zvuk:     #cf63cf;
--blok-meki:     #ffeaba;  --veo-heroj-usp: linear-gradient(180deg, rgba(45, 62, 80, .08) 0%, rgba(45, 62, 80, .30) 42%, rgba(45, 62, 80, .86) 100%);
--veo-heroj-vod: linear-gradient(90deg, rgba(45, 62, 80, .52) 0%, rgba(45, 62, 80, .12) 56%, rgba(45, 62, 80, 0) 100%);
--veo-kartice:   linear-gradient(180deg, rgba(45, 62, 80, 0) 28%, rgba(45, 62, 80, .90) 100%); --traka: 1240px;
--traka-ivica: 24px;
--radius-kartica: 20px;
--radius-ram: 28px;  --prsten: var(--akcenat-tamni); --prelaz-teme: .3s; --sidro-odmak: 104px; --ritam-mali: 56px;
--ritam: 80px;
--ritam-veliki: 112px;
}
@media (min-width: 641px) {
:root { --traka-ivica: 40px; }
}
@media (max-width: 980px) {
:root {
--ritam-mali: 44px;
--ritam: 64px;
--ritam-veliki: 88px;
}
} [data-tema="tamna"] {
--podloga: #141c26;
--podloga-mirna: #1b2430;
--podloga-tamna: #0e141c;
--tekst: #e8eef4;
--tekst-blagi: #9fb0c0;
--tekst-na-tamnom: #e8eef4;
--tekst-na-tamnom-blagi: #9fb0c0;
--akcenat: #29a9e6;
--akcenat-tamni: #4fbcee;
--dugme-podloga: #29a9e6; --dugme-podloga-jaca: #4fbcee; --greska: #ff9a8d; --istaknuto: #f0b83a;
--istaknuto-jaci: #ffc94a;
--crta: rgba(232, 238, 244, .13);
--crta-jaka: rgba(232, 238, 244, .34);
}@font-face {
font-family: "Bricolage Grotesque";
font-style: normal;
font-weight: 400 800;
font-stretch: 100%;
font-display: swap;
src: url(//procoding.rs/wp-content/themes/procoding-nova/fontovi/bricolage-grotesque-latin-ext.woff2) format("woff2");
unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
font-family: "Bricolage Grotesque";
font-style: normal;
font-weight: 400 800;
font-stretch: 100%;
font-display: swap;
src: url(//procoding.rs/wp-content/themes/procoding-nova/fontovi/bricolage-grotesque-latin.woff2) format("woff2");
unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
} @font-face {
font-family: "Hanken Grotesk";
font-style: normal;
font-weight: 400 700;
font-display: swap;
src: url(//procoding.rs/wp-content/themes/procoding-nova/fontovi/hanken-grotesk-latin-ext.woff2) format("woff2");
unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
font-family: "Hanken Grotesk";
font-style: normal;
font-weight: 400 700;
font-display: swap;
src: url(//procoding.rs/wp-content/themes/procoding-nova/fontovi/hanken-grotesk-latin.woff2) format("woff2");
unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}@view-transition {
navigation: auto;
} ::view-transition-old(root),
::view-transition-new(root) {
animation-duration: .22s;
animation-timing-function: cubic-bezier(.4, 0, .2, 1);
} @media (prefers-reduced-motion: reduce) {
::view-transition-old(root),
::view-transition-new(root) {
animation: none;
}
} *,
*::before,
*::after { box-sizing: border-box; } html { -webkit-tap-highlight-color: transparent; } body {
margin: 0;
min-height: 100vh;
display: flex;
flex-direction: column;
background: var(--podloga);
color: var(--tekst);
font-family: var(--font-tekst);
font-size: 17px;
line-height: 1.6;
-webkit-font-smoothing: antialiased;
}
.podnozje { margin-top: auto; } h1, h2, h3, h4 {
font-family: var(--font-naslov);
font-weight: 800;
line-height: 1.08;
letter-spacing: -.015em;
text-wrap: balance;
margin: 0 0 .5em;
}
h1 { font-size: clamp(2.1rem, 1.3rem + 2.9vw, 3.5rem); }
h2 { font-size: clamp(1.7rem, 1.2rem + 1.9vw, 2.5rem); }
h3 { font-size: clamp(1.15rem, 1.05rem + .45vw, 1.375rem); font-weight: 700; letter-spacing: -.008em; }
h4 { font-size: 1.0625rem; font-weight: 700; letter-spacing: 0; }
p { margin: 0 0 1em; max-width: var(--mera); }
a { color: inherit; text-underline-offset: .18em; }
img { max-width: 100%; height: auto; display: block; } [hidden] { display: none !important; } .nad {
margin: 0 0 12px;
font-size: 15px;
font-weight: 700;
letter-spacing: .06em;
text-transform: uppercase;
color: var(--akcenat-tamni);
}
.uvod {
font-size: 19px;
color: var(--tekst-blagi);
max-width: 52ch;
} .samo-citac {
position: absolute;
width: 1px;
height: 1px;
margin: -1px;
padding: 0;
border: 0;
overflow: hidden;
white-space: nowrap;
clip-path: inset(50%);
} .preskoci {
position: absolute;
left: -9999px;
top: 0;
z-index: 100;
padding: 12px 18px;
background: var(--podloga-tamna);
color: var(--bela);
border-radius: 0 0 10px 0;
}
.preskoci:focus { left: 0; }  .traka {
width: 100%;
max-width: var(--traka);
margin-inline: auto;
padding-inline: var(--traka-ivica);
} .sekcija { padding-block: var(--ritam); }
.sekcija--mali { padding-block: var(--ritam-mali); }
.sekcija--veliki { padding-block: var(--ritam-veliki); }
.sekcija--mirna { background: var(--podloga-mirna); }
.sekcija--tamna {
background: var(--podloga-tamna); --prsten: var(--istaknuto);
color: var(--tekst-na-tamnom);
}
.sekcija--tamna h1,
.sekcija--tamna h2,
.sekcija--tamna h3 { color: var(--bela); }
.sekcija--tamna .nad { color: var(--istaknuto); }
.sekcija--tamna .uvod { color: var(--tekst-na-tamnom-blagi); } .sekcija--zuta {
background: var(--istaknuto);
color: var(--podloga-tamna);
}
.sekcija--zuta h1,
.sekcija--zuta h2,
.sekcija--zuta h3 { color: var(--podloga-tamna); }
.sekcija--zuta .nad { color: var(--podloga-tamna); }
.sekcija--zuta .uvod { color: var(--tekst-na-zutom); } .dugme {
display: inline-flex;
align-items: center;
justify-content: center;
gap: 10px;
min-height: 54px;
padding: 0 30px;
border: 2px solid transparent;
border-radius: 999px;
background: var(--dugme-podloga);
color: var(--bela);
font: 700 18px/1 var(--font-tekst);
text-decoration: none;
cursor: pointer;
transition: background .18s ease, border-color .18s ease, color .18s ease;
}
.dugme--sporedno {
background: transparent;
color: var(--tekst);
border-color: var(--crta-jaka);
} .dugme--na-tamnom {
background: var(--istaknuto);
color: var(--podloga-tamna);
} .dugme--na-zutom {
background: var(--podloga-tamna);
color: var(--bela);
}
.dugme--malo {
min-height: 44px;
padding: 0 22px;
font-size: 16px;
} [data-tema="tamna"] .dugme { color: var(--mrak); }
[data-tema="tamna"] .dugme--sporedno { color: var(--tekst); background: transparent; }
[data-tema="tamna"] .dugme--na-zutom { color: var(--bela); }
@media (hover: hover) {
.dugme:hover { background: var(--dugme-podloga-jaca); }
.dugme--sporedno:hover { background: transparent; border-color: var(--tekst); }
.dugme--na-tamnom:hover { background: var(--istaknuto-jaci); }
.dugme--na-zutom:hover { background: var(--dugme-na-zutom-jaci); }
} .kartica {
display: flex;
flex-direction: column;
background: var(--podloga);
border: 1px solid var(--crta);
border-radius: var(--radius-kartica);
overflow: hidden;
text-decoration: none;
color: inherit;
transition: border-color .18s ease, transform .18s ease;
}
[data-tema="tamna"] .kartica { background: var(--podloga-mirna); }
.kartica__slika {
width: 100%;
aspect-ratio: 16 / 10;
object-fit: cover;
} .kartica__naslov {
margin: 0 0 8px;
font-size: 1.15rem;
line-height: 1.2;
} .kartica .kartica__oznake {
display: flex;
flex-wrap: wrap;
gap: 8px;
max-width: none;
margin: 0 0 12px;
} .kartica .kartica__oznake .bedz { margin-bottom: 0; }
.kartica__telo {
display: flex;
flex-direction: column;
flex: 1;
padding: 22px 22px 24px;
}
.kartica__telo p {
margin-bottom: 18px;
font-size: 16px;
color: var(--tekst-blagi);
}
.kartica__dno {
margin-top: auto;
font-size: 16px;
font-weight: 700;
color: var(--akcenat-tamni);
}
@media (hover: hover) {
.kartica:hover {
border-color: var(--akcenat-tamni);
transform: translateY(-2px);
} div.kartica:hover {
border-color: var(--crta);
transform: none;
}
} .bedz {
align-self: flex-start;
display: inline-block;
margin-bottom: 12px;
padding: 5px 12px;
border-radius: 999px;
background: var(--istaknuto);
color: var(--podloga-tamna);
font-size: 14px;
font-weight: 700;
} .bedz--tih {
background: transparent;
border: 1px solid var(--crta-jaka);
color: var(--tekst-blagi);
} .mreza {
display: grid;
gap: 28px;
grid-template-columns: repeat(4, 1fr);
}
.mreza--3 { grid-template-columns: repeat(3, 1fr); }
.mreza--2 { grid-template-columns: repeat(2, 1fr); }
@media (max-width: 980px) {
.mreza,
.mreza--3 { grid-template-columns: repeat(2, 1fr); gap: 20px; }
}
@media (max-width: 640px) {
.mreza,
.mreza--3,
.mreza--2 { grid-template-columns: 1fr; }
}   @media (max-width: 980px) {
body, p, li, td, th, label, input, textarea, select, button, small {
font-size: max(14px, 1em);
}
} @media (pointer: coarse) {
a, button, [role="button"], input[type="submit"] {
min-height: 44px;
display: inline-flex;
align-items: center;
}
}
@media (prefers-reduced-motion: reduce) {
*, *::before, *::after {
animation-duration: .01ms !important;
animation-iteration-count: 1 !important;
transition-duration: .01ms !important;
scroll-behavior: auto !important;
}
}  #sadrzaj .sekcija--prva,
#sadrzaj > .sekcija:first-child,
#sadrzaj > .objava:first-child { padding-top: var(--vrh-strane); }
:root { --vrh-strane: clamp(16px, 1.4vw, 24px); } .sekcija--posle-uvoda { padding-top: 40px; } #sadrzaj [id] { scroll-margin-top: var(--sidro-odmak); } #sadrzaj .veza {
display: inline-flex;
align-items: center;
color: var(--akcenat-tamni);
font-weight: 700;
text-decoration: underline;
text-underline-offset: .18em;
} :where(.veza, .putanja a, .koraci__telefon) {
display: inline-flex;
align-items: center;
min-height: 44px;
margin-block: calc((1lh - 44px) / 2);
} #sadrzaj :is(p, li) > a:only-child:not([class]) {
display: inline-flex;
align-items: center;
min-height: 44px;
margin-block: calc((1lh - 44px) / 2);
} .post-password-form input[type="password"],
.post-password-form input[type="submit"] {
min-height: 44px;
padding: 10px 16px;
border-radius: var(--radius-polje);
font: inherit;
}
.post-password-form input[type="password"] {
border: 2px solid var(--crta-jaka);
background: var(--podloga);
color: var(--tekst);
}
.post-password-form input[type="submit"] {
border: 0;
background: var(--dugme-podloga);
color: var(--bela);
font-weight: 700;
cursor: pointer;
}
@media (hover: hover) {
.post-password-form input[type="submit"]:hover { background: var(--dugme-podloga-jaca); }
}
@media (hover: hover) {
.veza:hover { color: var(--akcenat-tamni); }
}
.sekcija--tamna .veza { color: var(--istaknuto); }  .zmija {
position: relative;
height: 300px;
margin-top: 56px;
} .zmija__talas {
position: absolute;
left: 6%;
right: 6%;
top: 60px;
height: 140px;
}
.zmija__talas svg {
display: block;
width: 100%;
height: 100%;
} .zmija__korak {
position: absolute;
width: 168px;
transform: translateX(-50%);
text-align: center;
color: inherit;
text-decoration: none;
} .zmija--gusta .zmija__korak { width: 150px; }
.zmija__tacka {
width: 56px;
height: 56px;
margin: 0 auto; display: grid;
place-items: center;
border-radius: 999px;
border: 3px solid var(--akcenat);
background: var(--podloga); color: var(--akcenat-tamni);
font: 800 20px/50px var(--font-naslov); text-align: center;
transition: background .18s ease, border-color .18s ease, color .18s ease,
translate .18s ease;
} .zmija__ikona { width: 36px;
height: 34px;
object-fit: contain;
}
.zmija__tacka > svg {
width: auto;
height: 34px;
} .zmija__natpis b { display: block; font: 700 16px/1.25 var(--font-tekst); }
.zmija__natpis span { font-size: 14px; color: var(--tekst-blagi); } .zmija__korak--gore { top: 46px; }
.zmija__korak--gore .zmija__natpis {
position: absolute;
left: 0;
right: 0;
bottom: 100%;
margin-bottom: 10px;
}
.zmija__korak--dole { top: 158px; }
.zmija__korak--dole .zmija__natpis { margin-top: 10px; } a.zmija__korak:focus-visible {
outline: 3px solid var(--akcenat);
outline-offset: 4px;
border-radius: 12px;
} @media (hover: hover) {
a.zmija__korak:hover .zmija__tacka {
border-color: var(--akcenat-tamni);
translate: 0 -2px;
}
a.zmija__korak:hover .zmija__natpis b { text-decoration: underline; }
} @media (max-width: 900px) {
.zmija {
display: grid;
gap: 18px;
height: auto;
margin-top: 8px;
}
.zmija__talas { display: none; } .zmija__korak,
.zmija--gusta .zmija__korak {
position: static;
display: grid;
grid-template-columns: 56px 1fr;
gap: 16px;
align-items: center;
width: auto;
transform: none;
text-align: left;
}
.zmija__korak--gore .zmija__natpis,
.zmija__korak--dole .zmija__natpis {
position: static;
margin: 0;
}  .zmija__tacka { position: relative; }
.zmija__korak:not(:last-child) .zmija__tacka::after {
content: "";
position: absolute;
top: 100%;
left: 50%;
width: 3px;
height: 18px;
margin-left: -1.5px; background: currentColor;
opacity: .28;
}
} .pc-pokret .pc-ulaz {
opacity: 0;
translate: 0 18px;
transition:
opacity .5s cubic-bezier(.16, 1, .3, 1),
translate .5s cubic-bezier(.16, 1, .3, 1);
transition-delay: calc(var(--pc-red, 0) * 60ms);
}
.pc-pokret .pc-ulaz.pc-javi {
opacity: 1;
translate: none;
} @media (prefers-reduced-motion: reduce) {
.pc-pokret .pc-ulaz {
opacity: 1;
translate: none;
transition: none;
}
} main[tabindex="-1"]:focus { outline: none; } :where(a, button, summary, input, select, textarea, [tabindex]:not([tabindex="-1"])):focus-visible {
outline: 3px solid var(--prsten);
outline-offset: 2px;
}  .dugme--na-tamnom { --prsten: var(--istaknuto); } .poziv-traka { display: none; } html.izgled-novi:not([data-tema="tamna"]) body,
html:not([data-tema="tamna"]) body.izgled-podloga {
--podloga-strane: #f3f6f9;
--podloga-mirna: #e8eef4;
}
html.izgled-novi body,
body.izgled-podloga { background: var(--podloga-strane, var(--podloga)); } html.izgled-novi body.single-post,
body.izgled-podloga.single-post { background: var(--podloga); } :is(html.izgled-novi, body.izgled-pojas) #sadrzaj .uvod-strane {
background: var(--podloga-tamna);
color: var(--tekst-na-tamnom);
--prsten: var(--istaknuto);
padding-block: clamp(36px, 4.5vw, 64px);
}
:is(html.izgled-novi, body.izgled-pojas) #sadrzaj .uvod-strane :is(h1, h2) { color: var(--bela); }
:is(html.izgled-novi, body.izgled-pojas) #sadrzaj .uvod-strane :is(p, .uvod) { color: var(--tekst-na-tamnom-blagi); }
:is(html.izgled-novi, body.izgled-pojas) #sadrzaj .uvod-strane .nad { color: var(--istaknuto); }
:is(html.izgled-novi, body.izgled-pojas) #sadrzaj .sekcija--posle-uvoda { padding-top: var(--ritam-mali); } :is(html.izgled-novi, body.izgled-pojas) #sadrzaj :is(.blog > .traka > h1, .prijava__zaglavlje, .pitanja .kurs-zaglavlje, .spisak__vrh) {
border-image: linear-gradient(var(--podloga-tamna) 0 0) fill 0 / / 0 100vw;
margin-top: calc(-1 * var(--vrh-strane));
padding-block: clamp(32px, 4vw, 56px);
margin-bottom: clamp(28px, 3vw, 40px);
color: var(--tekst-na-tamnom);
--prsten: var(--istaknuto);
}
:is(html.izgled-novi, body.izgled-pojas) #sadrzaj :is(.blog > .traka > h1, .prijava__zaglavlje h1, .pitanja .kurs-zaglavlje h1, .spisak__vrh h1) { color: var(--bela); }
:is(html.izgled-novi, body.izgled-pojas) #sadrzaj :is(.prijava__zaglavlje, .spisak__vrh) p:not(.nad) { color: var(--tekst-na-tamnom-blagi); }
:is(html.izgled-novi, body.izgled-pojas) #sadrzaj :is(.prijava__zaglavlje, .spisak__vrh) .nad { color: var(--istaknuto); } :is(html.izgled-novi, body.izgled-pojas) #sadrzaj .kontakt-vrh {
background: var(--podloga);
padding-bottom: var(--ritam-mali);
} :is(html.izgled-novi, body.izgled-pojas) #sadrzaj .kurs-uvod {
background: var(--podloga);
padding-bottom: var(--ritam-mali);
} :is(html.izgled-novi, body.izgled-poziv) .poziv-traka {
display: block;
background: var(--istaknuto);
color: var(--podloga-tamna);
padding-block: clamp(32px, 4vw, 52px);
--prsten: var(--podloga-tamna);
}
.poziv-traka__traka {
display: flex;
flex-wrap: wrap;
align-items: center;
justify-content: space-between;
gap: 20px 40px;
}
.poziv-traka__naslov {
margin: 0;
color: var(--podloga-tamna);
font-size: clamp(24px, 2.4vw, 32px);
}
.poziv-traka__tekst {
margin: 8px 0 0;
max-width: 56ch;
color: var(--tekst-na-zutom);
}
.poziv-traka__dugmad { display: flex; flex-wrap: wrap; gap: 12px; }
.poziv-traka .poziv-traka__kodi {
color: var(--podloga-tamna);
border-color: var(--podloga-tamna);
}
.poziv-traka .poziv-traka__kodi:hover { background: rgba(45, 62, 80, .08); }.zaglavlje {
position: sticky;
top: 0;
z-index: 50;
border-bottom: 1px solid var(--crta); background: var(--podloga);
background: color-mix(in srgb, var(--podloga) 92%, transparent);
backdrop-filter: blur(10px); view-transition-name: pc-zaglavlje;
}
.zaglavlje__traka {
display: flex;
align-items: center;
gap: 16px;
min-height: 76px;
}
.logo {
display: flex;
align-items: center;
margin-right: auto; min-height: 44px;
} .logo-slojevi {
display: grid;
}
.logo-slojevi > img { grid-area: 1 / 1; }
.logo-slika {
height: 46px;
width: auto; object-fit: contain;
object-position: left center;
} @media (min-width: 980px) {
.logo-slika { height: 60px; }
}
.logo__tekst { font: 800 1.35rem/1 var(--font-naslov); } [data-tema="tamna"] .logo-slika--tekst { filter: brightness(0) invert(1); } .meni {
display: flex;
align-items: center;
gap: 14px;
}
.meni__stavke {
display: flex;
align-items: center;
gap: 28px;
}
.meni__stavke a {
position: relative;
display: inline-flex;
align-items: center;
justify-content: center;
min-height: 44px; min-width: 44px;
color: var(--tekst);
font-size: 16px;
font-weight: 600;
text-decoration: none;
transition: color .18s ease;
}
.meni__stavke a[aria-current] { color: var(--akcenat-tamni); } .meni__stavke a[aria-current]::after {
content: "";
position: absolute;
left: 0;
right: 0;
bottom: 9px;
border-bottom: 3px solid var(--akcenat);
}
@media (hover: hover) {
.meni__stavke a:hover { color: var(--akcenat-tamni); }
}
.meni__stavke a:focus-visible,
.tema-prekidac:focus-visible,
.zaglavlje__prekidac:focus-visible,
.podnozje a:focus-visible {
outline: 3px solid var(--akcenat);
outline-offset: 2px;
} .tema-prekidac,
.zaglavlje__prekidac {
display: inline-flex;
align-items: center;
justify-content: center;
flex: 0 0 auto;
width: 44px;
height: 44px;
padding: 0;
border: 1px solid var(--crta-jaka);
border-radius: 999px;
background: transparent;
color: var(--tekst);
cursor: pointer;
transition: border-color .18s ease, color .18s ease;
}
@media (hover: hover) {
.tema-prekidac:hover,
.zaglavlje__prekidac:hover { border-color: var(--tekst); }
}  .zaglavlje__prekidac { display: none; }
.zaglavlje__prekidac span,
.zaglavlje__prekidac span::before,
.zaglavlje__prekidac span::after {
display: block;
width: 18px;
height: 2px;
border-radius: 2px;
background: currentColor;
transition: transform .18s ease, background .18s ease;
}
.zaglavlje__prekidac span::before { content: ""; transform: translateY(-6px); }
.zaglavlje__prekidac span::after { content: ""; transform: translateY(4px); } .zaglavlje__prekidac[aria-expanded="true"] span { background: transparent; }
.zaglavlje__prekidac[aria-expanded="true"] span::before { transform: rotate(45deg); }
.zaglavlje__prekidac[aria-expanded="true"] span::after { transform: rotate(-45deg); } @media (max-width: 980px) { .meni__stavke { flex-wrap: wrap; gap: 16px; }
.meni__stavke a[aria-current]::after { display: none; }
.ima-js .zaglavlje__prekidac { display: inline-flex; }
.ima-js .zaglavlje__prekidac[aria-expanded="false"] + .meni .meni__stavke { display: none; }
.ima-js .zaglavlje__prekidac[aria-expanded="true"] + .meni .meni__stavke {
position: absolute;
left: 0;
right: 0;
top: 100%;
flex-direction: column;
align-items: stretch;
gap: 0;
padding: 6px var(--traka-ivica) 14px;
background: var(--podloga);
border-bottom: 1px solid var(--crta);
}
} @media (max-width: 640px) {
.zaglavlje__traka {
gap: 10px;
padding-inline: 16px;
} .meni { gap: 8px; }
.meni .dugme {
padding-inline: 14px;
font-size: 15px;
}
} .podnozje {
background: var(--podloga-tamna); --prsten: var(--istaknuto);
color: var(--tekst-na-tamnom-blagi);
padding-block: 32px 0; view-transition-name: pc-podnozje;
}
.podnozje__traka {
display: flex;
align-items: center;
flex-wrap: wrap;
gap: 20px 40px;
}  .podnozje__veze {
display: flex;
align-items: center;
flex-wrap: wrap;
gap: 4px 16px;
} .podnozje__veze a {
display: inline-flex;
align-items: center;
justify-content: center;
min-width: 44px;
min-height: 44px;
padding-block: 4px;
color: var(--tekst-na-tamnom-blagi);
font-size: 15px;
text-decoration: none;
transition: color .18s ease;
}
@media (hover: hover) {
.podnozje__veze a:hover { color: var(--bela); text-decoration: underline; }
} .podnozje__adresa {
display: flex;
align-items: center;
flex-wrap: wrap;
gap: 4px 20px;
margin: 0;
max-width: none;
font-size: 15px;
line-height: 1.5;
} .podnozje__mesto {
display: inline-flex;
align-items: center;
min-height: 44px;
}   .podnozje__adresa a {
display: inline-flex;
align-items: center;
min-height: 44px;
color: var(--tekst-na-tamnom);
text-decoration: none;
white-space: nowrap;
}
@media (hover: hover) {
.podnozje__adresa a:hover { text-decoration: underline; }
}  .podnozje__rub {
display: flex;
align-items: center;
justify-content: space-between;
flex-wrap: wrap;
gap: 4px 24px;
margin-top: 24px;
padding-block: 16px;
border-top: 1px solid color-mix(in srgb, var(--bela) 14%, transparent);
}
.podnozje__rub p {
margin: 0;
max-width: none;
font-size: 14px;
} @media (max-width: 780px) {
.podnozje__traka {
flex-direction: column;
align-items: flex-start;
gap: 16px;
}
.podnozje__veze { margin-right: 0; }
}   .tema-prekidac svg {
transition: transform .32s cubic-bezier(.4, 0, .2, 1);
}
.tema-prekidac[aria-pressed="true"] svg { transform: rotate(180deg); } .tema-menja,
.tema-menja *,
.tema-menja *::before,
.tema-menja *::after {
transition:
background-color var(--prelaz-teme) linear,
background-image var(--prelaz-teme) linear,
border-color var(--prelaz-teme) linear,
color var(--prelaz-teme) linear,
fill var(--prelaz-teme) linear !important;
} .tema-vt::view-transition-group(*),
.tema-vt::view-transition-old(*),
.tema-vt::view-transition-new(*) {
animation-duration: var(--prelaz-teme);
animation-timing-function: cubic-bezier(.4, 0, .2, 1);
} @media (prefers-reduced-motion: reduce) {
.tema-prekidac svg,
.tema-prekidac[aria-pressed="true"] svg { transition: none; transform: none; }
.tema-menja,
.tema-menja *,
.tema-menja *::before,
.tema-menja *::after { transition: none !important; }
} .pitanja .pitanje__znak {
transition: transform .22s cubic-bezier(.4, 0, .2, 1);
} .pitanja .pitanje[open] .pitanje__znak::after {
transform: rotate(90deg);
opacity: 1;
}
.pitanja .pitanje[open] .pitanje__znak { transform: rotate(45deg); }  @media (prefers-reduced-motion: reduce) {
.pitanja .pitanje__znak { transition: none; }
} .tema-ikona { display: none; }
.tema-ikona--mesec { display: block; }
[data-tema="tamna"] .tema-ikona--mesec { display: none; }
[data-tema="tamna"] .tema-ikona--sunce { display: block; } .podnozje__mreze {
display: flex;
flex-wrap: wrap; gap: 8px;
} .podnozje__mreze a {
display: inline-flex;
align-items: center;
justify-content: center;
min-width: 44px;
min-height: 44px;
color: var(--tekst-na-tamnom-blagi);
transition: color .18s ease;
} .podnozje__mreze svg {
width: 22px;
height: 22px;
display: block;
}
@media (hover: hover) {
.podnozje__mreze a:hover { color: var(--bela); }
}
.podnozje__pravno {
display: flex;
flex-wrap: wrap;
gap: 6px 18px;
margin: 0;
font-size: .82rem;
} @media (pointer: coarse), (max-width: 1024px) {
.podnozje__pravno a {
display: inline-flex;
align-items: center;
min-height: 44px;
}
} .podnozje__verzija { flex-basis: 100%;
width: 100%;
margin: 0;
max-width: none;
font-size: 13px;
line-height: 1.5;
color: var(--tekst-na-tamnom-blagi);
}.objava { padding-block: var(--ritam-mali); } .objava__stub {
max-width: var(--mera);
margin-inline: auto;
} .objava__putanja {
display: flex;
flex-wrap: wrap;
align-items: center;
gap: 8px;
margin-bottom: 20px;
font-size: 15px;
color: var(--tekst-blagi);
} .objava__putanja a {
min-height: 44px;
min-width: 44px;
display: inline-flex;
align-items: center;
justify-content: center;
font-weight: 600;
color: var(--tekst-blagi);
text-decoration: underline;
text-decoration-color: var(--crta-jaka);
}
.objava__putanja span { opacity: .5; }
@media (hover: hover) {
.objava__putanja a:hover {
color: var(--tekst);
text-decoration-color: var(--tekst);
}
}  .objava .bedz {
display: inline-flex;
align-items: center;
min-height: 44px;
text-decoration: none;
transition: background .18s ease;
}
@media (hover: hover) {
.objava .bedz:hover { background: var(--istaknuto-jaci); }
} .objava h1 { margin-bottom: 16px; }
.objava__meta {
display: flex;
flex-wrap: wrap;
align-items: center;
gap: 10px;
margin: 0;
max-width: none;
font-size: 15px;
color: var(--tekst-blagi);
}
.objava__meta span[aria-hidden] { opacity: .5; } .objava__slika {
margin: 40px auto 44px;
padding-inline: var(--traka-ivica);
} .objava__slika-lik {
max-width: 860px;
margin-inline: auto;
}
.objava__slika-lik {
width: 100%;
aspect-ratio: 16 / 9;
object-fit: cover;
border-radius: var(--radius-ram);
}
.objava__slika figcaption {
margin-top: 12px;
font-size: 15px;
color: var(--tekst-blagi);
}  @property --mera-teksta {
syntax: '<length>';
inherits: true;
initial-value: 0px;
}
.objava__telo {
font-size: 18px;
line-height: 1.7;
--mera-teksta: var(--mera);
}
.objava__telo > * {
max-width: var(--mera-teksta, var(--mera));
margin-inline: auto;
}
.objava__telo > figure,
.objava__telo > table,
.objava__telo > pre,
.objava__telo > .wp-block-image,
.objava__telo > .wp-block-table,
.objava__telo > .wp-block-embed,
.objava__telo > .alignwide,
.objava__telo > .alignfull { max-width: 100%; } .objava__telo p { margin-bottom: 1.2em; max-width: var(--mera-teksta, var(--mera)); overflow-wrap: break-word; }
.objava__telo > p:last-child { margin-bottom: 0; }  .objava__telo h2 { margin: 1.9em auto .6em; font-size: clamp(1.45rem, 1.2rem + 1vw, 1.85rem); }
.objava__telo h3 { margin: 1.6em auto .5em; }
.objava__telo h2 + h3 { margin-top: .9em; }
.objava__telo > h2:first-child,
.objava__telo > h3:first-child { margin-top: 0; }
.objava__telo a {
font-weight: 600;
color: var(--akcenat-tamni);
text-decoration: underline;
text-decoration-thickness: 1px;
}
@media (hover: hover) {
.objava__telo a:hover { text-decoration-thickness: 2px; }
}
.objava__telo ul,
.objava__telo ol { margin: 0 auto 1.3em; padding-left: 1.4em; }
.objava__telo li { margin-bottom: .5em; }
.objava__telo li:last-child { margin-bottom: 0; }
.objava__telo li > ul,
.objava__telo li > ol { margin: .5em 0 0; }
.objava__telo li::marker { color: var(--tekst-blagi); } .objava__telo blockquote {
margin: 1.9em auto;
padding-left: 24px;
border-left: 3px solid var(--istaknuto);
font-size: 20px;
line-height: 1.5;
}
.objava__telo blockquote p { margin-bottom: .6em; }
.objava__telo blockquote p:last-child { margin-bottom: 0; }
.objava__telo blockquote cite {
display: block;
margin-top: 12px;
font-size: 15px;
font-style: normal;
font-weight: 700;
color: var(--tekst-blagi);
}
.objava__telo code {
padding: 2px 7px;
border: 1px solid var(--crta);
border-radius: 7px;
background: var(--podloga-mirna);
font-family: ui-monospace, "Cascadia Code", Consolas, monospace;
font-size: .9em;
}
.objava__telo pre {
margin: 1.7em auto;
padding: 22px;
border-radius: var(--radius-kartica);
background: var(--podloga-tamna); --prsten: var(--istaknuto);
color: var(--tekst-na-tamnom);
overflow-x: auto;
font-size: 15px;
line-height: 1.6;
}
.objava__telo pre code {
padding: 0;
border: 0;
border-radius: 0;
background: transparent;
color: inherit;
font-size: inherit;
}
.objava__telo figure { margin: 2em auto; }
.objava__telo img { border-radius: var(--radius-kartica); } .objava__telo figure img,
.objava__telo > .wp-block-image img,
.objava__telo > img { width: 100%; }
.objava__telo figcaption {
margin-top: 10px;
font-size: 15px;
line-height: 1.5;
color: var(--tekst-blagi);
text-align: center;
} .objava__telo table {
display: block;
width: 100%;
margin: 1.8em auto;
overflow-x: auto;
border-collapse: collapse;
font-size: 16px;
}
.objava__telo th,
.objava__telo td {
padding: 12px 14px;
text-align: left;
border-bottom: 1px solid var(--crta);
overflow-wrap: break-word;
}
.objava__telo th {
font-weight: 700;
border-bottom: 2px solid var(--crta-jaka);
}
.objava__telo hr {
margin: 2.2em auto;
border: 0;
border-top: 1px solid var(--crta);
}  .susedna {
padding: 22px 24px;
gap: 6px;
}
.susedna__oznaka {
font-size: 15px;
font-weight: 700;
color: var(--akcenat-tamni);
}
.susedna__oznaka::before { content: "\2190\00a0"; }
.susedna__naslov {
font: 700 19px/1.3 var(--font-naslov);
letter-spacing: -.008em;
color: var(--tekst);
}
.susedna--napred { text-align: right; }
.susedna--napred .susedna__oznaka::before { content: none; }
.susedna--napred .susedna__oznaka::after { content: "\00a0\2192"; } .susedi > .susedna:only-child { max-width: 420px; } .spisak__vrh { margin-bottom: 40px; }
.spisak__vrh h1 { margin-bottom: 14px; }
.spisak__broj {
margin: 14px 0 0;
font-size: 15px;
font-weight: 600;
color: var(--tekst-blagi);
}
.spisak__prazno { font-size: 19px; color: var(--tekst-blagi); } .objava-kartica h3 { margin-bottom: 10px; } .objava-kartica time.kartica__dno {
font-size: 15px;
font-weight: 600;
color: var(--tekst-blagi);
} .objava-kartica__bez {
display: block;
background: var(--podloga-mirna);
border-bottom: 1px solid var(--crta);
}
[data-tema="tamna"] .objava-kartica__bez { background: var(--podloga); }
.objava-kartica:focus-visible,
.susedna:focus-visible {
outline: 3px solid var(--akcenat-tamni);
outline-offset: 3px;
} .pretraga { margin-top: 26px; max-width: 560px; }
.pretraga__oznaka {
display: block;
margin-bottom: 10px;
font-size: 15px;
font-weight: 700;
color: var(--tekst-blagi);
}
.pretraga__red {
display: flex;
flex-wrap: wrap;
gap: 12px;
} .pretraga__polje {
flex: 1 1 220px;
min-width: 0;
min-height: 54px;
padding: 0 22px;
border: 2px solid var(--crta-jaka);
border-radius: 999px;
background: var(--podloga);
color: var(--tekst);
font: 400 17px/1 var(--font-tekst);
}
.pretraga__polje::placeholder { color: var(--tekst-blagi); opacity: 1; }
.pretraga__polje:focus-visible {
outline: 3px solid var(--akcenat-tamni);
outline-offset: 2px;
border-color: var(--akcenat-tamni);
} .strane {
display: flex;
flex-wrap: wrap;
justify-content: center;
gap: 10px;
margin-top: 48px;
}
.strane .page-numbers {
display: inline-flex;
align-items: center;
justify-content: center;
min-width: 44px;
min-height: 44px;
padding: 0 16px;
border: 1px solid var(--crta);
border-radius: 999px;
font-size: 16px;
font-weight: 600;
text-decoration: none;
color: var(--tekst);
transition: border-color .18s ease, background .18s ease;
}
.strane .current {
background: var(--akcenat);
border-color: var(--akcenat-tamni);
color: var(--bela);
}
[data-tema="tamna"] .strane .current { color: var(--mrak); }
.strane .dots { border-color: transparent; color: var(--tekst-blagi); }
@media (hover: hover) {
.strane a.page-numbers:hover { border-color: var(--tekst); }
}
.strane a:focus-visible {
outline: 3px solid var(--akcenat-tamni);
outline-offset: 2px;
} .nema__traka {
display: grid;
grid-template-columns: 1fr 320px;
gap: 56px;
align-items: center;
}
.nema h1 { margin-bottom: 16px; }
.nema__veze {
display: flex;
flex-wrap: wrap;
gap: 12px;
margin-top: 32px;
}
.nema__kodi {
width: 100%;
max-width: 320px;
height: auto;
justify-self: center;
}
@media (max-width: 980px) { .nema__traka {
grid-template-columns: 1fr;
gap: 24px;
}
.nema__kodi {
order: -1;
max-width: 220px;
justify-self: start;
}
} @media (max-width: 640px) {
.objava__slika { margin-block: 28px 32px; }
.objava__slika-lik { border-radius: var(--radius-kartica); }
.objava__telo { font-size: 17px; }
.objava__telo > p:first-of-type { font-size: 18px; }
.objava__telo blockquote { font-size: 18px; padding-left: 18px; }
.objava__telo pre { padding: 16px; } .susedna--napred { text-align: left; }
.susedna--napred .susedna__oznaka::after { content: none; }
.susedna--napred .susedna__oznaka::before { content: "\2192\00a0"; }
.strane .page-numbers { padding: 0 12px; }
} .strana__naslov {
max-width: var(--mera);
margin-bottom: 32px;
} .strana__stranice {
display: flex;
flex-wrap: wrap;
gap: 12px;
margin-top: 40px;
}  #sadrzaj .objava__telo .elementor-section,
#sadrzaj .objava__telo .elementor-container,
#sadrzaj .objava__telo .elementor-column,
#sadrzaj .objava__telo .elementor-column-wrap,
#sadrzaj .objava__telo .elementor-widget-wrap,
#sadrzaj .objava__telo .elementor-widget,
#sadrzaj .objava__telo .elementor-widget-container {
display: block;
width: auto;
max-width: none;
margin: 0;
padding: 0;
} #sadrzaj .objava__telo > .elementor {
max-width: var(--mera-teksta, var(--mera));
margin-inline: auto;
} #sadrzaj .objava__telo .elementor-widget + .elementor-widget { margin-top: 1.2em; } #sadrzaj .objava__telo,
#sadrzaj .objava__telo p,
#sadrzaj .objava__telo li,
#sadrzaj .objava__telo span,
#sadrzaj .objava__telo a,
#sadrzaj .objava__telo b,
#sadrzaj .objava__telo strong,
#sadrzaj .objava__telo em,
#sadrzaj .objava__telo i,
#sadrzaj .objava__telo blockquote,
#sadrzaj .objava__telo figcaption,
#sadrzaj .objava__telo div { font-family: var(--font-tekst); }
#sadrzaj .objava__telo h1,
#sadrzaj .objava__telo h2,
#sadrzaj .objava__telo h3,
#sadrzaj .objava__telo h4,
#sadrzaj .objava__telo h5,
#sadrzaj .objava__telo h6 { font-family: var(--font-naslov); } #sadrzaj .objava__telo .elementor-widget-text-editor,
#sadrzaj .objava__telo .elementor-widget-text-editor p,
#sadrzaj .objava__telo .elementor-widget-theme-post-content,
#sadrzaj .objava__telo .elementor-widget-theme-post-content p {
font-size: inherit;
line-height: inherit;
color: inherit;
} #sadrzaj .objava__telo a {
font-weight: 600;
color: var(--akcenat-tamni);
text-decoration: underline;
text-decoration-thickness: 1px;
}
@media (hover: hover) {
#sadrzaj .objava__telo a:hover { text-decoration-thickness: 2px; }
} #sadrzaj .objava__telo img {
display: block;
max-width: 100%;
height: auto;
margin-inline: auto;
border-radius: var(--radius-ram);
} #sadrzaj .objava__telo .elementor-image-gallery .gallery {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
gap: 12px;
margin: 1.8em 0;
} #sadrzaj .objava__telo .elementor-image-gallery .gallery-item {
width: auto;
max-width: none;
margin: 0;
float: none;
} #sadrzaj .objava__telo .elementor-image-gallery .gallery-item img {
display: block;
width: 100%;
height: 100%;
aspect-ratio: 1;
object-fit: cover;
border: 0;
border-radius: var(--radius-kartica);
} .objava__telo a,
.objava__telo li,
.objava__telo td { overflow-wrap: anywhere; }