/* general table styles */ .table-wrapper { width: 100%; margin-bottom: 100px; .filter-block{ margin-bottom: 34px; .ui-select { margin-right: 20px; top: 1px; height: 24px; width: 150px; } .search { margin: 0 60px 0 0; } .new-product { padding: 4px 14px; } } .table { th input[type="checkbox"] { margin-top: 4px; } input[type="checkbox"] { float: left; margin-top: 11px; margin-right: 23px; } .img { height: 31px; float: left; background: white; width: 31px; border: 1px solid #dfe4eb; text-align: center; cursor: pointer; margin-right: 23px; img { margin-top: 4px; } } tr.first td { border-top: 0 none; } td a { text-decoration: underline; display: inline-block; } td.description { vertical-align: middle; color: #516372; } ul.actions { margin: 5px 0 0 0; padding: 0; float: right; li { display: inline; padding: 5px 3px 0px 6px; &:last-child { padding-right: 0px; border: 0 none; } } i { cursor: pointer; opacity: 0.6; transition: opacity .1s linear; -moz-transition: opacity .1s linear; -webkit-transition: opacity .1s linear; -o-transition: opacity .1s linear; &:hover { opacity: 1; } } .delete-item-form { display: inline-block; } } } .label { position: relative; } } /* products table specific styles */ .table-wrapper.products-table a.name { position: relative; top: 6px; } /* orders table specific styles */ .table-wrapper.orders-table td { padding: 12px 8px; } /* users table specific styles */ .table-wrapper.users-table .table { td { vertical-align: middle; font-size: 13px; } img.avatar { float: left; margin-right: 14px; max-width: 45px; position: relative; top: 8px; } a.name{ color: #3389d1; display: block; font-weight: 600; font-size: 14px; margin: 15px 0 0 0; } .subtext { font-size: 12px; margin-left: 0; color: #778391; font-style: italic; margin-top: 0; } } /*Responsive*/ @media (max-width: 979px) { .pointer { top: 26.8%; } } @media (max-width: 768px) { .table-wrapper { padding: 0px 15px; .table { .img, .avatar { display: none; } input[type="checkbox"] { margin-right: 10px; } .label { display: none; } } .filter-block { .search{ width: 30%; margin: 0 10px 0 0; } .order-search { float: left; margin: 0; width: 40%; } .user-search { float: left; margin: 0; width: 55%; } .add-user { margin-top: 0; } } } } @media (max-width: 480px) { .table-wrapper .filter-block { .search { float: right; width: 48%; margin: 0; } .new-product{ float: right; margin-top: 15px; } .order-search{ float: left; width: 43%; } .add-user { margin-top: 0; } .user-search { float: left; margin: 0; width: 55%; } } }