diff --git a/assets/css/style.css b/assets/css/style.css index e69de29..4982343 100644 --- a/assets/css/style.css +++ b/assets/css/style.css @@ -0,0 +1,124 @@ +.iconContentAwesome, #article .row div:first-child:before, #article .row div:nth-child(2):before, #article .row div:last-child:before { + font-family: FontAwesome; + font-size: 3em; + color: #F1F1F1; + background-color: white; + position: relative; + bottom: 30px; + padding: 0 10px; + transition: all 0.5s ease; + transition-delay: 0.1s; +} + +#article { + height: auto; +} +#article .row div { + width: 350px; + height: 170px; + border: 3px solid #F1F1F1; + float: left; + margin: 20px; + transition: all 0.2s ease; +} +#article .row div h1 { + font-size: 20px; + margin: 0; +} +#article .row div p { + color: #555555; +} +#article .row div:first-child:before { + content: "\f108"; +} +#article .row div:nth-child(2):before { + content: "\f0eb"; +} +#article .row div:last-child:before { + content: "\f121"; +} +#article .row div:hover { + border: 3px solid #31A3DD; +} +#article .row div:hover:first-child:before, #article .row div:hover:nth-child(2):before, #article .row div:hover:last-child:before { + color: #31A3DD; + bottom: 40px; +} + +#customer { + width: 100%; + height: 275px; + background: black url("../../images/demo-2.png") repeat center; + background-size: contain; +} +#customer h1 { + color: #555555; + font-weight: 600; +} +#customer i { + padding: 25px 0px 10px; +} +#customer p, #customer i { + color: #999999; +} +#customer p { + font-size: 15px; +} +#customer p span { + font-weight: 600; +} +#customer p:nth-child(2) { + font-size: 0.9em; +} + +hr { + width: 50px; + height: 3px; +} + +button { + width: 550px; + height: 45px; +} + +.ourMission h1 { + font-size: 20px; +} +.ourMission button { + margin: 15px 0; +} +.ourMission button h4 { + float: left; + display: inline; +} +.ourMission button i { + float: right; + color: #31A3DD; +} + +.ourStatics h1 { + font-size: 20px; +} +.ourStatics div { + width: 170px; + height: 130px; + background-color: #31A3DD; + float: left; + border-radius: 3px; + margin: 2px; + transition-delay: 0.1s; + transition: all 0.3s ease; +} +.ourStatics div:hover { + background-color: #414547; +} +.ourStatics div h1, .ourStatics div p { + color: white; + text-align: center; +} +.ourStatics div h1 { + font-size: 3em; + font-weight: 700; +} + +/*# sourceMappingURL=style.css.map */ diff --git a/assets/css/style.css.map b/assets/css/style.css.map new file mode 100644 index 0000000..56c8527 --- /dev/null +++ b/assets/css/style.css.map @@ -0,0 +1,7 @@ +{ +"version": 3, +"mappings": "AAIA,qIAAmB;EAClB,WAAW,EAAE,WAAW;EACxB,SAAS,EAAC,GAAG;EACb,KAAK,EAAC,OAAO;EACb,gBAAgB,EAAC,KAAK;EACtB,QAAQ,EAAC,QAAQ;EACjB,MAAM,EAAC,IAAI;EACX,OAAO,EAAC,MAAM;EACd,UAAU,EAAC,aAAa;EACxB,gBAAgB,EAAC,IAAI;;;AAEtB,QAAQ;EACP,MAAM,EAAC,IAAI;;AAEV,iBAAG;EACF,KAAK,EAAC,KAAK;EACX,MAAM,EAAE,KAAK;EACb,MAAM,EAAC,iBAAiB;EACxB,KAAK,EAAC,IAAI;EACV,MAAM,EAAC,IAAI;EACX,UAAU,EAAC,aAAa;;AACxB,oBAAE;EACD,SAAS,EAAC,IAAI;EACd,MAAM,EAAC,CAAC;;AAET,mBAAC;EACA,KAAK,EAAC,OAAO;;AAEd,oCAAoB;EACnB,OAAO,EAAC,OAAO;;AAGhB,qCAAqB;EACpB,OAAO,EAAC,OAAO;;AAGhB,mCAAmB;EAClB,OAAO,EAAE,OAAO;;AAGjB,uBAAO;EACN,MAAM,EAAC,iBAAiB;;AACxB,kIAAkE;EACjE,KAAK,EAAC,OAAO;EACb,MAAM,EAAC,IAAI;;;AC3ChB,SAAU;EACT,KAAK,EAAC,IAAI;EACV,MAAM,EAPK,KAAK;EAQhB,UAAU,EAAC,kDAAkD;EAC7D,eAAe,EAAC,OAAO;;AACvB,YAAE;EACD,KAAK,EAAC,OAAO;EACb,WAAW,EAAC,GAAG;;AAEhB,WAAC;EACA,OAAO,EAAC,aAAa;;AAEtB,wBAAK;EACJ,KAAK,EAAC,OAAO;;AAEd,WAAC;EACA,SAAS,EApBK,IAAI;;AAqBlB,gBAAI;EAAC,WAAW,EAAC,GAAG;;AACpB,wBAAc;EACb,SAAS,EAAC,KAAK;;;ACxBlB,EAAE;EACD,KAAK,EAAC,IAAI;EACV,MAAM,EAAC,GAAG;;;AAEX,MAAM;EACL,KAAK,EAAC,KAAK;EACX,MAAM,EAAC,IAAI;;;AAGX,cAAE;EACD,SAAS,EDRM,IAAI;;ACUpB,kBAAM;EACL,MAAM,EAAC,MAAM;;AACb,qBAAE;EACD,KAAK,EAAC,IAAI;EACV,OAAO,EAAE,MAAM;;AAEhB,oBAAC;EACA,KAAK,EAAC,KAAK;EACX,KAAK,EDjBG,OAAO;;;ACsBjB,cAAE;EACD,SAAS,EDxBM,IAAI;;AC0BpB,eAAG;EACF,KAAK,EAAE,KAAK;EACZ,MAAM,EAAE,KAAK;EACb,gBAAgB,ED5BP,OAAO;EC6BhB,KAAK,EAAC,IAAI;EACV,aAAa,EAAE,GAAG;EAClB,MAAM,EAAC,GAAG;EACV,gBAAgB,EAAC,IAAI;EACrB,UAAU,EAAC,aAAa;;AACxB,qBAAO;EACN,gBAAgB,EAAE,OAAO;;AAE1B,qCAAO;EACN,KAAK,EAAC,KAAK;EACX,UAAU,EAAC,MAAM;;AAElB,kBAAE;EACD,SAAS,EAAC,GAAG;EACb,WAAW,EAAC,GAAG", +"sources": ["../sass/partials/_article.scss","../sass/partials/_customer.scss","../sass/partials/_aboutUs.scss"], +"names": [], +"file": "style.css" +} diff --git a/assets/sass/partials/_aboutUs.scss b/assets/sass/partials/_aboutUs.scss index e69de29..c3f7e00 100644 --- a/assets/sass/partials/_aboutUs.scss +++ b/assets/sass/partials/_aboutUs.scss @@ -0,0 +1,50 @@ +hr{ + width:50px; + height:3px; +} +button{ + width:550px; + height:45px; +} +.ourMission { + h1{ + font-size:$avarageFontSize + } + button{ + margin:15px 0; + h4{ + float:left; + display: inline; + } + i{ + float:right; + color:$mainColor + } + } +} +.ourStatics{ + h1{ + font-size:$avarageFontSize + } + div{ + width: 170px; + height: 130px; + background-color:$mainColor; + float:left; + border-radius: 3px; + margin:2px; + transition-delay:0.1s; + transition:all 0.3s ease; + &:hover{ + background-color: #414547 + } + h1 , p { + color:white; + text-align:center + } + h1{ + font-size:3em; + font-weight:700 + } + } +} \ No newline at end of file diff --git a/assets/sass/partials/_article.scss b/assets/sass/partials/_article.scss index e69de29..5b22781 100644 --- a/assets/sass/partials/_article.scss +++ b/assets/sass/partials/_article.scss @@ -0,0 +1,55 @@ +$mainHeight:275px; +$littleFontSize:15px; +$avarageFontSize:20px; +$mainColor:#31A3DD; +.iconContentAwesome{ + font-family: FontAwesome ; + font-size:3em; + color:#F1F1F1; + background-color:white; + position:relative; + bottom:30px; + padding:0 10px; + transition:all 0.5s ease; + transition-delay:0.1s +} +#article{ + height:auto; + .row{ + div{ + width:350px; + height: 170px; + border:3px solid #F1F1F1; + float:left; + margin:20px; + transition:all 0.2s ease; + h1{ + font-size:20px; + margin:0 + } + p{ + color:#555555 + } + &:first-child:before{ + content:"\f108"; + @extend .iconContentAwesome; + } + &:nth-child(2):before{ + content:"\f0eb"; + @extend .iconContentAwesome + } + &:last-child:before{ + content: "\f121"; + @extend .iconContentAwesome + } + &:hover{ + border:3px solid #31A3DD; + &:first-child:before , &:nth-child(2):before , &:last-child:before{ + color:#31A3DD; + bottom:40px; + } + + } + } + } +} \ No newline at end of file diff --git a/assets/sass/partials/_customer.scss b/assets/sass/partials/_customer.scss index e69de29..309fdbe 100644 --- a/assets/sass/partials/_customer.scss +++ b/assets/sass/partials/_customer.scss @@ -0,0 +1,29 @@ +$mainHeight:275px; +$littleFontSize:15px; +$avarageFontSize:20px; +$mainColor:#31A3DD; + +#customer { + width:100%; + height:$mainHeight; + background:black url('../../images/demo-2.png') repeat center; + background-size:contain; + h1{ + color:#555555; + font-weight:600; + } + i{ + padding:25px 0px 10px; + } + p , i{ + color:#999999 + } + p{ + font-size: $littleFontSize; + span{font-weight:600;} + &:nth-child(2){ + font-size:0.9em; + } + } +} + diff --git a/assets/sass/partials/_footer.scss b/assets/sass/partials/_footer.scss index e69de29..45ddf35 100644 --- a/assets/sass/partials/_footer.scss +++ b/assets/sass/partials/_footer.scss @@ -0,0 +1,49 @@ +#footer{ + background-color:#414547; + height:400px; + color: #c2c2c2; + + div:first-child{ + display: block; + margin-top:30px; + + + h5{ + color: white; + } + } + .secondpart{ + min-height: 50px; + display: block; + margin-left:25px; + + img{ + float: left; + padding:0 5px; + } + + span, .title{ + color: white; + border-bottom: 2px solid #31A3DD; + padding-bottom: 11px; + text-transform: uppercase; + } + a{ + color: white; + text-decoration:none; + font-size: 1.2em; + } + .button, input{ + display: block; + width: 100%; + margin-bottom: 10px; + } + .button.medium, input { + padding: 0px 30px 9px; + } + .button.color { + background-color: #31A3DD; + color: #fff; + } + } +} \ No newline at end of file diff --git a/assets/sass/partials/_header.scss b/assets/sass/partials/_header.scss index e69de29..39f244e 100644 --- a/assets/sass/partials/_header.scss +++ b/assets/sass/partials/_header.scss @@ -0,0 +1,47 @@ +#header{ + + .col-md-2{ + padding: 10px; + height: 100%; + border:1px solid #F1F1F1; + i{ + color:#999999; + } + } + .contact div{ + padding: 10px; + height: 100%; + border:1px solid #F1F1F1; + color:#999999; + } + .toolbar{ + border:fixed; + + div:first-child{ + margin: 0 auto; + padding:0 auto; + } + div:nth-child{ + padding:20px; + + } + .col-md-2{ + padding:0; + border:none; + + img{ + margin: 5px 20px; + } + } + a:hover{ + background: #31A3DD; + border-radius:15px; + color: white; + } + ul{ + margin:30px 60px; + border-radius:50%; + } + } + +} \ No newline at end of file diff --git a/assets/sass/partials/_slider.scss b/assets/sass/partials/_slider.scss index e69de29..39aa9a4 100644 --- a/assets/sass/partials/_slider.scss +++ b/assets/sass/partials/_slider.scss @@ -0,0 +1,21 @@ +#slider{ + h3{ + color:black; + } + + span{ + font-size: 1em; + color: black; + + } + .margin{ + font-size: 1.5em; + margin: 0 0 100px 200px; + color: white; + + p{ + color: #31A3DD + } + } + +} \ No newline at end of file diff --git a/image/logo-gray.png b/image/logo-gray.png new file mode 100644 index 0000000..303c494 Binary files /dev/null and b/image/logo-gray.png differ diff --git a/image/logo.png b/image/logo.png new file mode 100644 index 0000000..f3f0af2 Binary files /dev/null and b/image/logo.png differ diff --git a/image/post-1x70x70.jpg b/image/post-1x70x70.jpg new file mode 100644 index 0000000..e8d2979 Binary files /dev/null and b/image/post-1x70x70.jpg differ diff --git a/image/post-2x70x70.jpg b/image/post-2x70x70.jpg new file mode 100644 index 0000000..b2a059e Binary files /dev/null and b/image/post-2x70x70.jpg differ diff --git a/image/slide_1_1.png b/image/slide_1_1.png new file mode 100644 index 0000000..65b6652 Binary files /dev/null and b/image/slide_1_1.png differ diff --git a/image/slide_2_1.png b/image/slide_2_1.png new file mode 100644 index 0000000..2085360 Binary files /dev/null and b/image/slide_2_1.png differ diff --git a/image/slide_2_2.png b/image/slide_2_2.png new file mode 100644 index 0000000..c07ba77 Binary files /dev/null and b/image/slide_2_2.png differ diff --git a/images/demo-2.png b/images/demo-2.png new file mode 100644 index 0000000..f2d7aca Binary files /dev/null and b/images/demo-2.png differ diff --git a/index.html b/index.html index 5f48e5f..44d813e 100644 --- a/index.html +++ b/index.html @@ -2,6 +2,7 @@ + Erato - Responsive Multipurpose HTML5 Template @@ -10,24 +11,235 @@
+
+
+
+ + Call us: 1900.1500.ERATO
+
+ + Email: contact@yoursite.com
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ +
+
+ +
+ -
+
+
+
+ +
-
+
+
+
+
+
+

Retina + Responsive

+

Lorem ipsum dolor sit amet, consectetur adipisicing elit. Repellendus, iste, mollitia magnam reprehenderit nesciunt

+
+
+

Flexible Layout

+

Lorem ipsum dolor sit amet, consectetur adipisicing elit. Repellendus, iste, mollitia magnam reprehenderit nesciunt

+
+
+

Powerful Elements

+

Lorem ipsum dolor sit amet, consectetur adipisicing elit. Repellendus, iste, mollitia magnam reprehenderit nesciunt

+
+
+
+
+
-
+
+
+
+

16328 customer can’t be wrong

+

Praesentium, veritatis, voluptatibus, velit, hic laudantium quia necessitatibus eveniet quam beatae

+ +

Lorem ipsum dolor sit amet, consectetur adipisicing elit. Placeat culpa optio reprehenderit at doloremque quae accusamus pariatur voluptate? Consequatur, earum, possimus culpa quibusdam odio voluptates enim? Aspernatur aut mollitia placeat.

+

John Doe- ER Media

+
+
+
-
+
+
+
+

Our Mission

+ + + +
+
+

Our Statics

+
+

1485

+

CILENTS

+
+
+

1378

+

COFFEE CUP

+
+
+

1601

+

PSD FILES

+
+
+

4

+

WORDPRESS THEMES

+
+
+

2202

+

HTML TEMPLATES

+
+
+

1307

+

FILE CREATES

+
+
+
+
- +