body {font-family: 'Roboto Condensed', sans-serif;}
a {color: #000;}
a:hover {color: #000;}
#clanek a, .clanekObsah a {color: #0083da;}
#clanek a:hover, .clanekObsah a:hover {color: #0083da; text-decoration: underline;}

#motiv {
	background-size: cover;
  /*font-family: 'Grandstander', sans-serif;*/ 
  /*font-weight: 200;*/
	color: #fff;
	font-size: 2rem;
	font-weight:  bold;
	text-shadow: 0.5px 0.5px 1px #000;
  margin-top: 20px;
  /*
  padding-top: 2rem;
  padding-bottom: 2rem;
  */
}
#motiv1 {background: rgba(255,235,0,0.5); padding: 60px 30px;}
#motiv2 {background: rgba(9,150,0,0.3); padding: 60px 30px;}
#motiv3 {background: rgba(0,142,255,0.3);}

.motivBg1 {background: url(img/motiv-1.jpg) no-repeat bottom;}
.motivBg2 {background: url(img/motiv-2.jpg) no-repeat bottom;}
.motivBg3 {background: url(img/motiv-3.jpg) no-repeat bottom;}
.motivBg4 {background: url(img/motiv-4.jpg) no-repeat bottom;}
.motivBg5 {background: url(img/motiv-5.jpg) no-repeat bottom;}
.motivBg6 {background: url(img/motiv-6.jpg) no-repeat bottom;}
.motivBg7 {background: url(img/motiv-7.jpg) no-repeat bottom;}

#menu1 {margin-bottom: 5px; text-align: right;}
#menu1 a {padding-right: .75rem;}
#menu2 {margin-bottom: 0px; text-align: right;}
#menu1 a, #menu2 a {border-bottom: 1px solid transparent;}
#menu1 a:hover {border-bottom: 1px solid #000000;}
#menu2 a {color: #0083da; /*font-weight: bold;*/ font-size: 1.2rem; text-transform: uppercase;}
#menu2 a:hover { border-bottom: 1px solid #0083da; }  /*text-decoration: underline; text-decoration-style: wavy; text-decoration-color: #0083da; text-decoration-thickness: 1px;*/
#menu1 a.active {background: #eee;}
#menu2 a.active {background: #e2f4ff;}

.navbar {padding-right: 0;}

#obsah {margin-bottom: 100px;}
#menu3 {
    position: fixed; right: 0; bottom: 0; left: 0; z-index: 1030;   /* místo class fixed-bottom */
    display: inline-block; background: rgba(255,255,255,0.9); margin: 0px; padding: 0px 30px;
}
/*
#drobecky {background: #e2f4ff;}
#podmenu {background: #3a9fe2;}
*/

/* tělovka světlá, tmavší: #fff9f1, #fff3e3 */
#rDrobeckyPodmenu {background: url(img/bg-podmenu.png) repeat-y; background-size: 100%;}
#drobecky {background: #fff9f1; padding: 20px 30px; font-size: 1.2em;}
#drobecky i {font-size: 0.7em; margin-left: 10px; margin-right: 10px; color: #0083da;}
#podmenu {background: #fff3e3; padding: 20px 30px;}
#podmenu a {color: #000; font-size: 1.2em;}
#podmenu a:hover {color: #0083da;}

/* MOZAIKA ČLÁNKŮ */
a.dlazdice {}
a.dlazdice h5 { font-size: 1.2rem; font-weight: normal; margin-bottom: 0; /*font-weight: 200;*/}
a.dlazdice.zvyraznit h5 {font-size: 1.4rem; font-weight: normal; /*font-weight: 200;*/}
a.dlazdice img {
/*
  -webkit-filter: grayscale(70%);
  filter: grayscale(70%);
*/
  transition: 0.6s;
}
a.dlazdice:hover img {
  -webkit-filter: grayscale(0%);
  filter: grayscale(0%);
  transform: scale(1.1);
}

a.dlazdice .card-bg-1 {background: rgba(150,150,150,0.8); transition: 0.6s;}
a.dlazdice .card-bg-2 {background: rgba(170,170,170,0.8); transition: 0.6s;}
a.dlazdice .card-bg-3 {background: rgba(190,190,190,0.8); transition: 0.6s;}
a.dlazdice .card-bg-4 {background: rgba(210,210,210,0.8); transition: 0.6s;}
a.dlazdice .card-bg-5 {background: rgba(230,230,230,0.8); transition: 0.6s;}
a.dlazdice .card-bg-6 {background: rgba(250,250,250,0.8); transition: 0.6s;}
a.dlazdice .card-bg-7 {background: rgba(255,255,255,0.8); transition: 0.6s;} /* aby bylo více světlých ploch */

/* zvyraznena dlazdice zluta */
a.dlazdice.zvyraznitNew3 .card-bg-1, 
a.dlazdice.zvyraznitNew3 .card-bg-2,
a.dlazdice.zvyraznitNew3 .card-bg-3,
a.dlazdice.zvyraznitNew3 .card-bg-4,
a.dlazdice.zvyraznitNew3 .card-bg-5,
a.dlazdice.zvyraznitNew3 .card-bg-6,
a.dlazdice.zvyraznitNew3 .card-bg-7 {background: rgb(241,218,78); /* = #f1da4e */ }

/* zvyraznena dlazdice zelena */
a.dlazdice.zvyraznitNew4 .card-bg-1, 
a.dlazdice.zvyraznitNew4 .card-bg-2,
a.dlazdice.zvyraznitNew4 .card-bg-3,
a.dlazdice.zvyraznitNew4 .card-bg-4,
a.dlazdice.zvyraznitNew4 .card-bg-5,
a.dlazdice.zvyraznitNew4 .card-bg-6,
a.dlazdice.zvyraznitNew4 .card-bg-7 {background: rgb(158,188,100); }

/* zvyraznena dlazdice modra */
a.dlazdice.zvyraznitNew5 .card-bg-1, 
a.dlazdice.zvyraznitNew5 .card-bg-2,
a.dlazdice.zvyraznitNew5 .card-bg-3,
a.dlazdice.zvyraznitNew5 .card-bg-4,
a.dlazdice.zvyraznitNew5 .card-bg-5,
a.dlazdice.zvyraznitNew5 .card-bg-6,
a.dlazdice.zvyraznitNew5 .card-bg-7 {background: rgb(112,159,202); }

/* hover */
a.dlazdice:hover .card-bg-1,
a.dlazdice:hover .card-bg-2,
a.dlazdice:hover .card-bg-3,
a.dlazdice:hover .card-bg-4,
a.dlazdice:hover .card-bg-5,
a.dlazdice:hover .card-bg-6,
a.dlazdice:hover .card-bg-7 {background: rgba(0,0,0,0.7);}
a.dlazdice:hover {color: #fff; text-decoration: none;}




@media (min-width: 576px) {  /* sm */
    .card-columns {column-count: 1;}
}
@media (min-width: 630px) {  /* sm-md - jeden sloupec už bylo málo */
    .card-columns {column-count: 2;}
    #mozaika {background: url(img/bg-mozaika-2-sloupce.png) repeat-y; background-size: 100%;}
}
@media (min-width: 768px) {   /* md */
    .card-columns {column-count: 2;}
    #mozaika {background: url(img/bg-mozaika-2-sloupce.png) repeat-y; background-size: 100%;}
}
@media (min-width: 992px) {  /* lg */
    .card-columns {column-count: 3;}
    #mozaika {background: url(img/bg-mozaika-3-sloupce.png) repeat-y; background-size: 100%;}
}
@media (min-width: 1200px) {   /* xl */
    .card-columns {column-count: 3;}
    #mozaika {background: url(img/bg-mozaika-3-sloupce.png) repeat-y; background-size: 100%;}
}
@media (min-width: 1400px) {  /* xxl */
    .card-columns {column-count: 4;}
    #mozaika {background: url(img/bg-mozaika-4-sloupce.png) repeat-y; background-size: 100%;}
    
    .card-columns-minigalerie {column-count: 3;}
    #mozaika.card-columns-minigalerie {background: url(img/bg-mozaika-3-sloupce.png) repeat-y; background-size: 100%;}
}
@media (min-width: 2200px) {  
    .card-columns {column-count: 5;}
    #mozaika {background: url(img/bg-mozaika-5-sloupcu.png) repeat-y; background-size: 100%;}
    
    .card-columns-galerie {column-count: 4;}
    #mozaika.card-columns-galerie {background: url(img/bg-mozaika-4-sloupce.png) repeat-y; background-size: 100%;}
    
    .card-columns-minigalerie {column-count: 3;}
    #mozaika.card-columns-minigalerie {background: url(img/bg-mozaika-3-sloupce.png) repeat-y; background-size: 100%;}
}

/* vetsi pismo v dlazdicich: */
@media (min-width: 1600px) {  
    a.dlazdice h5 {font-size: 1.3rem;}
    a.dlazdice.zvyraznit h5 {font-size: 1.6rem;}
}
@media (min-width: 1900px) {  
    a.dlazdice h5 {font-size: 1.5rem;}
    a.dlazdice.zvyraznit h5 {font-size: 1.8rem;}
    .card-body {padding: 2rem;}
}

.card-columns {column-gap: 0rem;}
.card {border: none; border-radius: 0; }
.card-columns .card {margin-bottom: 0;}

/* CLANEK DETAIL */
#clanek {font-family: 'Roboto', sans-serif; background: #eee;}
.clanekGalerie {}
.clanekObsah {background: #fff; padding: 30px; font-family: 'Roboto', sans-serif;}
.clanekWysiwyg {margin-top: 30px; margin-bottom: 30px;}
.clanekWysiwyg img, .clanekWysiwyg iframe {max-width: 100%;}

/* video v galerii - přes celou šířku a automatická výška */
.video-container {
    position: relative;
    padding-bottom: 56.25%; /* 16:9 */
    height: 0;
}
.video-container iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

#galerieModal .modal-content {background: rgba(0,0,0,0.9); color: #fff; border-radius: 0;}
#galerieModal .modal-header {border-bottom: none;}
#galerieModal .close {
    font-size: 1.5rem;
    color: rgba(255,255,255,0.8);
    text-shadow: none;
    opacity: 1;
}
#galerieModal .carousel-caption {position: static;}

#clanek a.partner, .clanekObsah a.partner {color: #000; text-decoration: none;}
#clanek a.partner:hover, .clanekObsah a.partner:hover {color: #000; text-decoration: none;}


/* patička při menších rozlišeních nebude fixed-bottom */
@media (max-width: 575px) {
    #obsah {margin-bottom: 0px;}
    #menu3 {
        position: static; z-index: auto;
        display: block; background: #fff;
    }
}

/* logo menší na malých obrazovkách */
@media (max-width: 576px) {
    #logo {width: 47vw;}
    #menu3 {padding-left: 0px; padding-right: 0px;}   
}

