@import url('https://fonts.googleapis.com/css?family=Open+Sans|Just+Me+Again+Down+Here|Tillana|PT+Serif|Amatic+SC:700&subset=latin-ext');
@import "card.css";
html {
	scroll-behavior: smooth;
}

body {
	margin: 0;
	font-family: Arial;
	width: 100%;
	color: #485563;
	color: #29323c;
	/* 		background-color: #eaefff; */
	background-color: black;
	font-family: Tillana;
	/* 	font-size: 13px; */
	/* 	line-height: 18px; */
	font-size: 15px;
	line-height: 22px;
	text-align: justify !important;
	/* background-image: url("img/board.png"); */
	background-image: url("img/back.jpg");
/* 	background-image: url("img/zed.png"); */
	background-position: center; /* Center the image */
	background-repeat: repeat;
	/*   Resize the background image to cover the entire container */
	/*   background-size: cover;    */

	/*   background-image: linear-gradient(rgba(240,250,255,1),rgba(240,250,255,0));   Standard syntax (must be last) */
	font-family: Georgia;
	font-family: 'PT Serif', serif;
	font-family: 'Open Sans', sans-serif;
}

h1#title {
	padding-top: 1em;
	margin-top: 0;
	/* 	margin-left: 1em; */
	font-family: Amatic SC;
	line-height: 180%;
	margin-bottom: 0;
	padding-bottom: 1.5em;
	width: 400px;
	text-align: center;
	display: table-cell;
	float: left;
}

h1>a {
	font-size: 180%;
	/* 	font-style: italic; */
	font-weight: bold;
}

a {
	text-decoration: none;
	color: #0080ff;
}

#content {
	width: auto;
	margin-top: 10px;
	/*   background-color: #f0faff; */
}

#header, #footer {
	height: auto;
	width: 100%;
	background-color: #fff;
	background-image: url("img/school_draw_t.png");
}

#header{
	display: table;
	max-height: 450px;
}

hr {
	margin: 0;
}

#top_info {
	width: auto;
	display: table-cell;
	height: 100%;
	font-family: Amatic SC;
	font-size: 1.5em;
	margin: 0.5em 0.5em 0px 0px;
	line-height: 120%;
	text-align: right;
	float: right;
}
#top_info>form input, #top_info>form>#logged{
	background: transparent;
border: none;
font-family: Amatic SC;
line-height: 120%;
font-size: 1em;
color: #0080ff;
}
#top_info > form input[type="submit"], #top_info > form input[type="button"], #top_info > form .btn{}

#top_info>form input {
	text-decoration: underline dotted;
	cursor: pointer;
}
#top_info>form>#logged{
background-color: #3bf6;
border-radius: 10px;
padding-left: 5px;
color: #000;
}
#top_info>form{
	padding: 0px;
}

.footer-item {
	font-family: Amatic SC;
	font-size: 1.2em;
	line-height: 120%;
}

#top_info::after {
	clear: both;;
}

/* Create three equal columns that floats next to each other */
.column {
	float: left;
	/* 	padding: 1%; */
	padding-top: 0px;
}

.column.left {
	width: 72%;
	padding: 1%;
	/* 	background-image: url('img/paper.png'); */
	background-color: #fff; /* Used if the image is unavailable */
	/* 	background-color: #cccccc; Used if the image is unavailable */
	background-repeat: repeat;
	/*   background-size: cover; Resize the background image to cover the entire container */
	/* 	background-image: url("img/whitenoise-600x200.png"); */
	/* 	border-radius: 10px 10px 0px 0px; */
	-webkit-box-shadow: 0px 10px 15px 0px rgba(0, 0, 0, 0.75);
	-moz-box-shadow: 0px 10px 15px 0px rgba(0, 0, 0, 0.75);
	box-shadow: 0px 10px 15px 0px rgba(0, 0, 0, 0.75);
	border: inset 2px #33bbff;
}
.column.left p>img{
    float: left;
    margin-right: 20px;
}

.column.right {
	width: 24%;
	padding: 0;
	float: right;
/* 	border: inset 2px #33bbff; */
	margin-bottom: 15px;
}

#footer .column {
	width: calc(100%/3 - 3%);
	float: left;
	/* 	min-height: 250px; */
	padding: 1%;
	padding-bottom: 0;
	display: inline-block;
}

.column.right>.field {
/* 	min-width: 195px; */
	width: 100%;
	/* 	background: rgba(255, 255, 255, 0.7); */
	background-color: white;
	/* 	border-radius: 15px; */
/* 	margin-bottom: 10px; */
/* 	margin-right: 5px; */
	margin: 0px;
	margin-bottom: 10px;
	padding: 0px;
	-webkit-box-shadow: 0px 10px 15px 0px rgba(0, 0, 0, 0.75);
	-moz-box-shadow: 0px 10px 15px 0px rgba(0, 0, 0, 0.75);
	box-shadow: 0px 10px 15px 0px rgba(0, 0, 0, 0.75);
	border-radius: 5px 5px 0 0;
	border: inset 2px #33bbff;
}
.column.right>.field>.field_h{	
	padding: 0px;
	height: 2em;
	background-color: #0080ff;
	color: white;
	text-align: center;
	padding-top: 5px;
	border-radius: 5px 5px 0 0;
	margin-top: 1px;
	margin-left: 1px;
	font-size: 1.1em;
	font-weight: bold;
}
.column.right>.field>.field_d{	
	padding: 5px;
}
.column.right>.field>h3{
	margin: 5px auto 5px auto;
	wdith: 140px;
}
.column.right .field img {
	display: block;
	margin: auto;
	margin-bottom: 10px;
}

.infobox tr td:first-child, .thead {
	font-weight: bold;
}

#content .row {
	/*   background-color: #f0faff; */
	/*   background-image: linear-gradient(#d9f2ff , #f0faff); Standard syntax (must be last) */
	max-width: 1300px;
	margin: 0px auto;
	position: relative;
	z-index: 0;
}

/* Clear floats after the columns */
.row:after {
	content: "";
	display: table;
	clear: both;
}

.field, .container p {
	background-color: rgba(170, 170, 170, 0.6);
	color: #000;
	margin-left: 10px;
	margin-bottom: 10px;
	padding: 10px;
	-webkit-box-shadow: 0px 10px 15px 0px rgba(0, 0, 0, 0.75);
	-moz-box-shadow: 0px 10px 15px 0px rgba(0, 0, 0, 0.75);
	box-shadow: 0px 10px 15px 0px rgba(0, 0, 0, 0.75);
}

.container p {
	position: relative; top : 50px; right : 80px;
	text-align: right;
	border-radius: 10px;
	top: 50px;
	right: 80px;
}

.container {
	display: table-row;
	height: 132px;
	background-image: url("img/grass.png");
	background-repeat: repeat-x;
	position: relative;
}

.pull-right {
	margin-top: 0;
	float: right;
}

.phone-icon {
	width: 0.857142857em;
	height: 1em;
}

.envelope-icon {
	width: 1em;
	height: auto;
}

.facebook-icon, .rss-icon, .login-icon {
	width: 1.7em;
	height: 1.5em;
}

a.blue-facebook:link, a.blue-facebook:visited {
	color: #3a70ba;
	fill: #3a70ba;
	stroke: none;
}

a.orange-rss:link, a.orange-rss:visited {
	color: #ea6a1b;
	fill: #ea6a1b;
	stroke: none;
}

header a:link, header a:visited, header a:active, header a:hover, header a:focus,
	footer a:link, footer a:visited {
	color: #0080ff;
	fill: #0080ff;
	stroke: none;
}

.post_time{float: right;font-size: smaller;opacity: 0.5;}

#footer {
	display: table
}

.dn {
	display: none !important;
}

.ql-editor{
	text-align: justify;
}
#rozvrh tr:first-child,#rozvrh tr td:first-child, #rozvrhEdit tr:first-child,#rozvrhEdit tr td:first-child{
	font-weight: bold;
}
#rozvrh, #rozvrhEdit{width: 100%; border: 1px grey solid; border-collapse: collapse;}
#rozvrh td, #rozvrhEdit td{border: 1px grey solid; border-collapse: collapse;}
#rozvrhEdit, #csEditBtn{display:none;}
#rozvrhEdit textarea {
    width: 95%;
}
input[type=submit], input[type=button], .btn{
	background-color: #4CAF50;
	color: white;
	padding: 14px 20px;
	margin: 8px 0;
	border: none;
	cursor: pointer;
	min-width: 50px;
	max-width: 150px;
	text-align: center;
	font-size: inherit;
    font-family: inherit;
}
.btn div{
	display: inline-block;margin: 10px 0;margin-top: 20px;
}
.btn.r{
	background-color: red;
}
td .btn div{margin-top: 15px;}
#top_info > form input[type="submit"], #top_info > form input[type="button"], #top_info > form .btn{
	padding: 0px;
	padding-left: 10px;}

a .btn{
	text-decoration: none;
	color: white;
}
#editor {

    min-height: 200px;
    width: 100%;

}
#editor img, #info img, #sbor img{
	float: left;
}
.msgBox{
	color: white;
	padding: 14px 20px;
	margin: 8px 0;
	border: none;
	text-align: center;
}
.msgBox.ok{
	background-color: #4CAF50;
}
.msgBox.err{
	background-color: red;
}
@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
	#slider.sticky{ margin: 0px;}	
}

@media screen and (max-width: 830px) {
	.row {
		top: 0px;
	}
	#skica{display: none;}
}
@media screen and (max-width: 800px) {
	.column.left {
		width: calc(98% - 4px);
	}
	.column.right {
		display: none;
	}
	#footer .column{float:none; width: 98%;}
	#footer .column.fc1, #footer .column.fc2{float:left; width: 47%;}
}

@media screen and (max-width: 600px) {
	.column.right {
		display: none;
	}
	#header{display: block; max-height: 750px;}
	#top_info{display: block; text-align: center;float: none;}
	h1#title{width:100%; text-align: center; display: block; float: none; padding-bottom: 0.3em;}
	#footer .column.fc1, #footer .column.fc2{float:none; width: 94%;}
}