﻿* {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    
    font-family: Roboto;
}

html, form{width: 100%; height: 100%; margin: 0; padding: 0; background: #fff; font-size: 12px;}
body {font-family: sans-serif; width: 100%; height: 100%; margin: 0; padding: 0;}
form.dark { background-color: #000; }
a{color: #3498db; text-decoration: none;}


.download-frame{
    left: 50%;
    position: absolute;
    top: 40%;
    transform: translate(-50%, -40%);
    z-index: 10;

    font-size: 24px;
    max-width: 500px;
    width: 100%;
}


.download-content
{       
    margin: 0 auto;
    text-align: left;            
}
.size { color: #ccc; text-align: center; padding: 0 30px 10px 30px; font-size: 14px; }
.count { text-transform: uppercase; color: #aaa; font-size: 12px; padding-left: 5px;}

.background { height: 100%; width: 100%; background-size: cover; background-color: #fff; background-repeat: no-repeat; opacity: .2;}

label.error {font-size: 14px; color: #EF4836;}

.download-cover {display: none; border-radius: 3px; margin-bottom: 30px;}
.download-content h1{font-size: 36px; margin: 0; text-align: center;}
/*.download-content h4{font-size: 24px; color: #222; margin: 0 0 20px; }*/
.download-credit {font-size: 24px; margin-bottom: 30px;  text-align: center;}
.download-credit img {max-width: 200px; max-height: 100px;}
.download-credit span {font-weight: 100; margin-right: 5px;}
.download-credit a {font-weight: 600; padding-bottom: 2px; color: #bbb;}

.download-content input{display: block; width: 100%; margin-top: 20px; font-size: 16px; padding: 8px 10px;}

.download-form{position: relative; background: #fff; color: #888; border-radius: 3px; padding: 40px 30px; margin: 20px; text-align: center; box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);}
.download-form .reference { color: #333; margin-top: 25px; font-size: 16px;}
.download-form.nobox {box-shadow: none;}
.form-heading{margin-bottom: 5px; color: #333;}
.form-message{font-size: 12px;}

.mobile-warning {position: absolute; top: 0; left: 0; bottom: 0; right: 0; z-index: 5; background: #fff; }
.mobile-warning > div {position: absolute; top: 50%; left: 0; right: 0; transform: translateY(-50%);  text-align: center; padding: 30px; }
.mobile-warning .warning {font-size: 16px; color: #ff0000;}

.standard-btn {display: inline-block; font-size: 12px; letter-spacing: 1px; background: #333; color: #fff; border-radius: 35px; padding: 15px 35px; margin-right: 20px; margin-top: 30px; min-width: 100px; text-align: center; text-transform: uppercase; outline: none; border: none; cursor: pointer;}
.standard-btn:last-of-type {margin-right: 0;}
.standard-btn:focus {color: #fff;}
.standard-btn:hover {background: #000; color: #fff; text-decoration: none;}
.standard-btn.primary-btn {/*background: #5cb85c;*/}
.standard-btn.primary-btn:hover{/*background: #26A65B;*/}
.ladda-label i { padding-right: 5px; }

.icon { margin-bottom: 20px; font-size: 36px; color: #ccc; }


@media only screen and (max-width: 600px) {
    .background { display: none; }
    .download-frame {  position: relative; left: auto; top: auto; transform: none; padding-top: 10%;  }
    .download-form {box-shadow: none; margin: 0; line-height: 24px; }
    .mobile-warning .warning { line-height: 24px;}
}