12345678910111213141516 |
- div.gallery{margin:5px;border:1px solid #ccc;float:left;width:180px}div.gallery:hover{border:1px solid #777}
- div.gallery img{width:100%;height:auto}div.desc{padding:15px;text-align:center}*{box-sizing:border-box}
- body{font-family:Arial,Helvetica,sans-serif;margin:0}.header{padding:80px;text-align:center;background:#1abc9c;color:antiquewhite}
- .header h1{font-size:40px}.navbar{overflow:hidden;background-color:burlywood;position:sticky;position:-webkit-sticky;top:0}
- .navbar a{float:left;display:block;color:white;text-align:center;padding:14px 20px;text-decoration:none}
- .navbar a.right{float:right}.navbar a:hover{background-color:#ddd;color:black}.navbar a.active{background-color:#666;color:white}
- .row{display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap}.side{-ms-flex:30%;flex:30%;background-color:#f1f1f1;padding:20px}
- .main{-ms-flex:70%;flex:70%;background-color:white;padding:20px;text-align:center}
- .liste{display:block;position:relative;padding-left:35px;margin-bottom:12px;cursor:pointer;font-size:22px;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}
- .checkmark{position:center;top:0;left:0;height:25px;width:25px;background-color:#eee}
- .liste:hover input ~ .checkmark{background-color:#ccc}.liste input:checked ~ .checkmark{background-color:#2196f3}
- .checkmark:after{content:"";position:absolute;display:none}
- .liste input:checked ~ .checkmark:after{display:block}.liste .checkmark:after{left:9px;top:5px;width:5px;height:10px;border:solid white;border-width:0 3px 3px 0;-webkit-transform:rotate(45deg);-ms-transform:rotate(45deg);transform:rotate(45deg)}
- .fakeimg{background-color:#aaa;width:100%;padding:20px}.footer{padding:20px;text-align:center;background:#ddd}
- @media screen and (max-width:700px){.row{flex-direction:column}}@media screen and (max-width:400px){.navbar a{float:none;width:100%}
- }
|