From 89b59e9011ee0c5571a114e3927e21625e1971ae Mon Sep 17 00:00:00 2001
From: "bruno@cubedesigners.com"
 <bruno@cubedesigners.com@f5622870-0f3c-0410-866d-9cb505b7a8ef>
Date: Thu, 30 Jan 2014 16:43:58 +0000
Subject: [PATCH]

---
 framework/application/Bootstrap.php           | 71 ++++++++++++++
 .../controllers/StudiesController.php         | 40 ++++++++
 .../application/forms/CMS/Casestudies.php     | 10 +-
 .../forms/CMS/Element/Casestudies.php         | 12 +++
 .../CMS/Sub/Casestudies/Content/Bloc.php      | 14 +++
 .../forms/CMS/Sub/Casestudies/Studies.php     | 55 ++++++++++-
 .../views/helpers/CasestudiesDetail.php       | 91 ++++++++++++++++++
 .../views/helpers/CasestudiesList.php         | 22 +++--
 .../views/helpers/CasestudiesTagsList.php     |  9 +-
 .../views/scripts/studies/index.phtml         | 16 ++++
 .../views/scripts/templates/casestudies.phtml |  7 +-
 js/admin.js                                   |  7 +-
 less/casestudies.less                         | 31 ++++--
 less/casestudies_detail.less                  | 96 +++++++++++++++++++
 14 files changed, 450 insertions(+), 31 deletions(-)
 create mode 100644 framework/application/controllers/StudiesController.php
 create mode 100644 framework/application/forms/CMS/Element/Casestudies.php
 create mode 100644 framework/application/views/helpers/CasestudiesDetail.php
 create mode 100644 framework/application/views/scripts/studies/index.phtml
 create mode 100644 less/casestudies_detail.less

diff --git a/framework/application/Bootstrap.php b/framework/application/Bootstrap.php
index 31e6001..2f559cb 100644
--- a/framework/application/Bootstrap.php
+++ b/framework/application/Bootstrap.php
@@ -40,6 +40,19 @@ class Bootstrap extends CubeIT_Bootstrap {
         $tags->addColumn('id', 'integer', array('unsigned' => true, 'autoincrement' => true));
         $tags->setPrimaryKey(array('id'));
         $tags->addColumn('name', 'string', array('length' => 64));
+
+        $casestudies = $schema->createTable('casestudies');
+        $casestudies->addColumn('id', 'integer', array('unsigned' => true, 'autoincrement' => true));
+        $casestudies->setPrimaryKey(array('id'));
+        $casestudies->addColumn('titre', 'text');
+        $casestudies->addColumn('description', 'text');
+        $casestudies->addColumn('url', 'text');
+        $casestudies->addColumn('visuel', 'string', array('length' => 128));
+        $casestudies->addColumn('visuel_detail', 'string', array('length' => 128));
+        $casestudies->addColumn('legende', 'text');
+        $casestudies->addColumn('couleur', 'text');
+        $casestudies->addColumn('blocs', 'text');
+        $casestudies->addColumn('tags', 'text');
     }
 
     protected function _initAcl() {
@@ -47,6 +60,63 @@ class Bootstrap extends CubeIT_Bootstrap {
         return $acl;
     }
 
+    protected function _makeNavigationOnePage(&$navigation, $r, $t, $isAdmin, $locale = false) {
+        $page = parent::_makeNavigationOnePage($navigation, $r, $t, $isAdmin, $locale);
+
+        if (!$page) {
+            return;
+        }
+
+        if ($page->getTemplate() == 'casestudies') {
+            $this->addStudiesPages($page);
+        }
+    }
+
+    /**
+     *
+     * @param CubeIT_Navigation_Page_Locale $page
+     */
+    protected function addStudiesPages($page) {
+        $datas = $this->getCMSDatasOfNavigationPage($page);
+        //fb($datas);
+        $db = Zend_Db_Table::getDefaultAdapter();
+        $s = $db->select()->from('casestudies')
+                ->order('id ASC');
+        $q = $s->query();
+
+        fb("datas", $datas['seourl_stu']);
+
+        while ($r = $q->fetch()) {
+            if ($r->titre == '') {
+                continue;
+            }
+            $p = new CubeIT_Navigation_Page_Locale();
+            $p->setController('Studies');
+            $p->setId($page->getId() . '/' . $r->id);
+            $p->setAutoUri($r, $datas['seourl_stu'], $page->getLocale());
+            $p->setSitemap(true);
+            $p->setEditable(false);
+            $p->setDomain($page->getDomain());
+            $p->setLabel($r->titre);
+            $page->addPage($p);
+        }
+
+        /* foreach ($datas['studies'] as $k => $studie) {
+          if ($studie['titre'] == '') {
+          continue;
+          }
+          $p = new CubeIT_Navigation_Page_Locale();
+          $p->setController('Studies');
+          $p->setId($page->getId() . '/' . $k);
+          $p->setAutoUri($studie, $datas['seourl_stu'], $page->getLocale());
+          $p->setSitemap(true);
+          $p->setEditable(false);
+          $p->setDomain($page->getDomain());
+          $p->setLabel($studie['titre']);
+          $page->addPage($p);
+          } */
+    }
+
     /**
      *
      * @return array
@@ -57,6 +127,7 @@ class Bootstrap extends CubeIT_Bootstrap {
         $templates['Agence'] = array('agence' => 'L\'agence');
         $templates['Realisations'] = array('realisations' => 'Réalisations');
         $templates['Casestudies'] = array('casestudies' => 'Case-Studies');
+        $templates['CasestudiesDetail'] = array('casestudies_detail' => 'Case-Studies (détail)');
         $templates['Expertises'] = array('expertises' => 'Expertises');
         $templates['Contact'] = array('contact' => 'Contact');
         $templates['Mentions'] = array('mentions' => 'Mentions légales');
diff --git a/framework/application/controllers/StudiesController.php b/framework/application/controllers/StudiesController.php
new file mode 100644
index 0000000..ef7732a
--- /dev/null
+++ b/framework/application/controllers/StudiesController.php
@@ -0,0 +1,40 @@
+<?php
+
+class StudiesController extends CubeIT_Controller_PageController {
+
+    public function indexAction() {
+        $parent = $this->view->currentPage->getParent();
+
+        $datas = $this->getBootstrap()->getCMSDatasOfNavigationPage($parent);
+        $this->view->datas = $datas;
+
+        $url = $this->getRequest()->getParam('page');
+
+        $ok = false;
+
+        $db = Zend_Db_Table::getDefaultAdapter();
+        $s = $db->select()->from('casestudies')
+                ->order('id ASC');
+        $q = $s->query();
+
+        while ($r = $q->fetch()) {
+            if (CubeIT_Navigation_Page::generateAutoUri($r, $datas['seourl_stu'], null) == $url) {
+
+                $this->view->casestudies_titre = $datas["titre"];
+                $this->view->titre = $r->titre;
+                $this->view->studie = $r;
+
+                $ok = true;
+                break;
+            }
+        }
+
+        if (!$ok) {
+            $this->_404();
+            return;
+        }
+    }
+
+}
+
+?>
diff --git a/framework/application/forms/CMS/Casestudies.php b/framework/application/forms/CMS/Casestudies.php
index 459e6a4..b722215 100644
--- a/framework/application/forms/CMS/Casestudies.php
+++ b/framework/application/forms/CMS/Casestudies.php
@@ -9,9 +9,13 @@ class Cubedesigners_Form_CMS_Casestudies extends Cubedesigners_Form_CMS {
         $titre->setLabel('Titre');
         $this->addElement($titre);
 
-        $studies = new Cubedesigners_Form_CMS_Sub_Casestudies_Studies();
-        $studies->setLabel('Etudes de cas');
-        $this->addSubForm($studies, 'studies');
+        $stuurl = new Zend_Form_Element_Text('seourl_stu');
+        $stuurl->setLabel('Modèle d\'URL des études de cas');
+        $this->addElement($stuurl);
+
+        $studies = new Cubedesigners_Form_CMS_Element_Casestudies('studies');
+        $studies->setLabel('Gestion des études de cas');
+        $this->addElement($studies);
     }
 
 }
diff --git a/framework/application/forms/CMS/Element/Casestudies.php b/framework/application/forms/CMS/Element/Casestudies.php
new file mode 100644
index 0000000..e316cb3
--- /dev/null
+++ b/framework/application/forms/CMS/Element/Casestudies.php
@@ -0,0 +1,12 @@
+<?php
+
+class Cubedesigners_Form_CMS_Element_Casestudies extends CubeIT_Form_Element_List {
+
+    public function init() {
+        parent::init();
+
+        $this->setBaseForm(new Cubedesigners_Form_CMS_Sub_Casestudies_Studies());
+        $this->clearDecorators();
+    }
+
+}
diff --git a/framework/application/forms/CMS/Sub/Casestudies/Content/Bloc.php b/framework/application/forms/CMS/Sub/Casestudies/Content/Bloc.php
index 4b0087d..a8d9fba 100644
--- a/framework/application/forms/CMS/Sub/Casestudies/Content/Bloc.php
+++ b/framework/application/forms/CMS/Sub/Casestudies/Content/Bloc.php
@@ -9,6 +9,10 @@ class Cubedesigners_Form_CMS_Sub_Casestudies_Content_Bloc extends CubeIT_Form_Su
         $select->setAttrib('data-name', 'selected-type');
         $this->addElement($select);
 
+        $margin = new Zend_Form_Element_Text('margin');
+        $margin->setLabel("Décalage du vertical bloc (en pixels)");
+        $this->addElement($margin);
+
         $titre = new Zend_Form_Element_Text('titre');
         $titre->setLabel('Titre');
         $this->addElement($titre);
@@ -25,6 +29,16 @@ class Cubedesigners_Form_CMS_Sub_Casestudies_Content_Bloc extends CubeIT_Form_Su
         $video = new CubeIT_Form_Element_WebVideo('video');
         $video->setLabel('URL de la vidéo');
         $this->addElement($video);
+
+        $video_background = new CubeIT_Form_Element_File_Image('video_background');
+        $video_background->setLabel('Fond de la vidéo');
+        $video_background->setMaxItems(1);
+        $this->addElement($video_background);
+
+        $type = new Zend_Form_Element_Hidden('form-type');
+        $type->setAttrib('data-name', 'form-type');
+        $type->setValue('test');
+        $this->addElement($type);
     }
 
 }
diff --git a/framework/application/forms/CMS/Sub/Casestudies/Studies.php b/framework/application/forms/CMS/Sub/Casestudies/Studies.php
index b4c5359..2e61ac9 100644
--- a/framework/application/forms/CMS/Sub/Casestudies/Studies.php
+++ b/framework/application/forms/CMS/Sub/Casestudies/Studies.php
@@ -1,14 +1,59 @@
 <?php
 
-class Cubedesigners_Form_CMS_Sub_Casestudies_Studies extends CubeIT_Form_Multi_SubForm {
+class Cubedesigners_Form_CMS_Sub_Casestudies_Studies extends CubeIT_Form_List {
 
     public function init() {
         parent::init();
+        $id = new CubeIT_Form_Element_Id();
+        $this->addElement($id);
 
-        $studie = new Cubedesigners_Form_CMS_Sub_Casestudies_Studie();
-        $this->setBaseSubForm($studie);
-        $this->setBaseLegend('Edition de l\'etude de cas « $titre »');
-        $this->setNewLegend('Nouvelle étude de cas');
+        $titre = new Zend_Form_Element_Text('titre');
+        $titre->setLabel('Titre');
+        $this->addElement($titre);
+
+        $description = new Zend_Form_Element_Text('description');
+        $description->setLabel('Description');
+        $this->addElement($description);
+
+        $url = new CubeIT_Form_Element_Url('url');
+        $url->setLabel('URL du site');
+        $this->addElement($url);
+
+        $visuel = new CubeIT_Form_Element_File_Image('visuel');
+        $visuel->setLabel('Visuel de la page Case Studies');
+        $visuel->setMaxItems(1);
+        $this->addElement($visuel);
+
+        $visuel_detail = new CubeIT_Form_Element_File_Image('visuel_detail');
+        $visuel_detail->setLabel('Visuel de la page de détail');
+        $visuel_detail->setMaxItems(1);
+        $this->addElement($visuel_detail);
+
+        $legende = new Zend_Form_Element_Text('legende');
+        $legende->setLabel('Legende du visuel');
+        $this->addElement($legende);
+
+        $color = new Zend_Form_Element_Text('couleur');
+        $color->setLabel('Code couleur de la zone de contenu');
+        $this->addElement($color);
+
+        $blocs = new Cubedesigners_Form_CMS_Sub_Casestudies_Content_Blocs('blocs');
+        $blocs->setLegend('Contenu');
+        $this->addSubForm($blocs, 'blocs');
+
+        $tags = new Cubedesigners_Form_Element_Tags('tags');
+        $tags->setLabel('Tags');
+        $this->addElement($tags);
+
+        $bootstrap = Bootstrap::getInstance();
+        $view = $bootstrap->getView();
+
+        $this->setListTitle('Etudes de cas')
+                ->setNewTitle('Créer une étude de cas')
+                ->setEditTitle('Edition de l\'éétude de cas « $titre »')
+                ->setBaseTable('casestudies')
+                ->setIdColumn('id')
+                ->setTitleColumn('titre');
     }
 
 }
diff --git a/framework/application/views/helpers/CasestudiesDetail.php b/framework/application/views/helpers/CasestudiesDetail.php
new file mode 100644
index 0000000..89dd28f
--- /dev/null
+++ b/framework/application/views/helpers/CasestudiesDetail.php
@@ -0,0 +1,91 @@
+<?php
+
+class Cubedesigners_View_Helper_CasestudiesDetail extends Zend_View_Helper_Abstract {
+
+    public function CasestudiesDetail($studie) {
+
+        $visuel_detail = $this->view->imageProcess($studie->visuel_detail, $studie->titre, 980, 400);
+
+        $res = '<div id="casestudies-detail-visuel">';
+        $res .= '<div class="visuel-holder">';
+        $res .= '<div class="visuel">' . $visuel_detail . '</div>';
+
+
+        $res .= '<div class="legende">' . $studie->legende . '</div>';
+
+        if ($studie->url != '') {
+            $res .= '<a href="' . $studie->url . '" style="float:right">' . __("Voir le site") . '</a>';
+        }
+
+        $res .= '</div>';
+        $res .= '</div>';
+
+        $style = '';
+        if ($studie->couleur != '') {
+            $style = 'background-color:' . $studie->couleur;
+        }
+        $res .= '<div id="casestudies-detail-content" style="' . $style . ';">';
+
+        $blocs = json_decode($studie->blocs, true);
+
+        foreach ($blocs as $bloc) {
+
+            $margin = '';
+
+            if ($bloc["margin"] != '') {
+                $margin = 'margin-top:' . $bloc["margin"] . 'px;';
+            }
+
+            if ($bloc["selectedtype"] == "text") {
+
+                $res .= '<div class="detail-text" style="' . $margin . '" >';
+                $res .= '<div class="titre">' . $bloc["titre"] . '</div>';
+                $res .= '<div class="texte">' . $bloc["texte"] . '</div>';
+                $res .= '</div>';
+            }
+
+            if ($bloc["selectedtype"] == "visuel") {
+                $visuel = $this->view->imageProcess()->imageProcessGetUrl($bloc["visuel"], '', 1200, null);
+                $width = -1;
+                $height = -1;
+                CubeIT_Image::getDimensions($visuel, $width, $height);
+
+
+
+                $res .= '<div class="detail-visuel" style="background-image:url(\'' . $visuel . '\');height:' . $height . 'px;' . $margin . '"></div>';
+            }
+
+
+            $addVideoBackground = false;
+            if ($bloc["video_background"] != false) {
+                $addVideoBackground = true;
+            }
+
+            if ($bloc["selectedtype"] == "video") {
+
+                if ($addVideoBackground) {
+                    $background = $this->view->imageProcess()->imageProcessGetUrl($bloc["video_background"], '', 1200, null);
+                    $width = -1;
+                    $height = -1;
+                    CubeIT_Image::getDimensions($background, $width, $height);
+                    $res.= '<div class="detail-video-background" style="width:100%;background-position:50%;background-image:url(\'' . $background . '\');height:' . $height . 'px;">';
+                }
+
+                $res .= '<div class="detail-video" style="' . $margin . '" >';
+                $video = $this->view->videoWeb($bloc["video"], 980);
+                $res .= '<div>' . $video . '</div>';
+                $res .= '</div>';
+
+                if ($addVideoBackground) {
+                    $res.= "</div>";
+                }
+            }
+        }
+        $res .= '</div>';
+
+        return $res;
+    }
+
+}
+
+?>
diff --git a/framework/application/views/helpers/CasestudiesList.php b/framework/application/views/helpers/CasestudiesList.php
index 4a719e0..476dc10 100644
--- a/framework/application/views/helpers/CasestudiesList.php
+++ b/framework/application/views/helpers/CasestudiesList.php
@@ -2,14 +2,18 @@
 
 class Cubedesigners_View_Helper_CasestudiesList extends Zend_View_Helper_Abstract {
 
-    public function CasestudiesList($studies) {
+    public function CasestudiesList($datas) {
+
+        $db = Zend_Db_Table::getDefaultAdapter();
+        $s = $db->select()->from('casestudies')
+                ->order('id ASC');
+        $q = $s->query();
 
         $count = 1;
 
         $res = '';
 
-        foreach ($studies as $studie) {
-
+        while ($r = $q->fetch()) {
             $addSpacer = false;
 
             if ($count == 3) {
@@ -21,13 +25,15 @@ class Cubedesigners_View_Helper_CasestudiesList extends Zend_View_Helper_Abstrac
                 $count++;
             }
 
-            $image = $this->view->imageProcess($studie['visuel'], $studie['titre'], 300, 225);
-
-            $res .= '<div class="bloc' . $addClass . '" data-tags="' . $studie["tags"] . '">';
+            $image = $this->view->imageProcess($r->visuel, $r->titre, 300, 225);
+            $url = CubeIT_Navigation_Page::generateAutoUri($r, $datas['seourl_stu']);
+            $res .= '<a href="' . $url . '">';
+            $res .= '<div class="bloc' . $addClass . '" data-tags="' . $r->tags . '">';
             $res .= '<div class="project-photo">' . $image . '</div>';
-            $res .= '<div class="project-title">' . $studie["titre"] . '</div>';
-            $res .= '<div class="project-description">' . $studie["description"] . '</div>';
+            $res .= '<div class="project-title">' . $r->titre . '</div>';
+            $res .= '<div class="project-description">' . $r->description . '</div>';
             $res .= '</div>';
+            $res .= '</a>';
 
             // if ($addSpacer) {
             //    $res .= '<div class="spacer"></div>';
diff --git a/framework/application/views/helpers/CasestudiesTagsList.php b/framework/application/views/helpers/CasestudiesTagsList.php
index 1a19307..f130bf2 100644
--- a/framework/application/views/helpers/CasestudiesTagsList.php
+++ b/framework/application/views/helpers/CasestudiesTagsList.php
@@ -6,8 +6,13 @@ class Cubedesigners_View_Helper_CasestudiesTagsList extends Zend_View_Helper_Abs
 
         $tagslist = Array();
 
-        foreach ($studies as $studie) {
-            $temp = explode(',', $studie["tags"]);
+        $db0 = Zend_Db_Table::getDefaultAdapter();
+        $s0 = $db0->select()->from('casestudies')
+                ->order('id ASC');
+        $q0 = $s0->query();
+
+        while ($r0 = $q0->fetch()) {
+            $temp = explode(',', $r0->tags);
 
             for ($i = 0; $i < count($temp); $i++) {
                 if (!in_array($temp[$i], $tagslist)) {
diff --git a/framework/application/views/scripts/studies/index.phtml b/framework/application/views/scripts/studies/index.phtml
new file mode 100644
index 0000000..4e331c2
--- /dev/null
+++ b/framework/application/views/scripts/studies/index.phtml
@@ -0,0 +1,16 @@
+<?php
+$this->headScript()->addScriptAndStyle('casestudies');
+$this->headScript()->addScriptAndStyle('casestudies_detail');
+?>
+
+<div class="casestudies-detail-title"><?php echo $this->markupDotclear($this->titre); ?></div>
+
+<?php
+echo $this->CasestudiesDetail($this->studie);
+?>
+
+<div class="title"><?php echo $this->markupDotclear($this->casestudies_titre); ?></div>
+
+<div id="casestudies-list">
+    <?php echo $this->CasestudiesList($this->datas); ?>
+</div>
\ No newline at end of file
diff --git a/framework/application/views/scripts/templates/casestudies.phtml b/framework/application/views/scripts/templates/casestudies.phtml
index 86d27b8..f64145a 100644
--- a/framework/application/views/scripts/templates/casestudies.phtml
+++ b/framework/application/views/scripts/templates/casestudies.phtml
@@ -1,7 +1,5 @@
 <?php
 $this->headScript()->addScriptAndStyle('casestudies');
-
-fb($this->studies);
 ?>
 
 <div class="title"><?php echo $this->markupDotclear($this->titre); ?></div>
@@ -12,6 +10,9 @@ fb($this->studies);
 
 
 <div id="casestudies-list">
-    <?php echo $this->CasestudiesList($this->studies); ?>
+    <?php
+    $datas = Bootstrap::getInstance()->getCMSDatasOfPage($this->id);
+    echo $this->CasestudiesList($datas);
+    ?>
 </div>
 
diff --git a/js/admin.js b/js/admin.js
index 54dacd0..578e0d0 100644
--- a/js/admin.js
+++ b/js/admin.js
@@ -7,7 +7,7 @@ function load_admin() {
 function initSelectType() {
     $( "select[data-name='selected-type']" ).each( function() {
         var cible = $(this).parent().parent();
-        displayFormTypeElements( cible, 'text' );
+        displayFormTypeElements( cible, this.value );
     });
     
     $(document).on("change", "select[data-name='selected-type']", function() {
@@ -17,13 +17,14 @@ function initSelectType() {
 }
 
 function displayFormTypeElements( cible, choice ) {
-    
+
     switch ( choice ) {
         case 'text' :
             cible.children(".elementwrap-titre").css("display","block");
             cible.children(".elementwrap-texte").css("display","block");
             cible.children(".elementwrap-visuel").css("display","none");
             cible.children(".elementwrap-video").css("display","none");
+            cible.children(".elementwrap-video_background").css("display","none");
         break;
             
         case 'visuel' :
@@ -31,6 +32,7 @@ function displayFormTypeElements( cible, choice ) {
             cible.children(".elementwrap-texte").css("display","none");
             cible.children(".elementwrap-visuel").css("display","block");
             cible.children(".elementwrap-video").css("display","none");
+            cible.children(".elementwrap-video_background").css("display","none");
         break;
         
         case 'video' :
@@ -38,6 +40,7 @@ function displayFormTypeElements( cible, choice ) {
             cible.children(".elementwrap-texte").css("display","none");
             cible.children(".elementwrap-visuel").css("display","none");
             cible.children(".elementwrap-video").css("display","block");
+            cible.children(".elementwrap-video_background").css("display","block");
         break;
     }
     
diff --git a/less/casestudies.less b/less/casestudies.less
index 689846e..1c1dcb1 100644
--- a/less/casestudies.less
+++ b/less/casestudies.less
@@ -37,32 +37,47 @@
     margin: 0 auto;
     padding: 0 0 50px 0;
     overflow: hidden;
-}
-
-#casestudies-list .bloc {    
+    
+    .bloc {    
     width:300px;
     float:left;
 }
 
-#casestudies-list .bloc .project-photo {
+a,a:hover {    
+    color:#000;
+}
+
+.bloc .project-photo {
     width:300px;
     height:225px;
     background-color: #ccc;
     margin:0 0 20px 0;
 }
 
-#casestudies-list .bloc .project-title {
+.bloc .project-title {
     font-size: 32px;
 }
-#casestudies-list .bloc .project-description {
+ .bloc .project-description {
     font-size: 14px;
     margin-bottom: 20px;
 }
 
-#casestudies-list .blocmargin {
+.blocmargin {
     margin-right:40px;
 }
-#casestudies-list .spacer {
+.spacer {
     clear: left;
     height:20px;
+}
+
+}
+
+
+/*.casestudies-detail-visuel {
+    width: 1200px;
+    margin: auto;
+}
+*/
+#casestudies-detail-content {
+    background-color: #3885E0;
 }
\ No newline at end of file
diff --git a/less/casestudies_detail.less b/less/casestudies_detail.less
new file mode 100644
index 0000000..75d5cde
--- /dev/null
+++ b/less/casestudies_detail.less
@@ -0,0 +1,96 @@
+/* Case studies detail Title */
+.casestudies-detail-title {
+    min-width: 980px;
+    max-width: 980px;
+    width:100%;
+    margin: 0 auto;
+    padding: 50px 0px 50px 0;
+    font-size: 32px;
+}
+
+/* Case studies detail visuel */
+#casestudies-detail-visuel {
+    padding-bottom:50px;
+}
+
+#casestudies-detail-visuel a {
+    background-color: #3885e0;
+    border-radius: 2px;
+    padding: 5px 20px;
+    color:#fff;
+}
+
+#casestudies-detail-visuel a:hover,
+#casestudies-detail-visuel a:active {
+    background-color: #65a8f6;
+    color:#fff;
+}
+
+#casestudies-detail-visuel .visuel-holder {
+    min-width: 980px;
+    max-width: 980px;
+    width:100%;
+    margin: 0 auto;
+    overflow:hidden;
+}
+
+#casestudies-detail-visuel .visuel-holder .visuel {
+    width:980px;
+    height:400px;
+    padding-bottom: 20px;
+}
+
+
+#casestudies-detail-visuel .visuel-holder .legende {
+    font-size: 18px;
+    float:left;
+}
+
+#casestudies-detail-content {
+    text-align: center;
+    background-color: #0194d5;
+    padding: 50px 0 0px 0;
+}
+
+#casestudies-detail-content .detail-text {
+    color: #fff;
+    width:640px;
+    margin:auto;
+    //padding: 0px 0 50px 0;
+    position: relative;
+    z-index: 10;
+}
+
+#casestudies-detail-content .detail-text .titre {
+    font-size:32px;
+    padding-bottom: 20px;
+}
+
+#casestudies-detail-content .detail-text .texte {
+    font-size:18px;
+}
+
+#casestudies-detail-content .detail-visuel {
+    padding: 0px 0 50px 0;
+    z-index: 1;
+}
+
+#casestudies-detail-content .detail-video-background {
+    display: table;
+}
+
+
+#casestudies-detail-content .detail-video {
+    padding: 0px 0 50px 0;
+    position: relative;
+    z-index: 5;
+    text-align: center;
+    vertical-align: middle;
+    display: table-cell;
+}
+
+#casestudies-detail-content .detail-visuel {
+    width:100%;
+    background-position: 50%;
+    position: relative;
+}
\ No newline at end of file
-- 
2.39.5