#avid
    {
    background-image: url(../image/postprod/montage/outil/avid.png);
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    }
.fond_avid
    {
    background-color: #6E2A8D;
    }
.fond_avid .mdl-card__actions.mdl-card--border
    {
    border-top: 1px solid rgba(251, 250, 250, 0.1)!important;
    }
.fond_avid p, .fond_avid h2, .fond_avid .mdl-button
    {
    color: #FBFAFA!important;    
    }
#lightworks
    {
    background-image: url(../image/postprod/montage/outil/lightworks.png);
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    }
.fond_lightworks
    {
    background-color: #5D0000;
    }
.fond_lightworks .mdl-card__actions.mdl-card--border
    {
    border-top: 1px solid rgba(237, 238, 240, 0.1)!important;
    }
.fond_lightworks p, .fond_lightworks h2, .fond_lightworks .mdl-button
    {
    color: #EDEEF0!important;    
    }
#hiero
    {
    background-image: url(../image/postprod/montage/outil/hiero.png);
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    }
.fond_hiero
    {
    background-color: #000000;
    }
.fond_hiero .mdl-card__actions.mdl-card--border
    {
    border-top: 1px solid rgba(245, 179, 22, 0.1)!important;
    }
.fond_hiero p, .fond_hiero h2, .fond_hiero .mdl-button
    {
    color: #F5B316!important;    
    }
#smoke
    {
    background-image: url(../image/postprod/montage/outil/smoke.png);
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    }
.fond_smoke
    {
    background-color: #266362;
    }
.fond_smoke .mdl-card__actions.mdl-card--border
    {
    border-top: 1px solid rgba(237, 238, 240, 0.1)!important;
    }
.fond_smoke p, .fond_smoke h2, .fond_smoke .mdl-button
    {
    color: #EDEEF0!important;    
    }
#premierepro
    {
    background-image: url(../image/postprod/montage/outil/premiere_pro.svg);
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    }
.fond_premiere
    {
    background-color: #200027;
    }
.fond_premiere .mdl-card__actions.mdl-card--border
    {
    border-top: 1px solid rgba(229, 121, 255, 0.1)!important;
    }
.fond_premiere p, .fond_premiere h2, .fond_premiere .mdl-button
    {
    color: #E579FF!important;    
    }
#davinci
    {
    background-image: url(../image/postprod/montage/outil/davinci.png);
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    }
.fond_davinci
    {
    background-color: #B82858;
    }
.fond_davinci .mdl-card__actions.mdl-card--border
    {
    border-top: 1px solid rgba(255, 255, 255, 0.1)!important;
    }
.fond_davinci p, .fond_davinci h2, .fond_davinci .mdl-button
    {
    color: #FFFFFF!important;    
    }
#finalcut
    {
    background-image: url(../image/postprod/montage/outil/finalcut.png);
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    }
.fond_finalcut
    {
    background-color: #2D353B;
    }
.fond_finalcut .mdl-card__actions.mdl-card--border
    {
    border-top: 1px solid rgba(237, 245, 248, 0.1)!important;
    }
.fond_finalcut p, .fond_finalcut h2, .fond_finalcut .mdl-button
    {
    color: #EDF5F8!important;    
    }
#avs
    {
    background-image: url(../image/postprod/montage/outil/avs.png);
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    }
.fond_avs
    {
    background-color: #2D353B;
    }
.fond_avs .mdl-card__actions.mdl-card--border
    {
    border-top: 1px solid rgba(237, 245, 248, 0.1)!important;
    }
.fond_avs p, .fond_avs h2, .fond_avs .mdl-button
    {
    color: #EDF5F8!important;    
    }
#imovie
    {
    background-image: url(../image/postprod/montage/outil/imovie.png);
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    }
.fond_imovie
    {
    background-color: #2D353B;
    }
.fond_imovie .mdl-card__actions.mdl-card--border
    {
    border-top: 1px solid rgba(237, 245, 248, 0.1)!important;
    }
.fond_imovie p, .fond_imovie h2, .fond_imovie .mdl-button
    {
    color: #EDF5F8!important;    
    }
#pinnacle
    {
    background-image: url(../image/postprod/montage/outil/pinnacle.png);
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    }
.fond_pinnacle
    {
    background-color: #2D353B;
    }
.fond_pinnacle .mdl-card__actions.mdl-card--border
    {
    border-top: 1px solid rgba(237, 245, 248, 0.1)!important;
    }
.fond_pinnacle p, .fond_pinnacle h2, .fond_pinnacle .mdl-button
    {
    color: #EDF5F8!important;    
    }
#videostudio
    {
    background-image: url(../image/postprod/montage/outil/videostudio.png);
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    }
.fond_videostudio
    {
    background-color: #2D353B;
    }
.fond_videostudio .mdl-card__actions.mdl-card--border
    {
    border-top: 1px solid rgba(237, 245, 248, 0.1)!important;
    }
.fond_videostudio p, .fond_videostudio h2, .fond_videostudio .mdl-button
    {
    color: #EDF5F8!important;    
    }
#pitivi
    {
    background-image: url(../image/postprod/montage/outil/pitivi.png);
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    }
.fond_pitivi
    {
    background-color: #2D353B;
    }
.fond_pitivi .mdl-card__actions.mdl-card--border
    {
    border-top: 1px solid rgba(237, 245, 248, 0.1)!important;
    }
.fond_pitivi p, .fond_pitivi h2, .fond_pitivi .mdl-button
    {
    color: #EDF5F8!important;    
    }
#powerdirector
    {
    background-image: url(../image/postprod/montage/outil/powerdirector.png);
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    }
.fond_powerdirector
    {
    background-color: #2D353B;
    }
.fond_powerdirector .mdl-card__actions.mdl-card--border
    {
    border-top: 1px solid rgba(237, 245, 248, 0.1)!important;
    }
.fond_powerdirector p, .fond_powerdirector h2, .fond_powerdirector .mdl-button
    {
    color: #EDF5F8!important;    
    }
#premiereelement
    {
    background-image: url(../image/postprod/montage/outil/premiereelement.png);
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    }
.fond_premiereelement
    {
    background-color: #2D353B;
    }
.fond_premiereelement .mdl-card__actions.mdl-card--border
    {
    border-top: 1px solid rgba(237, 245, 248, 0.1)!important;
    }
.fond_premiereelement p, .fond_premiereelement h2, .fond_premiereelement .mdl-button
    {
    color: #EDF5F8!important;    
    }
#kdenlive
    {
    background-image: url(../image/postprod/montage/outil/kdenlive.png);
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    }
.fond_kdenlive
    {
    background-color: #2D353B;
    }
.fond_kdenlive .mdl-card__actions.mdl-card--border
    {
    border-top: 1px solid rgba(237, 245, 248, 0.1)!important;
    }
.fond_kdenlive p, .fond_kdenlive h2, .fond_kdenlive .mdl-button
    {
    color: #EDF5F8!important;    
    }
#moviemaker
    {
    background-image: url(../image/postprod/montage/outil/moviemaker.png);
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    }
.fond_moviemaker
    {
    background-color: #2D353B;
    }
.fond_moviemaker .mdl-card__actions.mdl-card--border
    {
    border-top: 1px solid rgba(237, 245, 248, 0.1)!important;
    }
.fond_moviemaker p, .fond_moviemaker h2, .fond_moviemaker .mdl-button
    {
    color: #EDF5F8!important;    
    }

#rgb_image .flex
    {
    justify-content: space-around;
    align-items: center;
    }

#rgb_image .flex div
    {
    height: 300px!important;
    width: 50%;
    padding: 10px;
    }

#rgb_image span
    {
    color: black!important;
    padding: 10px;
    font-size: 400%;
    }

#rgb_image
    {
    padding: 25px;    
    }

#rgb_image #top_bottom
    {
    padding-top: 30px;
    padding-bottom: 30px;
    }

#rgb_image #resultat
    {
    height: 300px;
    -webkit-filter: grayscale(100%);
	filter: grayscale(100%);
    transition: 1s;
    }
#rgb_image #resultat:hover
    {
    -webkit-filter: grayscale(0);
	filter: grayscale(0);
    transition: 1s;
    }

#rgb_image .vfx_border_total
    {
    border-width: 1px;    
    }

#r
    {
    background-image: url(../image/postprod/vfx/compositing/R.jpg);
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    transition: 1s;
    }
#r:hover
    {
    background-color: red;
    background-blend-mode: multiply;
    transition: 1s;
    }
#g
    {
    background-image: url(../image/postprod/vfx/compositing/G.jpg);
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    transition: 1s; 
    }
#g:hover
    {
    background-color: green;
    background-blend-mode: multiply;
    transition: 1s;  
    }

#b
    {
    background-image: url(../image/postprod/vfx/compositing/B.jpg);
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    transition: 1s; 
    }
#b:hover
    {
    background-color: blue;
    background-blend-mode: multiply;
    transition: 1s;  
    }

#paint_color
    {
    background-image: url(../image/postprod/vfx/compositing/paint_rgb.jpg);
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    transition: 1s; 
    }

#paint_alpha
    {
    background-image: url(../image/postprod/vfx/compositing/paint_alpha.jpg);
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    transition: 1s; 
    }

#paint_rgba
    {
    width: 30%;
    height: auto;
    }

#test_rgb
    {
    background-image: url(../image/postprod/vfx/compositing/robot_all.jpg);
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    transition: 1s; 
    }

#test_diff_direct
    {
    background-image: url(../image/postprod/vfx/compositing/robot_direct_diffuse.jpg);
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    transition: 1s; 
    }

#test_diff_indirect
    {
    background-image: url(../image/postprod/vfx/compositing/robot_indirect_diffuse.jpg);
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    transition: 1s; 
    }

#test_relf_direct
    {
    background-image: url(../image/postprod/vfx/compositing/robot_direct_specular.jpg);
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    transition: 1s; 
    }

#test_relf_indirect
    {
    background-image: url(../image/postprod/vfx/compositing/robot_indirect_specular.jpg);
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    transition: 1s; 
    }

#test_refr
    {
    background-image: url(../image/postprod/vfx/compositing/robot_refraction.jpg);
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    transition: 1s; 
    }

article table
    {
    padding: 50px!important;
    }

article table img
    {
    cursor: pointer;
    margin: 20px;
    }

article table h4
    {
    margin-left: 25px!important;
    }


.versus
    {
    width: 100%;    
    }

.versus #ligne_versus
    {
    height: 600px;    
    }

.versus .versus_gauche, .versus .versus_droite, .versus .versus_centre
    {
    width: 33%;   
    }
        
.versus .blockquote_center
    {
    margin: auto;
    width: 80%;
    }

article iframe :not(.youtube_margin)
    {
    padding: 10px;
    border-width: 1px;
    }



#mocha
    {
    background-image: url(../image/postprod/vfx/compositing/tracker/mocha.png);
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    }
.fond_mocha
    {
    background-color: #734524;
    }
.fond_mocha .mdl-card__actions.mdl-card--border
    {
    border-top: 1px solid rgba(255, 255, 255, 0.1)!important;
    }
.fond_mocha p, .fond_mocha h2, .fond_mocha .mdl-button
    {
    color: #FFFFFF!important;    
    }

#boujou
    {
    background-image: url(../image/postprod/vfx/compositing/tracker/boujou.png);
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    }
.fond_boujou
    {
    background-color: #2490CB;
    }
.fond_boujou .mdl-card__actions.mdl-card--border
    {
    border-top: 1px solid rgba(255, 255, 255, 0.1)!important;
    }
.fond_boujou p, .fond_boujou h2, .fond_boujou .mdl-button
    {
    color: #FFFFFF!important;    
    }


#syntheyes
    {
    background-image: url(../image/postprod/vfx/compositing/tracker/syntheyes.png);
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    }
.fond_syntheyes
    {
    background-color: #322D2D;
    }
.fond_syntheyes .mdl-card__actions.mdl-card--border
    {
    border-top: 1px solid rgba(223, 46, 18, 0.1)!important;
    }
.fond_syntheyes p, .fond_syntheyes h2, .fond_syntheyes .mdl-button
    {
    color: #DF2E12!important;    
    }


#voodoo
    {
    background-image: url(../image/postprod/vfx/compositing/tracker/voodoo.png);
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    }
.fond_voodoo
    {
    background-color: #ffffff;
    }
.fond_voodoo .mdl-card__actions.mdl-card--border
    {
    border-top: 1px solid rgba(250, 250, 250, 0.1)!important;
    }
.fond_voodoo p, .fond_voodoo h2, .fond_voodoo .mdl-button
    {
    color: #FFCC00!important;    
    }


#matchmover
    {
    background-image: url(../image/postprod/vfx/compositing/tracker/matchmover.png);
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    }
.fond_matchmover
    {
    background-color: #052425;
    }
.fond_matchmover .mdl-card__actions.mdl-card--border
    {
    border-top: 1px solid rgba(77, 154, 153, 0.1)!important;
    }
.fond_matchmover p, .fond_matchmover h2, .fond_matchmover .mdl-button
    {
    color: #4D9A99!important;    
    }


#pftrack
    {
    background-image: url(../image/postprod/vfx/compositing/tracker/pftrack.png);
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    }
.fond_pftrack
    {
    background-color: #1A1A1A;
    }
.fond_pftrack .mdl-card__actions.mdl-card--border
    {
    border-top: 1px solid rgba(94, 176, 230, 0.1)!important;
    }
.fond_pftrack p, .fond_pftrack h2, .fond_pftrack .mdl-button
    {
    color: #5EB0E6!important;    
    }

.roto_video
    {
    width: 150%;
    height: auto;
    background-color: black;
    }