@charset "utf-8";
/* CSS Document */

* {
	padding: 0;
	margin: 0;	
}

.clear {
	clear: both;
}

#wrapper {
	width: 1000px;
	margin: 0 auto;
	border: 3px solid #003264;
	border-top:0;	
}

#top {
	width: 100%;
	height: 115px;
	background: #0568CE;
	border-bottom: 3px solid #003264;
	position: relative;
	padding-top: 35px;
}

#school_logo {
	width: 200px;
	height: 116px;
	background: #0568CE url('../images/logo.jpg') no-repeat;
	position: absolute;
	left: 55px;
	top: 17px;
	z-index: 100;
}

#school_name {
	background: #0568CE url('../images/top_name.png') no-repeat;
	background-size: 100% 100%;
	margin: auto;
	width: 600px;
	height: 80px;
	padding-left: 350px;
	position: relative;
	line-height: 70px;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 35px;
	font-weight: bold;
	color: white;
}

#main {
	background: #50a2e6;
	background: -moz-linear-gradient(top,  #50a2e6 0%, #0066cc 100%);
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#50a2e6), color-stop(100%,#0066cc));
	background: -webkit-linear-gradient(top,  #50a2e6 0%,#0066cc 100%);
	background: -o-linear-gradient(top,  #50a2e6 0%,#0066cc 100%);
	background: -ms-linear-gradient(top,  #50a2e6 0%,#0066cc 100%);
	background: linear-gradient(to bottom,  #50a2e6 0%,#0066cc 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#50a2e6', endColorstr='#0066cc',GradientType=0 );
	padding: 25px;
}

#main #menu_side {
	width: 250px;
	min-height: 500px;
	float:left;
	border: 3px solid #003264;
}

#main #menu_side #menu {
	min-height: 320px;
	padding-top: 25px;
	background: rgba(0, 100, 200, 1);
}

#main #menu_side #menu a.one_nav {
	width: 175px;
	min-height: 35px;
	background: rgba(0, 100, 200, 1) url('../images/button.png') repeat;
	margin: 25px auto 0 auto;
	line-height: 35px;
	text-align:center;
	display: block;
	text-decoration: none;
	color: #000;
}

#main #menu_side #menu a.one_nav:hover {
	text-decoration: none;
}

#main #menu_side #menu a.one_nav:active {
	color: #000;
}

#main #menu_side #menu a.one_nav:visited {
	color: #000;
}

#menu :first-child {
	margin: 0 auto !important;
}

#main #menu_side #copy {
	color: #003264;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 13px;
	text-align: center;
	display: table-cell;
	vertical-align: bottom;
	text-align: center;
	height: 150px;
	width: 200px;
	padding: 0 25px 5px 25px;
	background: #0164c8;
	background: -moz-linear-gradient(top,  #0164c8 0%, #84b6e7 48%, #ffffff 100%);
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#0164c8), color-stop(48%,#84b6e7), color-stop(100%,#ffffff));
	background: -webkit-linear-gradient(top,  #0164c8 0%,#84b6e7 48%,#ffffff 100%);
	background: -o-linear-gradient(top,  #0164c8 0%,#84b6e7 48%,#ffffff 100%);
	background: -ms-linear-gradient(top,  #0164c8 0%,#84b6e7 48%,#ffffff 100%);
	background: linear-gradient(to bottom,  #0164c8 0%,#84b6e7 48%,#ffffff 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#0164c8', endColorstr='#ffffff',GradientType=0 );
}

#main #content {
	width: calc(100% - 337px);
	float: right;
	border: 3px solid #003264;
	min-height: 450px;
	padding: 25px;
	background: #fff;
}

#main #content :first-child {
	margin-top: 0 !important;
}

#main #content .big_header {
	background: #50a2e6 url('../images/header.png') repeat;	
	height: 40px;
	padding: 5px;
	line-height: 40px;
	text-align:center;
	margin: 25px auto 0 auto;
	border: 2px solid #003264;
	font-weight: bold;
	color: #fff;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 24px;
}

#main #content .small_header {
	background: #50a2e6 url('../images/header.png') repeat;
	border: 2px solid #003264;
	height: 20px;
	line-height: 20px;
	text-align: center;
	margin: 15px auto 0 auto;
	padding: 5px;
	font-family: Arial, Helvetica, sans-serif;
	color: #fff;
	font-weight: bold;
	font-size: 16px;
	width: calc(75% - 14px);
}

#main #content .akapit {
	text-align: justify;
	margin-top: 10px;
}

.co1 {	
	color: rgb(96,139,78);
}

.kw2 {
	color: rgb(86, 156,214);	
}


.sy0 {
	color: rgb(0,128,128)
}

.l1 {
	background: rgba(0, 100, 200, 1);
}

.code ol {
	margin: 0;	
}

.li2 {
	background: #84b6e7;
}

.spoiler_area {
	padding: 10px 30px;	
	background: #CCC;
}

.spoiler {
	border: 1px solid black;	
}

.spoiler_header {
	padding: 3px 8px;	
	border-bottom: 1px solid black;
	background: #999;
}

.one_lang {
	float: left;
	width: 200px;
	height: 200px;	
	position: relative;
}

.one_lang img {
	max-width: 200px;
	max-height: 200px;	
	position:absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
}

#utk_quiz .divcheckbox {
	float:left;
	width: 280px;
	margin-left: 15px;
	margin-top: 3px;
}

#utk_quiz .divcheckbox span {
	margin-left: 10px;	
}

#utk_quiz .answer_correct {
	color: rgba(0,204,0,1);
	font-weight: bold;
}

#utk_quiz .answer_incorrect {
	color: rgba(255,0,0,1);
}

#quiz_result {
	margin: 5px 10px;
	border: 1px solid rgb(76, 96, 146);
	background: rgba(76, 96, 146, 0.5);
	text-align: center;
	padding: 3px;
	font-size: 16pt;
}

#quiz_result:empty {
	background: none;
	border: none;
}

#quiz_result .result_counter {
	font-weight: bold;
}

#ankieta {
	text-align:center;	
}

#ankieta select {
	width: 350px;
}

.error, .sukces {
	width: 90%;
	margin: 10px auto 20px auto;	
	padding: 5px;
	padding-left: 20px;
}

.error {
	background: rgba(255,0,0,0.5);
	border: 1px solid rgb(255,0,0);	
}

.sukces {
	background: rgba(0,153,0,0.5);
	border: 1px solid rgb(0,153,0);
}

.question_div {
	margin-top: 10px;
}

.checkbox_type .one_answer {
	float: left;
	width: 50%;
}


#utk_quiz input[type=submit] {
	border-radius: 28px;
	border: none;
	color: #ffffff;
	background: rgba(0, 100, 200, 1);
	padding: 10px 20px 10px 20px;
	text-decoration: none;
	margin-top: 10px;
	margin-left: 20px;
}

.sala_img {
	width: 50%;
	text-align:center;	
	float:left;
}

.sala_img img {
	max-width: 300px;
	max-height: 300px;	
}