img
{ border: 0; max-width:100%;}




/********* ANIMATION TITLES ******/
.animated {
  -webkit-animation-duration: 1s;
  animation-duration: 1s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
}

.animated.infinite {
  -webkit-animation-iteration-count: infinite;
  animation-iteration-count: infinite;
}

.animated.hinge {
  -webkit-animation-duration: 2s;
  animation-duration: 2s;
}

@-webkit-keyframes zoomIn {
  from {
    opacity: 0;
    -webkit-transform: scale3d(.3, .3, .3);
    transform: scale3d(.3, .3, .3);
  }

  50% {
    opacity: 1;
  }
}

/* ANIMATION LOGO+JJCR'16*/
@-webkit-keyframes bounceInDown {
  from, 60%, 75%, 90%, to {
    -webkit-animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
    animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
  }

  0% {
    opacity: 0;
    -webkit-transform: translate3d(0, -3000px, 0);
    transform: translate3d(0, -3000px, 0);
  }

  60% {
    opacity: 1;
    -webkit-transform: translate3d(0, 25px, 0);
    transform: translate3d(0, 25px, 0);
  }

  75% {
    -webkit-transform: translate3d(0, -10px, 0);
    transform: translate3d(0, -10px, 0);
  }

  90% {
    -webkit-transform: translate3d(0, 5px, 0);
    transform: translate3d(0, 5px, 0);
  }

  to {
    -webkit-transform: none;
    transform: none;
  }
}

@keyframes bounceInDown {
  from, 60%, 75%, 90%, to {
    -webkit-animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
    animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
  }

  0% {
    opacity: 0;
    -webkit-transform: translate3d(0, -3000px, 0);
    transform: translate3d(0, -3000px, 0);
  }

  60% {
    opacity: 1;
    -webkit-transform: translate3d(0, 25px, 0);
    transform: translate3d(0, 25px, 0);
  }

  75% {
    -webkit-transform: translate3d(0, -10px, 0);
    transform: translate3d(0, -10px, 0);
  }

  90% {
    -webkit-transform: translate3d(0, 5px, 0);
    transform: translate3d(0, 5px, 0);
  }

  to {
    -webkit-transform: none;
    transform: none;
  }
}

.bounceInDown {
  width:380px;
  -webkit-animation-name: bounceInDown;
  animation-name: bounceInDown;
}





/* POST-IT */
.quote-container {
	position: relative;
	display: block;
	z-index: 9999;
}

.logo_effet {
  
  position: relative;
  /*margin: 30% 10% 0 10%;*/ 
   margin-left:2%;
  
  
}

.tmi {
	 width:90%;
	 margin-bottom:-35%;
	-webkit-transform: rotate(2deg);
	-moz-transform: rotate(2deg);
	-o-transform: rotate(2deg);
	-ms-transform: rotate(2deg);
	transform: rotate(-3deg);
	box-shadow: 0 10px 10px 2px rgba(0,0,0,0.3);
	background-color: #fff;
	border: solid 4px #d19229;
	border-radius:10px;
	padding: 3px 3px 3px 1px !important;
	/*-webkit-box-shadow: inset 2px 2px 3px 1px rgba(0, 0, 0, 0.55);
	-moz-box-shadow:inset 2px 2px 3px 1px rgba(0, 0, 0, 0.55);
	box-shadow:inset 2px 2px 3px 1px rgba(0, 0, 0, 0.55);
	border-right-width: 4px;
	border-bottom-width: 4px;
	border-bottom-style: solid;
	border-right-style: solid;
	border-right-color:  #FFF;
	border-bottom-color:  #FFF;*/
	opacity:0.85;
	/*background-color: #CE592C;
	background-image: url(../logo_effet/img/fond.png);
	background-repeat: no-repeat;*/
	}

@media (max-width: 1600px) {

.tmi {
	width:70%;
	margin-bottom:-27%;
	border: solid 3px #d19229;
	border-radius:8px;
	box-shadow: 0 8px 8px 2px rgba(0,0,0,0.3);
}}


@media (max-width: 1400px) {

.tmi {
	width:60%;
	margin-bottom:-24%;
	border: solid 3px #d19229;
	border-radius:8px;
	box-shadow: 0 8px 8px 2px rgba(0,0,0,0.3);
}}

@media (max-width: 1280px) {

.tmi {
	width:55%;
	margin-bottom:-22%;
	border: solid 3px #d19229;
	border-radius:8px;
	box-shadow: 0 8px 8px 2px rgba(0,0,0,0.3);
}}

@media (max-width: 1024px) {

.tmi {
	width:47%;
	margin-bottom:-19%;
	border: solid 3px #d19229;
	border-radius:8px;
	box-shadow: 0 8px 8px 2px rgba(0,0,0,0.3);
}}

@media (max-width: 960px) {

.tmi {
	width:42%;
	margin-bottom:-16%;
	border: solid 2px #d19229;
	border-radius:4px;
	box-shadow: 0 8px 8px 2px rgba(0,0,0,0.3);
}}

@media (max-width: 768px) {

.tmi {
	width:35%;
	margin-bottom:-14%;
  	border: solid 1px #d19229;
	border-radius:2px;
	box-shadow: 0 6px 6px 2px rgba(0,0,0,0.3);
	padding: 3px 6px 3px 2px !important;
}}

@media (max-width: 650px) {

.tmi {
	display:none;
	width:22%;
	margin-bottom:-9%;
  	border: solid 1px #d19229;
	border-radius:2px;
	box-shadow: 0 6px 6px 2px rgba(0,0,0,0.3);
	padding: 3px 6px 3px 2px !important;
}}

@media (max-width: 460px) {

.tmi {
	display:none;

}}