html, body {height: 100%;}
html {background: #fff url(../img/ebook-bg.jpg) no-repeat center top fixed; background-size: cover !important;}
body {font-family: Roboto, sans-serif; color: #fff; font-size: 16px; line-height: 1.6;}

.container {max-width: 990px; width: 100%; margin: 0 auto; box-sizing: border-box;}

h1 {font-size: 45px; margin-bottom: 30px; line-height: 1.3;}
.tagline {font-size: 19px; font-weight: normal; margin-top: 30px;}
.info {font-size: 11px; max-width: 350px; display: inline-block;}
form input.txt, form button {font-size: 14px; border-radius: 45px; border: none; padding: 16px 25px; box-sizing: border-box; border: 3px solid transparent;}
form input.txt {background: #fff; color: #e57028; max-width: 270px; display: inline-block; width: 100%; min-width: 270px; transition: 0.5s;}
form input.txt:focus {border-color: #2c2d2d;}
form button {background: #2c2d2d; color: #eb7d31; text-transform: uppercase; transition: 0.5s; max-width: 170px; display: inline-block; width: 100%; min-width: 170px;}
form button:hover {border-color: #fff; cursor: pointer;}
.tagseparator {display: block; height: 2px; background: #fff; max-width: 160px; width: 100%; float: right;}
.clear {clear: both;}
form {margin-top: 60px; margin-bottom: 50px;}
#book img {width: 100%; height: auto;}
.ffield {padding-right: 15px;}
.ffield,.sfield {display: inline-block;}

.table {display: table; height: 100%;}
.table-row {display: table-row;}
#book, #formbox {display: table-cell;vertical-align: middle;}
#book {width: 40%;}
#formbox {width: 60%;}

.rodoboxes {padding: 20px 0; font-size: 12px;}
.rodoboxes label {display: block; margin-bottom: 10px;}
.rodoboxes label:last-child {margin-bottom: 0;}
.rodoboxes input {margin-right: 5px;}
.rodoboxes a {color: #000; text-decoration: underline;}

.contentbox {max-width: 750px; text-align: right;}
#bookres {display: none;}
.contentbox {padding-bottom: 30px; padding-top: 30px;}

@media only screen and (max-width : 992px) {
    .container {max-width: 768px; padding-left: 20px; padding-right: 20px; width: 100%;}
    
    #book img {margin-left: -20px;}
    form .txt, form button {min-width: inherit; max-width: none; width: 100%;}
    form {margin-top: 20px;}
}

@media only screen and (max-width : 768px) {
    html {background-position: right top;}
    .container {max-width: 480px;}
    #book {width: 0 !important; }
    #formbox {width: 100% !important;}
    #bookres {display: block; margin-top: 30px; text-align: center;}
    #bookres img {max-width: 300px; width: 100%;}
}

@media only screen and (max-width : 480px) {
    .container {max-width: 320px;}
    .contentbox {text-align: center;}
    .tagseparator {width: 160px; float: none; margin: 0 auto;}
    h1 {font-size: 35px;}
    #bookres img {width: 200px; margin-left: -40px;}
    .ffield {padding: 0; margin-bottom: 10px; display: block;}
    .ffield .txt {max-width: none !important;}
    .sfield {width: 100%;}
    .sfield button {width: 100%;}
    
}

@media only screen and (max-device-width: 480px) {
    html {
      height: calc(100% + 60px);
      min-height: calc(100% + 60px);
    }
}