diff --git a/img/adsl.webp b/img/adsl.webp new file mode 100644 index 0000000..958a78b Binary files /dev/null and b/img/adsl.webp differ diff --git a/img/background.webp b/img/background.webp new file mode 100644 index 0000000..1437413 Binary files /dev/null and b/img/background.webp differ diff --git "a/img/\330\252\330\247\330\250\330\263\330\252\330\247\331\206\330\252.png" "b/img/\330\252\330\247\330\250\330\263\330\252\330\247\331\206\330\252.png" new file mode 100644 index 0000000..bc12079 Binary files /dev/null and "b/img/\330\252\330\247\330\250\330\263\330\252\330\247\331\206\330\252.png" differ diff --git a/index.html b/index.html index 9f75b56..8b46619 100644 --- a/index.html +++ b/index.html @@ -9,24 +9,22 @@
-
- لوگو پیشگامان - تلفن 1577 -
-
-
-
- بهــارستــون -
-

از بهار به تابستون |  اینترنت +ADSL2

-
-
- - -
+
+
+ لوگو پیشگامان + شماره 1577 +
+
+ بهــارستــون +

فصل داغ اینترنت

+ بهــارستــون +
+ +
- بهــارستــون دو -
+
+ +
اقتصادی @@ -110,11 +108,11 @@

25187


-
+

-
+

diff --git a/style.css b/style.css index 51dfb5b..f305894 100644 --- a/style.css +++ b/style.css @@ -18,71 +18,78 @@ body { font-family: 'MyCustomFont'; } -header{ + +.main-container .back { + background-image: url(./img/background.webp); + background-repeat: no-repeat; + background-size: 100vw; + background-position: center; + border-radius: 0px 0px 50px 50px; + justify-content: center; + padding-bottom: 10%; +} + +.main-container .back .header{ display: flex; justify-content: space-between; - align-items: center; - background-color: #E9E8EB; padding: 3% 3% 3% 3%; } - -main .first { - display: grid; - grid-template-columns: repeat(2,1fr); - justify-content: space-between; - align-items: center; - background-color: #E9E8EB; - padding: 0 5%; - border-radius: 0px 0px 50px 50px; +.main-container .back .header a { + margin-left: 2%; + width: 10%; } -main .first .season { +.main-container .back .season { display: flex; flex-direction: column; - justify-content: center; + justify-content: right; align-items: center; - + width: 50%; + text-align: center; } -main .first .register { - display: flex; - flex-direction: row; +.main-container .back .season .image1 { + padding-top: 8%; +} + +.main-container .back .season .image2 { + padding: 5% 0; +} + +.main-container .back .text1 { font-weight: bold; - color: #286444; + color: #ffffff; margin: 0px; padding: 0px; - font-size: 2.1vw; -} - -main .first .btnBox { - display: block; - justify-content: center; - text-align: center; - border: 0px; + font-size: 5.2vw; + text-shadow: 1px 1px 8px #353935; } -main .first .button1 { +.main-container .back .button1 { padding: 0%; - border-radius: 10px; - background-color: #bb1613; + border-radius: 5px; color: #ffffff; + background-color: transparent; font-family: 'MyCustomFont'; - padding: 2px 10px; - border: 0px; + padding: 2px 5px; + border: 1.5px solid #ffffff ; font-size: 2vw; + scroll-behavior: smooth; + text-decoration: none; } -main .first .button2 { +.main-container .back .button2 { padding: 0%; - border-radius: 10px; - background-color: #286444; + border-radius: 5px; + background-color: #bb1613; color: #ffffff; font-family: 'MyCustomFont'; - padding: 2px 18px; + padding: 2px 10px; border: 0px; font-size: 2vw; + text-decoration: none; } @@ -399,7 +406,7 @@ main .fifth { content: "+"; font-size: 1.1em;; } -.accordion-item:first-child { +.accordion-item:back-child { margin-top: 0; } .accordion-item .icon { @@ -444,11 +451,11 @@ footer p { .main-container {width: 100%;} - header .image0 {width: 10%;} - + .main-container .image0 {width: 10%;} - main .first .image1 {width: 80%;} - main .first .text1 + .main-container .back .image1 {width: 80%} + .main-container .back .button1 {padding: 2px 18px;} + .main-container .back .button2 {padding: 2px 15px;} main .second .image2 {width: 30%;} @@ -467,11 +474,16 @@ footer p { .main-container {width: 100%;} - header .image0 {width: 10%;} + .main-container .image0 {width: 10%;} - main .first .image1 {width: 80%;} - main .first .text1 + .main-container .back .image1 {width: 70%} + .main-container .back .button1 { + padding: 2px 18px; + border-radius: 10px;} + .main-container .back .button2 { + padding: 2px 15px; + border-radius: 10px;} main .second .image2 {width: 30%;} @@ -494,10 +506,16 @@ footer p { .main-container {width: 100%;} - header .image0 {width: 10%;} + .main-container .image0 {width: 10%;} - main .first .image1 {width: 80%;} + .main-container .back .image1 {width: 60%} + .main-container .back .button1 { + padding: 2px 18px; + border-radius: 10px;} + .main-container .back .button2 { + padding: 2px 15px; + border-radius: 10px;} main .second .image2 {width: 30%;} @@ -523,10 +541,16 @@ footer p { .main-container {width: 100%;} - header .image0 {width: 10%;} + .main-container .image0 {width: 10%;} - main .first .image1 {width: 80%;} + .main-container .back .image1 {width: 80%} + .main-container .back .button1 { + padding: 2px 18px; + border-radius: 10px;} + .main-container .back .button2 { + padding: 2px 15px; + border-radius: 10px;} main .second .image2 {width: 30%;} @@ -552,10 +576,16 @@ footer p { .main-container {width: 100%;} - header .image0 {width: 10%;} + .main-container .image0 {width: 10%;} - main .first .image1 {width: 80%;} + .main-container .back .image1 {width: 80%} + .main-container .back .button1 { + padding: 2px 5px; + border-radius: 5px;} + .main-container .back .button2 { + padding: 2px 5px; + border-radius: 5px;} main .second .image2 {width: 30%;} @@ -583,10 +613,17 @@ footer p { .main-container {width: 100%;} - header .image0 {width: 10%;} + .main-container .image0 {width: 10%;} - main .first .image1 {width: 80%;} + .main-container .back .image1 {width: 80%} + .main-container .back .button1 { + padding: 2px 5px; + border-radius: 5px;} + .main-container .back .button2 { + padding: 2px 5px; + border-radius: + px;} main .second .image2 {width: 30%;} @@ -615,10 +652,16 @@ footer p { .main-container {width: 100%;} - header .image0 {width: 10%;} + .main-container .image0 {width: 10%;} - main .first .image1 {width: 80%;} + .main-container .back .image1 {width: 80%} + .main-container .back .button1 { + padding: 2px 5px; + border-radius: 5px;} + .main-container .back .button2 { + padding: 2px 5px; + border-radius: 5px;} main .second .image2 {width: 80%;}