html, body { margin: 0px; padding: 0px; font-family: Technika, Arial, Helvetica, sans-serif;}
.page {min-width: 800px; position: relative;}
img { border: 0px;}

.topbg {padding-top: 26.1%; height: 0; background: url('../images/header_bg.png') no-repeat top; background-size: cover; position: absolute; width: 100%; z-index: -1;}
header {color: white; padding-top: 26.1%; height: 0; background: url('../images/header_face.png?2') no-repeat 68% top; background-size: contain; position: relative;}
header .label {padding: 0; margin: 0; position: absolute; top: 10%; left: 5%; font-size: 18px; color: white; text-decoration: none;}
header .mnav ul {padding: 0; margin: 0; position: absolute; top: 10%; right: 7%;}
header .mnav ul li {display: inline; font-size: 18px; margin: 0px 14px; letter-spacing: -0.5px;}
header .mnav ul li a {color: #E6F0FA; text-decoration: none;}
header .mnav ul li a:hover {text-decoration: underline;}
header .mnav ul li.active a {text-decoration: underline;}
header .mnav ul .enl {display: none;}
header .mnav ul.lang {right: 5%; margin-top: 0px;}
header .mnav ul.lang li{display: block; margin: 0; text-align: center; font-size: 13px;}
header h1 {padding: 0; margin: 0; font-size: 45px; line-height: 50px; position: absolute; top: 29%; left: 12%; text-transform: uppercase; font-weight: 900; width: 450px; }
header h2 {padding: 115px 0 0 2px; margin: 0; font-size: 30px; position: absolute; top: 29%; left: 12%; font-weight: 500;  }
header .logo-cvut {position: absolute; bottom: 6%; right: 11%; color: #0065bd; background-color: white; font-size: 50px; line-height: 44px;}
header .logo-cvut .logo {position: relative; top: -3px;}

.topspace {height: 117px; transition: height .3s ease;}
header.smallbg {height: 117px; padding-top: 0; background: url('../images/header_bg_small.png') no-repeat top; position: fixed; top:0; z-index: 1000; width: 100%; transition: height .3s ease;}
.sticky .topspace, .sticky header.smallbg {height: 70px;}
header.smallbg .label, header.smallbg .mnav ul { top: 35%; font-size: 24px;  transition: position .3s ease;}
.sticky header.smallbg .label, .sticky header.smallbg .mnav ul { top: 25%;}

nav .showmenu, nav  .hidemenu {display: none;}
.visiblemenu section{display:none;}


.content {max-width: 1240px; margin: auto; min-height: 100%; color: #333333; font-size: 18px;}
.content blockquote {font-style: italic; font-weight: 400; max-width: 850px; text-align: center; margin: 80px auto;}
.content table, .content td, .content th { font-size: 12px;}
.content h1 {color: #0D5BA1; font-size: 72px; margin:0px; font-weight: bold; padding: 10px 0px;}
.content h2 {color: #0D5BA1; font-size: 36px; margin:0px; font-weight: bold; padding: 10px 0px;}
.content h3 {color: #0D5BA1; font-size: 24px; font-weight: bold; margin: 6px 0px; padding: 0px;}
.content h4 { font-size: 20px; font-weight: bold; margin: 6px 0px; padding: 0px;}
.content h5 { font-size: 14px; font-weight: normal; font-style: italic; margin: 6px 0px; padding: 0px;}
.content h6 { font-size: 13px; font-weight: bold; margin: 3px 0px; padding: 0px;}


.content .container {position: relative;}
.content .box.half {width: 16.666%; float: left; box-sizing: border-box;}
.content .box {width: 33.333%; float: left; box-sizing: border-box; padding: 0 3%;  text-align: center; margin: 50px 0 70px 0;}
.content .box .bullet {background: url('../images/index-bullet.png') no-repeat center top; min-height: 150px;}
.content .box .bullet.b1 {background-image: url('../images/index-bullet-1.png');}
.content .box .bullet.b2 {background-image: url('../images/index-bullet-2.png');}
.content .box .bullet.b3 {background-image: url('../images/index-bullet-3.png');}
.content .box  p {margin: 30px 0;}
.content .box h3 {font-size: 28px; color: #0D5BA1; padding: 0px 5%; text-align: center;  font-weight: 900;}
.content .box .link {font-size: 24px; font-weight: 900; position: absolute; bottom: 0;}
.content .box .link a { color: #0D5BA1;}

.content a {color: #0D5BA1;}
.content .center, .content .center p {text-align: center;}
.content .col-2 { box-sizing: border-box; padding: 0 20px; position: relative; width: 50%; float: left; }
.content .col-1 { box-sizing: border-box; padding: 0 20px; position: relative;}
.content .col-1.nopad { padding: 0;}
.content .w60 { width: 60%;}
.content .w55 { width: 55%;}
.content .w45 { width: 45%;}
.content .w40 { width: 40%;}
.content.about-me { padding-top: 80px; }
.content p { text-align: justify; margin: 10px 0; line-height: 26px;}
.content.about-me p { margin: 30px 0; }
.content img.roundimg {border-radius: 20px; width: 100%; margin-bottom: 16px;}
.content .himg img {border: 1px solid #0D5BA1;}
.content.about-me .sipka {width: 285px; height: 148px; background: url('../images/sipka.png') no-repeat top; position: absolute; right: 0;}
.content img {max-width: 100%;}
.content .col-2, .content .col-1 {padding-bottom: 100px;}
.content dl {font-weight: bold; font-size: 18px; margin: 0;}
.content dl dt {font-size: 24px;}
.content dl dd {margin: 10px 0;}

.content .mail {font-size: 24px; font-weight: bold;}
.content .mail a {background: url('../images/envelope.png') no-repeat left; background-size: contain; padding-left: 40px; }

.content .target {border: 2px solid #0D5BA1;}
.content .target h3 {padding: 2px 40px; margin: 0 0 0px -30px;  color: white; background-color: #0D5BA1; display: inline;}
.content .target h4 {margin-top: 30px;}
.content .target p {margin-bottom: 50px;}
.content .target.col-1 {padding: 0 30px 20px 30px; margin-bottom: 50px;}
.content .target li {padding: 10px 0;}

.swot {background: url('../images/swot_bg.png') no-repeat; background-size: cover; padding: 10px 0 50px 0; margin: 50px 0;}
.swot h2 {text-align: center; color: white; margin: 30px 0;}
.swot .container {max-width: 1240px; margin: auto; border-radius: 20px;}
.swot .box {background: #E6F0FA; padding: 1px; width: 49%; float: left; box-sizing: border-box; padding: 10px 20px 40px 20px; min-height: 270px;}
.swot .box:nth-child(1) {  border-top-left-radius: 20px;}
.swot .box:nth-child(2) {  border-top-right-radius: 20px; margin: 0 0 0 2%;}
.swot .box:nth-child(3) {  border-bottom-left-radius: 20px; clear: both; margin-top: 2%;}
.swot .box:nth-child(4) {  border-bottom-right-radius: 20px; clear: right; margin: 2% 0 0 2%;}
.swot .box h4{font-size: 24px;}
.swot .box a {color: black; font-weight: bold;}
.swot .box ul {padding-right: 20px;}
.swot .box ul li {margin: 10px 0;}
.swot .box .more {  max-height: 0;  overflow: hidden;  transition: max-height 5s ease;}
.swot .box.expanded .more {max-height: 2000px;}
.swot .box.expanded .showmore {display: none;}

.clear {width: 100%; clear: both;}

footer {clear: both; color: white; height: 100px; background: url('../images/footer.png') no-repeat center top; position: relative; margin-top: 150px;}
footer a {color: white; text-decoration: none;}
footer a:hover {text-decoration: underline;}
footer .narrow { max-width: 1200px; width: 60%; margin: auto;}
footer .narrow p {padding: 0; margin: 0;}
footer .narrow p.copy {padding-top: 30px; font-size: 22px; font-weight: 700; float: left;}
footer .narrow .right {float: right; padding-top: 10px; font-size: 18px;}
footer .narrow .right .ilink { text-align: center; padding-top: 5px;}
footer .narrow .right .ilink a {margin: 30px;}


@media all and (min-width: 1920px) {
	header.smallbg {	 background-size: cover;}
	footer {	 background-size: cover;}
}
@media all and (max-width: 1300px) {
	section, section.swot {padding-left: 20px; padding-right: 20px;}
}


@media all and (max-width: 980px) {
	
	header h1 { font-size: 30px; width: 300px; left: 20px; line-height: 40px;}
	header h2 {font-size: 24px; left: 20px;}
	header.index .label {display: none;}
	header .logo-cvut {left: 20px; right: auto;}
	
	.topbg {padding-top: 0; height: 300px;}
	header.index {padding-top: 0; height: 300px;}
	
	footer {height: 160px; background-size: cover; text-align: center;}
	footer .narrow p.copy {padding-top: 20px;}
	footer .narrow p.copy, footer .narrow .right {float: none;}

	
}


@media all and (max-width: 840px) {
	.page {min-width: 200px;}
	.swot .box {min-height: 350px;}
	
	header h1 { top: 30px;}
	header h2 { top: 10px;}
	header .label {left: 20px;}

	
	nav .showmenu, nav  .hidemenu {display: block; font-size: 50px; line-height: 111px; cursor: pointer; position: absolute; right: 20px;  transition: line-height .3s ease;}
	.sticky nav .showmenu, .sticky  nav  .hidemenu {line-height: 70px;}
	nav .mnav {display: none;}
	
	header.index nav {position: absolute; top: 0; width: 100%;}
	.visiblemenu .topbg, .visiblemenu header h1, .visiblemenu header h2, .visiblemenu header .logo-cvut {display: none;}
	.visiblemenu header {background: none;}
	.visiblemenu header.index .label {display: block; top: 41px; font-size: 24px;}
	
	.visiblemenu nav .showmenu {display: none;}
	.visiblemenu nav .mnav {display: block;}
	.visiblemenu {background: url('../images/swot_bg.png') no-repeat;}
	.visiblemenu nav .mnav ul {display: block; position: absolute; top: 12vh; left: 0; width: 100%; }
	.visiblemenu nav .mnav li{display: block; padding: 6% 0; font-size: 24px; text-align: center; border-bottom: 1px solid #ccc;}
	.visiblemenu nav .mnav li.enl {display: none;}
	.visiblemenu nav .mnav li:last-child{border-bottom: 0px none;}
	.visiblemenu nav .mnav li.active a {text-decoration: none;}
	.visiblemenu nav .mnav ul.lang  {position: fixed; bottom: 220px; top: auto; text-align: center;}
	.visiblemenu nav .mnav ul.lang li{display: inline; border: 0; margin: 0 20px;}
	
	.visiblemenu footer {background: none; position: fixed; bottom: 0; padding: 0; margin: 0;  height: auto; width: 100%;}
	.visiblemenu footer .narrow {width: 100%;}
	.visiblemenu footer .copy {display: none;}
	.visiblemenu footer .right {float: none; text-align: center;}
	.visiblemenu footer .right p {margin: 40px auto; max-width: 80%;}
	
	
	
	.content blockquote {margin: 40px auto;}
	.content .box {width: 100%;  margin: 20px 0 20px 0;}
	.content .box .link {position: static;}
	.content .col-2	{width: 100%;}
	.content .himg {text-align: center;}
	.content .himg img {max-width: 50%;}
	
	.sipka {display: none;}
	
	header.index {background-position: 90% bottom;}
	
}

@media all and (max-width: 650px) {
	header.index {background-position: right bottom;}
	.page .swot .box {min-height: 0px; width: 100%; margin: 10px 0; border-radius: 0;}
}

@media all and (max-width: 600px) {
	.topbg {padding-top: 0; height: 400px;}
	header.index {padding-top: 0; height: 400px; background-size: 290px;}
	header h2 {top:0;}
	header .logo-cvut {bottom: auto; top: 170px;}
	
	
}