ul.grid { list-style-type:none; margin-left:0; padding-left:0; }

.grid-3cols { grid-template-columns:repeat(3, 1fr); align-items:center; }

.icon { background-size:auto 2rem; background-position:center; background-repeat:no-repeat; }
.icon-plus { background-image:url('/img/svg/plus-circle.svg'); }

.button { display:block; padding:1rem; border:2px solid #444; color:#444; border-radius:0.5rem; transition:border .4s, color .4s; }
.button:hover { border:2px solid #444; color:#444; transition:border .4s, color .4s; }
.button-1 { border:2px solid #444; color:#444; }
.button-1:hover { border:2px solid #111; color:#111; }

.list-buttons.grid { grid-template-columns:1fr 1fr; grid-column-gap:1rem; }
.list-buttons .button { margin-bottom:1rem; }
.list-buttons .active { background-color:#e9e9e9; }

.list-boxes.grid label { position:absolute; left:0; right:0; bottom:0; top:0; }
.list-boxes li { margin-bottom:1rem; }

.list-devices li a { display:block; padding:1rem; border:1px solid #ccc; border-radius:0.5rem; }
.list-devices.grid li a { display:grid; grid-template-columns:4rem 1fr 2rem; align-items:center; }
.list-devices.grid .grid { display:grid; grid-template-columns:4rem 1fr 2rem; align-items:center; padding:1rem; border:1px solid #ccc; border-radius:0.5rem; }

.list-weekdays li { margin-bottom:1rem; }

.list-scenario-events .grid { display:grid; grid-template-columns:1fr 2rem; align-items:center; padding:1rem; border:1px solid #ccc; border-radius:0.5rem; }

.form-standard .input-handler { position:relative; }
.form-standard .input-handler label:hover { cursor:pointer; }

@media only screen and (min-width:768px) {
    .list-devices.grid { display:grid; grid-template-columns:repeat(2, 1fr); align-items:center; grid-column-gap:1rem; }
    .list-weekdays.grid { grid-template-columns:repeat(4, 1fr); grid-column-gap:0.5rem; }
}

@media only screen and (min-width:1024px) {
    .list-devices.grid { display:grid; grid-template-columns:repeat(3, 1fr); }
    .list-weekdays.grid { grid-template-columns:repeat(7, 1fr); }
}
