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

.separate-window {
	display:block; width:65%; margin: 0 auto;
	color:darkslategray; background-color: #D7D7D7;
	padding: 2.5px 25px;
	font-family: 'moreless'; font-size:13pt;
	text-align: center;
}.separate-window a {
	text-decoration:none; padding:0px 3px;
	color:brown;
}.separate-window a:before {
  content: '['; padding-right:4px;
}.separate-window a:after {
  content: ']'; padding-left:4px;
}
.separate-window img {
	display: inline-block; vertical-align: middle;
	margin:0px; padding:0px;
	height:20px; width:20px;
}
.separate-window a:hover {
	-webkit-transition: all .5s ease-in-out;
	-moz-transition: all .5s ease-in-out;
	color:black;
}

#exercise1 .i_ex1 { /*rearrange letters-2 game*/
	padding: 0;
	margin:10px auto 25px!important;
	width:65%; height:70vh;
}
#exercise2 .i_ex2, #exercise3 .i_ex3, #exercise4 .i_ex4 {
	margin:0 auto 25px;
	width:75%;
}

@-moz-document url-prefix() {
}



@media screen and (max-width : 1250px ){
.separate-window {
	width:75%;
}
#exercise1 .i_ex1 {
	width:75%; height:75vh;
}

}


@media screen and (max-width : 950px ){
.separate-window {
	width:90%;
}
#exercise1 .i_ex1{
	width:90%; height:70vh;
}
#exercise2 .i_ex2, #exercise3 .i_ex3, #exercise4 .i_ex4 {
	margin:0 auto 25px;
	width:85%;
}
}


@media screen and (max-width : 780px ){
.separate-window {
	width:100%;
}
#exercise1 .i_ex1{
	width:100%; height:70vh;
}
#exercise2 .i_ex2, #exercise3 .i_ex3, #exercise4 .i_ex4 {
	margin:0 auto 25px;
	width:100%;
}

}