/* readonly mode */ .hackpoint.readonly .resource-part .btn-add-part, .hackpoint.readonly .resource-part .btn-save-part, .hackpoint.readonly .resource-part .btn-delete{ display:none; } /**/ #parts{ margin:0; padding:0; } #parts li{ width:15%; min-width: 250px; display: inline-block; padding:0px; margin:5px 5px 5px 0; transition: transform 0.2s ease-in-out; } #parts li .part{ background-color: #2b2f35; border-radius: 3px; padding: 15px; color:#cecece; min-height: 250px; position: relative; } #parts li.edition .part{ opacity:0.5; } #sketch-workspace .part .part-image{ border:2px dashed #3e4750; height:200px; background: url(../img/default-part.png) center center no-repeat; text-align: center; text-transform: uppercase; font-weight: bold; color:#5e6671; margin-top:10px; } #parts li .part .btn-delete{ color:#cecece; position: absolute; bottom: 0; right: 0; opacity:0.4; transition:all 0.2s ease-in-out; } #parts li .part .btn-delete:hover{ opacity:0.9; } #parts li .part .price{ font-weight: bold; } #parts li .part .link{ color:#cecece; position: absolute; bottom: 0; left: 0; padding:5px 10px; opacity:0.4; transition:all 0.2s ease-in-out; } #parts li .part .brand{ font-size: 10px; float:right; margin-top: 5px; color:#4c7cad; } #parts li .part .link:hover{ opacity:0.9; transform: rotate(180deg); } .part-list .picture{ width: 150px; height: 150px; border-radius: 3px; }