@media only screen and (min-width: 0px){
	div.container-introduction {background-image: url('../../img/casestudies/dotcity/img-stage-mobile.jpg');}
    section .image-separateur {background-image: url('../../img/casestudies/dotcity/img-separator-01-mobile.jpg');}
    section .image-separateur.num2 {background-image: url('../../img/casestudies/dotcity/img-separator-02-mobile.jpg');}
    section.iconographie p, section.event p {margin:auto}
    section.iconographie { background:#bd350f; overflow: hidden}
    section.logo-case { overflow: hidden}
    section.iconographie .first-icon img {max-width: 100%; margin-top: 5%; float: none;}
    section.logo-case img {max-width: 100%; margin-top: 5%;}
    .grid-black-white .image-cta.img01 {background-image: url('../../img/casestudies/dotcity/img-grid-01.png');}
    .grid-black-white .image-cta.img02 {background-image: url('../../img/casestudies/dotcity/img-grid-02.png');}
    .grid-black-white .image-cta.img03 {background-image: url('../../img/casestudies/dotcity/img-grid-03.png');}
    .grid-black-white .image-cta.img04 {background-image: url('../../img/casestudies/dotcity/img-grid-04.png');}
    .grid-black-white .image-cta.open { background-position: center center!important;}
    .grid-black-white .image-cta { background-size: 80%!important;}
    .grid.grid-small.grid-black-white {margin-top: 7.5%}
    .dotcitymap{width: 100%;height: 400px; max-height: 864px; background-image: url(../../img/casestudies/dotcity/dotcity-map.jpg); background-size: cover; background-repeat: no-repeat; position: absolute; position: relative;  box-sizing: border-box;}
    .block-map{  background-color:rgba(255, 255, 255, 0.75); bottom: 0px; width: 100%; height: auto; position: absolute; padding-bottom:20px;}
    .block-map h3{text-align: left; margin-left: 35px; padding-top: 42px;}
    .block-map hr{text-align: left; margin: 10px 35px 15px; }
    .block-map p{text-align: left; width: 76%; margin-left: 35px; line-height: 18px;}
    section.event img {width: 100%;margin-top: 7.5%}
    section.event:after {content:"";padding-top: 5%;display: block;width: 100%}
}


@media only screen and (min-width: 440px){
	div.container-introduction { background-image: url('../../img/casestudies/dotcity/img-stage-tablet.jpg');} 
    section .image-separateur {background-image: url('../../img/casestudies/dotcity/img-separator-01-tablet.jpg');}
    section .image-separateur.num2 {background-image: url('../../img/casestudies/dotcity/img-separator-02-tablet.jpg');}
    .dotcitymap{height: 420px;background-image: url(../../img/casestudies/dotcity/dotcity-map.jpg);padding: 35px 35px 35px 42%;}
    .block-map{right: 35px; top: 70px; width: 300px; height: 300px;  padding-bottom:0;}
    .block-map h3{margin-left: 25px; }
    .block-map hr{margin: 10px 25px 15px; }
    .block-map p{width: 85%; margin-left: 25px;}
    section.event img {width: 90%}
}


@media only screen and (min-width: 700px){
	div.container-introduction { background-image: url('../../img/casestudies/dotcity/img-stage-laptop.jpg');}
    section .image-separateur {background-image: url('../../img/casestudies/dotcity/img-separator-01-laptop.jpg');}
    section .image-separateur.num2 {background-image: url('../../img/casestudies/dotcity/img-separator-02-laptop.jpg');}    
    section.logo-case img {max-width: 50%; margin-top: 5%;}
    .dotcitymap { height: 420px;}
    .block-map {right: 60px; top: 64px; width: 319px; height: 315px;}
    section.event img {width: 47.5%; margin-right: 2%}
    section.event img.last2 {margin-right: 0%; margin-left: 2%}
}


@media only screen and (min-width: 1000px){
    .dotcitymap{height: 600px;background-image: url(../../img/casestudies/dotcity/dotcity-map.jpg);}
    .block-map {top: 94px; width: 405px; height: 420px;}   
    .block-map h3 { padding-top: 50px;}
    .block-map hr {margin: 16px 25px 36px;}
    .block-map p { line-height: 25px; width: 330px;}
}


@media only screen and (min-width: 1200px){
    div.container-introduction { background-image: url('../../img/casestudies/dotcity/img-stage.jpg');} 
    section .image-separateur {background-image: url('../../img/casestudies/dotcity/img-separator-01.jpg');}
    section .image-separateur.num2 {background-image: url('../../img/casestudies/dotcity/img-separator-02.jpg');}
    .dotcitymap{height:864px;background-image: url(../../img/casestudies/dotcity/dotcity-map.jpg);}
    .block-map { right: 80px; top: 123px; width: 700px; height: 625px;}
    .block-map h3 {margin-left: 83px;}
    .block-map hr {margin: 39px 83px 87px;}
    .block-map p {margin-left: 83px; width: 520px;}
    section.event img {width: 29.5%; margin-right: 2.7%}
    section.event img.last2 {margin-right: 2.7%; margin-left: 2.7%}
    section.event img.last {margin-right: 0%; margin-left: 2.7%}
}	

@media only screen and (min-width: 1500px){	
    section.logo-case img {max-width: 100%; margin-top: 5%;}
    .block-map {right: 100px; width:800px; }
}