.container { padding-top:70px; } .wrapper .row { position: relative; float: left; width: 100%; } .row + .row { margin-top: 10px; } .modal_header{ background: #148dea; border: solid 1px #365FB4; } .row_header + .row { margin-top: 14px; } .form_header { background: #ffffff; text-align: center; position: absolute; top:0; left:0; width:100%; padding: 20px 12px 6px 12px; border-bottom: solid 1px #A9A9A9; } .content{ padding: 0 15px; max-width: 330px; margin: 0 auto; max-width: 100%; overflow: hidden; } .inp_caption { color: #fff; font-family: "Helvetica"; font-size: 16px; font-weight: 500; text-align: center; margin-bottom: 6px; } .input_block_wr_l { padding-left: 131px; padding-right: 6%; margin-bottom: 13px; } .inp_caption_l { position: absolute; left: 6%; text-align: left; top: 8px; } .inp_wr_l { float: right; width: 100%; } .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 { display:table; max-width:330px; margin-left:auto; margin-right:auto; position: relative; width: 100%; } .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: #FE0101; background-image: -moz-linear-gradient(bottom, #08108B 0%, #08108B 100%); background-image: -o-linear-gradient(bottom, #08108B 0%, #08108B 100%); background-image: -webkit-linear-gradient(bottom, #08108B 0%, #08108B 100%); background-image: linear-gradient(to top, #08108B 0%, #08108B 100%); border: 2px solid #F0F0F0; -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: #FFF; font-family: "Helvetica"; font-size: 19px; font-weight: 700; text-shadow: 0 -2px 1px rgba(0, 0, 2, 0.42); } .main_select { text-align: left; } .main_select.jq-selectbox { width: 100%; } .main_select .jq-selectbox__select { height: 35px; padding: 0 5px 0 5px; border: 1px solid #E8E8E8 !important; -moz-border-radius: 5px !important; -webkit-border-radius: 5px !important; border-radius: 5px !important; -moz-box-shadow: inset 0 5px 5px rgba(0, 0, 2, 0.24) !important; -webkit-box-shadow: inset 0 5px 5px rgba(0, 0, 2, 0.24) !important; box-shadow: inset 0 5px 5px rgba(0, 0, 2, 0.24) !important; border-radius: 0; background: #fff; box-shadow: none; color: #363636; text-shadow: none; font-size: 14px; font: 14px/26px 'Helvetica'; width: 100%; } .main_select .jq-selectbox__trigger { width: 30px; height: 35px !important; height: 100%; border-left: none; } .main_select .jq-selectbox__trigger-arrow { top: 16px; } .main_select .jq-selectbox__select-text { height: 35px; line-height: 37px; } .main_select .jq-selectbox__dropdown { top: 35px !important; width: 100%; -moz-box-sizing: border-box; box-sizing: border-box; margin: 0; padding: 0; border: 1px solid #CCC; border-radius: 0; background: #FFF; box-shadow: none; font: 14px/26px 'Helvetica'; } .main_select .jq-selectbox__dropdown li{ padding: 0 5px 0 !important; } @media (max-width: 320px){ .inp_caption_l { left: 0; } .input_block_wr_l { padding-left: 110px; padding-right: 0; } } @media (max-height: 436px){ .form_header { padding: 10px 5px 5px 5px; height: 40px; } .container {padding-top:40px;} .inp_caption { font-size: 13px; margin-bottom: 3px; } .row + .row { margin-top: 0; } .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; } .main_select .jq-selectbox__select { height: 20px; font-size: 13px; } .main_select .jq-selectbox__select-text{ height: 20px; line-height: 22px; } .main_select .jq-selectbox__trigger{ height: 20px !important; width: 18px; } .main_select .jq-selectbox__trigger-arrow{ top: 9px; right: 6px; } .inp_caption_l{ top: 3px; } .input_block_wr_l{ margin-bottom: 6px; } } @media (max-height: 240px) { .input_block_wr_l{ padding-left: 95px; } } @media (max-width: 200px), (max-height: 240px) { .form_header { padding: 2px; height: 18px; margin-bottom: 1px; } .container {padding-top:18px;} .form_header img{ max-height: 13px; } .content { padding: 0 3px; } .inp_caption { font-size: 10px; margin-bottom: -3px; } .row + .row{ margin-top: 0; } .main_input{ height: 12px; font-size: 10px; } .input_block_wr + .input_block_wr { margin-top: 1px; } .btn_wr{ margin-top: 1px; margin-bottom: 1px; } .logon_btn{ font-size: 7px; width: 70px; height: 16px; line-height: 10px; } .logon_btn img { top: 4px; } .input_block_wr_l{ margin-bottom: 3px; padding-left: 70px; } .main_select .jq-selectbox__select { height: 15px; font-size: 10px; } .main_select .jq-selectbox__select-text{ height: 15px; line-height: 15px; } .main_select .jq-selectbox__trigger{ height: 15px !important; width: 7px; } .main_select .jq-selectbox__trigger-arrow{ top: 6px; right: 3px; } }