/* Top */
#header {width: 100%; min-height: 120px; margin: 20px 0px; float: left; display: flex; align-items: center; justify-content: space-between; color: #f08d1a; font-weight: 300;}
#header H1 {font-weight: 300; font-size: 20px; margin: 0px 0px 15px 0px; text-align: right;}
#header .langsFrame {width: 100%; margin: 0px 0px 15px 0px; display: flex; justify-content: flex-end;}
#header .langsFrame .flag {width: 30px; display: block; margin: 0px 0px 0px 5px; border: 2px #fff solid; opacity: 0.5;}
#header .langsFrame .flag IMG {width: 100%; height: auto; float: left;}
#header .langsFrame .flag.active, #header .langsFrame .flag:HOVER {opacity: 1;}
#header .userFrame P {text-align: right;}
#header .userFrame A {text-decoration: underline;}
#header .logo {width: 100px; height: auto;}

#menu {width: 100%; min-height: 10px; float: left; background-color: #f08d1a; color: #FFF; display: flex; font-size: 16px;}
#menu .link {min-height: 40px; display: flex; align-items: center; padding: 0px 30px; border-right: 1px solid rgba(255,255,255,0.3);}
#menu .header {min-height: 40px; display: flex; align-items: center; padding: 0px 30px; border-right: 1px solid rgba(255,255,255,0.3); background-color: #e4810e; font-weight: 300; font-style: italic;}

#content {width: 100%; padding: 30px; float: left; background-color: #FFF;}

.lessonsFrame {width: 100%; float: left; margin: 30px 0px;}
.lessonsFrame .lessonFrame {width: 100%; float: left; display: flex; border-top: 1px #ddd solid;}
.lessonsFrame .lessonFrame .cell {width: 100%; float: left; display: flex; align-items: center; padding: 10px 0px; font-size: 16px;}
.lessonsFrame .lessonFrame .cell.logo {width: 50px;}
.lessonsFrame .lessonFrame .cell.logo IMG {width: 50px;}
.lessonsFrame .lessonFrame .cell.name {padding: 0px 20px;}
.lessonsFrame .lessonFrame .cell.valid {padding: 0px 60px 0 20px; justify-content: flex-end;}
.lessonsFrame .lessonFrame .cell.start {width: 120px;}
.lessonsFrame .lessonFrame .lessonLogo {width: 50px; height: auto; float: left;}

.lessonHeading {width: 100%; padding: 0px 0px 20px 0px; margin: 0px 0px 20px 0px; border-bottom: 1px #ddd dotted; float: left; display: flex; align-items: center; justify-content: space-between;}
.lessonHeading H2 {margin: 0px; color: #f08d1a;}
.lessonHeading P {margin: 0px;}

.certificateFrame {width: auto; float: left; margin: 30px 0px;}

#vratnice .lekce {align-items: center; margin: 4px 0;}
#vratnice .firm {font-size: 20px;}

#footer {width: 100%; min-height: 10px; padding: 30px; float: left; background-color: #ddd; display: flex; align-items: center; justify-content: space-between; font-size: 12px; font-weight: 300;}
#footer A {text-decoration: underline;}

.buttonsFrame-1 {width: 100%; padding: 20px 0px 0px 0px; margin: 20px 0px 0px 0px; border-top: 1px #ddd dotted; float: left;}

.button-1 {padding: 10px 20px; display: block; background-color: #f08d1a; color: #FFF; font-size: 16px; transition: all 200ms;}
.button-1:HOVER {background-color: #e4810e;}
.button-1 I {margin: 0px 10px 0px 0px;}
.button-1 I.right {margin: 0px 0px 0px 10px;}