kj
/
now-in-github-bcb-website
1
0
Fork 0
Code Issues 0 Pull Requests 0 Releases 0 Wiki Activity
Browse Source

Added annual Report PDF

master
kj1352 7 years ago
parent
0b36649412
commit
bb707d2a10
8 changed files with 854 additions and 1165 deletions
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. +1
    -1
      .gitignore
  2. +111
    -151
      static/css/about.css
  3. +240
    -334
      static/css/common.css
  4. +429
    -585
      static/css/home.css
  5. +55
    -76
      static/css/service.css
  6. BIN
      static/files/annual-report-17-18.pdf
  7. +13
    -14
      static/scss/home.scss
  8. +5
    -4
      templates/home.html

+ 1
- 1
.gitignore View File

@@ -8,4 +8,4 @@ all_staticfiles/
*.zip *.zip
static/uploaded/ static/uploaded/
node_modules/ node_modules/
virtualenv/

+ 111
- 151
static/css/about.css View File

@@ -1,29 +1,24 @@
@font-face { @font-face {
src: url("fonts/Archivo_Black/ArchivoBlack-Regular.ttf") format("truetype"); src: url("fonts/Archivo_Black/ArchivoBlack-Regular.ttf") format("truetype");
font-family: archivo-black; font-family: archivo-black;
font-style: normal;
}
font-style: normal; }
@font-face { @font-face {
src: url("fonts/Open_Sans/OpenSans-Bold.ttf") format("truetype"); src: url("fonts/Open_Sans/OpenSans-Bold.ttf") format("truetype");
font-family: open-sans; font-family: open-sans;
font-weight: bolder;
}
font-weight: bolder; }
@font-face { @font-face {
src: url("fonts/Open_Sans/OpenSans-SemiBold.ttf") format("truetype"); src: url("fonts/Open_Sans/OpenSans-SemiBold.ttf") format("truetype");
font-family: open-sans; font-family: open-sans;
font-weight: bold;
}
font-weight: bold; }
@font-face { @font-face {
src: url("fonts/Open_Sans/OpenSans-Regular.ttf") format("truetype"); src: url("fonts/Open_Sans/OpenSans-Regular.ttf") format("truetype");
font-family: open-sans; font-family: open-sans;
font-style: normal;
}
font-style: normal; }
@font-face { @font-face {
src: url("fonts/Open_Sans/OpenSans-LightItalic.ttf") format("truetype"); src: url("fonts/Open_Sans/OpenSans-LightItalic.ttf") format("truetype");
font-family: open-sans; font-family: open-sans;
font-weight: normal; font-weight: normal;
font-style: italic;
}
font-style: italic; }
.banner { .banner {
height: 30vh; height: 30vh;
background-image: url("../images/cover-image.jpg"); background-image: url("../images/cover-image.jpg");
@@ -31,158 +26,123 @@
background-repeat: no-repeat; background-repeat: no-repeat;
display: flex; display: flex;
justify-content: center; justify-content: center;
position: relative;
}
.banner:after {
content: "";
width: 100%;
height: 100%;
position: absolute;
background-color: rgba(64, 62, 65, 0.6);
}
.banner h3 {
text-align: center;
align-self: center;
font-size: 36px;
color: white;
z-index: 1;
}
position: relative; }
.banner:after {
content: '';
width: 100%;
height: 100%;
position: absolute;
background-color: rgba(64, 62, 65, 0.6); }
.banner h3 {
text-align: center;
align-self: center;
font-size: 36px;
color: white;
z-index: 1; }


.about-content { .about-content {
margin: 50px auto; margin: 50px auto;
line-height: 1.8; line-height: 1.8;
letter-spacing: 0.8px; letter-spacing: 0.8px;
color: #808285; color: #808285;
border-bottom: 1px solid #f1f1f1;
}
.about-content .inner-container {
display: flex;
justify-content: space-between;
width: 90%;
margin: 0 auto;
}
@media screen and (max-width: 1024px) {
border-bottom: 1px solid #f1f1f1; }
.about-content .inner-container { .about-content .inner-container {
flex-direction: column;
}
}
.about-content .inner-container .description {
width: 60%;
align-self: center;
display: flex;
justify-content: space-between;
flex-direction: column;
}
@media screen and (max-width: 1024px) {
.about-content .inner-container .description {
width: 100%;
}
}
.about-content .inner-container .description p {
width: 100%;
}
.about-content .inner-container .description mark {
color: #28aae2;
}
.about-content .inner-container .description .heading {
font-weight: bold;
font-size: 36px;
font-family: archivo-black;
color: #403e41;
}
.about-content figure {
width: 37%;
align-self: center;
display: flex;
height: 50vh;
}
@media screen and (max-width: 1024px) {
display: flex;
justify-content: space-between;
width: 90%;
margin: 0 auto; }
@media screen and (max-width: 1024px) {
.about-content .inner-container {
flex-direction: column; } }
.about-content .inner-container .description {
width: 60%;
align-self: center;
display: flex;
justify-content: space-between;
flex-direction: column; }
@media screen and (max-width: 1024px) {
.about-content .inner-container .description {
width: 100%; } }
.about-content .inner-container .description p {
width: 100%; }
.about-content .inner-container .description mark {
color: #28aae2; }
.about-content .inner-container .description .heading {
font-weight: bold;
font-size: 36px;
font-family: archivo-black;
color: #403e41; }
.about-content figure { .about-content figure {
width: 100%;
}
}
.about-content figure img {
width: 100%;
align-self: center;
height: 100%;
object-fit: cover;
object-position: top;
}
.about-content p {
width: 90%;
margin: 0 auto 0;
padding-bottom: 50px;
}
@media screen and (max-width: 1024px) {
width: 37%;
align-self: center;
display: flex;
height: 50vh; }
@media screen and (max-width: 1024px) {
.about-content figure {
width: 100%; } }
.about-content figure img {
width: 100%;
align-self: center;
height: 100%;
object-fit: cover;
object-position: top; }
.about-content p { .about-content p {
margin: 0 auto;
}
}
.about-content .features {
width: 90%;
margin: 20px auto;
}
.about-content .features h3 {
margin-bottom: 10px;
}
.about-content .features p {
width: 100%;
padding: 0;
}
.about-content .features ul {
margin-bottom: 20px;
margin-left: 30px;
}
width: 90%;
margin: 0 auto 0;
padding-bottom: 50px; }
@media screen and (max-width: 1024px) {
.about-content p {
margin: 0 auto; } }
.about-content .features {
width: 90%;
margin: 20px auto; }
.about-content .features h3 {
margin-bottom: 10px; }
.about-content .features p {
width: 100%;
padding: 0; }
.about-content .features ul {
margin-bottom: 20px;
margin-left: 30px; }


#our-team { #our-team {
width: 90%; width: 90%;
margin: 30px auto 100px;
}
#our-team h3 {
font-size: 36px;
color: #403e41;
text-align: center;
font-family: archivo-black;
}
#our-team h3 marked {
color: #28aae2;
display: inline;
}
#our-team marked {
color: #28aae2;
padding: 10px 0 0;
text-align: center;
display: block;
font-weight: bold;
}
#our-team .owl-team {
margin: 50px 0;
}
#our-team .section-container {
margin: 0 20px;
}
#our-team figure {
width: 100%;
display: block;
margin: 0 auto;
}
#our-team figure img {
width: 100%;
}
#our-team p {
text-align: center;
margin-top: 10px;
}
#our-team .owl-team-btn {
margin: 20px auto;
text-align: center;
padding: 20px 0;
}
#our-team .owl-team-btn i {
font-size: 16px;
padding: 0 10px;
color: #28aae2;
cursor: pointer;
}
margin: 30px auto 100px; }
#our-team h3 {
font-size: 36px;
color: #403e41;
text-align: center;
font-family: archivo-black; }
#our-team h3 marked {
color: #28aae2;
display: inline; }
#our-team marked {
color: #28aae2;
padding: 10px 0 0;
text-align: center;
display: block;
font-weight: bold; }
#our-team .owl-team {
margin: 50px 0; }
#our-team .section-container {
margin: 0 20px; }
#our-team figure {
width: 100%;
display: block;
margin: 0 auto; }
#our-team figure img {
width: 100%; }
#our-team p {
text-align: center;
margin-top: 10px; }
#our-team .owl-team-btn {
margin: 20px auto;
text-align: center;
padding: 20px 0; }
#our-team .owl-team-btn i {
font-size: 16px;
padding: 0 10px;
color: #28aae2;
cursor: pointer; }


/*# sourceMappingURL=about.css.map */ /*# sourceMappingURL=about.css.map */

+ 240
- 334
static/css/common.css View File

@@ -1,55 +1,44 @@
@font-face { @font-face {
src: url("fonts/Archivo_Black/ArchivoBlack-Regular.ttf") format("truetype"); src: url("fonts/Archivo_Black/ArchivoBlack-Regular.ttf") format("truetype");
font-family: archivo-black; font-family: archivo-black;
font-style: normal;
}
font-style: normal; }
@font-face { @font-face {
src: url("fonts/Open_Sans/OpenSans-Bold.ttf") format("truetype"); src: url("fonts/Open_Sans/OpenSans-Bold.ttf") format("truetype");
font-family: open-sans; font-family: open-sans;
font-weight: bolder;
}
font-weight: bolder; }
@font-face { @font-face {
src: url("fonts/Open_Sans/OpenSans-SemiBold.ttf") format("truetype"); src: url("fonts/Open_Sans/OpenSans-SemiBold.ttf") format("truetype");
font-family: open-sans; font-family: open-sans;
font-weight: bold;
}
font-weight: bold; }
@font-face { @font-face {
src: url("fonts/Open_Sans/OpenSans-Regular.ttf") format("truetype"); src: url("fonts/Open_Sans/OpenSans-Regular.ttf") format("truetype");
font-family: open-sans; font-family: open-sans;
font-style: normal;
}
font-style: normal; }
@font-face { @font-face {
src: url("fonts/Open_Sans/OpenSans-LightItalic.ttf") format("truetype"); src: url("fonts/Open_Sans/OpenSans-LightItalic.ttf") format("truetype");
font-family: open-sans; font-family: open-sans;
font-weight: normal; font-weight: normal;
font-style: italic;
}
font-style: italic; }
*, *:before, *:after { *, *:before, *:after {
-webkit-tap-highlight-color: transparent; -webkit-tap-highlight-color: transparent;
box-sizing: border-box;
}
box-sizing: border-box; }


* { * {
margin: 0; margin: 0;
padding: 0; padding: 0;
box-sizing: border-box;
}
box-sizing: border-box; }


a { a {
color: inherit; color: inherit;
text-decoration: none;
}
text-decoration: none; }


html, body { html, body {
font-family: open-sans;
}
html.non-scrollable, body.non-scrollable {
overflow: hidden;
}
font-family: open-sans; }
html.non-scrollable, body.non-scrollable {
overflow: hidden; }


mark { mark {
background-color: transparent;
}
background-color: transparent; }


.temp-intro, .temp-intro,
.temp-intro-home, .temp-intro-home,
@@ -59,97 +48,76 @@ mark {
justify-content: space-between; justify-content: space-between;
padding: 15px 0; padding: 15px 0;
color: #808285; color: #808285;
font-size: 14px;
}
.temp-intro .temp-name,
.temp-intro-home .temp-name,
#footer .temp-name {
margin-left: 125px;
}
@media screen and (max-width: 1024px) {
font-size: 14px; }
.temp-intro .temp-name, .temp-intro .temp-name,
.temp-intro-home .temp-name,
#footer .temp-name {
margin-left: 20px;
}
}
.temp-intro .temp-name mark,
.temp-intro-home .temp-name mark,
#footer .temp-name mark {
color: white;
font-weight: bold;
letter-spacing: 0.8px;
}
.temp-intro .temp-social,
.temp-intro-home .temp-social,
#footer .temp-social {
display: flex;
margin-right: 125px;
}
@media screen and (max-width: 1024px) {
.temp-intro-home .temp-name,
#footer .temp-name {
margin-left: 125px; }
@media screen and (max-width: 1024px) {
.temp-intro .temp-name,
.temp-intro-home .temp-name,
#footer .temp-name {
margin-left: 20px; } }
.temp-intro .temp-name mark,
.temp-intro-home .temp-name mark,
#footer .temp-name mark {
color: white;
font-weight: bold;
letter-spacing: 0.8px; }
.temp-intro .temp-social, .temp-intro .temp-social,
.temp-intro-home .temp-social,
#footer .temp-social {
margin-right: 20px;
}
}
.temp-intro .temp-social li,
.temp-intro-home .temp-social li,
#footer .temp-social li {
list-style: none;
align-self: center;
padding: 0 10px;
font-size: 12px;
}
.temp-intro small,
.temp-intro-home small,
#footer small {
font-size: 14px;
}
@media screen and (max-width: 1024px) {
.temp-intro-home .temp-social,
#footer .temp-social {
display: flex;
margin-right: 125px; }
@media screen and (max-width: 1024px) {
.temp-intro .temp-social,
.temp-intro-home .temp-social,
#footer .temp-social {
margin-right: 20px; } }
.temp-intro .temp-social li,
.temp-intro-home .temp-social li,
#footer .temp-social li {
list-style: none;
align-self: center;
padding: 0 10px;
font-size: 12px; }
.temp-intro small, .temp-intro small,
.temp-intro-home small,
#footer small {
display: block;
text-align: center;
padding: 5px 0;
}
}
.temp-intro small:first-child,
.temp-intro-home small:first-child,
#footer small:first-child {
margin-left: 125px;
}
@media screen and (max-width: 1024px) {
.temp-intro small:first-child,
.temp-intro-home small:first-child,
#footer small:first-child {
margin: 0;
}
}
.temp-intro small:last-child,
.temp-intro-home small:last-child,
#footer small:last-child {
margin-right: 125px;
}
@media screen and (max-width: 1024px) {
.temp-intro small:last-child,
.temp-intro-home small:last-child,
#footer small:last-child {
margin: 0;
}
}
.temp-intro small mark,
.temp-intro-home small mark,
#footer small mark {
color: #d2d4d5;
}
.temp-intro-home small,
#footer small {
font-size: 14px; }
@media screen and (max-width: 1024px) {
.temp-intro small,
.temp-intro-home small,
#footer small {
display: block;
text-align: center;
padding: 5px 0; } }
.temp-intro small:first-child,
.temp-intro-home small:first-child,
#footer small:first-child {
margin-left: 125px; }
@media screen and (max-width: 1024px) {
.temp-intro small:first-child,
.temp-intro-home small:first-child,
#footer small:first-child {
margin: 0; } }
.temp-intro small:last-child,
.temp-intro-home small:last-child,
#footer small:last-child {
margin-right: 125px; }
@media screen and (max-width: 1024px) {
.temp-intro small:last-child,
.temp-intro-home small:last-child,
#footer small:last-child {
margin: 0; } }
.temp-intro small mark,
.temp-intro-home small mark,
#footer small mark {
color: #d2d4d5; }


@media screen and (max-width: 1024px) { @media screen and (max-width: 1024px) {
#footer { #footer {
display: block;
}
}
display: block; } }


#page-header { #page-header {
height: 20vh; height: 20vh;
@@ -159,243 +127,181 @@ mark {
left: 0; left: 0;
background-color: white; background-color: white;
z-index: 100; z-index: 100;
transition: height 500ms linear;
}
@media screen and (max-width: 1024px) {
#page-header {
transition: height 500ms linear; }
@media screen and (max-width: 1024px) {
#page-header {
height: 10vh; } }
#page-header.minimize {
height: 10vh; height: 10vh;
}
}
#page-header.minimize {
height: 10vh;
padding: 10px 0;
}
#page-header .inner-header {
width: 90%;
display: flex;
justify-content: space-between;
margin: 0 auto;
align-self: center;
}
@media screen and (max-width: 1024px) {
padding: 10px 0; }
#page-header .inner-header { #page-header .inner-header {
width: 100%;
justify-content: none;
}
}
#page-header .temp-brand {
display: flex;
align-self: center;
width: auto;
justify-content: center;
cursor: pointer;
}
@media screen and (max-width: 1024px) {
width: 90%;
display: flex;
justify-content: space-between;
margin: 0 auto;
align-self: center; }
@media screen and (max-width: 1024px) {
#page-header .inner-header {
width: 100%;
justify-content: none; } }
#page-header .temp-brand { #page-header .temp-brand {
justify-content: unset;
width: calc(100% -55px);
}
}
#page-header .temp-brand figure {
margin-right: 15px;
width: 60px;
height: 60px;
}
#page-header .temp-brand figure img {
width: 100%;
height: 100%;
}
#page-header .temp-brand h1 {
font-size: 20px;
align-self: center;
letter-spacing: -0.65px;
font-family: "Archivo Black", sans-serif;
}
@media screen and (max-width: 1024px) {
#page-header .temp-brand h1 {
font-size: 15px;
}
}
#page-header .temp-brand h1 mark {
color: #28aae2;
}
#page-header #desktop-navigation-menu {
width: 55%;
align-self: center;
font-size: 16px;
}
@media screen and (max-width: 1024px) {
display: flex;
align-self: center;
width: auto;
justify-content: center;
cursor: pointer; }
@media screen and (max-width: 1024px) {
#page-header .temp-brand {
justify-content: unset;
width: calc(100% -55px); } }
#page-header .temp-brand figure {
margin-right: 15px;
width: 60px;
height: 60px; }
#page-header .temp-brand figure img {
width: 100%;
height: 100%; }
#page-header .temp-brand h1 {
font-size: 20px;
align-self: center;
letter-spacing: -0.65px;
font-family: 'Archivo Black', sans-serif; }
@media screen and (max-width: 1024px) {
#page-header .temp-brand h1 {
font-size: 15px; } }
#page-header .temp-brand h1 mark {
color: #28aae2; }
#page-header #desktop-navigation-menu { #page-header #desktop-navigation-menu {
display: none;
}
}
#page-header #desktop-navigation-menu ul {
display: flex;
justify-content: space-between;
}
#page-header #desktop-navigation-menu ul li {
list-style: none;
color: #808285;
}
#page-header #desktop-navigation-menu ul li.active {
color: #28aae2;
}
#page-header #mobile-hamburger-menu {
display: none;
position: relative;
height: 25px;
}
@media screen and (max-width: 1024px) {
#page-header #mobile-hamburger-menu {
width: 45px;
}
}
#page-header #mobile-hamburger-menu.active .icon-line {
transform: rotate(45deg) translate(2px, 10px);
}
#page-header #mobile-hamburger-menu.active .icon-line:after {
transform: rotate(-95deg) translate(20px, 2px);
}
#page-header #mobile-hamburger-menu.active .icon-line:before {
opacity: 0;
}
@media screen and (max-width: 1024px) {
#page-header #mobile-hamburger-menu {
display: block;
width: 55%;
align-self: center; align-self: center;
}
}
#page-header #mobile-hamburger-menu .icon-line {
display: inline-block;
width: 35px;
height: 5px;
background-color: black;
position: absolute;
transition: transform 500ms ease;
}
#page-header #mobile-hamburger-menu .icon-line:before, #page-header #mobile-hamburger-menu .icon-line:after {
content: "";
display: inline-block;
width: 35px;
height: 5px;
position: absolute;
}
#page-header #mobile-hamburger-menu .icon-line:before {
top: 200%;
background-color: #28aae2;
transition: opacity 500ms ease;
}
#page-header #mobile-hamburger-menu .icon-line:after {
top: 400%;
background-color: black;
transition: transform 500ms ease;
}
font-size: 16px; }
@media screen and (max-width: 1024px) {
#page-header #desktop-navigation-menu {
display: none; } }
#page-header #desktop-navigation-menu ul {
display: flex;
justify-content: space-between; }
#page-header #desktop-navigation-menu ul li {
list-style: none;
color: #808285; }
#page-header #desktop-navigation-menu ul li.active {
color: #28aae2; }
#page-header #mobile-hamburger-menu {
display: none;
position: relative;
height: 25px; }
@media screen and (max-width: 1024px) {
#page-header #mobile-hamburger-menu {
width: 45px; } }
#page-header #mobile-hamburger-menu.active .icon-line {
transform: rotate(45deg) translate(2px, 10px); }
#page-header #mobile-hamburger-menu.active .icon-line:after {
transform: rotate(-95deg) translate(20px, 2px); }
#page-header #mobile-hamburger-menu.active .icon-line:before {
opacity: 0; }
@media screen and (max-width: 1024px) {
#page-header #mobile-hamburger-menu {
display: block;
align-self: center; } }
#page-header #mobile-hamburger-menu .icon-line {
display: inline-block;
width: 35px;
height: 5px;
background-color: black;
position: absolute;
transition: transform 500ms ease; }
#page-header #mobile-hamburger-menu .icon-line:before, #page-header #mobile-hamburger-menu .icon-line:after {
content: '';
display: inline-block;
width: 35px;
height: 5px;
position: absolute; }
#page-header #mobile-hamburger-menu .icon-line:before {
top: 200%;
background-color: #28aae2;
transition: opacity 500ms ease; }
#page-header #mobile-hamburger-menu .icon-line:after {
top: 400%;
background-color: black;
transition: transform 500ms ease; }


#mobile-nav-menu { #mobile-nav-menu {
display: none;
}
@media screen and (max-width: 1024px) {
#mobile-nav-menu {
display: block;
height: 0;
overflow: hidden;
position: sticky;
top: 10vh;
z-index: 5;
background-color: white;
transition: height 500ms ease;
}
#mobile-nav-menu.show {
height: 90vh;
}
#mobile-nav-menu.show ul {
margin-top: 50px;
}
#mobile-nav-menu.show li {
opacity: 1;
}
#mobile-nav-menu ul li {
list-style: none;
font-size: 36px;
text-align: center;
padding: 10px 0;
opacity: 0;
transition: opacity 500ms ease;
}
}
display: none; }
@media screen and (max-width: 1024px) {
#mobile-nav-menu {
display: block;
height: 0;
overflow: hidden;
position: sticky;
top: 10vh;
z-index: 5;
background-color: white;
transition: height 500ms ease; }
#mobile-nav-menu.show {
height: 90vh; }
#mobile-nav-menu.show ul {
margin-top: 50px; }
#mobile-nav-menu.show li {
opacity: 1; }
#mobile-nav-menu ul li {
list-style: none;
font-size: 36px;
text-align: center;
padding: 10px 0;
opacity: 0;
transition: opacity 500ms ease; } }


.temp-contact-info { .temp-contact-info {
background-color: #fafafa; background-color: #fafafa;
border-top: 1px solid #d2d4d5; border-top: 1px solid #d2d4d5;
color: #57595b;
}
.temp-contact-info ul {
display: flex;
width: 80%;
margin: 0 auto;
}
@media screen and (max-width: 1024px) {
color: #57595b; }
.temp-contact-info ul { .temp-contact-info ul {
width: 100%;
}
}
.temp-contact-info ul .owl-item img {
width: 10%;
}
.temp-contact-info ul li {
list-style: none;
border-left: 2px solid #d2d4d5;
font-size: 14px;
display: flex;
justify-content: center;
width: 35%;
padding: 20px 0;
}
@media screen and (max-width: 1024px) {
.temp-contact-info ul li {
width: 40%;
}
.temp-contact-info ul li .contact-content {
display: none;
}
.temp-contact-info ul li img {
width: 35%;
}
.temp-contact-info ul li.active {
width: 100%;
}
.temp-contact-info ul li.active img {
width: 10%;
}
.temp-contact-info ul li.active .contact-content {
display: block;
}
}
.temp-contact-info ul li:last-child {
border-right: 2px solid #d2d4d5;
}
.temp-contact-info ul li img {
width: 10%;
align-self: center;
}
@media screen and (max-width: 1024px) {
.temp-contact-info ul li img {
width: 30%;
}
}
.temp-contact-info ul li .contact-content {
margin-left: 20px;
color: #808285;
}
.temp-contact-info ul li .contact-content span {
display: block;
}
.temp-contact-info ul li .contact-content span:last-child {
color: #28aae2;
}
.temp-contact-info ul li .contact-content a {
display: block;
color: #28aae2;
}
display: flex;
width: 80%;
margin: 0 auto; }
@media screen and (max-width: 1024px) {
.temp-contact-info ul {
width: 100%; } }
.temp-contact-info ul .owl-item img {
width: 10%; }
.temp-contact-info ul li {
list-style: none;
border-left: 2px solid #d2d4d5;
font-size: 14px;
display: flex;
justify-content: center;
width: 35%;
padding: 20px 0; }
@media screen and (max-width: 1024px) {
.temp-contact-info ul li {
width: 40%; }
.temp-contact-info ul li .contact-content {
display: none; }
.temp-contact-info ul li img {
width: 35%; }
.temp-contact-info ul li.active {
width: 100%; }
.temp-contact-info ul li.active img {
width: 10%; }
.temp-contact-info ul li.active .contact-content {
display: block; } }
.temp-contact-info ul li:last-child {
border-right: 2px solid #d2d4d5; }
.temp-contact-info ul li img {
width: 10%;
align-self: center; }
@media screen and (max-width: 1024px) {
.temp-contact-info ul li img {
width: 30%; } }
.temp-contact-info ul li .contact-content {
margin-left: 20px;
color: #808285; }
.temp-contact-info ul li .contact-content span {
display: block; }
.temp-contact-info ul li .contact-content span:last-child {
color: #28aae2; }
.temp-contact-info ul li .contact-content a {
display: block;
color: #28aae2; }


/*# sourceMappingURL=common.css.map */ /*# sourceMappingURL=common.css.map */

+ 429
- 585
static/css/home.css
File diff suppressed because it is too large
View File


+ 55
- 76
static/css/service.css View File

@@ -1,29 +1,24 @@
@font-face { @font-face {
src: url("fonts/Archivo_Black/ArchivoBlack-Regular.ttf") format("truetype"); src: url("fonts/Archivo_Black/ArchivoBlack-Regular.ttf") format("truetype");
font-family: archivo-black; font-family: archivo-black;
font-style: normal;
}
font-style: normal; }
@font-face { @font-face {
src: url("fonts/Open_Sans/OpenSans-Bold.ttf") format("truetype"); src: url("fonts/Open_Sans/OpenSans-Bold.ttf") format("truetype");
font-family: open-sans; font-family: open-sans;
font-weight: bolder;
}
font-weight: bolder; }
@font-face { @font-face {
src: url("fonts/Open_Sans/OpenSans-SemiBold.ttf") format("truetype"); src: url("fonts/Open_Sans/OpenSans-SemiBold.ttf") format("truetype");
font-family: open-sans; font-family: open-sans;
font-weight: bold;
}
font-weight: bold; }
@font-face { @font-face {
src: url("fonts/Open_Sans/OpenSans-Regular.ttf") format("truetype"); src: url("fonts/Open_Sans/OpenSans-Regular.ttf") format("truetype");
font-family: open-sans; font-family: open-sans;
font-style: normal;
}
font-style: normal; }
@font-face { @font-face {
src: url("fonts/Open_Sans/OpenSans-LightItalic.ttf") format("truetype"); src: url("fonts/Open_Sans/OpenSans-LightItalic.ttf") format("truetype");
font-family: open-sans; font-family: open-sans;
font-weight: normal; font-weight: normal;
font-style: italic;
}
font-style: italic; }
.banner { .banner {
height: 30vh; height: 30vh;
background-image: url("../images/cover-image.jpg"); background-image: url("../images/cover-image.jpg");
@@ -31,77 +26,61 @@
background-repeat: no-repeat; background-repeat: no-repeat;
display: flex; display: flex;
justify-content: center; justify-content: center;
position: relative;
}
.banner:after {
content: "";
width: 100%;
height: 100%;
position: absolute;
background-color: rgba(64, 62, 65, 0.6);
}
.banner h3 {
text-align: center;
align-self: center;
font-size: 36px;
color: white;
z-index: 1;
}
position: relative; }
.banner:after {
content: '';
width: 100%;
height: 100%;
position: absolute;
background-color: rgba(64, 62, 65, 0.6); }
.banner h3 {
text-align: center;
align-self: center;
font-size: 36px;
color: white;
z-index: 1; }


.service-content { .service-content {
width: 90%; width: 90%;
margin: 60px auto; margin: 60px auto;
display: flex; display: flex;
justify-content: space-between;
}
.service-content .scene-container {
overflow: hidden;
width: 70%;
background-color: #f0f0f0;
}
.service-content object {
overflow-x: hidden;
display: none;
width: 100%;
height: 100%;
}
.service-content object.active {
display: block;
}
@media screen and (max-width: 1024px) {
.service-content object.active {
justify-content: space-between; }
.service-content .scene-container {
overflow: hidden;
width: 70%;
background-color: #f0f0f0; }
.service-content object {
overflow-x: hidden;
display: none; display: none;
}
}
.service-content iframe {
display: none;
}
@media screen and (max-width: 1024px) {
.service-content iframe.active {
display: block;
}
}
.service-content ul {
width: 25%;
display: flex;
flex-direction: column;
justify-content: space-evenly;
}
.service-content ul li {
list-style: none;
padding: 10% 0;
border-bottom: 2px solid white;
text-align: center;
cursor: pointer;
background-color: #fcfcfc;
color: #808285;
}
.service-content ul li.active {
background-color: #28aae2;
color: white;
}
.service-content ul li:last-child {
border-bottom: none;
}
width: 100%;
height: 100%; }
.service-content object.active {
display: block; }
@media screen and (max-width: 1024px) {
.service-content object.active {
display: none; } }
.service-content iframe {
display: none; }
@media screen and (max-width: 1024px) {
.service-content iframe.active {
display: block; } }
.service-content ul {
width: 25%;
display: flex;
flex-direction: column;
justify-content: space-evenly; }
.service-content ul li {
list-style: none;
padding: 10% 0;
border-bottom: 2px solid white;
text-align: center;
cursor: pointer;
background-color: #fcfcfc;
color: #808285; }
.service-content ul li.active {
background-color: #28aae2;
color: white; }
.service-content ul li:last-child {
border-bottom: none; }


/*# sourceMappingURL=service.css.map */ /*# sourceMappingURL=service.css.map */

BIN
static/files/annual-report-17-18.pdf View File


+ 13
- 14
static/scss/home.scss View File

@@ -121,10 +121,10 @@ section {
button { button {
transition-delay: 1000ms; transition-delay: 1000ms;
} }


&.hide { &.hide {
h3, h3,
p, p,
button { button {
@@ -166,7 +166,7 @@ section {
} }
} }


#home,
#home,
#about { #about {
position: relative; position: relative;


@@ -349,7 +349,7 @@ section {
margin: 20px auto; margin: 20px auto;
text-align: center; text-align: center;
padding: 20px 0; padding: 20px 0;
i { i {
font-size: 16px; font-size: 16px;
padding: 0 10px; padding: 0 10px;
@@ -478,7 +478,7 @@ section {
} }


form { form {
fieldset { fieldset {
border: none; border: none;
width: 35%; width: 35%;
@@ -502,7 +502,7 @@ section {
} }
} }


::-webkit-input-placeholder {
::-webkit-input-placeholder {
color: $white_shade; color: $white_shade;


@media screen and (max-width: 1024px) { @media screen and (max-width: 1024px) {
@@ -510,7 +510,7 @@ section {
} }
} }


::-moz-placeholder {
::-moz-placeholder {
color: $white_shade; color: $white_shade;


@media screen and (max-width: 1024px) { @media screen and (max-width: 1024px) {
@@ -518,7 +518,7 @@ section {
} }
} }


:-ms-input-placeholder {
:-ms-input-placeholder {
color: $white_shade; color: $white_shade;


@media screen and (max-width: 1024px) { @media screen and (max-width: 1024px) {
@@ -526,7 +526,7 @@ section {
} }
} }


:-moz-placeholder {
:-moz-placeholder {
color: $white_shade; color: $white_shade;


@media screen and (max-width: 1024px) { @media screen and (max-width: 1024px) {
@@ -584,7 +584,7 @@ section {
justify-content: space-between; justify-content: space-between;


@media screen and (max-width: 1024px) { @media screen and (max-width: 1024px) {
flex-direction: column;
flex-direction: column;
width: 90%; width: 90%;
} }


@@ -618,7 +618,7 @@ section {
font-size: $paragraph_size; font-size: $paragraph_size;
color: $brown; color: $brown;
font-family: open-sans; font-family: open-sans;
font-style: normal;
font-style: normal;
line-height: 1.8; line-height: 1.8;
} }


@@ -689,7 +689,7 @@ section {
cursor: pointer; cursor: pointer;
display: flex; display: flex;
transition: tranform 500ms ease; transition: tranform 500ms ease;


img { img {
width: 20px; width: 20px;
@@ -705,8 +705,7 @@ section {
color: white; color: white;
text-decoration: underline; text-decoration: underline;
font-size: 14px; font-size: 14px;
margin: 0 0 10px 0;
} }
} }
} }



+ 5
- 4
templates/home.html View File

@@ -10,7 +10,8 @@
<header>ANNOUNCEMENTS</header> <header>ANNOUNCEMENTS</header>
<div class="close-toast"><img src="{% static 'images/down-chevron.svg' %}" alt=""></div> <div class="close-toast"><img src="{% static 'images/down-chevron.svg' %}" alt=""></div>
<ul> <ul>
<li><a href="{% static 'files/gbm-notice-17-18.pdf' %}" target="_blank">General Body Meeting Notice 2017-2018 (Click to View/Download)</a></li>
<li><a href="{% static 'files/gbm-notice-17-18.pdf' %}" target="_blank">General Body Meeting Notice 2017-2018.</a></li>
<li><a href="{% static 'files/annual-report-17-18.pdf' %}" target="_blank">Annual Report 2017-18.</a></li>
</ul> </ul>
</section> </section>
<div class="temp-intro-home"> <div class="temp-intro-home">
@@ -170,7 +171,7 @@
<a href="/loans" class="inner-contents"> <a href="/loans" class="inner-contents">
<img src="{% static 'images/payment-method.svg' %}" alt=""> <img src="{% static 'images/payment-method.svg' %}" alt="">
<div class="title">LOANS AND ADVANCES</div> <div class="title">LOANS AND ADVANCES</div>
<p>
<p>
Get a step closer to fulfilling your dreams by applying for personal loan Get a step closer to fulfilling your dreams by applying for personal loan
and meet your financial needs at attractive interest rates. and meet your financial needs at attractive interest rates.
</p> </p>
@@ -180,7 +181,7 @@
<a href="/others" class="inner-contents"> <a href="/others" class="inner-contents">
<img src="{% static 'images/bank-building.svg' %}" alt=""> <img src="{% static 'images/bank-building.svg' %}" alt="">
<div class="title">OTHER SERVICES</div> <div class="title">OTHER SERVICES</div>
<p> Time is money and we at Barath Co-Operative Bank value your time.
<p> Time is money and we at Barath Co-Operative Bank value your time.
Change the way you bank. Change the way you bank.
</p> </p>
</a> </a>
@@ -194,7 +195,7 @@
<section id="branches"> <section id="branches">
<h3>BRANCHES</h3> <h3>BRANCHES</h3>
<p> <p>
Weekly Holidays: Sunday, 2nd and 4th Saturdays.
Weekly Holidays: Sunday, 2nd and 4th Saturdays.
</p> </p>
<div class="owl-carousel owl-branches"> <div class="owl-carousel owl-branches">
<div class="owl-item-branches"> <div class="owl-item-branches">


Write Preview
Loading…
Cancel
Save