battleships-1.0.0: templates/play.cassius

span.expectedAction
  font-size: 16px
  color: #FE3F44

@media all and (max-width: 1329px)
  div.boards
    width: 1000px

  div.rightBoard
    width: 480px
    float: right

  div.infoV
    visibility: collapsed
    display: none

  div.legendV
    visibility: collapsed
    display: none

  div.legendH, div.infoH
    width: 1000px

@media all and (max-width: 1629px) and (min-width: 1330px)
  div.boards
    width: 1300px

  div.rightBoard
    width: 480px
    float: left

  div.infoV
    float: right

  div.legendV
    visibility: collapsed
    display: none

  div.legendH
    width: 1300px

  div.infoH
    visibility: collapsed
    display: none

@media all and (min-width: 1630px)
  div.boards
    width: 1600px

  div.rightBoard
    width: 500px
    float: left

  div.infoV
    float: left
    width: 300px

  div.legendV
    float: right

  div.infoH
    visibility: collapsed
    display: none

  div.legendH
    visibility: collapsed
    display: none

div.boards
  margin: 0px auto

div.actionBox
  text-align: center
  padding-top: 16px

div.boards h3, div.boards h4
  text-align: center

div.leftBoard
  float: left
  width: 500px

div.infoBoxV, div.infoBoxH
  box-shadow: 0 0 5px #36BBCE
  background-color: rgba(1, 89, 101, 0.25)

div.infoBoxV
  width: 290px
  height: 600px
  position: relative

div.infoBoxH
  height: 100%
  width: 100%

div.infoH, div.legendH
  margin: 0px auto
  text-align: center

div.boardContent
  box-shadow: 0 0 5px #36BBCE
  background-color: rgba(1, 89, 101, 0.25)
  width: 480px
  height: 600px

.red
  border: 3px solid #F00
  background: #F00

.alert
  color: #F00

div.infoBoxV .watchreplay
  text-align: center
  position: absolute
  bottom: 30px
  width: 100%

div.infoBoxH .watchreplay
  margin-top: 30px