.container { padding: 80px 120px; } .person { border: 10px solid transparent; margin-bottom: 25px; width: 80%; height: 80%; opacity: 0.7; } .person:hover { border-color: #f1f1f1; } .carousel-inner img { -webkit-filter: grayscale(90%); filter: grayscale(90%); /* make all photos black and white */ width: 100%; /* Set width to 100% */ margin: auto; } .carousel-caption h3 { color: #fff !important; } @media (max-width: 600px) { .carousel-caption { display: none; /* Hide the carousel text when the screen is less than 600 pixels wide */ } } .bg-1 { background: #2d2d30; color: #bdbdbd; } .bg-1 h3 {color: #fff;} .bg-1 p {font-style: italic;} /* Remove rounded borders from list */ .list-group-item:first-child { border-top-right-radius: 0; border-top-left-radius: 0; } .list-group-item:last-child { border-bottom-right-radius: 0; border-bottom-left-radius: 0; } /* Remove border and add padding to thumbnails */ .thumbnail { padding: 0 0 15px 0; border: none; border-radius: 0; } .thumbnail p { margin-top: 15px; color: #555; } /* Black buttons with extra padding and without rounded borders */ .btn { padding: 10px 20px; background-color: #333; color: #f1f1f1; border-radius: 0; transition: .2s; } /* On hover, the color of .btn will transition to white with black text */ .btn:hover, .btn:focus { border: 1px solid #333; background-color: #fff; color: #000; } .modal-header, h4, .close { background-color: #333; color: #fff !important; text-align: center; font-size: 30px; } .modal-header, .modal-body { padding: 40px 50px; }