/* typographie */
body{
	background-image: url('../images/paris.jpg');
  background-repeat: no-repeat;
  -webkit-background-size: cover;
  background-size: cover;
  background-attachment: fixed;
	color:#000;
	font-family:'Roboto', Arial, Helvetica, sans-serif; 
	font-size:1em;
	line-height:1.4em; 
	font-weight:normal;
}
h1, h2, h3, h4, h5, h6{
	font-weight:400;
	font-family:'Oswald', Arial, Helvetica, sans-serif; 
	line-height:1.5em;
	margin:.45em 0;
	padding:0;
  font-weight: bold;
} 

/* Liens */
a,
a:visited,
a:active,
a:hover{color:#000;}
a:hover{ text-decoration:none;}


/* taille box */
*{	box-sizing:border-box;
	-moz-box-sizing:border-box;}
  
/* navigation */ 

/* Animation du lien */
.animation-menu a:after,
.animation-menu a:after {
  content: "";
  position: absolute;
  bottom: 0; right: 20px; left: 20px;
  height: 2px;
  background-color: #9C0000;

  /* Préparation de notre animation */
  opacity: 0;
  transform: translateY(5px);
  transition: all .4s;
}
/* Le trait va remonter et apparaitre */
.animation-menu a.active:hover:after,
.animation-menu a.active:focus:after,
.animation-menu a.active:after,
.animation-menu a.active:after {
  opacity: .6;
  transform: translateY(0);
}
/* Je vire outline car juste au-dessus je définis un style :focus */
.animation-menu a:focus,
.animation-menu a:focus  {
  outline: none;
}

/* structure */
.bouton-info{
  text-align: center;
  height: 25px;
}

.bouton-info a{
  background-color: rgba(19, 78, 120, 0.26);
  color: rgba(255, 255, 255, 0.8);
  font-weight: bold;
  font-size: 1.3em;
  text-decoration: none;
  padding: 0.6em 1em 0.6em 1em;
  border-radius: 1px;
}
.bouton-info a:hover{
  font-size: 1.5em;
  transition: 0.6s all ease;
  color: rgba(255, 255, 255, 1);
  background-color: rgba(19, 78, 120, 0.5);
}

.bouton-info-plus{
  margin-top: 5em;
  margin-bottom: 1em;
  height: 25px;
}

.bouton-info-plus a{
  background-color: rgba(19, 78, 120, 1);
  color: rgba(255, 255, 255, 1);
  font-weight: bold;
  font-size: 1.5em;
  text-decoration: none;
  padding: 0.6em 1em 0.6em 1em;
  border-radius: 1px;
}
.bouton-info-plus a:hover{
  font-size: 1.8em;
  transition: 0.6s all ease;
  color: rgba(255, 255, 255, 1);
  background-color: rgba(19, 78, 120, 0.5);
}

.langchang{
  float: right;
  height: 70px;
  top:22%;
  width: 5em
}
.langchang a{
    display: inline-block!important;
    width: 1.3em;
    margin-right: 10px;
    float: left;
    top: 1.5em!important;
}
.langchang a:hover{
  transition: all 0.5s ease;
   opacity: 0.7;
}
.langchang img{
  width: 100%;
}

.langresp{
  margin-right: 5%;
  margin-top: 20px;
}

.forcelang{
  margin: 0 0 0 0!important; 
}
.srt-menu{
  position: fixed!important;
  right: 0px;
  height: 80px;
  transition: all .5s ease;
  font-weight: bold;
  font-size: larger;
}

.srt-menu li{
  right: 10px;
  top:25%;
}

.ajoutsrtmenu{
  background-color: #F8F8F8;
}

.petit-logo{
  float: left;
  overflow: hidden;
  padding-left: 30px;
  padding-top: 10px;
  opacity: 0;
  transition: all .5s ease;
}

.ajoutlogo{
  opacity: 1!important;
}

.wrapper{
	width: 92%; 
	margin: 0 auto;
}
#banner{ 
	text-align:center;
}	
#accueil{
  padding:0;
}
#page-header{
	padding:20px 0;
	font-size:1.1em;
	background: #FFF; /* For browsers that do not support gradients */
  	background: -webkit-radial-gradient(rgba(255,255,255,1),rgba(255,255,255,0)); /* Safari 5.1 to 6.0 */
	background: -o-radial-gradient(rgba(255,255,255,1),rgba(255,255,255,0)); /* For Opera 11.6 to 12.0 */
	background: -moz-radial-gradient(rgba(255,255,255,1),rgba(255,255,255,0)); /* For Firefox 3.6 to 15 */
	background: radial-gradient(rgba(255,255,255,1),rgba(255,255,255,0)); /* Standard syntax */
}
#accueil{
	height: 100vh;
}

#page-header h1{
	margin:0;
}
.flexslider{
	display:block;
}
#content,
aside,
.vertical-padding{  
	padding:40px 0;
}
.vertical-padding-2{  
  padding:80px 0;
}

p{ margin:0 0 1.5em;}

.image-first{
  float: left;
  padding-left: 45px;
}

.indicator{
  font-weight: bold;
  font-size: 1.2em;
  color: #9C0000;
}

.indicator-2{
  font-weight: bold;
  font-size: 1.2em;
  color: #9C0000;
}


.petit-text-italic{
  font-size: .7em;
  font-weight: bold;
  font-style: italic;
  color: #525252;
}
.petit-text-italic2{
  font-size: .77em;
  font-weight: bold;
  font-style: italic;
  color: #525252;
}

.image-paragraphe{
  margin-bottom: 15px;
  padding-top: 40px;
}

.copyright{
  margin-top: 46%;
  text-align: center;
  font-size: 75%;
}
.text-info{
  font-size: 85%;
}

.petit-font{
  font-size: 0.8em;
}


.text-competence{
  line-height: 2;
}
button {
    background-color: transparent;;
    border: transparent;
    color: #9c0000;
    text-decoration: none;
    font-size: 14px;
    padding: 0px!important;
}

button:hover{
  opacity: 0.5;
}

/* RESPONSIVE IMAGES  */
img{ max-width:100%; height:auto;}


/* MENU*/

#fonctionnalite-section-1{
  height: 92vh;
}
#presentation h1{
  margin-top: 70px;
  margin-bottom: 20px;
}
#presentation .separateur-2{
  background-color: #FFF;
}
#expertise{
  padding-top: 60px;
}

#conseil{
  margin-bottom: 100px;
  padding-top: 60px;
}
#commissariat{
  padding-top: 60px;
}
#clients{
  width: 100%;
  padding-top: 60px;
}

#clients .separateur-2{
  background-color: #FFF;
}

.top-menu{
	background-color: none!important;
}
.menu-toggle{
	display:block;
	padding:5px 20px 20px 20px;
	cursor:pointer;
  background-image: url(../images/menu.png);
  background-repeat: no-repeat;
  background-position-x: 97%;
  background-position-y: 10px;
  background-size: 50px;
  margin-right: 2%;
  height: 70px;
  position: fixed;
  width: 100%;
  z-index: 100;
  top: 0px
}
.menu-toggle:hover{
  background-image: url(../images/menu2.png);
  transition: all 0.5s ease;
}
.ajoutmenutoggle{
  background-color: #F8F8F8;
}

.menu-toggle.toggled-on{
}

.srt-menu{
	display:none;
}

.srt-menu{
	margin-bottom:60px;
	
}
.srt-menu li a {
	display:block;
	padding:10px;
	text-decoration:none;
	font-size:.8em;
}
.srt-menu li a:hover{
	color:#9c0000;
}

.srt-menu.toggled-on{
  display:block;
  position:relative;
  z-index:10;
  top: 70px;
  margin-bottom:60px;
  width: 258px;
}

.srt-menu.toggled-on li{
  background-color: #F8F8F8;
}
.srt-menu.toggled-on li a {
  display:block;
  padding:10px;
  text-decoration:none;
  font-size:.8em;
}
.srt-menu.toggled-on li a:hover{
  background-color: #d8d8d8;
}

.separateur{
  background-color: #9C0000;
  width: 200px;
  height: 10px;
  display: block;
}
.separateur-2{
  background-color: #9C0000;
  width: 120px;
  height: 7px;
  display: block;
  margin-top: 35px;
}
.separateur-3{
  background-color: #000;
  width: 120px;
  height: 7px;
  display: block;
  margin-top: 35px;
  margin-bottom: 35px;
}
.tittle-1{
  color: #000;
  font-size:1.8em;
  font-weight: bold;
  line-height: 45px;
}
.tittle-1-2{
  color: #000;
  font-size:1.4em;
  font-weight: 100;
  line-height: 35px;
}

.tittle-2{
  color: #000;
  font-size:1.2em;
  font-weight: bold;
  line-height: 35px;
}
.tittle-fonct{
  color: #134e78;
  font-size:4.5em;
  font-weight: bold;
  line-height: 70px;
}

.font-large{
  font-weight: bold;
}


/*2eme MENU*/
#secondary-navigation{
	margin-bottom:60px;
}
#secondary-navigation ul{
	margin:0;
	padding:0;
}
#secondary-navigation ul li a{ 
	background:#E6E6E6;
	color:#666;
	display:block;
	margin:5px 0; 
	padding:10px;
	text-decoration:none;
}
#secondary-navigation ul li a:hover,
#secondary-navigation ul li.current a{
	background:#5ec79e;
	color:#fff;
}

/* Taille des blocs*/
.grid_1,
.grid_2,
.grid_3,
.grid_4,
.grid_5,
.grid_6,
.grid_7,
.grid_8,
.grid_9,
.grid_10,
.grid_11,
.grid_12 {
	margin-bottom:40px;
	position: relative;
    min-height: 1px;
    padding-left: 15px;
    padding-right: 15px;
}

.modif-grid4{
  position: relative;
  float: left;
  width: 33.33333333%; 
  margin-top: 15vw;
  margin-left: 8vw;
}
.modif-grid4 img{
  max-width: 115%;
}

.modif-fonct-grid4{
  float: none;
  width: 90%; 
  transform: translateX(8%) translateY(25%);
}

.big-bloc{
  line-height: 1em;
}
.text-secteur{
  text-align: left;
  width: 55%;
  margin: 60px auto 0 auto;
  line-height: 1.1em;
}

/*FOOTER*/

.disp-image{
  display: none;
}

.phone{
    font-size: 1.2em;
    font-weight: bold;
    margin-top: 1em;
    margin-bottom: 1em;
    color: #9c0000;
}

#contact{
  font-size: 0.9em;
  line-height: 1em;
}

#contact-section{
  padding-top: 3em;
}

#contact-section a {
  text-decoration: none;
  color: #9c0000;
  font-weight: bold;
}

#contact-section a:hover{
  color: #b14a4a;
}

#contact-section img{
    width: 25%;
    position: relative;
    float: left;
    margin: 4em 4em 4em 2em;
    border-radius: 75px;
}


.contact-lien{
  margin-bottom: 4em;
  margin-top: 4em;
}

.lienbouton{
  font-size: 2em;
  background-color: rgba(0, 0, 0, 0.26);
  padding: 0.6em 1em 0.6em 1em;
}

.lienbouton:hover{
  transition: 0.8s all ease;
  font-size: 2.2em;
  background-color: rgba(0, 0, 0, 0.50);
}

.titre-sombre{
  color: #000;
}
.text-footer{
  font-size: 1.1em;
    color: #383838;
    font-weight: bold;
    position: relative;
    float: left;
}
.image-paralax{
  position: fixed;
    top:20%;
  right: 2%;
  width: 55%;

}

.image-paralax img{
  position: relative;
  left:0;
  display: inline-block;
  transition: all 1.8s ease;
}
.image-paralax img.slideRight{
  left:8000px;
}

.fonction-name{
  min-height: 10em;
  font-size: 1.2em;
  line-height: 1.5em;
}
.fonction-name ul{
  color: #444444;

}

/*responsive image transition*/
@media only screen and (min-width: 1450px) {

    .image-paralax{
      position: fixed;
        top:20%;
      right: 2%;
      width: 55%;

    }

    .image-paralax img{
      position: relative;
      left:0;
      display: inline-block;
      transition: all 1.8s ease;
    }
    .image-paralax img.slideRight{
      left:8000px;
    }


}


@media only screen and (max-width: 919px) {

.image-paralax{
  display: none;

}

.image-paralax img{
  position: relative;
  left:0;
  transition:none;
}
.image-paralax img.slideRight{
  left:0px;
}

.modif-grid4{
        width: 90%;
      }

.ajoutsrtmenu{
  background-color: transparent;
}


.animation-menu a:after {
  display: none;

  /* Préparation de notre animation */
  opacity: 0;
}
/* Le trait va remonter et apparaitre */
.animation-menu a:hover:after,
.animation-menu a:focus:after,
.animation-menu a.active:after,
.animation-menu a.active:after {
  opacity: 0;
}
/* Je vire outline car juste au-dessus je définis un style :focus */
.animation-menu a:focus {
  outline: none;
}


.logosrt{
  display: none;
}

#flag{
  display: none;
}

}

@media only screen and (max-width: 850px) {

  .image-paralax{
    position: absolute;
    top:85%;
  right: 28%;
  width: 45%;
  display: none;
  }

}

@media only screen and (max-width: 650px) {

  .image-paralax{
    position: absolute;
    top: 92%;
    right: 25%;
    width: 50%;
    display: block;
  }
  .tittle-fonct{
    font-size:3em;
    line-height: 70px;
  }

  #contact-section img{
  width: 70%;
    position: relative;
    float: left;
    margin: 0em 10em 2em 0em;
}


}
@media only screen and (max-width: 550px) {

  .image-paralax{
    position: absolute;
    top: 90%;
    right: 17%;
    width: 60%;
    display: block;
  }

  .text-secteur{
  width: 90%;
}

}

@media only screen and (max-width: 450px) {

  .image-paralax{
    position: absolute;
      top:80%;
    right: 0%;
    width: 100%;
    display: block;
  }

  .bouton-info a{
   margin-left:0%;
  }
  .lienbouton{
  font-size: 1.7em;
  }

  .lienbouton:hover{
    font-size: 2em;
  }

    .bouton-info-plus a{
    font-size: 1.2em;
  }
  .bouton-info-plus a:hover{
    font-size: 1.5em;
  }

  .tittle-fonct{
    font-size:2.5em;
    line-height: 60px;
  }

}

@media only screen and (max-width: 380px) {

        .lienbouton{
          font-size: 1.5em;
          }

          .lienbouton:hover{
            font-size: 1.7em;
          }
          .bouton-info-plus a{
            font-size: 1em;
          }
          .bouton-info-plus a:hover{
            font-size: 1.2em;
          }
          .tittle-fonct{
            font-size:1.9em;
            line-height: 50px;
          }

  }

@media only screen and (max-width: 321px) {

        .langchang{
          width: 2em
        }

        .langresp{
          margin-right: 17%;
          margin-top: 8px;
        }
        .petit-logo{
          padding: 0px;
          width: 62%;
        }
        .lienbouton{
          font-size: 1.1em;
          }

          .lienbouton:hover{
            font-size: 1.3em;
          }
          .bouton-info a{
            font-size: 1em;
          }
          .bouton-info a:hover{
            font-size: 1.2em;
          }

  }

@media only screen and (max-width: 300px) {

  .image-paralax{
    position: absolute;
      top:85%;
    right: 0%;
    width: 100%;
  }

    

}


/* Contain floats*/ 
.clearfix:before,
.clearfix:after,
.row:before,
.row:after {
  content: " ";
  display: table;
}
.clearfix:after,
.container:after,
.row:after{
  clear: both;
}



/****************************************
*****************************************
MEDIAQUERIES
*****************************************
****************************************/



/*LARGEUR MOBILE*/

@media only screen and (min-width: 481px) {
#banner{
	float:left;
	text-align:left;
	margin-bottom:-20px;
}
.menu-toggle{
	float:right;
}

} 

/*TABLET & SMALLER LAPTOPS*/

@media only screen and (min-width: 920px) {
.petit-logo{
  padding-top: 5px;
}
.top-menu{
	background-color: none;
}
.wrapper{
	max-width: 1200px; 
	margin: .75em auto;
}
header{
	padding:0;
}
#banner{ 
	float:left; 
	text-align:left;
	margin-bottom:0px;
	margin-top:5px;
}
#accueil{
	padding:0;
}


#content {  
	float:left;
	width:85%;
}
#content.wide-content{
	float:none;
	width:100%;
}

aside { 
	float:right;
	width:30%;
}

/*** Menu ***/
.menu-toggle{display:none;}
#menu-main-navigation{
  display:block;
  width: 100%;
  z-index: 999;
}
.srt-menu, .srt-menu * {
	margin:			0;
	list-style:		none;
}
.srt-menu ul {
	display:inline;
  height: 70px;
	width: 60%;
  line-height: 0em;
  float: right;
  top: 22%;
}
.srt-menu li:hover {
	visibility:		inherit;
}
.srt-menu li {
	float:			left;
	position:		relative;
	margin-left:1px;
	height:25px;
}
.srt-menu li li {
	margin-left:0px;
	height:auto;
}
.srt-menu a {
	display:		block;
	position:		relative;
}
.srt-menu li:hover ul,
.srt-menu li.sfHover ul {
	display:block;
	left:			0;
	top:			42px;
	z-index:		99;
	-webkit-box-shadow:  2px 3px 2px 0px rgba(00, 00, 00, .3);
    box-shadow:  2px 3px 2px 0px rgba(00, 00, 00, .3);
}
ul.srt-menu li:hover li ul,
ul.srt-menu li.sfHover li ul {
	top:			-999em;
}
ul.srt-menu li li:hover ul,
ul.srt-menu li li.sfHover ul {
	left:			12em;
	top:			0;
}
ul.srt-menu li li:hover li ul,
ul.srt-menu li li.sfHover li ul {
	top:			-999em;
}
ul.srt-menu li li li:hover ul,
ul.srt-menu li li li.sfHover ul {
	left:			10em; 
	top:			0;
}

/*** DEMO2 SKIN ***/
.srt-menu {
	float:right;
}
.srt-menu a {
	text-decoration:none;
}
.srt-menu li a{
	margin:0; 
	padding:10px 20px;
}
.srt-menu a, .srt-menu a:visited  { /* visited pseudo selector so IE6 applies text colour*/
	color:#000;	
}
.srt-menu li li a {
		border-top:		1px solid rgba(255,255,255,.2);
		background:		#333; /*fallback for old IE*/
		background:rgba(0,0,0,.6);
		color:	#fff;
		padding-left:20px;
}
.srt-menu li li a:visited{color:#fff;}
.srt-menu li li li a,
.srt-menu li.current * li a{
	padding-left:20px;
	background:rgba(0,0,0,.6);
}

.srt-menu li:hover > a{ 
	color: #c16363;

}
.srt-menu li li:hover > a{
	color: #c16363;
}



/*Grille*/
/*
 & Colonne : 12 

 */
 .row{
   margin-left: -15px;
     margin-right: -15px;
} .row-2{
	transform: translateX(3%) translateY(40%);
}
 
.grid_1 { width: 8.33333333%; }
.grid_2 { width: 16.66666667%; }
.grid_3 { width: 25%; }
.grid_4 { width: 33.33333333%; }
.grid_5 { width: 41.66666667%; }
.grid_6 { width: 50%; }
.grid_7 { width: 58.33333333%; }
.grid_8 { width: 85%; }
.grid_9 { width: 75%; }
.grid_10 { width: 83.33333333%; }
.grid_11 { width: 91.66666667%; }
.grid_12 { width: 100%; }

.grid_1,
.grid_2,
.grid_3,
.grid_4,
.grid_5,
.grid_6,
.grid_7,
.grid_8,
.grid_9,
.grid_10,
.grid_11,
.grid_12 {
	float: left;
	display: block;
}

.rightfloat{float:right;}
 
#accueil .grid_8 { 
	margin:40px 0 -13px;
}

}

/*DESKTOP*/

@media only screen and (min-width: 1024px) {
#accueil h1{ font-size:1.4em;}
} 

/*
LARGE VIEWING SIZE
This is for the larger monitors and possibly full screen viewers.
*/
@media only screen and (min-width: 1240px) {
#accueil h1{ font-size:2em;}
} 

/*
RETINA (2x RESOLUTION DEVICES)
This applies to the retina iPhone (4s) and iPad (2,3) along with
other displays with a 2x resolution.
*/
@media only screen and (-webkit-min-device-pixel-ratio: 1.5),
       only screen and (min--moz-device-pixel-ratio: 1.5),
       only screen and (min-device-pixel-ratio: 1.5) {


} 

/*
iPHONE 5 MEDIA QUERY
*/
@media (device-height: 568px) and (-webkit-min-device-pixel-ratio: 2) { 

.tittle-1{
  color: red!important;
}

  .flexslider .slides img {
   width: 100%;
   display: block;
   height: auto!important;
   margin-bottom: 25px;

}
}



/*
Pop-Up-----------------------------------------------------------------------------------
*/

.modal {
  position: fixed;
  top: 50%;
  left: 50%;
  width: 50%;
  max-width: 630px;
  min-width: 250px;
  height: auto;
  z-index: 2000;
  visibility: hidden;
  background: #9c0000;
  -webkit-backface-visibility: hidden;
  -moz-backface-visibility: hidden;
  backface-visibility: hidden;
  -webkit-transform: translateX(-50%) translateY(-50%);
  -moz-transform: translateX(-50%) translateY(-50%);
  -ms-transform: translateX(-50%) translateY(-50%);
  transform: translateX(-50%) translateY(-50%);
}

.show {
  visibility: visible;
}

.overlay {
  position: fixed;
  width: 100%;
  height: 100%;
  visibility: hidden;
  top: 0;
  left: 0;
  z-index: 1000;
  opacity: 0;
  -webkit-transition: all 0.3s;
  -moz-transition: all 0.3s;
  transition: all 0.3s;
}

.show ~ .overlay {
  opacity: 1;
  visibility: visible;
}

.popup-content {
  color: #fff;
  position: relative;
  border-radius: 3px;
  margin: 0 auto;
  padding: 6% 10%;
}

.popup-content h3 {
  margin: 0;
  text-align: center;
  font-size: 3.4em;
  font-weight: 300;
  position: relative;
}

.popup-content .para {
  color: #F3F3F3;
  margin-bottom: 30px;
  text-align: justify;
}

.popup-content > div {
  padding: 0px;
  margin: 0;
  font-size: 14px;
  line-height: 16px;
}

.popup-content > div p {
  margin: 0;
  padding: 10px 0;
}

.popup-content > div ul {
  margin: 0;
  padding: 0 0 30px 20px;
}

.popup-content > div ul li {
  padding: 5px 0;
}

.popup-content button {
  display: block;
  margin: 0 auto;
  font-size: 0.8em;
}

.close {
  background: url(../images/close.png) no-repeat;
  height: 49px;
  width: 49px;
  position: absolute;
  right: 1px;
  top: 1px;
  z-index: 9999;
  cursor: pointer;
  opacity: 1;
  -webkit-transition: all ease-in-out 0.3s;
  -o-transition: all ease-in-out 0.3s;
  transition: all ease-in-out 0.3s;
}

.close:hover {
  opacity: 0.2;
}


/* Effet blur */
.show.blur-effect ~ .overlay {
  background: rgba(239, 239, 239, 0.57);
}

.show.blur-effect ~ .container, .show.blur-effect ~ .bgall{
  -webkit-filter: blur(30px);
  -moz-filter: blur(30px);
  filter: blur(30px);
}

.blur-effect .popup-content {
  -webkit-transform: translateY(-5%);
  -moz-transform: translateY(-5%);
  -ms-transform: translateY(-5%);
  transform: translateY(-5%);
  opacity: 0;
}

.show.blur-effect ~ .container,
.blur-effect .popup-content, .show.blur-effect ~ .bgall {
  -webkit-transition: all 0.3s;
  -moz-transition: all 0.3s;
  transition: all 0.3s;
}

.show.blur-effect .popup-content {
  -webkit-transform: translateY(0);
  -moz-transform: translateY(0);
  -ms-transform: translateY(0);
  transform: translateY(0);
  opacity: 1;
}

/* Media queries */

@media(max-width: 1230px) {

  .popup-content h3:before {
    display: none;
  } 

}

@media(max-width: 680px) {

  h1 {
    font-size: 42px;
  }
  
}

@media(max-width: 480px) {

  h1 {
    font-size: 32px;
  }

  .popup-content h3 {
    font-size: 1em;
  }

  .popup-content > div {
    font-size: 10px;
  }

}
@media(max-width: 920px){
  .petit-logo{
    padding: 0;
  }
  .modif-grid4 {
    margin-top: 2vw;
  }
  .modif-grid4 img {
    width: 50%;
  }
    #accueil{
    padding-top: 5vw;
  }

}

@media(max-width: 850px) and (orientation: landscape) {
  
  .modif-grid4 {
    margin-top: 2vw;
  }
  .modif-grid4 img {
    width: 50%;
  }
  .copyright{
    margin-top:0%;
  }

}

@media(max-width: 700px) and (orientation: landscape) {

  .modif-grid4 h1 img {
    width: 42%;
  }
  .modif-grid4 .tittle-1 {
    font-size: 1em;
  }
  .image-paralax img{
    display: none;
  }
}


/*

Thanks for basic template --

Simple Responsive Template v 1.2


primary styles 
   Author: www.prowebdesign.ro
   Add your own styles to customize the project.
*/