/*
Puzzlin' v0.1
github.com/guenp/guenp.github.io
(c) 2020 by Guen Prawiroatmodjo. All rights reserved.
https://raw.githubusercontent.com/guenp/guenp.github.io/main/LICENSE
*/

body, html {
  height: 100%;
}

#puzzleWrapper {
  width: 90%;
  overflow: hidden; /* will contain if #first is longer than #second */
  padding: 20px 20px;
}

#puzzleControls {
  width: 100%;
}

#puzzleLeft {
  width: 25%;
  float: left; /* add this */
  min-width: 400px;
}

#puzzleText {
    /* width: 25%; */
    /* float: left; add this */
    border: 1px solid red;
    border-image: linear-gradient(to bottom right, #b827fc 0%, #2c90fc 25%, #b8fd33 50%, #fec837 75%, #fd1892 100%);
    border-image-slice: 1;
    margin: 20px;
    padding: 20px;
}

#puzzleResponse {
    padding: 0px 20px;
    margin: 20px;
    font-style: italic;
}

#puzzleForm {
  margin-block-end: 0;
}

#puzzleCredits {
  font-size: 10px;
  padding-top: 10px;
}

#puzzleImage {
    overflow: scroll;
    margin: 20px;
    height: 80%;
    min-height: 60%;
    min-width: 60%;
}

#puzzleImg {
  height: 100%;
  margin: 0px;
  display: inline-block;
  /* min-height: 100%;
  min-width: 100%; */
}