body { overflow-x: hidden; } p.large { font-size: 16px; } h1, h2, h3, h4, h5, h6 { font-weight: 700; } .display-5 { font-size: 3rem; font-weight: 300; line-height: 1.1; } .display-6 { font-size: 2.5rem; font-weight: 300; line-height: 1.1; } .col-md-4 img { max-width: 100%; } .img-centered { margin: 0 auto; } .bg-light-gray { background-color: #eee; } .bg-darkest-gray { background-color: #222; } .btn-xl { font-size: 1.5rem; padding: 1rem 2rem; border-radius: .5rem; } .navbar { transition: all .75s ease; } .navbar .navbar-brand img { max-height: 120px; max-width: 300px; transition: all .75s ease; } .navbar.fixed-top.scrolled .navbar-brand img { max-height: 40px; } .navbar.scroll-transparent:not(.scrolled) { background-color: transparent!important; } li.nav-item a { font-weight: 400; letter-spacing: 1px; font-size: 1.25rem; text-decoration: none; } @media (min-width: 768px) { .navbar { background-color: transparent; border: none; } .navbar .navbar-brand { font-size: 2rem; } .navbar .navbar-brand img { height: 120px; } .navbar.fixed-top.scrolled .navbar-brand img { height: 50px; } } header { text-align: center; } header .carousel-item { min-height: 18rem; } header .carousel-caption .intro-lead-in { font-style: italic; font-size: 1.25rem; line-height: 1.25rem; margin-bottom: 1.5rem; } header .carousel-caption p { font-size: 1.25rem; } header .carousel-caption .intro-heading { font-size: 2.5rem; line-height: 3rem; margin-bottom: 1.5rem; } @media (min-width: 768px) { header .carousel-item { min-height: 25rem; } header .carousel-caption .intro-lead-in { font-style: italic; font-size: 2.5rem; line-height: 2.5rem; margin-bottom: 1.5rem; } header .carousel-caption .intro-heading { font-size: 3.75rem; line-height: 3.75rem; margin-bottom: 2.25rem; } } @media (min-width: 992px) { header .carousel-caption .intro-heading { font-size: 4.5rem; } } section { padding: 5rem 0; } section h2.section-heading { font-size: 2.5rem; margin-top: 0; margin-bottom: 1rem; } section h3.section-subheading { font-size: 1.25rem; text-transform: none; font-style: italic; font-weight: 400; } footer { padding: 1.5rem 0; } ul.social-buttons { margin-bottom: 0; } ul.social-buttons li a { display: block; background-color: #222; height: 40px; width: 40px; border-radius: 100%; font-size: 1.25rem; line-height: 2.5rem; outline: none; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; transition: all 0.3s; } .btn:focus, .btn:active, .btn.active, .btn:active:focus { outline: none; } img.lightbox { cursor: pointer; } img.lightbox:hover { transform: scale(1.05); } #modal-lightbox .modal-dialog { -webkit-transform: translatey(-50%); -o-transform: translatey(-50%); transform: translatey(-50%); top: 50%; margin: 0 auto; } .card.detail { width: 100%; } img.gallery-image { cursor: pointer; } #modal-lightbox .roll { position: absolute; height: 100%; width: 25%; color: #ffffff; opacity: 0; top: 0; display: flex; align-items: center; justify-content: center; cursor: pointer; transition: all 0.3s ease; } #modal-lightbox.gallery .roll.end { display: none; } #modal-lightbox.gallery .roll:hover { opacity: .5; } #modal-lightbox .roll.roll-previous { left: 0; text-shadow: -2px 0 10px rgb(0, 0, 0); } #modal-lightbox .roll.roll-next { right: 0; text-shadow: 2px 0 10px rgb(0, 0, 0); }section .container .carousel { margin-left: -15px; margin-right: -15px; } section .carousel-item { margin-right: 0; } @media (min-width: 768px) { section .carousel[data-slides="1"] .carousel-inner .active, section .carousel[data-slides="2"] .carousel-inner .active, section .carousel[data-slides="3"] .carousel-inner .active, section .carousel[data-slides="4"] .carousel-inner .active, section .carousel[data-slides="2"] .carousel-inner .active + .carousel-item, section .carousel[data-slides="3"] .carousel-inner .active + .carousel-item, section .carousel[data-slides="4"] .carousel-inner .active + .carousel-item, section .carousel[data-slides="3"] .carousel-inner .active + .carousel-item + .carousel-item, section .carousel[data-slides="4"] .carousel-inner .active + .carousel-item + .carousel-item, section .carousel[data-slides="4"] .carousel-inner .active + .carousel-item + .carousel-item + .carousel-item { display: block; } section .carousel[data-slides="1"] .carousel-inner .carousel-item.active:not(.carousel-item-right):not(.carousel-item-left), section .carousel[data-slides="2"] .carousel-inner .carousel-item.active:not(.carousel-item-right):not(.carousel-item-left), section .carousel[data-slides="3"] .carousel-inner .carousel-item.active:not(.carousel-item-right):not(.carousel-item-left), section .carousel[data-slides="4"] .carousel-inner .carousel-item.active:not(.carousel-item-right):not(.carousel-item-left), section .carousel[data-slides="2"] .carousel-inner .carousel-item.active:not(.carousel-item-right):not(.carousel-item-left) + .carousel-item, section .carousel[data-slides="3"] .carousel-inner .carousel-item.active:not(.carousel-item-right):not(.carousel-item-left) + .carousel-item, section .carousel[data-slides="4"] .carousel-inner .carousel-item.active:not(.carousel-item-right):not(.carousel-item-left) + .carousel-item, section .carousel[data-slides="3"] .carousel-inner .carousel-item.active:not(.carousel-item-right):not(.carousel-item-left) + .carousel-item + .carousel-item, section .carousel[data-slides="4"] .carousel-inner .carousel-item.active:not(.carousel-item-right):not(.carousel-item-left) + .carousel-item + .carousel-item, section .carousel[data-slides="4"] .carousel-inner .carousel-item.active:not(.carousel-item-right):not(.carousel-item-left) + .carousel-item + .carousel-item + .carousel-item { transition: none; } section .carousel .carousel-inner .carousel-item-next, section .carousel .carousel-inner .carousel-item-prev { position: relative; transform: translate3d(0, 0, 0); } .carousel[data-slides="1"] .carousel-inner .active.carousel-item + .carousel-item { position: absolute; top: 0; right: -100%; z-index: -1; display: block; visibility: visible; } .carousel[data-slides="2"] .carousel-inner .active.carousel-item + .carousel-item + .carousel-item { position: absolute; top: 0; right: -50%; z-index: -1; display: block; visibility: visible; } .carousel[data-slides="3"] .carousel-inner .active.carousel-item + .carousel-item + .carousel-item + .carousel-item { position: absolute; top: 0; right: -33.3333%; z-index: -1; display: block; visibility: visible; } .carousel[data-slides="4"] .carousel-inner .active.carousel-item + .carousel-item + .carousel-item + .carousel-item + .carousel-item { position: absolute; top: 0; right: -25%; z-index: -1; display: block; visibility: visible; } section .active.carousel-item-left + .carousel-item-next.carousel-item-left, .carousel[data-slides="1"] .carousel-item-next.carousel-item-left + .carousel-item, .carousel[data-slides="2"] .carousel-item-next.carousel-item-left + .carousel-item, .carousel[data-slides="3"] .carousel-item-next.carousel-item-left + .carousel-item, .carousel[data-slides="4"] .carousel-item-next.carousel-item-left + .carousel-item, .carousel[data-slides="2"] .carousel-item-next.carousel-item-left + .carousel-item + .carousel-item, .carousel[data-slides="3"] .carousel-item-next.carousel-item-left + .carousel-item + .carousel-item, .carousel[data-slides="4"] .carousel-item-next.carousel-item-left + .carousel-item + .carousel-item, .carousel[data-slides="3"] .carousel-item-next.carousel-item-left + .carousel-item + .carousel-item + .carousel-item, .carousel[data-slides="4"] .carousel-item-next.carousel-item-left + .carousel-item + .carousel-item + .carousel-item, .carousel[data-slides="4"] .carousel-item-next.carousel-item-left + .carousel-item + .carousel-item + .carousel-item + .carousel-item { position: relative; transform: translate3d(-100%, 0, 0); visibility: visible; } section .carousel .carousel-inner .carousel-item-prev.carousel-item-right { position: absolute; top: 0; left: 0; z-index: -1; display: block; visibility: visible; } section .active.carousel-item-right + .carousel-item-prev.carousel-item-right, section .carousel[data-slides="1"] .carousel-item-prev.carousel-item-right + .carousel-item, section .carousel[data-slides="2"] .carousel-item-prev.carousel-item-right + .carousel-item, section .carousel[data-slides="3"] .carousel-item-prev.carousel-item-right + .carousel-item, section .carousel[data-slides="4"] .carousel-item-prev.carousel-item-right + .carousel-item, section .carousel[data-slides="2"] .carousel-item-prev.carousel-item-right + .carousel-item + .carousel-item, section .carousel[data-slides="3"] .carousel-item-prev.carousel-item-right + .carousel-item + .carousel-item, section .carousel[data-slides="4"] .carousel-item-prev.carousel-item-right + .carousel-item + .carousel-item, section .carousel[data-slides="3"] .carousel-item-prev.carousel-item-right + .carousel-item + .carousel-item + .carousel-item, section .carousel[data-slides="4"] .carousel-item-prev.carousel-item-right + .carousel-item + .carousel-item + .carousel-item, section .carousel[data-slides="4"] .carousel-item-prev.carousel-item-right + .carousel-item + .carousel-item + .carousel-item + .carousel-item { position: relative; transform: translate3d(100%, 0, 0); visibility: visible; display: block; } }.section-heading-bar { margin-bottom: 1rem; } .section-heading-bar hr { display: inline-block; width: 25%; margin: 0; } .section-heading-bar svg { margin: 0 1rem; } .widget-title { margin-bottom: 5rem; } .video-thumbnail img { position: absolute; cursor: pointer; } .video-thumbnail svg { position: relative; cursor: pointer; top: 50%; left: 50%; transition: all .5s; transform: translate(-50%, -50%); } .video-thumbnail:hover svg { transform: scale(1.25) translate(-37.5%, -37.5%); }.portfolio-item { right: 0; margin: 0 0 15px; } .portfolio-item .portfolio-link { display: block; position: relative; margin: 0 auto; } .portfolio-item .portfolio-link .caption { position: absolute; width: 100%; height: 100%; opacity: 0; background: rgba(102, 102, 102,.6); -webkit-transition: all ease .5s; -moz-transition: all ease .5s; transition: all ease .5s; } .portfolio-item .portfolio-link .caption:hover { opacity: 1; } .portfolio-item .portfolio-link .caption .caption-content { width: 100%; text-align: center; font-size: 20pt; color: #fff;position: relative; top: 50%; -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); transform: translateY(-50%); } .portfolio-item .portfolio-link .caption .caption-content h3, .portfolio-item .portfolio-link .caption .caption-content h4 { margin: 0; } @media(min-width:767px) { .portfolio-item { margin: 0 0 30px; } } @media(max-width:787px) { .portfolio-item .portfolio-link .caption { opacity: 1; } }