html, body, #page-wrap {
	height: 100%;
	width: 100%;
	font-size: 14px;
	overflow: hidden;
}
a {
	color: #5BB6CE;
	text-decoration: none;
}
a:hover,
a.active {
	color: #E2AB3D;
}


p {
	margin-bottom: 0.8em;
}
#map {
	width: 100%;
	height: 100%;
	background: #3B3B3B;
}

#map-base,
#map-highlight,
#map-shape1,
#map-shape2,
#map-shape3,
#map-shape4,
#map-shape5,
#map-shape6,
#map-shape7,
#map-shape1-outline,
#map-shape2-outline,
#map-shape3-outline,
#map-shape4-outline,
#map-shape5-outline,
#map-shape6-outline,
#map-shape7-outline,
#map-shape8-outline,
#map-shape9-outline,
#map-shape10-outline,
#map-blank {
	position: absolute;
	right: 480px;
	top: 0px;
	height: 100%;
}
#about-page #map-base,
#regions-page #map-base,
#regions-page #map-shape1-outline,
#regions-page #map-shape2-outline,
#regions-page #map-shape3-outline,
#regions-page #map-shape4-outline,
#regions-page #map-shape5-outline,
#regions-page #map-shape6-outline,
#regions-page #map-shape7-outline,
#regions-page #map-shape8-outline,
#regions-page #map-shape9-outline,
#regions-page #map-shape10-outline,
#regions-page #map-blank {
	left: 0;
}
#map-highlight,
#map-shape2,
#map-shape3,
#map-shape4,
#map-shape5,
#map-shape6,
#map-shape7,
#map-shape1-outline,
#map-shape2-outline,
#map-shape3-outline,
#map-shape4-outline,
#map-shape5-outline,
#map-shape6-outline,
#map-shape7-outline,
#map-shape8-outline,
#map-shape9-outline,
#map-shape10-outline {
	display: none;
}

#videos .video {
	display: none;
}

#toggleframe img {
	position: absolute;
	left: 0px;
	bottom: 0px;
	line-height: 1.0;
	display: block;
}

#videos {
	position: absolute;
	width: 100%;
	height: 100%;
	bottom: 0px;
	left: 0px;
	z-index: 100;
	background: #404c50;
	display: none;
}

#videos .video {
	width: 480px;
	height: 270px;
	position: relative;
	top: 50%;
	margin: -135px auto 0;
}
#videos .video .closeVideo {
	position: absolute;
	top: -30px;
	right: -30px;
}
.showVideo {
	font-size: 36px;
	font-weight: bold;
	text-align: center;
	margin-top: 50px;
	text-transform: uppercase;
}
.videolinks {
	font-size: 36px;
	font-weight: bold;
	text-align: center;
	margin-top: 50px;
	text-transform: uppercase;
}

.showVideo a {position: relative; top: 3px;}

.videolinks {}


#videos .video-bg {
	width: 100%;
	position: absolute;
	bottom: 0px;
	left: 0px;
}

#videos #video01,
#videos #video02,
#videos #video03,
#videos #video04,
#videos #video05 {
	position: relative;
	margin: 0 auto;
	width: 480px;
	height: 270px;
	top: 35%;
}

#main {
	font-family: 'Open Sans';
	color: #E2AB3D;
	width: 480px;
	height: 100%;
	background: #404c50;
	float: right;
	position: relative;
	z-index: 10;
}

#main #main-content {
	overflow-y:	auto;
	height: 100%;
	padding: 0 40px;

}

#main #main-bg {
	position: absolute;
	width; 100%;
	bottom: 0px;
	right: 0px;
	z-index: -1;
}
#main #main-bg img {
	display: none;
}
#main #main-bg img.active {
	display: block;
}

#button-set {
	position: absolute;
	width: 50px;
	height: 100%;
	top: 0px;
	right: 480px;
	background: url('http://leretourdesvoix.ca/images/paneledge.png') repeat-y right;
}
#button-set-mobile {
	top: 0px;
	right: 479px;
	height: 100%;
	display: none;
}

#main #regions-button {
	position: absolute;
	width: 50px;
	top: 0;
	right: 0px;

}
#main #about-button {
	position: absolute;
	width: 50px;
	bottom: 0;
	right: 0px;
}
#main #switch-lang,
#home-overlay #switch-lang-overlay {
	position: absolute;
	bottom: 0;
	right: 0px;
	z-index: 1000;
}
#main header,
#home-overlay-right,
#home-overlay-left {
	font-family: 'Open Sans', sans-serif;
	text-transform: uppercase;
	font-size: 26px;
	font-weight: 600;
	letter-spacing: 0.1em;
	margin: 0 auto 35px;
	text-align: center;
	padding: 65px 0 0;
	text-shadow: 2px 2px 3px #222;
}
#main header span,
#home-overlay-right span {
	display: block;
}
#main header .large-text,
#home-overlay-right .large-text {
	font-size: 42px;
}
#main header .small-text,
#home-overlay-right .small-text {
	font-size: 18px;
}
#main #content {
	text-shadow: 2px 2px 3px #222;
}
#main #content h1 {
	text-transform: uppercase;
	text-align: center;
	font-size: 24px;
	letter-spacing: 0.1em;
	line-height: 1.3em;
}
#main #content h1 .lowercase {
	text-transform: capitalize;
}
#main #content .voices {
	margin: 0px 0 15px;
}
#regions-page #main #content .voices {
	text-align: center;
}
#regions-page #main #content .voices li {
	display: block;
	margin: 0;
}
#regions-page #main #content .voices li a {
	display: block;
	padding: 5px 0;
}
#main #content .voices li,
#main #content .about-nav li {
	display: inline-block;
	font-size: 24px;
	margin-right: 10px;
	font-weight: 600;
}
#main #content .about-nav {
	margin: 0 auto;
	display: block;
	width: 250px;
}
#main #content .about-nav li a {
	width: 19px;
	height: 57px;
	cursor: pointer;
	display: block;
	background: url('http://leretourdesvoix.ca/images/pager_dot.png') no-repeat center center;
}
#main #content .about-nav li a.active {
	background: url('http://leretourdesvoix.ca/images/pager_dot_active.png') no-repeat center center;
}
#main #content .about-nav li a.prev-about {
	width: 23px;
	height: 57px;
	background: url('http://leretourdesvoix.ca/images/pager_left.png') no-repeat;
}
#main #content .about-nav li a.next-about {
	width: 23px;
	height: 57px;
	background: url('http://leretourdesvoix.ca/images/pager_right.png') no-repeat;
}
#main #content .voices li .first-name {
	font-size: 18px;
	font-weight: 400;
}
#main #content .content-voice,
#main #content .about-text {
	display: none;
	font-size: 22px;
	line-height: 1.2em;
}
#main #content .about-text {
	height: 350px;
	overflow: auto;
}
#main #content .content-voice.active,
#main #content .about-text.active {
	display: block;
}

#main-content .region-text {
	display: none;
	height: 115px;
	font-size: 16px;
	line-height: 1.4em;
	font-weight: 600;
}
#main-content .region-text.active {
	display: block;
}

#home-overlay {
	width: 100%;
	height: 100%;
	z-index: 100;
	position: absolute;
}
#home-overlay-background-color {
	background: #404c50;
	width: 100%;
	height: 100%;
	position: absolute;
}
#home-overlay-img,
#home-overlay-img-button,
#home-overlay-img-mobile,
#home-overlay-img-button-mobile {
	width: 100%;
	height: auto;
	position: absolute;
	bottom: 0;
}

#home-overlay-img,
#home-overlay-img-mobile {
	position: absolute;
	bottom: -7px;
}

#home-overlay-img-mobile,
#home-overlay-img-button-mobile {
	display:none;
}
#home-overlay-right,
#home-overlay-left {
	color: #E2AB3D;
	vertical-align: middle;
}
#home-overlay #home-overlay-left {
	width: 38%;
	position: absolute;
	top: 0;
	left: 0;
	padding: 15% 10% 0;
}
#home-overlay #home-overlay-right {
	width: 28%;
	position: absolute;
	top: 0;
	right: 0;
	padding: 24% 10% 0 0;
}
#home-overlay-click-area {
	position: absolute;
	width: 100%;
	height: 100%;
	z-index: 101;
	background: transparent;
	top: 0;
	left: 0;
}
#home-overlay.hide {
	top: -100%;
}

.showVideo {
	display: block;
}
.videolinks {
	display: none;
}

/* jeff's edits */

#home-overlay #home-overlay-left {
	padding: 10% 10% 0;
}

#home-overlay #home-overlay-right {
	padding: 11% 10% 0 0;
}

#home-overlay-left {
	font-size: 16px;
	line-height: 1.4em;
	text-align: left;
	text-transform: none;
	text-shadow: none;
}

#home-overlay-right {
	text-shadow: none;
 /* background-color: #3B3B3B;
  color: transparent;
  text-shadow: 1px 2px 1px #E2AB3D;
  -webkit-background-clip: text;
     -moz-background-clip: text;
          background-clip: text;*/
}

.normal-text-plus {
	font-size: 28px;	
}

.normal-text-french {
	font-size: 23px;	
}

.small-text-french {
	font-size: 14px;
}

#main header {
	text-shadow: none;
	}
	
#main header a:hover {	
	color: #5BB6CE;
}


#main #content {
	text-shadow: none;
}

#main #content h1 {
	font-weight: 600;
	padding-bottom: 25px;
}
#main #content .region-description {
	margin-top: 25px;
	line-height: 1.4em;
	font-weight: 600;
	font-size: 16px;
}

#main #content .voices li { font-size: 20px; margin: 0 20px 15px 0;}

/*#main #content .voices li.ecole  {margin: 0 10px 15px 0;}

#main #content .voices li.madel, #main #content .voices li.ecole, #main #content .voices li.rocky {} */

#main #content .content-voice, #main #content .about-text {
	font-size: 16px;
	line-height: 1.4em;
	text-shadow: none;
	font-weight: 600;
}
	
#main #content .about-text a:hover {
	color: #5BB6CE;
}

.frenchlogo {}

#main-content {
/*	-moz-box-shadow:    -3px 0px 8px -3px #1e1e1e;
  	-webkit-box-shadow: -3px 0px 8px -3px #1e1e1e;
  	box-shadow:         -3px 0px 8px -3px #1e1e1e;*/
 	-moz-box-shadow:    -5px 0px 8px -4px #1a1a1a;
  	-webkit-box-shadow: -5px 0px 8px -4px #1a1a1a;
  	box-shadow:         -5px 0px 8px -4px #1a1a1a;	}
  	
#about-page header a:hover {color: #E2AB3D}



/* end jeff's edits */

@media screen and (max-width: 1000px) {
	#home-overlay #home-overlay-left {
		width: 48%;
		position: absolute;
		top: 0;
		left: 0;
		padding: 10% 5% 0;
	}
	#home-overlay #home-overlay-right {
		width: 38%;
		position: absolute;
		top: 0;
		right: 0;
		padding: 11% 5% 0 0;
	}
	#main header .large-text,
	#home-overlay-right .large-text {
		font-size: 32px; 
	}
	#main header .small-text,
	#home-overlay-right .small-text {
		font-size: 14px;
	}
	#main {
		width: 523px;
	}
	#main #main-content {
		padding-left: 83px;
	}
	#main #main-bg,
	#main #main-bg img {
		width: 100%;
	}
	#button-set {
		display: none;
	}
	#button-set-mobile {
		left: -12px;
		bottom: 0;
		position: absolute;
		display: block;
	}
	#button-set-mobile .mobile-button {
		position: absolute;
	}
	#button-set-mobile #map-button-mobile,
	#button-set-mobile #map-button-mobile-hover {
		bottom: 0;
		left: 5px;
	}
	#button-set-mobile #about-button-mobile {
		bottom: 95px;
		left: 5px;

	}
	#button-set-mobile #regions-button-mobile {
		bottom: 245px;
		left: 5px;
	}
	#button-set-mobile #shadow-mobile {bottom: 427px; left: 5px;}

	body.fr #button-set-mobile #map-button-mobile {
		bottom: 0;
		left: 5px;
	}
	body.fr #button-set-mobile #about-button-mobile {
		bottom: 125px;
		left: 5px;
	}
	body.fr #button-set-mobile #regions-button-mobile {
		bottom: 329px;
		left: 5px;
	}

	body.fr #button-set-mobile #shadow-mobile {bottom: 508px; left: 5px;}

	#toggleframe {
		display: none;
	}
	#map-highlight {
		display: block;
	}
	
	#main-content {
/*	-moz-box-shadow:    -3px 0px 8px -3px #1e1e1e;
  	-webkit-box-shadow: -3px 0px 8px -3px #1e1e1e;
  	box-shadow:         -3px 0px 8px -3px #1e1e1e;*/
 	-moz-box-shadow:    none;
  	-webkit-box-shadow: none;
  	box-shadow:         none;	}
}
@media screen and (max-width: 800px), only screen and (max-device-width:800px)  {
	#home-overlay #home-overlay-left,
	#home-overlay #home-overlay-right {
		width: 80%;
		padding: 10% 10% 0;
		position: relative;
	}
	.videolinks {
		display: inline;
	}
}
@media screen and (max-width: 600px) {

}
@media screen and (max-device-width:480px) {

	#home-overlay-img,
	#home-overlay-img-button {
		display: none;
	}
	#home-overlay-img-mobile,
	#home-overlay-img-button-mobile {
		display: block;
	}
	#home-overlay #home-overlay-left p {
		font-size: 20px;
	}
	#home-overlay #home-overlay-right {
		padding: 25px 5% 0;
	}
	#home-overlay #home-overlay-left {
		padding: 15px 5% 0;
	}
	#button-set {
		display: none;
	}
	#main {
		width: 95%;
	}
	#main header {
		padding-top: 40px;
	}
	#main #content .content-voice,
	#main #content .about-text {
		font-size: 18px;
	}
	#main #content .about-text {
		height: 390px;
	}
	#main #content .about-nav {
		margin-bottom: 25px;
	}
	#map-button-mobile {
		left: 0;
	}
	#button-set-mobile {
		left: -12px;
		bottom: 0;
		position: absolute;
		display: block;
	}
	#button-set-mobile .mobile-button {
		position: absolute;
	}
	#button-set-mobile #map-button-mobile,
	#button-set-mobile #map-button-mobile-hover {
		bottom: 0;
		left: 5px;
	}
	#button-set-mobile #about-button-mobile {
		bottom: 95px;
		left: 5px;
	}
	#button-set-mobile #regions-button-mobile {
		bottom: 245px;
	}
		
	body.fr #button-set-mobile #map-button-mobile {
		bottom: 0;
	}
	body.fr #button-set-mobile #about-button-mobile {
		bottom: 125px;
	}
	body.fr #button-set-mobile #regions-button-mobile {
		bottom: 329px;
		left: 5px;
	}
	.videolinks {
		display: inline;
	}
	.videolinks a:hover {
		color: #5BB6CE;
	}
}

