n.kolosnaj/Globaly-CSS-Practice
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

commit

Browse Source
This commit is contained in:
nkolosnjaj
2024-06-04 16:56:07 +02:00
parent e16c7995c4
commit 84194c85fe
31 changed files with 1305 additions and 2 deletions
Download Patch File Download Diff File Expand all files Collapse all files

8
style/_menu.scss
View File

@@ -52,6 +52,14 @@ span {
height: 50px;
background-color: white;
}
.dropdown-content .navs a{
color: #333333;
}
.dropdown-content .navs a:hover{
color: white;
}
.links{
background-color: #333333;

56
style/about_us/_email-form-au.scss Normal file
View File

@@ -0,0 +1,56 @@
.email-form-au{
padding: 30px 15px;
background-color: #15c1cb;
.email-title{
font-style: normal;
font-weight: 500;
font-size: 24px;
line-height: 1.38462;
font-family: Merriweather, serif;
letter-spacing: 0px;
text-align: inherit;
color: #ffffff;
}
.email-text{
padding: 0 10px;
text-align: center;
font-style: normal;
font-weight: 400;
font-size: 16px;
line-height: 1.4375;
font-family: MerriweatherSans, sans-serif;
letter-spacing: 0px;
color: #ffffff;
}
.subscribe {
@include button;
background-color: white;
color: #15c1cb !important;
margin-top: 20px;
}
.subscribe:hover {
color: white !important;
background-color: transparent;
border: solid 2px white;
transition: 0.2s;
}
.input-text{
padding: 18px 20px;
border: none;
background-color: #f6f6f6;
margin: 0 0 20px;
color: #777777 !important;
width: 93%;
font-family: MerriweatherSans;
}
.input-text::placeholder{
color: #31353d !important;
}
}

47
style/about_us/_fifth-part-au.scss Normal file
View File

@@ -0,0 +1,47 @@
.fifth-part-au {
background-image: url('/assets/images/image30.jpg');
background-size: cover;
position: relative;
color: white;
background-size: cover;
background-position: center;
padding-top: 30px;
padding-bottom: 40px;
.careers {
@include button;
background-color: transparent;
border: solid 2px white;
}
.careers:hover {
background-color: white;
color: #333333 !important;
transition: 0.2s;
}
.textbox5 {
.h3-fifth {
text-align: center;
font-style: normal;
font-weight: 300;
font-size: 37px;
line-height: 1.33333;
font-family: Merriweather;
letter-spacing: 0px;
word-wrap: break-word;
margin-bottom: 0px;
}
.h2-fifth {
text-align: center;
font-style: normal;
font-weight: 700;
font-size: 45px;
line-height: 1.36957;
font-family: Merriweather, serif;
letter-spacing: 0px;
color: #15c1cb;
}
}
}

46
style/about_us/_first-part-au.scss Normal file
View File

@@ -0,0 +1,46 @@
.first-part-au{
padding: 0 15px;
.text-box{
border: 1px solid #ebebeb;
padding: 24px 15px 8px 15px;
margin-bottom: 30px;
}
h2{
border-bottom: 1px solid #e0e0e8;
padding: 5px 0 19px 0;
font-size: 21px;
font-weight: 400;
font-family: Merriweather;
color: #31353d;
letter-spacing: 0px;
line-height: 1.5;
}
.p-1{
padding: 17px 0 0 0 !important;
margin-bottom: 16px;
font-style: normal;
font-weight: 400;
font-size: 16px;
line-height: 1.4375;
font-family: MerriweatherSans , serif;
letter-spacing: 0px;
text-align: left;
color: #777777;
}
.p-2{
color: #15c1cb;
font-style: normal;
font-weight: 400;
font-size: 16px;
line-height: 1.4375;
font-family: MerriweatherSans , serif;
letter-spacing: 0px;
padding: 17px 0 0 0 !important;
}
}

53
style/about_us/_fourth-part-au.scss Normal file
View File

@@ -0,0 +1,53 @@
.headline{
.headline-h3{
font-style: normal;
font-weight: 300;
font-size: 26px;
line-height: 1.33333;
font-family: Merriweather, serif;
letter-spacing: 0px;
color: #31353d;
margin-bottom: 0px;
}
.headline-h2{
color: #15c1cb;
font-style: normal;
font-weight: 700;
font-size: 29px;
line-height: 1.36957;
font-family: Merriweather, serif;
letter-spacing: 0px;
margin-bottom: 0px;
}
}
.fourth-part-au{
padding: 0 15px ;
.card-text4{
display:flex;
align-items: start !important;
}
.h4-fourth{
font-family: 'Merriweather', Helvetica, Arial, Lucida, sans-serif;
font-size: 26px;
color: #333333 !important;
line-height: 1.3em;
margin-top: 13px;
font-style: normal;
font-weight: 500;
text-align: start;
}
.p-fourth{
font-style: normal;
font-weight: 400;
font-size: 16px;
line-height: 1.4375;
font-family: MerriweatherSans, sans-serif;
letter-spacing: 0px;
color: #777777;
margin-bottom: 16px;
box-sizing: border-box;
padding-right: 3px;
}
}

44
style/about_us/_header-au.scss Normal file
View File

@@ -0,0 +1,44 @@
.breadcrumb{
background-color: white;
text-decoration: none;
padding-left: .9375rem;
padding-right: .9375rem;
font-style: normal;
font-weight: 900;
font-size: 13px;
line-height: 2.15385;
font-family: $numberfont, sans-serif;
letter-spacing: 0.52px;
text-transform: uppercase;
margin-bottom: 0px;
a{
color: #333333;
text-decoration: none;
}
a:hover{
color: #15c1c6;
transition: 0.3s ease;
}
}
.breadcrumb-item-sep{
margin: 0 .5em;
}
.breadcrumb-item-about{
color: #15c1c6;
}
.img {
min-height: 22vh;
background-image: url('/assets/images/image32.jpg');
background-size: cover;
background-position: center;
}

64
style/about_us/_second-part-au.scss Normal file
View File

@@ -0,0 +1,64 @@
.second-part-au {
padding: 0 15px;
.headline{
.headline-h3{
font-style: normal;
font-weight: 300;
font-size: 26px;
line-height: 1.33333;
font-family: Merriweather, serif;
letter-spacing: 0px;
color: #31353d;
margin-bottom: 0px;
}
.headline-h2{
color: #15c1cb;
font-style: normal;
font-weight: 700;
font-size: 29px;
line-height: 1.36957;
font-family: Merriweather, serif;
letter-spacing: 0px;
margin-bottom: 0px;
}
}
.text-box {
border: 1px solid #ebebeb;
padding: 24px 15px 8px 15px;
margin-bottom: 30px;
}
.second-h2{
border-bottom: 1px solid #e0e0e8;
padding: 5px 0 19px 0;
font-size: 21px;
font-weight: 400;
font-family: Merriweather;
color: #31353d;
letter-spacing: 0px;
line-height: 1.5;
}
.p-1 {
padding: 17px 0 0 0 !important;
margin-bottom: 16px;
font-style: normal;
font-weight: 400;
font-size: 16px;
line-height: 1.4375;
font-family: MerriweatherSans, serif;
letter-spacing: 0px;
text-align: left;
color: #777777;
text-align: center;
}
.second-img{
margin-bottom: 10px;
}
}

56
style/about_us/_sixth-part-au.scss Normal file
View File

@@ -0,0 +1,56 @@
.sixth-part-au {
padding: 0 15px;
.headline-h2 {
text-align: center;
padding: 0 3px;
}
.h5-button{
background-color: #15c1cb;
cursor:pointer;
text-align: start;
color: #ffffff !important;
font-style: normal;
font-weight: 700;
font-size: 16px;
line-height: 1.5;
font-family: Merriweather, serif;
letter-spacing: 0px;
text-decoration: none !important;
padding: 0px !important ;
}
.card-header{
background-color: #15c1cb;
text-decoration: none;
color: white;
margin-bottom: 2px;
}
.card-body{
color: #777777;
font-style: normal;
font-weight: 400;
line-height: 1.4375;
font-family: MerriweatherSans, sans-serif;
letter-spacing: 0px;
margin: 50px 0;
}
.A{
color: #15c1cb;
}
.card-q{
.card-header{
background-color: #333333;
transition: background-color 1s ease;
}
.collapsed {
background-color: #333333;
}
}
}

37
style/about_us/_third-part-au.scss Normal file
View File

@@ -0,0 +1,37 @@
.third-part-au{
min-height: 100vh;
background-image: url('/assets/images/image33.jpg');
background-size: cover;
position: relative;
color: white;
background-size: cover;
background-position: center;
padding-top: 30px;
.numbers-container {
.numbers {
text-align: center;
width: 230px;
line-height: 230px;
border-radius: 50%;
border: solid 4px white;
background-color: transparent;
font-family: Merriweather;
font-weight: bold;
font-size: 40px;
margin-bottom: 24px;
}
.num-text {
text-align: center;
font-family: 'Merriweather', Helvetica, Arial, Lucida, sans-serif;
font-weight: bold;
font-size: 18px;
color: #ffffff !important;
padding-left: 80px;
padding-right: 80px;
margin-bottom: 24px;
}
}
}

382
style/style.css
View File

@@ -240,6 +240,14 @@ span {
background-color: white;
}
.dropdown-content .navs a {
color: #333333;
}
.dropdown-content .navs a:hover {
color: white;
}
.links {
background-color: #333333;
}
@@ -986,4 +994,378 @@ footer .footer-copyright a {
footer .footer-copyright a:hover {
color: #15c1c6;
transition: 0.3s;
}
.first-part-au {
padding: 0 15px;
}
.first-part-au .text-box {
border: 1px solid #ebebeb;
padding: 24px 15px 8px 15px;
margin-bottom: 30px;
}
.first-part-au h2 {
border-bottom: 1px solid #e0e0e8;
padding: 5px 0 19px 0;
font-size: 21px;
font-weight: 400;
font-family: Merriweather;
color: #31353d;
letter-spacing: 0px;
line-height: 1.5;
}
.first-part-au .p-1 {
padding: 17px 0 0 0 !important;
margin-bottom: 16px;
font-style: normal;
font-weight: 400;
font-size: 16px;
line-height: 1.4375;
font-family: MerriweatherSans, serif;
letter-spacing: 0px;
text-align: left;
color: #777777;
}
.first-part-au .p-2 {
color: #15c1cb;
font-style: normal;
font-weight: 400;
font-size: 16px;
line-height: 1.4375;
font-family: MerriweatherSans, serif;
letter-spacing: 0px;
padding: 17px 0 0 0 !important;
}
.breadcrumb {
background-color: white;
text-decoration: none;
padding-left: 0.9375rem;
padding-right: 0.9375rem;
font-style: normal;
font-weight: 900;
font-size: 13px;
line-height: 2.15385;
font-family: "Lato", sans-serif;
letter-spacing: 0.52px;
text-transform: uppercase;
margin-bottom: 0px;
}
.breadcrumb a {
color: #333333;
text-decoration: none;
}
.breadcrumb a:hover {
color: #15c1c6;
transition: 0.3s ease;
}
.breadcrumb-item-sep {
margin: 0 0.5em;
}
.breadcrumb-item-about {
color: #15c1c6;
}
.img {
min-height: 22vh;
background-image: url("/assets/images/image32.jpg");
background-size: cover;
background-position: center;
}
.second-part-au {
padding: 0 15px;
}
.second-part-au .headline .headline-h3 {
font-style: normal;
font-weight: 300;
font-size: 26px;
line-height: 1.33333;
font-family: Merriweather, serif;
letter-spacing: 0px;
color: #31353d;
margin-bottom: 0px;
}
.second-part-au .headline .headline-h2 {
color: #15c1cb;
font-style: normal;
font-weight: 700;
font-size: 29px;
line-height: 1.36957;
font-family: Merriweather, serif;
letter-spacing: 0px;
margin-bottom: 0px;
}
.second-part-au .text-box {
border: 1px solid #ebebeb;
padding: 24px 15px 8px 15px;
margin-bottom: 30px;
}
.second-part-au .second-h2 {
border-bottom: 1px solid #e0e0e8;
padding: 5px 0 19px 0;
font-size: 21px;
font-weight: 400;
font-family: Merriweather;
color: #31353d;
letter-spacing: 0px;
line-height: 1.5;
}
.second-part-au .p-1 {
padding: 17px 0 0 0 !important;
margin-bottom: 16px;
font-style: normal;
font-weight: 400;
font-size: 16px;
line-height: 1.4375;
font-family: MerriweatherSans, serif;
letter-spacing: 0px;
text-align: left;
color: #777777;
text-align: center;
}
.second-part-au .second-img {
margin-bottom: 10px;
}
.third-part-au {
min-height: 100vh;
background-image: url("/assets/images/image33.jpg");
background-size: cover;
position: relative;
color: white;
background-size: cover;
background-position: center;
padding-top: 30px;
}
.third-part-au .numbers-container .numbers {
text-align: center;
width: 230px;
line-height: 230px;
border-radius: 50%;
border: solid 4px white;
background-color: transparent;
font-family: Merriweather;
font-weight: bold;
font-size: 40px;
margin-bottom: 24px;
}
.third-part-au .numbers-container .num-text {
text-align: center;
font-family: "Merriweather", Helvetica, Arial, Lucida, sans-serif;
font-weight: bold;
font-size: 18px;
color: #ffffff !important;
padding-left: 80px;
padding-right: 80px;
margin-bottom: 24px;
}
.headline .headline-h3 {
font-style: normal;
font-weight: 300;
font-size: 26px;
line-height: 1.33333;
font-family: Merriweather, serif;
letter-spacing: 0px;
color: #31353d;
margin-bottom: 0px;
}
.headline .headline-h2 {
color: #15c1cb;
font-style: normal;
font-weight: 700;
font-size: 29px;
line-height: 1.36957;
font-family: Merriweather, serif;
letter-spacing: 0px;
margin-bottom: 0px;
}
.fourth-part-au {
padding: 0 15px;
}
.fourth-part-au .card-text4 {
display: flex;
align-items: start !important;
}
.fourth-part-au .h4-fourth {
font-family: "Merriweather", Helvetica, Arial, Lucida, sans-serif;
font-size: 26px;
color: #333333 !important;
line-height: 1.3em;
margin-top: 13px;
font-style: normal;
font-weight: 500;
text-align: start;
}
.fourth-part-au .p-fourth {
font-style: normal;
font-weight: 400;
font-size: 16px;
line-height: 1.4375;
font-family: MerriweatherSans, sans-serif;
letter-spacing: 0px;
color: #777777;
margin-bottom: 16px;
box-sizing: border-box;
padding-right: 3px;
}
.fifth-part-au {
background-image: url("/assets/images/image30.jpg");
background-size: cover;
position: relative;
color: white;
background-size: cover;
background-position: center;
padding-top: 30px;
padding-bottom: 40px;
}
.fifth-part-au .careers {
text-transform: uppercase;
border-radius: 29px;
font-family: "Lato";
font-weight: 900;
font-style: normal;
padding: 19px 38px;
font-size: 1rem;
letter-spacing: 0.04em;
background-color: transparent;
border: solid 2px white;
}
.fifth-part-au .careers:hover {
background-color: white;
color: #333333 !important;
transition: 0.2s;
}
.fifth-part-au .textbox5 .h3-fifth {
text-align: center;
font-style: normal;
font-weight: 300;
font-size: 37px;
line-height: 1.33333;
font-family: Merriweather;
letter-spacing: 0px;
word-wrap: break-word;
margin-bottom: 0px;
}
.fifth-part-au .textbox5 .h2-fifth {
text-align: center;
font-style: normal;
font-weight: 700;
font-size: 45px;
line-height: 1.36957;
font-family: Merriweather, serif;
letter-spacing: 0px;
color: #15c1cb;
}
.sixth-part-au {
padding: 0 15px;
}
.sixth-part-au .headline-h2 {
text-align: center;
padding: 0 3px;
}
.sixth-part-au .h5-button {
background-color: #15c1cb;
cursor: pointer;
text-align: start;
color: #ffffff !important;
font-style: normal;
font-weight: 700;
font-size: 16px;
line-height: 1.5;
font-family: Merriweather, serif;
letter-spacing: 0px;
text-decoration: none !important;
padding: 0px !important;
}
.sixth-part-au .card-header {
background-color: #15c1cb;
text-decoration: none;
color: white;
margin-bottom: 2px;
}
.sixth-part-au .card-body {
color: #777777;
font-style: normal;
font-weight: 400;
line-height: 1.4375;
font-family: MerriweatherSans, sans-serif;
letter-spacing: 0px;
margin: 50px 0;
}
.sixth-part-au .A {
color: #15c1cb;
}
.sixth-part-au .card-q .card-header {
background-color: #333333;
transition: background-color 1s ease;
}
.sixth-part-au .card-q .collapsed {
background-color: #333333;
}
.email-form-au {
padding: 30px 15px;
background-color: #15c1cb;
}
.email-form-au .email-title {
font-style: normal;
font-weight: 500;
font-size: 24px;
line-height: 1.38462;
font-family: Merriweather, serif;
letter-spacing: 0px;
text-align: inherit;
color: #ffffff;
}
.email-form-au .email-text {
padding: 0 10px;
text-align: center;
font-style: normal;
font-weight: 400;
font-size: 16px;
line-height: 1.4375;
font-family: MerriweatherSans, sans-serif;
letter-spacing: 0px;
color: #ffffff;
}
.email-form-au .subscribe {
text-transform: uppercase;
border-radius: 29px;
font-family: "Lato";
font-weight: 900;
font-style: normal;
padding: 19px 38px;
font-size: 1rem;
letter-spacing: 0.04em;
background-color: white;
color: #15c1cb !important;
margin-top: 20px;
}
.email-form-au .subscribe:hover {
color: white !important;
background-color: transparent;
border: solid 2px white;
transition: 0.2s;
}
.email-form-au .input-text {
padding: 18px 20px;
border: none;
background-color: #f6f6f6;
margin: 0 0 20px;
color: #777777 !important;
width: 93%;
font-family: MerriweatherSans;
}
.email-form-au .input-text::-moz-placeholder {
color: #31353d !important;
}
.email-form-au .input-text::placeholder {
color: #31353d !important;
}/*# sourceMappingURL=style.css.map */

2
style/style.css.map
View File

File diff suppressed because one or more lines are too long

18
style/style.scss
View File

@@ -12,5 +12,23 @@
@import '_footer';
// ABOUT US
@import 'about_us/_first-part-au';
@import 'about_us/_header-au';
@import 'about_us/_second-part-au';
@import 'about_us/_third-part-au';
@import 'about_us/_fourth-part-au';
@import 'about_us/_fifth-part-au';
@import 'about_us/_sixth-part-au';
@import 'about_us/_email-form-au';