/* here goes all CSS which corresponds to responsive web resizing */

.topdivisions {display: block;}
.tdsmall {display: none; }


/* these are for greater width then 1040px */
@media (min-width: 1041px) {
    #menu ul li { width: 256px; }
}

/* flip "raz-online-btn" inside */
@media (max-width: 1345px) {
    #btnrazcz { left:-681px; top:0; margin: -1em -2em 1em 0; position: relative; float: right; }
    /* #btnrazcz a { margin: 0 681px 0 auto; } */
    #top_text_1 .logos { margin: 1em; margin-right: -127px; clear: none; }

}

/* contacts 2 columns */
@media (max-width: 901px) {
    #hcard-megaflex-www-foot-detail>div { width: 49% }
    #hcard-megaflex-www-foot-detail>div:nth-child(even) { margin-left: 1%; }
    #www-foot #kontakty { margin-left: auto; min-height: 11em; }
}

/* contacts 1 column */
@media (max-width: 620px) {
    #hcard-megaflex-www-foot-detail>div { width: 100% }
    #hcard-megaflex-www-foot-detail>div:nth-child(even) { margin-left: 0; }
}

/* these are for medium width - 2 columns */
@media (min-width: 529px) and (max-width: 1040px)
{
    #menu ul li { width: 50%; }
    #menu ul li a { margin: 0; }
    #menu ul li:nth-child(odd) a { margin: 0 0 0 auto; }
    #carousel { top: 95px;  }
    .top_x2 { width: 50%; }
    .top_x2 div { float: none;}
    .top_x2:nth-child(odd) div { margin: 0 0 0 auto; }
    .top_x2:nth-child(odd) div.newsbox2 { margin: 3px 2px 10pt auto; }
    .top_x2:nth-child(odd) { clear: left; margin: 0 0 0 auto;}
}

/* these are for btn-raz flip inside right */
@media (max-width: 850px)
{
    #btnrazcz { left:0; margin: 0em -1em 1em 3em; width: 210px; }
    #btnrazcz a { margin: 0 0 0 auto; }
    #top_text_1 .logos { margin: 1em; clear: right; }
}

/* these are for text carusel margin */
@media (max-width: 710px)
{
    .text { margin: 1em; }
}

/* these are for small  width - 1 column */
@media (max-width: 528px)
{
    #menu ul li { width: 100%; }
    #carousel { top: 285px;  }
    .text { float: none; margin: 1em auto;  max-width: 236px; }
    .text .logos { float: none; margin: 1em auto;  width: 210px; }
    /* #carousel0 { top: 280px;  } */
    .top_x2  { width: 100%; margin: 10pt 0 0 0; }
    .top_x2 div { margin: 0 auto; float: none;}
}


/* menu dropdown on small screens */
@media (max-width: 768px)
{
    body { background-position: 0 48px; }
    .topdivisions {display: none;}
    .tdsmall {
        display: block;
        position: relative;
        padding-bottom: 2px;
        text-align: center;
        padding: 6px 0;
        height: 34px;
    }
    #www-language { top: 47px; }
}

/* megablog scale down */
@media (max-width: 714px)
{
    #newsagreg { min-height: 150px; }
    #mbmotto { top: 60px; position: relative;  }

}

/* language move up and flip background on super small */
@media (max-width: 490px)
{
    #www-language {
        background: url(../img/bg_langs_180.png) no-repeat;
        top: 26px;
        /* opacity: 1; */
        padding-top: 5px;
    }
    /* this is pseudo element to flip background */
/*     #www-language:before {
        opacity: 0.3;
        content: "";
        width: 100%;
        height: 100%;
        top: 0;
        left: 0;
        transform: rotate(180deg);
        position: absolute;
        z-index: 1;
    } */
}