diff --git a/maket1/fonts/file1.css b/maket1/fonts/file1.css new file mode 100644 index 0000000..8b13789 --- /dev/null +++ b/maket1/fonts/file1.css @@ -0,0 +1 @@ + diff --git a/maket1/fonts/fontawesome-webfont.eot b/maket1/fonts/fontawesome-webfont.eot new file mode 100644 index 0000000..9b6afae Binary files /dev/null and b/maket1/fonts/fontawesome-webfont.eot differ diff --git a/maket1/fonts/fontawesome-webfont.svg b/maket1/fonts/fontawesome-webfont.svg new file mode 100644 index 0000000..d05688e --- /dev/null +++ b/maket1/fonts/fontawesome-webfont.svg @@ -0,0 +1,655 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + \ No newline at end of file diff --git a/maket1/fonts/fontawesome-webfont.ttf b/maket1/fonts/fontawesome-webfont.ttf new file mode 100644 index 0000000..26dea79 Binary files /dev/null and b/maket1/fonts/fontawesome-webfont.ttf differ diff --git a/maket1/fonts/fontawesome-webfont.woff b/maket1/fonts/fontawesome-webfont.woff new file mode 100644 index 0000000..dc35ce3 Binary files /dev/null and b/maket1/fonts/fontawesome-webfont.woff differ diff --git a/maket1/fonts/fontawesome-webfont.woff2 b/maket1/fonts/fontawesome-webfont.woff2 new file mode 100644 index 0000000..500e517 Binary files /dev/null and b/maket1/fonts/fontawesome-webfont.woff2 differ diff --git a/maket1/fonts/glyphicons-halflings-regular.eot b/maket1/fonts/glyphicons-halflings-regular.eot new file mode 100644 index 0000000..b93a495 Binary files /dev/null and b/maket1/fonts/glyphicons-halflings-regular.eot differ diff --git a/maket1/fonts/glyphicons-halflings-regular.svg b/maket1/fonts/glyphicons-halflings-regular.svg new file mode 100644 index 0000000..94fb549 --- /dev/null +++ b/maket1/fonts/glyphicons-halflings-regular.svg @@ -0,0 +1,288 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + \ No newline at end of file diff --git a/maket1/fonts/glyphicons-halflings-regular.ttf b/maket1/fonts/glyphicons-halflings-regular.ttf new file mode 100644 index 0000000..1413fc6 Binary files /dev/null and b/maket1/fonts/glyphicons-halflings-regular.ttf differ diff --git a/maket1/fonts/glyphicons-halflings-regular.woff b/maket1/fonts/glyphicons-halflings-regular.woff new file mode 100644 index 0000000..9e61285 Binary files /dev/null and b/maket1/fonts/glyphicons-halflings-regular.woff differ diff --git a/maket1/fonts/glyphicons-halflings-regular.woff2 b/maket1/fonts/glyphicons-halflings-regular.woff2 new file mode 100644 index 0000000..64539b5 Binary files /dev/null and b/maket1/fonts/glyphicons-halflings-regular.woff2 differ diff --git a/maket1/fonts/icon-font.eot b/maket1/fonts/icon-font.eot new file mode 100644 index 0000000..90309a6 Binary files /dev/null and b/maket1/fonts/icon-font.eot differ diff --git a/maket1/fonts/icon-font.svg b/maket1/fonts/icon-font.svg new file mode 100644 index 0000000..dcb10ec --- /dev/null +++ b/maket1/fonts/icon-font.svg @@ -0,0 +1,21 @@ + + + +Generated by Fontastic.me + + + + + + + + + + + + + + + + + diff --git a/maket1/fonts/icon-font.ttf b/maket1/fonts/icon-font.ttf new file mode 100644 index 0000000..30d4ab7 Binary files /dev/null and b/maket1/fonts/icon-font.ttf differ diff --git a/maket1/fonts/icon-font.woff b/maket1/fonts/icon-font.woff new file mode 100644 index 0000000..0ba3fa2 Binary files /dev/null and b/maket1/fonts/icon-font.woff differ diff --git a/maket1/image/bg-4.jpg b/maket1/image/bg-4.jpg new file mode 100644 index 0000000..b9c1fcb Binary files /dev/null and b/maket1/image/bg-4.jpg differ diff --git a/maket1/image/bg-5.jpg b/maket1/image/bg-5.jpg new file mode 100644 index 0000000..f275afe Binary files /dev/null and b/maket1/image/bg-5.jpg differ diff --git a/maket1/image/file.css b/maket1/image/file.css new file mode 100644 index 0000000..8b13789 --- /dev/null +++ b/maket1/image/file.css @@ -0,0 +1 @@ + diff --git a/maket1/maket1.css b/maket1/maket1.css new file mode 100644 index 0000000..bc86ecd --- /dev/null +++ b/maket1/maket1.css @@ -0,0 +1,10 @@ +@import url(/maket1/styles/body_styles.css); +@import url(/maket1/styles/header_styles.css); +@import url(/maket1/styles/button.css); +@import url(/maket1/styles/best_services_styles.css); +@import url(/maket1/styles/flat_switcher_styles.css); +@import url(/maket1/styles/testimonials_styles.css); +@import url(/maket1/styles/form_styles.css); +@import url(/maket1/styles/contact_styles.css); +@import url(/maket1/styles/social_icons_styles.css); +@import url(/maket1/styles/footer_style.css); diff --git a/maket1/maket1.html b/maket1/maket1.html new file mode 100644 index 0000000..ce3b81b --- /dev/null +++ b/maket1/maket1.html @@ -0,0 +1,169 @@ + + + Delex - Best Ideas for your Business + + + + + +
+ + + HOME + SERVICES + TESTIMONIALS + CONTACT + +
+

+ Best ideas for your Business +

+
+ "There is no one who loves pain itself, who seeks after it and wants to have it, simply because it is pain wants to have it, simply because it is pain..." +
+
+
+ +
+
+ +
+
+

Best services

+
+
+
+
+
+
+
+
+
+

CREATIVE IDEAS

+

Neque porro quisquam est qui dolorem ipsum quia dolor sit amet, consectetur, adipisci velit..."

+
+
+
+

RAPID SOLUTIONS

+

Neque porro quisquam est qui dolorem ipsum quia dolor sit amet, consectetur, adipisci velit..."

+
+
+
+

MAGIC TOUCH

+

Neque porro quisquam est qui dolorem ipsum quia dolor sit amet, consectetur, adipisci velit..."

+
+
+
+

CREATIVE IDEAS

+

Neque porro quisquam est qui dolorem ipsum quia dolor sit amet, consectetur, adipisci velit..."

+
+
+
+

RAPID SOLUTIONS

+

Neque porro quisquam est qui dolorem ipsum quia dolor sit amet, consectetur, adipisci velit..."

+
+
+
+

MAGIC TOUCH

+

Neque porro quisquam est qui dolorem ipsum quia dolor sit amet, consectetur, adipisci velit..."

+
+
+ +
+
+
+ +
+
+
"Neque porro quisquam est qui dolorem ipsum quia dolor sit amet, consectetur, adipisci velit. Neque porro quisquam est qui dolorem ipsum quia dolor sit amet, consectetur, adipisci velit..."
+
+
+
- Jhon Doe
+
+
+
Slider
+
+ +
+
+
+

Contact us

+
+
+
+
+
+
+
+ +
+ + +
+
+ + +
+
+ + +
+

"Neque porro quisquam est qui dolorem ipsum quia dolor sit amet, consectetur, adipisci velit..."

+ +
+
+ + +
+

KEEP IN TOUCH

+
+ +
+ g +
+ +
+ p +
+
+ +

ADRESS

+
+ 
+454 Main Streer, 
+Nashville, PA 23456, Other
+
+
+
+ +
+ +

SUPPORT

+
+ 
+Neque porro quisquam est qui dolorem 
+ipsum quia dolor sit amet
+
+
+
+
+ +
+
+ + + + + + + diff --git a/maket1/styles/best_services_styles.css b/maket1/styles/best_services_styles.css new file mode 100644 index 0000000..4ac26b0 --- /dev/null +++ b/maket1/styles/best_services_styles.css @@ -0,0 +1,99 @@ +article{ + display: grid; + grid-template-columns: 0.1fr 1fr 0.1fr; + grid-template-rows: 0.2fr 0.5fr 1fr 0.5fr; + +} +.article_name{ + grid-column:2; + grid-row: 2; + display:flex; + flex-flow: column wrap; + justify-content: center; + align-items: center; + color:535353; +} + +.features{ + grid-column:2; + grid-row: 3; + display: flex; + flex-flow: row wrap; + justify-content: space-evenly; + align-items: center; + color:#737373; +} +.feature_1{ + width: 30%; + display: flex; + flex-flow: column wrap; + justify-content: flex-start; + align-items: center; + margin-bottom: 30px; + +} +.feature_2{ + width: 30%; + display: flex; + flex-flow: column wrap; + justify-content: flex-start; + align-items: center; + margin-bottom: 30px; +} +.feature_3{ + width: 30%; + display: flex; + flex-flow: column wrap; + justify-content: flex-start; + align-items: center; + margin-bottom: 30px; +} +.feature_4{ + width: 30%; + display: flex; + flex-flow: column wrap; + justify-content: flex-start; + align-items: center; + margin-bottom: 30px; +} +.feature_5{ + width: 30%; + display: flex; + flex-flow: column wrap; + justify-content: flex-start; + align-items: center; + margin-bottom: 30px; +} +.feature_6{ + width: 30%; + display: flex; + flex-flow: column wrap; + justify-content: flex-start; + align-items: center; + margin-bottom: 30px; +} +p{ + text-align: center; + } + + h3{ + color:535353; +} +.feature_icon_ideas{ + background-image: url(); + } +.feature_icon_solutions{ + background-image: url(); + } +.feature_icon_touch{ + background-image: url(); + } +.feature_icon_ideas1{ + background-image: url(); + } +.feature_icon_solutions1{ + background-image: url(); + } +.feature_icon_touch1{ + background-image: url(); + } diff --git a/maket1/styles/body_styles.css b/maket1/styles/body_styles.css new file mode 100644 index 0000000..61dd246 --- /dev/null +++ b/maket1/styles/body_styles.css @@ -0,0 +1,34 @@ +body{ +font-family: 'glyphicons', 'fontawesome', sans-serif; +font-size: 0.8em; +margin: auto; +display: grid; +grid-template-columns: 1fr +grid-template-rows: 800px auto auto auto auto auto; +grid-template-areas: +"header" +"article" +"testimonials" +"feedback_form" +"contacts" +"footer" +} + +header{ +grid-template-areas: "header"; +} +article{ +grid-template-areas: "article"; +} +.testimonials{ +grid-template-areas: "testimonials"; +} +.feedback_form{ +grid-template-areas: "feedback_form"; +} +contacts{ +grid-template-areas: "contacts"; +} +footer{ +grid-template-areas: "footer"; +} diff --git a/maket1/styles/button.css b/maket1/styles/button.css new file mode 100644 index 0000000..681dfba --- /dev/null +++ b/maket1/styles/button.css @@ -0,0 +1,13 @@ +button{ + background: #19BB96; + width: 120px; + height: 40px; + border:0px; + border-radius: 4px; + cursor: pointer; + font-size: 12px; + color: white; + font-weight: bold; + z-index: 3; + } + diff --git a/maket1/styles/contact_styles.css b/maket1/styles/contact_styles.css new file mode 100644 index 0000000..5ccef9e --- /dev/null +++ b/maket1/styles/contact_styles.css @@ -0,0 +1,81 @@ +contacts{ + background-color: F7F7F7; + display: grid; + grid-template-columns: 0.8fr 1fr 1fr 1fr 0.8fr; + grid-template-rows: 0.01fr 0.5fr 1fr 1fr 1fr 0.5fr; +} +.line{ + background-color: E6E6E6; + grid-column:1/5; + grid-row: 1; + height: 1px; +} +.contact_item{ + grid-column:2; + grid-row: 3; + display: flex; + align-items: flex-end; + justify-content: center; +} +contacts h3{ + text-align: center; +} +contacts pre{ + color: 949494; + text-align: center; +} +.contact_item_details{ + grid-column:2; + grid-row: 4/5; + display: flex; + justify-content: space-evenly; + align-items: center; + margin: 3px; +} +.contact_adress{ + grid-column:3; + grid-row: 3; + display: flex; + align-items: flex-end; + justify-content: center; +} +.contact_phys_adress{ + grid-column:3; + grid-row: 4; + display: flex; + justify-content: center; + align-items: center; +} +.contact_email_adress{ + grid-column:3; + grid-row: 5; + display: flex; + justify-content: center; + align-items: center; +} +.contact_support{ + grid-column:4; + grid-row: 3; + display: flex; + align-items: flex-end; + justify-content: center; +} +.contact_support_detalis{ + grid-column:4; + grid-row: 4; + display: flex; + justify-content: center; + align-items: center; +} +.contact_support_button{ + grid-column:4; + grid-row: 5; + display: flex; + justify-content: center; + align-items: flex-start; +} +contacts pre{ + font-family: 'glyphicons-halflings-regular', sans-serif; + font-size: 0.5em; +} + diff --git a/maket1/styles/flat_switcher_styles.css b/maket1/styles/flat_switcher_styles.css new file mode 100644 index 0000000..c0e77c5 --- /dev/null +++ b/maket1/styles/flat_switcher_styles.css @@ -0,0 +1,18 @@ +.switcher{ + width: 100%; + justify-content: center; + display: flex; + flex-flow: row nowrap; + } + .one_switcher_panel{ + width: 55px; + height: 4px; + background: #E1E1E1; + margin-left: 7px; + } + .one_switcher_panel:hover{ + width: 55px; + height: 4px; + background: #10BC97; + cursor: pointer; + } \ No newline at end of file diff --git a/maket1/styles/fonts_styles.css b/maket1/styles/fonts_styles.css new file mode 100644 index 0000000..aa32419 --- /dev/null +++ b/maket1/styles/fonts_styles.css @@ -0,0 +1,37 @@ +@font-face { + font-family: 'fontawesome'; + src: url('fonts/fontawesome-webfont.woff') format('woff'), + url('fonts/fontawesome-webfont.woff2') format('woff2'), + url('fonts/fontawesome-webfont.eot') format('eot'), + url('fonts/fontawesome-webfont.svg') format('svg'), + url('fonts/fontawesome-webfont.ttf') format('ttf'); + font-weight: normal; + font-style: normal; +} + +@font-face { + font-family: 'glyphicons-halflings-regular'; + src: url('fonts/glyphicons-halflings-regular.eot') format('eot'), + url('fonts/glyphicons-halflings-regular.svg') format('svg'), + url('fonts/glyphicons-halflings-regular.ttf') format('ttf'), + url('fonts/glyphicons-halflings-regular.woff') format('woff'), + url('fonts/glyphicons-halflings-regular.woff2') format('woff2'); + font-weight: normal; + font-style: normal; +} +@font-face { +font-family: 'icon-font'; +src: url('icon-font.eot') format('eot'), + url('icon-font.svg') format('svg'), + url('icon-font.ttf') format('ttf'), + url('icon-font.woff') format('woff'); +} + +header article .testimonials .feedback_form contacts footer pre{ + font-family: 'fontawesome', sans-serif; + font-size: 1em; +} +h1 h2{ + font-family: 'glyphicons-halflings-regular', sans-serif; + font-size: 1.2em; + } diff --git a/maket1/styles/footer_style.css b/maket1/styles/footer_style.css new file mode 100644 index 0000000..173e390 --- /dev/null +++ b/maket1/styles/footer_style.css @@ -0,0 +1,7 @@ +footer{ + background: black; + color: 737373; + font-size: 0.8em; + text-align: center; + padding: 15px; +} \ No newline at end of file diff --git a/maket1/styles/form_styles.css b/maket1/styles/form_styles.css new file mode 100644 index 0000000..4ccb9c8 --- /dev/null +++ b/maket1/styles/form_styles.css @@ -0,0 +1,43 @@ +.feedback_forum{ + display: grid; + grid-template-columns: 0.2fr 1fr 1fr 0.2fr; + grid-template-rows: 0.1fr 0.3fr 1fr 0.1fr; +} +.feedback_forum_name{ + grid-row: 2; + grid-column-start: 2; + grid-column-end: 4; + display:flex; + flex-flow: column wrap; + justify-content: center; + align-items: center; + color:535353; +} + +form{ + grid-row: 3; + grid-column-start: 2; + grid-column-end: 4; +} +input[type=textarea] { + + resize: none; + height:150px; +} +input, textarea { + font-family:inherit; + font-size: inherit; + box-sizing: border-box; + padding: 5px; + margin:10px 0; + width: 100%; + } +.border-customized-input { + border: 1px solid #E7E7E7; + border-radius: 1px; +} +form p{ + text-align: center; + width: 100%; + margin:10px 0; +} diff --git a/maket1/styles/header_styles.css b/maket1/styles/header_styles.css new file mode 100644 index 0000000..dd48480 --- /dev/null +++ b/maket1/styles/header_styles.css @@ -0,0 +1,72 @@ +header{ + color: white; + background-color: black; + display:grid; + grid-template-columns: 1fr 4fr 1fr 4fr 1fr 4fr 1fr; + grid-template-rows: 0.1fr 1fr 1fr 1fr 1fr; +} +.logo{ + grid-row: 2; + grid-column: 2/3; + z-index: 3; +} +menu{ + grid-row: 2; + grid-column: 6/8; + display: block; + list-style-type: disc; + margin-block-start: 0em; + margin-block-end: 0em; + margin-inline-start: 0px; + margin-inline-end: 0px; + padding-inline-start: 0px; + z-index: 3; +} +a{ + color: white; + padding-left: 20px; + cursor: pointer; + text-decoration:none; +} +a:hover{ + color: #19BB96; +} +a:active{ + color: #088a6b; + +} +.head_info{ + grid-row: 3; + grid-column-start: 3; + grid-column-end: 6; + display: flex; + justify-content: flex-end; + align-items: center; + flex-flow: column wrap; + z-index: 3; +} +.head_info_description{ + text-align: center; +} +.button_wrapper{ + grid-row:4; + grid-column:4; + display:flex; + justify-self: center; + align-items: center; +} +header::before{ + content: "__"; + background-image: url("https://raw.githubusercontent.com/evjlobanova/evjlobanova.github.io/main/Maket/images/bg-5.jpg"); + background-repeat: no-repeat; + background-size: cover; + background-position: top center; + opacity: 55%; + display: block; + width: 100%; + grid-column: 1/8; + grid-row:1/6; + min-height: 650px; + } + + diff --git a/maket1/styles/social_icons_styles.css b/maket1/styles/social_icons_styles.css new file mode 100644 index 0000000..90179ee --- /dev/null +++ b/maket1/styles/social_icons_styles.css @@ -0,0 +1,62 @@ +.facebook{ + border: solid 1px #E7EBEF; + border-radius: 100%; + width: 3em; + height: 3em; + background-image: url("https://img.icons8.com/material-rounded/24/000000/facebook-f--v1.png"); + background-repeat: no-repeat; + background-position: center; + cursor: pointer; + z-index: 3; +} +a[href="https://www.google.com/"], a[href="https://www.facebook.com/"], a[href="https://www.twitter.com/"], a[href="https://wwww.pinterest.com"]{ + color: rgba(255, 0, 0, 0.014); + font-size: 2em; +} +.facebook:hover{ + background-size: 100%; + box-shadow: rgba(255, 0, 0, 0.014); +} +.google{ + border: solid 1px #E7EBEF; + border-radius: 100%; + width: 3em; + height: 3em; + background-image: url("https://img.icons8.com/ios/24/000000/google-plus.png"); + background-repeat: no-repeat; + background-position: center; + cursor: pointer; + z-index: 3; +} +.google:hover{ + background-size: 100%; +} +.pinterest{ + border: solid 1px #E7EBEF; + border-radius: 100%; + width: 3em; + height: 3em; + background-image: url("https://img.icons8.com/material-rounded/24/000000/pinterest--v1.png"); + background-repeat: no-repeat; + background-position: center; + cursor: pointer; + z-index: 3; +} +.pinterest:hover{ + background-size: 100%; +} +.twitter{ + border: solid 1px #E7EBEF; + border-radius: 100%; + width: 3em; + height: 3em; + background-image: url("https://img.icons8.com/android/24/000000/twitter.png"); + background-repeat: no-repeat; + background-position: center; + cursor: pointer; + z-index: 3; +} +.twitter:hover{ + background-size: 100%; +} + diff --git a/maket1/styles/testimonials_styles.css b/maket1/styles/testimonials_styles.css new file mode 100644 index 0000000..e802abf --- /dev/null +++ b/maket1/styles/testimonials_styles.css @@ -0,0 +1,61 @@ +.testimonials{ + color: white; + background-color: black; + display:grid; + grid-template-columns: 1fr 2fr 1fr ; + grid-template-rows: 1fr 1fr 1fr 1fr; + ; +} +.testimonials::before{ + content: "__"; + background-image: url("https://raw.githubusercontent.com/evjlobanova/evjlobanova.github.io/main/Maket/images/bg-4.jpg"); + background-repeat: no-repeat; + background-size: 200%; + background-position: top left; + opacity: 25%; + display: block; + width: 100%; + grid-column: 1/4; + grid-row:1/5; + min-height: 310px; + +} +.svg_wrapper{ +grid-column: 2; +grid-row: 1; +display: flex; +justify-content: center; +align-items: flex-end; +} +svg{ + fill: #19BB96; +} +.testimonials-text_wrapper{ + grid-column: 2; + grid-row: 2; + display: flex; + justify-content: center; + align-items: flex-end; + text-align: center; + color: C9C9C9; +} +.testimonials-author_wrapper{ + grid-column: 2; + grid-row: 3; + display: flex; + justify-content: center; + align-items: flex-start; + margin-top: 15px; +} +.testimonials_author{ + color: #19BB96; +} +.slider_pointer_wrapper{ + grid-column: 2; + grid-row: 4; + display: flex; + justify-content: center; + align-items: flex-start; +} + + \ No newline at end of file