.Card{width:170px;background:#c2ac37;border:5px solid #000;-webkit-box-shadow:0 0 10px rgba(0,0,0,0.5);box-shadow:0 0 10px rgba(0,0,0,0.5);-webkit-border-radius:.5em;border-radius:.5em;padding:.5em;position:relative;}.Card--antagonist .Card-container{background:#f00;-webkit-backface-visibility:hidden;-moz-backface-visibility:hidden;-ms-backface-visibility:hidden;backface-visibility:hidden;-webkit-transform:rotateY(180deg);-moz-transform:rotateY(180deg);-o-transform:rotateY(180deg);-ms-transform:rotateY(180deg);transform:rotateY(180deg)}.Card--antagonist .Card-backface{-webkit-transform:rotateY(0);-moz-transform:rotateY(0);-o-transform:rotateY(0);-ms-transform:rotateY(0);transform:rotateY(0)}.Card-backface{background-image:url("../images/logo.jpg");-webkit-background-size:100%;-moz-background-size:100%;background-size:100%;background-repeat:no-repeat;background-position:center;position:absolute;left:0;right:0;bottom:0;top:0;background-color:#d8232a;-webkit-backface-visibility:hidden;-moz-backface-visibility:hidden;-ms-backface-visibility:hidden;backface-visibility:hidden;-webkit-transform:rotateY(180deg);-moz-transform:rotateY(180deg);-o-transform:rotateY(180deg);-ms-transform:rotateY(180deg);transform:rotateY(180deg)}.Card-description{background:#fff;padding:.5em;font-size:12px;margin-bottom:.5em;border:2px solid #000}.Card-name{color:#fff;text-transform:uppercase;margin:0 0 .5em 0;font-size:1em}.Card-image{width:100%}.Card-attack{background:#000;color:#fff;font-size:.7em}.Layout{display:-webkit-box;display:-moz-box;display:-webkit-flex;display:-ms-flexbox;display:box;display:flex;padding:.5em;margin:.5em;border:1px solid #a52a2a;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;-webkit-box-orient:vertical;-moz-box-orient:vertical;-o-box-orient:vertical;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;min-height:100vh;-webkit-box-pack:justify;-moz-box-pack:justify;-o-box-pack:justify;-ms-flex-pack:justify;-webkit-justify-content:space-between;justify-content:space-between;background-image:url("../images/city.jpg");-webkit-background-size:cover;-moz-background-size:cover;background-size:cover;}.Layout > section{margin:.5em}.Layout-main{display:-webkit-box;display:-moz-box;display:-webkit-flex;display:-ms-flexbox;display:box;display:flex;-webkit-box-pack:justify;-moz-box-pack:justify;-o-box-pack:justify;-ms-flex-pack:justify;-webkit-justify-content:space-between;justify-content:space-between}.Layout-status{border:1px solid #008000;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;width:200px}.Layout-battle{border:1px solid #ffa500;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;-webkit-box-flex:1;-moz-box-flex:1;-o-box-flex:1;box-flex:1;-webkit-flex:1;-ms-flex:1;flex:1;margin:0 .5em;background-image:url("../images/pattern.jpg")}.Layout-phases{border:1px solid #800080;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;width:200px;position:relative}.Layout-antagonist{border:1px solid #7fffd4;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;display:-webkit-box;display:-moz-box;display:-webkit-flex;display:-ms-flexbox;display:box;display:flex;-webkit-box-pack:justify;-moz-box-pack:justify;-o-box-pack:justify;-ms-flex-pack:justify;-webkit-justify-content:space-between;justify-content:space-between}.Layout-player{border:1px solid #808080;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;display:-webkit-box;display:-moz-box;display:-webkit-flex;display:-ms-flexbox;display:box;display:flex;-webkit-box-pack:justify;-moz-box-pack:justify;-o-box-pack:justify;-ms-flex-pack:justify;-webkit-justify-content:space-between;justify-content:space-between}.Status{background:#ffa500;}.Status-player{background:#f00;padding:.5em;color:#fff;margin:0}.Status-points{text-align:center;padding:.5em;margin:0}.Phases{background:#fff;border:5px dashed #f00;position:absolute;right:0}.Battle{padding:.5em;}.Battle-antagonist{display:-webkit-box;display:-moz-box;display:-webkit-flex;display:-ms-flexbox;display:box;display:flex;-webkit-box-pack:justify;-moz-box-pack:justify;-o-box-pack:justify;-ms-flex-pack:justify;-webkit-justify-content:space-between;justify-content:space-between;}.Battle-antagonist > div{margin:10px}.Battle-player{display:-webkit-box;display:-moz-box;display:-webkit-flex;display:-ms-flexbox;display:box;display:flex;-webkit-box-pack:justify;-moz-box-pack:justify;-o-box-pack:justify;-ms-flex-pack:justify;-webkit-justify-content:space-between;justify-content:space-between;}.Battle-player > div{margin:10px}body{font-family:Arial;font-size:16px;margin:0}