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



/* Phone */
@media only screen and (max-width:600px) {

#Main {
	width:100%;
	padding-left:10%;
	
	}

#TitleBar img {
	width:80%;
}

.ParentIntroduction {
	width:80%;
    display:flex;
	flex-direction:row;
}

.Child1Introduction {
	width:40%;
	color:white;
}

.Child2Introduction {
	width:40%;
	color:white;
}

.flex-container {
	display:flex;
	background-color:dodgerblue;
	max-width:80%;	
}



.flex-container > div {
	background-color:#f1f1f1;
	margin:10px;
	padding:1%;
	font-size:10px;
	
	
}

.Button {
	width:100%;
}

.centered {
	position:absolute;
	top:10%;
	left:25%;
	background-color:black;
	
}

.ParentContainer {
	position: relative;
	text-align:center;
	color:white;
	font-size: 250%;	
}

.SaleContainer {
	width:80%;
	display:flex;
	flex-direction: column;
	color:white;
	text-align:left;
}

.SaleContainer img {
	width:20%;
}
}



@media (min-width: 800px) {




#Main {
	width:100%;
	padding-left:10%;
	
	}

#TitleBar img {
	width:80%;
}

.ParentIntroduction {
	width:80%;
    display:flex;
	flex-direction:row;
}

.Child1Introduction {
	width:40%;
	color:white;
}

.Child2Introduction {
	width:40%;
	color:white;
}

.flex-container {
	display:flex;
	background-color:dodgerblue;
	max-width:80%;	
}



.flex-container > div {
	background-color:#f1f1f1;
	margin:10px;
	padding:1%;
	font-size:10px;
	
	
}

.Button {
	width:100%;
}

.centered {
	position:absolute;
	top:10%;
	left:25%;
	background-color:black;
	
}

.ParentContainer {
	position: relative;
	text-align:center;
	color:white;
	font-size: 250%;	
}

.SaleContainer {
	width:80%;
	display:flex;
	flex-direction: row;
	color:white;
	text-align:left;
}

.SaleContainer img {
	width:20%;
}
}