responsive on our team
This commit is contained in:
parent
63ce62f326
commit
9e8fb32160
|
|
@ -1,5 +1,5 @@
|
|||
#full_creative{
|
||||
background: white;
|
||||
#full_creative {
|
||||
background: white;
|
||||
min-height: 120vh;
|
||||
|
||||
.title {
|
||||
|
|
@ -16,6 +16,7 @@ background: white;
|
|||
.columns {
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
.sub-title {
|
||||
font-family: 'GT Walsheim Pro';
|
||||
font-style: normal;
|
||||
|
|
@ -25,15 +26,42 @@ background: white;
|
|||
letter-spacing: -0.04em;
|
||||
color: #020225;
|
||||
margin-bottom: 1rem;
|
||||
+ .sub-title{
|
||||
|
||||
+ .sub-title {
|
||||
margin-top: 2rem;
|
||||
}
|
||||
}
|
||||
p{
|
||||
|
||||
p {
|
||||
font-weight: 400;
|
||||
font-size: 16px;
|
||||
line-height: 110%;
|
||||
margin-bottom: 4rem;
|
||||
padding-right: 2rem;
|
||||
}
|
||||
img{
|
||||
max-width: 80vw;
|
||||
}
|
||||
}
|
||||
|
||||
@media all and (max-width: 1500px) {
|
||||
#full_creative {
|
||||
padding-bottom: 20rem;
|
||||
.title{
|
||||
padding: 2rem;
|
||||
}
|
||||
.column{
|
||||
padding: 2rem;
|
||||
p{
|
||||
font-size: 1.5rem;
|
||||
}
|
||||
}
|
||||
.column, .columns {
|
||||
display: block;
|
||||
}
|
||||
img{
|
||||
margin-bottom: 15rem;
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
|
|
|||
|
|
@ -40,8 +40,10 @@
|
|||
}
|
||||
}
|
||||
|
||||
@media screen and (max-width: 1023px) {
|
||||
@media screen and (max-width: 1500px) {
|
||||
#our_team{
|
||||
margin-top: 20rem;
|
||||
padding-bottom: 20rem;
|
||||
img{
|
||||
max-width: 100%;
|
||||
margin: 0 auto;
|
||||
|
|
@ -49,6 +51,12 @@
|
|||
.columns, .colmumn{
|
||||
display: block;
|
||||
}
|
||||
.name{
|
||||
font-size: 1.5rem;
|
||||
}
|
||||
.sub-category{
|
||||
margin-bottom: 10rem;
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
|
|
|||
|
|
@ -7,8 +7,6 @@
|
|||
<main class="has-text-centered">
|
||||
<!-- sprint 4 content-->
|
||||
<div id="sprint_4">
|
||||
<!-- responsive managed until here -->
|
||||
|
||||
<section id="china">
|
||||
<h2 class="title primary-color">
|
||||
Our China-inspired ui in 4 pillars
|
||||
|
|
@ -153,6 +151,152 @@
|
|||
Project
|
||||
</div>
|
||||
</section>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<section id="full_creative">
|
||||
<h2 class="title secondary-color">
|
||||
A full creative & production Studio in Paris
|
||||
</h2>
|
||||
<div class="container">
|
||||
<div class="tiles columns dark-color">
|
||||
<div class="aside column">
|
||||
<h3 class="sub-title">
|
||||
Sesame Studio Spaces
|
||||
</h3>
|
||||
<p>
|
||||
2 Large Sets for Photos, Videos and Live Shopping Shooting
|
||||
Adaptable lighting racks
|
||||
Walls and decor for in-apartment style shooting
|
||||
LED Screen Background
|
||||
<br>
|
||||
1 Small Set for Stills Life Shooting
|
||||
<br>
|
||||
1 Space for 720° with turntable and 720° robot
|
||||
<br>Editing Room equipped for voice recording
|
||||
<br>Styling Room
|
||||
<br>Glam Room
|
||||
<br>Separated Storrage Room safe for brand’s products
|
||||
</p>
|
||||
<h3 class="sub-title">
|
||||
Full Service & Adaptative Team
|
||||
</h3>
|
||||
<p>
|
||||
Studio Manager, Lighting Technician.
|
||||
<br>Digital Creative Director, Motion Design, UX Designer, 3D Design.
|
||||
<br>Large network of freelances specialized in all categories, premium and luxury included.
|
||||
</p>
|
||||
</div>
|
||||
<div class="picture column">
|
||||
<img
|
||||
src="img/pictures_rooms.png"
|
||||
alt="rooms"
|
||||
>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
|
||||
<section id="our_team">
|
||||
<h2 class="title primary-color">
|
||||
Our team.
|
||||
</h2>
|
||||
<div class="sub-category dark-color">
|
||||
<p class="sub-title">
|
||||
of experts and directors.
|
||||
</p>
|
||||
<div class="columns">
|
||||
<div class="person column">
|
||||
<img
|
||||
src="img/Rectangle 6.jpg"
|
||||
alt="people"
|
||||
>
|
||||
<p class="name">
|
||||
Name Surname
|
||||
</p>
|
||||
</div>
|
||||
<div class="person column">
|
||||
<img
|
||||
src="img/Rectangle%206-1.jpg"
|
||||
alt="people"
|
||||
>
|
||||
|
||||
<p class="name">
|
||||
Name Surname
|
||||
</p>
|
||||
</div>
|
||||
<div class="person column">
|
||||
<img
|
||||
src="img/people%202.png"
|
||||
alt="people"
|
||||
>
|
||||
|
||||
<p class="name">
|
||||
Name Surname
|
||||
</p>
|
||||
</div>
|
||||
<div class="person column">
|
||||
<img
|
||||
src="img/Rectangle 6-3.jpg"
|
||||
alt="people"
|
||||
>
|
||||
|
||||
<p class="name">
|
||||
Name Surname
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<div class="sub-category">
|
||||
<h3 class="sub-title">
|
||||
and our senior team
|
||||
</h3>
|
||||
<div class="columns">
|
||||
<div class="person column">
|
||||
<img
|
||||
src="img/Rectangle 6-4.jpg"
|
||||
alt="people"
|
||||
>
|
||||
<p class="name">
|
||||
Name Surname
|
||||
</p>
|
||||
</div>
|
||||
<div class="person column">
|
||||
<img
|
||||
src="img/Rectangle%206-5.jpg"
|
||||
alt="people"
|
||||
>
|
||||
<p class="name">
|
||||
Name Surname
|
||||
</p>
|
||||
</div>
|
||||
<div class="person column">
|
||||
<img
|
||||
src="img/Rectangle 6-6.jpg"
|
||||
alt="people"
|
||||
>
|
||||
<p class="name">
|
||||
Name Surname
|
||||
</p>
|
||||
</div>
|
||||
<div class="person column">
|
||||
<img
|
||||
src="img/Rectangle%206-7.jpg"
|
||||
alt="people"
|
||||
>
|
||||
<p class="name">
|
||||
Name Surname
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
<!-- responsive managed until here -->
|
||||
</div>
|
||||
</main>
|
||||
</template>
|
||||
|
|
|
|||
|
|
@ -97,144 +97,6 @@
|
|||
|
||||
|
||||
|
||||
<section id="full_creative">
|
||||
<h2 class="title secondary-color">
|
||||
A full creative & production Studio in Paris
|
||||
</h2>
|
||||
<div class="container">
|
||||
<div class="tiles columns dark-color">
|
||||
<div class="aside column">
|
||||
<h3 class="sub-title">
|
||||
Sesame Studio Spaces
|
||||
</h3>
|
||||
<p>
|
||||
2 Large Sets for Photos, Videos and Live Shopping Shooting
|
||||
Adaptable lighting racks
|
||||
Walls and decor for in-apartment style shooting
|
||||
LED Screen Background
|
||||
<br>
|
||||
1 Small Set for Stills Life Shooting
|
||||
<br>
|
||||
1 Space for 720° with turntable and 720° robot
|
||||
<br>Editing Room equipped for voice recording
|
||||
<br>Styling Room
|
||||
<br>Glam Room
|
||||
<br>Separated Storrage Room safe for brand’s products
|
||||
</p>
|
||||
<h3 class="sub-title">
|
||||
Full Service & Adaptative Team
|
||||
</h3>
|
||||
<p>
|
||||
Studio Manager, Lighting Technician.
|
||||
<br>Digital Creative Director, Motion Design, UX Designer, 3D Design.
|
||||
<br>Large network of freelances specialized in all categories, premium and luxury included.
|
||||
</p>
|
||||
</div>
|
||||
<div class="picture column">
|
||||
<img
|
||||
src="img/pictures_rooms.png"
|
||||
alt="rooms"
|
||||
>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
<section id="our_team">
|
||||
<h2 class="title primary-color">
|
||||
Our team.
|
||||
</h2>
|
||||
<div class="sub-category dark-color">
|
||||
<p class="sub-title">
|
||||
of experts and directors.
|
||||
</p>
|
||||
<div class="columns">
|
||||
<div class="person column">
|
||||
<img
|
||||
src="img/Rectangle 6.jpg"
|
||||
alt="people"
|
||||
>
|
||||
<p class="name">
|
||||
Name Surname
|
||||
</p>
|
||||
</div>
|
||||
<div class="person column">
|
||||
<img
|
||||
src="img/Rectangle%206-1.jpg"
|
||||
alt="people"
|
||||
>
|
||||
|
||||
<p class="name">
|
||||
Name Surname
|
||||
</p>
|
||||
</div>
|
||||
<div class="person column">
|
||||
<img
|
||||
src="img/people%202.png"
|
||||
alt="people"
|
||||
>
|
||||
|
||||
<p class="name">
|
||||
Name Surname
|
||||
</p>
|
||||
</div>
|
||||
<div class="person column">
|
||||
<img
|
||||
src="img/Rectangle 6-3.jpg"
|
||||
alt="people"
|
||||
>
|
||||
|
||||
<p class="name">
|
||||
Name Surname
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<div class="sub-category">
|
||||
<h3 class="sub-title">
|
||||
and our senior team
|
||||
</h3>
|
||||
<div class="columns">
|
||||
<div class="person column">
|
||||
<img
|
||||
src="img/Rectangle 6-4.jpg"
|
||||
alt="people"
|
||||
>
|
||||
<p class="name">
|
||||
Name Surname
|
||||
</p>
|
||||
</div>
|
||||
<div class="person column">
|
||||
<img
|
||||
src="img/Rectangle%206-5.jpg"
|
||||
alt="people"
|
||||
>
|
||||
<p class="name">
|
||||
Name Surname
|
||||
</p>
|
||||
</div>
|
||||
<div class="person column">
|
||||
<img
|
||||
src="img/Rectangle 6-6.jpg"
|
||||
alt="people"
|
||||
>
|
||||
<p class="name">
|
||||
Name Surname
|
||||
</p>
|
||||
</div>
|
||||
<div class="person column">
|
||||
<img
|
||||
src="img/Rectangle%206-7.jpg"
|
||||
alt="people"
|
||||
>
|
||||
<p class="name">
|
||||
Name Surname
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
<section id="china_achievements">
|
||||
<div class="columns">
|
||||
<div class="column">
|
||||
|
|
|
|||
Loading…
Reference in New Issue