body, :root 
{
    font-family: 'Open Sans', sans-serif;
    line-height: 150%;
    padding: 0;
    margin: 0;
    width: 100%;
    height: 100%;
    color: rgb(36,31,32);   
}




h2
{
    text-align: center;
}
div#menu
{
    width: 100%;
    background-color: white;
    position: fixed; 
    height: 5em;
    z-index: 1;
}
#skelet
{
    padding-top: 5em; /*výška id menu, aby nepřekrývalo element*/    
}
#footer
{
    width: 100%;
    background-color: rgb(208,16,19);
    color: white;
    text-align: center;
    padding: 0.5em;
    box-sizing: border-box;    
}
#footer a
{
    color: white;
    text-decoration: underline;      
}
#footer a:hover
{
    color: rgb(255,207,0);      
}
/*  
*********************************************************************************************************************************************
*/
.center
{
    text-align: center;
}
.justify
{
    text-align: justify;
}
.bold
{
    font-weight: bold;
}
.highlight
{
    font-weight: bold;
    color: rgb(208,16,19);
}
.highlightGold
{
    color: rgb(237,178,0);
}
.colorRed
{
    color: rgb(208,16,19);
}
.italic
{
    font-style: italic;
}
.bold
{
    font-weight: bold;
}
a
{
    text-decoration: none;
    color: rgb(208,16,19);     
}
a:hover
{
    text-decoration: underline;
    color: rgb(208,16,19); 
}
.fontSize125
{
    font-size: 125%;
}
.fontSize150
{
    font-size: 150%;
}
.fontSize90
{
    font-size: 90%;
}
.inline-block
{
    display: inline-block;
}
div#displayAll
{
        
}
div#displayMobile
{
    display: none;
}
@media (max-width: 500px) {
    div#displayAll
    {
        display: none;
    }
    div#displayMobile
    {
        display: inline-block;
    }          
}

/*  
*********************************************************************************************************************************************
*/
.segment
{
    width: 100%;
    background-color: white;
    display: inline-block; 
}
.coloredSegment
{
    background-color: rgba(255,205,0,0.8);
}
.coloredSegment2k
{
    background-color: #2b6a91 !important;
}
.textWhite
{
    color: white !important;
}
.box
{
    width: 80%;
    max-width: 1300px;
    margin: 0 auto;
    padding: 2em;
    display: block;
    box-sizing: border-box;
}
.boxAc
{
    width: 80%;
    max-width: 1300px;
    margin: 0 auto;
    padding: 2em;
    display: block;
    box-sizing: border-box;
}
@media (max-width: 1100px) 
{
    .box 
    {
        width: 90%; 
    }
    .boxAc 
    {
        width: 95%;
        padding: 1em; 
    }    
} 
@media (max-width: 800px) {
    .box 
    {
        width: 80%;   
    } 
    .boxAc 
    {
        width: 100%;
        padding: 0;   
    }       
}
@media (max-width: 500px) {
    .box 
    {
        width: 100%;
        padding: 0.5em;   
    }
}      
.box-frame
{
    display: inline-block;
    width: 100%;
}
img.introPhoto
{
    width: 100%;
}
div#all
{
    display: block;
}
div#mobile
{
    display: none;
}
@media (max-width: 800px) {
    div#mobile
    {
        display: block;
    }
    div#all
    {
        display: none;
    }
} 
/*  
*********************************************************************************************************************************************
*/
.top
{
    width: 50%;
    float: left;
    padding: 0.5em;
    box-sizing: border-box;
}
@media (max-width: 800px) {
    .top 
    {
        width: 100%;   
    }
} 
.symbol
{
    width: 30%;
    color: rgb(208,16,19);
    display: table-cell;
    vertical-align: middle;
    text-align: center;
    font-weight: bold;
    font-size: 115%;
}
.impres
{
    width: 70%;
    display: table-cell;
    vertical-align: middle;
    text-align: center;
    padding: 0.1em;
}
/*  
*********************************************************************************************************************************************
*/
div.campSelection
{
    max-width: 20em;
    max-height: 20em;
    color: white;
    display: table-cell;
    vertical-align: middle;
    text-align: center;
    cursor: pointer;
    font-weight: bold;
    font-size: 150%;
    padding: 1em;
    /* transition: background 2s; */
}
@media (max-width: 1100px) {
    div.campSelection 
    {
        font-size: 100%;
        line-height: 250%;   
    }
} 
@media (max-width: 500px) {
    div.campSelection 
    {
        font-size: 50%;       
    }
}
div#summer
{
    background-color: rgb(255,207,0);
}    
div#winter
{
    background-color: #2b6a91;
}    
div#summer:hover
{
    background-color: rgb(208,16,19); 
}
div#winter:hover
{
    background-color: rgb(208,16,19); 
}
.imgSeason
{
    width: 100%;
}

.campSelection a
{
    color: white;
    text-decoration: none;
}
/*  
*********************************************************************************************************************************************
*/
.leftColumn
{
    width: 50%;
    float: left;
    box-sizing: border-box;
    padding-right: 1em;
}
@media (max-width: 800px) {
    .leftColumn 
    {
        width: 100%;
        padding-right: 0;   
    }
} 
.rightColumn
{
    width: 50%;
    float: right;
    box-sizing: border-box;
    padding-left: 1em;    
}
@media (max-width: 800px) {
    .rightColumn 
    {
        width: 100%;
        padding-left: 0;   
    }
}
@media (max-width: 800px) {
    .noMargin
    {
        margin: 0;
    }
    div.rightColumn .noMargin
    {
        padding-bottom: 1em;
    }    
} 
/*  
*********************************************************************************************************************************************
*/
.photo
{
    height: 6em;
}
.line
{
    width: 100%;
    display: inline-block;    
}
.photo img
{
    height: 6em;
    width: 6em; 
    border-radius: 100%; 
}
/*  
*********************************************************************************************************************************************
*/

.koncept
{
    width: 50%;
    box-sizing: border-box;
    padding: 0.5em;
    float: left;
}
@media (max-width: 800px) {
    .koncept
    {
        width: 100%;
    }   
} 
.konceptWinter
{
    width: 100%;
    box-sizing: border-box;
    padding: 0.5em;
    float: left;
}
.konceptLogo
{
    height: 5em;
    width: 5em;
    border-radius: 100%;
    background-color: rgb(208,16,19);
    color: white;
    display: table-cell;
    vertical-align: middle;
    text-align: center;
    font-weight: bold;
    font-size: 125%;
}
/*  
*********************************************************************************************************************************************
*/
.actionWindow
{
    width: 50%;
    box-sizing: border-box;
    padding: 0.5em;
    float: left;
}
@media (max-width: 800px) {
    .actionWindow
    {
        width: 100%;
    }  
} 
.actionWindow:hover
{                     
    border: 1px solid rgb(255,207,0);
    cursor: pointer;
}
.actionWindow img
{
    width: 100%;
}
.actionText
{    
}
.actionName
{
    font-weight: bold;
    font-size: 125%;       
}
.actionBasic
{
   font-weight: bold;
   color: rgb(208,16,19);       
}
.actionDescription
{
    width: 100%;
    text-align: justify;
}
a.actionLink
{
    color: rgb(36,31,32);
}

/*  
*********************************************************************************************************************************************
*/
td.jpTerm
{
    width: 20%;
    color: rgb(208,16,19);
    font-weight: bold;
}
td.jpApl
{
    width: 20%;
}
table#jpTable a
{
    display: inline-block;
    height: 100%;
}
table#jpTable button
{
    font-size: 125%;
    padding: 10px 20px;
    color: rgb(36,31,32);
    cursor: pointer;
    border: none;
    font-weight: bold;
    background-color: rgb(208,16,19);
    color: white;
}
table#jpTable td
{
    padding: 0.5em;
}
div#jpMobile
{
    display: none;
} 
@media (max-width: 800px) {
    table#jpTable
    {
        display: none;
    }
    div#jpMobile
    {
        display: inline-block;
    }
    div#jpMobile hr
    {
        border: 5px solid rgb(255,207,0);
        border-radius: 2px;
    }      
} 

/*  
*********************************************************************************************************************************************
*/

.nadpis1-faq 
{
  background-color: rgb(208,16,19);
  color: white;
  padding: 0.4em;
  cursor: pointer;
  border-style: solid;
  border-width: 0px 0px 1px 0px;
}
.nadpis1-faq:hover 
{
  background-color: white;
  color: rgb(208,16,19);
  transition: background 1s;
}
.otazka 
{
  background-color: rgb(255,207,0);
  padding: 0.4em 2em;
  cursor: pointer;
  font-weight:bold;
}
.otazka:hover
{
  background-color: rgb(237,178,0);
  transition: background 1s;
  font-weight:bold;
}
.odpoved 
{
  display: none;
  background-color: white;
  padding: 0.4em 2em;
  text-align: justify;
}

/*  
*********************************************************************************************************************************************
*/

.input
{
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19); 
    padding: 12px 20px;
    border: none;
    border-radius: 5px;
    width: 50%;
}
@media (max-width: 800px) {
    .input
    {
        width: 100%;
        box-sizing: border-box;
    }
} 
textarea 
{
    font-family: 'Open Sans', sans-serif;
} 
select
{
    font-family: 'Open Sans', sans-serif;
} 
div#faq
{
    padding-bottom: 1em;
    box-sizing: border-box;
}
.buttonSend 
{
    font-size: 125%;
    background-color: rgb(208,16,19);
    padding: 10px 20px;
    border: none;
    color: white;
    cursor:pointer;
    border-radius: 5px;  
}
.buttonSend:hover 
{
    color: rgb(237,178,0);
    font-weight: bold;
}
div#contactForm
{
    text-align: center;
}

/*  
AKCE TÁBOR *********************************************************************************************************************************************
*/

div#acNav
{
    width: 25%;
    float: left;
}
div#acContent
{
    width: 50%;
    float: left;
    padding: 0em 1em 1em 1em;
    box-sizing: border-box;
}
div#acContent h1
{
    margin-top: 0;
}
div#acInfo
{
    width: 25%;
    float: right;
}
@media (max-width: 800px) {
    div#acInfo 
    {        
        padding-right: 1em;
        box-sizing: border-box;   
    }       
}
@media (max-width: 650px) {
    div#acInfo 
    {        
        padding-right: 0;  
    }       
}
.acInfoBox
{
    background-image: linear-gradient(to bottom, rgb(255,207,0), rgb(237,178,0));
    padding: 0.5em;
    box-sizing: border-box;
    margin-bottom: 1em;
}
.lightsOrange
{
    background-image: linear-gradient(to bottom, rgb(255,102,0), rgb(255,102,51));
}
.lightsRed
{
    background-image: none;
    background-color: rgb(208,16,19); /* udělta gradient a nastavit barvy vzorové pro tento gradient */
}

div.colored2k
{
    background-color: #2b6a91 !important;
    background-image: none !important;
    color: white !important;
}   
div.acInfoBox p.noMargin
{
    margin: 0;
}
div.acInfoBox a
{
    color: white;
}
div#acInfo img
{
        width: 100%;
        margin-bottom: 1em;
}
div#acContent img
{
    width: 100%;
}
@media (max-width: 800px) 
{
    div#acNav
    {
        display: none;
    }
    div#acContent
    {
        width: 65%;
    }
    div#acInfo
    {
        width: 35%;
    }         
}
@media (max-width: 650px) {

    div#acContent
    {
        width: 100%;
    }
    div#acInfo
    {
        width: 100%;
    }         
}
div#displayAll
{
        
}
div#displayMobile
{
    display: none;
}
@media (max-width: 500px) {
    div#displayAll
    {
        display: none;
    }
    div#displayMobile
    {
        display: inline-block;
    }          
}

/* ----------------------------------------------------------------------------------------------------------
Page: Menu levé tábory
---------------------------------------------------------------------------------------------------------- */

.menu-detske a {
    display: inline-block;
    color: #000;
    font-weight: bold;
    padding: 0.4em 0;
    width: 100%;
    height: auto;
    text-align: left;
    text-decoration: none;
    background: white;
    transition: color .3s, box-shadow .3s;
    box-shadow: inset 0px 0 0 0 rgb(255,207,0);
}
.menu-detske a:hover {
    box-shadow: inset 250px 0 0 0 rgb(255,207,0);
    color: black;
    background: white;
}
.menu-teenager a {
    display: inline-block;
    color: #000;
    font-weight: bold;
    padding: 0.4em 0;
    width: 100%;
    height: auto;
    text-align: left;
    text-decoration: none;
    background: white;
    transition: color .3s, box-shadow .3s;
    box-shadow: inset 0px 0 0 0 rgb(208,16,19);
}
.menu-teenager a:hover {
    box-shadow: inset 250px 0 0 0 rgb(208,16,19);
    color: black;
    background: white;
}
.menu-zimni a {
    display: inline-block;
    color: #000;
    font-weight: bold;
    padding: 0.4em 0;
    width: 100%;
    height: auto;
    text-align: left;
    text-decoration: none;
    background: white;
    transition: color .3s, box-shadow .3s;
    box-shadow: inset 0px 0 0 0 #2b6a91;
}
.menu-zimni a:hover {
    box-shadow: inset 250px 0 0 0 #2b6a91;
    color: black;
    background: white;
}
.menu-hlavicka {
    display: inline-block;
    color: #000;
    font-weight: bold;
    padding: 0.4em 0;
    width: 100%;
    height: auto;
    text-align: left;
    text-decoration: none;
    background: rgb(235,235,235);
    background-image: linear-gradient(to bottom, rgb(248,248,248), rgb(241,241,241));
    padding: 0.5em;
    box-sizing: border-box;
}

/*  
PARTNEŘI *********************************************************************************************************************************************
*/
img .logoPartner {
    max-height: 3em;
    max-width: 90%;
}


/*  
VEDOUCI *********************************************************************************************************************************************
*/
div#motivation
{

} 
@media (max-width: 800px) {
    div#motivation
    {
        display: none;
    }         
}
/*  
POPIS STYLŮ *********************************************************************************************************************************************
*/




/*

max-width:
400 MOBILE
800 TABLE
1100 PC


@media (max-width: 800px) {
    #
    {
        
    }
  
}

#id
{

}

žlutá standard
#ffcf00
rgb(255,207,0)
rgba(255,207,0,0.8)

zluta dark
edb200
rgb(237,178,0)
rgba(237,178,0,0.5)

linear-gradient(to bottom, rgb(255,207,0), rgb(237,178,0))

červená
#e8411d (OLD)
rgb(208,16,19)
rgba(208,16,19,0.5)
    
černá
241f20
rgb(36,31,32)
rgba(36,31,32,0.5)

zt
#2b6a91
*/