@charset "UTF-8";

* {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}
body,ul,li,p,h1,h2,h4,header,nav,#wrapper,footer,#content,header img,#topline,#toplineMobile,#menu,span,menubottom,#bannner,.blankimagemobile img,.blankimage img{
	padding: 0;
	margin: 0;
	border: 0;	
}
body {	
	background-color: #fcfbfb;
	font-family: 'Titillium Web', sans-serif;
	font-size: 100%;
}

@media screen and (min-width:519px) and (max-width:768px) {
	body {font-size: 100%;	}}

@media screen and (min-width:768px) and (max-width:1280px) {
	body {font-size: 100%;	}}

@media screen and (min-width:1280px) and (max-width:3000px) {
	body {font-size: 100%;}}


/* ==========   HEADER & NAV  ==========  */

header {
	position: fixed;
	top: 0px;
	height: 114px;
	width: 100%;	
	z-index: 100;
	background-image: url(graphics/vigne.png);
        background-color: #ffffff;	
	background-size: auto 110px;
	background-repeat: no-repeat;			
}
#logo {
	position: relative;
	float: left;
	display: inline-block;
	top: 40px; 
	z-index: 12;
	left: 50px;
	height: 56px;
	width: 550px;	
	background-image: url(graphics/logo.png);
	background-repeat: no-repeat;
	background-position: 0px 2px;
	background-size: 85%;
}
#language {
	position: absolute;
	float: right;
	top: 70px; 
	z-index: 13;
	right: 40px;
	height: 20px;
	width:80px;	
	
}

/* ======     END HEADER & NAV  ======   */

/* ======    BANNER PHOTO ======   */	
#pagename {
	position: absolute;
	top: 200px;
	left: 50px;
	
	text-align: left;
	z-index: 10;
}

#pagenameModules {
	position: absolute;
	top: 0px;
	left: 0px;
	text-align: left;
	z-index: 10;
	width: 20em;
	background: -moz-radial-gradient(center, ellipse cover,  rgba(255,255,255,1) 0%, rgba(246,246,246,0.7) 87%, rgba(237,237,237,0.65) 100%); /* FF3.6-15 */
background: -webkit-radial-gradient(center, ellipse cover,  rgba(255,255,255,1) 0%,rgba(246,246,246,0.7) 87%,rgba(237,237,237,0.65) 100%); /* Chrome10-25,Safari5.1-6 */
background: radial-gradient(ellipse at center,  rgba(255,255,255,1) 0%,rgba(246,246,246,0.7) 87%,rgba(237,237,237,0.65) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#a6ededed',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */
	
	-moz-box-shadow: 6px 5px 0px #e0dfdf;
	-webkit-box-shadow: 6px 5px 0px #e0dfdf;
	box-shadow: 6px 5px 0px #e0dfdf;
	border-width: 1px;
	border-style: solid;
	border-color: #dbdbdb;
	-webkit-border-top-right-radius: 20px;
	-webkit-border-bottom-right-radius: 20px;
	-moz-border-radius-topright: 20px;
	-moz-border-radius-bottomleft: 20px;
	border-top-right-radius: 20px;
	border-bottom-right-radius: 20px;
	z-index: 8;	
	text-align: left;	
	padding: 0em 0em 0em 3em;
	margin: 4em 0em 2em 0em;
}


#banner {
	position: relative;
	top: 138px;
	width: 100%;
	height: auto;
	background-size: cover;
	z-index: 9;
}

#bannergrad {
	position: relative;	
	top: 50px;
	width: 100%;
	height: 80px;
	margin: 0em 0em 4em 0em;
	z-index: 8;	
}
#bannerHome {
	position: relative;
	
	top: 130px;
	width: 100%;
	height: auto;
	background-size:cover;
	z-index: 9;
}
.pagenameHome {
	position: relative;
	top: 60px;
	left: 50px;
	width: 90%;
	z-index: 9;	
}
#bannergradHome {
	position: relative;	
	top: 120px;
	width: 100%;
	height: 60px;
	margin: 0em 0em 6em 0em;
	background-image: url(graphics/gradGrain.gif);
	background-image: width: 118px;
	background-repeat: repeat-x;
	z-index: 8;	
}

.blankimagemobile img{visibility: hidden; height: 0px; width: 0px;}
.blankimage img{ height: auto; width: 90%;}
.blankimage1 img{ height: auto; width: 75%;}

.blankimageHome img{ height: auto; width: 70%;}

/* ======     END BANNER PHOTO  ======   */

/* ======     EDITABLE CONTENT  ======   */

.module1, .module2, .module3, .module4, .module5, .module6, .module7, .module8, .module9 {
	display: inline-block;
	text-align: left;
	width: 100%;
	margin: 4em 0em 0em 0em;
	padding: 0em 0em 0em 0em;
}
.module {
	display: inline-block;
	text-align: left;
	width: 100%;
	margin: 2em 0em 0em 0em;
	padding: 0em 0em 0em 0em;
}
.modulePhoto {	
	width: 27%;
	height: 15em;
	margin: 4em 4% 0% 4%;
	display: inline-block;
	background-image: url(graphics/transparentmobile.png);
	background-repeat: no-repeat;
	background-size: cover ;	
	-moz-box-shadow: 10px 6px 0px #e9e9e9;
	-webkit-box-shadow: 10px 6px 0px #e9e9e9;
	box-shadow: 10px 6px 0px #e9e9e9;
	border-width: 1px;
	border-style: solid;
	border-color: #e5e5e5;
	-webkit-border-top-right-radius: 40px;
	-webkit-border-bottom-left-radius: 30px;
	-moz-border-radius-topright: 40px;
	-moz-border-radius-bottomleft: 30px;
	border-top-right-radius: 40px;
	border-bottom-left-radius: 30px;
}
.photoPano {	
	background-size:cover;
	position: relative;
	top: 2px;
	width: 100%;	
	display: inline-block;
	margin: 4em 0em 0em 0em;
	padding: 4em 0em 2em 0em;	
	background-repeat: no-repeat;
	background-position: 100% 50%;
	background-size: cover;	
}
.photoText {
	position: relative;
	width: 40%;
	background: -moz-radial-gradient(center, ellipse cover,  rgba(255,255,255,1) 0%, rgba(246,246,246,0.7) 87%, rgba(237,237,237,0.65) 100%); /* FF3.6-15 */
background: -webkit-radial-gradient(center, ellipse cover,  rgba(255,255,255,1) 0%,rgba(246,246,246,0.7) 87%,rgba(237,237,237,0.65) 100%); /* Chrome10-25,Safari5.1-6 */
background: radial-gradient(ellipse at center,  rgba(255,255,255,1) 0%,rgba(246,246,246,0.7) 87%,rgba(237,237,237,0.65) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#a6ededed',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */
	
	-moz-box-shadow: 6px 5px 0px #e0dfdf;
	-webkit-box-shadow: 6px 5px 0px #e0dfdf;
	box-shadow: 6px 5px 0px #e0dfdf;
	border-width: 1px;
	border-style: solid;
	border-color: #dbdbdb;
	-webkit-border-top-right-radius: 20px;
	-webkit-border-bottom-right-radius: 20px;
	-moz-border-radius-topright: 20px;
	-moz-border-radius-bottomleft: 20px;
	border-top-right-radius: 20px;
	border-bottom-right-radius: 20px;
	z-index: 8;	
	text-align: left;	
	padding: 2em 2em 2em 4em;
	margin: 1em 0em 3em 0em;
}
.colLeft {
	float: left;
	display: inline-block;
	text-align: left;
	width: 50%;	
	padding: 3em 5em 0em 5em;
}
.colRight {	
	display: inline-block;
	text-align: left;
	width: 50%;
	padding: 3em 6em 0em 3em;
}
.colLeftPhoto {
	float: left;
	width: 42%;
	margin: 4em 4% 2em 4%;
	padding: 0em 0em 0em 0em;
	background-size: cover ;	
	-moz-box-shadow: 10px 6px 0px #e9e9e9;
	-webkit-box-shadow: 10px 6px 0px #e9e9e9;
	box-shadow: 10px 6px 0px #e9e9e9;
	border-width: 1px;
	border-style: solid;
	border-color: #e5e5e5;
	-webkit-border-top-right-radius: 40px;
	-webkit-border-bottom-left-radius: 30px;
	-moz-border-radius-topright: 40px;
	-moz-border-radius-bottomleft: 30px;
	border-top-right-radius: 40px;
	border-bottom-left-radius: 30px;
}

.colLeftPhoto1, .colLeftPhoto2, .colLeftPhoto3, .colLeftPhoto4, .colLeftPhoto5 {
	float: left;
	width: 42%;
	margin: 4em 4% 2em 4%;
	padding: 0em 0em 0em 0em;
	background-size: cover;	
	background-repeat: no-repeat;
	-moz-box-shadow: 10px 6px 0px #e9e9e9;
	-webkit-box-shadow: 10px 6px 0px #e9e9e9;
	box-shadow: 10px 6px 0px #e9e9e9;
	border-width: 1px;
	border-style: solid;
	border-color: #e5e5e5;
	-webkit-border-top-right-radius: 40px;
	-webkit-border-bottom-left-radius: 30px;
	-moz-border-radius-topright: 40px;
	-moz-border-radius-bottomleft: 30px;
	border-top-right-radius: 40px;
	border-bottom-left-radius: 30px;
}

.colRightBorder {
	display: inline-block;
	text-align: left;
	width: 42%;
	margin: 4em 7% 0% 1%;
	padding: 1em 3em 3em 3em;
	background-color: #ffffff;
	
/* DIAG GRAD         
background: rgb(255,255,255);
background: -moz-linear-gradient(-45deg,  rgba(255,255,255,1) 52%, rgba(244,244,244,1) 59%, rgba(255,255,255,1) 77%);
background: -webkit-linear-gradient(-45deg,  rgba(255,255,255,1) 52%,rgba(244,244,244,1) 59%,rgba(255,255,255,1) 77%);
background: linear-gradient(135deg,  rgba(255,255,255,1) 52%,rgba(244,244,244,1) 59%,rgba(255,255,255,1) 77%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#ffffff',GradientType=1 );
*/
	background-image: url(graphics/transparent-png.png);
	-moz-box-shadow: 10px 6px 0px #e9e9e9;
	-webkit-box-shadow: 10px 6px 0px #e9e9e9;
	box-shadow: 10px 6px 0px #e9e9e9;
	border-width: 1px;
	border-style: solid;
	border-color: #edecec;
	-webkit-border-top-right-radius: 30px;
	-webkit-border-bottom-left-radius: 20px;
	-moz-border-radius-topright: 30px;
	-moz-border-radius-bottomleft: 20px;
	border-top-right-radius: 30px;
	border-bottom-left-radius: 20px;
}

/* ======     3 COLUMN CONTENT MODULE 1&2 ======   */

.colLeft3, .colLeft332 {
	float: left;
	display: inline-block;
	text-align: left;
	vertical-align: top;
	width: 32%;
	padding: 2em 1em 0em 3em; 
}
.colMiddle3, .colMiddle332 {
	display: inline-block;
	text-align: left;
	vertical-align: top;
	width: 32%;	
	padding: 2em 1em 0em 2em; 
}
.colRight3, .colRight332 {
	display: inline-block;
	text-align: left;
	vertical-align: top;
	width: 32%;	
	padding: 2em 1em 0em 2em; 
}
/* ======    END 3 COLUMN CONTENT MODULE 1&2 ======   */

/* ======    4 COLUMN CONTENT  ======   */
.colLeft4, .colLeft252 {
	float: left;
	display: inline-block;
	text-align: left;
	vertical-align: top;
	width: 24%;
	padding: 0em 1em 0em 1em; 
}
.colMiddle4, .colMiddle252 {
	display: inline-block;
	text-align: left;
	vertical-align: top;
	width: 24%;	
	padding: 0em 1em 0em 1em; 
}
.colRight4, .colRight252 {
	display: inline-block;
	text-align: left;
	vertical-align: top;
	width: 24%;	
	padding: 0em 1em 0em 1em; 
}
.colVeryRight4, .colVeryRight252 {
	display: inline-block;
	text-align: left;
	vertical-align: top;
	width: 24%;	
	padding: 0em 1em 0em 1em; 
}
/* ======    END 4 COLUMN CONTENT  ======   */

/* ======    END  EDITABLE CONTENT  ======   */

/* ======    TEXT STYLES  ======   */
p {
	margin: 0em 0em 0em 0em;
	padding: 0em 0em 0em 0em;
	font-size: 1.2em;
	line-height: 1.2em;
	font-weight: 300;
	color: #767778;
	/*color: #767778;*/
}
.photoPano p{
	color: #434342;
	font-size: 1.2em;
}
footer p{
	color: #d4d4d4;
	font-size: 1.2em;
}


@media screen and (min-width:770px) and (max-width:1029px) {
	h1 {font-size: 2.5em;	}}
	
@media screen and (min-width:1030px) and (max-width:3000px) {
	h1 {font-size: 3em;	}}	


h1 {
	font-style: normal;
	font-weight: 300;
	
	/*color: #9e0606;*/
	padding: 0% 0% 0% 0%;
	line-height: 1em;
	color: #5e7e11;
}
h2 {
	font-weight: 300;
	font-size: 2.2em;
	color: #6e8d23;
	text-transform: none;
	padding: 0em 0em 0.2em 0em;
	line-height: 0.5em;
}


h3 {
	font-style: normal;
	font-weight: 300;
	font-size: 1.9em;
	color: #80be45;
	padding: 0% 0% 0% 0%;
	
}
h4 {
	font-style: normal;
	font-weight: 200;
	font-size: 1.9em;
	color: #5e7e11;
	padding: 0% 0% 0% 0%;
	
}


h5 {
	font-weight: normal;	
	font-size: 1em;
	color: #444;	
	margin: 0.4em 0em 0.3em 0em;
}
h5 a {
	text-decoration: none;
	font-size: 1em;
	color: #444;
	margin: 0.4em 0em 0.3em 0em;
}
h6 {
	font-weight: 400;
	font-size: 1.4em;
	text-decoration: none;
	color: #000000;
	margin: 0em 0em 0em 0em;
}
a {
	font-size: 1.2m;
	font-weight: 400;
	text-decoration: none;
	color: #b10101;	
 }
footer a {
	text-decoration: none;
	color: #ce3d3d;	
 }
a:hover {
	font-size: 1.2m;
	font-weight: 400;
	text-shadow: 0px 0px #929191;
	text-decoration: underline;
	color: #ff5959;	
 }
.align-right { float:right; margin: 0 0 5px 5px; }
.align-left { float:left; margin: 0em 1em 0em 0em; }

.top3em { margin: 3em 0em 0em 0em; }
.bottom4em { margin: 4em 0em 4em 0em; }

/*  ===== COLOURED HEADLINES  ======  */

.darkGrey {color: #4b4a4a;}
.white {color: #ffffff;}
.red {color: #9e0606;}
.yellow {color: #edb800;}
.orange {color: #fd9f26;}
.cyan {color: #53E4E4;}
.purple {color: #d259da;}
.green {color: #5e7e11;}
.greenbright {color: #93DC27;}

/*  ===   END COLOURED HEADLINES  === */

/* ======    END TEXT STYLES  ======   */

/* ======    FOOTER  ======   */
.menubottom {
	display: hide;
	margin: 0em 0em 0em 0em;
}
footer {	
	width: 100%;
	height: auto;
	margin: 0em 0em 0em 0em;
	background-image: url(graphics/noise2.gif);
	background-size: auto 190px;
	background-repeat: repeat;	
}
.colLeftFooter{
	float:left;
	display: inline-block;
	text-align: left;
	width: 40%;
	padding: 5em 0em 5em 4em;
	margin: 0% 10% 0% 2%;	
}
.colRightFooter{
	display: inline-block;
	text-align: left;
	width: 40%;
	padding: 5em 0em 5em 0em;}
	
/* ======    END FOOTER  ======   */