.divider:after, .divider:before { content: ""; flex: 1; height: 1px; background: #eee; } .h-custom { height: calc(100% - 73px); } @media (max-width: 1000px) { .h-custom { height: 100%; } .img-fluid{ visibility: hidden; margin-top: -100%; } form{ margin-top: -80%; } } :root{ --color-primary : #2289FF; --color-secondary : #314862 !important; --color-acent : #193F6A; --font-poppin : 'Poppins', serif; } /* Custom classes */ .bg-primary { background-color: var(--color-primary); } .color-primary { color: var(--color-primary); } .bg-secondary { background-color: var(--color-secondary); } .color-secondary { color:var(--color-secondary) ; } .bg-acent { background-color: var(--color-acent); } .color-acent { color: var(--color-acent); } /* Header style*/ header.header { width: 100%; } .header nav.navbar{ box-shadow: none; color: var(--color-secondary); } .header nav.navbar .navbar-brand{ font-family: var(--font-poppin); font-weight: 500; font-size: 20px; color: var(--color-secondary); } .header nav.navbar .nav-link { color: var(--color-secondary); font-family: var(--color-secondary); font-weight: 500; padding: 10px 20px; } .header nav.navbar .nav-item { margin: auto; } .btn-theme { box-shadow: none; margin: 0; font-family : var(--font-poppin); font-size: 16px; font-weight: 500; text-transform: capitalize; background-color: var(--color-primary); color: #ffffff; padding: 8px 20px ; border-radius: 20px 0px 20px 20px; } .btn-theme:hover { background-color: var(--color-acent); box-shadow: none; color: #ffffff; } .btn-theme-2{ box-shadow: 0 10px 20px 0px rgb(34 137 255/52%); margin: 0; font-family : var(--font-poppin); font-size: 16px; font-weight: 500; text-transform: capitalize; background-color: var(--color-primary); color: #ffffff; padding: 10px 30px ; border-radius: 30px; } .btn-theme2:hover { background-color: var(--color-acent); box-shadow: none; color: #ffffff !important; } .btn-play{ box-shadow: none; margin: 0; font-family : var(--font-poppin); font-size: 16px; font-weight: 500; text-transform: capitalize; background-color: var(--color-primary); color: #ffffff; padding: 10px 16px ; border-radius: 100%; transition: 0.5s ease; } .btn-play:hover { background-color: var(--color-acent); box-shadow: none; color: #ffffff; } .header .navbar .nav-link:hover, .header .navbar .nav-link:active{ color: var(--color-primary); } /* footer */ footer { width: 100%; padding: 50px 0; background-color: var(--color-primary); color: white; font-family: var(--font-poppin); border-radius: 100px 0 0 0; } footer ul { list-style: none; margin: 0; padding: 0; } footer ul li a{ color: white; font-size: 13px; } footer ul li a :hover{ opacity: 0.7; color: white; }