@charset "utf-8";

@import url('https://fonts.googleapis.com/css?family=Open+Sans:300,400&display=swap');

/* CSS Document */
body {
    margin: 0;
    /* pouze pro šablonu zvlášť, při implementaci smazat! */
    color: #222;
    /*	background: #bae2fc url(https://cdn.alza.cz/Styles/full/images/bg-gradient.png) repeat-x top center;*/
}

#obal {
    margin: 0 auto;
    /*width: calc(100% + 60px);
	margin-left: -30px;*/
    max-width: 1255px;
    /*	max-width: 920px;*/
}

#celek {
    font-family: "Open Sans", "Verdana", "DejaVu Sans", "Trebuchet MS", Verdana, sans-serif;
    font-weight: 300;
    margin: 0 auto;
    background-color: #red;
    height: auto;
    margin-left: 0;
    width: 100%;
}

#celek p,
#celek h2 {
    font-family: "Open Sans", "Verdana", "DejaVu Sans", "Trebuchet MS", Verdana, sans-serif !important;
    font-weight: 300;
}

#celek .blok {
    display: block;
}

#celek figure {
    margin: 0;
}

#celek .blok.prvni,
#celek .blok.druhy,
#celek .blok.treti,
#celek .blok.ctvrty,
#celek .blok.paty {
    position: relative;
}

#celek .blok.prvni .obsah,
#celek .blok.druhy .obsah,
#celek .blok.treti .obsah,
#celek .blok.ctvrty .obsah,
#celek .blok.paty .obsah {
    position: relative;
}

#celek .blok.prvni .obsah img.pozadi-transparent {
    display: block;
    max-width: 100%;
    background-image: url("https://cdn.alza.cz/Foto/LegendFoto/EN/Files/sablona/tcl/televize/es56/assets/1_header-tv.png");
    background-size: contain;
    background-repeat: no-repeat;
    z-index: 1;
    position: relative;
}

#celek .blok.prvni .obsah .pozadi-transparent {
    z-index: -3000;
    position: relative;
}

#celek .blok.prvni .obsah .logo-tcl {
    display: block;
    max-width: 100%;
    z-index: 1;
    position: absolute;
    color: white;
    top: 0;
    right: 0;
    margin-top: 0px;
    margin-right: 75px;
}

#celek .blok.prvni .obsah .logo-tcl img {
    max-width: 85px;
}

#celek .blok.prvni .obsah .loga-sluzby {
    display: block;
    max-width: 1255px;
    z-index: 1;
    position: relative;
    color: white;
    top: 0;
    right: 0;
    margin-top: 0px;
    margin-right: 0px;
}

#celek .blok.prvni .obsah .loga-sluzby img {
    width: 750px;
}

#celek .blok.prvni .obsah .vpravo {
    display: block;
    max-width: 43%;
    z-index: 1;
    position: absolute;
    color: white;
    top: 0;
    right: 0;
    margin-top: 55px;
    margin-right: 50px;
}

#celek .blok.prvni .obsah .nadpis {
    display: inline-block;
    z-index: 3000;
    position: relative;
    color: white;
    top: 0;
    right: 0;
}

#celek .blok.prvni .obsah .text {
    display: inline-block;
    z-index: 1;
    position: relative;
    color: white;
    top: 0;
    right: 0;
    margin-top: 1.5em;
}

#celek .blok.prvni .obsah .nadpis h2 {
    color: white;
    font-size: 30px;
    line-height: 1em;
    margin: 0;
    padding: 0;
    padding-bottom: 10px;
    border-bottom: 1px solid red;
}

#celek .blok.prvni .obsah .text p {
    color: white;
    font-size: 11px;
    line-height: 1.5em;
    margin: 0;
    padding: 0;
}






/* https://the-echoplex.net/flexyboxes/?fixed-height=on&display=flex&flex-direction=row&flex-wrap=nowrap&justify-content=flex-start&align-items=flex-start&align-content=stretch&order%5B%5D=1&flex-grow%5B%5D=0&flex-shrink%5B%5D=1&flex-basis%5B%5D=auto&align-self%5B%5D=center&order%5B%5D=2&flex-grow%5B%5D=0&flex-shrink%5B%5D=1&flex-basis%5B%5D=auto&align-self%5B%5D=center */
#celek .blok.druhy .obsah {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: flex-start;
    align-content: stretch;
    align-items: flex-start;
}

#celek .blok.druhy .obsah .vlevo {
    order: 1;
    flex: 0 1 auto;
    align-self: center;
    margin-top: 75px;
    margin-bottom: 75px;
    width: 50%;
}

#celek .blok.druhy .obsah .vpravo {
    order: 2;
    flex: 0 1 auto;
    align-self: center;
    padding-left: 50px;
    padding-right: 50px;
    width: 50%;
}

#celek .blok.druhy .obsah .vlevo img {
    width: 350px;
}

#celek .blok.druhy .obsah .vpravo .nadpis {
    color: #e84e0f;
}

#celek .blok.druhy .obsah .vpravo .text {
    color: black;
    margin-top: 1.5em;
}

#celek .blok.druhy .obsah .vpravo .nadpis h2 {
    color: #e84e0f;
    font-size: 20px;
    line-height: 1em;
    margin: 0;
    padding: 0;
    padding-bottom: 10px;
    border-bottom: 1px solid #bcbcbc;
    display: inline-block;
}

#celek .blok.druhy .obsah .vpravo .text p {
    color: black;
    font-size: 11px;
    line-height: 1.5em;
    margin: 0;
    padding: 0;
}

#celek .blok.druhy .obsah .vpravo .loga-aplikace {
    margin-top: 65px;
    width: auto
}

#celek .blok.druhy .obsah .vpravo .loga-aplikace img {
    width: 300px;
}















#celek .blok.treti .obsah {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: flex-start;
    align-content: stretch;
    align-items: flex-start;
    background: #83acd4;
}

#celek .blok.treti .obsah .vlevo {
    order: 1;
    flex: 0 1 auto;
    align-self: center;
    margin-top: 0;
    margin-bottom: -5px;
    width: 50%;
}

#celek .blok.treti .obsah .vpravo {
    order: 2;
    flex: 0 1 auto;
    align-self: center;
    padding-left: 50px;
    padding-right: 50px;
    width: 50%;
}

#celek .blok.treti .obsah .vlevo img {
    width: 100%;
    cursor: pointer;
    margin-bottom: -5px;
}

#celek .blok.treti .obsah .vpravo .nadpis {
    color: white;
}

#celek .blok.treti .obsah .vpravo .text {
    color: black;
    margin-top: 1.5em;
}

#celek .blok.treti .obsah .vpravo .nadpis h2 {
    color: white;
    font-size: 20px;
    line-height: 1em;
    margin: 0;
    padding: 0;
    padding-bottom: 10px;
    border-bottom: 1px solid black;
    display: inline-block;
}

#celek .blok.treti .obsah .vpravo .text p {
    color: black;
    font-size: 11px;
    line-height: 1.5em;
    margin: 0;
    padding: 0;
}

#celek .blok.treti .obsah .vpravo .loga-aplikace {
    margin-top: 65px;
    width: auto
}

#celek .blok.treti .obsah .vpravo .loga-aplikace img {
    width: auto;
}













#celek .blok.ctvrty .obsah {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: flex-start;
    align-content: stretch;
    align-items: flex-start;
    background: white;
}

#celek .blok.ctvrty .obsah .vlevo {
    order: 1;
    flex: 0 1 auto;
    align-self: center;
    margin-top: 75px;
    margin-bottom: 75px;
    width: 50%;
}

#celek .blok.ctvrty .obsah .vpravo {
    order: 2;
    flex: 0 1 auto;
    align-self: center;
    padding-left: 50px;
    padding-right: 50px;
    width: 50%;
}

#celek .blok.ctvrty .obsah .vlevo img {
    width: 350px;
}

#celek .blok.ctvrty .obsah .vpravo .nadpis {
    color: #1faf76;
}

#celek .blok.ctvrty .obsah .vpravo .text {
    color: black;
    margin-top: 1.5em;
}

#celek .blok.ctvrty .obsah .vpravo .nadpis h2 {
    color: #1faf76;
    font-size: 20px;
    line-height: 1em;
    margin: 0;
    padding: 0;
    padding-bottom: 10px;
    border-bottom: 1px solid #bcbcbc;
    display: inline-block;
}

#celek .blok.ctvrty .obsah .vpravo .text p {
    color: black;
    font-size: 11px;
    line-height: 1.5em;
    margin: 0;
    padding: 0;
}

#celek .blok.ctvrty .obsah .vpravo .loga-aplikace {
    margin-top: 65px;
    width: auto
}

#celek .blok.ctvrty .obsah .vpravo .loga-aplikace img {
    width: 200px;
}

















#celek .blok.paty .obsah {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: flex-start;
    align-content: stretch;
    align-items: flex-start;
    background: #83acd4;
    margin-bottom: 0em;
}

#celek .blok.paty .obsah .vlevo {
    order: 1;
    flex: 0 1 auto;
    align-self: center;
    margin-top: 0;
    margin-bottom: -5px;
    width: 50%;
}

#celek .blok.paty .obsah .vpravo {
    order: 2;
    flex: 0 1 auto;
    align-self: center;
    padding-left: 50px;
    padding-right: 50px;
    width: 50%;
}

#celek .blok.paty .obsah .vlevo img {
    width: 100%;
    cursor: pointer;
}

#celek .blok.paty .obsah .vpravo .nadpis {
    color: white;
}

#celek .blok.paty .obsah .vpravo .text {
    color: black;
    margin-top: 1.5em;
}

#celek .blok.paty .obsah .vpravo .nadpis h2 {
    color: white;
    font-size: 20px;
    line-height: 1em;
    margin: 0;
    padding: 0;
    padding-bottom: 10px;
    border-bottom: 1px solid black;
    display: inline-block;
}

#celek .blok.paty .obsah .vpravo .text p {
    color: black;
    font-size: 11px;
    line-height: 1.5em;
    margin: 0;
    padding: 0;
}

#celek .blok.paty .obsah .vpravo .loga-aplikace {
    margin-top: 65px;
    width: auto
}

#celek .blok.paty .obsah .vpravo .loga-aplikace img {
    width: auto;
}
























#celek .blok.sesty .obsah {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: flex-start;
    align-content: stretch;
    align-items: flex-start;
    background: white;
}

#celek .blok.sesty .obsah .vlevo {
    order: 1;
    flex: 0 1 auto;
    align-self: center;
    margin-top: 75px;
    margin-bottom: 75px;
    width: 50%;
}

#celek .blok.sesty .obsah .vpravo {
    order: 2;
    flex: 0 1 auto;
    align-self: center;
    padding-left: 50px;
    padding-right: 50px;
    width: 50%;
}

#celek .blok.sesty .obsah .vlevo img {
    width: 350px;
}

#celek .blok.sesty .obsah .vpravo .nadpis {
    color: #627900;
}

#celek .blok.sesty .obsah .vpravo .text {
    color: black;
    margin-top: 1.5em;
}

#celek .blok.sesty .obsah .vpravo .nadpis h2 {
    color: #627900;
    font-size: 20px;
    line-height: 1em;
    margin: 0;
    padding: 0;
    padding-bottom: 10px;
    border-bottom: 1px solid #bcbcbc;
    display: inline-block;
}

#celek .blok.sesty .obsah .vpravo .text p {
    color: black;
    font-size: 11px;
    line-height: 1.5em;
    margin: 0;
    padding: 0;
}

#celek .blok.sesty .obsah .vpravo .loga-aplikace {
    margin-top: 65px;
    width: auto
}

#celek .blok.sesty .obsah .vpravo .loga-aplikace img {
    width: auto;
}














#celek .blok.druhytest .obsah img.pozadi-transparent {
    display: block;
    max-width: 100%;
    background-image: url("https://i.alza.cz/Foto/LegendFoto/EN/Files/sablona/tcl/televize/assets/2_komplet.png");
    background-size: contain;
    background-repeat: no-repeat;
    z-index: -3000;
    position: relative;
}

#celek .blok.druhytest .obsah .pozadi-transparent {
    z-index: -3000;
    position: relative;
}

#celek .blok.druhytest .obsah .vpravo {
    display: block;
    max-width: 43%;
    z-index: 3000;
    position: absolute;
    color: white;
    top: 0;
    right: 0;
    margin-top: 110px;
    margin-right: 50px;
}

#celek .blok.druhytest .obsah .nadpis {
    display: inline-block;
    z-index: 3000;
    position: relative;
    color: #e84e0f;
    top: 0;
    right: 0;
}

#celek .blok.druhytest .obsah .text {
    display: inline-block;
    z-index: 3000;
    position: relative;
    color: black;
    top: 0;
    right: 0;
    margin-top: 1.5em;
}

#celek .blok.druhytest .obsah .nadpis h2 {
    color: #e84e0f;
    font-size: 30px;
    line-height: 1em;
    margin: 0;
    padding: 0;
    padding-bottom: 10px;
    border-bottom: 1px solid #bcbcbc;
}

#celek .blok.druhytest .obsah .text p {
    color: black;
    font-size: 16px;
    line-height: 1.5em;
    margin: 0;
    padding: 0;
}


#uvodniVideoTCL {
    display: block;
    position: absolute;
    width: 400px;
    top: 0;
    left: 0;
    z-index: 9;
    margin-top: 54px;
    margin-left: 63px;
}

#uvodniVideoTCL img,
#uvodniVideoTCL iframe {
    width: 100%;
    height: 222px;
}

#uvodniVideoTCL img {
    cursor: pointer;
}


#uvodniVideoTCL {
    display: block;
    position: absolute;
    width: 304px;
    top: 0;
    left: 0;
    z-index: 9;
    margin-top: 36px;
    margin-left: 51px;
}

#uvodniVideoTCL img,
#uvodniVideoTCL iframe {
    width: 100%;
    height: 170px;
}

#uvodniVideoTCL img {
    cursor: pointer;
}