a:link {color: #ffffff; text-decoration: none;}
a:visited {color: #ffffff; text-decoration: none;}
a:hover {color: #0169e2; text-decoration: none;}
a:active {color: #ffffff; text-decoration: none;}

a.w:link {color: #0169e2; text-decoration: none;}
a.w:visited {color: #0169e2; text-decoration: none;}
a.w:hover {color: #0195e2; text-decoration: none;}
a.w:active {color: #0169e2; text-decoration: none;}

body{
font-family: Arial, Helvetica, sans-serif;
padding: 0px;
margin: 0px;
}

div.head_container{
position: relative;
margin-top: -228px;
z-index:100;
padding-top: 10px;
display: table;
width: 100%;
height: 250px;

/*-webkit-box-shadow: 0px 0px 18px 2px rgba(0,0,0,0.7);
-moz-box-shadow: 0px 0px 18px 2px rgba(0,0,0,0.7);
box-shadow: 0px 0px 18px 2px rgba(0,0,0,0.7);*/

border: solid 0px red;
}

div.head_spacer{
display: block;
width: 100%;
height: 26px;
}

div.head_line{
display: block;
width: 100%;
height: 42px;
}

div.head_menu{
position: fixed;
z-index:101;
top:0;
left:0;
display: block;
text-align: center;
width: 100%;
height: 56px;
margin-top: 0px;
}

div.menu_container{
height: 56px;
line-height: 56px;
/*margin: auto;
margin-left: 460px;*/
font-size: 0px;
color: #ffffff;

border: solid 0px green;

animation: menu_container 0.3s linear forwards;
animation-delay: 2s;
}
@keyframes menu_container {
  from {
    font-size: 0px;
  }
  to {
    font-size: 20px;
  }
  }

div.shadow {
display: inline-block;
width: 100%;
height: 20px;
margin-top: 4px;
padding: 0px;
text-align: center;

background-image: url("../img/shadow-1600.png");
background-repeat: no-repeat;
background-position: center top; 
background-size: 100vw 20px;
}

div.head_logo_container{
display: block;
position: absolute;
left: 40px;
width: 388px;
height: 257px;

padding-left: 2px;
padding-right: 3px;

background-color: none;

border: solid 0px green;
}

div.head_logo_3np{
display: block;
position: absolute;
left: 40px;
width: 388px;
height: 292px;

opacity: 0.5;

padding-left: 2px;
padding-right: 3px;

/* background-color: #ffffff; */

background-image: 
url(../img/logo_3np.png);

background-position: 2 -275px;

background-repeat: no-repeat;

border: solid 0px green;

animation: logo_3pp 0.5s linear forwards;
animation-delay: 0.8s;
}
@keyframes logo_3pp {
  from {
    background-position: 2 -275px;
  }
  to {
    background-position: 2 0;
  }
  }

div.head_logo_2np{
display: block;
position: absolute;
left: 40px;
width: 388px;
height: 292px;

opacity: 0.5;

padding-left: 2px;
padding-right: 3px;

/* background-color: #ffffff; */

background-image: 
url(../img/logo_2np.png);

background-position: 2 -275px;

background-repeat: no-repeat;

border: solid 0px green;

animation: logo_2pp 0.5s linear forwards;
animation-delay: 0.7s;
}
@keyframes logo_2pp {
  from {
    background-position: 2 -275px;
  }
  to {
    background-position: 2 0;
  }
  }

div.head_logo_1np{
display: block;
position: absolute;
left: 40px;
width: 388px;
height: 292px;

opacity: 0.5;

padding-left: 2px;
padding-right: 3px;

/* background-color: #ffffff; */

background-image: 
url(../img/logo_1np.png);

background-position: 2 -275px;

background-repeat: no-repeat;

border: solid 0px green;

animation: logo_2pp 0.5s linear forwards;
animation-delay: 0.6s;
}
@keyframes logo_2pp {
  from {
    background-position: 2 -275px;
  }
  to {
    background-position: 2 0;
  }
  }

div.head_logo_1pp{
display: block;
position: absolute;
left: 40px;
width: 388px;
height: 292px;

opacity: 0.5;

padding-left: 2px;
padding-right: 3px;

/* background-color: #ffffff; */

background-image: 
url(../img/logo_1pp.png);

background-position: 2 -275px;

background-repeat: no-repeat;

border: solid 0px green;

animation: logo_1pp 0.5s linear forwards;
animation-delay: 0.5s;
}
@keyframes logo_1pp {
  from {
    background-position: 2 -275px;
  }
  to {
    background-position: 2 0;
  }
  }

div.head_logo_s1{
display: block;
position: absolute;
z-index: 10;
left: 40px;
width: 388px;
height: 292px;

padding-left: 2px;
padding-right: 3px;

/* background-color: #ffffff; */

background-image: 
url(../img/logo_s1.png);

background-position: 2 -275px;

background-repeat: no-repeat;

border: solid 0px green;

animation: logo_s1 0.5s linear forwards;
animation-delay: 1.5s;
}
@keyframes logo_s1 {
  from {
    background-position: 2 -275px;
  }
  to {
    background-position: 2 0;
  }
  }

div.head_logo_menu{
display: block;
position: absolute;
z-index: 9;
left: 40px;
width: 388px;
height: 292px;

opacity: 0.0;

padding-left: 2px;
padding-right: 3px;

/* background-color: #ffffff; */

background-image: 
url(../img/logo_menu.png);

background-position: 2 -275px;

background-repeat: no-repeat;

border: solid 0px green;

animation: logo_menu 0.5s linear forwards;
animation-delay: 0s;
}
@keyframes logo_menu {
  from {
    background-position: 2 -275px;
  }
  to {
    background-position: 2 0;
  }
  }



div.obsah_container{
width: calc(100vw - 80px);
max-width: calc(100% - 80px);
margin-top: -20px;
/* min-height: 80vh; */
padding: 20px;
padding-left: 40px;
padding-right: 40px;

border: solid 0px red;
}

div.budova_container{
display: table;
width: 100%;
max-height: 380px;

border: solid 0px purple;

opacity: 0.0;

animation: budova_container 0.5s linear forwards;
animation-delay: 2.5s;
}
@keyframes budova_container {
  from {
    opacity: 0.0;
  }
  to {
    opacity: 1.0;
  }
  }

div.nadpis{
display: inline-block;
height: 77px;
line-height: 77px;
padding-left: 0px;
font-size: 24px;
color: #5599ff;
text-shadow: 1px 1px 1px rgba(0,0,0,0.2);
}

div.podlazie{
display: table;
width:100%;
padding: 0px;

border: solid 0px red;
}

div.podlazie_img{
display: table-cell;
width:600px;
padding: 0px;

border: solid 0px blue;
}

img.podlazie{
display: block;
position: relative;
vertical-align: top;
width: 100%;
padding: 0px;
margin: 0px;
}

div.podlazie_nazov_container{
display: table-cell;
vertical-align: top;
padding-left: 2px;
padding-top: 1px;

border: solid 0px green;
}

div.podlazie_nazov{
display: block;
height: 62px;
line-height: 62px;
padding: 0px;
padding-left: 20px;
font-size: 24px;
color: #ffffff;
text-shadow: 1px 1px 1px rgba(0,0,0,0.2);

cursor: pointer;
cursor: hand;

border: solid 0px red;
}
div.podlazie_nazov:hover{
background-image: linear-gradient(to right, rgba(170,0,0,1), rgba(170,204,255,0));
}

div.podlazie_nazov_neaktivny{
display: block;
height: 62px;
line-height: 62px;
padding: 0px;
padding-left: 20px;
font-size: 24px;
color: #ffffff;
}

div.podlazie_3np{
background-image: linear-gradient(to right, rgba(0,102,255,0.55), rgba(0,102,255,0));
}

div.podlazie_2np{
background-image: linear-gradient(to right, rgba(0,102,255,0.7), rgba(0,102,255,0));
}

div.podlazie_1np{
background-image: linear-gradient(to right, rgba(0,102,255,0.85), rgba(0,102,255,0));
}

div.podlazie_1pp{
background-image: linear-gradient(to right, rgba(0,102,255,1), rgba(0,102,255,0));
}

.tien{
text-shadow: 1px 1px 1px rgba(0,0,0,0.5);
}

div.podlazie_detail_container_zbalene{
display: block;
width: 100%;
overflow: hidden;
max-height: 0;

transition: max-height 1s ease-out;

border: solid 0px red;
}

div.podlazie_detail_container_rozbalene{
display: block;
width: 100%;
overflow: hidden;
max-height: 400px;

transition: max-height 1.5s ease-in;

border: solid 0px green;
}



div.podlazie_detail_svg{
display: inline-block;
width: 600px;
padding: 4px;
padding-right: 0px;

/* transform: skew(-15deg, 0deg); */
border: solid 0px green;
}

div.podlazie_detail_popis{
display: inline-block;
width: calc(100% - 640px);
min-height: 350px;
vertical-align: top;
padding: 4px;
padding-left: 8px;
line-height: 1.5;
color: #444444;

border: solid 0px green;
}

.plocha{
fill: rgba(180,180,180,43);
cursor: pointer;
cursor: hand;
transition: 0.3s;
}
.plocha:hover{
fill: rgba(85,150,255,60);
}

.cislo{
cursor: pointer;
cursor: hand;
}

.arrow_down{
display: inline-block;
position: relative;
color: #5599ff;
animation: zmena_farby 1s infinite;
text-shadow: none;
}
@keyframes zmena_farby {
  0% {color: rgba(85,153,255,100); top: -2;}
  100% {color: rgba(0,0,0,0); top: 6;}
}

.arrow_left{
display: inline-block;
position: relative;
color: #5599ff;
animation: zmena_farby_left 1s infinite;
animation-delay: 0.5s;
top: -4;
text-shadow: none;
}
@keyframes zmena_farby_left {
  0% {color: rgba(85,153,255,100); left: 2;}
  100% {color: rgba(0,0,0,0); left: -2;}
}


div.nadpis_blue{
display: block;
padding: 10px;
font-size: 24px;
color: #ffffff;
background-image: linear-gradient(to right, rgba(0,102,255,1), rgba(0,102,255,0));
text-shadow: 1px 1px 1px rgba(0,0,0,0.2);
}

div.popis{
display: block;
padding: 10px;
line-height: 1.5;
/* font-size: 24px; */
color: #444444;
}