/*
#------------------------------------------------------------------------
# Music State - October Joomla! template (for Joomla 2.5)
#
# Copyright (C) 2007-2013 Gavick.com. All Rights Reserved.
# License: Copyrighted Commercial Software
# Website: http://www.gavick.com
# Support: support@gavick.com 
*/

/* Here you can include your override CSS styles */


/* --- AllVideos (JoomlaWorks) prehrac videa ---
   Pomer videa pocita fitvids (JS sablony) z atributu width/height, ktere generuje
   plugin. Drzime ho tedy zde, aby aktualizace pluginu pomer nezmenila:
   video v obsahu clanku = 4:3 (K2 800x600), videoklipy v mrizce = 16:9 (K2 450x250). */
.avPlayerWrapper .avPlayerContainer .avPlayerBlock {
    width: 100% !important;
    position: relative !important;
    padding: 0 !important;
}

#gkMainbody article.item-page .fluid-width-video-wrapper {
    padding-top: 75% !important;
}

#gkMainbody .items-row.gkGrid .fluid-width-video-wrapper {
    padding-top: 56.25% !important;
}

div#itemVideoAnchor h3 {
    display: none;
}

.itemNavigation {
    clear: both;
    padding: 0;
    font-size: 12px;
    color: #7D7B7A;
    margin: 50px 0 0;
}

.itemLinks {
    clear: both;
    color: #aaa;
    font-size: 11px;
    font-weight: 300;
    margin: 5px 0 0px;
    text-transform: uppercase;
}

.itemNavigation {
    clear: both;
    padding: 0;
    font-size: 12px;
    color: #7D7B7A;
    margin: 5px 0 0;
}

#gkMainbody {
    margin-bottom: 20px;
}

#gkHeader.gkNoMenu {
    padding-top: 50px;
}

#gkSidebar {
    padding-left: 60px;
    padding-top: 25px;
}

article header h1, article header h2 {
    font-size: 40px;
    font-weight: 300;
    margin: 0;
    text-transform: none;
}

li.itemVideo {
    display: none;
}

.fluid-width-video-wrapper {
    height: auto;
    margin: 0 auto 0 auto;
}

a.readon {
    float: right;
}

/* tlacitko "Cist dal..." vpravo (jako v K2) - Joomla CSS ma #gkMainbody .readmore > a { float: left } */
#gkMainbody .readmore > a.readon {
    float: right;
}

h2, .componentheading {
    font-size: 33px;
    font-weight: 400;
    text-transform: none;
}

#k2Container {
    max-width: 882px;
    margin: 0 auto;
}

/* --- com_content ekvivalenty K2 kontejneru (#k2Container) ---
   Bez toho je obsah clanku/blogu roztazeny na celou sirku, misto aby byl
   max 882px a vycentrovany (tak jako na petrvit.com). */
#gkMainbody .blog,
#gkMainbody article.item-page,
#gkMainbody .items-container {
    max-width: 882px;
    margin-left: auto;
    margin-right: auto;
}

/* --- Clanek (K2 itemView) - jako na petrvit.com ---
   K2 #k2Container ma margin-top 0 (Joomla ma "section article { margin-top: 20px }").
   Mezeru pod nadpisem dela prazdny ul v hlavicce (CSS sablony: "article header ul"). */
#gkMainbody article.item-page {
    margin-top: 0;
}

/* Popis kategorie - jako v K2 (běžné písmo, ne 13px uppercase) */
#gkMainbody .blog header div p {
    font-size: inherit;
    font-weight: inherit;
    line-height: inherit;
    text-transform: none;
}

/* --- Nadpis clanku v blogu - jako v K2 (40px / line-height 48px) ---
   Joomla CSS ma "section.blog .items-row header h2 { font-size: 28px }" (vyzsi
   specifinitou), proto tady pouzivame selector s #gkMainbody. */
#gkMainbody section.blog article header h1,
#gkMainbody section.blog article header h2 {
    font-size: 40px;
    line-height: 48px;
    font-weight: 300;
    margin: 0;
    text-transform: none;
}

/* K2: prazdna hlavicka clanku v mrizce (napr. video) ma spodni okraj 10px
   (K2 CSS: "#k2Container .itemsContainerWrap article header { margin-bottom: 10px }").
   Bez mrizky (blog) hlavicka spodni okraj nema - tam je mezi clanky jen 20px
   (margin-top clanku). */
#gkMainbody .items-row.gkGrid article > header {
    margin-bottom: 10px;
}

/* K2: mezi clanky v blogu je jen 20px (margin-top clanku).
   Joomla pridava navic 40px (items-row) a 50px (column) z joomla.css/tablet.css. */
#gkMainbody section.blog .items-row:not(.gkGrid) {
    margin-bottom: 0;
}

#gkMainbody section.blog .items-row:not(.gkGrid) > div {
    margin-bottom: 0;
}

/* Blog - hlavicka (nadpis + popis) bez spodniho okraje, v K2 ho neni */
#gkMainbody .blog > header {
    margin-bottom: 0;
}

/* --- Nadpis kategorie - jako v K2 (.itemsCategory > h2) ---
   K2: border-bottom 1px #eee, margin 0 0 48px, padding 0 0 24px */
#gkMainbody .blog > header > h2 {
    border-bottom: 1px solid #eee;
    margin: 0 0 48px;
    padding: 0 0 24px;
}

/* pocet clanku v nadpisu ma byt stejne velky jako nadpis (v K2 je to cast textu) */
#gkMainbody .blog > header > h2 small {
    font-size: inherit;
    line-height: inherit;
}

/* --- Popis kategorie - jako v K2 (.itemsCategory > p) ---
   K2: margin -24px 0 52px */
#gkMainbody .blog > header > div > p {
    margin: -24px 0 52px;
}

/* v K2 je za poslednim odstavcem popisu jeste prazdny odstavec,
   ktery zmenil odstup pred seznamem clanku na 29px */
#gkMainbody .blog > header > div > p:last-child {
    margin-bottom: 29px;
}

/* --- Mřížka článků - jako v K2 ---
   K2 dával mezi položkami 10px mezeru a poslední položku, která zustala sama
   v radku, rozSiril pres celou sirku.
   !important - protoze tablet.css/mobile.css nastavuji .items-row > div { padding: 0 !important } */
#gkMainbody .items-row.gkGrid {
    margin-bottom: 0 !important;
}

#gkMainbody .items-row.gkGrid > div {
    padding-left: 10px !important;
    padding-right: 10px !important;
    margin-bottom: 0 !important;
}

#gkMainbody .items-row.gkGrid > div > article {
    margin-left: 0;
    margin-right: 0;
}

/* posledni polozka sama v radku - pres celou sirku */
#gkMainbody .items-row.gkGrid > div.gkFullItem {
    width: 100% !important;
    float: none !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
}

/* Nadpis "Vice..." pred posledni polozkou - jako v K2 (h4 v #itemListLinks) */
#gkMainbody .items-row.gkGrid > div.gkFullItem > .gkMoreTitle {
    font-size: 22px;
    line-height: 35px;
    font-weight: 400;
    margin: 0 0 22px;
    padding: 0;
}

/* spodni okraj hlavnih obsahu - jako v K2 (20px) */
#gkMainbody {
    margin-bottom: 20px !important;
}

#gkBreadcrumb {
    border-bottom: 1px solid #e5e5e5;
    padding: 10px 0;
    max-width: 882px;
    margin: 2px auto 30px;
}

#gkFooter {
    border-top: none;
}
    
  #gkFooter a, #gkFooter a:active, #gkFooter a:focus, #gkFooter a:hover {
    color: #fff;
    background-color: #2f2f2f;
    padding: 5px;
}