/* == normalize.css + knacss */

* {box-sizing: inherit}

html {box-sizing: border-box;
font-family: "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", "DejaVu Sans", Verdana, sans-serif;
-ms-text-size-adjust: 100%;
-webkit-text-size-adjust: 100%}

body {font-size: 1em;
line-height: 1.5em;
margin: 0 auto}

article,
footer,
header,
main,
menu,
nav,
section {display: block}

a {background-color: transparent; color: #09c}
a:active, a:hover {outline: 0}

img {border: 0;
height: auto;
vertical-align: middle;
width: auto}

mark, .mark {background: #ff0; color: #000}

small {font-size: 80%}

ul, ol {padding-left: 2em}


/* == FORM */
input {line-height: normal}
input, textarea {border: #ccc 1px solid;
margin: 0;
padding: .5em;
width: 100%}
input:focus, textarea:focus {border-color: #39f}

input[type="submit"] {background: #39f;
border: 0;
cursor: pointer}
input[type="submit"]:hover {background: #f70; border-color: #f70}

fieldset, legend {border: 0; padding: 0}
textarea {overflow: auto}

fieldset, label {margin: 0}

label {font-size: 1em; line-height: 1.5}

textarea {overflow: auto}

.btn {background: #39f;
color: #fff;
margin-top: 0}
.btn:hover {background: #f70; 
color: #fff; 
text-decoration: none}

.form-anti-spam /*input*/ {position: relative;
top: -.25em;
width: 4em!important}
.form-error-color {color: red}
.form-error-field {border-color: red}
.form-error-bg, .form-error-field {background: #ffebeb}

.form-error-message, .form-success-message {padding: .75em}

.form-error-message, .form-error-field {border: solid 1px red}
.form-success-message {background: #ebf7f3;
border:#6cc4a7 1px solid;
color: #096}


/* == KNACSS */
.center {margin-left: auto; margin-right: auto}

.text-center {text-align: center}
.text-right {text-align: right}

.float-l {float: left}
.float-r {float: right}

.line {clear: both}
.line::after {content: "";
display: table;
clear: both;
border-collapse: collapse}

.inbl {display: inline-block; vertical-align: top}

.vh /*visually-hidden*/ {position: absolute !important;
border: 0 !important;
height: 1px !important;
width: 1px !important;
padding: 0 !important;
overflow: hidden !important;
clip: rect(1px, 1px, 1px, 1px) !important}

.ma0 {margin: 0 !important}
.mb0 {margin-bottom: 0}
.mt0 {margin-top: 0}

.ma1 {margin: .75em}
.mt1 {margin-top: .75em}
.mt2 {margin-top: 1.5em}

.pt1 {padding-top: .75em}
.pt3 {padding-top: 1.5em}
.pb2 {padding-bottom: 1.5em}
.pb3 {padding-bottom: 3em}
.pl2 {padding-left: 1.5em}
.pr2 {padding-right: 1.5em}


.mw980p {padding: 0 10px;
margin: 0 auto;
max-width: 980px}

.w33 {width: 33.3333%}
.w50 {width: 50%}
.w100 {width: 100%}


/* == MY STYLES */
a {text-decoration: none}
a:hover {text-decoration: underline}

h1 {font-size: 1.75em;
line-height: 1.5em;
margin: 1.5em 0 0}
h2, .h2 {font-size: 1.5em;
line-height: 1.35em;
margin: 1.35em 0 0}
h3, .h3 {font-size: 1.35em;
line-height: 1.2em;
margin: 1.2em 0 0}

p, ul, ol {margin: 1.5em 0 0}

ul {list-style: circle}
ul ul, ol ol, ul ol, ol ul {margin-top: 0; margin-bottom: 0}

em, small, strong {line-height: 1}

.bg1 {background: #f0f0f0}
.bg1-col {padding: 1.5em}
.bg1-line {padding: 0 1.5em 1.5em}

.btn2 {background: #999;
color: #fff;
display: inline-block;
font-size: 75%;
padding: 2.5px 10px;
text-transform: uppercase}
.btn2:hover {background-color: #888; text-decoration: none}

.body-content {background: #9BC30C url(/img/bg.png)}

.col-l {padding-right: 1.5em}
.col-r {padding-left: 1.5em}

.header-logo a, .header-logo p {color: #fff}
.header-logo a {font-family: Impact, Haettenschweiler, "Franklin Gothic Bold", "Arial Black", "sans-serif"; text-transform: uppercase; letter-spacing: 2px}

.ul-unstyled {list-style: none; padding-left: 0}
.uppercase {text-transform: uppercase}


/* == HEADER */
.header-content {padding: 20px 10px}

/* == Menu
.nav-content {background: #fff; font-size: 85%; padding: 20px 0 40px}
.menu-li {display: inline}
.menu-a {display: block;
float: left;
margin: 20px 40px 0 0}
.menu-a:hover {text-decoration: underline}
.menu-on {color: #DD2A1B} */


/* == MAIN */
.mentions-legales {margin: 0 7.5em}
.section-main {background: #fff; padding: 3em 0}


/* == FOOTER */
.footer-content {padding: 20px}


/* ==Responsive small */
@media (max-width: 768px) {	
.mw980p {width: auto; float: none}

div, textarea {word-wrap: break-word;
-webkit-hyphens: auto;
-moz-hyphens: auto;
-ms-hyphens: auto;
hyphens: auto}

.bg1-col {padding: 1.5em !important}

.col-l {padding: 0 !important}
.col-r {padding: 3em 0 0 !important}

.header-contact {margin-top: 1.5em}

.mentions-legales {margin: 0}

.w33,
.w50,
.w100 {width: 100% !important}

}