상품목록 페이징 수정

style24.admin/src/main/webapp/WEB-INF/views/goods/GoodsListForm.html

@@ -234,6 +234,8 @@
 					<li class="center">
 						<div class="tablePaging" id="goodsListPagination"></div>
 					</li>
+				</ul>
+				<ul class="panelBar">
 					<li class="right">
 						<button type="button" class="btn btn-info btn-sm"  onclick="fnGoodsStatArea();" th:if="${sessionInfo.roleCd == 'G001_0000' OR sessionInfo.roleCd == 'G001_A000' OR sessionInfo.roleCd == 'G001_A101' OR sessionInfo.roleCd == 'G001_A100' OR sessionInfo.roleCd == 'G001_A001'}">상태일괄적용</button>
 					</li>

style24.admin/src/main/webapp/ux/css/admin.ui.css

@@ -39,7 +39,7 @@ html,body,#wrapper,#container {min-height:100%; height:100%;}
 
 /* 로그인 --------------- */
 .loginBg {background:#f3f3f4; overflow:hidden;}
-.loginWrap  {width:500px; box-shadow:0 7px 7px -5px rgba(0, 0, 0, 0.1);}
+.loginWrap {width:500px; box-shadow:0 7px 7px -5px rgba(0, 0, 0, 0.1);}
 .loginWrap .loginBox input[type=text],
 .loginWrap .loginBox input[type=password]{padding:10px; width:100%; border:1px solid #ced4da; border-radius:.25rem;}
 .loginWrap .loginBox li:nth-of-type(2), .loginBox li:nth-of-type(3) {padding-bottom:10px;}
@@ -101,8 +101,8 @@ header a, header button {color:#fff;}
 .tooltip:hover .tooltiptext {visibility:visible;}
 
 /* LNB--------------- */
-#lnb-wrapper {position:fixed; top:60px; left:-260px; width:260px; height:100%;vertical-align:top; overflow-y:auto; transition:left .3s; -webkit-transition:left .3s;}
-#lnb-wrapper:after{content:'';position:absolute;top:0;left:0;z-index:-1;width:100%;height:100%;background-color:#2f4050;}
+#lnb-wrapper {position:fixed; top:60px; left:-260px; width:260px; height:100%; vertical-align:top; overflow-y:auto; transition:left .3s; -webkit-transition:left .3s;}
+#lnb-wrapper:after{content:''; position:absolute; top:0; left:0; z-index:-1; width:100%; height:100%; background-color:#2f4050;}
 #lnb-wrapper.on {left:0;}
 #lnb {margin-bottom:60px; width:260px;}
 #lnb a {display:block; color:#a7b1c2;}
@@ -129,7 +129,7 @@ header a, header button {color:#fff;}
 
 /* 패널영역 스타일--------------- */
 .panelStyle {position:relative; margin:0 20px 30px 20px; padding:15px 15px 0; background-color:#fff; border-top:2px solid #dfe2e3; box-shadow:0 7px 7px -5px rgba(0, 0, 0, 0.04);}
-.panelStyle::after, .frmStyle::after{position:relative;bottom:-5px;content:'';display:block;border:1px solid rgba(255,255,255,0);}
+.panelStyle::after, .frmStyle::after{position:relative; bottom:-5px; content:''; display:block; border:1px solid rgba(255,255,255,0);}
 .panelStyle .panelTitle {margin:-15px -15px 0; padding:0 20px; line-height:40px; border-bottom:1px solid #e7eaec;}
 .panelStyle .panelControl {position:absolute; top:0; right:15px; color:#c4c4c4;}
 .panelStyle .panelControl i {padding:10px 10px; cursor:pointer;}
@@ -139,17 +139,17 @@ header a, header button {color:#fff;}
 .panelStyle h3 i {padding-right:5px}
 .panelStyle h4 {padding-left:23px; height:31px; line-height:31px; background:url('../../image/icon_h4.png') no-repeat 3px 50%; color:#666;}
 .panelStyle .panelBar {display:table; width:100%; padding-bottom:10px;}
-.panelStyle .panelBar::after{display:block; clear:both; content:'';}
 .panelStyle .panelBar h4 {margin-bottom:0;}
 .panelStyle .panelBar > li {display:table-cell;}
 .panelStyle .panelBar > .center {text-align:center;}
 .panelStyle .panelBar > .right {text-align:right;}
+
 /* 패널 내부 테이블 여러개 배치 */
 .panelStyle .division + .panelBar {padding-bottom:15px;}
 .panelStyle .division {display:table; width:100%;}
 .panelStyle .division li {display:table-cell; padding-right:40px;}
 .panelStyle .division li:last-child {padding-right:0;}
-/* table, grid, button 상하 여백  */
+/* table, grid, button 상하 여백 */
 .frmStyle, .ag-theme-balham{margin-bottom:15px !important;}
 .frmStyle + .panelBar {padding-bottom:15px;}
 .ag-theme-balham {margin:10px 0 15px;}
@@ -197,31 +197,31 @@ a, button, .ui-state-active, .ui-state-focus, .ui-state-hover {outline:0 !import
 .tabsJrCont::after {display:block}
 .tabJr {display:none;}
 .tabJr .panelStyle{margin:0; border-top:1px solid #ddd; min-height:20px; padding:20px 15px 0; box-shadow:0 -5px 7px -5px rgba(0, 0, 0, 0.05);}
-.tabJr.on {display:block; }
+.tabJr.on {display:block;}
 .tabJrContArea {vertical-align:middle;}
 
 /* modal, modeless popup --------------- */
-.modalPopup{display:none;position:fixed; left:0; top:0; z-index:11; width:100%; height:100%;background:rgba(0,0,0,0.5);}
-.modalPopup > .panelStyle{position:absolute;top:50%;left:50%;z-index:11;-ms-transform:translate(-50%, -50%);transform:translate(-50%, -50%);margin:0;border:1px solid #79797a;border-radius:3px;}
-.modalPopup > .panelStyle .close {position:absolute;top:0;right:0;font-size:18px;padding:5px 15px 8px;}
+.modalPopup{display:none; position:fixed; left:0; top:0; z-index:11; width:100%; height:100%; background:rgba(0,0,0,0.5);}
+.modalPopup > .panelStyle{position:absolute; top:50%; left:50%; z-index:11; -ms-transform:translate(-50%, -50%); transform:translate(-50%, -50%); margin:0; border:1px solid #79797a; border-radius:3px;}
+.modalPopup > .panelStyle .close {position:absolute; top:0; right:0; font-size:18px; padding:5px 15px 8px;}
 .modalPopup .tabs{ margin:0;}
 .modalPopup .tabs .panelStyle{box-shadow:none}
 .modalPopup .tab > .panelStyle{overflow-y:auto;}
 
 /*MODELESS POPUP --------------- */
-.modelessPopup{display:none;position:absolute;z-index:11;top:50%;left:50%;}
+.modelessPopup{display:none; position:absolute; z-index:11; top:50%; left:50%;}
 .modelessPopup.draggable {cursor:move;}
-.modelessPopup .panelStyle{margin:0;border:1px solid #ccc;border-radius:3px;}
-.modelessPopup .panelStyle .close {position:absolute;top:0;right:0;font-size:18px;padding:5px 15px 8px;}
+.modelessPopup .panelStyle{margin:0; border:1px solid #ccc; border-radius:3px;}
+.modelessPopup .panelStyle .close {position:absolute; top:0; right:0; font-size:18px; padding:5px 15px 8px;}
 .modelessPopup .tabs{ margin:0;}
-.modelessPopup .tabs  .panelStyle{box-shadow:none}
+.modelessPopup .tabs .panelStyle{box-shadow:none}
 .modelessPopup .tab > .panelStyle{overflow-y:auto;}
 
 /*VIDEO POPUP --------------- */
-.videoPopup {display:none;position:fixed;top:50%;left:50%;z-index:11;-ms-transform:translate(-50%, -50%);transform:translate(-50%, -50%);margin:0;border:1px solid #79797a;border-radius:3px;}
-.modalPopup::before{position:fixed; left:0; top:0; z-index:11; width:100%; height:100%;background:rgba(0,0,0,0.5);}
+.videoPopup {display:none; position:fixed; top:50%; left:50%; z-index:11; -ms-transform:translate(-50%, -50%); transform:translate(-50%, -50%); margin:0; border:1px solid #79797a; border-radius:3px;}
+.modalPopup::before{position:fixed; left:0; top:0; z-index:11; width:100%; height:100%; background:rgba(0,0,0,0.5);}
 .videoPopup .close {position:absolute; top:-20px; right:-20px; z-index:1; width:40px; height:40px; line-height:20px; font-size:20px; border:1px solid #666; border-radius:50px; background-color:#fff;}
-.videoPopup iframe{width:100%;height:100%}
+.videoPopup iframe{width:100%; height:100%}
 
 
 #btnTop {display:none; position:fixed; right:0; bottom:50px; width:40px; line-height:10px; font-size:10px; background:#fff; border:1px solid #ddd; border-right:none; padding:3px 0 5px 0; box-shadow:5px 5px 5px -4px rgba(0, 0, 0, 0.07); color:#1c84c6;}
@@ -244,7 +244,7 @@ a, button, .ui-state-active, .ui-state-focus, .ui-state-hover {outline:0 !import
 .frmStyle tr:last-child th {border-bottom:1px solid #dae0fd;}
 .frmStyle tr:last-child td {border-bottom:1px solid #eee;}
 .frmStyle th {padding:0 15px; height:36px; line-height:24px; white-space:nowrap; text-align:center; background:#e9ecfb;}
-.frmStyle td {padding:0 10px 0 10px; line-height:36px; position:relative;border-top:1px solid #eee; border-right:1px solid #eee;}
+.frmStyle td {padding:0 10px 0 10px; line-height:36px; position:relative; border-top:1px solid #eee; border-right:1px solid #eee;}
 .frmBtnT {padding-bottom:10px; overflow:auto;}
 .frmBtnB {padding-top:10px; overflow:auto;}
 
@@ -327,7 +327,6 @@ td[rowspan] {border-bottom:1px solid #eee;}
 .btn + .btn {margin-left:6px;}
 .btn:first-child {margin-left:0;}
 
-
 /* 버튼 색상 */
 .btn-white {color:#555 !important; background-color:#fff !important; border:1px solid #ccc !important;}
 .btn-default {color:#555; background-color:#eee; border:1px solid #dcdcdc;}
@@ -343,6 +342,12 @@ td[rowspan] {border-bottom:1px solid #eee;}
 .btn.icn {line-height:28px; height:28px; padding:0 8px; background-color:#eee; border:1px solid #dbdbdb;}
 .btn.icn i {padding-top:6px; width:12px; vertical-align:top; font-size:14px; text-align:center;}
 
+/* 페이징 --------------- */
+.tablePaging {	position:relative; 	display:inline-block;}
+.tablePaging a {display:inline-block; float:left; margin:0 5px; width:28px; height:28px; line-height:28px; text-align:center; border:1px solid #ccc; border-radius:50px;}
+.tablePaging a.arrow {background-color:rgba(0, 0, 0, 0.03); 	border-color:#ebebeb;}
+.tablePaging .num.on {background:#8597eb; color:#fff; border-color:#8597eb;}
+
 /* 다중 Select Box */
 .mSelectWrap select {display:none;}
 .mSelectBox {display:inline-block; position:relative; top:-1px; margin:2px 0 2px 0; padding:0 7px 0 0; width:100%; height:auto !important; min-height:29px; border:1px solid #e5e6e7; vertical-align:middle;}
@@ -370,7 +375,7 @@ td[rowspan] {border-bottom:1px solid #eee;}
 .uFileLabel::after {position:absolute; top:0; right:0; bottom:0; width:30px; z-index:3; line-height:28px; content:" "; border-left:1px solid #dbdbdb; background:#eee url('../../image/icon_upload.png') no-repeat 50% 50%;}
 
 /* badge --------------- */
-.badge {float:right; margin-top:2px; padding:0 5px; min-width:9px; line-height:18px; color:#fff; font-size:12px; font-weight:600; border-radius:3px; text-align:center;text-shadow:1px 1px 1px rgba(0,0,0,0.4); letter-spacing:-0.5px;}
+.badge {float:right; margin-top:2px; padding:0 5px; min-width:9px; line-height:18px; color:#fff; font-size:12px; font-weight:600; border-radius:3px; text-align:center; text-shadow:1px 1px 1px rgba(0,0,0,0.4); letter-spacing:-0.5px;}
 .badge-warning {background-color:#ed7908;}
 .badge-primary {background-color:#1ab394;}
 .badge-danger {background-color:#ed5565;}
@@ -455,45 +460,63 @@ p.dot em {color:red;}
 
 /* COLOR DESIGN -------------------------------------*/
 /*Color :Base ---*/
-.color-base header, span.color-base {background:linear-gradient(135deg,#667eea 0,#764ba2 100%) !important;}
-.color-purple header, span.color-purple {background:#667eea !important;}
+.color-mPurple header,span.color-mPurple {background:linear-gradient(135deg,#667eea 0,#764ba2 100%) !important;}
+.color-purple header,span.color-purple {background:#667eea !important;}
 
 /*Color :Gray ---*/
-.color-mGray header, span.color-mGray {background:linear-gradient(to right,#6c757d 0%,#555 100%) !important;}
-.color-gray header, span.color-gray {background:#666 !important;}
-.color-mGray .frmStyle th, .color-mGray .tableStyle th, .color-gray .frmStyle th, .color-gray .tableStyle th {background:#eee !important; border-top:1px solid #ddd; border-bottom:1px solid #ddd;}
-.color-mGray #lnb .dep3, .color-gray #lnb .dep3 {border-color:#777 !important;}
+.color-mGray header,span.color-mGray {background:linear-gradient(to right,#6c757d 0%,#555 100%) !important;}
+.color-gray header,span.color-gray {background:#666 !important;}
+.color-mGray .frmStyle th,.color-mGray .tableStyle th,.color-gray .frmStyle th,.color-gray .tableStyle th {	background:#eee !important; 	border-top:1px solid #ddd; 	border-bottom:1px solid #ddd;}
+.color-mGray .tablePaging .num.on,.color-gray .tablePaging .num.on {	background:#888 !important; 	border-color:#888 !important;}
+.color-mGray #lnb .dep3,.color-gray #lnb .dep3 {border-color:#777 !important;}
+.color-mGray .tabsJrNav li.on a,.color-gray .tabsJrNav li.on a {color:#333;}
 
 /*Color :Blue ---*/
-.color-mBlue header, span.color-mBlue {background:linear-gradient(to right,#4481eb 0%,#04befe 100%) !important;}
-.color-blue header, span.color-blue {background:#0042a5 !important;}
-.color-mBlue .frmStyle th, .color-mBlue .tableStyle th, .color-blue .frmStyle th, .color-blue .tableStyle th {background:#d8eafc !important; border-top:1px solid #ddd; border-bottom:1px solid #ddd;}
-.color-mBlue #lnb .dep3, .color-blue #lnb .dep3 {border-color:#3e91de !important;}
+.color-mBlue header,span.color-mBlue {background:linear-gradient(to right,#4481eb 0%,#04befe 100%) !important;}
+.color-blue header,span.color-blue {background:#0042a5 !important;}
+.color-mBlue .frmStyle th,.color-mBlue .tableStyle th,.color-blue .frmStyle th,.color-blue .tableStyle th {	background:#d8eafc !important; 	border-top:1px solid #ddd; 	border-bottom:1px solid #ddd;}
+.color-mBlue .tablePaging .num.on,.color-blue .tablePaging .num.on {	background:#3e91de !important; 	border-color:#3e91de !important;}
+.color-mBlue #lnb .dep3,.color-blue #lnb .dep3 {border-color:#3e91de !important;}
+.color-mBlue .tabsJrNav li.on a,.color-blue .tabsJrNav li.on a {background:#d8eafc;}
+.color-mBlue .tabJr.on,.color-blue .tabJr.on {border-top:4px solid #d8eafc;}
+.color-mBlue .tabsJrNav li.on a,.color-blue .tabsJrNav li.on a {color:#333;}
 
 /*Color :Green ---*/
-.color-mGreen header, span.color-mGreen {background:linear-gradient(135deg,#00b09b 0,#96c93d 100%) !important;}
-.color-green header, span.color-green {background:#00b09b !important;}
-.color-mGreen .frmStyle th, .color-mGreen .tableStyle th, .color-green .frmStyle th, .color-green .tableStyle th {background:#e5f7f5 !important; border-top:1px solid #ddd; border-bottom:1px solid #ddd;}
-.color-mGreen #lnb .dep3, .color-green #lnb .dep3 {border-color:#00b09b !important;}
+.color-mGreen header,span.color-mGreen {background:linear-gradient(135deg,#00b09b 0,#96c93d 100%) !important;}
+.color-green header,span.color-green {background:#00b09b !important;}
+.color-mGreen .frmStyle th,.color-mGreen .tableStyle th,.color-green .frmStyle th,.color-green .tableStyle th {	background:#e5f7f5 !important; 	border-top:1px solid #ddd; 	border-bottom:1px solid #ddd;}
+.color-mGreen .tablePaging .num.on,.color-green .tablePaging .num.on {	background:rgba(0,176,155,0.8); 	border-color:rgba(0,176,155,0.8) !important;}
+.color-mGreen #lnb .dep3,.color-green #lnb .dep3 {border-color:#00b09b !important;}
+.color-mGreen .tabsJrNav li.on a,.color-green .tabsJrNav li.on a {background:#e5f7f5;}
+.color-mGreen .tabJr.on,.color-green .tabJr.on {border-top:4px solid #e5f7f5;}
+.color-mGreen .tabsJrNav li.on a,.color-green .tabsJrNav li.on a {color:#333;}
 
 /*Color :Pink ---*/
-.color-mPink header, span.color-mPink {background:linear-gradient(to right, rgb(242, 112, 156), rgb(255, 148, 114)) !important;}
-.color-pink header, span.color-pink {background:#feada6 !important;}
-.color-mPink .frmStyle th, .color-mPink .tableStyle th, .color-pink .frmStyle th, .color-pink .tableStyle th {background:#fff7f6 !important; border-top:1px solid #ddd; border-bottom:1px solid #ddd;}
-.color-mPink #lnb .dep3, .color-pink #lnb .dep3 {border-color:#feada6 !important;}
+.color-mPink header,span.color-mPink {background:linear-gradient(to right, rgb(242, 112, 156), rgb(255, 148, 114)) !important;}
+.color-pink header,span.color-pink {background:#feada6 !important;}
+.color-mPink .frmStyle th,.color-mPink .tableStyle th,.color-pink .frmStyle th,.color-pink .tableStyle th {background:#fff7f6 !important; border-top:1px solid #ddd; border-bottom:1px solid #ddd;}
+.color-mPink .tablePaging .num.on,.color-pink .tablePaging .num.on {background:#feada6; 	border-color:#feada6 !important;}
+.color-mPink #lnb .dep3,.color-pink #lnb .dep3 {border-color:#feada6 !important;}
+.color-mPink .tabsJrNav li.on a,.color-pink .tabsJrNav li.on a {background:#fff7f6;}
+.color-mPink .tabJr.on,.color-pink .tabJr.on {border-top:4px solid #fff7f6;}
+.color-mPink .tabsJrNav li.on a,
+.color-pink .tabsJrNav li.on a {color:#333;}
 
 /*Color : wivis ---*/
-.color-black header, span.color-black {background:#3E3E3E !important;}
-.color-black .header-logo {background:#000 !important;}
-.color-black .header-menu .menu a {background:#000 !important;}
-.color-black .header-menu .menu a.on {background:#fff !important; color:#000 !important;}
-.color-black #lnb-wrapper {background-color:#b2b2b2 !important;}
-.color-black #lnb .dep2 {background-color:#545454 !important;}
-.color-black #lnb .dep3 {border-color:#000 !important;}
-.color-black #lnb .dep3 {background:#fdfdfd !important;}
-.color-black #lnb .dep3 a {color:#111111 !important;}
-.color-black #lnb a {color:#fff !important;}
-.color-black .frmStyle th, .color-black .tableStyle th, .color-black .frmStyle th, .color-black .tableStyle th {background:#eee !important; border-top:1px solid #ddd; border-bottom:1px solid #ddd;}
+.color-wivis header, span.color-wivis{background:#3E3E3E !important;}
+.color-wivis .header-logo{background:#000 !important;}
+.color-wivis .header-menu .menu a{background:#000 !important;}
+.color-wivis .header-menu .menu a.on{background:#fff !important; color:#000 !important;}
+.color-wivis #lnb-wrapper{background-color:#b2b2b2 !important;}
+.color-wivis #lnb .dep2{background-color:#545454 !important;}
+.color-wivis #lnb .dep3{border-color:#000 !important;}
+.color-wivis #lnb .dep3{background:#fdfdfd !important;  }
+.color-wivis #lnb .dep3 a{color:#111111 !important;}
+.color-wivis #lnb a{color:#fff !important;}
+.color-wivis .frmStyle th, .color-wivis .tableStyle th, .color-wivis .frmStyle th, .color-wivis .tableStyle th{	background:#eee !important; 	border-top:1px solid #ddd; border-bottom:1px solid #ddd;}
+.color-wivis .tablePaging .num.on, .color-wivis .tablePaging .num.on{background:#888 !important; 	border-color:#888 !important;}
+.color-wivis .tabsJrNav li.on a, .color-wivis .tabsJrNav li.on a{color:#333; background:#eee !important}
+.color-wivis .tabJr.on, .color-wivis .tabJr.on { border-top: 4px solid #eee;}
 
 /* 폰트 컬러, 폰트 두께 */
 .cBlue {color:#127fdc !important;}
@@ -592,7 +615,7 @@ hr {border:0; padding-bottom:10px;}/* 기본 여백 :10px */
 .memAdd button:hover {background:#eee url('../../image/btn_sltCloseOn.png') no-repeat 50% 50%;}
 
 /*-- Date Picker --------------*/ /* 20200521 수정 */
-table.mtz-monthpicker {border:1px solid #ddd; border-top:none; }
+table.mtz-monthpicker {border:1px solid #ddd; border-top:none;}
 .mtz-monthpicker-month {padding:7px; cursor:pointer;}
 .ui-datepicker-trigger {padding:0;}
 .ui-datepicker {z-index:800 !important; text-align:center; background:#fff;}
@@ -719,7 +742,7 @@ table.mtz-monthpicker {border:1px solid #ddd; border-top:none; }
 .flexWrap.unit6 li{width: calc(16.6%);}
 .flexWrap .title{padding: 15px; font-weight: 600; border:1px solid #e7eaec; border-top:2px solid #e7eaec;}
 .flexWrap .title h5{font-size:15px; font-weight: bold;}
-.flexWrap .title span{float:right; padding:1px 8px;font-size: 10px; border-radius: 0.25em; }
+.flexWrap .title span{float:right; padding:1px 8px; font-size: 10px; border-radius: 0.25em;}
 .flexWrap .content{padding: 15px; border:1px solid #e7eaec; border-top:none;}
 .flexWrap .content em{font-size:30px; font-weight: 200;}
 .statText {margin-top:5px}
@@ -752,8 +775,8 @@ table.mtz-monthpicker {border:1px solid #ddd; border-top:none; }
 
 /* 반응형:GNB 유저명,등급,로그아웃 --------------- */
 @media ( max-width:1370px ) {
- .header-info { display:none; }
- .header-info-sm { display:inline-block; }
+ .header-info { display:none;}
+ .header-info-sm { display:inline-block;}
 }
 
 /* 반응형 : dashboard(20200522) --------------- */
@@ -764,7 +787,7 @@ table.mtz-monthpicker {border:1px solid #ddd; border-top:none; }
  .dashboard #lnb-wrapper{display:none;}
  .dashboard .header-menu{display:none;}
  .dashboard .tabs{margin-left:0; margin-right: 0;}
- .dashboard .tabs h2{position:relative;margin:10px 15px}
+ .dashboard .tabs h2{position:relative; margin:10px 15px}
  .dashboard .tabsNav li:first-child{margin-left:0}
  .dashboard .tabsNav li:last-child{margin-right:0}
  .dashboard .tabsNav li a{font-size:16px}
@@ -779,36 +802,36 @@ table.mtz-monthpicker {border:1px solid #ddd; border-top:none; }
 
 /* Fix Input Zoom on devices older than iPhone 5: */
 @media screen and (device-aspect-ratio: 2/3) {
-    select, textarea, input[type="text"], input[type="password"],
-    input[type="datetime"], input[type="datetime-local"],
-    input[type="date"], input[type="month"], input[type="time"],
-    input[type="week"], input[type="number"], input[type="email"],
-    input[type="url"]{ font-size: 16px; }
+  select, textarea, input[type="text"], input[type="password"],
+  input[type="datetime"], input[type="datetime-local"],
+  input[type="date"], input[type="month"], input[type="time"],
+  input[type="week"], input[type="number"], input[type="email"],
+  input[type="url"]{ font-size: 16px;}
 }
 
 /* Fix Input Zoom on iPhone 5, 5C, 5S, iPod Touch 5g */
 @media screen and (device-aspect-ratio: 40/71) {
-    select, textarea, input[type="text"], input[type="password"],
-    input[type="datetime"], input[type="datetime-local"],
-    input[type="date"], input[type="month"], input[type="time"],
-    input[type="week"], input[type="number"], input[type="email"],
-    input[type="url"]{ font-size: 16px; }
+  select, textarea, input[type="text"], input[type="password"],
+  input[type="datetime"], input[type="datetime-local"],
+  input[type="date"], input[type="month"], input[type="time"],
+  input[type="week"], input[type="number"], input[type="email"],
+  input[type="url"]{ font-size: 16px;}
 }
 
-/* Fix Input Zoom on iPhone 6, iPhone 6s, iPhone 7  */
+/* Fix Input Zoom on iPhone 6, iPhone 6s, iPhone 7 */
 @media screen and (device-aspect-ratio: 375/667) {
-    select, textarea, input[type="text"], input[type="password"],
-    input[type="datetime"], input[type="datetime-local"],
-    input[type="date"], input[type="month"], input[type="time"],
-    input[type="week"], input[type="number"], input[type="email"],
-    input[type="url"]{ font-size: 16px; }
+  select, textarea, input[type="text"], input[type="password"],
+  input[type="datetime"], input[type="datetime-local"],
+  input[type="date"], input[type="month"], input[type="time"],
+  input[type="week"], input[type="number"], input[type="email"],
+  input[type="url"]{ font-size: 16px;}
 }
 
-/* Fix Input Zoom on iPhone 6 Plus, iPhone 6s Plus, iPhone 7 Plus, iPhone 8, iPhone X, XS, XS Max  */
+/* Fix Input Zoom on iPhone 6 Plus, iPhone 6s Plus, iPhone 7 Plus, iPhone 8, iPhone X, XS, XS Max */
 @media screen and (device-aspect-ratio: 9/16) {
-    select, textarea, input[type="text"], input[type="password"],
-    input[type="datetime"], input[type="datetime-local"],
-    input[type="date"], input[type="month"], input[type="time"],
-    input[type="week"], input[type="number"], input[type="email"],
-    input[type="url"]{ font-size: 16px; }
+  select, textarea, input[type="text"], input[type="password"],
+  input[type="datetime"], input[type="datetime-local"],
+  input[type="date"], input[type="month"], input[type="time"],
+  input[type="week"], input[type="number"], input[type="email"],
+  input[type="url"]{ font-size: 16px;}
 }