diff --git a/.gitignore b/.gitignore new file mode 100644 index 0000000..6a3e68d --- /dev/null +++ b/.gitignore @@ -0,0 +1 @@ +**/.DS_Store \ No newline at end of file diff --git a/img/f-Yoga.jpg b/img/f-Yoga.jpg new file mode 100644 index 0000000..f46afcf Binary files /dev/null and b/img/f-Yoga.jpg differ diff --git a/index.html b/index.html new file mode 100644 index 0000000..967d949 --- /dev/null +++ b/index.html @@ -0,0 +1,60 @@ + + + + + + + Document + + +
+
+ +
+
+ +
+ +

САМАЯ БОЛЬШАЯ КОМПАНИЯ ЙОГА-ТУРОВ В РОССИИ

+

Lorem ipsum dolor sit amet consectetur adipisicing elit. Ipsam vel, reprehenderit exercitationem distinctio voluptate accusamus laboriosam magni voluptates deserunt molestiae, similique impedit, maxime minus totam rem! Officia quidem modi debitis aliquid explicabo quia dolor saepe magni doloremque! Sunt sint modi saepe recusandae iure, assumenda aspernatur dicta reiciendis, tempora distinctio praesentium? +

+
+ +
+ +
+ +
+ +
+ + + \ No newline at end of file diff --git a/style.css b/style.css new file mode 100644 index 0000000..92d4a25 --- /dev/null +++ b/style.css @@ -0,0 +1,103 @@ +*{ + box-sizing: border-box; + margin: 0; + padding: 0; +} +.wrapper { + display: grid; + grid-template-rows: auto 80vh 120px; + } + +header{ + background-color: rgb(176, 115, 233); + width: 100%; + height: 50px; +} +.logo{ + text-align: center; + font-style: Verdana; + font-size: 28px; + font-weight: bold; + margin-top: 10px; +} + +main{ + display: grid; + grid-template-columns: 160px auto 120px; + +} + +nav{ + background-color: rgb(244, 240, 247); + text-align:left; + +} +nav a{ +text-decoration: none; +color: black; +font-weight: normal; + +} +nav li{ + margin-top: 20px; + margin-left: 20px; +} + +.article{ + background: url("img/f-Yoga.jpg") center center/cover no-repeat; + + text-align:left; +} +.article h2{ + margin-top: 60px; +margin-left: 40px; +} + +.article p{ + margin-top: 20px; + color: black; + max-width: 600px; + margin-left: 80px; +} +.ads{ + background-color: rgb(244, 240, 247); + text-align:left; +} +footer{ + background-color: rgb(176, 115, 233); + width: 100%; +} +.footer_content{ + margin-top: 30px; + display:grid; + grid-template-columns: repeat(3,auto); + justify-content: space-around; +} + +@media (max-width: 769px){ + .wrapper { + grid-template-rows: auto auto 120px; + } + main { + grid-template-columns: 768px; + grid-template-rows: 200px 100vh; + } + + + nav{ + text-align: center; + + } + + nav ul{ + text-align: center; + list-style: none; + + } + + .ads { + display: none; + } + + +} \ No newline at end of file