html {font-family: 'Roboto', sans-serif; font-weight: 400; font-size: 16px; color: #333}
body {margin: 0; padding: 0; text-align: center}
a {color: #333}
a:hover {text-decoration: none}
a img {border: none}
img {max-width: 100%; height: auto;}
strong {font-weight: 700}
p {line-height: 1.5; margin: 0 0 25px 0}
h1 {font-weight: 900; font-size: 2.5rem; line-height: 1.3; margin: 0 0 25px 0; color: #1c7ba8}
h2 {font-weight: 900; font-size: 2.2rem; line-height: 1.3; margin: 0 0 25px 0; color: #1c7ba8}
h3 {font-weight: 900; font-size: 1.8rem; line-height: 1.3; margin: 0 0 25px 0; color: #1c7ba8}


.body {max-width: 1920px; margin: 0 auto}

.main, .head-in, .footer-in, .slider-text {max-width: 1170px; width: 96%; margin: 0 auto; text-align: left}

.head {position: relative; z-index: 50; background-color: #FFF;}
.subpage-head {box-shadow: rgba(35, 157, 213, 0.1) 0 0 10px}
.head-in {display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; position: relative;}
.logo {display: inline-block; vertical-align: middle; background: url("../images/logo.png") left top no-repeat; width: 241px; height: 51px; margin-right: 20px;}
.menu-whole {width: calc(100% - 261px);}
.menu {padding: 0; margin: 0; display: flex; align-items: center;}
.menu > li {list-style-type: none; height: 95px; line-height: 1.5; font-size: 1.1rem;}
.menu > li > a {display: flex; align-items: center; text-decoration: none; text-align: center; height: 95px; padding: 10px 26px; box-sizing: border-box;}
.menu > li > a:focus,
.menu > li > a:hover {text-decoration: underline;}
.menu > li.active > a {color: #1c7ba8; text-decoration: underline; font-weight: 700;}
.menu .menu-contact {width: 135px; box-sizing: border-box; position: absolute; top: 0; right: -135px}
.menu .menu-contact a {padding: 10px 25px 10px 50px; background: #1c7ba8 url("../images/ico_info.png") 20px center no-repeat; color: #FFF; border-bottom: 4px solid #9BDEFE;}
.submenu {position: absolute; left: 0; top: 94px; background-color: #FFF; width: 100%; box-shadow: rgba(35, 157, 213, 0.1) 0 0 27px; display: none;}
.submenu-in {padding: 40px 50px; display: flex; flex-wrap: wrap;}
.submenu-col1 {width: 52%;}
.submenu-col2 {width: 28%; padding-right: 10px; box-sizing: border-box;}
.submenu-col3 {width: 20%; text-align: right;}

.submenu-col4 {width: 20%;}
.submenu-col5 {width: 60%; padding-right: 10px; box-sizing: border-box;}

.submenu h2,
.submenu h3 {font-size: 1.1rem; margin-bottom: 20px;}
.submenu ul {margin: 0; padding: 0;}
.submenu ul li {list-style-type: none; line-height: 1.5; font-size: 0.9rem; margin-bottom: 8px; padding-left: 20px; background: url("../images/arrow_more.png") left 5px no-repeat; background-size: 8px auto;}
.classes {display: flex; flex-wrap: wrap;}
.classes a, .classes span {overflow: hidden; display: inline-block; vertical-align: top; margin: 0 15px 15px 0; text-decoration: none; width: 65px; height: 35px; line-height: 37px; text-align: center; font-weight: 500; font-size: 0.9rem;}
.c1 {background-color: #FFDBDB;}
.c2 {background-color: #FFE6CC;}
.c3 {background-color: #FFFFCC;}
.c4 {background-color: #E6FFCC;}
.c5 {background-color: #CCFFE6;}
.c6 {background-color: #CCFFFF;}
.c7 {background-color: #DDDDFF;}
.c8 {background-color: #ECDAFF;}
.c9 {background-color: #FFCCFF;}
.c10 {background-color: #FFCCE6;}
.c11 {background-color: #A6FFD2;}
.c12 {background-color: #FFFF66;}
.mobile-menu span {display: none;}

.slider-whole {background: url("../images/bg_slider.png") center bottom no-repeat; background-size: cover; position: relative; z-index: 35;}
.slider {margin: 0; padding: 0; width: 100%; position: relative; z-index: 30;}
.slider li {list-style-type: none; width: 100%;}
.slider-image {position: absolute; right: 0; top: 0; width: 50%; height: 100%;}
.slider-image img {display: block; position: absolute; left: 0; top: 0; width: 100%; height: 100%; object-fit: cover; object-position: left center;}
.slider-text-main {padding: 65px 0; max-width: 45%;}
.slider-text-main h2 {font-size: 3.5rem; font-weight: 300; line-height: 1.1; margin: 0 0 20px 0; color: #333;}
.slider-text-main h2 span {display: block; color: #1c7ba8; font-weight: 700;}
.slider-text-main p {font-size: 1.2rem; line-height: 1.7; margin: 0 0 35px 0; font-weight: 300;}
.button {display: inline-block; border: 2px solid #239DD5; color: #1c7ba8; text-decoration: none; padding: 10px 50px 10px 20px; font-size: 1.1rem; font-weight: 700; line-height: 1.5; background: url("../images/arrow_more.png") right 19px center no-repeat; transition: all 0.2s ease-out; background-size: auto 18px;}
.button:focus,
.button:hover {background-color: #FFF;}
.button.button-old {background-image: url("../images/arrow_down.png"); background-size: 18px auto;}
.slider-nav {position: absolute; left: 0; bottom: 30px; width: 100%; text-align: center; z-index: 35;}
.slider-nav span {display: inline-block; vertical-align: top; margin: 0 5px; width: 17px; height: 17px; border-radius: 50%; background-color: #E5F3FA; cursor: pointer;}
.slider-nav span.cycle-pager-active {background-color: #1c7ba8;}

.main-whole {background: #F3FDFF url("../images/tree.png") right 50px bottom no-repeat;}
.main {padding: 60px 0;}
.home-cols {display: flex; flex-wrap: wrap; justify-content: space-between;}
.home-left {width: 65%;}
.home-right {width: 28%;}
.bookmarks {margin: 0 0 30px 0; padding: 0 5px 0 0; border-bottom: 1px solid #C4E7F5; display: flex; justify-content: flex-end;}
.bookmarks li {list-style-type: none; display: inline-block; margin-bottom: -1px; margin-left: 2px;}
.bookmarks li a {display: block; text-decoration: none; padding: 7px 20px; line-height: 1.5; border: 1px solid #F3FDFF; border-bottom: 1px solid #C4E7F5; text-align: center;}
.bookmarks li a.active {border: 1px solid #C4E7F5; border-bottom: 1px solid #F3FDFF; font-weight: 700; color: #1c7ba8}
.bookmarks li a:focus,
.bookmarks li a:hover {border: 1px solid #C4E7F5; border-bottom: 1px solid #F3FDFF; color: #1c7ba8}
.book-block {display: none;}
.book-block.show {display: block;}
.news {padding-bottom: 20px;}
.new {display: flex; flex-wrap: wrap; justify-content: space-between; position: relative; z-index: 30; align-items: stretch; text-decoration: none; background-color: #FFF; margin-bottom: 30px; box-shadow: rgba(35, 157, 213, 0.1) 0 0 27px; transition: all 0.2s ease-out;}
.new:focus,
.new:hover {box-shadow: rgba(35, 157, 213, 0.3) 0 0 27px}
.new-image {width: 223px; height: 162px; position: relative; z-index: 28;}
.new-image img {display: block; position: absolute; left: 0; top: 0; width: 100%; height: 100%; object-fit: cover;}
.new-text {width: calc(100% - 223px)}
.new-text-in {padding: 50px 30px 23px 30px;}
.new-date {position: absolute; z-index: 30; left: 0; top: 0; background-color: #E1F5FD; font-size: 0.8rem; display: inline-block; line-height: 1.5; padding: 5px 10px; font-weight: 700;}
.new-date strong {color: #1c7ba8; font-size: 0.9rem;}
.new-text h2, .new-text h3 {font-size: 1.5rem; line-height: 1.4; margin: 0 0 20px 0; font-weight: 500; color: #333;}
.tag-more {display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; font-weight: 500; line-height: 1.5;}
.more {display: inline-block; padding-right: 15px; background: url("../images/arrow_more.png") right center no-repeat; line-height: 1-5; font-weight: 500; text-decoration: underline; color: #1c7ba8}
.tag {display: inline-block; padding: 7px; min-width: 95px; box-sizing: border-box; text-align: center; font-size: 0.9rem; font-weight: 500; line-height: 1.5;}
.tag.t1 {background-color: #FFDBDB;}
.tag.t2 {background-color: #FFE6CC;}
.tag.t3 {background-color: #FFFFCC;}
.tag.t4 {background-color: #E6FFCC;}
.tag.t5 {background-color: #CCFFE6;}
.tag.t6 {background-color: #CCFFFF;}
.tag.t7 {background-color: #DDDDFF;}
.tag.t8 {background-color: #ECDAFF;}
.tag.t9 {background-color: #FFCCFF;}
.tag.t10 {background-color: #FFCCE6;}
.tag.t11 {background-color: #A6FFD2;}
.tag.t12 {background-color: #FFFF66;}


.center {text-align: center;}
.meal-whole {background-color: #FFF; box-shadow: rgba(35, 157, 213, 0.1) 0 0 27px}
.meal-whole h3 {margin: 0; font-weight: 400; font-size: 1.1rem; line-height: 1.5; padding: 22px 20px 22px 80px; background: #1c7ba8 url("../images/ico_food.png") 30px center no-repeat; color: #FFF; border-bottom: 3px solid #9BDEFE}
.meal-whole h3 strong {font-size: 1.4rem; font-weight: 700;}
.meal {padding: 30px;}
.meal p strong {display: block; font-weight: 500; margin-bottom: 5px;}
.meal-arrows {padding: 15px 30px; display: flex; justify-content: space-between; align-items: center; border-top: 1px solid #EFF8FC;}
.meal-left, .meal-right {width: 30px; height: 30px; border-radius: 50%; border: 1px solid #239DD5;}
.meal-right {background: url("../images/arrow_more.png") center center no-repeat;}
.meal-left {background: url("../images/arrow_prev.png") center center no-repeat;}
.meal-left.noactive {background-image: url("../images/arrow_prev-noactive.png"); border: 1px solid #C9EDFE;}
.meal-right.noactive {background-image: url("../images/arrow_more-noactive.png"); border: 1px solid #C9EDFE;}

.footer {background-color: #E2F6FD;}
.footer-in {padding: 50px 0 30px 0;}
.footer-cols {display: flex; flex-wrap: wrap; border-bottom: 1px solid #D3EFFA;}
.footer-col.fc1 {width: 23%; padding: 0 10px 50px 0; box-sizing: border-box;}
.footer-col.fc2 {width: 35%; padding: 0 10px 50px 0; box-sizing: border-box;}
.footer-col.fc3 {width: 42%; padding: 0 0 50px 0; box-sizing: border-box;}
.footer-col ul {margin: 0; padding: 0;}
.footer-col.fc2 ul {display: inline-block; width: 49%; vertical-align: top;}
.footer-col ul li {list-style-type: none; line-height: 1.5; margin-bottom: 8px; padding-left: 20px; background: url("../images/arrow_more.png") left 5px no-repeat; background-size: 8px auto;}
.footer-partners {padding-top: 30px; }
.footer-partners img {height: 120px;}
.footer-bottom {border-top: 1px solid #EBF9FE; padding-top: 30px; line-height: 1.7; display: flex; flex-wrap: wrap; justify-content: space-between;}
.footer h3 {font-weight: 900; font-size: 1.2rem; line-height: 1.5; margin: 0 0 20px 0; color: #1c7ba8;}
.footer-col.fc3 > div {display: inline-block; vertical-align: top;}
.footer-col.fc3 > div.address {width: 43%;}
.footer-col.fc3 > div.contact {width: 56%;}
.footer-col.fc3 p {line-height: 1.7;}
.footer-col .contact {line-height: 1.9;}
.ic strong {color: #1c7ba8; margin-right: 5px; font-weight: 500;}
.phone {padding-left: 30px; background: url("../images/ico_phone.png") 2px center no-repeat;}
.email {padding-left: 30px; background: url("../images/ico_email.png") left center no-repeat; display: inline-block;}


.subpage-cols {display: flex; flex-wrap: wrap; justify-content: space-between;}
.colleft {width: 28%;}
.menu-left {background-color: #FFF; box-shadow: rgba(35, 157, 213, 0.1) 0 0 27px}
.menu-left h3 {margin: 0; font-weight: 700; font-size: 1.4rem; line-height: 1.5; padding: 23px 20px 21px 90px; background: #1c7ba8 url("../images/ico_menu-left.png") 30px center no-repeat; color: #FFF; border-bottom: 3px solid #9BDEFE}
.menu-left ul {margin: 0; padding: 0;}
.menu-left ul li {list-style-type: none; border-bottom: 1px solid #EBF5FB;}
.menu-left ul li a {display: block; text-decoration: none; line-height: 1.5; padding: 18px 15px 18px 40px;}
.menu-left ul li.active a, .menu-left ul li a:hover, .menu-left ul li a:focus {padding-left: 65px; background: #DCF3FF url("../images/arrow_more.png") 40px 22px no-repeat; font-weight: 500; color: #1c7ba8;}
.colright {width: 65%;}
.navigation {background-color: #FFF; margin-bottom: 40px; box-shadow: rgba(35, 157, 213, 0.1) 0 0 27px; padding: 5px 15px; line-height: 1.7; font-size: 0.9rem; color: #1c7ba8;}
.navigation a {text-decoration: underline; margin-right: 10px;}
.navigation a:focus,
.navigation a:hover {text-decoration: none;}
.navigation a:after {content: "\00203A"; display: inline-block; margin-left: 14px; color: #1c7ba8; font-size: 1.5rem; line-height: 1; position: relative; z-index: 30; top: 2px;}
.new-p {width: calc(100% - 160px); display: inline-block; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; font-size: 0.9rem; line-height: 1.5; font-weight: 400;}

.new-detail {background-color: #FFF; box-shadow: rgba(35, 157, 213, 0.1) 0 0 27px; padding: 50px; position: relative; z-index: 30; margin-bottom: 50px;}
.new-detail .new-date {left: auto; top: auto; right: 0; bottom: 0;}
.new-detail table {width: calc(100% - 40px);}
.gallery {display: flex; flex-wrap: wrap;}
.gallery a {display: inline-block; vertical-align: top; width: 30.3%; margin: 0 4.5% 30px 0;}
.gallery a:nth-child(3n) {margin-right: 0;}
.gallery img {display: block; width: 100%;}

.hidden {display: none;}

@media(max-width:1480px){
	.head-in {max-width: none;}
	.menu .menu-contact {position: static;}
	.menu {justify-content: flex-end;}
	.menu > li > a {padding: 10px 20px;}
}

@media(max-width:1279px){
	.menu {position: absolute; left: 0; top: 90px; width: 100%; background-color: #FFF; display: none; box-shadow: rgba(35, 157, 213, 0.1) 0 0 27px; text-align: center;}
	.menu .menu-contact {position: static; display: inline-block;}
	.menu > li {height: auto}
   .menu > li > a {display: block; height: auto; padding: 15px; border-bottom: 1px solid #F7F7F7}
	.menu > li > a:focus, .menu > li > a:hover, .menu > li.active > a {background-color: #DCF3FF;}
	.menu > li.with-submenu > a:after {content: ""; display: inline-block; width: 18px; height: 15px; position: relative; z-index: 30; top: 1px; background: url("../images/arrow_down.png") left center no-repeat; margin-left: 15px; background-size: 18px auto;}
	.menu > li.with-submenu.active > a:after {background-image: url("../images/arrow_up.png");}
  .menu .menu-contact a:focus,
  .menu .menu-contact a:hover {background-color: #1c7ba8}
	.submenu {position: static; box-shadow: none; text-align: left; border-bottom: 1px solid #F7F7F7}
	.logo {margin: 20px 0;}
	.menu-whole {text-align: right;}
	.mobile-menu {width: 29px; height: 20px; display: inline-block; vertical-align: middle; background: url("../images/mobile_menu.png") left top no-repeat;}
	.mobile-menu.active {background-image: none; text-decoration: none;}
	.mobile-menu.active span {display: block; text-decoration: none; color: #249DD5; font-weight: 300; font-size: 2.3rem; line-height: 1; position: relative; z-index: 50; top: -4px;}
}

@media(max-width:1180px){
  .slider-nav,
	.slider-image {display: none;}
	.slider-text-main {max-width: none;}
}

@media(max-width:1120px){
	.footer-col.fc1 {width: 40%;}
	.footer-col.fc2 {width: 60%;}
	.footer-col.fc3 {width: 100%;}
}

@media(max-width:1060px){
	.colleft, .colright {width: 100%; order: 2;}
	.colright {order: 1; padding-bottom: 50px;}
}

@media(max-width:980px){
	.home-left, .home-right {width: 100%;}
	.home-left {padding-bottom: 50px;}
}

@media(max-width:820px){
	.submenu-in {padding: 20px}
  .submenu-col4,
	.submenu-col1 {width: 100%;}
  .submenu-col5,
	.submenu-col2 {width: 100%; padding-right: 0}
	.submenu-col3 {display: none;}
	.submenu ul li {font-size: 1rem;}
}

@media(max-width:580px){
	.main, .head-in, .footer-in, .slider-text {width: 92%}
	.main {padding: 50px 0;}
	.footer-col.fc1 {width: 100%; padding: 0 0 20px 0;}
	.footer-col.fc2 {width: 100%; padding: 0 0 20px 0}
	.footer-col.fc3 {padding-bottom: 20px;}
	.footer-col.fc3 > div.address {width: 100%;}
   .footer-col.fc3 > div.contact {width: 100%;}
	.new-image {width: 100%; order: 1;}
	.new-text {width: 100%; order: 2;}
	.new-text-in {padding: 20px;}
	.new-text h2, .new-text h3 {font-size: 1.2rem;}
	h1 {font-size: 1.7rem;}
	h2 {font-size: 1.5rem;}
	h3 {font-size: 1.2rem;}
	.slider-text-main {padding: 50px 0 70px 0;}
	.slider-text-main h2 {font-size: 2.2rem}
   .slider-text-main p {font-size: 1rem; margin-bottom: 25px;}
	.new-p {width: 100%; margin-bottom: 10px;}
	.new-detail {padding: 20px 20px 40px 20px; margin-bottom: 40px;}
	.gallery a {width: 100%; margin: 0 0 20px 0;}
	.gallery a:last-child {margin-bottom: 0;}
}


@media(min-width:1280px){
	.menu {display: flex !important;}
}


/* pristupnost fixy */
.slider-text .button {color: #196b92}
.footer h3 {color: #333;}
.new-date strong,
.ic strong {color: #000000;}
.menu-left ul li.active a, .menu-left ul li a:hover, .menu-left ul li a:focus {color: #333;}
