/*------------------------------------------------------------

 _                                                                   
| |                                                                  
| | ___ ___   _   _  ___ _   ___  __   ___  __ _ _ __ _ __ ___ ___   
| |/ _ | __| | | | |/ _ \ | | \ \/ /  / __|/ _` | '__| '__/ _ | __|  
| |  __|__ \ | |_| |  __/ |_| |>  <  | (__| (_| | |  | | |  __|__ \  
|_|\___|___/  \__, |\___|\__,_/_/\_\  \___|\__,_|_|  |_|  \___|___/  
               __/ |                                                 
              |___/                                                  

--------------------------------------------------------------
  
  Theme:   SQUARE EYES
  Author:  Jesse Giroux / Les Yeux Carrés
  Website: lesyeuxcarres.ca

------------------------------------------------------------*/


/*============================================================
 Base
============================================================*/


html, body {
	background-color:#e1e1e1;
}


#block {
	
	display:block;
	position:relative;
	z-index:50;
	width:950px;
	height:600px;
	margin:0 auto;
	margin-top:20px;
    font: normal 11px Arial, Helvetica, sans-serif;
	
}

a:hover {
	color: #8cc63f;
	text-decoration: none;
}
a:active {
	color: #8cc63f;
	text-decoration: none;
}
a:link {
	color: #8cc63f;
	text-decoration: none;
}

.style01 {
	font-family: Verdana, Helvetica, sans-serif;
	color: #ffffff;
	font-size: 16px;
	text-decoration: none;	
}

.style02 {
	font-family: Verdana, Helvetica, sans-serif;
	color: #8cc63f;
	font-size: 16px;
	text-decoration: none;	
}

/*============================================================
 JS Slides
============================================================*/

#myController span{
color:#FFF;
background:#ffffff;
margin-right:10px;
font: normal 30px Arial, Helvetica, sans-serif;
cursor:pointer;
}

#jFlowSlide{ margin:0 auto; }
 #mySlides { height:500px; overflow:hidden; margin:0; }
  .jFlowSlideContainer { margin:0; }
   .contentWrapper {margin: 0 auto; width: 700px; margin-bottom:20px;}


#myController span.jFlowSelected {
background:#8cc63f;
}


/* Slide Navigation
----------------------------------------------------------*/


    .jFlowSlideContainer { margin: 0; }
	  .jFlowPrev, .jFlowNext{ cursor:pointer; margin-top:20px; position:relative; z-index:9999;}
	   .jFlowNext {float: right; }


#qui .jFlowNext a { display:block; width:124px; height:43px; margin-top:10px; background: url(../images/smaller-navigation.png) no-repeat 0 0; }
#qui .jFlowNext a:hover { display: block; background: url(../images/smaller-navigation.png) no-repeat 0 -43px; }

#quoi .jFlowNext a { display:block; width:124px; height: 43px; background: url(../images/smaller-navigation.png) no-repeat -125px 0; }
#quoi .jFlowNext a:hover { display: block; background: url(../images/smaller-navigation.png) no-repeat -125px -43px; }

#contact .jFlowNext a { display:block; width:124px; height: 43px; background: url(/img/smaller-navigation.png) no-repeat -250px 0; }
#contact .jFlowNext a:hover { display: block; background: url(/images/smaller-navigation.png) no-repeat -250px -43px; }

#liens .jFlowNext a { display:block; width:124px; height: 43px; background: url(/img/smaller-navigation.png) no-repeat -375px 0; }
#liens .jFlowNext a:hover { display: block; background: url(/images/smaller-navigation.png) no-repeat -375px -43px; }

#temp .jFlowNext a { display:block; width:124px; height: 43px; }
#temp .jFlowNext a:hover { display: block; }


/* PAGE SPECIFIC
===================================================================================== */

/****************** 1 ****************************/

#qui.contentWrapper {display:block; background-image:url(../images/slide-1.png); width:700px; height:500px; }

#quoi.contentWrapper {display:block; background-color:#cccccc; width:700px; height:500px; }

.jFlowControl .home a { background:none; }



/*============================================================
 JS Parallax
============================================================*/

#parallax {
position:absolute; 
overflow:hidden;
top:0;
left:50%;
margin-left:-960px;
width:1920px; 
height:900px;
}

