/*-----------------------------------------------------------------*/
/*-----------------------------------------------------------------*/

a {text-decoration: none; color: rgb(8,11,185);}
a:hover {cursor: pointer;}

img, video {border: none; color: rgb(234,234,234);}
:active, :focus {outline: none; -moz-outline-style: none;}

* {margin: 0;}
html {height: 100%;}
body {height: 100%; font-family: 'Lucida Grande', Arial, 'Lucida Sans Unicode', sans-serif; font-size: 13px; text-decoration: none; background-color: rgb(208,207,203); background-image: url("https://grafika.webperfecting.com/textury/noise-svetlesedohneda9.png?vs=1s6tu618sut"); background-repeat: repeat;}
#stranka {width: 88%; max-width: 1690px; min-height: 100%; height: auto !important; height: 100%; position: relative; top: 0px; left: 0px; display: block; margin: 0 auto -40px auto;}
#obsah {width: 100%; display: block; padding: 72px 0 27px 0;}

/*-----------------------------------------------------------------*/
/*-----------------------------------------------------------------*/

#sablony_popisek {font-size: 15px; color: rgb(40,40,40); margin-bottom: 5px;}
#sablony_popisek a {cursor: pointer; color: rgb(40,40,40); border-bottom: dotted 1px white}

.sablony_filtr_ramecek {font-size: 14px; color: rgb(50,50,50); margin: 10px 5px 0 0;}
.sablony_filtr_odkaz {height: 30px; position: relative; display: block; float: left; color: white; text-align: center; font-size: 12px; line-height: 30px; cursor: pointer; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; background-color: rgb(35,181,1); padding: 0 12px 0 12px; margin: 10px 10px 0 0;}
.sablony_filtr_odkaz:hover, .sfo_aktivni {background-color: rgb(35,181,1); -webkit-box-shadow: 0px 0px 2px 1px rgb(128, 251, 118); -moz-box-shadow: 0px 0px 2px 1px rgb(128, 251, 118); box-shadow: 0px 0px 2px 1px rgb(128, 251, 118);}

#sablony_ramecek {width: calc(100% + 20px); display: table; margin: 5px 0 0 0;}
.sablona_ramecek {width: 300px; height: 169px; display: table; float: left; margin: 20px 30px 0 0;}

.sablona_textura {width: 48px; height: 48px; position: absolute; display: inline-block; background-repeat: repeat; border: solid 1px gray; -webkit-border-radius: 24px; -moz-border-radius: 30px; border-radius: 30px; margin-top: 15px; margin-left: 7px;}

.sablona_ramecek img {border-radius: 4px; -moz-border-radius: 4px; -webkit-border-radius: 4px; -webkit-box-shadow: 0px 0px 2px 1px rgba(130,130,130,1); -moz-box-shadow: 0px 0px 2px 1px rgba(130,130,130,1); box-shadow: 0px 0px 2px 1px rgba(130,130,130,1); border: solid 1px rgba(170,170,170,0.5);}

.obrazek_samotny {width: 300px; height: 169px; display: block; border-radius: 4px; -moz-border-radius: 4px; -webkit-border-radius: 4px;}
.obrazek_samotny:hover ~ .sablona_odkazy {display: inline-block;}

.sablona_nazev {width: 100%; height: 36px; display: block; text-align: center; color: rgb(40,40,40); box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; padding: 0 5px 0 5px; margin: 3px 0 0 0;}
.sablona_nazev_nazev {color: rgb(30,30,30); font-size: 14px; font-weight: bold;}

.sablona_odkazy {width: 100%; position: relative; padding: 0 5px 0 5px; margin: -40px 0; display: inline-block; float: left; box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box;}
.sablona_odkazy:hover {display: inline-block;}

.ukazat_vybrano {height: 100%; display: block; position: absolute; top: 0px; left: 75px; cursor: pointer; color: rgb(8,11,185); text-align: center; white-space: nowrap; margin-left: auto; margin-right: auto;}
.ukazat_vybrano .ukazat_polozky {width: 100px; position: absolute; top: -7px; display: none; line-height: 23px; background-color: rgb(220,220,220); border-radius: 5px; -moz-border-radius: 5px; border: solid 1px rgb(170,170,170); -webkit-border-radius: 5px; -webkit-box-shadow: 0px 1px 2px 1px rgb(161,161,161); -moz-box-shadow: 0px 1px 2px 1px rgb(161,161,161); box-shadow: 0px 1px 2px 1px rgb(161,161,161); padding: 3px; margin: 0 auto 0 auto; z-index: 10;}
.ukazat_vybrano:hover .ukazat_polozky {display: inline-block;}
.ukazat_vybrano .ukazat_polozky .ukazat_polozka {width: 100px; float: left; text-align: left;}
.ukazat_vybrano .ukazat_polozky .ukazat_polozka:hover {background: rgb(73,155,234); background: -moz-linear-gradient(top, rgba(73,155,234,1) 0%, rgba(32,124,229,1) 100%); background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(73,155,234,1)), color-stop(100%,rgba(32,124,229,1))); background: -webkit-linear-gradient(top,  rgba(73,155,234,1) 0%,rgba(32,124,229,1) 100%); background: -o-linear-gradient(top,  rgba(73,155,234,1) 0%,rgba(32,124,229,1) 100%); background: -ms-linear-gradient(top,  rgba(73,155,234,1) 0%,rgba(32,124,229,1) 100%); background: linear-gradient(to bottom,  rgba(73,155,234,1) 0%,rgba(32,124,229,1) 100%); filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#499bea', endColorstr='#207ce5', GradientType=0); color: white;}

.sablona_ukazat, .sablona_vybrat {height: 26px; position: relative; display: inline-block; float: left; text-align: center; font-size: 12px; line-height: 26px; cursor: pointer; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; padding: 0 12px 0 12px; margin-left: 7px; /* tlacitko zelene */ color: white; border: solid 1px rgb(80,120,80); -webkit-box-shadow: inset 0 1px 3px -1px white; -moz-box-shadow: inset 0 1px 3px -1px white; box-shadow: inset 0 1px 3px -1px white; background: rgb(255,255,255); background: -moz-linear-gradient(top, rgba(255,255,255,1) 0%, rgba(30,165,0,1) 0%, rgba(33,132,0,1) 100%); background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(255,255,255,1)), color-stop(0%,rgba(30,165,0,1)), color-stop(100%,rgba(33,132,0,1))); background: -webkit-linear-gradient(top, rgba(255,255,255,1) 0%,rgba(30,165,0,1) 0%,rgba(33,132,0,1) 100%); background: -o-linear-gradient(top, rgba(255,255,255,1) 0%,rgba(30,165,0,1) 0%,rgba(33,132,0,1) 100%); background: -ms-linear-gradient(top, rgba(255,255,255,1) 0%,rgba(30,165,0,1) 0%,rgba(33,132,0,1) 100%); background: linear-gradient(to bottom, rgba(255,255,255,1) 0%,rgba(30,165,0,1) 0%,rgba(33,132,0,1) 100%); filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#218400', GradientType=0);}

.sablona_ukazat:active, .sablona_vybrat:active {/* tlacitko sede */ color: rgb(210,210,210); border: solid 1px rgb(80,80,80); -webkit-box-shadow: inset 0 1px 3px -1px white; -moz-box-shadow: inset 0 1px 3px -1px white; box-shadow: inset 0 1px 3px -1px white; background-color: rgb(100,100,100); background: -moz-linear-gradient(top,  rgba(100,100,100,1) 0%, rgba(90,90,90,1) 100%); background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(100,100,100,1)), color-stop(100%,rgba(90,90,90,1))); background: -webkit-linear-gradient(top,  rgba(100,100,100,1) 0%,rgba(90,90,90,1) 100%); background: -o-linear-gradient(top,  rgba(100,100,100,1) 0%,rgba(90,90,90,1) 100%); background: -ms-linear-gradient(top,  rgba(100,100,100,1) 0%,rgba(90,90,90,1) 100%); background: linear-gradient(to bottom,  rgba(100,100,100,1) 0%,rgba(90,90,90,1) 100%); filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#353535', endColorstr='#323232', GradientType=0);}

@media only screen and (max-width: 740px) and (min-width: 660px) {.sablona_ramecek {width: 265px; height: 149px;} .obrazek_samotny {width: 265px; height: 149px;}}
@media only screen and (max-width: 659px) and (min-width: 568px) {.sablona_ramecek {width: 225px; height: 127px;} .obrazek_samotny {width: 225px; height: 127px;}}
@media only screen and (max-width: 355px) {.sablona_ramecek {width: 280px; height: 157px;} .obrazek_samotny {width: 280px; height: 157px;}}

@media only screen and (max-width: 567px) {.sablona_ramecek { margin-right: 0; margin-top: 30px;}}

/*-----------------------------------------------------------------*/
/*-----------------------------------------------------------------*/
/* vu_... (je na vice mistech) */

#vu_ramecek_stranky_vytvorit {width: 40%; display: block; position: relative; left: 30%; float: left; border: solid 2px rgb(247,155,60); border-radius: 7px; -moz-border-radius: 7px; -webkit-border-radius: 7px; background: rgb(80,111,247); -webkit-box-shadow: inset 0 5px 25px 1px rgb(82,70,187); -moz-box-shadow: inset 0 5px 25px 1px rgb(82,70,187); box-shadow: inset 0 5px 25px 1px rgb(82,70,187);}

#vu_ramecek_hlaska_hotovo {width: 60%; display: block; position: relative; left: 20%; float: left; border: solid 2px rgb(247,155,60); border-radius: 7px; -moz-border-radius: 7px; -webkit-border-radius: 7px; background: rgb(80,111,247); cursor: pointer;}

#stranky_vytvorit_nazev {width: 100%; height: 30px; position: relative; top: 0px; left: 0px; display: block; font-size: 14px; text-align: left; color: rgb(180,180,255); border: solid 1px rgb(120,120,255); background-color: transparent; padding: 0 3px 0 3px;}
#stranky_vytvorit_varovani {width: 100%; display: block; font-size: 12px; color: yellow; box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; margin-top: 5px;}
#stranky_vytvorit_odeslat {width: 100%; height: 35px; position: relative; top: 0px; left: 0px; display: block; font-size: 12px; text-align: center; cursor: pointer; background: rgb(0,100,247); border-radius: 4px; -moz-border-radius: 4px; -webkit-border-radius: 4px; box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; padding: 10px 30px 10px 30px; margin-top: 5px;}

@media only screen and (max-width: 700px) and (min-width: 401px) {#vu_ramecek_stranky_vytvorit {width: 60%; left: 20%;}}
@media only screen and (max-width: 400px) {#vu_ramecek_stranky_vytvorit {width: 80%; left: 10%;} #vu_ramecek_hlaska_hotovo {width: 80%; left: 10%;}}

/*-----------------------------------------------------------------*/
/*-----------------------------------------------------------------*/