$iconsPath: '../../../assets/common/images/icons/'; ul.image_set{ padding:0; margin:0; border:none; width:100%; border:none; list-style-type: none; display: flex; flex-wrap: wrap; } li.image_box a img{ position:relative; border:none; width: auto!important; height: 100% !important; top: 0 !important; object-fit: contain; } li.image_box a{ padding:0; text-shadow:0; margin:0; width: 100%; } li.image_box{ width: 18%; position: relative; margin: 0 2.5% 15px 0; padding: 0; display: flex; align-items: center; text-align: center; background: #ededed; &:nth-child(5n) { margin-right: 0; } .thumb_wrapper { background: #ededed; width: 100%!important; height: 160px!important; @media screen and (max-width: 767px) { height: 130px !important; } } } @media screen and (max-width: 767px) { li.image_box{ width: 32%; margin: 0 2% 15px 0; &:nth-child(5n) { margin-right: 2% ; } &:nth-child(3n) { margin-right: 0; } } } a.no.active_choice{ background-color:red; color: #fff; } a.active_choice{ background-color: #53b401; color: #fff; } .valid_choice{ position:absolute; bottom:0; right:0; width:16px; height:16px; z-index:2; } .valid_choice.agree{ background: #7ed321; border-top-left-radius: 100px; } .valid_choice.disagree{ background: #d0021b; border-top-left-radius: 100px; } .thumb_wrapper { text-align:center; } @media screen and (orientation: landscape) { .thumb_wrapper img { width: 50%; } } @media screen and (orientation: portrait) { .thumb_wrapper img { width: 100%; } } .ui-footer .ui-title, .ui-header .ui-title { font-size: 18px; } .ui-listview .ui-li-has-thumb .ui-li-thumb, .ui-listview .ui-li-has-thumb>.ui-btn>img:first-child, .ui-listview .ui-li-has-thumb>img:first-child { top: 50%; transform: translateY(-50%); } /*user status*/ .menu-bar-item { background: #000; padding: 12px; text-align: center; a { color: #fff!important; text-decoration: none!important; font-weight: normal; } }