.ngpluginparashopdirectdebit { margin: 20px 0; } .ngpluginparashopdirectdebit2cols { display: flex; flex-wrap: wrap; } .ngpluginparashopdirectdebit2cols>div:first-child { width: calc(50% - 10px); padding-right: 10px; } .ngpluginparashopdirectdebit2cols>div:last-child { width: calc(50% - 10px); padding-left: 10px; } #ngpluginparashopdirectdebit_info { margin: 20px 0; } .ngpluginparashopdirectdebit form>div>label.ngpluginparashopdirectdebitlabel { font: 16px 'Open Sans',Verdana,Helvetica,sans-serif; color: #435351; letter-spacing: 0px; padding: 5px 5px 0 0; float: left; width: 25%; box-sizing: border-box; display: block; } .ngpluginparashopdirectdebit form>div>label.ngpluginparashopdirectdebiterror { color: #a65856; } .ngpluginparashopdirectdebit form>div.ngpluginparashopdirectdebitcheckbox>label { width: 100%; display: block; margin: 8px 0; padding: 0; line-height: 1; } .ngpluginparashopdirectdebit form>div.ngpluginparashopdirectdebitcheckbox>label input[type=checkbox] { margin: 0 10px 0 0; vertical-align: middle; } .ngpluginparashopdirectdebit form>div.ngpluginparashopdirectdebitcheckbox>label span { vertical-align: middle; } .ngpluginparashopdirectdebit form>div { margin-bottom: 10px; } .ngpluginparashopdirectdebit form div::after { content: ""; display: table; clear: both; } .ngpluginparashopdirectdebit form input[type=text] { border-color: #ebebeb; border-width: 1px; border-style: solid; padding: 6px 12px 6px 12px; background: #ffffff; font: 16px 'Open Sans',Verdana,Helvetica,sans-serif; color: #464646; letter-spacing: 0px; border-radius: 0px; width: 75%; float: right; box-sizing: border-box; display: block; -webkit-appearance: none; appearance: none; } .ngpluginparashopdirectdebit form input[type=text]:focus, .ngpluginparashopdirectdebit form select:focus { border-color: #ebebeb; background: #ffffff; } .ngpluginparashopdirectdebit .ngpluginparashopdirectdebitexpire { width: 75%; float: right; } .ngpluginparashopdirectdebit ngpluginparashopdirectdebitexpire::after { content: ""; display: table; clear: both; } .ngpluginparashopdirectdebit form button { border-color: #089eb8; border-width: 0px; border-style: solid; padding: 10px 20px 10px 20px; background: #089eb8; font: 15px 'Open Sans',Verdana,Helvetica,sans-serif; color: #ffffff; letter-spacing: 0px; border-radius: 0px; display: block; cursor: pointer; -webkit-appearance: none; margin-top: 20px; } .ngpluginparashopdirectdebit form button:hover { border-color: #2c5752; background: #f79646; font-weight: normal; font-style: normal; text-transform: none; color: #ffffff; } .ngpluginparashopdirectdebit form button:focus { outline: none; } .ngpluginparashopdirectdebit form button:disabled { opacity: 0.8; } .ngpluginparashopdirectdebitbuttonpanel button:last-child { float: left; } .ngpluginparashopdirectdebitbuttonpanel button:first-child { float: right; } .ngpluginparashopdirectdebitbuttonpanel::after { content: ""; display: table; clear: both; } .ngpluginparashopdirectdebitforgotemail { display: none; } .ngpluginparashopdirectdebitforgotemailbutton { display: block; margin: 20px 0; } @media (max-width: 767px) { .ngpluginparashopdirectdebit form input[type=text], .ngpluginparashopdirectdebit .ngpluginparashopdirectdebitexpire select, .ngpluginparashopdirectdebit form select, .ngpluginparashopdirectdebit .ngpluginparashopdirectdebitexpire, .ngpluginparashopdirectdebit form>div>label { width: 100%; float: none; } .ngpluginparashopdirectdebit .ngpluginparashopdirectdebitexpire select:first-child { margin-bottom: 10px; } .ngpluginparashopdirectdebit form>div>label { padding: 5px 0; } .ngpluginparashopdirectdebitbuttonpanel button:first-child, .ngpluginparashopdirectdebitbuttonpanel button:last-child { float: none; width: 100%; } .ngpluginparashopdirectdebitbuttonpanel button.ngpluginparashopdirectdebithidemobile:last-child { display: none; } .ngpluginparashopdirectdebit2cols { display: block; } .ngpluginparashopdirectdebit2cols>div:first-child { width: 100%; padding-right: 0; } .ngpluginparashopdirectdebit2cols>div:last-child { width: 100%; padding-left: 0; } }