tried to fix index
This commit is contained in:
parent
9c93d1e23c
commit
a3e32a4933
3 changed files with 69 additions and 65 deletions
|
|
@ -164,13 +164,73 @@ header {
|
||||||
/* Index
|
/* Index
|
||||||
================ */
|
================ */
|
||||||
|
|
||||||
.index_start {
|
.hero-image {
|
||||||
background-image: url(/images/backgroud_img/index_bg.jpg);
|
background: url(images/background_img/index_bg.jpg) no-repeat center;
|
||||||
background-size: cover;
|
background-size: cover;
|
||||||
background-position: center;
|
background-color: #f9f9ed ;
|
||||||
top: 0px;
|
height: 500px;
|
||||||
|
position: relative;
|
||||||
|
margin-top: 100px;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.hero-text {
|
||||||
|
justify-content: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.home-about-textbox {
|
||||||
|
background-color: #232323;
|
||||||
|
padding: 10em 20%;
|
||||||
|
width: 100%;
|
||||||
|
outline: 2px solid#f9f9ed;
|
||||||
|
outline-offset: -2.5em;
|
||||||
|
color: #f9f9ed;
|
||||||
|
position: relative;
|
||||||
|
text-align: justify;
|
||||||
|
}
|
||||||
|
|
||||||
|
.home-about-textbox h1 {
|
||||||
|
color: #f9f9ed;
|
||||||
|
position: absolute;
|
||||||
|
left: 50%;
|
||||||
|
transform: translateX(-50%);
|
||||||
|
top: 0.75em;
|
||||||
|
background: #232323;
|
||||||
|
padding: 0 0.145em;
|
||||||
|
}
|
||||||
|
|
||||||
|
@media (min-width: 25rem) {
|
||||||
|
h1 {
|
||||||
|
font-size: 2rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.home-about-textbox h1 {
|
||||||
|
top: 0.6em;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
@media (min-width: 60rem) {
|
||||||
|
h1 {
|
||||||
|
font-size: 2.5rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.home-about {
|
||||||
|
background-repeat: no-repeat;
|
||||||
|
}
|
||||||
|
|
||||||
|
.home-about-textbox {
|
||||||
|
width: 100%;
|
||||||
|
outline-offset: -3.75em;
|
||||||
|
/* margin-left: -2.5%; */
|
||||||
|
text-align: left;
|
||||||
|
box-shadow: 0 0 4em 0 rgba(0, 0, 0, 0.3);
|
||||||
|
}
|
||||||
|
|
||||||
|
.home-about-textbox h1 {
|
||||||
|
top: 0.75em;
|
||||||
|
left: 6rem;
|
||||||
|
transform: translateX(0);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
/* Collection
|
/* Collection
|
||||||
================*/
|
================*/
|
||||||
|
|
@ -179,6 +239,7 @@ div.collection_container {
|
||||||
clear: both;
|
clear: both;
|
||||||
display: flex;
|
display: flex;
|
||||||
flex-wrap: wrap;
|
flex-wrap: wrap;
|
||||||
|
margin-top: 50px;
|
||||||
}
|
}
|
||||||
|
|
||||||
div.collection {
|
div.collection {
|
||||||
|
|
@ -222,11 +283,10 @@ div.collection div.col-desc {
|
||||||
width: 220px;
|
width: 220px;
|
||||||
height: 220px;
|
height: 220px;
|
||||||
border-radius: 50%;
|
border-radius: 50%;
|
||||||
/*border: 2px solid #f9f9ed; */
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.col-image:hover{
|
.col-image:hover{
|
||||||
filter: blur(1px);
|
filter: blur(3px);
|
||||||
filter: brightness(50%);
|
filter: brightness(50%);
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -108,60 +108,7 @@ p:last-of-type {
|
||||||
/* hero-home
|
/* hero-home
|
||||||
=================== */
|
=================== */
|
||||||
|
|
||||||
.home-about-textbox {
|
|
||||||
background-color: #232323;
|
|
||||||
padding: 10em 20%;
|
|
||||||
width: 100%;
|
|
||||||
outline: 2px solid#f9f9ed;
|
|
||||||
outline-offset: -2.5em;
|
|
||||||
color: #f9f9ed;
|
|
||||||
position: relative;
|
|
||||||
text-align: justify;
|
|
||||||
}
|
|
||||||
|
|
||||||
.home-about-textbox h1 {
|
|
||||||
color: #f9f9ed;
|
|
||||||
position: absolute;
|
|
||||||
left: 50%;
|
|
||||||
transform: translateX(-50%);
|
|
||||||
top: 0.75em;
|
|
||||||
background: #232323;
|
|
||||||
padding: 0 0.145em;
|
|
||||||
}
|
|
||||||
|
|
||||||
@media (min-width: 25rem) {
|
|
||||||
h1 {
|
|
||||||
font-size: 2rem;
|
|
||||||
}
|
|
||||||
|
|
||||||
.home-about-textbox h1 {
|
|
||||||
top: 0.6em;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
@media (min-width: 60rem) {
|
|
||||||
h1 {
|
|
||||||
font-size: 2.5rem;
|
|
||||||
}
|
|
||||||
|
|
||||||
.home-about {
|
|
||||||
background-repeat: no-repeat;
|
|
||||||
}
|
|
||||||
|
|
||||||
.home-about-textbox {
|
|
||||||
width: 100%;
|
|
||||||
outline-offset: -3.75em;
|
|
||||||
/* margin-left: -2.5%; */
|
|
||||||
text-align: left;
|
|
||||||
box-shadow: 0 0 4em 0 rgba(0, 0, 0, 0.3);
|
|
||||||
}
|
|
||||||
|
|
||||||
.home-about-textbox h1 {
|
|
||||||
top: 0.75em;
|
|
||||||
left: 6rem;
|
|
||||||
transform: translateX(0);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
/* portfolio
|
/* portfolio
|
||||||
=================== */
|
=================== */
|
||||||
|
|
|
||||||
|
|
@ -1,9 +1,7 @@
|
||||||
<?php include('header.tpl'); ?>
|
<?php include('header.tpl'); ?>
|
||||||
|
|
||||||
<div class="index_start">
|
<div class="hero-image">
|
||||||
<div>
|
Logo
|
||||||
<img src="images\logo_button\title_ivory.png"></img>
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="container">
|
<div class="container">
|
||||||
|
|
@ -102,5 +100,4 @@
|
||||||
<p><a style="color: #f9f9ed; text-decoration: none;" href="https://www.instagram.com/bricabracomania_metalworks/">Check out our instagram page</a></p>
|
<p><a style="color: #f9f9ed; text-decoration: none;" href="https://www.instagram.com/bricabracomania_metalworks/">Check out our instagram page</a></p>
|
||||||
<div id="ig_container"><!-- instagram posts will be inserted here --></div>
|
<div id="ig_container"><!-- instagram posts will be inserted here --></div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<?php include('footer.tpl'); ?>
|
<?php include('footer.tpl'); ?>
|
||||||
Loading…
Reference in a new issue