@font-face 
{
    font-family: "parisienne";
    src: url("../fonts/parisienne-regular.ttf") format("truetype");
    font-weight: normal;
}
@font-face 
{
    font-family: "montserrat";
    src: url("../fonts/montserrat-regular.ttf") format("truetype");
    font-weight: normal;
}
@font-face 
{
    font-family: "montserrat";
    src: url("../fonts/montserrat-bold.ttf") format("truetype");
    font-weight: bold;
}
#ergonomie-et-communication-typographie .logo1, #ergonomie-et-communication-typographie .logo2, #ergonomie-et-communication-typographie .logo3, #ergonomie-et-communication-typographie .logo4, #ergonomie-et-communication-typographie .logo5
{
    white-space: nowrap;
}
#ergonomie-et-communication-typographie .logo1
{
    padding: 0.5em 0 0;
    position: relative;
    font-family : montserrat;
    font-size: 5em;
}
#ergonomie-et-communication-typographie .logo1 .cvm span
{
    position: absolute;
    font-size: 0.6em;
    color : #22aed3;
}
#ergonomie-et-communication-typographie .logo1 .cvm span:first-of-type
{
    left: 0.85em;
    top: 0.33em;
    transform: rotate3d(0, 0, 1, -15deg);
}
#ergonomie-et-communication-typographie .logo1 .cvm span:nth-of-type(2)
{
    left: 1.34em;
    top: 0.35em;
    transform: rotate3d(0, 0, 1, -33deg);
}
#ergonomie-et-communication-typographie .logo1 .cvm span:nth-of-type(3)
{
    top: 0.633em;
    left: 2.24em;
    transform: rotate3d(0, 0, 1, 24deg);
}
#ergonomie-et-communication-typographie .logo1 .devBe
{
    display: block;
    color : rgb(48, 67, 104);
    text-transform: uppercase;
}
#ergonomie-et-communication-typographie .logo1 .devBe .devBe-d
{
    margin-right: -0.15em;
    display: inline-block;
    transform: scale3d(-1, 1, 1);
}
#ergonomie-et-communication-typographie .logo1 .devBe .devBe-v
{
    margin-left: -0.11em;
}
#ergonomie-et-communication-typographie .logo1 .devBe span:last-of-type
{
    margin-left: -0.45em;
    text-transform: none;
    font-size: 0.5em;
    color: #22aed3;
}
#ergonomie-et-communication-typographie .logo2
{
    max-height: 1.6em;
    font-size: 5em;
    color : rgb(48, 67, 104);
}
#ergonomie-et-communication-typographie .logo2 .cvm-c
{
    font-family : parisienne;
    font-size : 1.5em;
    color : #22aed3;
    text-shadow : 5.67pt 5.67pt 0pt rgba(34, 174, 211, 0.15);
}
#ergonomie-et-communication-typographie .logo2 .cvm-vm
{
    position: relative;
    bottom: 0.35em;
    font-family : montserrat;
    font-size: 0.45em;
    font-weight: bold;
}
#ergonomie-et-communication-typographie .logo3
{
    font-family : montserrat;
    font-size: 5em;
    color : rgb(48, 67, 104);
}
#ergonomie-et-communication-typographie .logo3 .cvm
{
    font-size : 0.7em;
    color : #22aed3;
}
#ergonomie-et-communication-typographie .logo3 .dev
{
    font-weight: bold;
}
#ergonomie-et-communication-typographie .logo3 .be
{
    font-size : 0.65em;
}
#ergonomie-et-communication-typographie .logo4
{
    font-family : montserrat;
    font-size: 5em;
    color : rgb(48, 67, 104);
}
#ergonomie-et-communication-typographie .logo4 .cvm-c
{
    margin-right: -0.1em;
    font-size : 1.75em;
}
#ergonomie-et-communication-typographie .logo4 .cvm-vm
{
    font-size : 0.7em;
}
#ergonomie-et-communication-typographie .logo4 .dev
{
    position: relative;
    top: -0.68em;
    right: 0.14em;
}
#ergonomie-et-communication-typographie .logo4 .dev .dev-e
{
    display: inline-block;
    transform: scale3d(-1, 1, 1);
}
#ergonomie-et-communication-typographie .logo4 .be
{
    position: relative;
    right: 1.85em;
}
#ergonomie-et-communication-typographie .logo5
{
    padding: 1.5em 0 1.5em 3.5em;
    position: relative;
    font-family : montserrat;
    font-size: 2em;
    color : rgb(48, 67, 104);
}
#ergonomie-et-communication-typographie .logo5 .christophe, #ergonomie-et-communication-typographie .logo5 .vanmaercke, #ergonomie-et-communication-typographie .logo5 .vanmaercke span
{
    display: block;
    line-height: 1.2em;
}
#ergonomie-et-communication-typographie .logo5 .christophe, #ergonomie-et-communication-typographie .vanmaercke::first-letter
{
    margin-left: 0.1em;
}
#ergonomie-et-communication-typographie .logo5 .christophe::first-letter, #ergonomie-et-communication-typographie .logo5 .vanmaercke::first-letter, #ergonomie-et-communication-typographie .logo5 .vanmaercke span::first-letter
{
    font-size: 1.2em;
    font-weight: bold;
    color : #22aed3;
}
#ergonomie-et-communication-typographie .logo5 .devBe
{
    position: absolute;
    bottom: -1em;
    left: -0.33em;
    font-weight: bold;
    text-transform: uppercase;
}
#ergonomie-et-communication-typographie .logo5 .devBe::first-letter
{
    margin-right: -0.06em;
    font-size: 6.2em;
    font-weight: normal;
    text-transform: none;
}
#ergonomie-et-communication-typographie .logo5 .devBe .be
{
    font-size: 0.5em;
    color : #22aed3;
    text-transform: none;
}
#ergonomie-et-communication-typographie .logo6 .cvm span
{
    font-size: 1.9em;
    color : #22aed3;
    display: block;
    line-height: 0;
}
#ergonomie-et-communication-typographie .logo6 .cvm span:nth-of-type(1)
{
    margin-left: 0.06em;
    margin-bottom: 0.85em;
}
#ergonomie-et-communication-typographie .logo6 .cvm span:nth-of-type(2)
{
    margin-left: 0.1em;
    margin-bottom: 0.7em;
    font-size: 1.85em;
}
#ergonomie-et-communication-typographie .logo6 .cvm span:nth-of-type(3)
{
    margin-left: 0.025em;
    margin-bottom: 0.5em;
    font-size: 1.7em;
}
#ergonomie-et-communication-typographie .logo6 .devBe
{
    bottom: -1em;
    left: -0.8em;
}
#ergonomie-et-communication-typographie .logo6 .devBe::first-letter
{
    margin-right: -0.058em;
    font-size: 7.1em;
}
#ergonomie-et-communication-typographie .logo6 .devBe .be
{
    font-size: 1em;
    font-weight: normal;
}
#ergonomie-et-communication-typographie img
{
    max-width: 600px;
}
#ergonomie-et-communication-images .meduse-container
{
    max-width: 700px;
    background-image: url("../images/ergonomie-et-communication-web/meduse.jpg");
    background-size: cover;
}
#ergonomie-et-communication-images .meduse-content
{
    position: relative;
    margin-left: auto;
    padding: 1em 1em 1em 2em;
    max-width: 50%;
    color: rgb(238, 227, 226);
    background-color: rgba(14, 57, 83, 0.5);
}
#ergonomie-et-communication-images .meduse-content:before
{
    position: absolute;
    content: "";
    top: 0;
    left: -64px;
    height: 100%;
    width: 64px;
    background-image: url("../images/ergonomie-et-communication-web/meduse-cadre-texte.png");
    background-size: 64px 100%;
    background-repeat: no-repeat;
    opacity: 0.5;
}
@media (max-width: 500px)
{
    #ergonomie-et-communication-images .meduse-content
    {
        max-width: 100%;
    }
    #ergonomie-et-communication-images .meduse-content:before
    {
        margin: 0;
        padding: 1em;
        display: none;
    }   
}