/* reset */

html,
body,
address,
blockquote,
div,
dl,
form,
h1,
h2,
h3,
h4,
h5,
h6,
ol,
p,
pre,
table,
ul,
dd,
dt,
li,
tbody,
td,
tfoot,
th,
thead,
tr,
button,
del,
ins,
map,
object,
a,
abbr,
acronym,
b,
bdo,
big,
br,
cite,
code,
dfn,
em,
i,
img,
kbd,
q,
samp,
small,
span,
strong,
sub,
sup,
tt,
var,
legend,
fieldset {
	margin: 0;
	padding: 0;
}

img,
fieldset {
	border: 0;
}

/* set html5 elements to block */

article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
menu,
nav,
section,
summary,
main {
	display: block;
}

/* apply a natural box layout model to all elements */

*,
*:after,
*:before {
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
}

/* viewport css */

@-webkit-viewport {
	width: device-width;
	 zoom: 1; 
}

@-moz-viewport {
	width: device-width;
	 zoom: 1; 
}

@-ms-viewport {
	width: device-width;
	 zoom: 1; 
}

@-o-viewport {
	width: device-width;
	 zoom: 1; 
}

@viewport {
	width: device-width;
	 zoom: 1; 
}

/* body css */

body {
	margin: 0;
	text-align: center;
}

.section {
	clear: both;
	padding: 0;
	margin: 0;
}

/* media css */

img {
	max-width: 100%;
	height: auto;
	display: block;
}

.video {
	position: relative;
	padding-bottom: 56.25%;
	height: 0;
	overflow: hidden;
}

.video iframe,
.video object,
.video embed {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

/* form css */

input[type=text],
input[type=password],
input[type=number],
input[type=date],
input[type=month],
input[type=week],
input[type=time],
input[type=datetime],
input[type=datetime-local],
input[type=email],
input[type=search],
input[type=tel],
input[type=url],
input[type=file],
input[type=button],
input[type=submit],
input[type=reset],
select,
textarea {
	-webkit-appearance: none;
	border-radius: 0;
}

input[type=text],
input[type=password],
input[type=number],
input[type=date],
input[type=month],
input[type=week],
input[type=time],
input[type=datetime],
input[type=datetime-local],
input[type=email],
input[type=search],
input[type=tel],
input[type=url],
input[type=file],
select,
textarea {
	width: 100%;
}

/* general table css */

table {
	width: 100%;
	table-layout: fixed;
	word-wrap: break-word;
}

/* split column css */

.split-column {
	float: left;
	width: 100%;
	margin-bottom: 20px;
}

.split-column:last-child {
	margin-bottom: 0;
}

/* content css */

.contenu {
	margin: 0 auto;
	text-align: left;
	max-width: 1200px; 
}


.one-column {
	float: left;
	width: 98%;
	margin: 10px 1%;
	text-align: left;
}

.two-column {
	float: left;
	width: 46%;
	margin: 10px 2%;
}

.two-column-txt {
	float: left;
	width: 35%;
	margin: 30px 10% 30px 5%;
}


.two-column-img {
	float: left;
	width: 50%;
	margin: 0;
}

.two-fourth-column {
	float: left;
	width: 46%;
	margin: 10px 2%;
}

.three-column {
	float: left;
	width: 31.333333%;
	margin: 10px 1%;
}

.two-third-column {
	float: left;
	width: 64.666666%;
	margin: 10px 1%;
}

.four-column,
.one-fourth-column {
	float: left;
	width: 23%;
	margin: 10px 1%;
}

.three-fourth-column {
	float: left;
	width: 73%;
	margin: 10px 1%;
}

.five-column {
	float: left;
	width: 18%;
	margin: 10px 1%;
}

.six-column {
	float: left;
	width: 14.666666%;
	margin: 10px 1%;
}

.five-sixth-column {
	float: left;
	width: 81.333333%;
	margin: 10px 1%;
}

/*
main .one-column img,
main .two-column img,
main .two-fourth-column img,
main .three-column img,
main .two-third-column img,
main .four-column img,
main .one-fourth-column img,
main .three-fourth-column img,
main .five-column img,
main .six-column img,
main .five-sixth-column img {
	-moz-border-radius:15px;
	-webkit-border-radius:15px;
	border-radius:15px;
	}*/


@media screen and (max-width: 1180px) {


	.three-fourth-column,
	.one-fourth-column {
		width: 92%;
		margin: 10px 4%;
	}
}
	
@media screen and (max-width: 1140px) {
	.four-column {
		width: 31.333333%;
		margin: 10px 1%;
	}

}

@media screen and (max-width: 860px) {
	.four-column {
	width: 46%;
	margin: 10px 2%;
	}
	
		.two-column-img {
	float: none;
	width: 100%;
	margin: 0;
}
	
	.two-column-txt {
		width: 92%;
		margin: 30px 4%;
}

}


@media screen and (max-width: 800px) {



	.one-column,
	.two-fourth-column,
	.three-column,
	.two-third-column,
	.one-fourth-column,
	.five-column,
	.six-column,
	.five-sixth-column {
		width: 92%;
		margin: 10px 4%;
	}



}

@media screen and (max-width: 600px) {

	.contenu {
		min-width: 300px;  /* min-width of your responsive website (example 300px) */
	}

	.one-column,
	.two-column,
	.two-fourth-column,
	.three-column,
	.two-third-column,
	.one-fourth-column,
	.three-fourth-column,
	.six-column,
	.five-sixth-column {
		width: 92%;
		margin: 10px 4%;
	}
	

	
		.four-column {
		width: 80%;
		margin: 10px 10%;
	}
	
/*
	
main .one-column img,
main .two-column img,
main .two-fourth-column img,
main .three-column img,
main .two-third-column img,
main .four-column img,
main .one-fourth-column img,
main .three-fourth-column img,
main .five-column img,
main .six-column img,
main .five-sixth-column img {
	-moz-border-radius:10px;
	-webkit-border-radius:10px;
	border-radius:10px;
	}	*/
	
}


@media screen and (max-width: 420px) {
	.four-column {
		width: 92%;
		margin: 10px 4%;
	}

}