.mobile-only {
	display:none;
}
/* Smartphones (portrait and landscape) ----------- */
@media only screen and (max-width : 1024px) {
	.layout {
		width: 100%;
		
	}
	img.tree {
		
	}

}

@media only screen and (max-width : 768px) {
	html, body {
		font-size:16px;
	}
	h1, .buttons .submit, h2 {
		line-height: 24px  !important;
		font-size: 18px  !important;
	}
	.header-container {
	padding: 10px  !important;
	}
	
	#ElementsContainer {
		padding-top: 1em;
	}
	html body .col, #ElementsContainer, .decorations .col {
		width: 100%;
		display: block;
	}
	#CanvasContainer{
		display:block;
		width: 100%;
	}
	#CanvasContainer img {
		width:600px;
	}
	.form-container .col-right {
		padding-left: 0px;
	}

	.form-container .col-left {
		padding-right: 0px;
	}
	div#LeftElements, div#RightElements  {
		display:table-cell;
		width:50%;
	}
	.layout {
		padding: 5px;
	}
	.form-row {
		padding: 0px;
	}


	#CanvasContainer {
		
	}
	.mobile-only {
		display: block;
	}
	button.mobile-only {
		display:inline-block;
	}
	
	.big-img-container, .big-img {
		height: 52px;
		width: 52px;
	}
		.bottom-img.img-even, .bottom-img-container.even-container {
			height: 72px;
			width: 72px;
		}
	.small-img, .small-img-container {
		height: 24px;
		width: 24px;
		text-align: center;
		
	}
	.small-img-container {
		margin: 4px;
	}

}


@media only screen and (max-width : 414px) {
	/*html body div#LeftElements, html body div#RightElements {
		display: block !important;
		width: 100% !important;
	}*/
}