
*{
	padding:0;
	margin:0;
	background-color:black;
	color: #e5e5e5;
	font-family: sans-serif;
	box-sizing:border-box;
}

h1,h2{
	width:100%;
	text-align:left;
	font-size:1.2rem;
	margin-bottom:1rem;
}


summary{
	min-height:0.6rem;
	padding:0.3rem;
}

summary:hover{
	background-color:#666666;
}

button:hover{
	background-color:#666666;
}

#logoMobi{
	width:75%;
	margin-left:-0.2rem;
} 
body{
	padding:0.5rem;
}

label{
	margin:0.3rem;
	width:100%;
	display:table;
	padding:0.2rem;
	font-size:0.8rem;
}

#editorScreen{
	width:100%;
	min-width:25rem;
	border:2px solid #e5e5e5;
	border-radius:0.2rem;
	overflow:scroll;
	background-color:#1E1E1E;
}
#tool{
	
	width:100%;
    height:99%;
	display:flex;
	flex-direction:row;
}

#toolbar{
    display:block;	
	min-width:20rem;
    max-width:20rem;	
	margin-right:0.5rem;
	border-radius:0.3rem;	
	overflow-y:scroll;
	overflow-x:hidden;
}

input, select{
	
}
#text{
	width:99%;
	height:4rem;
}
.toolField{
	
	margin: 0 auto;
	margin-top:0.75rem;
}
fieldset{
	padding:0.3rem;
	width:98%;
	display:flex;
	flex-direction: column;
	border-radius:0.3rem;
	border:2px solid #e5e5e5;
}

legend{
	font-size:0.9rem;
	font-weight:900;
}

.button3{
	width:30%;
}


.button4{
	width:23%;
	font-size:0.7rem;
}
.button5{
	width:15%;
	font-size:0.7rem;
}

.button1{
	margin-top:0.2rem;
	width:100%;
	
}


.number1row{
	float:right;
}
button {
	border:2px solid #e5e5e5;
	background-color:transparent;
	border-radius:0.5rem;
}

input[type='color']{
	width: 4.5rem;
	float:right;
	height: 1.2rem;
	border:1px solid #e5e5e5;
}

input[type='file']{
	padding:0.1rem;
	width: 99%;	
	margin:0 auto;
}
input[type=range]{
	width:50%;
	float: right;
	
}

input[type=text], select{
	width:70%;
	float: right;
}


input[type=number]{
	width:3rem;

}
.row{
	width:100%;
	margin-top:0.5rem;
	display:flex;
	justify-content:space-between;
	font-size:0.8rem;
}


.half{
	width:48%;
	display:block;
}


.logo{
	float:right;
	min-width:310px;
    max-width:310px;	
	height:100%;
	margin-top: 1rem;
	padding-left:0.5rem;
}

#logo {
	margin-left:15%;
	margin-bottom:1rem;
	width:70%;
	
	
}

#scrollableToolbar{
	border-radius:0.3rem;	
    background-color:#1e1e1e;

}

hr{
	margin-top:0.5rem;
	margin-bottom:0.5rem;
}

.PortButton{
	margin:0.15rem;
	width:40px;
	height:70px;
	
}


.LandButton{
	margin:0.15rem;
	width:80px;
	height:40px;	
}

.wrap{
	flex-wrap: wrap;
}

.presetMenu img{
	width:100%;
}
.presetMenu button{
	overflow:hidden;
}

.colorTextInput{
	width:4.5rem;
	float:right;
	margin-right:0.3rem;	
	color:white;
	text-align:right;
	height:1.2rem;
	font-size:1rem;
}

.rangeNumberInput{
	float:right;
	margin-right:0.3rem;	
	text-align:right;
}	


.Button2 {
	width:40%;
	height:1.3rem;
	font-size:0.9rem;
	border-radius:0.7rem;
	font-weight:700;
	margin-right:0.3rem;

}
::-webkit-scrollbar {
  width: 12px;
}


::-webkit-scrollbar-track {
  box-shadow: inset 0 0 5px #e5e5e5; 
  border-radius: 10px;
}
 

::-webkit-scrollbar-thumb {
  background: #ffffff; 
  width:10px;
 
}

::-webkit-scrollbar-thumb:hover {
  background: #555; 
}

input[type=range] {
  -webkit-appearance: none;
  margin: 2px 0;
  width:50%;
}



input[type=range]:focus {
  outline: none;
}
input[type=range]::-webkit-slider-runnable-track {
  width: 100%;
  height: 8.4px;
  cursor: pointer;
  box-shadow: 1px 1px 1px #000000, 0px 0px 1px #0d0d0d;
  background: #e5e5e5;
  border-radius: 1.3px;
  border: 0.2px solid #010101;
}
input[type=range]::-webkit-slider-thumb {
  box-shadow: 1px 1px 1px #000000, 0px 0px 1px #0d0d0d;
  border: 1px solid #000000;
  height: 20px;
  width: 10px;
  border-radius: 3px;
  background: #ffffff;
  cursor: pointer;
  -webkit-appearance: none;
  margin-top: -7px;
}
input[type=range]:focus::-webkit-slider-runnable-track {
  background: #e5e5e5;
}
input[type=range]::-moz-range-track {
  width:100%;
  height: 8.4px;
  cursor: pointer;
  box-shadow: 1px 1px 1px #000000, 0px 0px 1px #0d0d0d;
  background: #e5e5e5;
  border-radius: 1.3px;
  border: 0.2px solid #010101;
}
input[type=range]::-moz-range-thumb {
  box-shadow: 1px 1px 1px #000000, 0px 0px 1px #0d0d0d;
  border: 1px solid #000000;
  height: 20px;
  width: 10px;
  border-radius: 3px;
  background: #ffffff;
  cursor: pointer;
}
input[type=range]::-ms-track {
  width: 50%;
  height: 8.4px;
  cursor: pointer;
  background: transparent;
  border-color: transparent;
  border-width: 16px 0;
  color: transparent;
}
input[type=range]::-ms-fill-lower {
  background: #e5e5e5;
  border: 0.2px solid #010101;
  border-radius: 2.6px;
  box-shadow: 1px 1px 1px #000000, 0px 0px 1px #0d0d0d;
}
input[type=range]::-ms-fill-upper {
  background: #e5e5e5;
  border: 0.2px solid #010101;
  border-radius: 2.6px;
  box-shadow: 1px 1px 1px #000000, 0px 0px 1px #0d0d0d;
}
input[type=range]::-ms-thumb {
  box-shadow: 1px 1px 1px #000000, 0px 0px 1px #0d0d0d;
  border: 1px solid #000000;
  height: 20px;
  width: 10px;
  border-radius: 3px;
  background: #ffffff;
  cursor: pointer;
}
input[type=range]:focus::-ms-fill-lower {
  background: #e5e5e5;
}
input[type=range]:focus::-ms-fill-upper {
  background: #e5e5e5;
}


#mainScale{
	 width:45%;
	border-radius:0.2rem;
}

#support{
	width:100%;
	text-align:center;
	padding:1rem;
	border-radius:0.5rem;
    margin-top:0.2rem;
}

#paypal, #kofi{
	margin-top:0.3rem;
	text-align:center;
	
}

#kofi p{
	margin-bottom:0.6rem;
}

#paypal form{
	margin:0 auto;
	margin-top:0.6rem;	
}

footer{
	margin-top:1rem;
	font-size:0.7rem;
	line-height:1rem;
}


#contact{
	display:flex;
    justify-content:space-between;
}

#adsSidebar{
	float:right;
	min-width:9.25rem;
    max-width:9.25rem;	
	height:100%;
    margin-left:1rem;
	margin-top: 1rem;
	margin-right:1rem;

}

#buttonGames img{
	margin-top:1rem;
	border-radius:  0.5rem;
	border:2px solid  #e5e5e5;
}

#startScreen{
	width:100%;
	height:100%;
	position:absolute;
	background-color:rgba(255,255,255,0.7);
	display:none;
}

#startScreen h1{
	text-align:center;
	font-size:1.5rem;
}

#startscreen a{
	color:#FFA500;
}

#startScreen p{
	
	font-size:1.2rem;
}

#startWindow{
	width:45%;
	
	border:2px solid  #e5e5e5;
	padding:1rem;
	border-radius:2rem;
	margin: 2rem auto;

	button{
		width:20%;
	font-size:1.4rem;
	background-color:#FFA500;
	border:2px solid  #e5e5e5;
	color:black;
	border-radius:0.6rem;
	}

}

#startWindow iframe{
	width:90%;
	margin-left:5%;
	margin-top:1rem;
	margin-bottom:1rem;
}
@media (max-width: 700px) { 
#startWindow{
		width:80%;
		
}


}	

.recommendations{
	margin-left:1rem;
}

.recommendations p{
	margin-bottom:0.6rem;
}

.recommendations iframe{
	margin-right:1rem;
	margin-bottom: 1rem;
	
}

.amazonpartner{
	font-size:0.8rem;
	
}






