@charset "utf-8";

*, *:before, *:after {
	box-sizing:border-box;
}
#container {
    display: flex;
    width: 960px;
    margin: 0px auto;
	
}


header {
    flex-basis: 300px;
    margin-left: px;
}
#mainbody{
    flex-basis: 660px;
    padding-left: 20px;
    padding-right: 20px;
    text-align: center;
}
#mainbody footer p {
    text-align: right;
}

#charabox {
	display: flex;
	flex-wrap: wrap; 
	justify-content: space-between;
}
.characters {
	width:200px;
	margin-bottom:30px;
}

#chara1  {
    background-color: #E8EF31;

}
#chara2 {
    background-color: #A150D7;
}
#chara3  {
    background-color: #E2090B;
}
#chara4 {
    background-color: #10AA00;
}
#chara5 {
    background-color: #A91113;
}
#chara6 {
    background-color: #4ED958;
}

a:link, a:visited {
    color: #000000;
    text-decoration: none;
}
a:hover, a:active {
    text-decoration: none;
    color: #6666FD;
}