.container { overflow: hidden; } .row { width: 100%; } .row + .row { margin-top: 10px; } .modal_03{ background: #044481; border: solid 1px #A9A9A9; } .form_header { background: #191970; text-align: center; position: absolute; top:0; left:0; padding: 12px; width:100%; border-bottom: solid 1px #A9A9A9; } .container {padding-top:91px;} .form_header:after{ content: url('../img/03/shadow.png'); display: none; position: absolute; bottom: -17px; z-index: -1; left: 50%; margin-left: -204px; max-width: 100%; } .inp_caption { color: #FFF; font-family: "Helvetica"; font-size: 19px; font-weight: 500; text-shadow: 0 1px 1px rgba(0, 0, 2, 0.34); text-align: center; margin-bottom: 10px; } .inp_wr{ text-align: center; } .main_input{ border: none; outline-style: none; background-color: #FFF; border: 1px solid #E8E8E8; -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; -moz-box-shadow: inset 0 5px 5px rgba(0, 0, 2, 0.24); -webkit-box-shadow: inset 0 5px 5px rgba(0, 0, 2, 0.24); box-shadow: inset 0 5px 5px rgba(0, 0, 2, 0.24); max-width: 330px; height: 35px; padding-left: 6px; font-size: 19px; width: 100%; } .input_block_wr { overflow: hidden; } .input_block_wr + .input_block_wr { margin-top: 15px; } .btn_wr { text-align: center; margin-top: 18px; margin-bottom: 25px; } .logon_btn { width: 140px; height: 40px; background-color: #BF0E25; background-image: -moz-linear-gradient(bottom, #0A8D00 0%, #00FF18 100%); background-image: -o-linear-gradient(bottom, #fff 0%, #fff 100%); background-image: -webkit-linear-gradient(bottom, #0A8D00 0%, #00FF18 100%); background-image: linear-gradient(to top, #fff 0%, #fff 100%); border: 0px solid #191970; -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; -moz-box-shadow: 0 5px 5px rgba(0, 0, 2, 0.16); -webkit-box-shadow: 0 5px 5px rgba(0, 0, 2, 0.16); box-shadow: 0 5px 5px rgba(0, 0, 2, 0.16); cursor: pointer; outline-style: none; color: #191970; font-family: "Helvetica"; font-size: 19px; font-weight: 700; text-shadow: 0 -px 1px rgba(0, 0, 2, 0.42); } .content{ padding: 0 15px; } @media screen and (min-height:568px) and (max-height:736px) and (min-width:320px){ .main_input {height:55px; font-size:23px;} .logon_btn {height:60px; width:180px;} .btn_wr, .input_block_wr + .input_block_wr {margin-top:25px;} } @media screen and (min-height:737px) and (min-width:320px){ .main_input {height:65px; font-size:23px; max-width:640px;} .logon_btn {height:70px; width:230px; font-size:25px;} .btn_wr, .input_block_wr + .input_block_wr {margin-top:35px;} .inp_caption {font-size:25px;} } @media screen and (min-height:960px) and (min-width:320px){ .main_input {height:75px; font-size:25px;} .logon_btn {height:75px; width:230px; font-size:29px;} .btn_wr, .input_block_wr + .input_block_wr {margin-top:40px;} .inp_caption {font-size:29px;} } @media screen and (max-height: 420px){ .form_header { padding: 5px; height: 40px; margin-bottom: 0; } .container {padding-top:40px;} .inp_caption { font-size: 13px; margin-bottom: 3px; } .row + .row { margin-top: 10px; } .form_header:after { content: none; } .main_input{ height: 20px; font-size: 13px; } .logon_btn{ height: 25px; line-height: 19px; font-size: 15px; } .input_block_wr + .input_block_wr { margin-top: 5px; } .btn_wr { margin-top: 12px; margin-bottom: 5px; } } @media screen and (max-width: 200px) and (max-height: 240px) { .form_header { padding: 2px; height: 20px; } .container {padding-top:24px;} .content { padding: 0 3px; } .inp_caption { font-size: 10px; margin-bottom: 1px; } .row + .row{ margin-top: 2px; } .main_input{ height: 15px; font-size: 11px; } .input_block_wr + .input_block_wr { margin-top: 3px; } .btn_wr{ margin-top: 4px; margin-bottom: 4px; } .logon_btn{ font-size: 10px; height: 19px; line-height: 10px; width: 70px; } }