diff --git a/docs/lab2.pdf b/docs/lab2.pdf new file mode 100644 index 0000000..49cd8c2 Binary files /dev/null and b/docs/lab2.pdf differ diff --git a/projects/card/index.html b/projects/card/index.html index 0795d41..3f036ba 100644 --- a/projects/card/index.html +++ b/projects/card/index.html @@ -5,12 +5,24 @@ Document + + + -
- +
+
+ img +
+
+
Pragser Wildsee, Italy
+
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam.
+ +
+ +
diff --git a/projects/card/style.css b/projects/card/style.css index 1875727..ef0275f 100644 --- a/projects/card/style.css +++ b/projects/card/style.css @@ -3,7 +3,7 @@ padding: 0; } body{ - font-family: 'Open Sans', sans-serif; + font-family: 'Exo2', sans-serif; } .container{ @@ -17,6 +17,73 @@ body{ } +.card{ + + width: 200px; + height: 322px; + padding-bottom: 10px; + background: #FFFFFF; + border-radius: 10px; + +} + +.card__image{ + width: 200px; + height: 142.36px; + border-radius: 10px 10px 0px 0px; +} + +.card__image img{ + width: 200px; + height: 142.36px; + border-radius: 10px 10px 0px 0px; +} + +.card__content{ + width: 200px; + height: 322px; + +} + +.card__title{ + width: 129px; + height: 16.63px; + font-size: 12px; + font-weight: 700; + line-height: 16.34px; + margin-right: 55px; + margin-top: 16px; + margin-left: 16px; + + +} + +.card__text{ + font-size: 10px; + font-weight: 300; + line-height: 13.62px; + margin-right: 19px; + margin-top: 16px; + margin-left: 16px; + +} + +.card__btn{ + width: 98px; + height: 27px; + border-radius: 50px ; + background-color: #2797B2; + border: 0px; + margin: 16px; + margin-right: 55px; + font-size: 10px; + font-weight: 700; + line-height: 13.62px; + color: #FFFFFF; + + +} + diff --git a/projects/footer/index.html b/projects/footer/index.html index 3a710f9..ab34519 100644 --- a/projects/footer/index.html +++ b/projects/footer/index.html @@ -5,14 +5,28 @@ Document + + + -
diff --git a/projects/footer/style.css b/projects/footer/style.css index 736de24..bb785a9 100644 --- a/projects/footer/style.css +++ b/projects/footer/style.css @@ -16,6 +16,114 @@ html,body{ } .footer{ flex: 0 0 auto; + width: 100%; + height: 260px; + background-color: #05A88D; +} + +.footer__top{ + display: flex; + justify-content: space-between; + flex-direction: row; + margin-top: 40px; + margin-left: 40px; + margin-right: 40px; + border-bottom: 1px solid #FFFFFF; + height: 174px; +} + +.logo{ + width: 131px; + height: 34px; + font-family: Exo 2; + font-size: 28px; + font-weight: 700; + line-height: 33.6px; + letter-spacing: -0.015em; + color: #F1E67D; + text-decoration: none; + display: flex; + align-items: center; + +} + +.text{ + font-size: 12px; + font-weight: 300; + line-height: 14.4px; + letter-spacing: -0.015em; + color: #FFFFFF; + width: 437px; + height: 46px; + display: flex; + align-items: center; + margin-bottom: 28px; + +} + +.footer__right{ + display: flex; + justify-content: space-around; + align-items: end; + flex-direction: column; +} + + +.footer__left{ + display: flex; + justify-content: space-around; + align-items: start; + flex-direction: column; +} + +.contact{ + width: 160px; + height: 17px; + font-size: 14px; + font-weight: 700; + line-height: 16.8px; + letter-spacing: -0.015em; + margin-right: 39px; + color: #FFFFFF; + +} + +.phone{ + width: 226px; + height: 30px; + font-size: 24px; + font-weight: 700; + line-height: 28.8px; + letter-spacing: -0.015em; + text-decoration: none; + color: #F1E67D; + margin-right: 26px; + +} + +.address{ + font-size: 12px; + font-weight: 300; + line-height: 14.4px; + letter-spacing: -0.015em; + color: #FFFFFF; + margin-right: 38px; +} + +.footer__bottom{ + width: 198px; + height: 14px; + font-size: 12px; + font-weight: 300; + line-height: 14.4px; + letter-spacing: -0.015em; + padding-top: 20px; + padding-left: 40px; + padding-bottom: 40px; + padding-right: 0px; + color: #FFFFFF; + + } diff --git a/projects/header/index.html b/projects/header/index.html index 276b02a..8148543 100644 --- a/projects/header/index.html +++ b/projects/header/index.html @@ -2,18 +2,36 @@ - Document + + + - -
+
-
+ +
diff --git a/projects/header/style.css b/projects/header/style.css index 4677eae..552f085 100644 --- a/projects/header/style.css +++ b/projects/header/style.css @@ -1,13 +1,106 @@ *{ - margin: 0; - padding: 0; + margin:0; + padding:0; + } + + + +.menu{ + font-family: "Montserrat", sans-serif; + width: 1440px; + height:100px; + color: #ffffffff; + list-style: none; + display: flex; + flex-direction: row; + justify-content: space-between; + +} + +.menu__ul{ + list-style: none; + display: flex; + flex-direction: row; + justify-content: space-between; + +} + +.menu_li{ + width: 69px; + height: 20px; + font-size: 16px; + font-weight: 300; + line-height: 19.5px; + letter-spacing: -0.015em; + align-items: center; + + +} + +.menu__link{ + text-decoration: none; + color: #000000; + display: flex; + align-items: center; + justify-content: center; + margin: 40px; } -body{ +.menu__link:hover{ + color: #05A88D; } -.header{ - width: 100%; - box-sizing: border-box; +.menu__logo{ + width: 167px; + height: 29px; + font-size: 24px; + font-weight: 700; + line-height: 29.26px; + letter-spacing: -0.015em; + color: #05A88D; + margin-top: 40px; + margin-bottom: 40px; + text-decoration: none; + align-items: center; + justify-content: center; + +} + + + +.menu__signup{ + width: 105px; + height: 45px; + border-radius: 3px; + border: 1px solid #05A88D; + background-color: #ffffffff; + margin-top: 27px; + +} + +.menu__signup a{ + width: 45px; + height: 20px; + text-decoration: none; + color: #05A88D; +} + +.menu__login{ + width: 105px; + height: 45px; + border-radius: 3px; + border: 1px solid #05A88D; + background-color: #ffffffff; + margin-top: 27px; + margin-right: 40px; + margin-left: 40px; +} + +.menu__login a{ + width: 45px; + height: 20px; + text-decoration: none; + color: #05A88D; + }