Compare commits

..

2 commits

Author SHA1 Message Date
31ba0af5dd
feat: added links to shop 2024-10-21 06:36:28 +02:00
424b1e7098
refactor: removed prices section 2024-10-21 06:01:03 +02:00
6 changed files with 22 additions and 508 deletions

View file

@ -5,3 +5,11 @@ body, main, header, footer {
.flex {
display: flex;
}
h1, h2, h3, h4, h5, h6, p, strong {
color: #0F3975;
}
small {
font-size: 1rem !important;
}

View file

@ -160,48 +160,41 @@ h1 {
font-family: 'PT Sans', sans-serif;
font-size: 71px;
font-weight: 700;
color: #0F3975
}
h2 {
font-family: 'PT Sans', sans-serif;
font-size: 57px;
font-weight: 700;
color: #0F3975
}
h3 {
font-family: 'PT Sans', sans-serif;
font-size: 44px;
font-weight: 700;
color: #0F3975
}
h4 {
font-family: 'PT Sans', sans-serif;
font-size: 44px;
font-weight: 500;
color: #0F3975
}
h5 {
font-family: 'PT Sans', sans-serif;
font-size: 32px;
font-weight: 700;
color: #0F3975
}
h6 {
font-family: 'PT Sans', sans-serif;
font-size: 31px;
font-weight: 700;
color: #00123f
}
p {
font-family: 'PT Sans', sans-serif;
font-size: 32px;
color: #00123f
}
.MT_20 {
@ -1108,10 +1101,6 @@ p#link_TS_01:hover {
background-color: #66D6D9
}
p#link_PR_1:hover {
background-color: #66D6D9
}
div.Flex-item_23_5 {
display: flex;
font-weight: 700;
@ -1143,21 +1132,13 @@ p.Flex-item_24_1 {
p.Flex-item_24_2 {
font-size: 60px;
font-weight: 300;
color: #0f3975;
margin: 0 0 30px
}
.Flex-item_24_2 strong {
font-size: 80px
}
p.Flex-item_24_3 {
color: #00123f;
margin: 0 0 40px;
font-size: 24px
}
article.Flex-item_25 {
display: flex;
flex-direction: column;
@ -1194,71 +1175,6 @@ p.Flex-item_25_3 {
line-height: normal
}
section.Flex-Container_15 {
display: flex;
flex-direction: column;
max-width: 1920px;
background-color: #f7f7f7;
}
div.Flex-Container_15_1 {
display: flex;
flex-direction: row;
background-color: #f7f7f7;
}
#link_PR {
font-size: 57px;
padding-top: 5%
}
div.Flex-item_26 {
display: flex;
margin: 0 0 2% 11%
}
div.Flex-item_26_1 {
display: flex;
flex-direction: column;
margin: 60px 8% 60PX 14%;
line-height: normal;
font-size: 35px
}
div.Flex-item_26_2 {
display: flex;
margin: auto;
line-height: normal;
font-size: 50px
}
div.Flex-item_26_3 {
display: flex;
flex-direction: column;
margin: auto auto auto 0;
line-height: normal;
font-size: 45px;
}
div.Flex-item_26_4 {
display: flex;
flex-direction: column;
margin: auto auto auto 11%;
line-height: normal;
font-size: 18px;
overflow-wrap: anywhere;
line-height: normal;
padding-bottom: 20px;
}
p.Flex-item_26_3_1 {
font-size: 45px
}
p.Flex-item_26_3_2 {
font-size: 22px
}
article.Flex-item_27 {
display: flex;
flex-direction: column;
@ -1668,9 +1584,7 @@ section.Flex-Container_18 {
}
p.Flex-item_24_2 {
font-size: 55px;
font-weight: 300;
color: #0f3975;
margin: 0 0 30px
}
.Flex-item_24_2 strong {
font-size: 65px
@ -1678,9 +1592,6 @@ section.Flex-Container_18 {
#link_TS_02 {
font-size: 50px
}
#link_PR {
font-size: 50px
}
}
@media only screen and (max-width: 1650px) {
@ -1766,9 +1677,7 @@ section.Flex-Container_18 {
}
p.Flex-item_24_2 {
font-size: 55px;
font-weight: 300;
color: #0f3975;
margin: 0 0 30px
}
.Flex-item_24_2 strong {
font-size: 65px
@ -1776,9 +1685,6 @@ section.Flex-Container_18 {
#link_TS_02 {
font-size: 50px
}
#link_PR {
font-size: 50px
}
}
@media only screen and (max-width: 1575px) {
@ -2003,9 +1909,7 @@ section.Flex-Container_18 {
}
.Flex-item_24_2 {
font-size: 50px;
font-weight: 300;
color: #0f3975;
margin: 0 0 30px
}
.Flex-item_24_2 strong {
font-size: 60px
@ -2013,9 +1917,6 @@ section.Flex-Container_18 {
#link_TS_02 {
font-size: 50px
}
#link_PR {
font-size: 50px
}
ul.Flex-item_30 {
margin: 20px 0 20px 60px;
font-size: 25px
@ -2213,13 +2114,6 @@ section.Flex-Container_18 {
line-height: normal;
font-size: 41.2pt
}
div.Flex-Container_15_1 {
display: flex;
flex-direction: row;
width: 100%;
background-color: #f7f7f7;
margin: 0 5% 0 0;
}
h2.Flex-item_16 {
margin-top: 60px;
text-decoration: none;
@ -2265,45 +2159,12 @@ section.Flex-Container_18 {
}
p.Flex-item_24_2 {
font-size: 45px;
font-weight: 300;
color: #0f3975;
margin: 0 0 30px
}
#link_TS_02 {
font-size: 45px;
padding-top: 80px
}
#link_PR {
font-size: 45px;
padding-top: 80px
}
div.Flex-item_26_1 {
margin: 60px 8% 60PX 14%;
font-size: 30px
}
div.Flex-item_26_2 {
margin: auto;
font-size: 50px
}
div.Flex-item_26_3 {
display: flex;
flex-direction: column;
margin: auto 120px auto 0;
line-height: normal;
font-size: 45px;
}
p.Flex-item_26_3_1 {
font-size: 40px
}
div.Flex-item_26_4 {
display: flex;
flex-direction: column;
margin: auto auto auto 11%;
line-height: normal;
font-size: 18px;
overflow-wrap: anywhere;
line-height: normal;
}
ul.Flex-item_30 {
margin: 20px 0 20px 60px;
font-size: 22px
@ -2604,35 +2465,14 @@ section.Flex-Container_18 {
}
.Flex-item_24_2 {
font-size: 40px;
font-weight: 300;
color: #0f3975;
margin: 0 0 30px
}
.Flex-item_24_2 strong {
font-size: 55px
}
p.Flex-item_24_3 {
color: #00123f;
margin: 0 0 40px;
font-size: 18px
}
#link_TS_02 {
font-size: 40px
}
#link_PR {
font-size: 40px
}
div.Flex-item_26_1 {
margin: 60px 8% 60PX 14%;
font-size: 28px
}
div.Flex-item_26_2 {
margin: auto;
font-size: 50px
}
p.Flex-item_26_3_1 {
font-size: 40px
}
}
@media only screen and (max-width: 1275px) {
@ -3061,16 +2901,9 @@ section.Flex-Container_18 {
color: #0f3975;
padding-top: 150px
}
#link_PR {
padding-top: 150px
}
h1.Flex-item_28 {
margin: 40px 0 0px 0;
}
div.Flex-item_26_4 {
font-size: 14px;
padding-bottom: 20px;
}
}
@media only screen and (max-width: 1250px) {
@ -3125,33 +2958,14 @@ section.Flex-Container_18 {
}
p.Flex-item_24_2 {
font-size: 35px;
font-weight: 300;
color: #0f3975;
margin: 0 0 10px
}
.Flex-item_24_2 strong {
font-size: 50px
}
p.Flex-item_24_3 {
font-size: 16px
}
#link_TS_02 {
font-size: 35px
}
#link_PR {
font-size: 35px
}
div.Flex-item_26_1 {
margin: 60px 8% 60PX 14%;
font-size: 25px
}
div.Flex-item_26_2 {
margin: auto;
font-size: 45px
}
p.Flex-item_26_3_1 {
font-size: 40px
}
h1.Flex-item_28 {
margin: 40px 0 0px 0;
}
@ -3179,9 +2993,6 @@ section.Flex-Container_18 {
#VM_07 {
padding-bottom: 15px
}
#link_PR {
padding-top: 15%
}
}
@media only screen and (max-width: 1145px) {
@ -3493,27 +3304,11 @@ section.Flex-Container_18 {
}
p.Flex-item_24_2 {
font-size: 30px;
font-weight: 300;
color: #0f3975;
margin: 0 0 10px
}
#link_TS_02 {
font-size: 32px
}
#link_PR {
font-size: 32px
}
div.Flex-item_26_1 {
margin: 60px 8% 60PX 14%;
font-size: 22px
}
div.Flex-item_26_2 {
margin: auto;
font-size: 50px
}
p.Flex-item_26_3_1 {
font-size: 35px
}
section.Flex-Container_17 {
display: flex;
flex-direction: column;
@ -3945,9 +3740,7 @@ section.Flex-Container_18 {
}
p.Flex-item_24_2 {
font-size: 30px;
font-weight: 300;
color: #0f3975;
margin: 0 0 10px
}
.Flex-item_24_2 strong {
font-size: 45px
@ -3956,25 +3749,6 @@ section.Flex-Container_18 {
font-size: 32px;
padding-top: 120px
}
#link_PR {
font-size: 32px;
padding-top: 120px
}
div.Flex-item_26_1 {
margin: 60px 5% 60PX 14%;
font-size: 22px
}
div.Flex-item_26_2 {
margin: auto;
font-size: 50px
}
p.Flex-item_26_3_1 {
font-size: 35px
}
div.Flex-item_26_3 {
margin: auto auto auto 0;
font-size: 38px
}
section.Flex-Container_17 {
display: flex;
flex-direction: column;
@ -4318,26 +4092,12 @@ section.Flex-Container_18 {
}
p.Flex-item_24_2 {
font-size: 30px;
font-weight: 300;
color: #0f3975;
margin: 0 0 10px
}
#link_TS_02 {
font-size: 32px;
padding-top: 120px
}
#link_PR {
font-size: 32px;
padding-top: 120px
}
div.Flex-item_26_1 {
margin: 60px 0 60PX 14%;
font-size: 20px
}
div.Flex-item_26_3 {
margin: auto auto auto 0;
font-size: 40px
}
section.Flex-Container_17 {
display: flex;
flex-direction: column;
@ -4883,50 +4643,19 @@ section.Flex-Container_18 {
}
p.Flex-item_24_2 {
font-size: 35px;
font-weight: 300;
color: #0f3975;
margin: 0 0 10px
}
.Flex-item_24_2 strong {
font-size: 45px
}
p.Flex-item_24_3 {
font-size: 14px
}
#link_TS_02 {
font-size: 32px
}
#link_PR {
font-size: 32px;
cursor: pointer!important
}
article.Flex-item_25 {
display: flex;
flex-direction: column;
margin: 0 3% 0 6%
}
div.Flex-item_26 {
display: flex;
margin: 0 0 2% 6%
}
div.Flex-item_26_1 {
margin: 60px 20px 60PX 12%;
font-size: 20px
}
div.Flex-item_26_2 {
margin: auto 5%;
font-size: 50px
}
p.Flex-item_26_3_1 {
font-size: 35px
}
p.Flex-item_26_3_2 {
font-size: 14px
}
div.Flex-item_26_3 {
margin: auto 6% auto 0;
font-size: 40px
}
article.Flex-item_27 {
display: flex;
flex-direction: column;
@ -4977,18 +4706,6 @@ section.Flex-Container_18 {
padding: 0 15%;
margin-bottom: 0
}
div.Flex-item_26_2 {
margin: auto;
}
div.Flex-item_26_4 {
display: flex;
flex-direction: column;
margin: auto 5% auto 11%;
line-height: normal;
font-size: 12px;
overflow-wrap: anywhere;
line-height: normal;
}
}
@media only screen and (max-width: 770px) {
@ -5472,22 +5189,7 @@ section.Flex-Container_18 {
}
p.Flex-item_24_2 {
font-size: 26px;
font-weight: 300;
color: #0f3975;
margin: 0 0 10px
}
div.Flex-item_26_1 {
margin: 60px 12% 60PX 11%;
font-size: 20px
}
div.Flex-item_26_2 {
margin: auto 5%;
;
font-size: 50px
}
div.Flex-item_26_3 {
margin: auto 5% auto 0;
font-size: 25px
}
section.Flex-Container_16 {
display: flex;
@ -5636,32 +5338,6 @@ section.Flex-Container_18 {
font-size: 32px;
padding-top: 100px
}
#link_PR {
font-size: 32px;
padding-top: 100px
}
div.Flex-Container_15_1 {
display: flex;
flex-direction: column;
}
div.Flex-item_26_1 {
margin: 60px 12% 20px 11%;
font-size: 20px;
}
div.Flex-item_26_2 {
margin: 5px 16%;
font-size: 50px;
}
p.Flex-item_26_3_1 {
margin: 0px 20px 0px 11%;
}
p.Flex-item_26_3_2 {
margin-left: 11%;
padding-bottom: 20px;
}
div.Flex-item_26_4 {
margin-right: 20px;
}
}
@media only screen and (max-width: 640px) {
@ -6272,9 +5948,6 @@ section.Flex-Container_18 {
display: inline-block;
margin-bottom: 5%
}
P#link_PR_1 {
display: inline-block
}
div.Flex-item_24 {
display: flex;
flex-direction: column;
@ -6286,14 +5959,6 @@ section.Flex-Container_18 {
flex-direction: column;
margin: 0 3% 0 11%
}
div.Flex-item_26 {
display: flex;
margin: 0 0 2% 11%
}
div.Flex-item_26_1 {
margin: 60px 8% 20PX 14%;
font-size: 20px
}
article.Flex-item_27 {
display: flex;
flex-direction: column;
@ -6439,24 +6104,6 @@ section.Flex-Container_18 {
font-size: 45px;
margin: -55px 1% 0 -75px
}
section.Flex-Container_15 {
display: flex;
flex-direction: column;
width: 100%;
background-color: #f7f7f7;
margin: 0 5% 0 0
}
div.Flex-item_26_1 {
margin: 60px 5% 20PX 14%;
font-size: 20px
}
div.Flex-item_26_2 {
font-size: 50px
}
div.Flex-item_26_3 {
margin: auto 5% auto 0;
font-size: 25px
}
}
@media only screen and (max-width: 520px) {
@ -6790,10 +6437,6 @@ section.Flex-Container_18 {
#link_TS_02 {
font-size: 28px
}
#link_PR {
font-size: 28px;
cursor: pointer!important
}
h1#BP_06 {
display: block;
position: absolute;
@ -6916,11 +6559,6 @@ section.Flex-Container_18 {
font-size: 24px;
padding-top: 90px
}
#link_PR {
font-size: 24px;
cursor: pointer!important;
padding-top: 90px
}
img#Location_Map {
position: relative;
width: 1000px;
@ -6931,14 +6569,6 @@ section.Flex-Container_18 {
overflow-x: scroll;
overflow-y: scroll
}
div.Flex-item_26 {
display: flex;
margin: 0 0 2% 10%
}
div.Flex-item_26_1 {
margin: 60px 5% 20PX 18%;
font-size: 20px
}
article.Flex-item_27 {
display: flex;
flex-direction: column;
@ -7006,8 +6636,4 @@ section.Flex-Container_18 {
#link_TS_02 {
font-size: 22px
}
#link_PR {
font-size: 22px;
cursor: pointer!important
}
}

View file

@ -20,9 +20,6 @@
<a href="#link_TS_02">
<p id="link_TS_01"><span>Technical Specifications</span></p>
</a>
<a href="#link_PR">
<p id="link_PR_1"><span>Prices</span></p>
</a>
</div>
</div>
</div>
@ -61,34 +58,6 @@
</div>
</article>
<div>
<div class="Flex-item_26">
<h4 id="link_PR">Prices</h4>
</div>
<section class="Flex-Container_15">
<div class="Flex-Container_15_1">
<div class="Flex-item_26_1">
<ul>
<li><strong>All your documents<sup>*</sup> </strong>saved remotely
</strong>
</li>
<li class="MT_40">2 copies at all times</li>
<li class="MT_40">Monitoring and follow-up of backups included</li>
</ul>
</div>
<div class="Flex-item_26_2">
<p>=</p>
</div>
<div class="Flex-item_26_3">
<p class="Flex-item_26_3_1"><strong>on demand</strong></p>
<p class="Flex-item_26_3_2">excluding taxes</p>
</div>
</div>
<div class="Flex-item_26_4">
<small> (*) based on fair use, subject to prior analysis and acceptance by e-Durable. In case of
large volume of data additional fees may apply.</small>
</div>
</section>
<article class="Flex-item_27">
<p class="Flex-item_27_1">
Unlike our competitors, we can offer you exactly what you need as we do not base our prices only on large data size chunks. We'll provide a sound backup strategy, based on your business type and on your exact needs, all while optimizing resource usage.

View file

@ -18,19 +18,18 @@
<a href="#link_TS_02">
<p id="link_TS_01"><span>Technical Specifications</span></p>
</a>
<a href="#link_PR">
<p id="link_PR_1"><span>Prices</span></p>
</a>
</div>
</div>
</div>
<div class="Flex-item_24">
<p class="Flex-item_24_1">All inclusive flat fee</p>
<p class="Flex-item_24_2"><strong>on demand</strong></p>
<p class="Flex-item_24_3">excluding taxes</p>
<a href="become-client.html"><button id="btn_01" class="button_01">
<p class="Flex-item_24_2"><small>Starting</small> <strong>19.-</strong></p>
<p><small>Taxes excl.</small></p>
<a href="https://www.recycled.cloud/en_GB/shop?search=VM">
<button id="btn_01" class="button_01 MT_40">
<h5>I'm interested</h5>
</button></a>
</button>
</a>
</div>
</section>
<section class="Flex-Container_10">
@ -56,29 +55,6 @@
</p>
</div>
</article>
<div>
<div class="Flex-item_26">
<h4 id="link_PR">Prices</h4>
</div>
<section class="Flex-Container_15">
<div class="Flex-Container_15_1">
<div class="Flex-item_26_1">
<ul>
<li>1 CPU</li>
<li class="MT_40">2 GB RAM</li>
<li class="MT_40">20 GB disk space</li>
</ul>
</div>
<div class="Flex-item_26_2 ">
<p class="MT_20">=</p>
</div>
<div class="Flex-item_26_3">
<p class="Flex-item_26_3_1 MT_20"><strong>on demand</strong></p>
<p class="Flex-item_26_3_2 MT_20">excluding taxes</p>
</div>
</div>
</div>
</section>
<article class="Flex-item_27">
<p class="Flex-item_27_1">
@ -91,8 +67,7 @@
<h2 class="Flex-item_06">Interested?</h2>
</div>
<div class="Flex-Container_07_2">
<h4 class=" Flex-item_07 ">Take your first step to make</br> your IT more sustainable
</h4>
<h4 class=" Flex-item_07 ">Take your first step to make</br> your IT more sustainable</h4>
<div>
<a href="become-client.html"><button type="button" id="btn_BC_01" class="button_02 ">

View file

@ -20,9 +20,6 @@
<a href="#link_TS_02">
<p id="link_TS_01"><span>Caract&eacute;ristiques techniques</span></p>
</a>
<a href="#link_PR">
<p id="link_PR_1"><span>Tarifs</span></p>
</a>
</div>
</div>
</div>
@ -61,40 +58,6 @@
</p>
</div>
</article>
<div>
<div class="Flex-item_26">
<h4 id="link_PR">Tarifs</h4>
</div>
<section class="Flex-Container_15">
<div class="Flex-Container_15_1">
<div class="Flex-item_26_1">
<ul>
<li><strong>Tous vos documents<sup>*</sup> </strong>sauvergard&eacute;s &agrave; distance
</strong>
</li>
<li class="MT_40">2 copies en permanence</li>
<li class="MT_40">Surveillance et suivi des sauvegardes inclus</li>
</ul>
</div>
<div class="Flex-item_26_2">
<p>=</p>
</div>
<div class="Flex-item_26_3">
<p class="Flex-item_26_3_1"> <strong>sur demande</strong></p>
<p class="Flex-item_26_3_2">hors taxes</p>
</div>
</div>
<div class="Flex-item_26_4">
<small>(*) bas&eacute; sur une utilisation raisonn&eacute; sous réserve d'analyse et acceptation
pr&eacute;alable par e-Durable. Des frais supplémentaires peuvent s'appliquer en cas de volume
important de données.
</small>
</div>
</section>
</div>
<article class="Flex-item_27">
<p class="Flex-item_27_1">
Contrairement &agrave; nos concurrents, nous pouvons vous offrir exactement ce dont vous avez besoin car nous ne basons pas nos prix uniquement sur des promesses de grands espaces de stockage qui resteront vides. Nous vous fournirons une strat&eacute;gie

View file

@ -8,8 +8,7 @@
<div class="Flex-item_23_1">
<div class="Flex-item_23_2">
<img id="logo_11" src="assets/Virtual_Machines.svg" alt="Backup logo">
<h1 id="BP_05">Machines Virtuelles
</h1>
<h1 id="BP_05">Machines Virtuelles</h1>
</div>
<p class="Flex-item_23_3">Nous proposons l'h&eacute;bergement de machines virtuelles, ce qui vous permet de virtualiser et g&eacute;rer vos serveurs dans notre cloud.
</p>
@ -21,19 +20,18 @@
<a href="#link_TS_02">
<p id="link_TS_01"><span>Caract&eacute;ristiques techniques</span></p>
</a>
<a href="#link_PR">
<p id="link_PR_1"><span>Tarifs</span></p>
</a>
</div>
</div>
</div>
<div class="Flex-item_24">
<p class="Flex-item_24_1">Tarif forfaitaire tout compris</p>
<p class="Flex-item_24_2"><strong>sur demande</strong></p>
<p class="Flex-item_24_3">hors taxes</p>
<a href="become-client.html"><button id="btn_01" class="button_01">
<p class="Flex-item_24_2"><small>À partir de</small> <strong>19.-</strong></p>
<p><small>Hors taxes</small></p>
<a href="https://www.recycled.cloud/shop?search=VM">
<button id="btn_01" class="button_01 MT_40">
<h5>Je suis int&eacute;ress&eacute;</h5>
</button></a>
</button>
</a>
</div>
</section>
<section class="Flex-Container_10">
@ -60,36 +58,11 @@
</p>
</div>
</article>
<div>
<div class="Flex-item_26">
<h4 id="link_PR">Tarifs</h4>
</div>
<section class="Flex-Container_15">
<div class="Flex-Container_15_1">
<div class="Flex-item_26_1">
<ul>
<li>1 CPU</li>
<li class="MT_40">2 GB RAM</li>
<li class="MT_40">20 GB d'espace disque</li>
</ul>
</div>
<div class="Flex-item_26_2 ">
<p class="MT_20">=</p>
</div>
<div class="Flex-item_26_3">
<p class="Flex-item_26_3_1 MT_20"> <strong>sur demande</strong></p>
<p class="Flex-item_26_3_2 MT_20">hors taxes</p>
</div>
</div>
</div>
</section>
<article class="Flex-item_27">
<p class="Flex-item_27_1">
Contrairement &agrave; nos concurrents, nous pouvons vous offrir exactement ce dont vous avez besoin, et vous fournir une configuration sur mesure. Veuillez nous contacter pour une offre personnalis&eacute;e afin de ne pas payer pour ce qui n'est pas
n&eacute;cessaire. </p>
</article>
</div>
<article class="Flex-Container_07">
<div class="Flex-Container_07_1">
<h2 class="Flex-item_06">Int&eacute;rress&eacute; ?</h2>