/*****NAVIGATION*****/ #top-navigation { background: #f7f7f7; border-bottom: 1px solid #e4e7ea; } .header { position: fixed; padding-top: 40px; left: 0px; top: 0px; width: 100%; color: #888; z-index: 999; height: 60px; -webkit-transition: all 400ms cubic-bezier(0.345, 0.855, 0.565, 1) 10ms; -moz-transition: all 400ms cubic-bezier(0.345, 0.855, 0.565, 1) 10ms; -o-transition: all 400ms cubic-bezier(0.345, 0.855, 0.565, 1) 10ms; transition: all 400ms cubic-bezier(0.345, 0.855, 0.565, 1) 10ms; } #main-navigation { background-color: #fff; } .scroll #main-navigation { padding: 10px; } @media (min-width: 992px){ .header.scroll { padding-bottom: 0; } } .header.scroll { padding-top: 0; background-color: #fff; } #main-menu > li > a { background: transparent; color: #0a406d; font-size: 15px; font-family: "source sans pro"; font-weight: 700; text-transform: uppercase; padding: 40px 20px; } .header.scroll #main-menu > li > a { padding: 5px 20px; -webkit-transition: all 400ms cubic-bezier(0.345, 0.855, 0.565, 1) 10ms; -moz-transition: all 400ms cubic-bezier(0.345, 0.855, 0.565, 1) 10ms; -o-transition: all 400ms cubic-bezier(0.345, 0.855, 0.565, 1) 10ms; transition: all 400ms cubic-bezier(0.345, 0.855, 0.565, 1) 10ms; } @media (min-width: 768px){ .navbar-expand-md .navbar-nav .nav-link { padding-right: 20px; padding-left: 20px; } } /*****END NAVIGATION*****/ /******CAROUSEL******/ /* Carousel base class */ .carousel { margin-bottom: 0; } /* Since positioning the image, we need to help out the caption */ .carousel-caption { font-size:3rem; z-index: 10; } /* Declare heights because of positioning of img element */ .carousel-item { height: 32rem; background-color: #777; margin-top: 100px; } .carousel-item > img { position: absolute; top: 0; left: 0; min-width: 100%; } .carousel-indicators { margin-bottom: -40px; } #home-slider { padding: 0 !important; color: white; text-shadow: #444 0 1px 1px; background:transparent; } .carousel-indicators li { width: 12px; height: 12px; display: block; -webkit-border-radius: 500px; -moz-border-radius: 500px; border-radius: 500px; background: #53aedd; cursor: pointer; text-indent: -9999px; opacity: 0.6; } .carousel-indicators li.active { background: blue; } /******END CAROUSEL******/