
/* grid */
.g1, .g2, .g3, .g4, .g5, .g6, .g7, .g8, .g9, .g10, .g11, .g12, .grid { float: left; margin-right: -0.000001em; margin-right: 1.492%; position: relative; }
.g12 { margin-left: 1.492%; }
.g16, .g20, .g25, .g33, .g50, .g66, .g100 { float: left; margin-right: -0.000001em; position: relative; box-sizing: border-box; }
.g16    { width: 16.6667% !important;  }
.g20    { width: 20% !important;       }
.g25    { width: 25% !important;       }
.g33    { width: 33.3333% !important;  }
.g50  	{ width: 50% !important;       }
.g66    { width: 66.6667% !important;  }
.g75    { width: 75% !important;  }
.g100   { width: 100% !important;      }

.g1     { width: 6.717%;  } .g1-offset { margin-left: 8.209% !important;   }
.g2     { width: 14.926%; } .g2-offset { margin-left: 16.418% !important;  } .g2-pull { margin-left: -13.926% !important;  }
.g3     { width: 23.135%; } .g3-offset { margin-left: 24.627% !important;  }
.g4     { width: 31.344%; } .g4-offset { margin-left: 32.836% !important;  }
.g5     { width: 39.553%; }
.g6     { width: 47.762%; } .g6-offset { margin-left: 49.254% !important;  }
.g7     { width: 55.971%; }
.g8     { width: 64.18%;  }
.g9     { width: 72.389%; }
.g10    { width: 80.598%; }
.g11    { width: 88.807%; }
.g12    { width: 97.016%; }

.g9 .g4 { width: 30.615% }
.g9 .g12 { width: 95.922% }

.g9 .g4, .g9 .g12 { margin-right: 2.039% !important; margin-left: 2.039% !important; }


.g1.g-full  { width: 9.702%;  }
.g2.g-full  { width: 17.911%; }
.g3.g-full  { width: 26.119%; }
.g4.g-full  { width: 34.329%; }
.g5.g-full  { width: 42.538%; }
.g6.g-full  { width: 50.747%; }
.g7.g-full  { width: 58.956%; }
.g8.g-full  { width: 67.165%; }
.g9.g-full  { width: 75.374%; }
.g10.g-full { width: 83.583%; }
.g11.g-full { width: 91.792%; }

.g1.g-full-r,  .g1.g-full-l  { width: 8.209%;  }
.g2.g-full-r,  .g2.g-full-l  { width: 16.418%; }
.g3.g-full-r,  .g3.g-full-l  { width: 24.627%; }
.g4.g-full-r,  .g4.g-full-l  { width: 32.836%; }
.g5.g-full-r,  .g5.g-full-l  { width: 41.045%; }
.g6.g-full-r,  .g6.g-full-l  { width: 49.254%; }
.g7.g-full-r,  .g7.g-full-l  { width: 57.463%; }
.g8.g-full-r,  .g8.g-full-l  { width: 65.672%; }
.g9.g-full-r,  .g9.g-full-l  { width: 73.881%; }
.g10.g-full-r, .g10.g-full-l { width: 82.09%;  }
.g11.g-full-r, .g11.g-full-l { width: 90.299%; }
.g12.g-full-r, .g12.g-full-l { width: 100%; }

.g-full { margin-left: -1.492% !important; margin-right: 0 !important; }
.g-full-l { margin-left: -1.492% !important; }
.g-full-r { margin-right: 0 !important; }

.absolute 		{ position: absolute; }
.relative 		{ position: relative; }
.no-select { -webkit-touch-callout: none; -webkit-user-select: none; -khtml-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; }
.z-0 			{ z-index: 0; }
.z-10 			{ z-index: 10; }
.z-20 			{ z-index: 20; }
.z-30 			{ z-index: 30; }
.z-40 			{ z-index: 40; }
.z-50 			{ z-index: 50; }
/* splash carousel */
.epg-splash-prev, .epg-splash-next{margin-top: -12px; height: 145px; width: 45px; -webkit-transform: translateY(-50%); transform: translateY(-50%); }
.epg-nav .epg-splash-prev { left: -30px; }
.epg-splash-carousel .epg-splash-next, .format-mainpage .epg-splash-next, .episode-title .link-next, .epg-splash-nav .epg-splash-next, .character-title .link-next { right: -50px; }
.epg-splash-prev, .link-prev, .novinar .link-prev { left: 0; }
.epg-splash-next, .link-next, .novinar .link-next { right: -35px; }
.epg-splash-prev g g, .epg-splash-next g g, .link-prev g g, .link-next g g { transition: fill .3s; }
.epg-splash-prev:hover g g, .epg-splash-next:hover g g, .link-prev:hover g g, .link-next:hover g g { fill: rgb(200, 8, 30); }
.epg-splash-nav { top:132px; height: 0;}
.epg-splash-nav-mobile { display: none; }

/* epg */
.epg-widget { padding-bottom: 68px; overflow: hidden; }
.epg-timeline { padding-bottom: 20px;}
.epg-mobile.home-epg .epg-timeline {margin-bottom: 60px; }
.home-epg.epg-mobile .epg-content { margin-top: 0; }
.home-epg.epg-mobile .epg-timeline::before { box-shadow: 1px 1px 0px 0 rgba(255, 255, 255, 0.1) inset; content: ""; height: 30px; left: -5%; position: absolute; top: 0; width: 110%; }
.epg-timeline, .epg-description {color: #fff; font-size: 13px; line-height: 1em; float: left; width: 100%;}
.epg-description{
min-height: 0;
overflow: hidden;
height:auto;
max-height: 200px;
-webkit-transition: max-height 0.3s ease 0s;
-moz-transition: max-height 0.3s ease 0s;
-ms-transition: max-height 0.3s ease 0s;
-o-transition: max-height 0.3s ease 0s;
transition: max-height 0.3s ease 0s;
}
.epg-description-empty{
height:0;
max-height: 0;
}
.epg-item-title { padding: 10px 20px 10px 0;
background: rgb(66,62,112);
background: -moz-linear-gradient(90deg, rgba(66,62,112,1) 0%, rgba(50,45,105,1) 100%);
background: -webkit-linear-gradient(90deg, rgba(66,62,112,1) 0%, rgba(50,45,105,1) 100%);
background: linear-gradient(90deg, rgba(66,62,112,1) 0%, rgba(50,45,105,1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#423e70",endColorstr="#322d69",GradientType=1);
-webkit-border-radius: 9px;
-moz-border-radius: 9px;
border-radius: 9px;
}
.epg-item-title .epg-item-image{
  float:left;
  width:106px;
  height:70px;
  -webkit-border-radius: 7px;
  -moz-border-radius: 7px;
  border-radius: 7px;
  background-image:url(/themes/laudato_theme/slike/tvvodicplaceholder.png);
  background-size: cover;
  background-position: center;
  background-color:#2f2c53;
  -webkit-box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.75);
  -moz-box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.75);
  box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.75);
  margin-left:5px;
}
.epg-item-title .epg-item-playtime,
.epg-item-title .epg-item-title2,
.epg-item-title .epg-item-typedata
{
  text-align:right;
}
.epg-item-description p{
  padding:8px 10px;
  line-height: 1.5em
}

.epg-item-description { padding: 0;margin:0}
.epg-description a.button{
  display:inline-block;text-decoration: none;padding: 0 12px;
  background: #3672b0;
  -webkit-border-radius: 16px;
  -moz-border-radius: 16px;
  border-radius: 16px;
  color:#fff;
  font-size: 1em
}
.epg-description a.button:hover { transition: all .3s; background: #141318; border-color: #141318; color: #fff !important; }
.epg-item-playtime  { color: #bfbce1;line-height: 1.5em; }
.epg-item-title2 { font-size: 20px; line-height: 1.5em; font-weight: 700; letter-spacing: -0.01em; }
.epg-item-typedata { line-height: 1.5em; }
.epg-item-button{padding:0 10px}
.epg-anchors { line-height: 4.2; font-weight: 300; }
.epg-jump { background: none; border: none; box-shadow: none; font-size: 16px; font-weight: 300; text-transform: uppercase; transition: background .3s; border-radius: 20px; margin-left: 10px; padding: 5px 10px; display: inline-block; }
.epg-jump:hover { background: rgba(200,9,30,.5); }
.epg-jump.active {background: #3672b0; }
.epg-stick { position: relative; display: inline-block; width: 40%; height: 10px; box-shadow: inset 0px 3px 3px 0px rgba(0,0,0,.5), inset 0px -3px 1px 0px #3C3C41; border: 1px solid rgba(255, 255, 255, .1); border-top-color: rgba(255, 255, 255, .08); border-bottom-color: rgba(255, 255, 255, .2); border-radius: 8px; }


.epg-content { clear: both; position: relative; margin-top: -13px; z-index: 0; border-bottom: 1px solid #4a4b50; }
.epg-schedule { overflow: hidden; height: 250px;  padding: 33px 0 0; }
.channel-strip { position: absolute; cursor: pointer; }

.epg-more { display: block; font-size: 15px; font-weight: 700; margin: 20px 35px 0 0; transition: all .3s; }
.epg-more:hover { color: #c80a1e !important; }
.epg-widget .epg-more .image-circle { border: 1px solid #fff; font-size: 15px; height: 24px; margin: -3px 0 0; width: 24px; }
.epg-more:hover .image-circle { border: 1px solid #c80a1e; }
.epg-more .icon-angle-right { right: -1px; top: 2px; }
.schedule-timestamp { float: left; font-size: 20px; line-height: 24px; border-left: 1px solid #fff; padding: 0 0 10px 10px; box-sizing: border-box; position: absolute; }
.schedule-channel, .epg-time { position: absolute;list-style: none outside none; }
.schedule-channel:nth-of-type(1) { top: 0; }
.schedule-channel:nth-of-type(2) { top: 52px; }
.schedule-item { float: left; padding: 2px; box-sizing: border-box; max-height: 42px; overflow: hidden; position: absolute;}
.schedule-item.active .item-inner{background-color:#ed008e}
.item-inner { background: #3672b0; border-radius: 2px; height: 40px; padding: 12px 10px 0; display: inline-block; font-weight: 600; width: 100%; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.item-inner.item-inner-title{font-weight:500;font-size:1.1em}
.item-inner.item-inner-subtitle{font-weight:300;margin-top:-12px;height:35px;padding-top:8px}
/*.schedule-item.epg-no-signal .item-inner { background: #31343b url("../images/kraj-programa.svg") repeat-x scroll 10px -4px; cursor: default; }*/
/*.schedule-item.epg-no-signal .item-inner.active { background: #31343b url("../images/kraj-programa.svg") repeat-x scroll 10px -4px; border: none; box-shadow: none; }*/
.schedule-current { border-right: 3px dotted #ed008e; bottom: 0; top: 82px; opacity: 1; transition: opacity .1s; top: 3px; max-height: 151px;pointer-events: none}
.schedule-current.fade { opacity: 0; }
.schedule-current::before, .epg-schedule::before { content: ""; display: block; position: absolute; left: -50px; z-index: 10; width: 50px; height: 100%; pointer-events: none;
background: rgb(66,62,112);
background: -moz-linear-gradient(90deg, rgba(66,62,112,0) 0%, rgba(66,62,112,1) 100%);
background: -webkit-linear-gradient(90deg, rgba(66,62,112,0) 0%, rgba(66,62,112,1) 100%);
background: linear-gradient(90deg, rgba(66,62,112,0) 0%, rgba(66,62,112,1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#423e70",endColorstr="#423e70",GradientType=1);

}
.epg-schedule::before { right: 0; left: auto;pointer-events: none; }
.epg-schedule::after { content: ""; display: block; position: absolute; left: 0; z-index: 10; width: 50px; height: 100%;
pointer-events: none;
background: rgb(66,62,112);
background: -moz-linear-gradient(90deg, rgba(66,62,112,1) 0%, rgba(66,62,112,0) 100%);
background: -webkit-linear-gradient(90deg, rgba(66,62,112,1) 0%, rgba(66,62,112,0) 100%);
background: linear-gradient(90deg, rgba(66,62,112,1) 0%, rgba(66,62,112,0) 100%);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#423e70",endColorstr="#423e70",GradientType=1);
}
.schedule-current-text { background: #ed008e; border: 2px solid #fff; border-radius: 10px; color: #fff; font-size: 12px; font-weight: 900; left: -50%; line-height: 12px; padding: 3px 10px; text-align: center; text-transform: uppercase; top: -3px; transform: translateX(-50%); z-index: 10; }
.epg-item-type { font-size: 11px; text-transform: uppercase; min-height: 11px; display: inline-block; }
.pg-rating { border: 2px solid rgba(255, 255, 255, .9); border-radius: 20px; display: block; font-size: 10px; font-weight: 900; height: 21px; line-height: 1.6; position: absolute; right: 10px; text-align: center; top: 12px; width: 21px; color: #fff; }
.pg-12 { background: #136f63; }
.pg-15 { background: #b2a130; }
.pg-18 { background: #c8091e; }
.epg-replay { background: rgba(255, 255, 255, .2); border-radius: 30px; font-size: 0.75em; margin-left: 6px; padding: 2px 5px; color: #fff; }

/* epg calendar navigation */
.epg-daylist { display: inline-block; float: left; width: 398px; margin-bottom: -1px; }
.epg-daylist [data-event="select-date"] { cursor: pointer; }
.epg-day { color: #fff; display: block; float: left; padding: 20px 0 20px 10px; text-transform: uppercase; font-size: 20px; float: left; text-align: center; min-height: 56px; }
.epg-days { border-bottom: 1px solid rgba(255, 255, 255, 0.15); margin-bottom: 0; margin-top: 20px; }
.epg-days a { color: #fff; opacity: 1; transition: opacity .3s; }
.epg-days a:hover, .epg-days.active { opacity: .5; }
.epg-days [class^="icon-angle-"] { font-size: 29px; padding: 6px 0; cursor: pointer; }
.epg-widget .image-circle, .epg-splash-nav .image-circle { border: 1px solid #fff; height: 42px; margin: 5px 0; width: 42px; }
.epg-date { position: relative; z-index: 30; text-align: center; width: 56px; height: 56px; background: #c80a1e; transition: width .3s ease-out; }
.active .epg-time, .active .epg-title { background: transparent; }
.epg-title { float: left; padding: 20px 20px 20px 42.517%; width: 100%; }
.section-raspored .epg-title, .section-raspored .epg-title { padding: 20px 20px 20px 23.135%; min-height: 75px; }
.date-cali { background-position: 0 -245px; color: #c80a1e; display: block; font-size: 12px; font-weight: 900; height: 35px; margin: 4px auto -7px; padding: 14px 0 1px; text-align: center; width: 20px; }
/* calendar */
.calendar-popup { position: absolute; left: 0; top: 0; width: 100%; max-width: 398px; background-color: #27282d; z-index: 20; color: #fff; box-shadow: 0 10px 10px rgba(0,0,0,.7); }
.calendar-popup *[data-event], .date-cali { cursor: pointer; }
.calendar-popup .month { background: #27282d; border-radius: 0; color: #fff; height: 56px; text-align: right; border-bottom: 2px solid #c80a1e; }
.calendar-popup .month th { background: #38393e; border: 0; border-bottom: 2px solid #3672b0; font-size: 21px; }
.calendar-popup .icon-plus-1:before { color: #979797; font-size: 40px; transform: rotate(45deg); }
.calendar-popup [data-event="calendar-close"]:hover .icon-plus-1:before { color: #c80a1e; }
.calendar-popup table { width: 100%; height: 100%; text-align: center;}
.calendar-popup table tr.weekdays { font-weight: 500; }
.calendar-popup table th, .calendar-popup table td { vertical-align: middle; font-size: 15px; background-color: #646466; empty-cells: show; text-align: center;  width: 14.285%; height: 41px; border-bottom: 1px solid #565658; border-left: 1px solid #565658; }
.calendar-popup table th { background: #444446; text-transform: uppercase; }
.calendar-popup table td.off { color: #aaaaac; background: #5e5e60; }
.calendar-popup table td.out { color: #767678; background: #48484a; }
.calendar-popup table td.on { color: #fff; background: #666668; font-weight: 900; }
.calendar-popup table td.today { background: #737475; }
.calendar-popup table td.active { background: #c80a1e; color: #fff; }
.calendar-popup table td.on:hover { background: #7e7f80; }
.calendar-popup table td.active.on:hover { background: #c80a1e;  }
.calendar-popup table td:first-child, .calendar-popup table th:first-child { border-left: none; }
.calendar-popup table tr:last-child td { border-bottom: none; }
/* home arrow navigation */
.home-epg .epg-day {padding: 20px 0; width: 100%; }
/* DODACI */
.g10.g-full-l.relative {
width: 96%;
margin-left: 2em !important;
}

.schedule-current::before {
display: none;
}

.fa-angle-left {
width: 300% !important
}

.schedule-channel li {
max-height: 84px !important;
}

.epg-anchors button,
.epg-anchors span {
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
font-weight: bold;
line-height: 1em;    font-weight: 600;
}

.epg-anchors button {
margin-bottom: 0.4em !important;
margin-right: -1em;
}

/* STRELICE -> DAN U TJEDNU */
.absolute-left, .absolute-right {
  position: absolute;
margin-top: 1em;
font-size: large;
}
.absolute-left {
    left: 0;
}
.absolute-right {
right: 0;
}
.epg-content {
height: 14em;
border-bottom: none;
}

.schedule-current-text.absolute {
height: 20px;
}

.absolute.strip-cover {
background: none;
}

/* .epg-description, */
.calendar-popup table tbody tr .on.active {
background-color: rgb(54,114,176);
}
