body.home,
body .header-logo,
body .main-visial .txtArea .txtR{display: none;}

body h2.titleTop {

    height: auto;
    width: 460px;
    margin: 0 auto;
    position: relative;
    padding-right: 138px;

}

h2.titleTop .header-logo-top img{
	width: 65px;
	height: auto;
}
h2.titleTop .header-logo-top{
	position: absolute;
	top:105px;
	right:177px;
	display: none;
}

			i {
				background-color: rgba(255,255,255,1);
				border-radius: 4px;
			}
			#hi-there {
				fill:rgba(255,255,255,1);
				fill-opacity: 0;
				stroke: currentColor;	
			}





#mySVG * {
  fill-opacity: 0;
  transition: fill-opacity 1s;
}

.svg-in.finished {
  fill-opacity: 1;
}



			/* Text */
			.bigger {
				font-size: 1rem;
				font-weight: 100;
				line-height: 1.4rem;
			}
			.center {
				text-align: center;
			}
			.clearer {
				clear: both;
			}
			.striked {
				text-decoration: line-through;
			}
			.italic {
				font-style: italic;
			}

			/* Blocs */
			.bloc-head     { color: #5aa8c5; padding: 30px; }
			.bloc-demo     { color: #FF495F; }
			.bloc-timing   { color: #F7A800; }
			.bloc-scenario { color: #4fe084; }
			.bloc-doc      { color: #69B0CA; }

			/* Custom */
			#hi-there {
				width: 100%;
				stroke-width:1.6;
				height: 540px;
			}
			.intro-links {
				text-align: right;
			}
			.example-description {
				margin-left: 440px;
			}
			.timing-description {
				min-height: 200px;
				margin-right: 240px;
			}
			.obturateur {
				stroke-width: 3;
				stroke-miterlimit: 10;
			}
			#polaroid {
				float: left;
				width: 400px; height: 320px;
				stroke: #f9f9f9;
				stroke-width: 3;
				stroke-linecap: round;
				stroke-linejoin: round;
				stroke-miterlimit: 10;
			}
			#timing-example {
				float: right;
				width: 175px; height: 175px;
			}
			.goodbye-head {
				font-size: 1.5rem;
				text-align: center;
				margin-bottom: 0;
			}
			.goodbye-sub {
				font-size: 0.875rem;
				text-align: center;
				margin: 0 0 20px;
			}


						/* Media queries */
			@media (min-width: 1300px) {
				#hi-there {
				
			}
			h2.titleTop .header-logo-top{
				position: absolute;
				top:83px;
			}
			}




			/* Media queries */
			@media (max-width: 1024px) {
				#hi-there {
				
			}
			h2.titleTop .header-logo-top{
				position: absolute;
				top:83px;
			}
			}
			/* Media queries */
			@media (max-width: 1000px) {
				#hi-there {
				
			}
			}



			/* Media queries */
			@media (max-width: 960px) {
				.button-group { display: block; line-height: 1.8em; }
			}

			@media (min-width: 768px) {
				.col3 { border-bottom: none; }
			}

			@media (max-width: 767px) {
				#polaroid { width: 100%; max-height: 300px; }
				.example-description { margin-left: 0; }
				.timing-description { margin-right: 0; }
				#timing-example { float: none; width: 100%; }

				.col3 { width: 100%; float: none; margin-bottom: 25px; padding-bottom: 25px; border-bottom-width: 1px; min-height: 200px; }
				.col3:last-child { margin-bottom: 0; padding-bottom: 0; border-bottom-width: 0px; }
			}

			@media (min-width: 481px) and (max-width: 767px) {
				#polaroid { width: 100%; max-height: 300px; }
				.example-description { margin-left: 0; }
				.timing-description { margin-right: 0; }

				.col3:nth-child(2n) svg {
					width: 200px;
					float: right;
				}
				.col3:nth-child(2n) .col-container {
					text-align: right;
					margin-right: 200px;
				}
				.col3:nth-child(2n+1) svg {
					width: 200px;
					float: left;
				}
				.col3:nth-child(2n+1) .col-container {
					text-align: left;
					margin-left: 200px;
				}
			}

			@media (max-width: 480px) {
				.col-container { padding: 0px; }
				#polaroid { width: 100%; max-height: 260px; }
			}