.row { display: flex; justify-content: space-between; } .grid { display: flex; justify-content: space-between; align-items: stretch; } .grid > * { flex: 1; margin: 0.25rem; } nav.row { margin-bottom: 2rem; } .entry-title { margin-bottom: 0; } .entry-meta { font-size: 0.8rem; padding-bottom: 2rem; } .action-tile-list { display: flex; flex-wrap: wrap; justify-content: space-around; } .action-tile { border: 1px solid var(--primary-l1); padding: 20px; flex: 1 1 0px; margin: 6px; min-width: 20%; text-align: center; background: var(--primary-l4); border-radius: 4px; } .action-tile:hover { background: var(--primary-l3); } .danger { background-color: rgb(136, 57, 53) !important; } .drop-file { background: #a2dbff; border-style: dashed; border-width: 4px; border-color: #5391ff; } @keyframes border-pulsate { 0% { border-color: #5391ff; } 50% { border-color: rgba(0, 255, 255, 0); } 100% { border-color: #5391ff; } } .drop-file-process { border-style: dashed; border-width: 4px; border-color: #5391ff; animation: border-pulsate 2s infinite; } @keyframes border-pulsate-error { 0% { border-color: #ff3e3e; } 50% { border-color: rgba(0, 255, 255, 0); } 100% { border-color: #ff3e3e; } } .drop-file-error { border-style: solid; border-width: 4px; border-color: #ff3e3e; animation: border-pulsate-error 1s 2; }