diff --git a/.DS_Store b/.DS_Store index ab9822d..47fdc34 100644 Binary files a/.DS_Store and b/.DS_Store differ diff --git a/css/.DS_Store b/css/.DS_Store new file mode 100644 index 0000000..5008ddf Binary files /dev/null and b/css/.DS_Store differ diff --git a/css/style.css b/css/style.css index 7bb5516..50ad965 100755 --- a/css/style.css +++ b/css/style.css @@ -1,4 +1,7 @@ - body{ + + + +body{ font-size:14px; font-weight:300; line-height:30px; @@ -8,6 +11,7 @@ color:#000; } + ul{ margin:0; padding:0; @@ -68,6 +72,10 @@ p.ex3 { padding-top: 25px; } +p.ex4 { + padding-top: 0px; +} + h3{ font-size:30px; } @@ -243,6 +251,12 @@ ul.navbar-nav li a{ margin-bottom:50px; } +#keynotes{ + background: #fff; +} + + + #features{ background: #fff; } @@ -273,6 +287,110 @@ ul.navbar-nav li a{ margin-bottom:30px; } +#timeline0 { + background-color: #fff; + font-family: Helvetica, sans-serif; +} + +#timeline1 { + background-color: #fff; + font-family: Helvetica, sans-serif; +} + +#timeline2 { + background-color: #fff; + font-family: Helvetica, sans-serif; +} + +#timeline3 { + background-color: #fff; + font-family: Helvetica, sans-serif; +} + +.timeline { + width: 100%; + max-width: 2400px; + background: #fff; + padding: 100px 50px; + position: relative; + box-shadow: 0.5rem 0.5rem 2rem 0 rgba(0, 0, 0, 0.2); +} +.timeline:before { + content: ''; + position: absolute; + top: 0px; + left: calc(33%); + bottom: 0px; + width: 4px; + background: red; +} +.timeline:after { + content: ""; + display: table; + clear: both; +} + +.entry { + clear: both; + text-align: left; + position: relative; +} +.entry .title { + margin-bottom: .5em; + float: left; + width: 33%; + padding-right: 30px; + text-align: right; + position: relative; +} +.entry .title:before { + content: ''; + position: absolute; + width: 20px; + height: 20px; + border: 4px solid salmon; + background-color: #fff; + border-radius: 100%; + border-color: red; + top: 15%; + right: 5px; + z-index: 99; +} +.entry .title h3 { + margin: 0; + text-align: right; + font-size: 120%; +} +.entry .title p { + margin: 0; + font-size: 100%; +} +.entry .body { + margin: 0 0 3em; + float: right; + width: 66%; + padding-left: 30px; +} +.entry .body p { + line-height: 1.4em; +} +.entry .body p:first-child { + margin-top: 0; + font-weight: 400; + font-size: 18px; +} +.entry .body ul { + color: #000; + padding-left: 0; + list-style-type: none; +} +.entry .body ul li:before { + content: "–"; + margin-right: 0.5em; +} + + + /*Services*/ @@ -1121,130 +1239,3 @@ form#commentform textarea { } - - -/* The actual timeline (the vertical ruler) */ -.timeline { - background: #fff; - position: relative; - max-width: 1200px; - margin: 0 auto; -} - -/* The actual timeline (the vertical ruler) */ -.timeline::after { - content: ''; - position: absolute; - width: 6px; - background-color: #fff; - top: 0; - bottom: 0; - left: 50%; - margin-left: -3px; -} - -/* Container around content */ -.container2 { - padding: 10px 40px; - position: relative; - background-color: #999; - width: 50%; -} - -/* The circles on the timeline */ -.container2::after { - content: ''; - position: absolute; - width: 25px; - height: 25px; - right: -17px; - background-color: #111; - border: 4px solid #FF9F55; - top: 15px; - border-radius: 50%; - z-index: 1; -} - -/* Place the container to the left */ -.left { - left: 0; -} - -/* Place the container to the right */ -.right { - left: 50%; -} - -/* Add arrows to the left container (pointing right) */ -.left::before { - content: " "; - height: 0; - position: absolute; - top: 22px; - width: 0; - z-index: 1; - right: 30px; - border: medium solid white; - border-width: 10px 0 10px 10px; - border-color: transparent transparent transparent white; -} - -/* Add arrows to the right container (pointing left) */ -.right::before { - content: " "; - height: 0; - position: absolute; - top: 22px; - width: 0; - z-index: 1; - left: 30px; - border: medium solid white; - border-width: 10px 10px 10px 0; - border-color: transparent white transparent transparent; -} - -/* Fix the circle for containers on the right side */ -.right::after { - left: -16px; -} - -/* The actual content */ -.content { - padding: 20px 30px; - background-color: white; - position: relative; - border-radius: 6px; -} - -/* Media queries - Responsive timeline on screens less than 600px wide */ -@media screen and (max-width: 600px) { - /* Place the timelime to the left */ - .timeline::after { - left: 31px; - } - - /* Full-width containers */ - .container2 { - width: 100%; - padding-left: 70px; - padding-right: 25px; - } - - /* Make sure that all arrows are pointing leftwards */ - .container2::before { - left: 60px; - border: medium solid white; - border-width: 10px 10px 10px 0; - border-color: transparent white transparent transparent; - } - - /* Make sure all circles are at the same spot */ - .left::after, .right::after { - left: 15px; - } - - /* Make all right containers behave like the left ones */ - .right { - left: 0%; - } -} diff --git a/img/logo_gioconda.png b/img/logo_gioconda.png new file mode 100755 index 0000000..5db7c23 Binary files /dev/null and b/img/logo_gioconda.png differ diff --git a/index.html b/index.html index f5297b4..bc3cd6e 100644 --- a/index.html +++ b/index.html @@ -57,7 +57,9 @@