@import "gamme.css";
-*, *:after, *:before { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; }
-body, html { height: 100%; font-size: 100%; padding: 0; margin: 0;}
-/* Clearfix hack by Nicolas Gallagher: http://nicolasgallagher.com/micro-clearfix-hack/ */
-.clearfix:before, .clearfix:after { content: " "; display: table; }
-.clearfix:after { clear: both; }
+body, html { height: 100%; font-size: 100%; padding: 0; margin: 0;}
body {
font-family:'ralewayregular', sans-serif;
.image
{
- display:inline-block;
+ display:block;
margin:auto;
}
<!-- Header -->
<div id="header" class="wrapper-video">
<div id="video-home">
- <iframe src="ifr-home.html" ></iframe>
+ <iframe src="ifr-e-concert.html" ></iframe>
</div>
</div>
<!-- /Header -->
<!-- Header -->
<div id="header" class="wrapper-video">
<div id="video-home">
- <iframe src="ifr-home.html" ></iframe>
+ <iframe src="ifr-e-conference.html" ></iframe>
</div>
</div>
<!-- /Header -->
--- /dev/null
+<!DOCTYPE html>
+<html lang="fr" class="no-js">
+ <head>
+ <meta charset="UTF-8" />
+ <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
+ <title>record broadcast play</title>
+ <meta name="description" content="" />
+ <meta name="keywords" content="" />
+ <meta name="author" content="" />
+ <link rel="stylesheet" type="text/css" href="css/multilevelmenu.css" />
+ <link rel="stylesheet" type="text/css" href="css/component.css" />
+ <link rel="stylesheet" type="text/css" href="css/animations.css" />
+ <link rel="stylesheet" type="text/css" href="css/video-js-tc.css" />
+ <script src="js/modernizr.custom.js"></script>
+ <script src="js/video.js"></script>
+
+ <script>
+ videojs.options.flash.swf = "swf/video-js.swf";
+ </script>
+
+ </head>
+
+
+
+ <body class="color04">
+ <div class="pt-triggers">
+ <button id="iterateEffects" class="pt-touch-button"></button>
+ <div id="dl-menu" class="dl-menuwrapper">
+ <ul class="dl-menu">
+ <li>
+ <ul class="dl-submenu">
+ <li data-animation="1"><a href="#"></a></li>
+ </ul>
+ </li>
+ </ul>
+ </div><!-- /dl-menu-wrapper-->
+ </div><!-- /triggers -->
+
+ <div id="pt-main" class="pt-perspective color04">
+ <div class="pt-page color04 pt-page-1">
+ <div class="image"><img src="img/telecasting-dia-01.svg" alt="" />
+ <h2>All in the Case*</h2>
+ </div>
+ </div>
+ <div class="pt-page color04 pt-page-2">
+ <div class="image"><img src="img/telecasting-dia-02.svg" alt="" />
+ <h3>installation & captation</h3>
+ <p><b>caméra</b> Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor <b>micro</b> incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. <b>portable</b> Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. <b>logiciel</b> Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.<span> Etape 1</span></p>
+ </div>
+ </div>
+ <div class="pt-page color04 pt-page-3">
+ <div class="image"><img src="img/telecasting-dia-02.svg" alt="" />
+ <h3>installation & captation</h3>
+ <p><b>caméra</b> Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor <b>micro</b> incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. <b>portable</b> Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. <b>logiciel</b> Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.<span> Etape 1</span></p></div>
+ </div>
+ <div class="pt-page color04 pt-page-4">
+ <div class="image"><img src="img/telecasting-dia-02.svg" alt="" />
+ <h3>installation & captation</h3>
+ <p><b>caméra</b> Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor <b>micro</b> incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. <b>portable</b> Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. <b>logiciel</b> Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.<span> Etape 1</span></p></div>
+ </div>
+ <div class="pt-page color04 pt-page-5">
+ <div class="image"><img src="img/telecasting-dia-02.svg" alt="" />
+ <h3>installation & captation</h3>
+ <p><b>caméra</b> Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor <b>micro</b> incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. <b>portable</b> Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. <b>logiciel</b> Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.<span> Etape 1</span></p></div>
+ </div>
+ <div class="pt-page color04 pt-page-6">
+ <video id="player" class="video-js vjs-tc-skin" width="100%" height="100%" controls poster="vid/tele01.png" data-setup="{}">
+ <source src="vid/tele01.mp4" type="video/mp4" />
+ <source src="vid/tele01.webm" type="video/webm" />
+ <source src="vid/tele01.ogv" type="video/ogg" />
+ </video>
+ </div>
+ </div>
+
+ <div class="pt-message">
+ <p>Your browser does not support CSS animations.</p>
+ </div>
+
+ <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
+ <script src="js/jquery.dlmenu.js"></script>
+ <script src="js/pagetransitions.js"></script>
+ </body>
+</html>
--- /dev/null
+<!DOCTYPE html>
+<html lang="fr" class="no-js">
+ <head>
+ <meta charset="UTF-8" />
+ <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
+ <title>record broadcast play</title>
+ <meta name="description" content="" />
+ <meta name="keywords" content="" />
+ <meta name="author" content="" />
+ <link rel="stylesheet" type="text/css" href="css/multilevelmenu.css" />
+ <link rel="stylesheet" type="text/css" href="css/component.css" />
+ <link rel="stylesheet" type="text/css" href="css/animations.css" />
+ <link rel="stylesheet" type="text/css" href="css/video-js-tc.css" />
+ <script src="js/modernizr.custom.js"></script>
+ <script src="js/video.js"></script>
+
+ <script>
+ videojs.options.flash.swf = "swf/video-js.swf";
+ </script>
+
+ </head>
+
+
+
+ <body class="color03">
+ <div class="pt-triggers">
+ <button id="iterateEffects" class="pt-touch-button"></button>
+ <div id="dl-menu" class="dl-menuwrapper">
+ <ul class="dl-menu">
+ <li>
+ <ul class="dl-submenu">
+ <li data-animation="1"><a href="#"></a></li>
+ </ul>
+ </li>
+ </ul>
+ </div><!-- /dl-menu-wrapper-->
+ </div><!-- /triggers -->
+
+ <div id="pt-main" class="pt-perspective color03">
+ <div class="pt-page color03 pt-page-1">
+ <div class="image"><img src="img/telecasting-dia-01.svg" alt="" />
+ <h2>All in the Case*</h2>
+ </div>
+ </div>
+ <div class="pt-page color03 pt-page-2">
+ <div class="image"><img src="img/telecasting-dia-02.svg" alt="" />
+ <h3>installation & captation</h3>
+ <p><b>caméra</b> Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor <b>micro</b> incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. <b>portable</b> Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. <b>logiciel</b> Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.<span> Etape 1</span></p>
+ </div>
+ </div>
+ <div class="pt-page color03 pt-page-3">
+ <div class="image"><img src="img/telecasting-dia-02.svg" alt="" />
+ <h3>installation & captation</h3>
+ <p><b>caméra</b> Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor <b>micro</b> incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. <b>portable</b> Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. <b>logiciel</b> Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.<span> Etape 1</span></p></div>
+ </div>
+ <div class="pt-page color03 pt-page-4">
+ <div class="image"><img src="img/telecasting-dia-02.svg" alt="" />
+ <h3>installation & captation</h3>
+ <p><b>caméra</b> Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor <b>micro</b> incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. <b>portable</b> Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. <b>logiciel</b> Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.<span> Etape 1</span></p></div>
+ </div>
+ <div class="pt-page color03 pt-page-5">
+ <div class="image"><img src="img/telecasting-dia-02.svg" alt="" />
+ <h3>installation & captation</h3>
+ <p><b>caméra</b> Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor <b>micro</b> incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. <b>portable</b> Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. <b>logiciel</b> Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.<span> Etape 1</span></p></div>
+ </div>
+ <div class="pt-page color03 pt-page-6">
+ <video id="player" class="video-js vjs-tc-skin" width="100%" height="100%" controls poster="vid/tele01.png" data-setup="{}">
+ <source src="vid/tele01.mp4" type="video/mp4" />
+ <source src="vid/tele01.webm" type="video/webm" />
+ <source src="vid/tele01.ogv" type="video/ogg" />
+ </video>
+ </div>
+ </div>
+
+ <div class="pt-message">
+ <p>Your browser does not support CSS animations.</p>
+ </div>
+
+ <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
+ <script src="js/jquery.dlmenu.js"></script>
+ <script src="js/pagetransitions.js"></script>
+ </body>
+</html>
<html lang="fr" class="no-js">
<head>
<meta charset="UTF-8" />
- <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
+ <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>record broadcast play</title>
<meta name="description" content="" />
<meta name="keywords" content="" />
</div><!-- /dl-menu-wrapper-->
</div><!-- /triggers -->
- <div id="pt-main" class="pt-perspective color01">
+ <div id="pt-main" class="pt-perspective color02">
<div class="pt-page color02 pt-page-1">
<div class="image"><img src="img/telecasting-dia-01.svg" alt="" />
<h2>All in the Case*</h2>
<html lang="fr" class="no-js">
<head>
<meta charset="UTF-8" />
- <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
+ <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>record broadcast play</title>
<meta name="description" content="" />
<meta name="keywords" content="" />
--- /dev/null
+<!DOCTYPE html>
+<html lang="fr" class="no-js">
+ <head>
+ <meta charset="UTF-8" />
+ <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
+ <title>record broadcast play</title>
+ <meta name="description" content="" />
+ <meta name="keywords" content="" />
+ <meta name="author" content="" />
+ <link rel="stylesheet" type="text/css" href="css/multilevelmenu.css" />
+ <link rel="stylesheet" type="text/css" href="css/component.css" />
+ <link rel="stylesheet" type="text/css" href="css/animations.css" />
+ <link rel="stylesheet" type="text/css" href="css/video-js-tc.css" />
+ <script src="js/modernizr.custom.js"></script>
+ <script src="js/video.js"></script>
+
+ <script>
+ videojs.options.flash.swf = "swf/video-js.swf";
+ </script>
+
+ </head>
+
+
+
+ <body class="color01">
+ <div class="pt-triggers">
+ <button id="iterateEffects" class="pt-touch-button"></button>
+ <div id="dl-menu" class="dl-menuwrapper">
+ <ul class="dl-menu">
+ <li>
+ <ul class="dl-submenu">
+ <li data-animation="1"><a href="#"></a></li>
+ </ul>
+ </li>
+ </ul>
+ </div><!-- /dl-menu-wrapper-->
+ </div><!-- /triggers -->
+
+ <div id="pt-main" class="pt-perspective color01">
+ <div class="pt-page color01 pt-page-1">
+ <div class="image"><img src="img/telecasting-dia-01.svg" alt="" />
+ <h2>All in the Case*</h2>
+ </div>
+ </div>
+ <div class="pt-page color01 pt-page-2">
+ <div class="image"><img src="img/telecasting-dia-02.svg" alt="" />
+ <h3>installation & captation</h3>
+ <p><b>caméra</b> Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor <b>micro</b> incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. <b>portable</b> Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. <b>logiciel</b> Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.<span> Etape 1</span></p>
+ </div>
+ </div>
+ <div class="pt-page color01 pt-page-3">
+ <div class="image"><img src="img/telecasting-dia-02.svg" alt="" />
+ <h3>installation & captation</h3>
+ <p><b>caméra</b> Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor <b>micro</b> incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. <b>portable</b> Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. <b>logiciel</b> Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.<span> Etape 1</span></p></div>
+ </div>
+ <div class="pt-page color01 pt-page-4">
+ <div class="image"><img src="img/telecasting-dia-02.svg" alt="" />
+ <h3>installation & captation</h3>
+ <p><b>caméra</b> Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor <b>micro</b> incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. <b>portable</b> Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. <b>logiciel</b> Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.<span> Etape 1</span></p></div>
+ </div>
+ <div class="pt-page color01 pt-page-5">
+ <div class="image"><img src="img/telecasting-dia-02.svg" alt="" />
+ <h3>installation & captation</h3>
+ <p><b>caméra</b> Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor <b>micro</b> incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. <b>portable</b> Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. <b>logiciel</b> Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.<span> Etape 1</span></p></div>
+ </div>
+ <div class="pt-page color01 pt-page-6">
+ <video id="player" class="video-js vjs-tc-skin" width="100%" height="100%" controls poster="vid/tele01.png" data-setup="{}">
+ <source src="vid/tele01.mp4" type="video/mp4" />
+ <source src="vid/tele01.webm" type="video/webm" />
+ <source src="vid/tele01.ogv" type="video/ogg" />
+ </video>
+ </div>
+ </div>
+
+ <div class="pt-message">
+ <p>Your browser does not support CSS animations.</p>
+ </div>
+
+ <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
+ <script src="js/jquery.dlmenu.js"></script>
+ <script src="js/pagetransitions.js"></script>
+ </body>
+</html>
<!-- Header -->
<div id="header" class="wrapper-video">
<div id="video-home">
- <iframe src="ifr-home.html" ></iframe>
+ <iframe src="ifr-mobile-web-tv.html" ></iframe>
</div>
</div>
<!-- /Header -->
projects / telecasting-www.git / commitdiff