From: ronan le priol Date: Wed, 25 Sep 2013 08:17:11 +0000 (+0200) Subject: initialisation X-Git-Url: https://git.parisson.com/?a=commitdiff_plain;h=e7a3a7ff9c2aa2e377d8a236546fd4ae94b2044f;p=telecasting-www.git initialisation --- e7a3a7ff9c2aa2e377d8a236546fd4ae94b2044f diff --git a/css/font.css b/css/font.css new file mode 100644 index 0000000..7156079 --- /dev/null +++ b/css/font.css @@ -0,0 +1,242 @@ +/*_____________________________________________________________________*/ +/* Font */ +/*_____________________________________________________________________*/ + +@font-face { + font-family: 'open_sansbold'; + src: url('../font/OpenSans-Bold-webfont.eot'); + src: url('../font/OpenSans-Bold-webfont.eot?#iefix') format('embedded-opentype'), + url('../font/OpenSans-Bold-webfont.woff') format('woff'), + url('../font/OpenSans-Bold-webfont.ttf') format('truetype'), + url('../font/OpenSans-Bold-webfont.svg#open_sansbold') format('svg'); + font-weight: normal; + font-style: normal; + +} + +@font-face { + font-family: 'open_sanssemibold'; + src: url('../font/OpenSans-Semibold-webfont.eot'); + src: url('../font/OpenSans-Semibold-webfont.eot?#iefix') format('embedded-opentype'), + url('../font/OpenSans-Semibold-webfont.woff') format('woff'), + url('../font/OpenSans-Semibold-webfont.ttf') format('truetype'), + url('../font/OpenSans-Semibold-webfont.svg#open_sanssemibold') format('svg'); + font-weight: normal; + font-style: normal; + +} + +@font-face { + font-family: 'open_sanslight'; + src: url('../font/OpenSans-Light-webfont.eot'); + src: url('../font/OpenSans-Light-webfont.eot?#iefix') format('embedded-opentype'), + url('../font/OpenSans-Light-webfont.woff') format('woff'), + url('../font/OpenSans-Light-webfont.ttf') format('truetype'), + url('../font/OpenSans-Light-webfont.svg#open_sanslight') format('svg'); + font-weight: normal; + font-style: normal; + +} + +@font-face { + font-family: 'open_sansregular'; + src: url('../font/OpenSans-Regular-webfont.eot'); + src: url('../font/OpenSans-Regular-webfont.eot?#iefix') format('embedded-opentype'), + url('../font/OpenSans-Regular-webfont.woff') format('woff'), + url('../font/OpenSans-Regular-webfont.ttf') format('truetype'), + url('../font/OpenSans-Regular-webfont.svg#open_sansregular') format('svg'); + font-weight: normal; + font-style: normal; + +} + + +@font-face { + font-family: 'webfontbold'; + src: url('../font/nevis-webfont.eot'); + src: url('../font/nevis-webfont.eot?#iefix') format('embedded-opentype'), + url('../font/nevis-webfont.woff') format('woff'), + url('../font/nevis-webfont.ttf') format('truetype'), + url('../font/nevis-webfont.svg#webfontbold') format('svg'); + font-weight: normal; + font-style: normal; + +} + + +@font-face { + font-family: 'source_sans_problack'; + src: url('../font/sourcesanspro-black-webfont.eot'); + src: url('../font/sourcesanspro-black-webfont.eot?#iefix') format('embedded-opentype'), + url('../font/sourcesanspro-black-webfont.woff') format('woff'), + url('../font/sourcesanspro-black-webfont.ttf') format('truetype'), + url('../font/sourcesanspro-black-webfont.svg#source_sans_problack') format('svg'); + font-weight: normal; + font-style: normal; + +} + + + + +@font-face { + font-family: 'source_sans_problack_italic'; + src: url('../font/sourcesanspro-blackit-webfont.eot'); + src: url('../font/sourcesanspro-blackit-webfont.eot?#iefix') format('embedded-opentype'), + url('../font/sourcesanspro-blackit-webfont.woff') format('woff'), + url('../font/sourcesanspro-blackit-webfont.ttf') format('truetype'), + url('../font/sourcesanspro-blackit-webfont.svg#source_sans_problack_italic') format('svg'); + font-weight: normal; + font-style: normal; + +} + + + + +@font-face { + font-family: 'source_sans_probold'; + src: url('../font/sourcesanspro-bold-webfont.eot'); + src: url('../font/sourcesanspro-bold-webfont.eot?#iefix') format('embedded-opentype'), + url('../font/sourcesanspro-bold-webfont.woff') format('woff'), + url('../font/sourcesanspro-bold-webfont.ttf') format('truetype'), + url('../font/sourcesanspro-bold-webfont.svg#source_sans_probold') format('svg'); + font-weight: normal; + font-style: normal; + +} + + + + +@font-face { + font-family: 'source_sans_probold_italic'; + src: url('../font/sourcesanspro-boldit-webfont.eot'); + src: url('../font/sourcesanspro-boldit-webfont.eot?#iefix') format('embedded-opentype'), + url('../font/sourcesanspro-boldit-webfont.woff') format('woff'), + url('../font/sourcesanspro-boldit-webfont.ttf') format('truetype'), + url('../font/sourcesanspro-boldit-webfont.svg#source_sans_probold_italic') format('svg'); + font-weight: normal; + font-style: normal; + +} + + + + +@font-face { + font-family: 'source_sans_proextralight'; + src: url('../font/sourcesanspro-extralight-webfont.eot'); + src: url('../font/sourcesanspro-extralight-webfont.eot?#iefix') format('embedded-opentype'), + url('../font/sourcesanspro-extralight-webfont.woff') format('woff'), + url('../font/sourcesanspro-extralight-webfont.ttf') format('truetype'), + url('../font/sourcesanspro-extralight-webfont.svg#source_sans_proextralight') format('svg'); + font-weight: normal; + font-style: normal; + +} + + + + +@font-face { + font-family: 'source_sans_proXLtIt'; + src: url('../font/sourcesanspro-extralightit-webfont.eot'); + src: url('../font/sourcesanspro-extralightit-webfont.eot?#iefix') format('embedded-opentype'), + url('../font/sourcesanspro-extralightit-webfont.woff') format('woff'), + url('../font/sourcesanspro-extralightit-webfont.ttf') format('truetype'), + url('../font/sourcesanspro-extralightit-webfont.svg#source_sans_proXLtIt') format('svg'); + font-weight: normal; + font-style: normal; + +} + + + + +@font-face { + font-family: 'source_sans_proitalic'; + src: url('../font/sourcesanspro-it-webfont.eot'); + src: url('../font/sourcesanspro-it-webfont.eot?#iefix') format('embedded-opentype'), + url('../font/sourcesanspro-it-webfont.woff') format('woff'), + url('../font/sourcesanspro-it-webfont.ttf') format('truetype'), + url('../font/sourcesanspro-it-webfont.svg#source_sans_proitalic') format('svg'); + font-weight: normal; + font-style: normal; + +} + + + + +@font-face { + font-family: 'source_sans_prolight'; + src: url('../font/sourcesanspro-light-webfont.eot'); + src: url('../font/sourcesanspro-light-webfont.eot?#iefix') format('embedded-opentype'), + url('../font/sourcesanspro-light-webfont.woff') format('woff'), + url('../font/sourcesanspro-light-webfont.ttf') format('truetype'), + url('../font/sourcesanspro-light-webfont.svg#source_sans_prolight') format('svg'); + font-weight: normal; + font-style: normal; + +} + + + + +@font-face { + font-family: 'source_sans_prolight_italic'; + src: url('../font/sourcesanspro-lightit-webfont.eot'); + src: url('../font/sourcesanspro-lightit-webfont.eot?#iefix') format('embedded-opentype'), + url('../font/sourcesanspro-lightit-webfont.woff') format('woff'), + url('../font/sourcesanspro-lightit-webfont.ttf') format('truetype'), + url('../font/sourcesanspro-lightit-webfont.svg#source_sans_prolight_italic') format('svg'); + font-weight: normal; + font-style: normal; + +} + + + + +@font-face { + font-family: 'source_sans_proregular'; + src: url('../font/sourcesanspro-regular-webfont.eot'); + src: url('../font/sourcesanspro-regular-webfont.eot?#iefix') format('embedded-opentype'), + url('../font/sourcesanspro-regular-webfont.woff') format('woff'), + url('../font/sourcesanspro-regular-webfont.ttf') format('truetype'), + url('../font/sourcesanspro-regular-webfont.svg#source_sans_proregular') format('svg'); + font-weight: normal; + font-style: normal; + +} + + + + +@font-face { + font-family: 'source_sans_proSBdIt'; + src: url('../font/sourcesanspro-semiboldit-webfont.eot'); + src: url('../font/sourcesanspro-semiboldit-webfont.eot?#iefix') format('embedded-opentype'), + url('../font/sourcesanspro-semiboldit-webfont.woff') format('woff'), + url('../font/sourcesanspro-semiboldit-webfont.ttf') format('truetype'), + url('../font/sourcesanspro-semiboldit-webfont.svg#source_sans_proSBdIt') format('svg'); + font-weight: normal; + font-style: normal; + +} + + + + +@font-face { + font-family: 'source_sans_prosemibold'; + src: url('../font/sourcesanspro-semibold-webfont.eot'); + src: url('../font/sourcesanspro-semibold-webfont.eot?#iefix') format('embedded-opentype'), + url('../font/sourcesanspro-semibold-webfont.woff') format('woff'), + url('../font/sourcesanspro-semibold-webfont.ttf') format('truetype'), + url('../font/sourcesanspro-semibold-webfont.svg#source_sans_prosemibold') format('svg'); + font-weight: normal; + font-style: normal; + +} \ No newline at end of file diff --git a/css/gamme.css b/css/gamme.css new file mode 100644 index 0000000..ffe735c --- /dev/null +++ b/css/gamme.css @@ -0,0 +1,124 @@ + + + + + + +/*********************************************************************************/ +/* Color Gamme */ +/*********************************************************************************/ + #color01 + { + background-color: #302E42; + } + + .color01 + { + background-color: #302E42; + } + + .color02 + { + background-color: #1f9fb1; + } + + .color03 + { + background-color: #e99612; + } + + .color04 + { + background-color: #bb0c31; + } + + .color05 + { + background-color: #85083b; + } + + .color06 + { + background-color: #250a34; + } + + .color07 + { + background-color: #AD0B4D; + } + + .color08 + { + background-color: #AD0B4D; + } + + .color09 + { + background-color: #18171E; + } + + .color10 + { + background-color: #ffffff; + } + + +/*********************************************************************************/ +/* Color Gamme */ +/*********************************************************************************/ + + .Tcolor01 + { + color: #302E42; + } + + .Tcolor02 + { + color: #70297F; + } + + .Tcolor03 + { + color: #CE6536; + } + + .Tcolor04 + { + color: #0D8899; + } + + .Tcolor10 + { + color: #ffffff; + } + +/*********************************************************************************/ +/* Color Gamme */ +/*********************************************************************************/ + + .Bcolor01 + { + + border-color: #302E42; + } + + .Bcolor02 + { + border-color: #70297F; + } + + .Bcolor03 + { + border-color: #CE6536; + } + + .Bcolor04 + { + border-color: #0D8899; + } + + .Bcolor10 + { + border-color: #ffffff; + } + diff --git a/css/icone.css b/css/icone.css new file mode 100644 index 0000000..084c608 --- /dev/null +++ b/css/icone.css @@ -0,0 +1,366 @@ +@charset 'UTF-8'; + +@font-face +{ + font-family: 'FontAwesome'; + src: url('../font/icone/fontawesome-webfont.eot?v=3.0.1'); + src: url('../font/icone/fontawesome-webfont.eot?#iefix&v=3.0.1') format('embedded-opentype'), + url('../font/icone/fontawesome-webfont.woff?v=3.0.1') format('woff'), + url('../font/icone/fontawesome-webfont.ttf?v=3.0.1') format('truetype'), + url('../font/icone/fontawesome-webfont.svg#FontAwesome') format('svg'); + font-weight: normal; + font-style: normal; +} + +@font-face +{ + font-family: 'Font-Awesome-Social'; + src: url('../font/icone/fontawesome-social-webfont.eot'); + src: url('../font/icone/fontawesome-social-webfont.eot?#iefix') format('embedded-opentype'), + url('../font/icone/fontawesome-social-webfont.woff') format('woff'), + url('../font/icone/fontawesome-social-webfont.ttf') format('truetype'), + url('../font/icone/fontawesome-social-webfont.svg#Font-Awesome-More') format('svg'); + font-weight: normal; + font-style: normal; +} + + .icon + { + text-decoration: none; + } + + .icon:before + { + font-size: 1.25em; + text-decoration: none; + font-family: FontAwesome; + font-weight: normal; + font-style: normal; + -webkit-text-rendering: optimizeLegibility; + -moz-text-rendering: optimizeLegibility; + -ms-text-rendering: optimizeLegibility; + -o-text-rendering: optimizeLegibility; + text-rendering: optimizeLegibility; + -webkit-font-smoothing: antialiased; + -moz-font-smoothing: antialiased; + -ms-font-smoothing: antialiased; + -o-font-smoothing: antialiased; + font-smoothing: antialiased; + -webkit-font-feature-settings: "liga" 1, "dlig" 1; + -moz-font-feature-settings: "liga=1, dlig=1"; + -ms-font-feature-settings: "liga" 1, "dlig" 1; + -o-font-feature-settings: "liga" 1, "dlig" 1; + font-feature-settings: "liga" 1, "dlig" 1; + } + + .icon-glass:before { content: "\f000"; } + .icon-music:before { content: "\f001"; } + .icon-search:before { content: "\f002"; } + .icon-envelope:before { content: "\f003"; } + .icon-heart:before { content: "\f004"; } + .icon-star:before { content: "\f005"; } + .icon-star-empty:before { content: "\f006"; } + .icon-user:before { content: "\f007"; } + .icon-film:before { content: "\f008"; } + .icon-th-large:before { content: "\f009"; } + .icon-th:before { content: "\f00a"; } + .icon-th-list:before { content: "\f00b"; } + .icon-ok:before { content: "\f00c"; } + .icon-remove:before { content: "\f00d"; } + .icon-zoom-in:before { content: "\f00e"; } + + .icon-zoom-out:before { content: "\f010"; } + .icon-off:before { content: "\f011"; } + .icon-signal:before { content: "\f012"; } + .icon-cog:before { content: "\f013"; } + .icon-trash:before { content: "\f014"; } + .icon-home:before { content: "\f015"; } + .icon-file:before { content: "\f016"; } + .icon-time:before { content: "\f017"; } + .icon-road:before { content: "\f018"; } + .icon-download-alt:before { content: "\f019"; } + .icon-download:before { content: "\f01a"; } + .icon-upload:before { content: "\f01b"; } + .icon-inbox:before { content: "\f01c"; } + .icon-play-circle:before { content: "\f01d"; } + .icon-repeat:before { content: "\f01e"; } + + /* \f020 doesn't work in Safari. all shifted one down */ + .icon-refresh:before { content: "\f021"; } + .icon-list-alt:before { content: "\f022"; } + .icon-lock:before { content: "\f023"; } + .icon-flag:before { content: "\f024"; } + .icon-headphones:before { content: "\f025"; } + .icon-volume-off:before { content: "\f026"; } + .icon-volume-down:before { content: "\f027"; } + .icon-volume-up:before { content: "\f028"; } + .icon-qrcode:before { content: "\f029"; } + .icon-barcode:before { content: "\f02a"; } + .icon-tag:before { content: "\f02b"; } + .icon-tags:before { content: "\f02c"; } + .icon-book:before { content: "\f02d"; } + .icon-bookmark:before { content: "\f02e"; } + .icon-print:before { content: "\f02f"; } + + .icon-camera:before { content: "\f030"; } + .icon-font:before { content: "\f031"; } + .icon-bold:before { content: "\f032"; } + .icon-italic:before { content: "\f033"; } + .icon-text-height:before { content: "\f034"; } + .icon-text-width:before { content: "\f035"; } + .icon-align-left:before { content: "\f036"; } + .icon-align-center:before { content: "\f037"; } + .icon-align-right:before { content: "\f038"; } + .icon-align-justify:before { content: "\f039"; } + .icon-list:before { content: "\f03a"; } + .icon-indent-left:before { content: "\f03b"; } + .icon-indent-right:before { content: "\f03c"; } + .icon-facetime-video:before { content: "\f03d"; } + .icon-picture:before { content: "\f03e"; } + + .icon-pencil:before { content: "\f040"; } + .icon-map-marker:before { content: "\f041"; } + .icon-adjust:before { content: "\f042"; } + .icon-tint:before { content: "\f043"; } + .icon-edit:before { content: "\f044"; padding-top: 1px; padding-left: 1px; } + .icon-share:before { content: "\f045"; } + .icon-check:before { content: "\f046"; } + .icon-move:before { content: "\f047"; } + .icon-step-backward:before { content: "\f048"; } + .icon-fast-backward:before { content: "\f049"; } + .icon-backward:before { content: "\f04a"; } + .icon-play:before { content: "\f04b"; } + .icon-pause:before { content: "\f04c"; } + .icon-stop:before { content: "\f04d"; } + .icon-forward:before { content: "\f04e"; } + + .icon-fast-forward:before { content: "\f050"; } + .icon-step-forward:before { content: "\f051"; } + .icon-eject:before { content: "\f052"; } + .icon-chevron-left:before { content: "\f053"; } + .icon-chevron-right:before { content: "\f054"; } + .icon-plus-sign:before { content: "\f055"; } + .icon-minus-sign:before { content: "\f056"; } + .icon-remove-sign:before { content: "\f057"; } + .icon-ok-sign:before { content: "\f058"; } + .icon-question-sign:before { content: "\f059"; } + .icon-info-sign:before { content: "\f05a"; } + .icon-screenshot:before { content: "\f05b"; } + .icon-remove-circle:before { content: "\f05c"; } + .icon-ok-circle:before { content: "\f05d"; } + .icon-ban-circle:before { content: "\f05e"; } + + .icon-arrow-left:before { content: "\f060"; } + .icon-arrow-right:before { content: "\f061"; } + .icon-arrow-up:before { content: "\f062"; } + .icon-arrow-down:before { content: "\f063"; } + .icon-share-alt:before { content: "\f064"; } + .icon-resize-full:before { content: "\f065"; } + .icon-resize-small:before { content: "\f066"; } + .icon-plus:before { content: "\f067"; } + .icon-minus:before { content: "\f068"; } + .icon-asterisk:before { content: "\f069"; } + .icon-exclamation-sign:before { content: "\f06a"; } + .icon-gift:before { content: "\f06b"; } + .icon-leaf:before { content: "\f06c"; } + .icon-fire:before { content: "\f06d"; } + .icon-eye-open:before { content: "\f06e"; } + + .icon-eye-close:before { content: "\f070"; } + .icon-warning-sign:before { content: "\f071"; } + .icon-plane:before { content: "\f072"; } + .icon-calendar:before { content: "\f073"; } + .icon-random:before { content: "\f074"; } + .icon-comment:before { content: "\f075"; } + .icon-magnet:before { content: "\f076"; } + .icon-chevron-up:before { content: "\f077"; } + .icon-chevron-down:before { content: "\f078"; } + .icon-retweet:before { content: "\f079"; } + .icon-shopping-cart:before { content: "\f07a"; } + .icon-folder-close:before { content: "\f07b"; } + .icon-folder-open:before { content: "\f07c"; } + .icon-resize-vertical:before { content: "\f07d"; } + .icon-resize-horizontal:before { content: "\f07e"; } + + .icon-bar-chart:before { content: "\f080"; } + .icon-twitter-sign:before { content: "\f081"; } + .icon-facebook-sign:before { content: "\f082"; } + .icon-camera-retro:before { content: "\f083"; } + .icon-key:before { content: "\f084"; } + .icon-cogs:before { content: "\f085"; } + .icon-comments:before { content: "\f086"; } + .icon-thumbs-up:before { content: "\f087"; } + .icon-thumbs-down:before { content: "\f088"; } + .icon-star-half:before { content: "\f089"; } + .icon-heart-empty:before { content: "\f08a"; } + .icon-signout:before { content: "\f08b"; } + .icon-linkedin-sign:before { content: "\f08c"; } + .icon-pushpin:before { content: "\f08d"; } + .icon-external-link:before { content: "\f08e"; } + + .icon-signin:before { content: "\f090"; } + .icon-trophy:before { content: "\f091"; } + .icon-github-sign:before { content: "\f092"; } + .icon-upload-alt:before { content: "\f093"; } + .icon-lemon:before { content: "\f094"; } + .icon-phone:before { content: "\f095"; } + .icon-check-empty:before { content: "\f096"; } + .icon-bookmark-empty:before { content: "\f097"; } + .icon-phone-sign:before { content: "\f098"; } + .icon-twitter:before { content: "\f099"; padding-left: 2px; } + .icon-facebook:before { content: "\f09a"; padding-left: 6px; } + .icon-github:before { content: "\f09b"; } + .icon-unlock:before { content: "\f09c"; } + .icon-credit-card:before { content: "\f09d"; } + .icon-rss:before { content: "\f09e"; } + + .icon-hdd:before { content: "\f0a0"; } + .icon-bullhorn:before { content: "\f0a1"; } + .icon-bell:before { content: "\f0a2"; } + .icon-certificate:before { content: "\f0a3"; } + .icon-hand-right:before { content: "\f0a4"; } + .icon-hand-left:before { content: "\f0a5"; } + .icon-hand-up:before { content: "\f0a6"; } + .icon-hand-down:before { content: "\f0a7"; } + .icon-circle-arrow-left:before { content: "\f0a8"; } + .icon-circle-arrow-right:before { content: "\f0a9"; } + .icon-circle-arrow-up:before { content: "\f0aa"; } + .icon-circle-arrow-down:before { content: "\f0ab"; } + .icon-globe:before { content: "\f0ac"; } + .icon-wrench:before { content: "\f0ad"; } + .icon-tasks:before { content: "\f0ae"; } + + .icon-filter:before { content: "\f0b0"; } + .icon-briefcase:before { content: "\f0b1"; } + .icon-fullscreen:before { content: "\f0b2"; } + + .icon-group:before { content: "\f0c0"; } + .icon-link:before { content: "\f0c1"; } + .icon-cloud:before { content: "\f0c2"; } + .icon-beaker:before { content: "\f0c3"; } + .icon-cut:before { content: "\f0c4"; } + .icon-copy:before { content: "\f0c5"; } + .icon-paper-clip:before { content: "\f0c6"; } + .icon-save:before { content: "\f0c7"; } + .icon-sign-blank:before { content: "\f0c8"; } + .icon-reorder:before { content: "\f0c9"; } + .icon-list-ul:before { content: "\f0ca"; } + .icon-list-ol:before { content: "\f0cb"; } + .icon-strikethrough:before { content: "\f0cc"; } + .icon-underline:before { content: "\f0cd"; } + .icon-table:before { content: "\f0ce"; } + + .icon-magic:before { content: "\f0d0"; } + .icon-truck:before { content: "\f0d1"; } + .icon-pinterest:before { content: "\f0d2"; } + .icon-pinterest-sign:before { content: "\f0d3"; } + .icon-google-plus-sign:before { content: "\f0d4"; } + .icon-google-plus:before { content: "\f0d5"; } + .icon-money:before { content: "\f0d6"; } + .icon-caret-down:before { content: "\f0d7"; } + .icon-caret-up:before { content: "\f0d8"; } + .icon-caret-left:before { content: "\f0d9"; } + .icon-caret-right:before { content: "\f0da"; } + .icon-columns:before { content: "\f0db"; } + .icon-sort:before { content: "\f0dc"; } + .icon-sort-down:before { content: "\f0dd"; } + .icon-sort-up:before { content: "\f0de"; } + + .icon-envelope-alt:before { content: "\f0e0"; } + .icon-linkedin:before { content: "\f0e1"; } + .icon-undo:before { content: "\f0e2"; } + .icon-legal:before { content: "\f0e3"; } + .icon-dashboard:before { content: "\f0e4"; } + .icon-comment-alt:before { content: "\f0e5"; } + .icon-comments-alt:before { content: "\f0e6"; } + .icon-bolt:before { content: "\f0e7"; } + .icon-sitemap:before { content: "\f0e8"; } + .icon-umbrella:before { content: "\f0e9"; } + .icon-paste:before { content: "\f0ea"; } + .icon-lightbulb:before { content: "\f0eb"; } + .icon-exchange:before { content: "\f0ec"; } + .icon-cloud-download:before { content: "\f0ed"; } + .icon-cloud-upload:before { content: "\f0ee"; } + + .icon-user-md:before { content: "\f0f0"; } + .icon-stethoscope:before { content: "\f0f1"; } + .icon-suitcase:before { content: "\f0f2"; } + .icon-bell-alt:before { content: "\f0f3"; } + .icon-coffee:before { content: "\f0f4"; } + .icon-food:before { content: "\f0f5"; } + .icon-file-alt:before { content: "\f0f6"; } + .icon-building:before { content: "\f0f7"; } + .icon-hospital:before { content: "\f0f8"; } + .icon-ambulance:before { content: "\f0f9"; } + .icon-medkit:before { content: "\f0fa"; } + .icon-fighter-jet:before { content: "\f0fb"; } + .icon-beer:before { content: "\f0fc"; } + .icon-h-sign:before { content: "\f0fd"; } + .icon-plus-sign-alt:before { content: "\f0fe"; } + + .icon-double-angle-left:before { content: "\f100"; } + .icon-double-angle-right:before { content: "\f101"; } + .icon-double-angle-up:before { content: "\f102"; } + .icon-double-angle-down:before { content: "\f103"; } + .icon-angle-left:before { content: "\f104"; } + .icon-angle-right:before { content: "\f105"; } + .icon-angle-up:before { content: "\f106"; } + .icon-angle-down:before { content: "\f107"; } + .icon-desktop:before { content: "\f108"; } + .icon-laptop:before { content: "\f109"; } + .icon-tablet:before { content: "\f10a"; } + .icon-mobile-phone:before { content: "\f10b"; } + .icon-circle-blank:before { content: "\f10c"; } + .icon-quote-left:before { content: "\f10d"; } + .icon-quote-right:before { content: "\f10e"; } + + .icon-spinner:before { content: "\f110"; } + .icon-circle:before { content: "\f111"; } + .icon-reply:before { content: "\f112"; } + .icon-github-alt:before { content: "\f113"; } + .icon-folder-close-alt:before { content: "\f114"; } + .icon-folder-open-alt:before { content: "\f115"; } + + .icon-blogger-sign:before,.icon-blogger:before,.icon-delicious:before,.icon-dribbble-sign:before,.icon-dribbble:before,.icon-dropbox:before,.icon-drupal:before,.icon-evernote-sign:before,.icon-evernote:before,.icon-flickr-sign:before,.icon-flickr:before,.icon-forrst-sign:before,.icon-forrst:before,.icon-foursquare-sign:before,.icon-foursquare:before,.icon-git-fork:before,.icon-hacker-news:before,.icon-instagram:before,.icon-lastfm-sign:before,.icon-lastfm:before,.icon-paypal:before,.icon-picasa-sign:before,.icon-picasa:before,.icon-reddit:before,.icon-share-this-sign:before,.icon-share-this:before,.icon-skype:before,.icon-soundcloud:before,.icon-spotify:before,.icon-stack-overflow:before,.icon-tumblr-sign:before,.icon-tumblr:before,.icon-vimeo-sign:before,.icon-vimeo:before,.icon-wordpress-sign:before,.icon-wordpress:before,.icon-yelp-sign:before,.icon-yelp:before,.icon-youtube-sign:before,.icon-youtube:before {font-family:'Font-Awesome-Social'; } + + .icon-dropbox:before { content: "\f300"; } + .icon-drupal:before { content: "\f301"; } + .icon-git-fork:before { content: "\f302"; } + .icon-instagram:before { content: "\f303"; } + .icon-share-this-sign:before { content: "\f304"; } + .icon-share-this:before { content: "\f305"; } + .icon-foursquare-sign:before { content: "\f306"; } + .icon-foursquare:before { content: "\f307"; } + .icon-hacker-news:before { content: "\f308"; } + .icon-skype:before { content: "\f309"; } + .icon-spotify:before { content: "\f30a"; } + .icon-soundcloud:before { content: "\f30b"; } + .icon-paypal:before { content: "\f30c"; } + .icon-youtube-sign:before { content: "\f30d"; } + .icon-youtube:before { content: "\f30e"; } + .icon-reddit:before { content: "\f30f"; } + .icon-blogger-sign:before { content: "\f310"; } + .icon-blogger:before { content: "\f311"; } + .icon-dribbble-sign:before { content: "\f312"; } + .icon-dribbble:before { content: "\f313"; } + .icon-evernote-sign:before { content: "\f314"; } + .icon-evernote:before { content: "\f315"; } + .icon-flickr-sign:before { content: "\f316"; } + .icon-flickr:before { content: "\f317"; } + .icon-forrst-sign:before { content: "\f318"; } + .icon-forrst:before { content: "\f319"; } + .icon-delicious:before { content: "\f31a"; } + .icon-lastfm-sign:before { content: "\f31b"; } + .icon-lastfm:before { content: "\f31c"; } + .icon-picasa-sign:before { content: "\f31d"; } + .icon-picasa:before { content: "\f31e"; } + .icon-stack-overflow:before { content: "\f320"; } + .icon-tumblr-sign:before { content: "\f321"; } + .icon-tumblr:before { content: "\f322"; } + .icon-vimeo-sign:before { content: "\f323"; } + .icon-vimeo:before { content: "\f324"; } + .icon-wordpress-sign:before { content: "\f325"; } + .icon-wordpress:before { content: "\f326"; } + .icon-yelp-sign:before { content: "\f327"; } + .icon-yelp:before { content: "\f328"; } + diff --git a/css/ie8.css b/css/ie8.css new file mode 100644 index 0000000..5666221 --- /dev/null +++ b/css/ie8.css @@ -0,0 +1,28 @@ +/* + Escape Velocity 2.0 by HTML5 UP + html5up.net | @n33co + Free for personal and commercial use under the CCA 3.0 license (html5up.net/license) +*/ + +/*********************************************************************************/ +/* Wrappers */ +/*********************************************************************************/ + + .wrapper + { + } + + .wrapper .title:before, + .wrapper .title:after + { + display: none; + } + +/*********************************************************************************/ +/* Copyright */ +/*********************************************************************************/ + + #copyright + { + margin: 0em 0 0 0; + } diff --git a/css/images/mobileUI-site-nav-opener-bg.svg b/css/images/mobileUI-site-nav-opener-bg.svg new file mode 100644 index 0000000..9d9a799 --- /dev/null +++ b/css/images/mobileUI-site-nav-opener-bg.svg @@ -0,0 +1,5 @@ + + + + + \ No newline at end of file diff --git a/css/images/overlay.png b/css/images/overlay.png new file mode 100644 index 0000000..1c3728b Binary files /dev/null and b/css/images/overlay.png differ diff --git a/css/images/shadow.png b/css/images/shadow.png new file mode 100644 index 0000000..a8b1165 Binary files /dev/null and b/css/images/shadow.png differ diff --git a/css/skel-noscript.css b/css/skel-noscript.css new file mode 100644 index 0000000..77252eb --- /dev/null +++ b/css/skel-noscript.css @@ -0,0 +1 @@ +html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;font-size:100%;font:inherit;vertical-align:baseline}article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}body{line-height:1}ol,ul{list-style:none}blockquote,q{quotes:none}blockquote:before,blockquote:after,q:before,q:after{content:'';content:none}table{border-collapse:collapse;border-spacing:0}body{-webkit-text-size-adjust:none}*,*:before,*:after{-moz-box-sizing:border-box;-webkit-box-sizing:border-box;-o-box-sizing:border-box;-ms-box-sizing:border-box;box-sizing:border-box}.container{width:1200px;margin:0 auto}.\31 2u{width:100%}.\31 1u{width:91.6666666667%}.\31 0u{width:83.3333333333%}.\39 u{width:75%}.\38 u{width:66.6666666667%}.\37 u{width:58.3333333333%}.\36 u{width:50%}.\35 u{width:41.6666666667%}.\34 u{width:33.3333333333%}.\33 u{width:25%}.\32 u{width:16.6666666667%}.\31 u{width:8.3333333333%}.\-11u{margin-left:91.6666666667%}.\-10u{margin-left:83.3333333333%}.\-9u{margin-left:75%}.\-8u{margin-left:66.6666666667%}.\-7u{margin-left:58.3333333333%}.\-6u{margin-left:50%}.\-5u{margin-left:41.6666666667%}.\-4u{margin-left:33.3333333333%}.\-3u{margin-left:25%}.\-2u{margin-left:16.6666666667%}.\-1u{margin-left:8.3333333333%}.row>*{padding:40px 0 0 40px;float:left;-moz-box-sizing:border-box;-webkit-box-sizing:border-box;-o-box-sizing:border-box;-ms-box-sizing:border-box;box-sizing:border-box}.row+.row>*{padding-top:40px}.row{margin-left:-40px}.row:after{content:'';display:block;clear:both;height:0}.row:first-child>*{padding-top:0}.row>*{padding-top:0}.row.flush{margin-left:0}.row.flush>*{padding:0 !important}.row.half>*{padding:20px 0 0 20px}.row.half+.row.half>*{padding-top:20px}.row.half{margin-left:-20px}.row.double>*{padding:80px 0 0 80px}.row.double+.row.double>*{padding-top:80px}.row.double{margin-left:-80px} \ No newline at end of file diff --git a/css/style-1000px.css b/css/style-1000px.css new file mode 100644 index 0000000..10bcd73 --- /dev/null +++ b/css/style-1000px.css @@ -0,0 +1,327 @@ +/* + Escape Velocity 2.0 by HTML5 UP + html5up.net | @n33co + Free for personal and commercial use under the CCA 3.0 license (html5up.net/license) +*/ + +/*********************************************************************************/ +/* Basic */ +/*********************************************************************************/ + + body, input, select, textarea + { + font-size: 12pt; + line-height: 1.5em; + letter-spacing: 0.015em; + } + + body + { + min-width: 960px; + } + +/*********************************************************************************/ +/* Wrappers */ +/*********************************************************************************/ + + .wrapper + { + padding: 4em 0 3em 0; + } + + #header-wrapper + { + height: 595px !important; + } + + .homepage #header-wrapper + { + height: 595px; + } + + #intro-wrapper + { + padding-bottom: 7em; + } + + #footer-wrapper + { + } + + #footer-wrapper hr + { + margin: 3em 0 3em 0; + } + +/*********************************************************************************/ +/* Header */ +/*********************************************************************************/ + + #header + { + height: 623px !important; + } + + .homepage #header + { + height: 623px; + } + +/*********************************************************************************/ +/* Logo */ +/*********************************************************************************/ + + #logo + { + margin-top: 0.5em !important; + height: 72px; + width: 220px; + margin-left:-84px; + margin-right:20px; + padding: 2.5px 0px 0px 0px; + } + + #logo img + { + height: 64px; + width: 220px; + + } + + + #logo h1 + { + + } + +/*********************************************************************************/ +/* Nav */ +/*********************************************************************************/ + #nav-back + { + z-index: 1000; + position:fixed; + top: 0px; + left: 0px; + right:0px; + width: 100%; + height:55px; + background-color: #18171E; + } + #nav + { + z-index: 1100; + position:fixed; + top: 0px; + left:0px; + width: 100%; + height:55px; + text-align: center; + vertical-align:top; + + } + + #nav > ul > li > ul + { + display: none; + + } + + #nav > ul + { + display: inline-block; + /*border-radius: 0.35em; + box-shadow: inset 0px 0px 1px 1px rgba(255,255,255,0.25);*/ + padding: 0em 0em 0em 0em; + } + + #nav > ul > li + { + display: inline-block; + text-align: center; + padding: 0em 0.05em 0em 0.05em; + } + + + #nav > ul > li > span + { + font-family: 'open_sansbold', sans-serif; + display: block; + color: #eee; + color: rgba(255,255,255,0.75); + text-transform: uppercase; + text-decoration: none; + font-size: 0.75em; + letter-spacing: 0em; + height: 5em; + line-height: 5em; + -moz-transition: all .25s ease-in-out; + -webkit-transition: all .25s ease-in-out; + -o-transition: all .25s ease-in-out; + -ms-transition: all .25s ease-in-out; + transition: all .25s ease-in-out; + outline: 0; + } + + #nav > ul > li > a + { + font-family: 'open_sansbold', sans-serif; + display: block; + color: #eee; + color: rgba(255,255,255,0.75); + text-transform: uppercase; + text-decoration: none; + font-size: 0.75em; + letter-spacing: 0em; + height: 5em; + line-height: 5em; + -moz-transition: all .25s ease-in-out; + -webkit-transition: all .25s ease-in-out; + -o-transition: all .25s ease-in-out; + -ms-transition: all .25s ease-in-out; + transition: all .25s ease-in-out; + outline: 0; + top:0; + } + + #nav > ul > li:hover > a, + #nav > ul > li.active > a, + #nav > ul > li:hover >span, + { + color: #fff; + } + + .dropotron + { + margin-left:-0.5em; + background: #222835 url('images/overlay.png'); + background-color: rgba(24,23,30,0.925); + padding: 0.5em 0.5em 0.5em 0.5em; + border-radius: 0.35em; + box-shadow: inset 0px 0px 1px 1px rgba(255,255,255,0.25); + min-width: 10em; + text-align: left; + + + } + + .dropotron-level-0 + { + + margin-top:-6px; + border-top-left-radius: 0; + border-top-right-radius: 0; + + } + .dropotron span + { + font-family: 'open_sansbold', sans-serif; + display: block; + color: #eee; + color: rgba(255,255,255,0.75); + text-transform: uppercase; + text-decoration: none; + font-size: 0.75em; + letter-spacing: 0em; + border-top: solid 1px rgba(255,255,255,0.15); + line-height: 2em; + -moz-transition: all .25s ease-in-out; + -webkit-transition: all .25s ease-in-out; + -o-transition: all .25s ease-in-out; + -ms-transition: all .25s ease-in-out; + transition: all .25s ease-in-out; + } + + .dropotron a + { + font-family: 'open_sansregular', sans-serif; + display: block; + color: #eee; + color: rgba(255,255,255,0.75); + text-transform: uppercase; + text-decoration: none; + font-size: 0.7em; + letter-spacing: 0.1em; + border-top: solid 1px rgba(255,255,255,0.15); + line-height: 3em; + -moz-transition: all .25s ease-in-out; + -webkit-transition: all .25s ease-in-out; + -o-transition: all .25s ease-in-out; + -ms-transition: all .25s ease-in-out; + transition: all .25s ease-in-out; + } + + .dropotron li:first-child a, + .dropotron li:first-child span + { + border-top: 0; + } + + .dropotron li:hover > a, + .dropotron li:hover > span + { + color: #fff; + } + +/*********************************************************************************/ +/* video home */ +/*********************************************************************************/ + + .wrapper-video + { + position: relative; + padding: 0em 0 0em 0; + } + + #video-home + { + margin-top:55px; + width:960px; + height:540px; + position: relative; + margin-left: auto; + margin-right: auto + } + #video-home iframe + { + width:960px; + height:540px; + } + + #main-features + { + padding: 0 3em 0 3em; + } + + #main iframe + { + width:900px; + height:523px; + } + +/*********************************************************************************/ +/* Intro */ +/*********************************************************************************/ + + #intro + { + } + + #intro .style1 + { + font-size: 1em; + } + + #intro .style2 + { + font-size: 1.5em; + } + +/*********************************************************************************/ +/* Copyright */ +/*********************************************************************************/ + + #copyright + { + margin: 3em 0 0 0; + } \ No newline at end of file diff --git a/css/style-desktop.css b/css/style-desktop.css new file mode 100644 index 0000000..f2f1df5 --- /dev/null +++ b/css/style-desktop.css @@ -0,0 +1,1020 @@ + +@import "gamme.css"; +/*_____________________________________________________________________*/ +/* Commun */ +/*_____________________________________________________________________*/ + + video + { + max-width: 100%; + height: auto; + } + + + + body, input, select, textarea + { + font-size: 13pt; + line-height: 1.75em; + letter-spacing: 0.025em; + } + + body + { + min-width: 1200px; + } + + hr + { + margin: 2em 0 2em 0; + } + + section, + article + { + margin: 0 0 4em 0; + } + + header.style1 + { + padding: 1em 0 0em 0; + } + + header.style1 h2 + { + text-transform: uppercase; + font-size: 1.5em; + letter-spacing: 0.075em; + line-height: 1.5em; + } + + header.style2 h2 + { + + text-transform: uppercase; + font-size: 1.5em; + letter-spacing: 0.075em; + line-height: 1.5em; + } + + header.style3 h2 + { + font-family: 'webfontbold'; + text-transform: uppercase; + font-size: 1.5em; + letter-spacing: 0.075em; + line-height: 1.5em; + padding: 0em 0em 1em 0em; + } + + header.style1 .byline + { + display: block; + margin: 1.15em 0 0 0; + font-size: 1.3em; + letter-spacing: 0.075em; + line-height: 1.5em; + } + + form + { + } + + form label + { + margin: 0.25em 0 0.25em 0; + } + + .button + { + padding: 0 1.25em 0 1.25em; + font-size: 0.9em; + min-width: 10em; + height: 2em; + line-height: 2em; + } + + .button-big + { + font-size: 1em; + min-width: 14em; + } + + .actions + { + margin: 2em 0 0 0; + } + + form .actions + { + margin-top: 1em; + } + + .actions li + { + display: inline-block; + margin: 0 0.75em 0 0.75em; + } + + .actions li:first-child + { + margin-left: 0; + } + + .actions li:last-child + { + margin-right: 0; + } + + .actions-centered + { + text-align: center; + } + + .feature-list + { + } + + .feature-list section + { + padding: 2em 0 2em 0; + } + + .feature-list .row + { + border-top: solid 1px #eee; + } + + .feature-list .row:first-child + { + border-top: 0; + } + + .feature-list .row:first-child section + { + padding-top:0; + } + + .feature-list .row:last-child + { + } + + .feature-list .row:last-child section + { + padding-bottom: 0; + } + + .feature-list h3 + { + margin: 0 0 0.75em 0; + font-size: 1.15em; + letter-spacing: 0.05em; + margin-top: -0.35em; + } + + .feature-list h3:before + { + width: 64px; + height: 64px; + line-height: 64px; + margin-right: 0.75em; + font-size: 32px; + top: 0.2em; + } + + .feature-list p + { + margin: 0 0 0 5em; + } + + .feature-list-small + { + } + + .feature-list-small h3 + { + } + + .feature-list-small h3:before + { + font-size: 24px; + line-height: 45px; + width: 45px; + height: 45px; + margin-right: 1em; + } + + .feature-list-small p + { + margin: 0 0 0 4em; + } + + .is + { + } + + .is header + { + margin: 0 0 1.5em 0; + } + + .is header.style1 + { + position: relative; + margin: -0.5em 0 0 0; + padding-top: 0; + } + + .is h2 + { + margin: 0 0 0.75em 0; + font-size: 1.15em; + letter-spacing: 0.05em; + } + + .is h3 + { + margin: 0 0 0.5em 0; + font-size: 1em; + font-weight: normal; + letter-spacing: 0.05em; + } + + .is-pair-one + { + padding-right: 1.5em; + } + + .is-pair-two + { + padding-left: 1.5em; + } + + .is-triple-one + { + padding-right: 1.5em; + } + + .is-triple-two + { + padding-left: 0.75em; + padding-right: 0.75em; + } + + .is-triple-three + { + padding-left: 1.5em; + } + + .is-post-excerpt + { + } + + .is-post-excerpt .image-left + { + position: relative; + top: 0.5em; + width: 5em; + } + + .is-post-excerpt h3, + .is-post-excerpt p + { + margin-left: 7em; + } + +/*********************************************************************************/ +/* Wrappers */ +/*********************************************************************************/ + + .wrapper + { + padding: 6em 0 3em 0; + + } + + .wrapper .title + { + font-family: 'webfontbold'; + font-size: 1.3em; + width: 18em; + height: 4em; + top: -2em; + line-height: 2em; + margin-bottom: -2em; + margin-left: -9em; + padding-top: 0.8em; + border-style:solid; + border-width:4px; + border-radius: 0.5em 0.5em 0.5em 0.5em; + + } + + .wrapper-style2 .title + { + margin-top:0em; + } + + + + #header-wrapper + { + top:0px; + padding:0; + + } + + .homepage #header-wrapper + { + height: 736px; + } + + #intro-wrapper + { + + padding-bottom: 3em; + } + +/*********************************************************************************/ +/* Header */ +/*********************************************************************************/ + + #header + { + + height: 676px; + } + + .homepage #header + { + height: 676px; + } + +/*********************************************************************************/ +/* Logo */ +/*********************************************************************************/ + + #logo + { + float:left; + height: 85px; + width: 295px; + margin-left:-152px; + margin-right:25px; + padding: 2.5px 0px 0px 0px; + } + + #logo img + { + height: 85px; + width: 295px; + + } + + + + #logo h1 + { + + } + + #logo .byline + { + } + +/*********************************************************************************/ +/* Nav */ +/*********************************************************************************/ + #nav-back + { + + position:fixed; + top: 0px; + left: 0px; + right:0px; + width: 100%; + height:60px; + } + #nav + { + + position:fixed; + top: 0px; + left:0px; + width: 100%; + height:60px; + text-align: center; + vertical-align:top; + + } + + #nav > ul > li > ul + { + display: none; + + } + + #nav > ul + { + display: inline-block; + /*border-radius: 0.35em; + box-shadow: inset 0px 0px 1px 1px rgba(255,255,255,0.25);*/ + padding: 0em 0em 0em 0em; + } + + #nav > ul > li + { + display: inline-block; + text-align: center; + padding: 0em 0.10em 0em 0.10em; + } + + + #nav > ul > li > span + { + font-family: 'webfontbold', sans-serif; + display: block; + color: #eee; + color: rgba(255,255,255,0.75); + text-transform: uppercase; + text-decoration: none; + font-size: 0.75em; + letter-spacing: 0em; + height: 5em; + line-height: 5em; + -moz-transition: all .25s ease-in-out; + -webkit-transition: all .25s ease-in-out; + -o-transition: all .25s ease-in-out; + -ms-transition: all .25s ease-in-out; + transition: all .25s ease-in-out; + outline: 0; + } + + #nav > ul > li > a + { + font-family: 'webfontbold', sans-serif; + display: block; + color: #eee; + color: rgba(255,255,255,0.75); + text-transform: uppercase; + text-decoration: none; + font-size: 0.75em; + letter-spacing: 0em; + height: 5em; + line-height: 5em; + -moz-transition: all .25s ease-in-out; + -webkit-transition: all .25s ease-in-out; + -o-transition: all .25s ease-in-out; + -ms-transition: all .25s ease-in-out; + transition: all .25s ease-in-out; + outline: 0; + top:0; + } + + #nav > ul > li:hover > a, + #nav > ul > li.active > a, + #nav > ul > li:hover >span, + { + color: #fff; + } + + .dropotron + { + margin-left:-0.5em; + background: #222835 url('images/overlay.png'); + background-color: rgba(24,23,30,0.925); + padding: 0.5em 0.5em 0.5em 0.5em; + border-radius: 0.35em; + box-shadow: inset 0px 0px 1px 1px rgba(255,255,255,0.25); + min-width: 10em; + text-align: left; + + } + + .dropotron-level-0 + { + + margin-top:-5px; + border-top-left-radius: 0; + border-top-right-radius: 0; + } + .dropotron span + { + font-family: 'webfontbold', sans-serif; + display: block; + color: #eee; + color: rgba(255,255,255,0.75); + text-transform: uppercase; + text-decoration: none; + font-size: 0.75em; + letter-spacing: 0.1em; + border-top: solid 1px rgba(255,255,255,0.15); + line-height: 3em; + -moz-transition: all .25s ease-in-out; + -webkit-transition: all .25s ease-in-out; + -o-transition: all .25s ease-in-out; + -ms-transition: all .25s ease-in-out; + transition: all .25s ease-in-out; + } + + .dropotron a + { + font-family: 'open_sansregular', sans-serif; + display: block; + color: #eee; + color: rgba(255,255,255,0.75); + text-transform: uppercase; + text-decoration: none; + font-size: 0.7em; + letter-spacing: 0.1em; + border-top: solid 1px rgba(255,255,255,0.15); + line-height: 3em; + -moz-transition: all .25s ease-in-out; + -webkit-transition: all .25s ease-in-out; + -o-transition: all .25s ease-in-out; + -ms-transition: all .25s ease-in-out; + transition: all .25s ease-in-out; + } + + .dropotron li:first-child a, + .dropotron li:first-child span + { + border-top: 0; + } + + .dropotron li:hover > a, + .dropotron li:hover > span + { + color: #fff; + } + +/*********************************************************************************/ +/* video home */ +/*********************************************************************************/ + .wrapper-video + { + position: relative; + padding: 0em 0 0em 0; + } + #video-home + { + margin-top:60px; + width:1200px; + height:676px; + position: relative; + margin-left: auto; + margin-right: auto + } + #video-home iframe + { + width:1200px; + height:676px; + } +/*********************************************************************************/ +/* Intro */ +/*********************************************************************************/ + + #intro + { + text-align: center; + } + + #intro .style1 + { + font-size: 1em; + letter-spacing: 0.075em; + } + + #intro .style2 + { + font-size: 2.75em; + letter-spacing: 0.075em; + line-height: 1.35em; + padding: 1em 0 1em 0; + margin-bottom: 1em; + } + + #intro .style3 + { + font-size: 1.1em; + width: 48em; + margin: 0 auto; + } + +/*********************************************************************************/ +/*main- Features */ +/*********************************************************************************/ + + #main-features + { + padding: 0 6em 0 6em; + } + + #main-features header.style1 + { + font-family: 'webfontbold', sans-serif; + padding-bottom: 2.5em; + padding-top: 0em; + } + + #main-features .actions + { + margin-top: 3em; + } + + #main-features .image + { + margin:auto; + display:block; + } + +/*********************************************************************************/ +/* Features */ +/*********************************************************************************/ + + #features + { + padding: 0 6em 0 6em; + } + + #features header.style1 + { + font-family: 'webfontbold', sans-serif; + padding-bottom: 2.5em; + padding-top: 0em; + } + + #features .actions + { + margin-top: 3em; + } + + #features .image + { + margin-left:0px; + } + #features section + { + margin:0px; + } +/*********************************************************************************/ +/* logiciels */ +/*********************************************************************************/ + + #logiciels + { + } + + + #logiciels .logiciels + { + } + + #logiciels .row + { + padding:0px 0px 0px 0px; + } + + #logiciels .logiciels h3 + { + margin: 0 0 0.75em 0; + font-size: 1.15em; + letter-spacing: 0.05em; + } + + #logiciels .logiciels-one + { + padding: 0em 1.1em 0em 1.1em; + } + + #logiciels .logiciels-two + { + padding: 0em 1.1em 0em 1.1em; + } + + #logiciels .logiciels-three + { + padding: 0em 1.1em 0em 1.1em; + } + + #logiciels .logiciels-four + { + padding: 0em 1.1em 0em 1.1em; + } + + +/*********************************************************************************/ +/* solutions */ +/*********************************************************************************/ + + #solutions + { + } + + + #solutions .solutions + { + } + #solutions .row + { + padding:0px 0px 0px 0px; + } + + #solutions .title + { + margin-top:0em; + } + + #solutions .solutions h3 + { + margin: 0 0 0.75em 0; + font-size: 1.15em; + letter-spacing: 0.02em; + } + + #solutions .solutions h3 a + { + font-family: 'webfontbold', sans-serif; + text-transform: uppercase; + } + + #solutions .solutions-one + { + padding: 0em 1.1em 0em 1.1em; + } + + #solutions .solutions-two + { + padding: 0em 1.1em 0em 1.1em; + } + + #solutions .solutions-three + { + padding: 0em 1.1em 0em 1.1em; + } + + #solutions .solutions-four + { + + padding: 0em 1.1em 0em 1.1em; + } + +/*********************************************************************************/ +/* prestations */ +/*********************************************************************************/ + + #prestations + { + } + + + #prestations .prestations + { + + } + + #prestations .title + { + margin-top:0em; + } + #prestations .prestations li + { + text-align:center; + + } + #prestations .prestations .button + { + display: inline-block; + font-size: 0.7em; + padding:0px 0px 0px 0px; + line-height:1em; + height:1em; + } + + #prestations .prestations hr + { + margin:0.2em 0 0.1em 0; + border-top: dotted 1px #ffffff; + } + + + #prestations .row + { + padding:0px 20px 0px 20px; + } + + #prestations .prestations h3 + { + + margin: 0 0 0 0; + font-size: 1.15em; + letter-spacing: 0.02em; + padding-top:1em; + + } + + #prestations .prestations h3 a + { + font-family: 'source_sans_problack', sans-serif; + font-size:0.9em; + text-transform: uppercase; + color:#ffffff; + } + + #prestations .prestations p + { + + color:#ffffff; + } + + + + #prestations .prestations-one + { + padding: 0em 1em 0em 1em; + } + + #prestations .prestations-two + { + padding: 0em 1em 0em 1em; + } + + #prestations .prestations-three + { + padding: 0em 1em 0em 1em; + } + + #prestations .prestations-four + { + + padding: 0em 1em 0em 1em; + } + + #prestations .prestations-five + { + + padding: 0em 1em 0em 1em; + } + + #prestations .prestations-six + { + + padding: 0em 1em 0em 1em; + } + +/*********************************************************************************/ +/* Main */ +/*********************************************************************************/ + + #main + { + margin: 1em 0 1em 0; + } + + .homepage #main + { + margin: 0; + } + + #main .title + { + margin-top:1em; + } + + #main iframe + { + width:1032px; + height:600px; + } + +/*********************************************************************************/ +/* Content */ +/*********************************************************************************/ + + #content + { + } + +/*********************************************************************************/ +/* Sidebar */ +/*********************************************************************************/ + + #sidebar + { + } + + .left-sidebar #sidebar + { + padding-right: 3em; + } + + .right-sidebar #sidebar + { + padding-left: 3em; + } + +/*********************************************************************************/ +/* Footer */ +/*********************************************************************************/ + + + + + #footer + { + } + + #footer header.style1 + { + padding-bottom: 0em; + } + + #footer hr + { + margin: 6em 0 6em 0; + } + + #footer .footer-one + { + padding-right: 1.5em; + padding-left: 1.2em; + } + + #footer .footer-two + { + padding-left: 1.5em; + } + +/*********************************************************************************/ +/* Copyright */ +/*********************************************************************************/ + + #copyright + { + margin: 6em 0 0 0; + } + + #copyright span + { + padding: 1.5em 4em 1.5em 4em; + line-height: 1em; + font-size: 0.8em; + } + + +/*_____________________________________________________________________*/ +/* Deplacement scroll to */ +/*_____________________________________________________________________*/ + + +#h-workflow + { + width: 100%; + height: 6em; + margin-top:0em; + margin-bottom:0em; + } + + + +#h-logiciels + { + width: 100%; + height: 6em; + padding-bottom: -4em; + + } + +#h-solutions + { + width: 100%; + height: 6em; + padding-bottom: -4em; + + } + +#h-prestations + { + width: 100%; + height: 6em; + padding-bottom: -4em; + + + } + +#h-references + { + width: 100%; + height: 6em; + padding-bottom: -4em; + + } + +#h-contacts + { + width: 100%; + height: 6em; + padding-bottom: -4em; + + } + diff --git a/css/style-mobile.css b/css/style-mobile.css new file mode 100644 index 0000000..689ac52 --- /dev/null +++ b/css/style-mobile.css @@ -0,0 +1,574 @@ +@import "gamme.css"; +/*_____________________________________________________________________*/ +/* Commun */ +/*_____________________________________________________________________*/ + + body, input, select, textarea + { + line-height: 1.5em; + font-size: 10.5pt; + letter-spacing: 0; + } + + h2, h3, h4, h5, h6 + { + font-size: 1.2em; + letter-spacing: 0.05em; + margin: 0 0 1em 0; + } + + + + + #prestations + section, + article + { + clear: both; + padding: 1em 2em 1em 2em ; + } + + #solutions + section, + article + { + clear: both; + padding: 1em 2em 1em 2em ; + } + + #highlights + section, + article + { + clear: both; + padding: 1em 2em 1em 2em ; + } + + #footer + section, + article + { + clear: both; + padding: 1em 2em 1em 2em ; + } + + + + header.style1 + { + padding: 0 0 1em 0; + } + + header.style1 h2 + { + font-size: 1.5em; + letter-spacing: 0.075em; + line-height: 1.25em; + } + + header.style1 .byline + { + display: block; + margin: 0; + } + + hr + { + margin: 1em 0 1em 0; + } + + form + { + } + + form input.text, + form select, + form textarea + { + } + + .image-featured + { + position: relative; + overflow: hidden; + + /* Adjust this to change the minimum height of the image */ + min-height: 10em; + } + + .image-featured img + { + position: absolute; + top: 0; + height: 100%; + width: auto; + + /* Adjust this to change the horizontal placement of the image */ + left: -50%; + } + + .image-centered img + { + width: 70%; + } + + .button + { + display: block; + width: 80%; + font-size: 1.1em; + padding: 0.3em 0 0.3em 0; + max-width: 15em; + margin: 0 auto; + } + + .actions + { + margin: 2em 0 0 0; + } + + form .actions + { + margin: 1em 0 0 0; + } + + .actions li + { + margin: 15px 0 0 0; + } + + .feature-list + { + } + + .feature-list section + { + border-top: solid 1px #eee; + } + + /* Ugh ... disgusting. */ + .feature-list > div > div:first-child > div:first-child > section + { + border-top: 0; + padding-top: 0; + } + + .feature-list h3 + { + position: relative; + padding: 4px 0 0 48px; + line-height: 1.25em; + } + + .feature-list h3:before + { + position: absolute; + left: 0; + top: 0; + width: 32px; + height: 32px; + line-height: 32px; + font-size: 16px; + } + + .feature-list p + { + margin: 0 0 0 48px; + } + + .is-post-excerpt + { + } + + .is-post-excerpt .image-left + { + position: relative; + top: 0.25em; + width: 25%; + margin: 0; + } + + .is-post-excerpt h3, + .is-post-excerpt p + { + margin-left: 32.5%; + } + + .mobile-hide + { + display: none; + } + +/*********************************************************************************/ +/* Mobile UI */ +/*********************************************************************************/ + + #titleBar + { + background: #123 url('../img/logo-telecasting-site.svg') no-repeat; + background-size: contain; + background-position:center top; + + + } + + #titleBar .title + { + display: none; + } + + #titleBar .toggle + { + position: absolute; + top: 0; + left: 0; + text-indent: -9999px; + width: 60px; + height: 44px; + } + + #titleBar .toggle:before + { + content: ''; + position: absolute; + top: 3px; + left: 6px; + display: block; + width: 54px; + height: 38px; + background-color: rgba(92,95,103,0.5); + border-radius: 0.25em; + -moz-transition: all .15s ease-in-out; + -webkit-transition: all .15s ease-in-out; + -o-transition: all .15s ease-in-out; + -ms-transition: all .15s ease-in-out; + transition: all .15s ease-in-out; + } + + #titleBar .toggle:after + { + content: ''; + display: block; + width: 44px; + height: 38px; + position: absolute; + left: 15px; + top: 4px; + background: url('images/mobileUI-site-nav-opener-bg.svg') 8px 14px no-repeat; + opacity: 0.5; + } + + #titleBar .toggle:active:before + { + background-color: rgba(92,95,103,0.75); + } + + #navPanel + { + background: #242730 url('../img/logo-telecasting-site.svg') no-repeat; + background-size: 45%; + background-position:left top; + box-shadow: inset -3px 0px 4px 0px rgba(0,0,0,0.1); + + } + + #navPanel .actions + { + display: block; + color: rgba(255,255,255,0.5); + text-transform: uppercase; + text-decoration: none; + font-size: 0.85em; + letter-spacing: 0.15em; + text-decoration: none; + height: 44px; + line-height: 44px; + border-top: solid 1px rgba(255,255,255,0.05); + margin: 0 15px 0 15px; + } + + #navPanel .link + { + display: block; + color: rgba(255,255,255,0.5); + text-transform: uppercase; + text-decoration: none; + font-size: 0.85em; + letter-spacing: 0.15em; + text-decoration: none; + height: 44px; + line-height: 44px; + border-top: solid 1px rgba(255,255,255,0.05); + margin: 0 15px 0 15px; + } + + #navPanel .link:first-child + { + border-top: 0; + } + + #navPanel .indent-1 { display: inline-block; width: 1em; } + #navPanel .indent-2 { display: inline-block; width: 2em; } + #navPanel .indent-3 { display: inline-block; width: 3em; } + #navPanel .indent-4 { display: inline-block; width: 4em; } + #navPanel .indent-5 { display: inline-block; width: 5em; } + #navPanel .depth-0 { color: #fff; } + +/*********************************************************************************/ +/* Wrappers */ +/*********************************************************************************/ + + .wrapper + { + padding: 15px 15px 5em 15px; + } + + .wrapper .title + { + font-size: 1.2em; + letter-spacing: 0.15em; + width: 16em; + height: 3.5em; + top: -1.8em; + line-height: 2em; + margin-bottom: -2em; + margin-left: -8em; + padding-top: 0.5em; + border-width:2px; + } + + .wrapper .title:before, + .wrapper .title:after + { + height: 15px; + bottom: -15px; + background-size: 100% 100%; + } + + #header-wrapper + { + padding: 0em 0em 0em 0em; + height: 225px; + } + + #footer-wrapper + { + padding-top: 3em; + } + + #footer-wrapper .feature-list section + { + border-top-color: #eee; + border-top-color: rgba(255,255,255,0.05); + } + +/*********************************************************************************/ +/* Header */ +/*********************************************************************************/ + + #header + { + height: 180px; + } + +/*********************************************************************************/ +/* Logo */ +/*********************************************************************************/ + + #logo + { + } + + #logo h1 + { + + } + + #logo .byline + { + } + +/*********************************************************************************/ +/* Nav */ +/*********************************************************************************/ + + #nav + { + display: none; + } + + +/*********************************************************************************/ +/* video home */ +/*********************************************************************************/ + +.wrapper-video + { + position: relative; + padding: 0em 0 0em 0; + } + + #video-home + { + position: relative; /* on positionne le conteneur */ + margin-top:34px; + margin-left: auto; + margin-right: auto; + width:320px; + height:180px; + } + #video-home iframe + { + width:320px; + height:180px; + } + + #main iframe + { + width:320px; + height:186px; + display:block; + } + + + +/*********************************************************************************/ +/* Intro */ +/*********************************************************************************/ + + #intro + { + text-align: center; + padding: 1em 2em 1em 2em !important; + margin: 0 auto; + } + + #intro .style2 + { + font-size: 1.5em; + letter-spacing: 0.05em; + line-height: 1.25em; + padding: 1.25em; + } + +/*********************************************************************************/ +/* Main */ +/*********************************************************************************/ + + #main + { + padding: 1em 0 0 0; + } + + #main-features + { + padding: 0 2em 0 2em; + } + +/*********************************************************************************/ +/* Content */ +/*********************************************************************************/ + + #content + { + padding: 0 0 2em 0; + } + + #content header.style1 + { + padding-bottom: 2.5em; + } + +/*********************************************************************************/ +/* Sidebar */ +/*********************************************************************************/ + + #sidebar + { + } + +/*********************************************************************************/ +/* Footer */ +/*********************************************************************************/ + + #footer + { + } + + #footer hr + { + display: none; + } + +/*********************************************************************************/ +/* Copyright */ +/*********************************************************************************/ + + #copyright + { + padding: 2em 0 0 0; + } + + #copyright span + { + padding: 1.5em 4em 1.5em 4em; + line-height: 1.5em; + } + + +/*_____________________________________________________________________*/ +/* Deplacement scroll to */ +/*_____________________________________________________________________*/ + + +#h-workflow + { + width: 100%; + height: 6em; + margin-top:0em; + margin-bottom:0em; + } + + + +#h-logiciels + { + width: 100%; + height: 6em; + padding-bottom: -4em; + + } + +#h-solutions + { + width: 100%; + height: 6em; + padding-bottom: -4em; + + } + +#h-prestations + { + width: 100%; + height: 6em; + padding-bottom: -4em; + + + } + +#h-references + { + width: 100%; + height: 6em; + padding-bottom: -4em; + + } + +#h-contacts + { + width: 100%; + height: 6em; + padding-bottom: -4em; + + } + diff --git a/css/style.css b/css/style.css new file mode 100644 index 0000000..d032610 --- /dev/null +++ b/css/style.css @@ -0,0 +1,968 @@ +@charset 'UTF-8'; + + + +@import "icone.css"; +@import "font.css"; +@import "gamme.css"; + + + +/*_____________________________________________________________________*/ +/* Commun */ +/*_____________________________________________________________________*/ + + + * + { + -moz-box-sizing: border-box; + -webkit-box-sizing: border-box; + -o-box-sizing: border-box; + -ms-box-sizing: border-box; + box-sizing: border-box; + } + + + + video + { + max-width: 100%; + height: auto; + } + + iframe + { + + } + + body, input, textarea, select + { + font-family: 'open_sansregular', sans-serif; + font-weight: normal; + color: #ffffff; + background: #ffffff; + } + + h1,h2,h3,h4,h5,h6 + { + font-family: 'open_sanssemibold', sans-serif; + font-weight: normal; + color: #ffffff; + } + + h1 a, h2 a, h3 a, h4 a, h5 a, h6 a + { + font-family: 'open_sanssemibold', sans-serif; + color: inherit; + text-decoration: none; + font-weight: normal; + } + + a + { + + text-decoration: underline; + color: #717479; + -moz-transition: color .25s ease-in-out; + -webkit-transition: color .25s ease-in-out; + -o-transition: color .25s ease-in-out; + -ms-transition: color .25s ease-in-out; + transition: color .25s ease-in-out; + } + + a:hover + { + text-decoration: none; + } + + strong, b + { + font-family: 'open_sansbold', sans-serif; + font-weight: normal; + } + + blockquote + { + border-left: solid 0.5em #ddd; + padding: 1em 0 1em 2em; + font-style: italic; + } + + em, i + { + font-family: 'source_sans_proitalic', sans-serif; + font-style: normal; + } + + hr + { + border: 0; + border-top: solid 1px #ddd; + } + + sub + { + position: relative; + top: 0.5em; + font-size: 0.8em; + } + + sup + { + position: relative; + top: -0.5em; + font-size: 0.8em; + } + + table + { + width: 100%; + } + + table.style1 + { + width: 100%; + } + + table.style1 tbody tr:nth-child(2n+2) + { + background: #f4f4f4; + } + + table.style1 td + { + padding: 0.5em 1em 0.5em 1em; + } + + table.style1 th + { + text-align: left; + font-weight:normal; + padding: 0.5em 1em 0.5em 1em; + } + + table.style1 thead + { + background: #484d55; + color: #fff; + } + + table.style1 tfoot + { + background: #eee; + } + + table.style1 tbody + { + } + + form + { + } + + form label + { + display: block; + color: #484d55; + } + + form input.text, + form select, + form textarea + { + -webkit-appearance: none; + display: block; + border: 0; + background: #eee; + box-shadow: inset 0px 0px 1px 0px #a0a1a7; + border-radius: 0em; + width: 100%; + padding: 0.2em 0.5em 0.2em 0.5em; + -moz-transition: all .25s ease-in-out; + -webkit-transition: all .25s ease-in-out; + -o-transition: all .25s ease-in-out; + -ms-transition: all .25s ease-in-out; + transition: all .25s ease-in-out; + } + + form input.text:hover, + form select:hover, + form textarea:hover + { + } + + form input.text:focus, + form select:focus, + form textarea:focus + { + background: #f8f8f8; + } + + form textarea + { + min-height: 12em; + } + + form .formerize-placeholder + { + color: #555 !important; + font-style: normal; + } + + form ::-webkit-input-placeholder + { + color: #555 !important; + font-style: normal; + } + + form :-moz-placeholder + { + color: #555 !important; + font-style: normal; + } + + form ::-moz-placeholder + { + color: #555 !important; + font-style: normal; + } + + form :-ms-input-placeholder + { + color: #555 !important; + font-style: normal; + } + + form ::-moz-focus-inner + { + border: 0; + } + + .nobr + { + white-space: nowrap; + } + + br.clear + { + clear: both; + } + + p, ul, ol, dl, table, blockquote, form + { + margin-bottom: 2em; + } + + section, + article + { + margin-bottom: 3em; + } + + section > :last-child, + article > :last-child + { + margin-bottom: 0; + } + + section:last-child, + article:last-child + { + margin: 0px -20px 0px -20px; + } + + header.style3 + { + + text-align: center; + } + + header.style2 + { + + text-align: center; + color:#ffffff; + } + + header.style1 + { + + text-align: center; + } + + header.style1 h2 + { + font-weight: normal; + } + + header.style2 h2 + { + font-weight: normal; + } + + header.style1 .byline + { + color: #ffffff; + } + + .image + { + display: inline-block; + } + + .image img + { + display: block; + width: 100%; + margin:auto; + } + + .image-full + { + display: block; + width: 100%; + margin: 0 0 2em 0; + } + + .image-left + { + float: left; + margin: 0 1em 1em 0; + } + .image-right + { + float: right; + + } + + .image-centered + { + display: block; + margin: 0 0 2em 0; + } + + .image-centered img + { + margin: 0 auto; + width: auto; + } + + .image-featured + { + display: block; + width: 100%; + margin: 1em 0 2em 0; + } + + .button + { + display: inline-block; + background-color: #ffffff; + font-family: 'webfontbold', sans-serif; + text-align: center; + text-transform: uppercase; + font-weight: normal; + letter-spacing: 0.1em; + text-decoration: none; + border-radius: 0em; + border: 0; + outline: 0; + cursor: pointer; + -moz-transition: all .25s ease-in-out; + -webkit-transition: all .25s ease-in-out; + -o-transition: all .25s ease-in-out; + -ms-transition: all .25s ease-in-out; + transition: all .25s ease-in-out; + } + + .button-style1 + { + background-color: #ffffff; + color: #fff; + } + + .button-style1:hover + { + background-color: #f98780; + } + + .button-style1:active + { + background-color: #d96760; + } + + .button-style2 + { + background: none; + color: #ffffff; + box-shadow: inset 0px 0px 2px 0px #a0a1a7; + } + + .button-style2:hover + { + box-shadow: inset 0px 0px 2px 0px #ffffff; + } + + .button-style2:active + { + box-shadow: inset 0px 0px 2px 0px #202127; + } + + .button-style3 + { + background-color: #ffffff; + color: #ffffff; + } + + .button-style3:hover + { + background-color: #3f434b; + } + + .button-style3:active + { + background-color: #1f232b; + } + + ul.style1 + { + } + + ul.style2 + { + } + + ul.style2 li + { + border-top: solid 1px #eee; + padding: 1.5em 0 0 0; + margin: 1.5em 0 0 0; + } + + ul.style2 li:first-child + { + border-top: 0; + padding-top: 0; + margin-top: 0; + } + + ul.style3 + { + } + + ul.style3 li + { + border-top: solid 1px #eee; + padding: 0.5em 0 0 0; + margin: 0.5em 0 0 0; + } + + ul.style3 li:first-child + { + border-top: 0; + padding-top: 0; + margin-top: 0; + } + + ol.style1 + { + } + + .actions + { + } + + + .feature-list + { + } + + .feature-list h3 + { + color: #ffffff !important; + } + + .feature-list h3:before + { + position: relative; + display: inline-block; + color: #ffffff; + background: #2f333b ; + border-radius: 0em; + text-align: center; + } + + + +/*********************************************************************************/ +/* Wrappers */ +/*********************************************************************************/ + + .wrapper + { + position: relative; + + } + + .wrapper .title + { + position: absolute; + top: 0; + left: 50%; + text-align: center; + text-transform: uppercase; + display: block; + font-weight: normal; + letter-spacing: 0.25em; + font-family: 'webfontbold'; + font-size: 1.3em; + width: 18em; + height: 4em; + top: -2em; + line-height: 2em; + margin-bottom: -2em; + margin-left: -9em; + padding-top: 0.8em; + border-style:solid; + border-width:4px; + border-radius: 0.5em 0.5em 0.5em 0.5em; + + } + + .wrapper .title:before + { + content: ''; + position: absolute; + bottom: -38px; + left: -35px; + width: 35px; + height: 38px; + background-color:; + } + + .wrapper .title:after + { + content: ''; + position: absolute; + bottom: -38px; + right: -35px; + width: 35px; + height: 38px; + background-color:; + -moz-transform: scaleX(-1); + -webkit-transform: scaleX(-1); + -o-transform: scaleX(-1); + -ms-transform: scaleX(-1); + transform: scaleX(-1); + } + + .wrapper-video + { + position: relative; + } + +#header-wrapper + { + + background-size: cover; + + } + + #header-wrapper:before + { + content: ''; + position: absolute; + top: 0; + left: 0; + width: 100%; + height: 100%; + background-color: ; + } + + #footer-wrapper + { + background-color: #302E42; + color: #eee; + color: rgba(255,255,255,0.5); + } + + #footer-wrapper h1, + #footer-wrapper h2, + #footer-wrapper h3, + #footer-wrapper h4, + #footer-wrapper h5, + #footer-wrapper h6, + #footer-wrapper strong, + #footer-wrapper b, + #footer-wrapper a + { + color: #fff; + } + + #footer-wrapper hr + { + border-top-color: #333; + border-top-color: rgba(255,255,255,0.05); + } + + #footer-wrapper form + { + } + + #footer-wrapper form input.text, + #footer-wrapper form select, + #footer-wrapper form textarea + { + background: #ccc; + box-shadow: none; + } + + #footer-wrapper form input.text:focus, + #footer-wrapper form select:focus, + #footer-wrapper form textarea:focus + { + background-color: #fff; + } + + #footer-wrapper .button-style2 + { + color: #aaa; + box-shadow: inset 0px 0px 2px 0px rgba(255,255,255,0.5); + } + + #footer-wrapper .button-style2:hover + { + color: #ccc; + box-shadow: inset 0px 0px 2px 0px rgba(255,255,255,0.65); + } + + #footer-wrapper .button-style2:active + { + box-shadow: inset 0px 0px 2px 0px rgba(255,255,255,0.75); + } + + #footer-wrapper .title + { + background-color: #2D2C3A; + color: #eee; + } + + #footer-wrapper header.style1 + { + } + + #footer-wrapper header.style1 h2 + { + color: #fff; + } + + #footer-wrapper header.style1 .byline + { + color: inherit; + } + + #footer-wrapper .feature-list + { + } + + #footer-wrapper .feature-list .row + { + border-top-color: #333; + border-top-color: rgba(255,255,255,0.05); + } + + #footer-wrapper .feature-list h3 + { + } + + #footer-wrapper .feature-list h3:before + { + background-color: #3d4249; + } + + .wrapper-style1 + { + + background-color: #ffffff; + color: #eee; + color: rgba(255,255,255,0.75); + } + + .wrapper-style1 .title + { + background-color: #ffffff; + color: #fff; + } + + .wrapper-style1 h1, + .wrapper-style1 h2, + .wrapper-style1 h3, + .wrapper-style1 h4, + .wrapper-style1 h5, + .wrapper-style1 h6, + .wrapper-style1 strong, + .wrapper-style1 b, + .wrapper-style1 a + { + color: #fff; + } + + .wrapper-style2 + { + background-color: #fff; + } + + .wrapper-style2 .title + { + + } + + .wrapper-style3 + { + background-color: #ffffff; + } + + .wrapper-style3 .title + { + background-color: #f3f3f3; + color: #484d55; + } + + .wrapper-style3 .image + { + border: solid 0px #fff; + } + +/*********************************************************************************/ +/* Menu */ +/*********************************************************************************/ + #nav-back + { + } + + + #nav + { + } + + #logo + { + } + + #logo h1 + { + } + + + +/*********************************************************************************/ +/* video home */ +/*********************************************************************************/ + #video-home + { + margin-top:60px; + } +/*********************************************************************************/ +/* Intro */ +/*********************************************************************************/ + + #intro + { + + } + + #intro .style1 + { + } + + #intro .style2 + { + font-weight: normal; + color: #fff; + border-radius: 0.35em; + box-shadow: inset 0px 0px 1px 1px rgba(255,255,255,); + background: #A1A0A8; + } + + #intro .style2 a + { + color: inherit; + text-decoration: none; + } + + #intro .style3 + { + } + +/*********************************************************************************/ +/* Highlights */ +/*********************************************************************************/ + + #logiciels + { + } + + #logiciels .logiciels + { + text-align: center; + } + + #logiciels .logiciels h3 + { + color: #ffffff; + } + +/*********************************************************************************/ +/* solutions */ +/*********************************************************************************/ + + #solutions + { + } + + #solutions .solutions + { + text-align: center; + } + + #solutions .solutions h3 + { + color: #ffffff; + } + + +/*********************************************************************************/ +/* prestations */ +/*********************************************************************************/ + + #prestations + { + } + + #prestations .prestations + { + text-align: center; + } + + #prestations .prestations h3 + { + color: #ffffff; + } + + +/*********************************************************************************/ +/* Copyright */ +/*********************************************************************************/ + + + #copyright + { + text-align: center; + } + + #copyright span + { + display: inline-block; + border-radius: 0.35em; + box-shadow: inset 0px 0px 1px 1px rgba(255,255,255,0.05); + color: #aaa; + color: rgba(255,255,255,0.25); + } + + #copyright span a + { + color: inherit; + } + + #copyright span a:hover + { + color: #fff; + } + +/*********************************************************************************/ +/* Carte */ +/*********************************************************************************/ + + + + #map + { + font-family: 'webfontbold', sans-serif; + font-size: 19px; + font-weight: normal; + letter-spacing: 2px; + color: #fff; + margin: 0; + padding: 0; + border: 0; + } + .map-tile + { + opacity:0; + } + .map-tile-loaded + { + -webkit-animation-name: 'fade-in'; + -moz-animation-name: 'fade-in'; + -moz-animation-timing-function: ease-in; + -webkit-animation-timing-function: ease-in; + -webkit-animation-duration: 0.2s; + -moz-animation-duration: 0.2s; + } + @-webkit-keyframes fade-in; + @-moz-keyframes fade-in + { + from + { + opacity: 0; + } + to + { + opacity: 1; + } + + + + + +/*_____________________________________________________________________*/ +/* Deplacement scroll to */ +/*_____________________________________________________________________*/ + +#h-workflow + { + + } + + + +#h-logiciels + { + + + } + +#h-solutions + { + + + } + +#h-prestations + { + + + } + +#h-references + { + + + } + + +#h-contacts + { + + + } diff --git a/css/video-font.css b/css/video-font.css new file mode 100644 index 0000000..1248021 --- /dev/null +++ b/css/video-font.css @@ -0,0 +1,15 @@ + +/*_____________________________________________________________________*/ +/* Font */ +/*_____________________________________________________________________*/ + + +@font-face{ + font-family: 'VideoJS'; + src: url('../font/video/vjs.eot'); + src: url('../font/video/vjs.eot?#iefix') format('embedded-opentype'), + url('../font/video/vjs.woff') format('woff'), + url('../font/video/vjs.ttf') format('truetype'); + font-weight: normal; + font-style: normal; +} \ No newline at end of file diff --git a/css/video-js.css b/css/video-js.css new file mode 100644 index 0000000..77fe019 --- /dev/null +++ b/css/video-js.css @@ -0,0 +1,730 @@ +/*! +Video.js Default Styles (http://videojs.com) +Version 4.1.0 +*/ + +/* +REQUIRED STYLES (be careful overriding) +================================================================================ */ +/* When loading the player, the video tag is replaced with a DIV, + that will hold the video tag or object tag for other playback methods. + The div contains the video playback element (Flash or HTML5) and controls, and sets the width and height of the video. + + ** If you want to add some kind of border/padding (e.g. a frame), or special positioning, use another containing element. + Otherwise you risk messing up control positioning and full window mode. ** +*/ +.video-js { + background-color: #000; + position: relative; + padding: 0; + /* Start with 10px for base font size so other dimensions can be em based and easily calculable. */ + font-size: 10px; + /* Allow poster to be vertially aligned. */ + vertical-align: middle; + /* display: table-cell; */ /*This works in Safari but not Firefox.*/ + + /* Turn off user selection (text highlighting) by default. + The majority of player components will not be text blocks. + Text areas will need to turn user selection back on. */ + -webkit-user-select: none; /* Chrome all / Safari all */ + -moz-user-select: none; /* Firefox all */ + -ms-user-select: none; /* IE 10+ */ + -o-user-select: none; + user-select: none; +} + +/* Playback technology elements expand to the width/height of the containing div. +