.profile #footer .cancel, .profile #footer .submit, .payment #footer .cancel, .payment #footer .submit, .shipping #footer .cancel, .shipping #footer .submit, .settings #footer .cancel, .settings #footer .submit, .login #footer .cancel, .login #footer .submit, .signup #footer .cancel, .signup #footer .submit { display: block } .login #login { display: block } #login { display: none; } .signup #signup { display: block } #signup { display: none; } .profile #profile { display: block } #profile { display: none; } .payment #payment { display: block } #payment { display: none; } .shipping #shipping { display: block } #shipping { display: none; } .settings #settings { display: block } #settings { display: none; } form { margin-top:20px; } form h2 { text-align: center; margin: 0; padding: 28px 10px 8px 10px; font-size: 14px; color: #000; letter-spacing: 1px; font-weight: bold; } input { font-family:pfd, sans-serif; font-size:14px; outline:none!important; color:#000; letter-spacing:1px; text-transform:uppercase; height:37px; text-align:center; margin: 0px auto; display:block; margin-top:4px; width: calc(100vw - 10px); border:1px solid #a9a9a9; } .half-input { margin: 0px auto; display: block; margin-top: 4px; width: calc(100vw - 10px); border: 1px solid #a9a9a9; overflow: auto; } .half-input input { position: relative; margin: 0; border:none; box-sizing: border-box; float: left; width: 50%; } .half-input > input:first-child { border-right: 1px solid #a9a9a9; } #newsletter { margin: 0px auto; display: table; margin-top: 28px; width: calc(100vw - 10px); box-sizing: border-box; padding:15px; font-size:14px; } #newsletter .caption { display:table-cell; vertical-align:middle; width:100%; } #newsletter .toggle { display:table-cell; vertical-align:middle; text-align:right } #newsletter h3 { margin:0; } #newsletter-info { margin: 0px auto; display: table; padding-top: 18px; width: calc(100vw - 10px); box-sizing: border-box; font-size:13px; letter-spacing:0.5px; text-align:center; } input#switch { max-height: 0; max-width: 0; opacity: 0; } input#switch + label { display: inline-block; position: relative; box-shadow: inset 0 0 0px 1px rgba(0,0,0,.7); text-indent: -5000px; height: 30px; width: 50px; border-radius: 15px; } input#switch + label:before { content: ""; position: absolute; display: block; height: 30px; width: 30px; top: 0; left: 0; border-radius: 15px; background: rgba(19, 191, 17, 0); -moz-transition: .25s ease-in-out; -webkit-transition: .25s ease-in-out; transition: .25s ease-in-out; } input#switch + label:after { content: ""; position: absolute; display: block; height: 30px; width: 30px; top: 0; left: 0px; border-radius: 15px; background: white; box-shadow: inset 0 0 0 1px rgba(0,0,0,.7); -moz-transition: .25s ease-in-out; -webkit-transition: .25s ease-in-out; transition: .25s ease-in-out; } input#switch:checked + label:before { width: 50px; background: #136f11; } input#switch:checked + label:after { left: 20px; box-shadow: inset 0 0 0 1px rgba(0,0,0,.7); }