/*************************
 * 		Common styles
 *************************/
html, body { margin: 0px; padding: 0px; font-family: Technika, Arial, Helvetica, sans-serif; }
body {overflow: scroll-x;}
img { border: 0px;}
input, select, textarea {border: 1px solid #0065BD; padding: 2px;}
button, .button {border: 1px solid #0065BD; color: white; padding: 4px 47px; background: #0065BD; cursor: pointer;}
button.disabled {cursor: default; background: #ddd;}
button:hover, .button:hover {background: #e2f1ff; color: #0065BD;}
label {font-weight: bold;}
.noview {display: none;}
.clear {clear: both;}
.right {float:right;}
.left {float: left;}
.r {text-align: right;}
.l {text-align: left;}
.c, .center {text-align: center;}

.col {float: left; position: relative;}
.col-2 {width: 50%;}
.col-3 {width: 33.3333%;}
.col-4 {width: 25%;}
.col-5 {width: 20%;}
.col-6 {width: 16.6665%;}

section {padding: 60px 40px;}
section .morelink {float: right; font-size: 14px; text-transform: uppercase; text-decoration: none; color: #0065BD;}
section .morelink .fa {margin-left: 10px;}
h2 {font-size: 35px;line-height: 50px; color: #0065BD; font-style: normal; font-weight: 400; text-transform: uppercase;}
h2.lc {text-transform: none;}
h3 { color: #0065BD; font-size: 25px;}
h4 {color: #3F3F3F; font-size: 20px; }
.visiblemenu header, .visiblemenu section, .visiblemenu footer {display: none;}

@media all and (max-width: 850px) {
	.col-2 {width: 100%;}
	.col-3 {width: 100%;}
	.col-4 {width: 50%;}
	.col-5 {width: 50%;}
	.col-6 {width: 33.3333%;}
	section {padding: 20px 10px;}
	.tablewrap {width: 100%; overflow-x: scroll; margin-right:-10px;}
}

@media all and (max-width: 600px) {
	.col-4 {width: 100%;}
	.col-5 {width: 100%;}
	.col-6 {width: 100%;}
}
@media all and (max-width: 400px) {
	.clear400 {clear: both; padding-top: 10px;}
}



/*************************
 * 		Navigation
 *************************/
nav.top {height: 135px; position: fixed; top: 0; width: 100%; z-index: 1000; border-bottom: 1px solid #0065BD; background: rgba(255,255,255,1);}
xnav.top, xnav.top.sticky {background: linear-gradient(0deg, #e2f1ff 0%, white 100%);}
ynav.top, ynav.top.sticky {background: linear-gradient(0deg, #f2f8fd 0%, white 50%, white 100%);}
nav.top a { text-decoration: none;}

nav.top .logo { background: #0065BD; width: 271px; height: 100%; position: absolute; left: 0; z-index: 10;transition:all 1s;}
.logo .fa {font-size: 61px; float: left; margin: 34px 8px 0 40px; line-height: 61px;}
.logo a { color: white; }
.logo h1 {padding: 0; margin: 57px 0 0 0; text-transform: uppercase; font-size: 13px; font-weight: 900; letter-spacing: 0.5px; line-height: 14px;transition:all 1s;}
.logo h1 .en {letter-spacing: 0px;}
.logo h1 .utvs, .logo h1 .cvut {display: none;}
nav.top ul {padding: 0; margin: 0; list-style-type: none;}
nav.top li {display: inline;}
nav.top .tgmenu {display: none;}

nav.top form.search { position: absolute; right: 45px; top: 68px; z-index:10;transition:all 1s;}
nav.top form.search button {border: 0px none; background-color: transparent; color: #0065BD; padding: 3px 6px; cursor: pointer; font-size: 20px;}
xnav.top form.search button:hover { color: #80b2de;}
nav.top form.search .input { position: absolute; right: 32px; top: 4px; width: 0; overflow: hidden;}
nav.top form.search input {border: 1px solid #0065BD; width: 100%;background-color:white;outline: none;color:#0065BD;padding: 3px; box-sizing: border-box;}

nav.top .lang {font-size: 14px; position: absolute; top: 76px; right: 122px;transition:all 1s;}
nav.top .lang a {color: black;}
nav.top .lang a:hover { color: #0065BD;}
nav.top .lang .active a {color: #0065BD; font-weight: bold; cursor: default;}
nav.top .lang li:not(:last-child)::after { content: ' / ';}

nav.top div.menu {position: absolute; top: 77px; text-transform: uppercase; box-sizing: border-box; padding: 0 200px 0 300px; width: 100%;transition:all 1s;}
xnav.top div.menu.en {padding-left: 0; right: 0; width: 850px;}
nav.top div.menu a { color: #0065BD; font-weight: 500;}
nav.top div.menu a:hover{color: #80b2de;}
nav.top div.menu ul {display: flex;  width: 100%; justify-content: space-around;}
nav.top div.menu ul li{display: block;}
nav.top div.menu ul li.enl{display: none;}
nav.top div.menu ul ul{display: none;}

nav.top .qmenu {position: absolute; width: 100%; height: 35px; -background: #e2f1ff; background: #e2f1ff;; top: 0; text-align: right; color:#6AADE4; line-height: 32px; text-transform: uppercase; font-size: 11px;}
nav.top .qmenu a {color: #6AADE4; }
nav.top .qmenu a:hover { color: #0065BD;}
nav.top .qmenu ul {display: inline;}
nav.top .qmenu li {margin: 0 16px; }
nav.top .qmenu li.border a {border: 1px solid #6AADE4; padding: 2px 16px; height: 16px; line-height: 16px; display: inline-block;}
nav.top .qmenu li.border:hover a{background: white; color: #0065BD; }
nav.top .qcontact {display: inline; margin: 0 40px 0 10px;}

/*************************
 * 		Navigation - sticky and responsive
 *************************/
 
nav.top.sticky {height: 90px; transition:all 1s;  }
nav.top.sticky .logo .fa {font-size: 41px; margin: 24px 8px 0 30px; line-height: 41px;transition:all 1s;}
nav.top.sticky .logo h1 {margin: 25px 0 0 0;transition:all 1s;}
nav.top.sticky form.search { top: 44px;transition:all 1s;}
nav.top.sticky .lang {top: 52px;transition:all 1s;}
nav.top.sticky div.menu {top: 53px;transition:all 1s;}

@media all and (max-width: 1200px) {
	nav.top form.search {right: 10px;}
	nav.top .lang {right: 50px;}
	nav.top div.menu {padding: 0 100px 0 280px; font-size: 14px;}
}
@media all and (max-width: 1100px) {
	nav.top .qmenu li {margin: 0 8px; }
}
@media all and (max-width: 1000px) {
	.logo h1 .h1long  {display: none;}
	.logo h1 .utvs  {display: block;}
	.logo h1 .cvut  {display: block;}
	nav.top.sticky .logo h1 {margin-top: 40px}
	nav.top .logo { width: 141px;}
	nav.top div.menu {padding: 0 100px 0 160px;}
}
@media all and (max-width: 850px) {
	nav.top.sticky, nav.top.sticky .logo .fa, nav.top.sticky .logo h1, nav.top.sticky form.search, nav.top.sticky .lang, nav.top.sticky div.menu, nav.top .logo  {transition:all 0s;}
	nav.top.sticky { height: 50px;}
	nav.top .tgmenu {display: block; position: absolute; right: 0; top: 0;}
	nav.top.sticky .logo {width: 100%;}
	nav.top.sticky .logo .fa {font-size: 31px; margin: 9px 8px 0 9px; line-height: 31px;}
	nav.top.sticky .logo h1 {margin: 18px 0 0 0; text-align: center; width: 100%; padding-right: 44px; box-sizing: border-box;}
	nav.top .logo h1 br {display: none;}
	nav.top .logo h1 .h1long  {display: block;}
	nav.top .logo h1 .utvs  {display: none;}
	nav.top .logo h1 .cvut  {display: none;}
	nav.top .tgmenu {display: block; position: absolute; right: 10px; top: 4px; z-index: 1000; color: white; font-size: 32px;}
	nav.top form.search, nav.top .lang, nav.top div.menu, nav.top .qmenu {display: none;}
	/*fully responsive menu*/
	.visiblemenu { background: #e2f1ff;}
	.visiblemenu nav.top {height: auto; position: static; padding-top: 1px; margin-top: -1px; background: none;}
	.visiblemenu nav.top .logo{height: 50px;}
	.visiblemenu nav.top form.search {display: block; position: relative; margin-top: 0px; top: 0; left: 0; height: 30px; border-top: 1px solid #6AADE4;}
	.visiblemenu nav.top form.search .input {position: static; width: 100% !important; box-sizing: border-box; padding: 20px 0px 10px 0px; background: #e2f1ff; position: relative; top: 0; left: 0;}
	.visiblemenu nav.top form.search .input label {display: inline; position: absolute; left: 10px; color: #6AADE4; line-height: 38px;}
	.visiblemenu nav.top form.search .input input{border: 0px none; background: none; position: absolute; width: 100%; padding: 0 30px 0 90px; box-sizing: border-box; line-height: 40px;}
	.visiblemenu nav.top form.search .fa {position: absolute; right: 10px; top: 10px; color: #6AADE4;}
	.visiblemenu nav.top .lang {display: block; position: static; text-align: center; margin: 20px 0 30px 0;color: #6AADE4;}
	.visiblemenu nav.top .lang a {color: #6AADE4;}
	.visiblemenu nav.top div.menu {display: block; position: static; padding: 0; font-size: 18px; margin-top: 50px; padding: 10px 0; background: white; width: 100%;}
	.visiblemenu nav.top div.menu ul {display: block; text-align: center;}
	.visiblemenu nav.top div.menu ul li{padding: 15px 0;}
	.visiblemenu nav.top div.menu ul ul{display: none; background: #e2f1ff; margin-top: 15px;}
	.visiblemenu nav.top div.menu ul ul ul{text-transform: none;background: #cfe8ff}
	.visiblemenu nav.top .qmenu {display: block; position: static; height: auto; text-align: center; padding: 10px 0; font-size: 16px;}
	.visiblemenu nav.top .qmenu li {display: block; margin: 16px 10px;}
	.visiblemenu nav.top .qmenu .qcontact {margin: 0;}
}
@media all and (max-width: 455px) {
	nav.top.sticky .logo h1 {margin-top: 12px;}
}
@media all and (max-width: 300px) {
	nav.top.sticky .logo h1 {margin-top: 4px;}
}

/*************************
 * 		Navigation - side
 *************************/
div.sidenav {position: fixed; top: 135px;  width: 270px; transition:all 0s; border-right: 1px solid #ddd; height: 100%;}
div.sidenav.sticky {top: 90px;transition:all 1s;}
div.sidenav a{color: #0065BD; text-decoration: none; position: relative; text-indent: -10px;}
div.sidenav li a::before {content: "\f054"; font-family: FontAwesome; font-size: 10px; position: absolute; top: 4.5px; left: -2px; margin-right: 6px; font-weight: normal;}
div.sidenav li.inactive>a::before {content: "";}
div.sidenav li.inactive>a {cursor: default; color: black;}
div.sidenav a:hover{color: #80b2de;}
div.sidenav ul {padding: 0; margin: 0 0px 0 0; list-style-type: none;}
div.sidenav ul li { padding: 10px 20px 10px 28px; font-weight: bold;margin-right: -1px;}
div.sidenav ul li.activej {background: #80b2de;}
div.sidenav ul li.activej a{color: white;}
div.sidenav ul li ul{background: white; margin: 10px -20px -10px -30px; border-right: 1px solid #ddd;}
div.sidenav ul li ul ul{margin-left: -43px;}
div.sidenav ul li ul ul li{padding-left: 60px;}
div.sidenav ul li.activej ul li a {color: #0065BD;}
div.sidenav ul li.activej ul li.active a {color: white;}
div.sidenav ul li.activej ul li a:hover {color: #80b2de;}
div.sidenav ul li.activej ul li.active a:hover {color: white;}
div.sidenav ul li ul li{  border-bottom: 0; padding-left: 45px; font-weight: normal; padding-top: 7px;}

div.sidenav li.toggled>a::before {transform:rotate(90deg);-ms-transform:rotate(90deg);-webkit-transform:rotate(90deg); top: 12px; left: -8px;}
div.sidenav li.toggle ul {display: none;}
div.sidenav li.toggle.toggled ul{display: block;}
div.sidenav li.hidden {display: none;}

div.sidenav a.outlink::after {content: " \f08e"; font-family: FontAwesome; font-size: 12px;  font-weight: normal; margin-left: 4px;}


@media all and (max-width: 1000px) {
	div.sidenav {top: 90px;}
}
@media all and (max-width: 850px) {
	div.sidenav {position: static; margin-top: 60px; width: 100%; }
	div.sidenav .break {display: none;}
	div.sidenav ul {display: none;}
	div.sidenav  .sptxt .fa {margin-left: 20px;}
	xdiv.sidenav  .sptxt {display: none;}
}

/*************************
 * 		Navigation - breadcrumb
 *************************/
 
nav.breadcrumb {display: none; font-size: 70%;}
@media all and (max-width: 850px) {
	nav.breadcrumb {display: block; padding: 0px 10px 10px 10px; border-bottom:1px solid #0065BD;}
	nav.breadcrumb a{color: #0065BD;}
	
}

/*************************
 * 		Content
 *************************/
 
section.content {margin-top: 135px; max-width: 1400px; margin-left: auto; margin-right: auto; min-height: 800px; position: relative;}
section.content a{color: #0065BD;}
section.content a.button {color:white; text-decoration: none;}
section.content a:hover{color: #80b2de;}
section.content a.button:hover{color: #0065BD;}
section.content.navv {margin-left: 271px; padding-top: 1px;}

section.content .phot {text-align: center; padding: 20px 0;}
section.content .phot img {border: 10px solid #e2f1ff; margin: 10px 10px; max-width: 90%;}

section.content .hi {background: #0065BD; color: white; padding: 10px 20px; margin: 10px 0;}
section.content .hi.warn {background: #FFB206;}
section.content .hi.err {background: #E6513D;}
section.content .hi .fa{ margin-right: 12px;}
section.content .hi a{ color: white;}

.login .inputtext {margin-top: 6px; width: 200px;}
.login button{margin-top: 20px;}
.login fieldset {border: 0; background-color: #e2f1ff; padding: 30px 50px; display: inline-block;}


@media all and (max-width: 1000px) {
	section.content {margin-top: 90px;}
}
@media all and (max-width: 850px) {
	section.content {margin-top: 50px;}
	section.content.navv {margin-left: 0;margin-top: 0;}
}
@media all and (max-width: 600px) {
	section.content .phot img { margin: 10px 0px;}
}



/*************************
 * 		Index - slider
 *************************/

header {margin-top: 135px; position: relative;}
header.index {padding-top: 22.5%;margin-top: 135px;}
header .slidercont {position: absolute; top: 0; width: 100%; height: 100%;}
header .slider {width: 100%; height: 100%;}
header .swiper-slide .preview {height: 100%; overflow: hidden;}
header .swiper-slide .preview img{height: 100%;  width: 100%; object-fit: cover;}
header .swiper-slide .text {position: absolute; left: 40px; bottom: 90px; background: rgba(255, 255, 255, 0.8); padding: 20px 32px 20px 32px; max-width: 30%;}
header .swiper-slide .text h2 {font-weight: 900; font-size: 30px; line-height: 40px; padding: 0; margin: 0;}
header .swiper-slide .text h2 a{color: #0065BD; text-decoration: none;}
header .swiper-slide .text p{font-size: 14px;line-height: 22px;letter-spacing: 0.02em;color: #000000; padding-bottom: 20px;}
header .swiper-slide .text .btn {font-size: 12px;letter-spacing: 0.1em;color: #0065BD; border: 1px solid #0065BD; text-decoration: none; padding: 10px 50px; text-transform: uppercase;}
header .swiper-slide .text a.btn:hover {background: rgba(226, 241, 255,0.5);}

header .slider .bullets {position: absolute; bottom: 10px; z-index: 1000; text-align: center;}
header .swiper-pagination-bullet {width: 80px;height: 5px;display: inline-block; border: 1px solid;border-radius: 0; background: transparent; border-color: rgba(255, 255, 255, 0.6); opacity: 1; padding: 10px 0; background-color: rgba(0, 101, 189, 0.6); padding:0;}
header .swiper-pagination-bullet-active {background-color: white; border-color: rgba(0, 101, 189, 0.6);}

@media all and (max-width: 1100px) {
	header .swiper-slide .text { max-width: 50%;}
}
@media all and (max-width: 1000px) {
	header {margin-top: 90px;}
	header .swiper-slide .text { max-width: 55%;}
	header.index {margin-top: 90px;}
}
@media all and (max-width: 850px) {
	header {margin-top: 50px;}
	header.index {padding-top: 60%; margin-top: 50px;}
}
@media all and (max-width: 600px) {
	header .swiper-slide .text {left: 10px; bottom: 30px;}
	header .slider .bullets { bottom: 4px;}
	header .swiper-slide .text h2 { font-size: 24px; line-height: 30px;}
}
@media all and (max-width: 500px) {
	header.index {padding-top: 70%;}
	header .swiper-pagination-bullet {width: 60px;}
}
@media all and (max-width: 400px) {
	header.index {padding-top: 60%;}
		header .swiper-slide .text h2 { font-size: 20px; line-height: 24px;}
}
@media all and (max-width: 330px) {
	header.index {padding-top: 50%;}
	header .swiper-slide .text { padding: 20px 25px 30px 25px;}
	header .swiper-slide .text .btn {padding: 10px 30px;}
	header .swiper-pagination-bullet {width: 40px;}
		header .swiper-slide .text h2 { font-size: 16px; line-height: 20px;}
}

/*************************
 * 		Index - highlight
 *************************/
 
section.highlight {}
section.highlight .col {padding: 0 13px; box-sizing: border-box;}
section.highlight .image {padding: 3%; text-align: right; box-sizing: border-box;}
section.highlight .image img {max-width: 90%; max-height: 90%;}
section.highlight .content {background: #e2f1ff}
section.highlight .text {padding: 3%;}
@media all and (max-width: 850px) {
	section.highlight .image { text-align: center;}
}

/*************************
 * 		Index - news
 *************************/

section.news {padding: 0px 27px;}
section.news h2{padding-left: 13px;}
section.news .arrowright, section.news .arrowleft {display:none;}
section.news .bullets {text-align: center;}
section.news .swiper-pagination-bullet {width: 80px;height: 5px;display: inline-block; border: 1px solid;border-radius: 0; background: transparent;background-color: white; border-color: rgba(0, 101, 189, 0.6);opacity: 1; padding: 10px 0; padding:0;}
section.news .swiper-pagination-bullet-active { border-color: rgba(255, 255, 255, 0.6); background-color: rgba(0, 101, 189, 0.6); }

section.news .col {padding: 0 13px; box-sizing: border-box;}
section.news .col .item{background: #e2f1ff; overflow: hidden; position: relative; height: 19vw;}
section.news .imgc{position: relative; padding-bottom: 69.5%; height: 0; overflow: hidden;}
section.news .imgc img{width: 100%; margin-bottom: -3px}
section.news .imgc .date {position: absolute; right: 0; bottom: 0; width: 80px; height: 80px; box-sizing: border-box; background: #0065BD; text-align: center; color: white; text-transform: uppercase; font-size: 15px; padding: 4px 10px 0 10px; display:none;}
section.news .imgc .date strong {font-size: 30px; line-height: 45px;}
section.news .col h3, section.news .col p {padding: 0 24px;}
section.news .col a.nlink {text-decoration: none; display: block; height: 100%; padding-bottom: 30px;}
section.news .col a.nlink:hover {background: rgba(0, 101, 189,0.05)}
section.news .col h3 {color: #0065BD; font-size: 20px;line-height: 26px; margin-bottom: 0px;}
section.news .col p {padding-bottom: 30px; margin-bottom: 0;}
section.news .col p {color: black;font-size: 14px;line-height: 22px;}
section.news .col {margin-bottom: 25px;}

@media all and (max-width: 1500px) {
	section.news .col .item{height: 22vw;}
}
@media all and (max-width: 1250px) {
	section.news .col .item{height: 30vw;}
}
@media all and (max-width: 1000px) {
	section.news .col .item{height: 42vw;}
}
@media all and (max-width: 850px) {
	section.news {padding: 0px 0px;}
	section.news .col {padding: 0 10px; margin-bottom: 10px;}
	section.news .col .item{height: 46vw; overflow:visible;}
}
@media all and (max-width: 700px) {
	
	section.news .col .item{height: auto;}
	.nslider .swiper-wrapper { max-width: 100%; display: block;}
	.nslider .bullets { display: none; }
}

@media all and (min-width: 1800px) {
	section.news .col .item{height: 18vw;}
}
@media all and (min-width: 2500px) {
	section.news .col .item{height: 16vw;}
}


@media all and (max-width: 500px) {
	section.news .swiper-pagination-bullet {width: 60px;}
}
@media all and (max-width: 330px) {
	section.news .swiper-pagination-bullet {width: 40px;}
}



/*************************
 * 		Index - sports
 *************************/

 
section.sports h2{margin-top: 0;}
section.sports .col { padding-top: 22%; position: relative; background-size: cover; text-transform: uppercase; text-align: center; overflow: hidden;}
/*section.sports .col { padding-top: 30.8%;}*/
/** 2023 new index **/
/*


section.sports .col { padding-top: 25%; width: 20%; margin: 2.5%;}

@media all and (max-width: 850px) {section.sports .col {width: 50%; margin: 0;}}
@media all and (max-width: 600px) {section.sports .col {width: 100%; margin: 0;}}*/




section.sports .col a {color: white; text-decoration: none;}
section.sports h3 {position: absolute; font-size: 37px; font-style: italic; width: 90%; padding: 12% 5%; top: 0; font-weight: 900; line-height: 55px; z-index: 10;}
section.sports .more {position: absolute; width: 100%; padding-top: 105%; top: 0;}
section.sports .more a{border: 1px solid white; padding: 4px 16px;}
section.sports .more a:hover{background-color: rgba(255,255,255,0.2);}
section.sports .morelink {margin-top: 37px;}

section.sports .s-posilovani 	{background-image: url('../images/sport/kondicni-posilovani.jpg');}
section.sports .s-plavani    	{background-image: url('../images/sport/plavani.jpg');}
section.sports .s-tenis      		{background-image: url('../images/sport/tenis.jpg');}
section.sports .s-lezeni     	{background-image: url('../images/sport/lezeni-na-stene.jpg');}
section.sports .s-volejbal   	{background-image: url('../images/sport/volejbal.jpg');}
section.sports .s-luk        		{background-image: url('../images/sport/lukostrelba.jpg');}
section.sports .s-powerjoga  	{background-image: url('../images/sport/powerjoga.jpg');}
section.sports .s-stolnitenis	{background-image: url('../images/sport/stolni-tenis.jpg');}

@media all and (max-width: 1250px) {
	section.sports h3 { font-size: 30px;}
}

@media all and (max-width: 1000px) {
	section.sports h3 { font-size: 24px; line-height: 40px;}
}

@media all and (max-width: 850px) {
	section.sports h3 { font-size: 30px;}
	section.sports .col { padding-top: 60%;}
	section.sports h3 {	 margin: 0;}
}
@media all and (max-width: 600px) {
	section.sports .col { padding-top: 90%;}
	section.sports .more {padding-top: 80%;}

}

/*************************
 * 		Index - courses
 *************************/

section.courses {background: #daeeff; position: relative; margin-top: 60px; padding: 0; width: 100%;}
section.courses .col {box-sizing: border-box; padding: 40px;}
section.courses .bg {xbackground: url('../images/course-bg.jpg') no-repeat top right; }
section.courses h2 {margin: 0px 0 0 40px; position: absolute; top: -66px;}
section.courses h3 {font-size: 18px; color: #523E3E; padding-top: 0px;}
section.courses ul {list-style-type: none; padding: 0 0 14px 0; margin: 0;}
section.courses ul li{margin: 21px 0;}
section.courses ul li a {color: #697283; text-decoration: none;}
section.courses  a.more{border: 1px solid #A29D9D; padding: 4px 16px; color: #161616;  text-transform: uppercase; text-decoration: none;}
section.courses  a.more:hover {background-color: rgba(255,255,255,0.4);}
section.courses .morelink {position: absolute; right: 40px; bottom: -30px;}

section.courses .unislogo {text-align: center; padding-top: 40px;}

@media all and (max-width: 1200px) {
	section.courses .bg { background-position: -200px 0px;}
	section.courses .col-4 {width: 50%;}
}

@media all and (max-width: 850px) {
	section.courses {margin-top: 80px;}
	section.courses .col-4 {width: 100%;}
	section.courses h2 { margin-bottom: 0px; margin-left: 11px;}
	section.courses h3 {padding-top: 20px;}
	section.courses ul li{margin: 10px 0 0 0;}
	section.courses .bg { background-position: -480px 0px;}
}

@media all and (max-width: 550px) {
	section.courses .morelink {bottom: 20px;}
}
@media all and (max-width: 400px) {
	section.courses .bg { padding-left: 10px; background-position: -560px 0px;}
}

/*************************
 * 		Index - people
 *************************/

section.people {padding-top: 10px; padding-bottom: 0; padding-left: 0; padding-right: 0;}
section.people h2 {position: relative; z-index: 10; padding-left: 40px;}
section.people .bg {background: #0065BD; padding: 55px 40px 0 40px; }
section.people .row {height: 305px; }
section.people .col .box {background-color: #66a3d7; width: 191px; margin: 0 auto 40px auto; text-align: center; overflow: hidden;}
section.people .col h4{color: #3F3F3F; font-size: 18px; font-weight: 400; padding: 10px 0; margin: 0;}
section.people .col h4 a{color: #3F3F3F; text-decoration: none;}
section.people .col img {height: 258px;}
section.people hr {border-bottom: 1px solid #80b2de; background: none; border-top: 0; margin: 34px 0px; clear: both;}
section.people .morelink {color: white; margin-right: 40px; margin-bottom: 30px;}

@media all and (max-width: 1300px) {
	section.people .col-6 {width: 33.3333%;}
}

@media all and (max-width: 850px) {
	section {padding: 20px 10px;}
	section.people h2 {padding-left: 10px;}
	section.people .bg {padding: 55px 10px 0 10px;}
}

@media all and (max-width: 650px) {
	section.people .col-6 {width: 50%;}
}
@media all and (max-width: 420px) {
	section.people .col-6 {width: 100%;}
}

/*************************
 * 		Index - partners
 *************************/

section.partners { background: #e2f1ff;}
section.partners .col{text-align: center; height: 130px;}
section.partners .col:before{content: "";display: inline-block;height: 100%;vertical-align: middle;}
section.partners img{ opacity: 0.5;filter: alpha(opacity=50); vertical-align: middle; max-width: 90%;}

/*************************
 * 		Content - persons
 *************************/
 
 header.inner {margin-top: 135px; margin-left: 271px;}

.map {height: 500px; margin-bottom: -135px;}
.map .contact {position: absolute; left: 50px; top: 20px; z-index: 10; background: #e2f1ff; padding: 20px;color: #0065BD;}
.map .contact a {color: #0065BD; text-decoration: none;}
.map .contact .fa {width: 30px;}

.map .marker {font-size: 40px;color: #0065BD;}
.map .marker.red {color: red; z-index: 100;}
#spmap .marker {cursor: pointer;}
 
.peoplegrid {padding-top: 30px;}
.peoplegrid h2 {margin-left: 1%; margin-top: -60px;}
.peoplegrid .col {padding: 1%; box-sizing: border-box;}
.peoplegrid .person {background: #e2f1ff; width: 100%; float: left; box-sizing: border-box; padding: 20px;text-align: center;}
.peoplegrid .person h3 {height: 130px; margin: 0;}
.peoplegrid .person h4 { height: 50px; letter-spacing: -1px; margin: 10px 0;}
.peoplegrid .person p.img {height: 150px;}
.peoplegrid .person img {max-width: 100px;}
.peoplegrid .person p.det {height: 60px;}
.peoplegrid .gridlbl {clear: both; padding-top: 50px;}
.peoplegrid .person p {padding: 0; margin:0; }
.peoplegrid .person a {color: #0065BD; text-decoration: none;}
.person-img {margin-top: -70px;background: #e2f1ff; padding: 20px;}
.person-contact .fa {width: 30px;}
.person-contact a {color: #0065BD; text-decoration: none;}
.person-right {margin-left: 20px;}
.person-return {padding: 40px 0;}

@media all and (max-width: 1565px) {
	.peoplegrid .col-4 { width: 33%;}
}
@media all and (max-width: 1018px) {
	header.inner {margin-top: 90px;}
}
@media all and (max-width: 1000px) {
	.map { margin-bottom: -90px;}
}

@media all and (max-width: 1260px) {
	.peoplegrid .col-4 { width: 50%;}
}

@media all and (max-width: 950px) {
	.peoplegrid .col-4 { width: 100%;}
}
@media all and (max-width: 850px) {
	.map { margin-bottom: 300px;}
	#spmap { margin-bottom: 0px;}
	.map .contact {position: static; left: 50px; top: 20px;}
	header.inner {margin-top: 0px; margin-left: 0px;}
}
@media all and (max-width: 700px) {
	.peoplegrid .person h3 {font-size: 23px;}
}
@media all and (max-width: 620px) {
	.person-img {margin-top: 0}
	.peoplegrid .person h3 {font-size: 20px;}
}
@media all and (max-width: 540px) {
	.map { margin-bottom: 340px; height: 300px;}
	.peoplegrid .col-4 { width: 100%;}
	.person-right {float: none; margin-left: 0;}
	.person-img {display: inline-block;}
}

/*************************
 * 		Content - sports
 *************************/
 
.res-btn {border: 1px solid #0065BD; padding: 10px;background: #e2f1ff; text-decoration: none; text-align: center; text-transform: uppercase;} 
.res-btn .fa {font-size: 30px; width: 41px; position: relative; top: 4px;}
.sptxt {text-align: center; padding: 10px 0;}
.sp-lbl {width: 80px; display: inline-block;}

.mt-box { margin: 5px; text-align: center; font-size: 17px; color: #0065BD; position: relative;overflow: hidden; padding-bottom: 64%;}
.mt-box img {width: 100%; transition: transform .5s; position: absolute; top: 0; left: 0;} 
.mt-box a:hover img {transform: scale(1.3);}
.mt-box .label {position: absolute; bottom: 0px; width: 100%; height: 40px; background: #0065BDBB; color: white; font-weight: bold; line-height: 36px;}
.vsp {min-height: 50px; padding: 2px 10px; box-sizing: border-box;}

.login-result {font-weight: bold;}
.frm label span{width: 150px; display: inline-block;}
.frm label {display: block; margin: 10px 0;}
.frm label .error {width: auto; display: block; color: red; margin: 6px 0; font-weight: normal; font-size: 13px;}

@media all and (max-width: 800px) {
	table.reflow, .reflow tbody, .reflow tr, .reflow th, .reflow td {display: block; width: 100%; box-sizing: border-box;}
	.reflow tr.reflowhead {display: none;}
}

@media all and (max-width: 500px) {
	table.reflow2, .reflow2 tbody, .reflow2 tr, .reflow2 th, .reflow2 td {display: block; width: 100%;}
	.reflow2 tr.reflowhead {display: none;}
}

@media all and (max-width: 400px) {
	.frm label span{display: block;}
}


/*************************
 * 		Advanced filtering
 *************************/
 .afil .pad {padding: 10px 20px;}
 .afil .irs-line, .afil .irs-bar {cursor: pointer;}
 .afil .irs-handle, .afil .irs-from, .afil .irs-to, .afil .irs-single {cursor: ew-resize}
 .afil .dayp .irs-bar{display: none;}
 .afil .cbl {display: flex; flex-direction: column; flex-wrap: wrap; height: 200px;}
 .afil .hide {display: none;}
 .afil .toggle.active .hide {display: inline;}
 .afil .toggle.active .sel {display: none;}
 .afil .cbl label { display: inline-flex; font-weight: normal; font-size: 14px;}
 
@media all and (max-width: 1200px) {
	.afil .cbl {height: 250px}
}
 
@media all and (max-width: 1000px) {
	.afil .cbl {height: 360px}
}
 
@media all and (max-width: 500px) {
	.afil .cbl { height: auto;}
	.afil .cbl label {display: block; width: 100%;}
}
 
/*************************
 * 		Footer
 *************************/

footer {background: #00213E; color: white; padding: 60px 40px 0 40px;letter-spacing: .5px; clear: both; position: relative; z-index: 1000;}
footer a {color: white; text-decoration: none;}
footer a:hover {color: #80b2de;}
footer ul {list-style-type: none; padding: 0; margin: 0;}
footer h3 {font-size: 15px; margin: 0; padding: 0 0 10px 0; text-transform: uppercase; color: white;}
footer li {font-size: 12px; text-transform: uppercase; margin: 24px 0;}

footer .col {padding-bottom: 60px;}
footer .logo {position: relative; padding: 1px; margin: -35px 0 35px -41px;}
footer .crow {font-size: 18px; line-height: 36px; }
footer .crow .fa {font-size: 22px; width: 40px;}
footer .clink {font-size: 14px; text-transform: uppercase; margin-top: 35px;}
footer .clink .fa {margin-left: 10px;}

footer .newsletter p { font-size: 12px; padding: 0; margin: 28px 0 20px 0;}
footer .newsletter .fa-envelope {position: absolute; font-size: 12px; margin-top: 7px;}
footer .newsletter input {background: transparent; color: white; border: 0 none; border-bottom: 1px solid white; width: 100%; box-sizing: border-box; padding-left: 30px; font-size: 12px; line-height: 24px;}
footer .newsletter ::placeholder {color: white; opacity: 1;}
footer .newsletter button {text-transform: uppercase; color: #0065BD; border: 1px solid #0065BD; background: transparent; font-size: 12px; padding: 10px 50px; margin: 30px 0 50px 0; cursor: pointer;}
footer .social {margin-top: 10px;}
footer .social .fa{font-size: 24px; margin-right: 19px;}
footer .mm {display: none;}
footer .mm ul li.enl{display: none;}

@media all and (max-width: 1200px) {
	footer .col-3 {width: 66.6665%;}
	footer .col-6 {width: 33.3333%;}
}

@media all and (max-width: 850px) {
	footer {padding: 60px 10px 0 10px;}
	footer .mm {display: block;}
	footer .col-2 {width: 50%;}
	footer .col-4 {width: 50%;}
}

@media all and (max-width: 600px) {
	footer .col-2 {width: 100%;}
	footer .col-3 {width: 100%;}
	footer .col-4 {width: 100%;}
	footer .col-6 {width: 100%;}
}

/*************************
 * 		Page styles
 *************************/

h1 {font-size: 35px; line-height: 50px; color: #0065BD; font-weight: 400; text-transform: uppercase;}
h2 {font-size: 30px; line-height: 40px; color: #0065BD; font-weight: bold; font-style: normal; text-transform: uppercase;}
h2.lc {text-transform: none;}
h3 { color: #0065BD; font-size: 26px; margin: 1em 0; padding: 0;}
h4 { color: #3F3F3F; font-size: 24px; margin: 1em 0; padding: 0; }
h5 { color: #3F3F3F; font-size: 20px; margin: 1em 0; padding: 0;}
h6 { color: #3F3F3F; font-size: 18px; margin: 1em 0; padding: 0;}
hr {background-color: #0065BD; border-color: #0065BD; border-top: 0; border-bottom: 1px solid #0065BD; margin-top: 30px;}
.content ul {list-style: none;}
.content ul li {text-indent: -15px; margin-left: 15px;}
.content ul {padding-left: 25px;}
.content ul ul{ padding-left: 16px;}
.content ol {padding-left: 40px;list-style: none; counter-reset: cctr; position: relative;}

.content ul li::before { content: "\25a0"; color: #0065BD; font-size: 90%; position: relative; top: -1px; margin-right: 6px;}
.content ul ul li::before  { content: "−"; top: 0px; font-weight: bold;}
.content ol>li {counter-increment: cctr;}
.content ol>li::before {content: counter(cctr) ". ";color: #0065BD; font-weight: bold; position: absolute; left: 0px; text-align: right; width: 36px;}

table {border-collapse: collapse;}
table thead td, table thead th, .content  table thead th a{background-color: #0065BD; color: white;}
table thead a.ord {text-decoration: none;}
table td, table th {padding: 6px 10px 10px 10px;}
table .dark {background: #e2f1ff;}
table.darkrow tr:nth-child(even){background: #e2f1ff;}
table.darkrowexp tr:nth-child(4n+2), table.darkrowexp tr:nth-child(4n+1){background: #e2f1ff;}
table tr.expansion {display: none;}
table tr.expansion td{padding-top: 0; }
table tr.inactive td {color: #aaa;}
table tr.inactive td a{color: #aaa;}
table .table-filters {white-space: nowrap;}


@media all and (max-width: 600px) {
	table {font-size: 70%;}
	table.nosmall {font-size: 100%;}
	table td, table th {padding: 6px 4px 8px 4px;}
}



/*************************
 * 		Page styles
 *************************/
 
.exp {cursor: pointer;}
.exp .fa {color: #0065BD;}
.exp .fa{-webkit-transition: -webkit-transform .5s ease-in-out;-ms-transition: -ms-transform .5s ease-in-out;transition: transform .5s ease-in-out;}
.exp.active .fa {transform:rotate(90deg);-ms-transform:rotate(90deg);-webkit-transform:rotate(90deg);}
@media all and (max-width: 800px) {
	table.reflow .exp .fa {display: none;}
	table.reflow tr.expansion {z-index: 1; display: block;}
}

.pay {margin: 0px 0px 25px 0;}
.paytext {background: #e2f1ff; float: left; padding: 30px; line-height: 22px;}
.payqr {float:left;}

.clist .grey, .clist .grey a {color: #aaa;}
.clist .ban {text-decoration: line-through;}

@media all and (max-width: 1200px) {
.rowcsele .col-2 {width: 70%;}
.rowcsele .col-3 {width: 30%;}
}
@media all and (max-width: 1000px) {
.rowcsele .col-2 {width: 100%;}
.rowcsele .col-3 {width: 100%;}
}

body .irs--big .irs-from, body .irs--big .irs-to, body .irs--big .irs-single{background-color:#0065BD;background:#0065BD;}
body .irs--big .irs-bar{border:1px solid #0065BD;background:#0065BD;box-shadow:none;}


/*************************
 * 		CVUT cvici doma
 *************************/
 

.youtube {max-width: 100%; max-height: 50vw;}
@media all and (min-width: 1000px) {.youtube { max-height: 36vw;}}
@media all and (min-width: 850px) and (max-width: 1000px) {.youtube { max-height: 32vw;}}
@media all and (min-width: 850px) {.resnav { display: none;}}
.resnav ul {padding: 0; margin: 0;}
.resnav ul li {display: inline; padding: 6px; margin: 0 10px 0 0; list-style-type: none; background: #e2f1ff;}
.resnav ul li.active {display: none;}
.resnav ul li a {text-decoration: none;}
.resnav ul li::before {display: none;}