@font-face {
	font-family : ASMedium;

	src         : url('fonts/AlegreyaSans-Medium.otf');
	src         : url('fonts/AlegreyaSans-Medium.woff');
	src         : url('fonts/AlegreyaSans-Medium.ttf');
}

@font-face {
	font-family : KSBook;

	src         : url('fonts/KlinicSlabBook.otf');
	src         : url('fonts/KlinicSlabBook.woff');
	src         : url('fonts/KlinicSlabBook.ttf');
}

@font-face {
	font-family : KSBold;

	src         : url('fonts/KlinicSlabBold.otf');
	src         : url('fonts/KlinicSlabBold.woff');
	src         : url('fonts/KlinicSlabBold.ttf');
}

@font-face {
	font-family : KSMedium;

	src         : url('fonts/KlinicSlabMedium.otf');
	src         : url('fonts/KlinicSlabMedium.woff');
	src         : url('fonts/KlinicSlabMedium.ttf');
}

@font-face {
	font-family : Menlo;

	src         : url('fonts/Menlo-Regular.otf');
	src         : url('fonts/Menlo-Regular.woff');
	src         : url('fonts/Menlo-Regular.ttf');
}

body {
	margin           : 0px !important;
	background-color : #F6F6F6;
}

table {
	width           : 100%;
	border-collapse : collapse;

	border          : none !important;
}

tr td {
	margin  : 5px !important;
	padding : 5px !important;
}

a {
	color           : #000;
	text-decoration : none;
}

a:hover {
	color           : #000;
	text-decoration : none;
}

pre {
	padding          : 20px;

	background-color : #FFF;
	font-family      : monospace;
	color            : #000;
	word-break       : break-word;
	border-color     : #AAA;
	border-style     : solid;
	border-width     : 1px;
}

.indexator {
	position : relative;
	top      : -80px;
}

.box {
	margin           : 10px;
	margin-top       : 14px;
	padding          : 5px;
	padding-top      : 6px;

	background-color : #FFF;
	font-family      : ASMedium;
	text-align       : center;
	border           : 1px;
	border-color     : #000;
	border-style     : solid;
	box-shadow       : 3px 3px #C8C8C8;
}

.box:hover {
	box-shadow : 3px 3px #50C8F0;
}

.boxx {
	height           : 80px;
	width            : 150px;
	margin           : 10px;
	padding          : 0px 15px;

	background-color : #FFF;
	border-color     : #DDD;
	border-style     : solid;
	border-width     : 1px;
	border-radius    : 8px;
}

.boxx:hover {
	border-color : #AAA;
}

.boxx_content {
	display         : flex;

	height          : 100%;

	text-align      : center;

	justify-content : center;
	align-items     : center;
}

#popup-background {
	position         : fixed;
	z-index          : 998;

	height           : 100vh;
	width            : 100%;

	opacity          : 0.3;
	background-color : #000;

	filter           : alpha(opacity=30);
}

#popup {
	position : fixed;
	top      : 25vh;
	left     : 30%;
	z-index  : 999;

	width    : 40%;
}

#popup-content {
	width  : 90%;
	margin : 40px 20px 80px 20px;
}

#popup-exit {
	position : absolute;
	bottom   : 5px;
	left     : 45%;

	width    : 30px;
}

#menu-container {
	position : fixed;
	z-index  : 100;

	height   : 80px;
	width    : 100%;
}

#menu-container-offset {
	height : 80px;
	width  : 100%;
}

#menu-content {
	position     : relative;
	top          : 10px;

	height       : 60px;
	width        : 100%;
	max-width    : 1000px;
	margin-right : auto;
	margin-left  : auto;
}

#logo-container {
	float            : left;

	height           : 56px;
	width            : 196px;

	background-color : #FFF;
	border           : 2px;
	border-color     : #000;
	border-style     : solid;
}

#logo {
	height  : 36px;
	width   : auto;
	padding : 10px;
}

#session-container {
	float  : right;
	height : 100%;
}

#session-username {
	float       : left;

	margin-top  : 16px;
	padding     : 7px;

	font-family : ASMedium;
	text-align  : right;
}

.session-content {
	float  : right;

	height : 19px;
	width  : 26px;
}

.session-content-open {
	height : 36px;
	width  : 26px;
}

#session-showhide {
	height : 100%;
	width  : 100%;
}

#session-error {
	margin-left : 5px;
}

.session-logout {
	position   : relative;
	display    : none;
	top        : -9px;
	left       : -120px;
	visibility : hidden;

	overflow   : hidden;
	width      : 120px;
	padding    : 10px;

	text-align : left;
}

.session-logout-visible {
	display    : block;
	visibility : visible;
}

.session-login {
	position   : relative;
	display    : none;
	top        : -9px;
	left       : -270px;
	visibility : hidden;

	width      : 270px;
	padding    : 10px;
}

.session-login-visible {
	display    : block;
	visibility : visible;
}

.session-login-textbox {
	width        : 95%;
	margin       : 3px;
	padding      : 2px;

	border-color : #50C8F0;
	border-style : solid;
	border-width : 1px;
}

.session-submit {
	display    : inline-block;

	margin     : 3px;
	padding    : 3px 6px;

	font-size  : 80%;
	text-align : center;
}

#lock {
	height : 12px;
	width  : auto;
}

#sub-menu-container {
	float     : left;

	height    : 100%;
	min-width : 500px;
}

.menu-item {
	position       : relative;
	float          : left;

	font-size      : 100%;
	letter-spacing : 2px;
}

#canvas {
	position : fixed;
	z-index  : 10;
}

#main-container {
	width : 100%;
}

.main-content {
	min-height : calc(100vh - 80px);
	width      : 100%;
}

.main-content-notfull {
	width : 100%;
}

.main-content-unique {
	min-height : calc(100vh - 180px);
}

.main-content-inside {
	overflow     : hidden;
	width        : 1000px;
	margin-right : auto;
	margin-left  : auto;
	padding      : 20px 0px;
}

#content000 {
	height    : calc(100vh - 250px);
	max-width : 1000px;
}

#content001 {
	position         : relative;
	top              : -150px;

	width            : 800px;
	margin-right     : auto;
	margin-left      : auto;
	padding          : 10px;

	background-color : #000;
	font-family      : ASMedium;
	font-size        : 250%;
	color            : #FFF;
	letter-spacing   : 5px;
}

.aboutus_buttons {
	float      : left;

	width      : 180px;

	text-align : center;
}

.aboutus_buttons_selected {
	background-color : #DFDFDF;
}

.aboutus {
	display      : block;
	visibility   : visible;

	width        : 1000px;
	margin-right : auto;
	margin-left  : auto;

	opacity      : 1.0;
	color        : #FFF;

	
	filter       : alpha(opacity=100);
}

.aboutus_hidden {
	display    : none;
	visibility : hidden;

	opacity    : 0.0;

	filter     : alpha(opacity=0);
}

.col_vert {
	max-height : 100%;
	width      : 44%;
	margin     : 0% 3%;
}

.col_hori {
	max-height : 50%;
	width      : 94%;
	margin     : 0% 3%;
}

.col_sqr {
	max-height : 50%;
	width      : 44%;
	margin     : 0% 3%;
}

.aprenderpraticar_content {
	display         : flex;

	overflow        : hidden;

	flex-wrap       : wrap;
	justify-content : center;
	align-items     : top;
}

#aprenderpraticar_desc {
	width   : 100%;
	padding : 60px 20px;
}

#page-content{
	width   : calc(100% - 40px);
	padding : 0px 20px;
}

.error {
	text-align : center;
}

.edit-profile-input {
	width     : 100%;
	padding   : 4px;

	font-size : 17px;
}

#saveform {
	display : inline-block;
	width   : 55px;
}

#changepassword {
	display : inline-block;
	width   : 110px;
}

.article_link {}

.white_link_nu {
	color : #FFF;
}

.white_link_nu:hover {
	color : #FFF;
}

.black_link_nu {
	color : #000;
}

.black_link_nu:hover {
	color : #000;
}

.white_link {
	color           : #FFF;
	text-decoration : underline;
}

.white_link:hover {
	color           : #FFF;
	text-decoration : underline;
}

.black_link {
	color           : #000;
	text-decoration : underline;
}

.black_link:hover {
	color           : #000;
	text-decoration : underline;
}

.aprender_comecar {
	width        : 100px;
	margin-right : auto;
	margin-left  : auto;
}

.aprender_book {
	width   : 250px;
	padding : 0px 20px;
}

.aprender_book_desc {
	padding : 30px;
}

.aprender_articles {
	padding : 0px 100px;
}

#code_lines, #code, #input, #console {
	font-family : Menlo !important;
	font-size   : 11px;
}

.exercicios_text {
	float : left;
	width : 35%;
}

.exercicios_main {
	float            : right;

	width            : 63%;

	background-color : #646464;
	font-family      : Menlo !important;
	color            : #EEE;
}

.exercicios_main_linhas {
	float            : left;

	overflow         : hidden;
	height           : 310px;
	min-height       : 310px;
	max-height       : 310px;
	width            : 40px;
	min-width        : 40px;
	max-width        : 40px;
	margin           : 0px 4px;

	background-color : transparent;
	color            : #FFF;
	text-align       : right;
	border-style     : none;
}

.exercicios_main_codigo_textarea {
	float                   : right;

	min-height              : 310px;
	max-height              : 310px;
	min-width               : calc(100% - 65px);
	max-width               : calc(100% - 65px);
	margin                  : 0px;

	background-color        : transparent;
	color                   : #FFF;
	border-style            : none;

	-webkit-text-fill-color : #FFF;
}

.exercicios_main_codigo_textarea:focus {
	outline : none !important;
}

.exercicios_main_console_textarea {
	min-width        : calc(100% - 40px);
	max-width        : calc(100% - 40px);
	margin           : 0px;
	padding          : 0px 20px;

	background-color : transparent;
	color            : #FFF;
	border-style     : none;
}

.exercicios_main_console_textarea:focus {
	outline : none !important;
}

.exercicios_buttons {
	display : inline-block;
}

.exercicios_buttons_hints {
	margin-left : 14px;
	font-size   : small;
}

.exercise_row_selected {
	background-color : #E6E6E6;
}

.exercise_row:hover {
	background-color : #E6E6E6;
}

.img_correct_sub {
	position : relative;
	top      : 6px;

	height   : 26px;
	width    : 26px;
}

#new_thread p label{
	display:inline-block;
	width:120px;
	vertical-align:top;
}

.float_left {
	float : left;
}

.float_right {
	float : right;
}

.text_big {
	font-size : xx-large;
}

.text_medium {
	font-size : x-large;
}

.text_small {
	font-size : large;
}

.text_xsmall {
	font-size : medium;
}

.book {
	font-family : KSBook;
}

.bold {
	font-family : KSBold;
}

.medium {
	font-family : KSMedium;
}

.text_small.medium {
	padding-left : 15px;
}

.text_medium.bold {
	padding-top : 10px;
}

.text_black {
	color : #000;
}

.text_white {
	color : #FFF;
}

.text_red {
	color : red;
}

.text_green {
	color : green;
}

#footer-container {
	height : 60px;
	width  : 100%;
	margin : 20px 0px;
}

#footer-content {
	height       : 100%;
	width        : 100%;
	max-width    : 1000px;
	margin-right : auto;
	margin-left  : auto;
}

.footer-element {
	float : left;
}

.footer-logo {
	height : 100%;
	width  : auto;
}

.blue_background {
	background-color : #50C8F0;
}

.center_text {
	text-align : center;
}

.left_text {
	text-align : left;
}

.right_text {
	text-align : right;
}

.admin_header {
	width: 100%;
	background: #417690;
	color: #f4f379;
	overflow: hidden;
	font-size: 12px;
	font-family: "Lucida Grande","DejaVu Sans","Bitstream Vera Sans",Verdana,Arial,sans-serif;
}

.admin_branding {
	float: left;
}

.admin_site-name {
	padding: 0 10px;
	font-size: 18px;
	margin: 8px 0;
	font-weight: normal;
}

.admin_user-tools {
	float: right;
	padding: 1.2em 10px;
	font-size: 11px;
	text-align: right;
	color: #ffc;
}

.admin_content {
	margin: -10px 15px 0px 15px;
	color: #666;
	font-family: "Lucida Grande","DejaVu Sans","Bitstream Vera Sans",Verdana,Arial,sans-serif;
}

.yellow {
	color: #f4f379 !important;
}

.yellow2 {
	color: #FFF !important;
}

.yellow2:hover {
	color: #FFF !important;
	text-decoration: underline !important;
}