/* * * ===================== * GENERAL * ===================== * */ .boxed { background: url("../img/boxed-pattern.png"); } .boxed #all { max-width: 1200px; margin: 0 auto; background: #fff; -webkit-box-shadow: 0 0 5px #ccc; box-shadow: 0 0 5px #ccc; } a { -webkit-transition: all 0.3s !important; transition: all 0.3s !important; display: inline-block; } button { cursor: pointer; } strong { font-weight: 700; } p.lead { margin-bottom: 40px; } .accent { color: #467fbf; } .tooltip { font-family: "Roboto", Helvetica, Arial, sans-serif; } .bs-select .dropdown-menu .dropdown-menu { min-height: 20px; display: block; } .bs-select .dropdown-menu .dropdown-menu a { padding: 6px 10px; color: #666; font-weight: 700; text-decoration: none !important; display: block; font-size: .8rem; text-transform: uppercase; letter-spacing: 0.1em; font-family: "Roboto", Helvetica, Arial, sans-serif; outline: none; } .heading-light { font-weight: 300 !important; } .text-bold { font-weight: 700; } .text-small { font-size: 0.9rem; } .text-uppercase { text-transform: uppercase; letter-spacing: 0.1em; } .no-letter-spacing { letter-spacing: 0 !important; } .bar { padding: 60px 0; } .bar.padding-big { padding: 50px 0; } .pagination { margin-top: 20px; } #pagination .pagination { margin-bottom: 40px; } .text-sm, .form-group label, #blog-listing-big .date-comments a, #blog-listing-medium .date-comments a, #blog-listing-big p.intro, #blog-listing-medium p.intro { font-size: 0.9rem; } .text-xs { font-size: 0.9rem; } .text-xs * { font-size: 0.9rem; } @media (max-width: 767px) { .text-sm-center { text-align: center !important; } } @media (max-width: 991px) { .text-md-center { text-align: center !important; } } @media (max-width: 1199px) { .text-lg-center { text-align: center !important; } } @media (max-width: 767px) { .text-center-sm { text-align: center !important; } } @media (max-width: 991px) { .text-center-md { text-align: center !important; } } @media (max-width: 1199px) { .text-center-sm, .text-center-xs { text-align: center !important; } } .bg-gray { background: #e9ecef !important; } .bg-gray-dark { background: #555 !important; } .bg-primary { background: #467fbf !important; } .color-white { color: #fff !important; } .color-white * { color: #fff !important; } .bg-white { background: #fff !important; } .bg-fixed { background-attachment: fixed !important; } .light-gray { background: #eee; } .no-mb { margin-bottom: 0 !important; } .no-mt { margin-top: 0 !important; } .no-horizontal-padding { padding-left: 0 !important; padding-right: 0 !important; } .mb-small { margin-bottom: 20px !important; } .no-padding-top { padding-top: 0 !important; } .no-padding-bottom { padding-bottom: 0 !important; } .padding-horizontal { padding-left: 30px !important; padding-right: 30px !important; } .relative-positioned { position: relative; z-index: 1; } .jumbotron { margin: 0; } .owl-carousel.equal-height .owl-stage { display: -webkit-box !important; display: -ms-flexbox !important; display: flex !important; -webkit-box-align: stretch !important; -ms-flex-align: stretch !important; align-items: stretch !important; } .background-pentagon, #heading-breadcrumbs { background: url("../img/texture-bw.png") center center repeat; border-top: 1px solid #999; border-bottom: 1px solid #999; } .heading, .panel-heading { margin-bottom: 1rem; } .heading h1, .panel-heading h1, .heading h2, .panel-heading h2, .heading h3, .panel-heading h3, .heading h4, .panel-heading h4, .heading h5, .panel-heading h5, .heading h6, .panel-heading h6 { line-height: 1.1; display: inline-block; margin-bottom: 0; padding-bottom: 10px; text-transform: uppercase; letter-spacing: 0.1em; } .heading h1:after, .panel-heading h1:after, .heading h2:after, .panel-heading h2:after, .heading h3:after, .panel-heading h3:after, .heading h4:after, .panel-heading h4:after, .heading h5:after, .panel-heading h5:after, .heading h6:after, .panel-heading h6:after { content: " "; display: block; width: 100px; height: 2px; margin-top: .6rem; background: #467fbf; } .heading.text-center h1:after, .text-center.panel-heading h1:after, .heading.text-center h2:after, .text-center.panel-heading h2:after, .heading.text-center h3:after, .text-center.panel-heading h3:after, .heading.text-center h4:after, .text-center.panel-heading h4:after, .heading.text-center h5:after, .text-center.panel-heading h5:after, .heading.text-center h6:after, .text-center.panel-heading h6:after { margin-left: auto; margin-right: auto; } .buttons a { margin: 0 3px; } .dropdown-item.active, .dropdown-item:active { background: #92b3d9; } .card { border-radius: 0; margin-bottom: 10px; } .card-header { border-radius: 0; padding: 20px; } .card-header h1, .card-header h2, .card-header h3, .card-header h4, .card-header h5, .card-header h6 { text-transform: uppercase; letter-spacing: 0.1em; font-size: 0.935rem; margin: 0 !important; } .card-header a { color: #333; } .card-body p { font-size: 0.9rem; color: #333; } .alert { border-radius: 0; } #heading-breadcrumbs { padding: 2rem 0; border-top: none !important; border-bottom: none !important; } #heading-breadcrumbs .breadcrumb { margin-bottom: 0; background: none; font-size: 0.9rem; } #heading-breadcrumbs h1 { text-transform: uppercase; letter-spacing: 0.1em; margin-bottom: 0; } #heading-breadcrumbs li { text-transform: uppercase; letter-spacing: 0.1em; } .row.no-space { margin-left: 0; margin-right: 0; } .row.no-space div[class*="col-"] { padding: 0; } .row.no-space .box-image { margin: 0; } .owl-carousel .owl-dots { margin-top: 20px; text-align: center; } .owl-carousel .owl-dots .owl-dot { display: inline-block; margin: 0 5px; } .owl-carousel .owl-dots .owl-dot.active span { background: #fff; } .owl-carousel .owl-dots .owl-dot span { display: block; width: 12px; height: 12px; border-radius: 50%; background: #aaa; } .dark-mask { /* background: rgba(0, 0, 0, 0.3); */ width: 100%; height: 100%; position: absolute; top: 0; left: 0; z-index: -1; } .dark-mask.mask-primary { /* background: rgba(70, 127, 191, 0.9); */ } .icon-outlined { width: 80px; height: 80px; line-height: 80px; text-align: center; display: inline-block; font-size: 1.4rem; border-radius: 50%; border: 2px solid #fff; margin-bottom: 20px; } .icon-outlined.icon-lg { font-size: 2rem; } .icon-outlined.icon-sm { width: 55px; height: 55px; line-height: 55px; text-align: center; font-size: 1.15rem; } .icon-outlined.icon-thin { border-width: 1px; } .icon-filled { width: 24px; height: 24px; line-height: 24px; background: #467fbf; color: #fff; text-align: center; border-radius: 50%; font-size: 0.75rem; } .ul-icons .icon-filled { display: inline-block; margin-right: 10px; } .ul-icons li { margin-bottom: 20px; color: #555; font-size: 0.9rem; } .ul-icons a { display: inline; } ul.social { margin: 15px 0; } ul.social a { width: 28px; height: 28px; line-height: 28px; background: #555; color: #fff; text-align: center; border-radius: 50%; margin: 0 2px; font-size: 0.8rem; } ul.social a:hover { -webkit-transform: scale(1.1); transform: scale(1.1); } ul.social a.facebook { background: #4561ae; } ul.social a.gplus { background: #c22026; } ul.social a.twitter { background: #34ccff; } ul.social a.email { background: #4b8046; } .showcase { color: #555; } .showcase .icon-outlined { border-color: #555; } .showcase .counter { margin-bottom: 20px; display: inline-block; margin-top: 0; } .showcase h4 { text-transform: uppercase; letter-spacing: 0.1em; font-size: 0.935rem; margin-top: 0; } .form-control { border-radius: 0; } .form-control:focus { border-color: #467fbf; -webkit-box-shadow: 0 0 0 0.2rem rgba(70, 127, 191, 0.25); box-shadow: 0 0 0 0.2rem rgba(70, 127, 191, 0.25); } .form-group label { color: #555; } .card-primary { border-radius: 0; border-color: #467fbf; } .card-primary .card-header { background: #467fbf; color: #fff; border: none; border-radius: 0; } .card-primary .card-header a { color: #fff; text-transform: uppercase; font-weight: 300; letter-spacing: 0.05em; } .card-primary .card-body { border-color: #467fbf; } .card-body li { font-size: 0.9rem; } table { font-size: 0.9rem; } /*table img {*/ /*min-width: 50px !important;*/ /*max-width: 50px !important;*/ /*height: 50px;*/ /*}*/ table input[type="number"] { max-width: 50px; } .nav-tabs { border-bottom: none; } .nav-tabs a.nav-link { border-radius: 0 !important; font-size: 0.9rem; } .tab-content { padding: 20px; border: 1px solid #ddd; font-size: 0.9rem; } .top-bar { background: #555; color: #fff; font-size: 0.9rem; padding: 10px 0; } .top-bar.top-bar-light { background: #fff; color: #555; border-bottom: 1px solid #ddd; } .top-bar.top-bar-light a.login-btn, .top-bar.top-bar-light a.signup-btn { color: #555 !important; } .top-bar.top-bar-light a.login-btn span, .top-bar.top-bar-light a.signup-btn span { display: inline-block; } .top-bar p { margin-bottom: 0; font-size: 0.75rem; } .top-bar ul { margin-bottom: 0; } .top-bar a.login-btn, .top-bar a.signup-btn { color: #eee; text-transform: uppercase; letter-spacing: 0.1em; text-decoration: none !important; font-size: 0.75rem; font-weight: 700; margin-right: 10px; } .top-bar a.login-btn i, .top-bar a.signup-btn i { margin-right: 10px; } .top-bar ul.social-custom { margin-left: 20px; } .top-bar ul.social-custom li { padding: 0; margin: 0; } .top-bar ul.social-custom a { text-decoration: none !important; font-size: 0.7rem; width: 26px; height: 26px; line-height: 26px; color: #999; text-align: center; border-radius: 50%; margin: 0; } .top-bar ul.social-custom a:hover { background: #467fbf; color: #fff; } .top-bar .contact-info { margin-right: 20px; } .top-bar .contact-info a { font-size: 0.8rem; } .modal .modal-header h4 { text-transform: uppercase; letter-spacing: 0.1em; } .modal input::-moz-placeholder { font-size: 0.85rem; } .modal input::-webkit-input-placeholder { font-size: 0.85rem; } .modal input:-ms-input-placeholder { font-size: 0.85rem; } .modal p { font-size: 0.85rem; } header.nav-holder.sticky { position: fixed; top: 0; left: 0; width: 100%; background: #fff; z-index: 999; -webkit-box-shadow: 2px 2px 3px rgba(0, 0, 0, 0.1); box-shadow: 2px 2px 3px rgba(0, 0, 0, 0.1); } #navbar { background: #467fbf; padding-top: 0; padding-bottom: 0; } #navbar .navbar-toggler { font-size: 0.9rem; padding: 10px 15px; border-color: #ddd; } #navbar ul ul a { padding-left: 0 !important; } #navbar .dropdown-menu { border-radius: 0; -webkit-box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.1); box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.1); margin-top: 0; padding-top: 0; padding-bottom: 0; } #navbar .dropdown-menu .dropdown-item { padding: 0; } #navbar .dropdown-menu h5 { text-transform: uppercase; letter-spacing: 0.1em; padding-bottom: 5px; border-bottom: 1px dotted #ccc; margin-top: .7rem; margin-bottom: .5rem; } #navbar .dropdown-menu a.nav-link { font-size: 0.75rem; letter-spacing: 0.1em; text-transform: uppercase !important; border-bottom: 1px solid #eee; padding: 15px 20px !important; } #navbar .dropdown-menu a.nav-link:hover { -webkit-transform: translateX(5px); transform: translateX(5px); color: #467fbf; } #navbar .dropdown-submenu { position: relative; } #navbar .dropdown-submenu > .dropdown-menu { top: 0; left: 100%; margin-top: -2px; font-size: 1em; } #navbar .menu-large { position: static !important; } #navbar .menu-large .megamenu { padding: 20px; width: 100%; max-width: 1140px; left: 50%; -webkit-transform: translateX(-50%); transform: translateX(-50%); margin-top: -1px; } #navbar .menu-large a.nav-link { padding: 7px !important; padding-left: 0 !important; } #navbar .navbar-nav > li.active > a { /* background: #467fbf !important; */ color: #fff !important; text-decoration: none !important; /* border-color: #36669c !important; */ border-color: #fff !important; } #navbar .navbar-nav > li > a { /*margin: 0;*/ /*padding: 1.4rem 1rem 1.6rem;*/ /*color: #fff;*/ /*font-weight: 600;*/ /*text-transform: uppercase;*/ /*letter-spacing: 0.1em;*/ /*font-size: 0.9rem;*/ /*text-decoration: none;*/ /*border-top: .3rem solid transparent;*/ /*margin: 0 1.6rem;*/ margin: 0 1.1rem; padding: 0.6rem 0 0.2rem; color: #fff; font-weight: 600; text-transform: uppercase; letter-spacing: 0.1em; font-size: 1em; text-decoration: none; border-bottom: .2rem solid transparent; } #navbar .navbar-nav > li > a:hover { /* background: rgba(70, 127, 191, 0.5); border-color: rgba(70, 127, 191, 0.8); */ /*background: rgba(255, 255, 255, 0.2);*/ border-color: rgba(255, 255, 255, 0.8); color:#fff; } #navbar .navbar-nav > li > a:focus { background: #467fbf !important; color: #fff !important; text-decoration: none !important; border-color: #36669c !important; } #navbar.nav-light .navbar-nav > li.active a.dropdown-toggle, #navbar.nav-light .navbar-nav > li.active a.dropdown-toggle:hover { background: none !important; color: #555 !important; text-decoration: underline !important; border-color: #467fbf !important; } #navbar.nav-light .navbar-nav > li > a:hover { background: none !important; border-color: #7fa6d3 !important; } #navbar.nav-light .navbar-nav > li > a:focus { background: none !important; color: #555 !important; text-decoration: underline !important; border-color: #467fbf !important; } @media (max-width: 991px) { #navbar { padding-top: 1rem; padding-bottom: 1rem; } #navbar .menu-large .megamenu { width: 100%; left: 0 !important; -webkit-transform: none !important; transform: none !important; } #navbar .navbar-collapse { max-height: 600px; overflow-y: auto; margin-top: 1rem; } #navbar .navbar-nav > li > a { padding: 0 10px; height: 45px; line-height: 45px; border-top: 0; font-size: 0.85rem; width: 100%; } #navbar .navbar-nav > li > a:hover { background: rgba(70, 127, 191, 0.5); border-color: rgba(70, 127, 191, 0.8); } #navbar .dropdown-menu { border: none; -webkit-box-shadow: none; box-shadow: none; } } .btn { text-transform: uppercase; letter-spacing: 0.1em; } .btn-template-main { background: #467fbf; border: 1px solid #467fbf !important; color: #fff !important; border-radius: 0 !important; text-decoration: none; } .btn-template-main:hover, .btn-template-main:focus { background: #3d72af; color: #fff !important; border-color: #3d72af !important; } .btn-template-white { background: #fff; color: #467fbf !important; border: 1px solid #467fbf !important; border-radius: 0 !important; text-decoration: none; } .btn-template-white:hover, .btn-template-white:focus { background: #467fbf !important; color: #fff !important; } .btn-template-outlined { background: none; border: 1px solid #467fbf !important; color: #467fbf; border-radius: 0 !important; text-decoration: none; } .btn-template-outlined:hover, .btn-template-outlined:focus { background: #467fbf; color: #fff !important; } .btn-template-outlined-white { background: none; border: 1px solid #fff !important; color: #fff; border-radius: 0 !important; text-decoration: none; } .btn-template-outlined-white:hover, .btn-template-outlined-white:focus { background: #fff; color: #467fbf !important; } .btn-template-outlined-black { background: none; border: 1px solid #333 !important; color: #333; border-radius: 0 !important; text-decoration: none; } .btn-template-outlined-black:hover, .btn-template-outlined-black:focus { background: #333 !important; color: #fff !important; } .features-buttons button { margin-bottom: 20px; } .customers { margin-bottom: 40px; } .customers .item { margin: 0 20px; } .customers .item img { -webkit-filter: grayscale(100%); filter: grayscale(100%); -webkit-transition: all 0.3s; transition: all 0.3s; } .customers .item img:hover { -webkit-filter: grayscale(0%); filter: grayscale(0%); } .testimonials .item { margin: 0 5px; height: 100%; } .testimonials .testimonial { padding: 20px; background: #fff; height: 100%; } .testimonials .text { font-size: 0.85rem; } .testimonials .text p { color: #999; } .testimonials .avatar { min-width: 60px; max-width: 60px; min-height: 60px; max-height: 60px; border-radius: 50%; overflow: hidden; margin-left: 10px; } .testimonials .bottom { width: 100%; } .testimonials .bottom .testimonial-info { text-align: right; } .testimonials .bottom h5 { text-transform: uppercase; letter-spacing: 0.1em; margin-bottom: 5px; } .testimonials .bottom p { font-size: 0.75rem; color: #999; margin-bottom: 0; } .testimonials .icon { color: #467fbf; font-size: 2rem; margin-right: 20px; } .testimonials .owl-carousel .owl-stage { display: -webkit-box !important; display: -ms-flexbox !important; display: flex !important; -webkit-box-align: stretch !important; -ms-flex-align: stretch !important; align-items: stretch !important; } .testimonials .owl-dot.active span { background: #467fbf !important; } .home-carousel { color: #fff; } .home-carousel .owl-carousel { padding-top: 60px; padding-bottom: 20px; } .home-carousel h1, .home-carousel h2 { text-transform: uppercase; letter-spacing: 0.1em; } .home-carousel li, .home-carousel p { text-transform: uppercase; letter-spacing: 0.1em; font-weight: 700; font-size: 1.1rem; margin-bottom: 10px; } .home-carousel p img { max-width: 200px; } .project .owl-dot.active span { background: #467fbf !important; } .project .owl-nav { position: absolute; top: 0; right: 0; left: auto; bottom: auto; width: 100%; padding: 20px; text-align: right; } .project .owl-nav .owl-prev, .project .owl-nav .owl-next { width: 30px; height: 30px; line-height: 30px; background: #fff; color: #467fbf; text-align: center; border-radius: 50%; display: inline-block; margin: 0 5px; -webkit-transition: all 0.3s; transition: all 0.3s; } .project .owl-nav .owl-prev:hover, .project .owl-nav .owl-next:hover { background: #467fbf; color: #fff; } @media (max-width: 767px) { .home-carousel { text-align: center !important; } .home-carousel p, .home-carousel h1, .home-carousel ul { text-align: center !important; } .home-carousel img { margin: 10px auto; } } .owl-thumbs { display: -webkit-box; display: -ms-flexbox; display: flex; } .owl-thumbs button { background: none; border: none; margin: 5px; outline: none; } .home-blog-post { margin: 15px 0; } .home-blog-post .image { position: relative; margin-bottom: 15px; } .home-blog-post .overlay { width: 100%; height: 100%; background: rgba(70, 127, 191, 0.6); position: absolute; top: 0; opacity: 0; -webkit-transition: all 0.5s; transition: all 0.5s; } .home-blog-post .overlay a { -webkit-transform: translateY(30px); transform: translateY(30px); opacity: 0; } .home-blog-post .overlay i { margin-right: 5px; } .home-blog-post .text { text-align: center; } .home-blog-post .text .intro { text-align: left; margin-bottom: 20px; color: #888; font-size: 0.9rem; } .home-blog-post h4 { margin: 10px 0; text-transform: uppercase; letter-spacing: 0.1em; } .home-blog-post .author-category { font-size: 0.75rem; color: #999; text-transform: uppercase; letter-spacing: 0.1em; } .home-blog-post .author-category a { font-weight: 500; } .home-blog-post:hover .overlay { opacity: 1; } .home-blog-post:hover .overlay a { -webkit-transform: none; transform: none; opacity: 1; } #blog-listing-big .post, #blog-listing-medium .post { margin-bottom: 60px; } #blog-listing-big .image, #blog-listing-medium .image { margin-bottom: 15px; } #blog-listing-big h2 a, #blog-listing-medium h2 a { color: #555; text-transform: uppercase; letter-spacing: 0.1em; } #blog-listing-big .author-category, #blog-listing-medium .author-category { color: #999; text-transform: uppercase; letter-spacing: 0.1em; font-weight: 300; margin-bottom: 10px; font-size: .9rem; } #blog-listing-big .author-category a, #blog-listing-medium .author-category a { font-weight: 500; margin-bottom: 0; } #blog-listing-big .date-comments, #blog-listing-medium .date-comments { margin-bottom: 0; } #blog-listing-big .date-comments a, #blog-listing-medium .date-comments a { color: #999; margin-left: 25px; } #blog-listing-big .date-comments i, #blog-listing-medium .date-comments i { margin-right: 5px; } #blog-listing-big p.intro, #blog-listing-medium p.intro { margin-top: 10px; color: #777; } .pager { padding: 20px 0; margin-top: 20px; border-top: 1px solid #e6e6e6; } .disabled a, .disabled a:hover { border-color: #999 !important; color: #999 !important; background: none !important; cursor: not-allowed; } #blog-post #post-content { margin-bottom: 20px; } #blog-post .comment { margin-bottom: 25px; } #blog-post .comment .posted { color: #999; font-size: 0.8rem; margin-bottom: 10px; } #blog-post .comment.last { margin-bottom: 0; } #blog-post .comment p { font-size: 0.9rem; } #blog-post #comments, #blog-post #comment-form { padding: 20px 0; margin-top: 20px; border-top: solid 1px #eee; } #blog-post #comments h4, #blog-post #comment-form h4 { margin-bottom: 1.5rem; } #blog-post #comment-form { margin-bottom: 20px; } #blog-post .reply i { margin-right: 5px; } .box-simple { margin-bottom: 40px; text-align: center; } .box-simple:hover .icon-outlined { -webkit-transform: scale(1.1); transform: scale(1.1); } .box-simple .icon-outlined { color: #467fbf; border: 1px solid #467fbf; -webkit-transition: all 0.3s; transition: all 0.3s; } .box-simple h3 { text-transform: uppercase; letter-spacing: 0.1em; } .box-simple p { color: #999; margin: 20px 0; font-size: 0.9rem; } .box-simple.box-white { border: dotted 1px #999; padding: 15px 20px; margin-bottom: 0; } .box-simple.box-white .icon { font-size: 2rem; margin-bottom: 1rem; } .box-simple.box-white p { color: #999; margin-bottom: 5px; } .box-simple.box-dark { border: dotted 1px #999; padding: 15px 20px; margin-bottom: 0; color: #fff; background: #555; } .box-simple.box-dark .icon { font-size: 2rem; margin-bottom: 1rem; } .box-simple.box-dark p { margin-bottom: 5px; color: #fff; } .same-height div[class*="col-"] { margin-bottom: 30px; } .same-height .box-white, .same-height.box-dark { height: 100%; } .box-image { position: relative; margin: 20px 0; } .box-image:hover .overlay { opacity: 1; } .box-image:hover h3, .box-image:hover p, .box-image:hover .buttons { opacity: 1; -webkit-transform: none; transform: none; } .box-image:hover p { -webkit-transition-delay: 0.1s; transition-delay: 0.1s; } .box-image:hover .buttons { -webkit-transition-delay: 0.2s; transition-delay: 0.2s; } .box-image .name { margin-bottom: 20px; } .box-image a { text-decoration: none !important; } .box-image h3 { font-size: 1.125rem; text-transform: uppercase; letter-spacing: 0.1em; -webkit-transition: all 0.3s; transition: all 0.3s; opacity: 0; -webkit-transform: translateY(-50px); transform: translateY(-50px); } .box-image .overlay { width: 100%; height: 100%; position: absolute; top: 0; left: 0; background: rgba(70, 127, 191, 0.6); padding: 20px; -webkit-transition: all 0.3s; transition: all 0.3s; opacity: 0; } .box-image .buttons { opacity: 0; -webkit-transition: all 0.3s; transition: all 0.3s; -webkit-transform: translateY(20px); transform: translateY(20px); } .box-image .buttons a { margin: 0 3px; } .box-image p { -webkit-transition: all 0.3s; transition: all 0.3s; opacity: 0; -webkit-transform: translateY(20px); transform: translateY(20px); } .box-image-text .content { text-align: center; } .box-image-text p { color: #777; font-size: 0.9rem; } .see-more { margin-top: 40px; } .see-more p { font-size: 1.8rem; font-weight: 100; } .box { margin: 80px 0; border-top: 1px solid #ddd; border-bottom: 1px solid #ddd; padding: 20px; } .box a.btn { margin-top: 25px; } .box .box-header { background: #f7f7f7; margin: 20px 0 20px; padding: 20px; border-top: 1px solid #eee; text-transform: uppercase; letter-spacing: 0.1em; } .box .box-footer { background: #f7f7f7; margin-top: 30px; padding: 20px; border-top: 1px solid #eee; } .box.shipping-method, .box.payment-method { margin: 0; margin-bottom: 20px; } .box.shipping-method h4, .box.payment-method h4 { text-transform: uppercase; letter-spacing: 0.1em; margin-bottom: 5px; } .box.shipping-method p, .box.payment-method p { font-size: 0.9rem; color: #555; } .box-image-text { margin: 15px 0; } .box-image-text .image { position: relative; margin-bottom: 15px; } .box-image-text .overlay { width: 100%; height: 100%; background: rgba(70, 127, 191, 0.6); position: absolute; top: 0; opacity: 0; -webkit-transition: all 0.5s; transition: all 0.5s; } .box-image-text .overlay a { -webkit-transform: translateY(30px); transform: translateY(30px); opacity: 0; } .box-image-text .overlay i { margin-right: 5px; } .box-image-text .text { text-align: center; } .box-image-text .text .intro { text-align: left; margin-bottom: 20px; color: #888; font-size: 0.9rem; } .box-image-text h4 { margin: 10px 0; text-transform: uppercase; letter-spacing: 0.1em; } .box-image-text .author-category { font-size: 0.75rem; color: #999; text-transform: uppercase; letter-spacing: 0.1em; } .box-image-text .author-category a { font-weight: 500; } .box-image-text:hover .overlay { opacity: 1; } .box-image-text:hover .overlay a { -webkit-transform: none; transform: none; opacity: 1; } .box-footer a { margin: 0 !important; } .box-footer .right-col i { margin-left: 5px; } .box-footer .left-col i { margin-right: 5px; } @media (max-width: 767px) { .box-footer { -webkit-box-pack: center !important; -ms-flex-pack: center !important; justify-content: center !important; } .box-footer a { margin-bottom: 10px !important; } } .jumbotron h1, .jumbotron h2 { letter-spacing: 0.1em; } .jumbotron p { letter-spacing: 0.1em; font-size: 1.3rem; } .package { text-align: center; border: 1px solid #467fbf; margin-top: 25px; margin-bottom: 20px; padding-bottom: 15px; overflow: hidden; } .package .package-header { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; height: 55px; } .package .package-header h5 { margin: 0; text-transform: uppercase; letter-spacing: 0.1em; display: inline-block; color: #555; } .package .package-header .meta-text { font-size: 0.8rem; } .package h4 { margin-top: 1rem; margin-bottom: 0; color: #333; } .package .price-container { margin-bottom: 20px; } .package .price-container span.period { color: #777; font-size: 0.9rem; margin-left: 10px; } .package ul { padding: 0 30px; } .package ul li { padding: 10px; border-bottom: 1px solid #eee; color: #555; font-size: 0.9rem; } .package ul i { margin-right: 10px; } .best-value .package { margin-top: 0; padding-bottom: 40px; border: 1px solid #467fbf; } .best-value .package .package-header { height: 85px; } .best-value .package .package-header h5 { color: #fff; } .team-member { margin-bottom: 40px; } .team-member .image { margin-bottom: 1rem; } .team-member a { color: #333; } .team-member a:hover { color: #333; } .team-member h3 { font-size: 1.125rem; text-transform: uppercase; letter-spacing: 0.1em; margin-bottom: 5px; } .team-member p.role { font-size: 0.8rem; text-transform: uppercase; color: #999; margin-bottom: 0; } .team-member p { color: #999; font-size: 0.8rem; } .team-member-detail p:not(.lead) { color: #555; font-size: 0.9rem; } .portfolio p { color: #fff; } .portfolio-project p { font-size: 0.9rem; color: #888; } .portfolio-project .project-more p { padding: 5px 0; font-size: 0.85rem; } .portfolio-project .project-more h4 { margin-bottom: 5px; text-transform: uppercase; letter-spacing: 0.1em; font-size: 0.88rem; color: #555; } .portfolio-showcase { margin-bottom: 60px; } .portfolio-showcase h3 { text-transform: uppercase; -webkit-transition-property: 0.1rem; transition-property: 0.1rem; } .portfolio-showcase .buttons { margin-top: 40px; } .portfolio-showcase p:not(.lead) { color: #999; font-size: 0.9rem; } .portfolio-showcase p.lead { color: #666; } .product { text-align: center; position: relative; margin-bottom: 40px; } .product .image { overflow: hidden; max-height: 190px; } .product .image a { margin: 0; } .product .text { padding: 10px; border-bottom: 1px solid #ddd; } .product .text h3 { min-height: 63px; } .product .price { font-size: 1.1rem; } .product .price del { color: #999; display: inline-block; margin-right: 5px; } .product img { -webkit-transition: all 0.3s; transition: all 0.3s; } .product:hover img { -webkit-transform: scale(1.1); transform: scale(1.1); } .product:hover .text { border-color: #555; } .product a { text-transform: uppercase; letter-spacing: 0.1em; color: #333; text-decoration: none !important; margin-top: 15px; } .products-big .image { min-height: 250px; max-height: 250px; } .goToDescription { text-align: center; font-size: 0.8rem; margin-bottom: 40px; } .goToDescription a { color: #999; text-decoration: underline; } table tr td { vertical-align: middle !important; } #customer-orders a.btn { margin-top: 0; } #customer-orders table { font-size: 0.9rem; } #customer-orders th { border-top: 0; } #customer-order img { width: 50px; } #customer-order tfoot th { font-size: 1.2rem; font-weight: 300; } #customer-order p { font-size: 1.2rem; font-weight: 300; } #productMain #thumbs { margin-top: 30px; } #productMain input { display: none; } #productMain .sizes { text-align: center; } #productMain .sizes a { text-decoration: none !important; } #productMain .sizes a:hover { background: #467fbf; color: #fff; } #productMain .price { text-align: center; font-size: 2.5rem; margin: 30px 0; color: #555; } #basket thead th { border-top: none; } #basket tfoot th { font-size: 1.25rem; color: #555; } #order-summary tr td { color: #999; } #order-summary tr.total { font-size: 1.25rem; color: #555; font-weight: 700; } #order-summary tr.total td { color: #555; } #checkout .nav-pills { margin-bottom: 30px; border-bottom: 1px solid #467fbf; } #checkout .nav-pills a { font-size: 0.9rem; border-bottom: none !important; } #checkout .nav-pills a.disabled { cursor: not-allowed; } #checkout form label { margin-bottom: 5px; } #checkout .payment-method:hover, #checkout .shipping-method:hover { cursor: pointer; } @media (max-width: 767px) { .nav-pills { -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; } } .sidebar-menu .badge { font-weight: 700; margin: 0; } .sidebar-menu.with-icons a.nav-link { position: relative; } .sidebar-menu.with-icons a.nav-link::before { content: '\f105'; display: inline-block; position: absolute; top: 50%; right: 15px; -webkit-transform: translateY(-50%); transform: translateY(-50%); font-family: 'FontAwesome'; } .panel-heading { margin-bottom: 10px; } .panel-heading h3 { margin-top: 5px; } .panel-heading .btn { color: #fff; text-decoration: none !important; } .panel-heading .btn i { margin-right: 7px; } .panel-body p { font-size: .9rem; color: #555; } .panel-body label { font-size: 0.8rem; font-weight: 400 !important; color: #777; opacity: 0.9; display: inline-block; cursor: pointer; } .panel-body label input { margin-right: 5px; } .panel-body label:hover { opacity: 1; } .panel-body span.colour { display: inline-block; width: 14px; height: 14px; margin-top: 10px; margin-left: 5px; border: 1px solid #555; } .panel-body span.colour.white { background: #fff; } .panel-body span.colour.blue { background: #007bff; } .panel-body span.colour.green { background: #28a745; } .panel-body span.colour.red { background: #dc3545; } .panel-body span.colour.yellow { background: #ffc107; } .nav-pills .nav-link { border-radius: 0; } .nav-pills .nav-link:hover { background: #eee; } .nav-pills .nav-link.active { background: #467fbf; } .panel { margin-bottom: 20px; } .category-menu a.nav-link { text-transform: uppercase; letter-spacing: 0.1em; font-weight: 700; } ul ul a.nav-link { padding-left: 30px !important; font-size: 0.85rem; text-transform: none !important; font-weight: 400 !important; color: #777; } .tag-cloud a { font-size: 0.8rem; border: 1px solid #eee; text-transform: uppercase; letter-spacing: 0.1em; font-weight: 600; padding: 5px 10px; text-transform: uppercase; margin: 3px 0; text-decoration: none !important; } .tag-cloud a:hover { border-color: #467fbf; } .tag-cloud i { margin-right: 5px; } .ribbon { width: 80px; height: 32px; line-height: 32px; background: #467fbf; color: #fff; text-transform: uppercase; letter-spacing: 0.1em; font-weight: 700; font-size: 0.9rem; margin-bottom: 20px; position: absolute; top: 30px; left: -15px; text-align: center; } .ribbon.sale { background: #467fbf; } .ribbon.new { background: #5bc0de; } .ribbon.new::after { content: ''; border-top: 15px solid #1f7e9a; } .ribbon.sold { background: #f0ad4e; } .ribbon.sold::after { content: ''; border-top: 15px solid #b06d0f; } .ribbon.gift { background: #5cb85c; } .ribbon.gift::after { content: ''; border-top: 15px solid #2d672d; } .ribbon:nth-of-type(2) { top: 82px; } .ribbon::after { content: ''; border-top: 15px solid #2b527e; border-left: 15px solid transparent; border-right: 0 solid transparent; position: absolute; bottom: -15px; left: 0; display: block; } .badge { font-weight: 400; text-transform: uppercase; letter-spacing: 0.1em; padding: 3px 5px; } #map { border-top: 1px solid #467fbf; border-bottom: 1px solid #467fbf; height: 300px; } .get-it { background: #467fbf; color: #fff; padding: 50px 0; } .get-it h3 { text-transform: uppercase; letter-spacing: 0.1em; margin: 0; } footer.main-footer { padding: 60px 0; /*padding-bottom: 0;*/ background: #555; color: #fff; } footer.main-footer a { color: inherit; color: #eee; } footer.main-footer h4 { color: #eee; margin: 10px 0; text-transform: uppercase; letter-spacing: 0.1em; } footer.main-footer p { font-size: 0.9rem; color: #aaa; } footer.main-footer hr { border: none; border-top: 1px solid #ddd; background: none; } footer.main-footer .footer-blog-list li { margin-bottom: 20px; } footer.main-footer .image { width: 40px; height: 40px; margin-right: 10px; -ms-flex-negative: 0; flex-shrink: 0; } footer.main-footer .text { text-transform: uppercase; letter-spacing: 0.1em; } footer.main-footer .text a { font-size: 0.8rem; } footer.main-footer .photo-stream li { margin: 0; } footer.main-footer .photo-stream a { width: 120px; height: 120px; padding: 5px; display: block; } footer.main-footer .copyrights { padding: 50px 0; background: #333; color: #ccc; margin-top: 50px; } footer.main-footer .copyrights a { color: #467fbf; } footer.main-footer .copyrights p { color: inherit; font-size: 0.8rem; margin-bottom: 0; } @media (max-width: 991px) { footer.main-footer .photo-stream a { width: 120px; height: 120px; } } @media (max-width: 767px) { footer.main-footer .photo-stream li { width: 32%; margin-bottom: 10px; } footer.main-footer .photo-stream a { width: 100%; height: auto; } } /* ===================== STYLE SWITCHER FOR DEMO ===================== */ #style-switch-button { position: fixed; top: 120px; left: 0px; border-radius: 0; z-index: 2; } #style-switch { width: 300px; padding: 20px; position: fixed; top: 160px; left: 0; background: #fff; border: solid 1px #ced4da; z-index: 2000; } #style-switch h4 { color: #495057; } /* * 1. NAVBAR */ .navbar { padding: 0.5rem 1rem; } .navbar-brand { display: inline-block; padding-top: 0.3125rem; padding-bottom: 0.3125rem; margin-right: 1rem; font-size: 1.25rem; } .navbar-toggler { padding: 0.25rem 0.75rem; font-size: 1.25rem; line-height: 1; border: 1px solid transparent; border-radius: 0; } .navbar-light .navbar-brand { color: rgba(0, 0, 0, 0.9); } .navbar-light .navbar-brand:focus, .navbar-light .navbar-brand:hover { color: rgba(0, 0, 0, 0.9); } .navbar-light .navbar-nav .nav-link { color: rgba(0, 0, 0, 0.5); } .navbar-light .navbar-nav .nav-link:focus, .navbar-light .navbar-nav .nav-link:hover { color: rgba(0, 0, 0, 0.7); } .navbar-light .navbar-nav .nav-link.disabled { color: rgba(0, 0, 0, 0.3); } .navbar-light .navbar-nav .show > .nav-link, .navbar-light .navbar-nav .active > .nav-link, .navbar-light .navbar-nav .nav-link.show, .navbar-light .navbar-nav .nav-link.active { color: rgba(0, 0, 0, 0.9); } .navbar-light .navbar-toggler { color: rgba(0, 0, 0, 0.5); border-color: rgba(0, 0, 0, 0.1); } .navbar-light .navbar-toggler-icon { background-image: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 30 30' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='rgba(0, 0, 0, 0.5)' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 7h22M4 15h22M4 23h22'/%3E%3C/svg%3E"); } .navbar-light .navbar-text { color: rgba(0, 0, 0, 0.5); } .navbar-dark .navbar-brand { color: #fff; } .navbar-dark .navbar-brand:focus, .navbar-dark .navbar-brand:hover { color: #fff; } .navbar-dark .navbar-nav .nav-link { color: rgba(255, 255, 255, 0.5); } .navbar-dark .navbar-nav .nav-link:focus, .navbar-dark .navbar-nav .nav-link:hover { color: rgba(255, 255, 255, 0.75); } .navbar-dark .navbar-nav .nav-link.disabled { color: rgba(255, 255, 255, 0.25); } .navbar-dark .navbar-nav .show > .nav-link, .navbar-dark .navbar-nav .active > .nav-link, .navbar-dark .navbar-nav .nav-link.show, .navbar-dark .navbar-nav .nav-link.active { color: #fff; } .navbar-dark .navbar-toggler { color: rgba(255, 255, 255, 0.5); border-color: rgba(255, 255, 255, 0.1); } .navbar-dark .navbar-toggler-icon { background-image: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 30 30' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='rgba(255, 255, 255, 0.5)' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 7h22M4 15h22M4 23h22'/%3E%3C/svg%3E"); } .navbar-dark .navbar-text { color: rgba(255, 255, 255, 0.5); } /* * 2. BUTTONS */ .btn { font-weight: 700; border: 1px solid transparent; padding: 0.5rem 0.75rem; font-size: 0.8rem; line-height: 1.5; border-radius: 0; -webkit-transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, -webkit-box-shadow 0.15s ease-in-out; transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, -webkit-box-shadow 0.15s ease-in-out; transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out; transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out, -webkit-box-shadow 0.15s ease-in-out; } .btn:focus, .btn.focus { outline: 0; -webkit-box-shadow: 0 0 0 0.2rem rgba(70, 127, 191, 0.25); box-shadow: 0 0 0 0.2rem rgba(70, 127, 191, 0.25); } .btn.disabled, .btn:disabled { opacity: .65; } .btn:not([disabled]):not(.disabled):active, .btn:not([disabled]):not(.disabled).active { background-image: none; } .btn-primary { color: color-yiq(#467fbf); background-color: #467fbf; border-color: #467fbf; } .btn-primary:hover { color: color-yiq(#396ca5); background-color: #36669c; border-color: #36669c; } .btn-primary:focus, .btn-primary.focus { -webkit-box-shadow: 0 0 0 0.2rem rgba(70, 127, 191, 0.5); box-shadow: 0 0 0 0.2rem rgba(70, 127, 191, 0.5); } .btn-primary.disabled, .btn-primary:disabled { color: color-yiq(#467fbf); background-color: #467fbf; border-color: #467fbf; } .btn-primary:not(:disabled):not(.disabled):active, .btn-primary:not(:disabled):not(.disabled).active, .show > .btn-primary.dropdown-toggle { color: color-yiq(#36669c); background-color: #36669c; border-color: #336093; } .btn-primary:not(:disabled):not(.disabled):active:focus, .btn-primary:not(:disabled):not(.disabled).active:focus, .show > .btn-primary.dropdown-toggle:focus { -webkit-box-shadow: 0 0 0 0.2rem rgba(70, 127, 191, 0.5); box-shadow: 0 0 0 0.2rem rgba(70, 127, 191, 0.5); } .btn-secondary { color: color-yiq(#868e96); background-color: #868e96; border-color: #868e96; } .btn-secondary:hover { color: color-yiq(#727b84); background-color: #6c757d; border-color: #6c757d; } .btn-secondary:focus, .btn-secondary.focus { -webkit-box-shadow: 0 0 0 0.2rem rgba(134, 142, 150, 0.5); box-shadow: 0 0 0 0.2rem rgba(134, 142, 150, 0.5); } .btn-secondary.disabled, .btn-secondary:disabled { color: color-yiq(#868e96); background-color: #868e96; border-color: #868e96; } .btn-secondary:not(:disabled):not(.disabled):active, .btn-secondary:not(:disabled):not(.disabled).active, .show > .btn-secondary.dropdown-toggle { color: color-yiq(#6c757d); background-color: #6c757d; border-color: #666e76; } .btn-secondary:not(:disabled):not(.disabled):active:focus, .btn-secondary:not(:disabled):not(.disabled).active:focus, .show > .btn-secondary.dropdown-toggle:focus { -webkit-box-shadow: 0 0 0 0.2rem rgba(134, 142, 150, 0.5); box-shadow: 0 0 0 0.2rem rgba(134, 142, 150, 0.5); } .btn-success { color: color-yiq(#28a745); background-color: #28a745; border-color: #28a745; } .btn-success:hover { color: color-yiq(#218838); background-color: #1e7e34; border-color: #1e7e34; } .btn-success:focus, .btn-success.focus { -webkit-box-shadow: 0 0 0 0.2rem rgba(40, 167, 69, 0.5); box-shadow: 0 0 0 0.2rem rgba(40, 167, 69, 0.5); } .btn-success.disabled, .btn-success:disabled { color: color-yiq(#28a745); background-color: #28a745; border-color: #28a745; } .btn-success:not(:disabled):not(.disabled):active, .btn-success:not(:disabled):not(.disabled).active, .show > .btn-success.dropdown-toggle { color: color-yiq(#1e7e34); background-color: #1e7e34; border-color: #1c7430; } .btn-success:not(:disabled):not(.disabled):active:focus, .btn-success:not(:disabled):not(.disabled).active:focus, .show > .btn-success.dropdown-toggle:focus { -webkit-box-shadow: 0 0 0 0.2rem rgba(40, 167, 69, 0.5); box-shadow: 0 0 0 0.2rem rgba(40, 167, 69, 0.5); } .btn-info { color: color-yiq(#17a2b8); background-color: #17a2b8; border-color: #17a2b8; } .btn-info:hover { color: color-yiq(#138496); background-color: #117a8b; border-color: #117a8b; } .btn-info:focus, .btn-info.focus { -webkit-box-shadow: 0 0 0 0.2rem rgba(23, 162, 184, 0.5); box-shadow: 0 0 0 0.2rem rgba(23, 162, 184, 0.5); } .btn-info.disabled, .btn-info:disabled { color: color-yiq(#17a2b8); background-color: #17a2b8; border-color: #17a2b8; } .btn-info:not(:disabled):not(.disabled):active, .btn-info:not(:disabled):not(.disabled).active, .show > .btn-info.dropdown-toggle { color: color-yiq(#117a8b); background-color: #117a8b; border-color: #10707f; } .btn-info:not(:disabled):not(.disabled):active:focus, .btn-info:not(:disabled):not(.disabled).active:focus, .show > .btn-info.dropdown-toggle:focus { -webkit-box-shadow: 0 0 0 0.2rem rgba(23, 162, 184, 0.5); box-shadow: 0 0 0 0.2rem rgba(23, 162, 184, 0.5); } .btn-warning { color: color-yiq(#ffc107); background-color: #ffc107; border-color: #ffc107; } .btn-warning:hover { color: color-yiq(#e0a800); background-color: #d39e00; border-color: #d39e00; } .btn-warning:focus, .btn-warning.focus { -webkit-box-shadow: 0 0 0 0.2rem rgba(255, 193, 7, 0.5); box-shadow: 0 0 0 0.2rem rgba(255, 193, 7, 0.5); } .btn-warning.disabled, .btn-warning:disabled { color: color-yiq(#ffc107); background-color: #ffc107; border-color: #ffc107; } .btn-warning:not(:disabled):not(.disabled):active, .btn-warning:not(:disabled):not(.disabled).active, .show > .btn-warning.dropdown-toggle { color: color-yiq(#d39e00); background-color: #d39e00; border-color: #c69500; } .btn-warning:not(:disabled):not(.disabled):active:focus, .btn-warning:not(:disabled):not(.disabled).active:focus, .show > .btn-warning.dropdown-toggle:focus { -webkit-box-shadow: 0 0 0 0.2rem rgba(255, 193, 7, 0.5); box-shadow: 0 0 0 0.2rem rgba(255, 193, 7, 0.5); } .btn-danger { color: color-yiq(#dc3545); background-color: #dc3545; border-color: #dc3545; } .btn-danger:hover { color: color-yiq(#c82333); background-color: #bd2130; border-color: #bd2130; } .btn-danger:focus, .btn-danger.focus { -webkit-box-shadow: 0 0 0 0.2rem rgba(220, 53, 69, 0.5); box-shadow: 0 0 0 0.2rem rgba(220, 53, 69, 0.5); } .btn-danger.disabled, .btn-danger:disabled { color: color-yiq(#dc3545); background-color: #dc3545; border-color: #dc3545; } .btn-danger:not(:disabled):not(.disabled):active, .btn-danger:not(:disabled):not(.disabled).active, .show > .btn-danger.dropdown-toggle { color: color-yiq(#bd2130); background-color: #bd2130; border-color: #b21f2d; } .btn-danger:not(:disabled):not(.disabled):active:focus, .btn-danger:not(:disabled):not(.disabled).active:focus, .show > .btn-danger.dropdown-toggle:focus { -webkit-box-shadow: 0 0 0 0.2rem rgba(220, 53, 69, 0.5); box-shadow: 0 0 0 0.2rem rgba(220, 53, 69, 0.5); } .btn-light { color: color-yiq(#f8f9fa); background-color: #f8f9fa; border-color: #f8f9fa; } .btn-light:hover { color: color-yiq(#e2e6ea); background-color: #dae0e5; border-color: #dae0e5; } .btn-light:focus, .btn-light.focus { -webkit-box-shadow: 0 0 0 0.2rem rgba(248, 249, 250, 0.5); box-shadow: 0 0 0 0.2rem rgba(248, 249, 250, 0.5); } .btn-light.disabled, .btn-light:disabled { color: color-yiq(#f8f9fa); background-color: #f8f9fa; border-color: #f8f9fa; } .btn-light:not(:disabled):not(.disabled):active, .btn-light:not(:disabled):not(.disabled).active, .show > .btn-light.dropdown-toggle { color: color-yiq(#dae0e5); background-color: #dae0e5; border-color: #d3d9df; } .btn-light:not(:disabled):not(.disabled):active:focus, .btn-light:not(:disabled):not(.disabled).active:focus, .show > .btn-light.dropdown-toggle:focus { -webkit-box-shadow: 0 0 0 0.2rem rgba(248, 249, 250, 0.5); box-shadow: 0 0 0 0.2rem rgba(248, 249, 250, 0.5); } .btn-dark { color: color-yiq(#343a40); background-color: #343a40; border-color: #343a40; } .btn-dark:hover { color: color-yiq(#23272b); background-color: #1d2124; border-color: #1d2124; } .btn-dark:focus, .btn-dark.focus { -webkit-box-shadow: 0 0 0 0.2rem rgba(52, 58, 64, 0.5); box-shadow: 0 0 0 0.2rem rgba(52, 58, 64, 0.5); } .btn-dark.disabled, .btn-dark:disabled { color: color-yiq(#343a40); background-color: #343a40; border-color: #343a40; } .btn-dark:not(:disabled):not(.disabled):active, .btn-dark:not(:disabled):not(.disabled).active, .show > .btn-dark.dropdown-toggle { color: color-yiq(#1d2124); background-color: #1d2124; border-color: #171a1d; } .btn-dark:not(:disabled):not(.disabled):active:focus, .btn-dark:not(:disabled):not(.disabled).active:focus, .show > .btn-dark.dropdown-toggle:focus { -webkit-box-shadow: 0 0 0 0.2rem rgba(52, 58, 64, 0.5); box-shadow: 0 0 0 0.2rem rgba(52, 58, 64, 0.5); } .btn-default { color: color-yiq(#ced4da); background-color: #ced4da; border-color: #ced4da; } .btn-default:hover { color: color-yiq(#b8c1ca); background-color: #b1bbc4; border-color: #b1bbc4; } .btn-default:focus, .btn-default.focus { -webkit-box-shadow: 0 0 0 0.2rem rgba(206, 212, 218, 0.5); box-shadow: 0 0 0 0.2rem rgba(206, 212, 218, 0.5); } .btn-default.disabled, .btn-default:disabled { color: color-yiq(#ced4da); background-color: #ced4da; border-color: #ced4da; } .btn-default:not(:disabled):not(.disabled):active, .btn-default:not(:disabled):not(.disabled).active, .show > .btn-default.dropdown-toggle { color: color-yiq(#b1bbc4); background-color: #b1bbc4; border-color: #aab4bf; } .btn-default:not(:disabled):not(.disabled):active:focus, .btn-default:not(:disabled):not(.disabled).active:focus, .show > .btn-default.dropdown-toggle:focus { -webkit-box-shadow: 0 0 0 0.2rem rgba(206, 212, 218, 0.5); box-shadow: 0 0 0 0.2rem rgba(206, 212, 218, 0.5); } .btn-outline-primary { color: #467fbf; background-color: transparent; background-image: none; border-color: #467fbf; } .btn-outline-primary:hover { color: #fff; background-color: #467fbf; border-color: #467fbf; } .btn-outline-primary:focus, .btn-outline-primary.focus { -webkit-box-shadow: 0 0 0 0.2rem rgba(70, 127, 191, 0.5); box-shadow: 0 0 0 0.2rem rgba(70, 127, 191, 0.5); } .btn-outline-primary.disabled, .btn-outline-primary:disabled { color: #467fbf; background-color: transparent; } .btn-outline-primary:not(:disabled):not(.disabled):active, .btn-outline-primary:not(:disabled):not(.disabled).active, .show > .btn-outline-primary.dropdown-toggle { color: color-yiq(#467fbf); background-color: #467fbf; border-color: #467fbf; } .btn-outline-primary:not(:disabled):not(.disabled):active:focus, .btn-outline-primary:not(:disabled):not(.disabled).active:focus, .show > .btn-outline-primary.dropdown-toggle:focus { -webkit-box-shadow: 0 0 0 0.2rem rgba(70, 127, 191, 0.5); box-shadow: 0 0 0 0.2rem rgba(70, 127, 191, 0.5); } .btn-outline-secondary { color: #868e96; background-color: transparent; background-image: none; border-color: #868e96; } .btn-outline-secondary:hover { color: #fff; background-color: #868e96; border-color: #868e96; } .btn-outline-secondary:focus, .btn-outline-secondary.focus { -webkit-box-shadow: 0 0 0 0.2rem rgba(134, 142, 150, 0.5); box-shadow: 0 0 0 0.2rem rgba(134, 142, 150, 0.5); } .btn-outline-secondary.disabled, .btn-outline-secondary:disabled { color: #868e96; background-color: transparent; } .btn-outline-secondary:not(:disabled):not(.disabled):active, .btn-outline-secondary:not(:disabled):not(.disabled).active, .show > .btn-outline-secondary.dropdown-toggle { color: color-yiq(#868e96); background-color: #868e96; border-color: #868e96; } .btn-outline-secondary:not(:disabled):not(.disabled):active:focus, .btn-outline-secondary:not(:disabled):not(.disabled).active:focus, .show > .btn-outline-secondary.dropdown-toggle:focus { -webkit-box-shadow: 0 0 0 0.2rem rgba(134, 142, 150, 0.5); box-shadow: 0 0 0 0.2rem rgba(134, 142, 150, 0.5); } .btn-outline-success { color: #28a745; background-color: transparent; background-image: none; border-color: #28a745; } .btn-outline-success:hover { color: #fff; background-color: #28a745; border-color: #28a745; } .btn-outline-success:focus, .btn-outline-success.focus { -webkit-box-shadow: 0 0 0 0.2rem rgba(40, 167, 69, 0.5); box-shadow: 0 0 0 0.2rem rgba(40, 167, 69, 0.5); } .btn-outline-success.disabled, .btn-outline-success:disabled { color: #28a745; background-color: transparent; } .btn-outline-success:not(:disabled):not(.disabled):active, .btn-outline-success:not(:disabled):not(.disabled).active, .show > .btn-outline-success.dropdown-toggle { color: color-yiq(#28a745); background-color: #28a745; border-color: #28a745; } .btn-outline-success:not(:disabled):not(.disabled):active:focus, .btn-outline-success:not(:disabled):not(.disabled).active:focus, .show > .btn-outline-success.dropdown-toggle:focus { -webkit-box-shadow: 0 0 0 0.2rem rgba(40, 167, 69, 0.5); box-shadow: 0 0 0 0.2rem rgba(40, 167, 69, 0.5); } .btn-outline-info { color: #17a2b8; background-color: transparent; background-image: none; border-color: #17a2b8; } .btn-outline-info:hover { color: #fff; background-color: #17a2b8; border-color: #17a2b8; } .btn-outline-info:focus, .btn-outline-info.focus { -webkit-box-shadow: 0 0 0 0.2rem rgba(23, 162, 184, 0.5); box-shadow: 0 0 0 0.2rem rgba(23, 162, 184, 0.5); } .btn-outline-info.disabled, .btn-outline-info:disabled { color: #17a2b8; background-color: transparent; } .btn-outline-info:not(:disabled):not(.disabled):active, .btn-outline-info:not(:disabled):not(.disabled).active, .show > .btn-outline-info.dropdown-toggle { color: color-yiq(#17a2b8); background-color: #17a2b8; border-color: #17a2b8; } .btn-outline-info:not(:disabled):not(.disabled):active:focus, .btn-outline-info:not(:disabled):not(.disabled).active:focus, .show > .btn-outline-info.dropdown-toggle:focus { -webkit-box-shadow: 0 0 0 0.2rem rgba(23, 162, 184, 0.5); box-shadow: 0 0 0 0.2rem rgba(23, 162, 184, 0.5); } .btn-outline-warning { color: #ffc107; background-color: transparent; background-image: none; border-color: #ffc107; } .btn-outline-warning:hover { color: #fff; background-color: #ffc107; border-color: #ffc107; } .btn-outline-warning:focus, .btn-outline-warning.focus { -webkit-box-shadow: 0 0 0 0.2rem rgba(255, 193, 7, 0.5); box-shadow: 0 0 0 0.2rem rgba(255, 193, 7, 0.5); } .btn-outline-warning.disabled, .btn-outline-warning:disabled { color: #ffc107; background-color: transparent; } .btn-outline-warning:not(:disabled):not(.disabled):active, .btn-outline-warning:not(:disabled):not(.disabled).active, .show > .btn-outline-warning.dropdown-toggle { color: color-yiq(#ffc107); background-color: #ffc107; border-color: #ffc107; } .btn-outline-warning:not(:disabled):not(.disabled):active:focus, .btn-outline-warning:not(:disabled):not(.disabled).active:focus, .show > .btn-outline-warning.dropdown-toggle:focus { -webkit-box-shadow: 0 0 0 0.2rem rgba(255, 193, 7, 0.5); box-shadow: 0 0 0 0.2rem rgba(255, 193, 7, 0.5); } .btn-outline-danger { color: #dc3545; background-color: transparent; background-image: none; border-color: #dc3545; } .btn-outline-danger:hover { color: #fff; background-color: #dc3545; border-color: #dc3545; } .btn-outline-danger:focus, .btn-outline-danger.focus { -webkit-box-shadow: 0 0 0 0.2rem rgba(220, 53, 69, 0.5); box-shadow: 0 0 0 0.2rem rgba(220, 53, 69, 0.5); } .btn-outline-danger.disabled, .btn-outline-danger:disabled { color: #dc3545; background-color: transparent; } .btn-outline-danger:not(:disabled):not(.disabled):active, .btn-outline-danger:not(:disabled):not(.disabled).active, .show > .btn-outline-danger.dropdown-toggle { color: color-yiq(#dc3545); background-color: #dc3545; border-color: #dc3545; } .btn-outline-danger:not(:disabled):not(.disabled):active:focus, .btn-outline-danger:not(:disabled):not(.disabled).active:focus, .show > .btn-outline-danger.dropdown-toggle:focus { -webkit-box-shadow: 0 0 0 0.2rem rgba(220, 53, 69, 0.5); box-shadow: 0 0 0 0.2rem rgba(220, 53, 69, 0.5); } .btn-outline-light { color: #f8f9fa; background-color: transparent; background-image: none; border-color: #f8f9fa; } .btn-outline-light:hover { color: #fff; background-color: #f8f9fa; border-color: #f8f9fa; } .btn-outline-light:focus, .btn-outline-light.focus { -webkit-box-shadow: 0 0 0 0.2rem rgba(248, 249, 250, 0.5); box-shadow: 0 0 0 0.2rem rgba(248, 249, 250, 0.5); } .btn-outline-light.disabled, .btn-outline-light:disabled { color: #f8f9fa; background-color: transparent; } .btn-outline-light:not(:disabled):not(.disabled):active, .btn-outline-light:not(:disabled):not(.disabled).active, .show > .btn-outline-light.dropdown-toggle { color: color-yiq(#f8f9fa); background-color: #f8f9fa; border-color: #f8f9fa; } .btn-outline-light:not(:disabled):not(.disabled):active:focus, .btn-outline-light:not(:disabled):not(.disabled).active:focus, .show > .btn-outline-light.dropdown-toggle:focus { -webkit-box-shadow: 0 0 0 0.2rem rgba(248, 249, 250, 0.5); box-shadow: 0 0 0 0.2rem rgba(248, 249, 250, 0.5); } .btn-outline-dark { color: #343a40; background-color: transparent; background-image: none; border-color: #343a40; } .btn-outline-dark:hover { color: #fff; background-color: #343a40; border-color: #343a40; } .btn-outline-dark:focus, .btn-outline-dark.focus { -webkit-box-shadow: 0 0 0 0.2rem rgba(52, 58, 64, 0.5); box-shadow: 0 0 0 0.2rem rgba(52, 58, 64, 0.5); } .btn-outline-dark.disabled, .btn-outline-dark:disabled { color: #343a40; background-color: transparent; } .btn-outline-dark:not(:disabled):not(.disabled):active, .btn-outline-dark:not(:disabled):not(.disabled).active, .show > .btn-outline-dark.dropdown-toggle { color: color-yiq(#343a40); background-color: #343a40; border-color: #343a40; } .btn-outline-dark:not(:disabled):not(.disabled):active:focus, .btn-outline-dark:not(:disabled):not(.disabled).active:focus, .show > .btn-outline-dark.dropdown-toggle:focus { -webkit-box-shadow: 0 0 0 0.2rem rgba(52, 58, 64, 0.5); box-shadow: 0 0 0 0.2rem rgba(52, 58, 64, 0.5); } .btn-lg { padding: 0.5rem 1rem; font-size: 1.25rem; line-height: 1.5; border-radius: 0; } .btn-sm { padding: 0.25rem 0.5rem; font-size: 0.7rem; line-height: 1.5; border-radius: 0; } /* * 3. TYPE */ body { font-family: "Roboto", Helvetica, Arial, sans-serif; font-size: 1rem; font-weight: 400; line-height: 1.5; color: #212529; background-color: #fff; } a { color: #467fbf; text-decoration: none; } a:focus, a:hover { color: #2f5a89; text-decoration: underline; } h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6 { margin-bottom: 1rem; font-family: inherit; font-weight: 700; line-height: 1.1; color: inherit; } h1, .h1 { font-size: 2.2rem; } h2, .h2 { font-size: 1.8rem; } h3, .h3 { font-size: 1.5rem; } h4, .h4 { font-size: 1.1rem; } h5, .h5 { font-size: 1rem; } h6, .h6 { font-size: 0.8rem; } .lead { font-size: 1.25rem; font-weight: 300; } .display-1 { font-size: 6rem; font-weight: 300; line-height: 1.1; } .display-2 { font-size: 5.5rem; font-weight: 300; line-height: 1.1; } .display-3 { font-size: 4.5rem; font-weight: 300; line-height: 1.1; } .display-4 { font-size: 3.5rem; font-weight: 300; line-height: 1.1; } hr { border-top: 1px solid rgba(0, 0, 0, 0.1); } small, .small { font-size: 80%; font-weight: 400; } mark, .mark { padding: 0.2em; background-color: #fcf8e3; } .blockquote { padding: 0.5rem 1rem; margin-bottom: 2rem; font-size: 1rem; border-left: 5px solid #467fbf; } .blockquote-footer { color: #868e96; } .blockquote-footer::before { content: "\2014 \00A0"; } .text-primary { color: #467fbf !important; } a.text-primary:focus, a.text-primary:hover { color: #36669c !important; } /* * 4. PAGINATION */ .page-item:first-child .page-link { border-top-left-radius: 0; border-bottom-left-radius: 0; } .page-item:last-child .page-link { border-top-right-radius: 0; border-bottom-right-radius: 0; } .page-item.active .page-link { color: #fff; background-color: #467fbf; border-color: #467fbf; } .page-item.disabled .page-link { color: #868e96; background-color: #fff; border-color: #dee2e6; } .page-link { padding: 0.5rem 0.75rem; line-height: 1.25; color: #467fbf; background-color: #fff; border: 1px solid #dee2e6; } .page-link:focus, .page-link:hover { color: #2f5a89; text-decoration: none; background-color: #e9ecef; border-color: #dee2e6; outline: 0; } .pagination-lg .page-link { padding: 0.75rem 1.5rem; font-size: 1.25rem; line-height: 1.5; } .pagination-lg .page-item:first-child .page-link { border-top-left-radius: 0; border-bottom-left-radius: 0; } .pagination-lg .page-item:last-child .page-link { border-top-right-radius: 0; border-bottom-right-radius: 0; } .pagination-sm .page-link { padding: 0.25rem 0.5rem; font-size: 0.7rem; line-height: 1.5; } .pagination-sm .page-item:first-child .page-link { border-top-left-radius: 0; border-bottom-left-radius: 0; } .pagination-sm .page-item:last-child .page-link { border-top-right-radius: 0; border-bottom-right-radius: 0; } /* * 5. DROPDOWNS */ .dropdown-menu { z-index: 1000; min-width: 10rem; padding: 0.5rem 0; margin: 0.125rem 0 0; font-size: 1rem; color: #212529; background-color: #fff; border: 1px solid rgba(0, 0, 0, 0.15); border-radius: 0; } .dropdown-item { padding: 0.25rem 1.5rem; color: #212529; } .dropdown-item:focus, .dropdown-item:hover { color: #16181b; background-color: #f8f9fa; } .dropdown-item.active, .dropdown-item:active { color: #fff; background-color: #467fbf; } .dropdown-item.disabled, .dropdown-item:disabled { color: #868e96; } .dropdown-header { padding: 0.5rem 1.5rem; font-size: 0.7rem; color: #868e96; } /* * 6. UTILITIES */ .bg-primary { background-color: #467fbf !important; } a.bg-primary:focus, a.bg-primary:hover { background-color: #36669c !important; } .bg-secondary { background-color: #868e96 !important; } a.bg-secondary:focus, a.bg-secondary:hover { background-color: #6c757d !important; } .bg-success { background-color: #28a745 !important; } a.bg-success:focus, a.bg-success:hover { background-color: #1e7e34 !important; } .bg-info { background-color: #17a2b8 !important; } a.bg-info:focus, a.bg-info:hover { background-color: #117a8b !important; } .bg-warning { background-color: #ffc107 !important; } a.bg-warning:focus, a.bg-warning:hover { background-color: #d39e00 !important; } .bg-danger { background-color: #dc3545 !important; } a.bg-danger:focus, a.bg-danger:hover { background-color: #bd2130 !important; } .bg-light { background-color: #f8f9fa !important; } a.bg-light:focus, a.bg-light:hover { background-color: #dae0e5 !important; } .bg-dark { background-color: #343a40 !important; } a.bg-dark:focus, a.bg-dark:hover { background-color: #1d2124 !important; } .border-primary { border-color: #467fbf !important; } .border-secondary { border-color: #868e96 !important; } .border-success { border-color: #28a745 !important; } .border-info { border-color: #17a2b8 !important; } .border-warning { border-color: #ffc107 !important; } .border-danger { border-color: #dc3545 !important; } .border-light { border-color: #f8f9fa !important; } .border-dark { border-color: #343a40 !important; } .text-primary { color: #467fbf !important; } a.text-primary:focus, a.text-primary:hover { color: #36669c !important; } .text-secondary { color: #868e96 !important; } a.text-secondary:focus, a.text-secondary:hover { color: #6c757d !important; } .text-success { color: #28a745 !important; } a.text-success:focus, a.text-success:hover { color: #1e7e34 !important; } .text-info { color: #17a2b8 !important; } a.text-info:focus, a.text-info:hover { color: #117a8b !important; } .text-warning { color: #ffc107 !important; } a.text-warning:focus, a.text-warning:hover { color: #d39e00 !important; } .text-danger { color: #dc3545 !important; } a.text-danger:focus, a.text-danger:hover { color: #bd2130 !important; } .text-light { color: #f8f9fa !important; } a.text-light:focus, a.text-light:hover { color: #dae0e5 !important; } .text-dark { color: #343a40 !important; } a.text-dark:focus, a.text-dark:hover { color: #1d2124 !important; } .badge-primary { color: #fff; background-color: #467fbf; } .badge-primary[href]:focus, .badge-primary[href]:hover { color: #fff; text-decoration: none; background-color: #36669c; } .badge-secondary { color: #fff; background-color: #868e96; } .badge-secondary[href]:focus, .badge-secondary[href]:hover { color: #fff; text-decoration: none; background-color: #6c757d; } .badge-success { color: #fff; background-color: #28a745; } .badge-success[href]:focus, .badge-success[href]:hover { color: #fff; text-decoration: none; background-color: #1e7e34; } .badge-info { color: #fff; background-color: #17a2b8; } .badge-info[href]:focus, .badge-info[href]:hover { color: #fff; text-decoration: none; background-color: #117a8b; } .badge-warning { color: #111; background-color: #ffc107; } .badge-warning[href]:focus, .badge-warning[href]:hover { color: #111; text-decoration: none; background-color: #d39e00; } .badge-danger { color: #fff; background-color: #dc3545; } .badge-danger[href]:focus, .badge-danger[href]:hover { color: #fff; text-decoration: none; background-color: #bd2130; } .badge-light { color: #111; background-color: #f8f9fa; } .badge-light[href]:focus, .badge-light[href]:hover { color: #111; text-decoration: none; background-color: #dae0e5; } .badge-dark { color: #fff; background-color: #343a40; } .badge-dark[href]:focus, .badge-dark[href]:hover { color: #fff; text-decoration: none; background-color: #1d2124; } /* * 7.CODE */ code { font-size: 87.5%; color: #e83e8c; border-radius: 0; } a > code { padding: 0; color: inherit; background-color: inherit; } /* * 8. NAV */ .nav-link { padding: 0.5rem 1rem; } .nav-link.disabled { color: #868e96; } .nav-tabs .nav-item { margin-bottom: -1px; } .nav-tabs .nav-link { border: 1px solid transparent; border-top-left-radius: 0; border-top-right-radius: 0; } .nav-tabs .nav-link:focus, .nav-tabs .nav-link:hover { border-color: #e9ecef #e9ecef #dee2e6; } .nav-tabs .nav-link.disabled { color: #868e96; } .nav-tabs .nav-link.active, .nav-tabs .nav-item.show .nav-link { color: #495057; background-color: #fff; } .nav-tabs .dropdown-menu { margin-top: -1px; } .nav-pills .nav-link { border-radius: 0; } .nav-pills .nav-link.active, .nav-pills .show > .nav-link { color: #fff; background-color: #467fbf; } /* * 9. CARD */ .card { background-color: #fff; border: 1px solid rgba(0, 0, 0, 0.125); border-radius: 0; } .card > .list-group:first-child .list-group-item:first-child { border-top-left-radius: 0; border-top-right-radius: 0; } .card > .list-group:last-child .list-group-item:last-child { border-bottom-right-radius: 0; border-bottom-left-radius: 0; } .card-body { padding: 1.25rem; } .card-title { margin-bottom: 0.75rem; } .card-subtitle { margin-top: -0.375rem; } .card-link + .card-link { margin-left: 1.25rem; } .card-header { padding: 0.75rem 1.25rem; background-color: rgba(0, 0, 0, 0.03); border-bottom: 1px solid rgba(0, 0, 0, 0.125); } .card-header:first-child { border-radius: calc(0 - 1px) calc(0 - 1px) 0 0; } .card-header-transparent { background-color: rgba(0, 0, 0, 0.3); border-bottom: none; } .card-footer { padding: 0.75rem 1.25rem; background-color: #f8f9fa; border-top: 1px solid rgba(0, 0, 0, 0.125); } .card-footer:last-child { border-radius: 0 0 calc(0 - 1px) calc(0 - 1px); } .card-header-tabs { margin-right: -0.625rem; margin-bottom: -0.75rem; margin-left: -0.625rem; border-bottom: 0; } .card-header-pills { margin-right: -0.625rem; margin-left: -0.625rem; } .card-img-overlay { padding: 1.25rem; } .card-img-overlay-opacity { background: rgba(0, 0, 0, 0.2); } .card-img { border-radius: calc(0 - 1px); } .card-img-top { border-top-left-radius: calc(0 - 1px); border-top-right-radius: calc(0 - 1px); } .card-img-bottom { border-bottom-right-radius: calc(0 - 1px); border-bottom-left-radius: calc(0 - 1px); } .card-deck .card { margin-bottom: 15px; } @media (min-width: 576px) { .card-deck { margin-right: -15px; margin-left: -15px; } .card-deck .card { margin-right: 15px; margin-left: 15px; } }