/*removes margins for all*/ * { margin: none; padding: none; background-color : #262626; color: #d9d9d9; font-family: monospace; font-size: 110%; } img { display: block; margin-left: auto; margin-right: auto; } h { display: block; font-size: 120%; color: #5dc833; margin-top: 2vh; } .main { display: block; /*to center we give it automargins*/ margin-left: auto; margin-right: auto; /*won't be wider than the 1.5 * screen is tall so that it doesn't mess up * the aspect ratio */ max-width: 150vh; } /*this is the banner image, we want this to cover the whole screen at first*/ .banner { display: block; /*make it cover up whole screen*/ height: 100vh; width: auto; /*center*/ margin-left : auto; margin-right: auto; /* width is 1.5height */ /* we do not want 1.5 * heigh to exceed 100vw*/ max-height:60vw; } /*cuts off any overflow*/ .bannerholder { display: block; overflow: hidden; } .exampleimage{ /*block, but still linebreaks*/ display: inline-block; width: 24%; min-width: 30vh; height: auto; } /*for centering the above*/ .img-holder{ display: block; /*centers the inline blocks*/ text-align: center; } /*child of list*/ .listchild{ font-size: 90%; }