* { -webkit-box-sizing: border-box; box-sizing: border-box; margin:0; padding:0; } img { max-width: 100%; } div { position: relative; } /* Utility Classes */ .vertical-align { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; } .center { text-align: center; } .margin-top { margin-top: 5vh; } .no-padding { padding: 0; } .full-width { width: 100%; } /* Universal Styles */ body { font-family: 'Montserrat', sans-serif; color: rgb(90,90,90); } h1 { font-weight: normal; font-size: 2.5rem; } h2 { color: #e74c3c; font-family: 'Playfair Display', serif; font-weight: normal; font-size: 2rem; margin-top: 1rem; margin-bottom: 0.5rem; text-align:center; } h3 { font-weight: normal; font-family: 'Playfair Display', serif; } a { color: #e74c3c; padding-bottom: 2px; border-bottom: 1px solid #e74c3c; text-decoration: none; position: relative; top:0; -webkit-transition: 0.3s; transition: 0.3s; } a:hover { color: rgb(120,120,120); border-color: rgb(120,120,120); top:2px; position: relative; } p { line-height: 1.4; margin: 0.8rem 0; font-weight: 300; text-align: center; } p span { font-weight: bold; padding-right: 10px; } ul { list-style: inside; } li { margin: 0.5rem 0; font-weight: 300; } hr { border: none; border-bottom: 3px solid #e74c3c; width: 50px; margin:1rem auto 3rem; } section { padding: 8vh 10%; } section:nth-child(odd) { background-color: rgb(250,250,252); } /* Banner */ .banner { padding: 0; margin: 0; min-height:100vh; } .banner .inner { color: white; position: relative; text-align:center; padding: 2vh 5% 2vh 5%; } .bg { background-position: center; background-size: cover; padding-bottom:30%; } .banner .bg { min-height: 80vh; } .pin-bottom { position: absolute; padding: 1rem; margin: 0; bottom: 0; letter-spacing: 2px; width: 100%; left:0; right:0; } .banner h2 { margin: 0.5rem; color: white; } /* Featured */ section.featured { background-color: #e63f4f; color: white; text-align: center; } .featured a, .featured h2 { color: white; border-color: white; } .featured hr { margin: auto; border-color: white; } .banner-color { background-color:rgb(90,90,95); } /* Stats Section */ span.info { font-size: 3rem; display: block; } span.info-subtitle { text-transform: uppercase; letter-spacing: 1px; font-size: 0.8rem; } .stats-section h3 { margin-top: 1rem; } /* Gallery */ .gallery-section [class*=col] { padding: 1px; } .gallery-item { padding-bottom: 100%; background-size: cover; } .caption { background-color: rgb(240,240,240); margin: 0; padding: 0.5rem; } /* testimonials */ .testimonial { padding: 0 4% 0 4%; text-align: left; margin-top: 1rem; border-left: 1px solid rgb(200,200,200); } .testimonial p { text-align: left; } /* Brand partnerships logos */ .logo-item { padding-bottom: 60%; background-size: contain; background-repeat: no-repeat; } /* Footer */ footer { padding:1rem; } footer p { line-height: 1.5; font-weight: normal; color: rgb(120,120,125); font-size: 0.8rem; } footer a { border: none; } footer a:hover { top:0; } .subtle { color: rgb(120,120,125); font-weight: lighter; } .subtle a { color: rgb(120,120,125); font-weight: normal; } /* Responsive */ .mob-show { display:none; } /* banners */ @media(max-width:768px) { section { padding: 5vh 5%; } .banner { min-height: 0; } .logo { max-height: 15vh; } .vertical-align { display: block; } .mob-hide { display: none!important; } .mob-show { display:block; } /* stats */ .stats-section [class*='col'] { padding: 1rem; border: 1px solid rgb(245,245,245); } } /* end of media query */