a{text-decoration: none !important;}

.simple-tbl{display: table; width: 100%;}
.simple-tbl>div{display: table-cell; vertical-align: top;}
.simple-tbl.banner-operateri{}
.banner-operateri .c-banner{width: 350px; min-width: 350px;}
.banner-operateri .c-operateri{}

.banner-operateri .c-operateri .spacer-bottom{height:90px;}
.banner-operateri .c-operateri .button-bottom{position: absolute; bottom: -12px; left:0; right: 0;}


/* fixed banner */
.fixed-banner{background-color: #FE3B76; height: 300px; overflow: hidden; text-align: center;  background-image: url(podzadina2.jpg); background-repeat: no-repeat; background-size: cover; background-position: center center;}
.fixed-banner h1{margin: 0px 0px 20px 0px; padding-top: 20px; font-size: 32pt; line-height: 45pt; font-weight: bold; color: #FFFFFF; text-transform:uppercase;}
.fixed-banner .number{margin: 18px 0px; font-size: 22pt; line-height: 34pt; color: #DAF927;     font-weight: bold;}
.fixed-banner .number a{color: #DAF927 !important; }
.fixed-banner .number .nr-flag{width: 48px; height: 48px; vertical-align: middle !important;}
.fixed-banner .maratela-info {color: #CDCDCD; font-size: 10pt; text-shadow: none; padding: 5px 0px; }
.fixed-banner .maratela-info a{color: #CDCDCD !important; }
.fixed-banner a, .fixed-banner a.otel-lnk.disabled, .fixed-banner a.otel-lnk.disabled:hover{color: #DAF927 !important;}

@media (max-width:990px) {
     .fixed-banner h1{font-size: 43pt; }
     .fixed-banner .number{font-size: 32pt; }
}

@media (max-width:500px) {
     .fixed-banner h1{font-size: 38pt; }
     .fixed-banner .number{font-size: 28pt; }
}

@media (max-width:450px) {
     .fixed-banner h1{font-size: 30pt; }
     .fixed-banner .number{font-size: 21pt; }
}

@media (max-width:330px) {
     .fixed-banner h1{font-size: 26pt; }
     .fixed-banner .number{font-size: 18pt; }
}

@media (max-width:380px) {
     .fixed-banner h1{font-size: 22pt; }
     .fixed-banner .number{font-size: 16pt; }
}


/* header and footer */
.banner-header, .banner-footer{color: white; background-color: #FE3B76;}
.banner-header {font-size: 16px; }
.banner-footer{font-size: 14px; padding: 3px; text-align: center; background-color: white;}
.banner-header h1{font-size: 26px; text-transform:uppercase; padding: 0; margin:10px 0px;  text-align: center;}
.banner-header h2{font-size: 18px; line-height: 18px; text-transform:uppercase; margin: 0; padding:10px 0px;  text-align: center;}
.banner-header a{color: white !important; text-decoration: none !important;}
.banner-footer a{color: black !important; text-decoration: none !important; display: inline-block; padding: 8px 0px;}

.operater-header.half-page .operater-status{margin: 7px 0px;}
.operater-header.half-page .operater-status{margin: 7px 0px;}

/* tekst */
.ime-operatera{display: block; font-size: 20px; font-weight: bold; margin-top: 0px;}
.kod-operatera{display: inline-block; color: white; background-color: #333333; padding: 3px 8px; font-weight: bold; font-size: 12px; margin-top: 5px;}
.blog_post_operater div.tehnike{margin-top: 10px; text-transform:lowercase; }
.blog_post_operater div.tehnike b{text-transform:uppercase;}
.blog_post_operater p{font-size: 12px;}
.blog_post_operater a.link-operatera{color:#1a1a1a; text-decoration: none !important;}


/* container za operatere */
.operaters-all{list-style: none; margin: 0px !important; padding: 0px !important; line-height: 125% !important; font-family: Verdana, Geneva, sans-serif;}


/* box operatera*/
.blog_post_operater{display: block; margin: 10px 0px; position: relative; background-color: #ffffff; border-bottom: none; padding: 10px 8px; box-shadow: none; font-size: 14px;}

/* div.operater-header*/
.operater-header{position: relative; padding-right: 0px;}

/* slika operatera*/
.layout-simple .operater-img {width: 68px; height: 68px; padding:0px; border-radius: 0; float:none !important; margin: 0; display: block; margin-left: 0 !important; margin-right: 0!important; border: 2px solid #A0A09E; box-shadow: none !important;}

/* prikaz statusa - tekst*/
.blog_post_operater .operater-status{display: none; font-weight: bold; clear: both; }
.blog_post_operater.status-available .operater-status.for-status-available{display: block; color:#008600;}
.blog_post_operater.status-busy .operater-status.for-status-busy{display: block; color:#FF0000; }
.blog_post_operater.status-unavailable .operater-status.for-status-unavailable{display: block; color:#4D4D4D; }
 
/* prikaz status ikone FontAwesome */
.blog_post_operater span.live-icon{width: 36px; height: 30px; font-size: 22px; padding-top: 6px; color: white !important; text-align: center; border-radius: 18px; position: absolute; background-color: #019B5F; top: 5px; right: 5px; text-align: center; transform: rotate(90deg);}
.blog_post_operater.status-available span.live-icon{background-color:#008600;}
.blog_post_operater.status-busy span.live-icon{background-color:#FF0000;}
.blog_post_operater.status-unavailable span.live-icon{background-color:#4D4D4D;}

/* prikaz status ikone (telefon) */
.blog_post_operater .status-icon{display: none; float: right; width: 35px; height: 35px;}
.blog_post_operater.status-available .status-icon.for-status-available{display: inline-block;}
.blog_post_operater.status-busy .status-icon.for-status-busy{display: inline-block;}
.blog_post_operater.status-unavailable .status-icon.for-status-unavailable{display: inline-block;}

/* button za call */
.blog_post_operater .operater-number a{text-decoration: none !important; margin: 5px 0px; background-image: none;border-radius: 0px;cursor: pointer; display: block;font-size: 13px;font-weight: 400;line-height: 1.5;margin-bottom: 0; padding: 6px 12px;text-align: center;vertical-align: middle; font-weight: bold;}

/* button za call ovisno o statusima */
.blog_post_operater.status-available .operater-number a{background-color: #008600;border-color: #008600;color: #fff;}
.blog_post_operater.status-busy .operater-number a{background-color: #FF0000;border-color: #FF0000;color: #fff;}
.blog_post_operater.status-unavailable .operater-number a{background-color: #4D4D4D;border-color: #4D4D4D;color: white;}

/* klik bilo gdje na operatra */
.blog_post_operater a.area-click{display: none; position: absolute; top: 0; left:0; right:0; bottom: 0; z-idnex: 1;}

 /* prikaz kod scrolla */
.scroll.scroll-left .blog_post_operater,.scroll.scroll-right .blog_post_operater{width: 330px; min-width: 330px; height: 280px; margin: 0px 5px;}
.scroll.scroll-left p.operater-tehnike, .scroll.scroll-right p.operater-tehnike{line-height: 20px; height: 80px; overflow: hidden;}
.scroll.scroll-left .operater-header, .scroll.scroll-right .operater-header{height: 80px; overflow: hidden;}
.scroll.scroll-up, .scroll.scroll-down{display: block !important; }
.scroll-container-up, .scroll-container-down {max-height: 3000px; overflow: hidden;}
 
/* prikaz liste */
.operaters-all.layout-list{display: flex; flex-wrap: wrap; position: relative;}
.operaters-all.layout-list .blog_post_operater{width:48%; margin: 20px 1% 40px 1%; overflow: hidden;}
.operaters-all.layout-list .operater-header{height: 40px;}
.operaters-all.layout-list .operater-slika{display: block; float: left; }
.operaters-all.layout-list p.operater-tehnike{line-height: 20px; height: 80px; }
.operaters-all.layout-list p.operater-status{float: left !important; clear: none !important;}
.operaters-all.layout-list .ospacer{clear: both;}
.operaters-all.layout-list .spacer-bottom{height:90px;}
.operaters-all.layout-list .button-bottom{position: absolute; bottom: 0; left:0; right: 0;}
.layout-list p {padding: 0px 3px 10px 3px !important; font-size: 14px !important; text-align: left !important; line-height: 150% !important;}
.layout-list .ime { font-size: 16px; color:#000; font-weight: bold; text-transform: uppercase;}
.layout-list .operater-img {width: 150px; padding:0px; border-radius: 150px; -webkit-border-radius: 150px; -moz-border-radius: 150px; background: url(https://link-to-your/image.jpg) no-repeat; float:none !important; margin-right: 10px; margin-bottom:0px; box-shadow: 0 0 5px 1px rgba(0,0,0,.4);}
.layout-list p.osnove {float: left;}
.layout-list p.opis {display: block !important;}


 /* prikaz kod scrolla mobile */
.mobile-operater .blog_post_operater {margin-bottom: 15px !important; }
.mobile-operater p {text-align: left !important; }
.mobile-operater .scroll-container-up, .scroll-container-down .operater-div{max-height: 450px; overflow: hidden;}
.mobile-operater .layout-simple .operater-img {width: 70px; padding:0px; border-radius: 70px; -webkit-border-radius: 70px; -moz-border-radius: 70px; background: url(https://link-to-your/image.jpg) no-repeat; float:left !important; margin: 0px 7px 5px 0px !important; display: block; box-shadow: 0 0 5px 1px rgba(0,0,0,.4);}
.mobile-operater .operater-status{clear: none !important; }

/* scroller brojeva */
.scroller_brojevi{}
.scroller_brojevi li{margin: 0px 10px;}
.scroller_brojevi li ,.scroller_brojevi li a{color: black; text-decoration: none !important;  white-space: nowrap;}
.scroller_brojevi li img{vertical-align: middle; margin-right: 6px;}

.scroller_brojevi.dark{background-color: black; padding: 2px 0px 2px 0px !important; }
.scroller_brojevi.dark li ,.scroller_brojevi.dark li a{color: white; }

/* disabled linkovi - desktop */
a.otel-lnk.disabled, a.otel-lnk.disabled:hover{color:black !important; cursor: default !important;}
.scroller_brojevi.dark a.otel-lnk.disabled, .scroller_brojevi.dark a.otel-lnk.disabled:hover{color: white !important; }
a.operater-button.otel-lnk.disabled, a.operater-button.otel-lnk.disabled:hover{color: white !important;}

/* spacer */
div.ospacer{height:12px;}

/* mobilna verzija */
@media (max-width:1150px) {
    .operaters-all.layout-list .blog_post_operater{width:100%; margin: 30px 0;}
}


/* push notifikacije  box */
#operateri-pn-msg{position: fixed; bottom: 10px; right: 10px; width: 300px; padding: 10px; background-color: rgba(0,0,0,0.8); color: white; font-size: 12px; z-index: 99999;}
#operateri-pn-msg h3{padding: 0; margin: 0px 0px 10px 0px; color: white; font-size: 14px; position: relative; }
#operateri-pn-msg h3 i{cursor: pointer; position: absolute; top: 0; right:0; }
#operateri-pn-msg table{width:100%;}
#operateri-pn-msg .img{width: 50px; height: 50px; background-size: cover; background-position: center center;}
#operateri-pn-msg .body{font-size: 14px; padding-left: 10px;}
#operateri-pn-msg a{position: absolute; top: 20px; bottom: 0; left: 0; right: 0;}

/* push notifikacije subscribe button */
.click-for-push-info{}
.click-for-push-info table, .click-for-push-info table td{border: none !important; padding-left: 0px; padding-right: 0px;}
.click-for-push-info table td{vertical-align:top;}
.blog_post_operater.status-available .click-for-push-info{display: none;}
.click-for-push-info .btn-label{ padding-left: 10px; font-size: 11px; line-height: 18px;}
.click-for-push-info .btn-label .on{display: none; }
.click-for-push-info.on .on{display: inline;}
.click-for-push-info.on .off{display: none;}

/* switch button */
.onoffswitch {position: relative; width: 34px;-webkit-user-select:none; -moz-user-select:none; -ms-user-select: none;}
.onoffswitch-checkbox {display: none;}
.onoffswitch-label {display: block; overflow: hidden; cursor: pointer; height: 14px; padding: 0; line-height: 20px;border: 1px solid #000000; border-radius: 20px;background-color: #A5A6A9;transition: background-color 0.3s ease-in;}
.onoffswitch-label:before {content: "";display: block; width: 14px; margin: 0px;background: #FFFFFF;position: absolute; top: 0; bottom: 0;right: 18px; border: 1px solid black; border-radius: 17px;transition: all 0.3s ease-in 0s; }
.onoffswitch-checkbox:checked + .onoffswitch-label { background-color: #58E055;}
.onoffswitch-checkbox:checked + .onoffswitch-label, .onoffswitch-checkbox:checked + .onoffswitch-label:before {border-color: #58E055;}
.onoffswitch-checkbox:checked + .onoffswitch-label:before {right: 0px; }

/* push notifikacije - oznacavanje operatera */
.blog_post_operater.pn-clicked{background-color: rgba(0,255,0,0.05);}

/* push notifikacija error */
#operateri-pn-error-overlay{position: fixed; top: 0; left: 0; right: 0; bottom:0; z-index: 99998; background-color: rgba(0,0,0,0.2); transition: opacity 500ms;}
#operateri-pn-error {position: fixed; max-width: 300px; background-color: white; border: 2px solid #000; padding: 15px; left: 50%; margin-left: -157px; top: 50%; margin-top: -150px; z-index: 99999; font-size: 12px; color: #666; text-align: center; transition: all 5s ease-in-out; border-radius: 5px;}
#operateri-pn-error h3{margin: 0px 0px 20px 0px; color: #666; line-height: 150%;}
#operateri-pn-error a{font-weight: bold; color: #666;}
#operateri-pn-error .buttons{margin-top: 10px; padding-top: 10px; border-top: 1px solid #DEDEDE; text-align: right; }
#operateri-pn-error button{display: inline-block; font-size: 12px; background-color: transparent;color: #000;line-height: 20px;padding: 7px 8px !important;box-shadow: none;border: 1px solid black;cursor: pointer;border-radius: 3px; width: 100%;}
#operateri-pn-error button:hover {background: #000; color: #fff;}

.operater-page .click-for-push-info .off {font-weight: bold; font-size: 12px; cursor: pointer; }
.operater-page .click-for-push-info .on {font-weight: bold; font-size: 12px;}

.operater-div .click-for-push-info .off {font-weight: bold;  font-size: 12px; cursor: pointer; }
.operater-div .click-for-push-info .on {font-weight: bold; font-size: 12px;}

@keyframes blinker {
  50% {
    opacity: 0;
  }
}

/* operater - header - tablicni prikaz */
.blog_post_operater .operater-tbl-header{display: table; width: 100%;}
.blog_post_operater .operater-tbl-header>div{display: table-cell; vertical-align: top; }
.blog_post_operater .operater-tbl-header>.col-img{width: 70px; text-align: left;}
.blog_post_operater .operater-tbl-header>.col-img>img{display: inline-block;}
.blog_post_operater .operater-tbl-header>.col-data>*{clear:both; float: none; }
.blog_post_operater .operater-tbl-header>.col-status{width: 36px; text-align: right; }
