/*splosne stvari*/
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}
body {
    background-color: white;
    color:#333333;
    font-size: 1.2em;
    padding-left: 10px;
    padding-right: 10px;
    font-family: 'Lucida Sans', 'Lucida Sans Regular', 'Lucida Grande', 'Lucida Sans Unicode', Geneva, Verdana, sans-serif;
}
img {
    border: none;
}
a:link, a:active, a:visited {
    color: #e9258a;
    /*color: #474444;*/
	text-decoration: none;
	font-weight: normal;
}
a:hover {
    color: #474444;
    /*color: #e9258a;*/
	text-decoration: none;
	font-weight: normal;
}
#noga_link {
	font-weight: normal;
	color:#333333;
	text-decoration: none;
}
.naslov_strani {
    font-weight: bold;
    font-size: 20px;
    padding: 20px;
    text-align: center;
}
.noga {
    grid-area: noga;
    border-top: 1px solid black;
    font-size: 12px;
    padding-bottom: 40px;
    padding-top: 10px;
}
p {
    font-size: 13px;
    font-weight: normal;
}
.epg_naslov {
    font-size: 16px;
    font-weight: bold;
    padding: 5px;
}
h1 {
    font-size: 16px;
    font-weight: normal;
}
.logotip_ponudnik {
    height: 70px;
}
.ponudnik_vsebina {
    padding-bottom: 20px;;
}
.naslov_izbranega_kanala {
	font-size: 14pt;
	font-weight: normal;
	margin-bottom: 10px;
	border-bottom: 1px solid #999999;
}
.spored_ura {
    font-size: 10pt;
    margin-top: 5px;
    color: #000000;
}
.spored_opis {
	font-size: 10pt;
	color: #808080;
}
/*mobilna verzija*/
.container {
    display: grid;
    grid-template-columns: auto;
    grid-template-areas:
    "logotip"
    "navigacija"
    "vsebina_strani"
    "noga";
    justify-content: center;
    align-items: baseline;
}
.logotip {
    grid-area: logotip;
    text-align: center;
}
.navigacija {
    grid-area: navigacija;
    text-align: right;
}
.vsebina_strani {
    grid-area: vsebina_strani;
}
.noga {
    grid-area: noga;
}
.small_banner {
    display: block;
}
.big_banner {
    display: none;
}
/*seznam kanalov*/
.logotipi {
    display: grid;
    grid-gap:5px;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    justify-items: center;
}
.logo_kanal {
    grid-area: logo_kanal;
    max-width: 100%;
    height: auto;
}
/*seznam ponudnikov*/
.ponudniki_seznam {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    grid-gap: 10px;
    justify-items: center;
}
/*izpis sporeda*/
.izpis_sporeda {
    display: grid;
    grid-template-columns: 1fr;
    justify-items: center;
    grid-template-areas:
    "izbirnik_kanalov"
    "naslov_izbranega_kanala"
    "vsebina_programa";
}
.izbirnik_kanalov {
    grid-area: izbirnik_kanalov;
}
.naslov_izbranega_kanala {
    grid-area: naslov_izbranega_kanala;
}
.vsebina_programa {
    grid-area: vsebina_programa;
}
.pink_logotip {
    width: 240px;
}
.banner_slika {
    border-radius: 20px;
    max-width: 100%;
    height: auto;
}
/*desktop verzija*/
@media screen and (min-width: 960px) {
    .container {
        display: grid;
        grid-template-columns: auto auto;
        justify-content: center;
        align-items: baseline;
        grid-template-areas:
        "logotip navigacija"
        "vsebina_strani vsebina_strani"
        "noga noga";
    }
    .logotip {
        grid-area: logotip;
        text-align: left;
    }
    .navigacija {
        grid-area: navigacija;
        text-align: right;
    }
    .vsebina_strani {
        grid-area: vsebina_strani;
    }
    .noga {
        grid-area: noga;
    }
    .small_banner {
        display: none;
    }
    .big_banner {
        display: block;
    }
    /*seznam kanalov kontainer*/
    .logotipi {
        display: grid;
        grid-gap:0px;
        grid-template-columns: 1fr 1fr 1fr 1fr;
        justify-content: center;
    }
    .logo_kanal {
        width: 240px;
        height: auto;
        opacity: 0.8;
        filter: grayscale(20%);
    }

    .logo_kanal:hover {
        filter: grayscale(0%);
        opacity: 1;
    }
    /*seznam ponudnikov*/
    .ponudniki_seznam {
        display: grid;
        grid-gap: 40px;
        grid-template-columns: 1fr 1fr 1fr 1fr;
    }
    /*izpis sporeda*/
    .izpis_sporeda {
        display: grid;
        grid-template-columns: auto;
        grid-template-areas:
        "izbirnik_kanalov"
        "naslov_izbranega_kanala"
        "vsebina_programa";
    }
    .izbirnik_kanalov {
        grid-area: izbirnik_kanalov;
        vertical-align: middle;
    }
    .naslov_izbranega_kanala {
        grid-area: naslov_izbranega_kanala;
    }
    .vsebina_programa {
        grid-area: vsebina_programa;
        max-width: 960px;
    }
}