html{
	width: 100%;
	height:100%;}

body{
	width: 100%;
	height: 100%;
	margin: 0;
}

#content{
	width:100%;
	height:100%;
	background: #d3d3d3;   
	padding-top: 3px;
}

.center {
    margin: auto;
}

#header{
	width:100%;
	height:100%;    
	max-height: 22%;
	position:relative;
}

#logo_container {
	text-align: center;
	position: relative;
	margin-top: 0px;
	margin-left: 0px;
	height:45%;
   	max-width: 29%;
}

#logo {
	max-width: 100%;
	height:auto;
	max-height: 100%;
}

.main_title {
	position: relative;
  	font-size: 6vw;
   	display: inline-block;
   	width: auto;
   	max-width: 70%;
   	text-align: center;
   	vertical-align: middle;
}

#term_container {
	position: relative;
	float: left;
	font-size: 200px;
	text-align: center;
	margin-top: 1%;
	width: 100%;
}

#buttons {
	position: relative;
	float: left;
	width: 98%;
	left: 0;
	align-content: center;
	text-align: center;
}

#term {
	height: auto;
	max-height: 90%;
	margin: auto;
  	font-size: 2vw;
	float: left;
	width: 100%;
	text-align: center;
#    position: absolute;
	margin-top: 3%;
	left: 0%;
#    transform: translateX(-50%);
  	vertical-align: middle;
}

#footer{
	width:99%;
	height:auto;    
	position:absolute;
	bottom: 0.1%;
	font-size: 8sp;
	text-align: right;
}

.column{
	margin-top: 0.3%;
	float: left;
	position: relative;
	width: 32%;
	margin-left: 0.3%;
	height: 98%;
}



.small_column{
	width: 20%;
}

.large_column{
	width: 99%;
}

.btn_right {
	position: relative;
	right: 0px;
	margin-right: 0px;
}

#left_title {
	font-size: 60px;
	text-align: center;
}

#bottom_container {
    position: absolute;
    height: 35%;
    width: 99.5%;
    bottom: 2%;
	z-index: 1;
}

#settings_buttons_container {
	width: 15%;
	position: absolute;
	bottom: 0;
	left: 0.5%;
}

.settings_content_container {
	padding-left: 3px;
	padding-right: 3px;
	position: absolute;
	visibility: hidden;
	margin-left: 25%;
	width: 50%;
	height: 100%;
	border: 1px solid green;
	overflow-y: auto;
}

#select_set_result {
	border: 1px solid red;
	float: right;
}

#my_select {
	border: 1px solid red;

}

#label_select_set_result {
	font-size: medium;
}

textarea {
	left: 1%;	
  	top: 1%;	
  	width:98%;
  	height: 98%;
}

.ui-button {
	margin: 1px;
}

.ui-progressbar {
	height: 5%;
}

#progressbar {
	visibility: hidden;
	width: 98%;
	margin-left: 1%;
}


@media only screen and (max-width: 600px) {
	.my_font {
		font-size: 0.6em;
	}
}


@media only screen and (min-width: 601px) {
	.my_font {
		font-size: 1.2em;
	}
}

input[type=number]{
    width: 50px;
}

#speed_info {
	text-align: right;
	font-size: 20px;
	margin-right: 1%;
}

#test_container {
	position: absolute;
	bottom: 2%;
	left: 0.5%;
	width: 99%;
	height: 70%;
	z-index: 99;
	background: #d3d3d3;   
	visibility: hidden;
}

.test_element {
	left: 20%;
	position: relative;
	width: 60%;
	padding: 1%;
}

#test_sentence {
	border: 1px solid blue;
	font-size: large;
}


#space {
	position: relative;
	float: left;
	display: inline-block;
	padding: 1%;
}

#submit_container {
	text-align: center;
	position: relative;
	float: left;
	width: 60%;
	padding: 1%;


}