body, html {height: 100%;}

#djt_splash {height: 100%; width: 100%; min-height: 600px; background-image: url(trump_pence_flag.jpg); background-size: cover; font-family: "HCo Whitney","HelveticaNeue-Light","Helvetica Neue Light","Helvetica Neue",Helvetica,Arial,"Nimbus Sans L",sans-serif;font-family: "HCo Hoefler Text",Georgia,"Times New Roman","DejaVu Serif",serif;}
#djt_splash * {box-sizing: content-box;} /* IE6+ compatible */
#djt_splash.fixed {position: fixed;}
#djt_splash .deviarte {float: left; height: 100%; width: 50%; min-height: 600px; overflow: auto; position: relative; background-image: url(deviarte_bg.jpg); background-size: cover;  -webkit-box-shadow: 8px 0 12px -3px rgba(0, 0, 0, 0.7); box-shadow: 8px 0 12px -3px rgba(0, 0, 0, 0.7);}
#djt_splash .deviarte .whlogo {width: 150px; margin: 40px auto;}
#djt_splash .deviarte .whlogo img {}
#djt_splash .deviarte .copy {text-align: center; width: 500px; margin: 0 auto;}
#djt_splash .deviarte .copy h1 {color: #fff; font-size: 37px; font-family: "HCo Whitney","HelveticaNeue-Light","Helvetica Neue Light","Helvetica Neue",Helvetica,Arial,"Nimbus Sans L",sans-serif;}
#djt_splash .deviarte .copy .deviarte-line {margin: 20px 0;}
#djt_splash .deviarte .copy p {color: #fff; font-size: 16px; font-family: "HCo Whitney","HelveticaNeue-Light","Helvetica Neue Light","Helvetica Neue",Helvetica,Arial,"Nimbus Sans L",sans-serif;}
#djt_splash .deviarte .signup {width: 450px; margin: 50px auto 0; max-width: 450px;}
#djt_splash .deviarte .signup label {display: none}
#djt_splash .deviarte .signup input.text {height: 20px; padding: 15px; width: 420px; border: 0; -moz-border-radius: 3px; -webkit-border-radius: 3px; border-radius: 3px;}
#djt_splash .deviarte .signup .full {margin-bottom: 15px;}
#djt_splash .deviarte .signup .full input {}
#djt_splash .deviarte .signup .half {height: 42px;}
#djt_splash .deviarte .signup .half input.text {width: 195px; float: left;}
#djt_splash .deviarte .signup .half input.submit {height: 20px; width: 185px; padding: 15px; float: right; line-height: 1; font-size: 16px; background: #cf0808; border: 0; cursor: pointer; color: #fff; text-shadow: none; -moz-border-radius: 3px; -webkit-border-radius: 3px; border-radius: 3px;}
#djt_splash .deviarte .continue {position: absolute; bottom: 10px; right: 20px; font-size: 15px; color: #fff; font-family: "HCo Whitney","HelveticaNeue-Light","Helvetica Neue Light","Helvetica Neue",Helvetica,Arial,"Nimbus Sans L",sans-serif;}

/* Trick to enable box-sizing */
@media screen and (min-width: 200px) {
    #djt_splash .deviarte * {box-sizing: border-box;} /* Browsers who support media queries support border-box */
    #djt_splash .deviarte .signup {width: auto; padding: 0 20px; margin-top: 30px}
    #djt_splash .deviarte .signup input.text {padding: 20px 15px; width: 100%;}
    #djt_splash .deviarte .signup .half input.text {width: 60%;}
    #djt_splash .deviarte .signup .half input.submit {width: 35%; padding: 13px 15px; height: auto;}
    #djt_splash .deviarte p {padding: 0 20px;}
}

/* Regular Phones */
@media screen and (max-width: 768px) and (max-height: 736px) {
    #djt_splash .deviarte .whlogo {margin-top: 20px; margin-bottom: 10px; width: 115px}
    #djt_splash .deviarte .whlogo img {width: 115px;}
    #djt_splash .deviarte .copy {width: auto;}
    #djt_splash .deviarte .copy h1 {font-size: 25px; line-height: 1.5; margin-top: 0;}
    #djt_splash .deviarte .copy .deviarte-line {display: none;}
    #djt_splash .deviarte .copy p {display: none;}
    #djt_splash .deviarte .continue {margin: 30px 10px 0 0; font-size: 12px; position: static; float: right}
}

/* Regular Phones - portrait */
@media screen and (max-width: 768px) and (orientation : portrait) {
    #djt_splash {background: none;}
    #djt_splash .deviarte {float: none; width: 100%;}
    #djt_splash .mobile-bg {height: 255px; background-image: url(trump_pence_flag_mobile.jpg); background-size: cover;}
}

/* Regular Phones - landscape */
@media screen and (max-width: 768px) and (orientation : landscape) {
    #djt_splash {background-position: -90px -55px;}
}

/* Smaller phones - portrait */
@media screen and (max-width: 568px) and (orientation : portrait)  {
    #djt_splash .mobile-bg {height: 175px;}
}

/* Smaller phones - Landscape */
@media screen and (max-width: 568px) and (orientation : landscape) {
    #djt_splash {background-position: -180px -54px;}
    #djt_splash .deviarte .copy h1 {font-size: 22px;}
}

/* Bigger Phones - portrait */
@media only screen and (min-width: 375px) and (max-height: 768px) and (orientation : portrait) {
    #djt_splash .mobile-bg {height: 255px;}
}

/* Tablets */
@media screen and (min-width: 768px) and (orientation : portrait) {
    #djt_splash .mobile-bg {height: 460px;}
    #djt_splash .deviarte .copy p {display: block;}
    #djt_splash .deviarte .copy .deviarte-line {display: block;}
}

/* iPad Pro */
@media screen and (min-device-width: 1024px) and (max-device-width: 1200px) and (orientation : portrait) {
    #djt_splash {background-position: -635px 0;}
    #djt_splash .mobile-bg {display: none;}
    #djt_splash .deviarte .signup {width: auto; padding: 0 20px;}
}

/* iPad Pro */
@media screen and (min-device-width: 1024px) and (max-device-width: 1200px) and (orientation : portrait) {
    #djt_splash {background-position: -635px 0;}
    #djt_splash .mobile-bg {display: none;}
}

/* Desktop */
@media screen and (min-width: 769px) and (orientation : portrait) {
    #djt_splash .mobile-bg {display: none;}
    #djt_splash .deviarte .copy {width: auto}
}

@media screen and (min-width: 1000px) and (orientation : portrait) {
    #djt_splash .deviarte .copy {width: 500px;}
}