initial commit
This commit is contained in:
6
webroot/learninghub/css/bootstrap.min.css
vendored
Normal file
6
webroot/learninghub/css/bootstrap.min.css
vendored
Normal file
File diff suppressed because one or more lines are too long
542
webroot/learninghub/css/style.css
Normal file
542
webroot/learninghub/css/style.css
Normal file
@@ -0,0 +1,542 @@
|
||||
/********** Template CSS **********/
|
||||
:root {
|
||||
--primary: #b00f20;
|
||||
--secondary: #ffc20a;
|
||||
--light: #fdf4d8;
|
||||
--dark: #2B3940;
|
||||
}
|
||||
|
||||
.back-to-top {
|
||||
position: fixed;
|
||||
display: none;
|
||||
right: 45px;
|
||||
bottom: 45px;
|
||||
z-index: 99;
|
||||
}
|
||||
|
||||
/*** Spinner ***/
|
||||
#spinner {
|
||||
opacity: 0;
|
||||
visibility: hidden;
|
||||
transition: opacity .5s ease-out, visibility 0s linear .5s;
|
||||
z-index: 99999;
|
||||
}
|
||||
|
||||
#spinner.show {
|
||||
transition: opacity .5s ease-out, visibility 0s linear 0s;
|
||||
visibility: visible;
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
/*** Button ***/
|
||||
.btn {
|
||||
font-family: 'Inter', sans-serif;
|
||||
font-weight: 600;
|
||||
transition: .5s;
|
||||
}
|
||||
|
||||
.btn.btn-primary {
|
||||
background-color: #b00f20;
|
||||
border: #b00f20 1px solid;
|
||||
padding-left: 10px;
|
||||
padding-right: 10px;
|
||||
}
|
||||
|
||||
.btn.btn.btn-secondary {
|
||||
background-color: #ffc20a;
|
||||
}
|
||||
|
||||
.bg-primary{
|
||||
background-color: #fbefcc !important;
|
||||
}
|
||||
|
||||
.text-primary {
|
||||
color: var(--primary) !important;
|
||||
}
|
||||
|
||||
.bg-dark{
|
||||
background: linear-gradient(rgba(37, 37, 37, 0.9), rgba(82, 82, 82, 0.7));
|
||||
}
|
||||
|
||||
.accordion-item {
|
||||
background-color: var(--light);
|
||||
border: 1px solid rgba(0, 0, 0, 0.125);
|
||||
}
|
||||
|
||||
.accordion-button:not(.collapsed) {
|
||||
color: #484848d6;
|
||||
background-color: #fff;
|
||||
}
|
||||
|
||||
.img-right {
|
||||
float: right;
|
||||
margin-left: 15px;
|
||||
margin-bottom: 15px;
|
||||
max-width: 200px;
|
||||
}
|
||||
|
||||
.btn:hover{
|
||||
background-color: #ffc20a;
|
||||
border: #ffc20a 1px solid;
|
||||
}
|
||||
|
||||
.btn.btn-primary,
|
||||
.btn.btn-secondary {
|
||||
color: #FFFFFF;
|
||||
}
|
||||
|
||||
.bg-light {
|
||||
background-color: #fdf4d8 !important;
|
||||
border: #ead79b 1px solid;
|
||||
}
|
||||
|
||||
.well{
|
||||
background-color: #fdf4d8 !important;
|
||||
border: #ead79b 1px solid !important;
|
||||
border-top-left-radius: .5rem !important;
|
||||
border-top-right-radius: .5rem !important;
|
||||
opacity: .9 !important;
|
||||
box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1) !important;
|
||||
}
|
||||
|
||||
.nav-pills .nav-link {
|
||||
background: none;
|
||||
border: #ead79b 1px solid;
|
||||
border-radius: 0px;
|
||||
margin-bottom: 5px;
|
||||
padding: 15px 10px;
|
||||
color: #000;
|
||||
}
|
||||
|
||||
.nav-pills .nav-link.active, .nav-pills .show>.nav-link {
|
||||
color: #000;
|
||||
background-color: #ffc20a;
|
||||
padding: 15px 10px;
|
||||
}
|
||||
|
||||
.list-unstyled li{
|
||||
padding-bottom: 10px;
|
||||
}
|
||||
|
||||
.map {
|
||||
width: 100%;
|
||||
height: 450px;
|
||||
}
|
||||
|
||||
.btn-square {
|
||||
width: 38px;
|
||||
height: 38px;
|
||||
}
|
||||
|
||||
.btn-sm-square {
|
||||
width: 32px;
|
||||
height: 32px;
|
||||
}
|
||||
|
||||
.btn-lg-square {
|
||||
width: 48px;
|
||||
height: 48px;
|
||||
}
|
||||
|
||||
.btn-square,
|
||||
.btn-sm-square,
|
||||
.btn-lg-square {
|
||||
padding: 0;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
font-weight: normal;
|
||||
border-radius: 2px;
|
||||
}
|
||||
|
||||
|
||||
/*** Navbar ***/
|
||||
.navbar .dropdown-toggle::after {
|
||||
border: none;
|
||||
content: "\f107";
|
||||
font-family: "Font Awesome 5 Free";
|
||||
font-weight: 900;
|
||||
vertical-align: middle;
|
||||
margin-left: 5px;
|
||||
transition: .5s;
|
||||
}
|
||||
|
||||
.navbar .dropdown-toggle[aria-expanded=true]::after {
|
||||
transform: rotate(-180deg);
|
||||
}
|
||||
|
||||
.navbar-dark .navbar-nav .nav-link,
|
||||
.navbar-light .navbar-nav .nav-link {
|
||||
margin-right: 20px;
|
||||
padding: 25px 0;
|
||||
color: #FFFFFF;
|
||||
font-size: 15px;
|
||||
text-transform: uppercase;
|
||||
outline: none;
|
||||
}
|
||||
|
||||
.navbar-dark .navbar-nav .nav-link:hover,
|
||||
.navbar-dark .navbar-nav .nav-link.active,
|
||||
.navbar-light .navbar-nav .nav-link:hover,
|
||||
.navbar-light .navbar-nav .nav-link.active {
|
||||
color: var(--primary);
|
||||
}
|
||||
|
||||
.navbar-brand {
|
||||
margin-right: 0rem;
|
||||
}
|
||||
|
||||
.navbar-light .navbar-nav .nav-link {
|
||||
font-size: .975rem;
|
||||
text-transform: none;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
@media (max-width: 991.98px) {
|
||||
.navbar-dark .navbar-nav .nav-link,
|
||||
.navbar-light .navbar-nav .nav-link {
|
||||
margin-right: 0;
|
||||
padding: 10px 0;
|
||||
}
|
||||
|
||||
.navbar-light .navbar-nav {
|
||||
border-top: 1px solid #EEEEEE;
|
||||
}
|
||||
}
|
||||
|
||||
.navbar-light .navbar-brand,
|
||||
.navbar-light a.btn {
|
||||
height: 75px;
|
||||
}
|
||||
|
||||
.navbar-light .navbar-nav .nav-link {
|
||||
color: var(--dark);
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
.navbar-light.sticky-top {
|
||||
top: -100px;
|
||||
transition: .5s;
|
||||
}
|
||||
|
||||
@media (min-width: 992px) {
|
||||
.navbar .nav-item .dropdown-menu {
|
||||
display: block;
|
||||
top: 100%;
|
||||
margin-top: 0;
|
||||
transform: rotateX(-75deg);
|
||||
transform-origin: 0% 0%;
|
||||
opacity: 0;
|
||||
visibility: hidden;
|
||||
transition: .5s;
|
||||
}
|
||||
|
||||
.navbar .nav-item:hover .dropdown-menu {
|
||||
transform: rotateX(0deg);
|
||||
visibility: visible;
|
||||
transition: .5s;
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
|
||||
/*** Header ***/
|
||||
.header-carousel .container,
|
||||
.page-header .container {
|
||||
position: relative;
|
||||
padding: 0px;
|
||||
border-left: 0px solid var(--primary);
|
||||
}
|
||||
|
||||
.header-carousel .container::before,
|
||||
.header-carousel .container::after,
|
||||
.page-header .container::before,
|
||||
.page-header .container::after {
|
||||
position: absolute;
|
||||
content: "";
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 0px;
|
||||
height: 0px;
|
||||
background: var(--primary);
|
||||
}
|
||||
|
||||
.header-carousel .container::after,
|
||||
.page-header .container::after {
|
||||
top: 100%;
|
||||
margin-top: -15px;
|
||||
}
|
||||
|
||||
@media (max-width: 768px) {
|
||||
.header-carousel .owl-carousel-item {
|
||||
position: relative;
|
||||
min-height: 500px;
|
||||
}
|
||||
|
||||
.header-carousel .owl-carousel-item img {
|
||||
position: absolute;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
object-fit: cover;
|
||||
}
|
||||
|
||||
.header-carousel .owl-carousel-item p {
|
||||
font-size: 14px !important;
|
||||
font-weight: 400 !important;
|
||||
}
|
||||
|
||||
.header-carousel .owl-carousel-item h1 {
|
||||
font-size: 30px;
|
||||
font-weight: 600;
|
||||
}
|
||||
}
|
||||
|
||||
.header-carousel .owl-nav {
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
right: 8%;
|
||||
transform: translateY(-50%);
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.header-carousel .owl-nav .owl-prev,
|
||||
.header-carousel .owl-nav .owl-next {
|
||||
margin: 7px 0;
|
||||
width: 45px;
|
||||
height: 45px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
color: #FFFFFF;
|
||||
background: transparent;
|
||||
border: 1px solid #FFFFFF;
|
||||
border-radius: 2px;
|
||||
font-size: 22px;
|
||||
transition: .5s;
|
||||
}
|
||||
|
||||
.header-carousel .owl-nav .owl-prev:hover,
|
||||
.header-carousel .owl-nav .owl-next:hover {
|
||||
background: var(--primary);
|
||||
border-color: var(--primary);
|
||||
}
|
||||
|
||||
.page-header {
|
||||
background: linear-gradient(rgba(176, 15, 32, 0.2), rgba(176, 57, 32, .5)), url(../img/banner.jpg) center center no-repeat;
|
||||
background-size: cover;
|
||||
}
|
||||
|
||||
.breadcrumb-item + .breadcrumb-item::before {
|
||||
color: var(--light);
|
||||
}
|
||||
|
||||
|
||||
/*** About ***/
|
||||
.about-bg {
|
||||
background-image: -webkit-repeating-radial-gradient(center center, rgba(0, 0, 0, 0.2), rgba(0, 0, 0, 0.2) 1px, transparent 1px, transparent 100%);
|
||||
background-image: -moz-repeating-radial-gradient(center center, rgba(0, 0, 0, 0.2), rgba(0, 0, 0, 0.2) 1px, transparent 1px, transparent 100%);
|
||||
background-image: -ms-repeating-radial-gradient(center center, rgba(0, 0, 0, 0.2), rgba(0, 0, 0, 0.2) 1px, transparent 1px, transparent 100%);
|
||||
background-image: -o-repeating-radial-gradient(center center, rgba(0, 0, 0, 0.2), rgba(0, 0, 0, 0.2) 1px, transparent 1px, transparent 100%);
|
||||
background-image: repeating-radial-gradient(center center, rgba(0, 0, 0, 0.2), rgba(0, 0, 0, 0.2) 1px, transparent 1px, transparent 100%);
|
||||
background-size: 5px 5px;
|
||||
}
|
||||
|
||||
|
||||
/*** Category ***/
|
||||
.cat-item {
|
||||
display: block;
|
||||
box-shadow: 0 0 45px rgba(0, 0, 0, .08);
|
||||
border: 1px solid #ededed;
|
||||
min-height: 250px;
|
||||
transition: .5s;
|
||||
}
|
||||
|
||||
.cat-item:hover {
|
||||
border-color: rgba(0, 0, 0, .08);
|
||||
box-shadow: none;
|
||||
}
|
||||
|
||||
|
||||
/*** Job Listing ***/
|
||||
.nav-pills .nav-item .active {
|
||||
border-bottom: 2px solid var(--primary);
|
||||
}
|
||||
|
||||
.job-item {
|
||||
border: 1px solid transparent;
|
||||
border-radius: 2px;
|
||||
box-shadow: 0 0 45px rgba(0, 0, 0, .08);
|
||||
transition: .5s;
|
||||
}
|
||||
|
||||
.job-item:hover {
|
||||
border-color: rgba(0, 0, 0, .08);
|
||||
box-shadow: none;
|
||||
}
|
||||
|
||||
|
||||
/*** Testimonial ***/
|
||||
.testimonial-carousel .owl-item .testimonial-item,
|
||||
.testimonial-carousel .owl-item.center .testimonial-item * {
|
||||
transition: .5s;
|
||||
}
|
||||
|
||||
.testimonial-carousel .owl-item.center .testimonial-item {
|
||||
background: var(--primary) !important;
|
||||
}
|
||||
|
||||
.testimonial-carousel .owl-item.center .testimonial-item * {
|
||||
color: #FFFFFF !important;
|
||||
}
|
||||
|
||||
.testimonial-carousel .owl-dots {
|
||||
margin-top: 24px;
|
||||
display: flex;
|
||||
align-items: flex-end;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.testimonial-carousel .owl-dot {
|
||||
position: relative;
|
||||
display: inline-block;
|
||||
margin: 0 5px;
|
||||
width: 15px;
|
||||
height: 15px;
|
||||
border: 5px solid var(--primary);
|
||||
border-radius: 2px;
|
||||
transition: .5s;
|
||||
}
|
||||
|
||||
.testimonial-carousel .owl-dot.active {
|
||||
background: var(--dark);
|
||||
border-color: var(--primary);
|
||||
}
|
||||
|
||||
|
||||
/*** Footer ***/
|
||||
.footer .btn.btn-social {
|
||||
margin-right: 5px;
|
||||
width: 35px;
|
||||
height: 35px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
color: var(--light);
|
||||
border: 1px solid rgba(255,255,255,0.5);
|
||||
border-radius: 2px;
|
||||
transition: .3s;
|
||||
}
|
||||
|
||||
.footer .btn.btn-social:hover {
|
||||
color: var(--primary);
|
||||
border-color: var(--light);
|
||||
}
|
||||
|
||||
.footer .btn.btn-link {
|
||||
display: block;
|
||||
margin-bottom: 5px;
|
||||
padding: 0;
|
||||
text-align: left;
|
||||
font-size: 15px;
|
||||
font-weight: normal;
|
||||
text-transform: capitalize;
|
||||
transition: .3s;
|
||||
}
|
||||
|
||||
.footer .btn.btn-link::before {
|
||||
position: relative;
|
||||
content: "\f105";
|
||||
font-family: "Font Awesome 5 Free";
|
||||
font-weight: 900;
|
||||
margin-right: 10px;
|
||||
}
|
||||
|
||||
.footer .btn.btn-link:hover {
|
||||
letter-spacing: 1px;
|
||||
box-shadow: none;
|
||||
}
|
||||
|
||||
.footer .form-control {
|
||||
border-color: rgba(255,255,255,0.5);
|
||||
}
|
||||
|
||||
.footer .copyright {
|
||||
padding: 25px 0;
|
||||
font-size: 15px;
|
||||
border-top: 1px solid rgba(256, 256, 256, .1);
|
||||
}
|
||||
|
||||
.footer .copyright a {
|
||||
color: var(--light);
|
||||
}
|
||||
|
||||
.footer .footer-menu a {
|
||||
margin-right: 15px;
|
||||
padding-right: 15px;
|
||||
border-right: 1px solid rgba(255, 255, 255, .1);
|
||||
}
|
||||
|
||||
.footer .footer-menu a:last-child {
|
||||
margin-right: 0;
|
||||
padding-right: 0;
|
||||
border-right: none;
|
||||
}
|
||||
|
||||
@media (min-width: 768px) {
|
||||
.px-lg-3 {
|
||||
padding-right: 1rem !important;
|
||||
padding-left: 1rem !important;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 768px) {
|
||||
.d-lg-block {
|
||||
display: block !important;
|
||||
}
|
||||
}
|
||||
|
||||
/* form styling */
|
||||
.registration-form .form-control {
|
||||
display: block;
|
||||
width: 100%;
|
||||
height: calc(1.5em + 1.125rem + 4px);
|
||||
padding: 0.875rem 1.125rem;
|
||||
font-size: 1rem;
|
||||
font-weight: 400;
|
||||
line-height: 1.5;
|
||||
color: #515d6d;
|
||||
border-radius: 0.3125rem;
|
||||
box-shadow: none;
|
||||
transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
|
||||
}
|
||||
|
||||
.registration-form .checkbox{float:left; margin-right:20px}
|
||||
.registration-form .control-label {
|
||||
color: #000;
|
||||
font-size: 17px;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.emergency-box-style {
|
||||
padding-bottom: 4px !important;
|
||||
background-color: #eaeaea !important;
|
||||
border: 1px solid #eaeaea !important;
|
||||
}
|
||||
|
||||
.number-list-style {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
.number-list {
|
||||
border: #b0b0b0 1px solid;
|
||||
color: black;
|
||||
border-radius: 7px;
|
||||
width: 40px;
|
||||
height: 40px;
|
||||
text-align: center;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
margin: 32px 0 0 15px;
|
||||
}
|
||||
Reference in New Issue
Block a user