/*==================================================================================================
												Style
==================================================================================================*/

@import "reset.css";
@import "grid.css";
@import "font-awesome.css";
@import "superfish.css";
@import "bootstrap.css";
@import "bootstrap.min.css";
@import url(animate.css);

@import url(//fonts.googleapis.com/css?family=Open+Sans:400);
@import url(//fonts.googleapis.com/css?family=Open+Sans:300);
@import url(//fonts.googleapis.com/css?family=Open+Sans:600);
@import url(//fonts.googleapis.com/css?family=Open+Sans:400italic);


html {
	width: 100%;
}

* a{
    color: inherit;
    text-decoration: none;
    }

a[href^="tel:"] {
	color: inherit;
	text-decoration: none;
}

* {
	-webkit-text-size-adjust: none;
}

body {
	position: relative;
	min-width: 960px;
    background-color: #fff;
	background: url(../images/bg-body.jpg) center 0 no-repeat #fff; /*image de font*/
    color: #000;
    font: 13px/20px 'Open Sans', sans-serif;
}

.ic {
	border: 0;
	float: right;
	background: #fff;
	color: #f00;
	width: 50%;
	line-height: 10px;
	font-size: 10px;
	margin: -220% 0 0 0;
	overflow: hidden;
	padding: 0;
}

strong {
	font-weight: 700;
}

address {
	font-style: normal;
}

p {
	margin-bottom: 20px;
}

input {
	border-radius: 0 !important;
	outline: none !important;
}

img {
	max-width: 100%;
}


/*=======================  Heads  =======================*/
h1, h2, h3, h4, h5, h6 {
    font-weight: normal;
	color: #BC2001;
}

h2 {
    font-size: 20px;
    line-height: 24px;
    padding-top: 88px;
    margin-bottom: 20px;
	font-weight: bold;
}

h2 a:hover {
    color: #f00;
}

.page1 h2 {
    padding-top: 89px;
    margin-bottom: 18px;
}

h3 {
    padding-top: 51px;
    font-size: 16px;
    line-height: 20px;
    margin-bottom: 18px;
}

 
/*#titre {
  background: #fff;
  width: 110%;
  height:50px;
  margin: 0 0 0 0 ;
  border: 1px solid #000;
  text-align: center;
  position: relative;
}*/

/*=======================  Lists  =======================*/
ul {
	padding: 0;
	margin: 0;
	list-style: none;
}

ul.list .title {
    font-size: 15px;
    margin-bottom: 2px;
}

ul.list {
    padding-top: 3px;
}

img:hover {
	color: #f00;
	opacity: 0.7;
    filter: alpha(opacity=70);
}

ul.list time {
    padding-bottom: 10px;
    padding-top: 5px;
    line-height: 18px;
    margin-top: 2px;
    text-align: center;
    margin-right: 20px;
    width: 60px;
    display: block;
    color: #fff;
    font-size: 15px;
    float: left;
    background-color: #BC2001;
}

ul.list time span {
    display: block;
    border-top: 1px solid #DE2916;
    margin: 5px 2px 0;
}

ul.list li {
    overflow: hidden;
    line-height: 18px;
}

ul.list li+li {
    margin-top: 14px;
}

ul.list1 {
    margin-top: -2px;
}

ul.list1 li {
    position: relative;
    font-size: 15px;
    line-height: 18px;
    padding-left: 45px;
}

ul.list1 li+li {
    margin-top: 17px;
}

ul.list1 li+li+li {
    margin-top: 20px;
}

ul.list1 li+li+li+li {
    margin-top: 18px;
}

ul.list1 li:after {
    left: 0;
    top: -7px;
    content: '';
    font-family: 'FontAwesome';
    position: absolute;
    display: block;
    color: #fff;
    width: 33px;
    text-align: center;
    height: 32px;
    background-color: #BC2001;
    line-height: 30px;
}

ul.list2 li {
    padding-bottom: 2px;
    line-height: 18px;
    margin-top: -3px;
    padding-left: 33px;
    background: url(../images/marker.png) 0 4px no-repeat;
    font-size: 15px;
}

ul.list2 li:first-child+li {
    padding-bottom: 3px;
}

ul.list2 li +li {
    margin-top: 5px;
}


}

/*=======================  Links  =======================*/
a {
	text-decoration: none;
	color: inherit;
	outline: none;
	transition: 0.5s ease;
	-o-transition: 0.5s ease;
	-webkit-transition: 0.5s ease;
}

a:hover {
	color: #f00;
}

a.btn {
    margin-top: 30px;
    color: #fff;
    font-size: 15px;
    line-height: 20px;
    display: inline-block;
    padding: 4px 17px 5px;
    background-color: #BC2001;
}

a.btn:hover {
    background-color: #e14f42;
}

/*=======================  Classes  =======================*/
.mb0 {
	margin-bottom: 0px !important;
}
.m0 {
	margin: 0 !important;
}
.pad0 {
	padding: 0 !important;
}

.pad1 {
}

.img_inner {
	max-width: 100%;
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	-o-box-sizing: border-box;
	box-sizing: border-box;
	margin-bottom: 12px;
	margin-top: 5px;
}

.fleft {
	float: left;
	width: auto !important;
	margin-right: 20px;
	margin-bottom: 0px;
	margin-top: 1px;
}

.oh {
	overflow: hidden;
}
.fright {
	float: right !important;
}
.upp {
	text-transform: uppercase;
}

.alright {
	text-align: right;
}
.center {
	text-align: center;
}
.wrapper, .extra_wrapper {
	overflow: hidden;
}
.clear {
	float: none !important;
	clear: both;
}
.nowrap {
    white-space: nowrap;
}
@media screen and (min-width: 200px) and (max-width: 640px){
.clear {
    clear:left;
} 
.fleft {
    float: none;
    width: auto !important;
    margin-right: 0px;
}


}  



/*=======================  Header  =======================*/
header {
	display: block;
    padding: 32px 0 17px;
    border-bottom: 2px solid #c2c2c2;
    box-shadow: 0 5px 3px #f7f7f7;
}

header h1 {
	position: relative;
	text-align: center;
    float: left;
}

header h1 a {
	display: inline-block;
	overflow: hidden;
	width: 220px;
    height: 116px;
	font-size: 0;
	line-height: center;
	text-indent: -999px;
	transition: 0s ease;
	-o-transition: 0s ease;
	-webkit-transition: 0s ease;
}

header h1 a img {
	display: block;
}
 h1 a img {
    display: block;
}
 h1 img {
    position: relative;
    text-align: center;
    float: left;
}
 h1 a {
    display: inline-block;
    overflow: hidden;
    width: 220px;
    height: 116px;
    font-size: 0;
    line-height: center;
    text-indent: -999px;
    transition: 0s ease;
    -o-transition: 0s ease;
    -webkit-transition: 0s ease;
}
a.donate {
    margin-bottom: 21px;
    margin-top: 12px;
    float: right;
    color: #fff;
    text-transform: uppercase;
    font-size: 12px;
    line-height: 20px;
    background-color: #e14f42;
    padding: 4px 26px 5px 25px;
}

a.donate:hover {
    background-color: #DB1702;
}

.rel1 {
    position: relative;
    top: -3px;
}

.hor {
    margin-bottom: 1px;
    padding-top: 95px;
    border-bottom: 1px solid #c2c2c2;
}



/*=======================  Content  =======================*/
.content {
    padding-bottom: 89px;
}

.page1 .content {
    padding-bottom: 84px;
}

.bq1 {
    background-color: #ededed;
    margin-top: 57px;
    padding-bottom: 26px;
}

.bq1 .title{
    color: #fff;
    font-size: 18px;
    line-height: 36px;
    background-color: #BC2001;
    text-align: center;
    padding: 19px 0;
}

.bq1  p {
    margin-bottom: 11px;
    background: url(../images/quotes.png) 19px 30px no-repeat;
    padding: 37px 20px 0 38px;
    font-style: italic;
}

.bq1 .col2 {
    text-align: right;
    padding: 0 20px;
    font-size: 15px;
}

.bottom_block {
    position: relative;
    padding-bottom: 33px;
    border-top: 1px solid #c2c2c2;
	background-color: #000000;
}

.bottom_block:after {
    width: 1px;
    content: '';
    display:  block;
    left: 50%;
    margin-left: -2px;
    top: 0;
    bottom: 0;
    position: absolute;
}

.text1 {
    font-style: italic;
    color: #626161;
    margin-bottom: 13px;
}

.socials {
    padding-top: 5px;
    overflow: hidden;
}

.socials a {
    display: block;
    background-color: #f00;
    color: #fff;
    float: left;
    font-size: 25px;
    position: relative;
    width: 38px;
    text-align: center;
    height: 37px;
}

.socials a .fa {
    position: relative;
    z-index: 10;
    line-height: 37px;
}

.socials a:hover {
    background-color: #fff;
    color: #f00;
}

.socials a:hover:after {
    background-color: #DB1702 !important;
}

.socials a+a {
    margin-left: 4px;
}

.socials a:first-child+a+a:hover {
    color: #fff;
}

.socials a:first-child+a+a {
    color: #DB1702;
    font-size: 27px;
    line-height: 36px;
}

.socials a:first-child+a+a:after {
    width: 17px;
    height: 19px;
    z-index: 5;
    background-color: #fff;
    left: 11px;
    top: 9px;
    content: '';
    position: absolute;
}

.socials a+a+a+a+a {
    line-height: 38px;
    font-size: 25px;
}

.cl1 {
    height: 32px;
}

.cl2 {
    height: 31px;
}

ul.list.l1 {
    padding-top: 0;
    margin-top: -2px;
}

ul.list.l1 li {
    line-height: 20px;
}

ul.list.l1 li +li {
    margin-top: 30px;
}

ul.list.l1 time {
    margin-top: 4px;
}

.hor.hr1 {
    padding-top: 61px;
    margin-bottom: 0;
}

.block1 img {
    padding: 8px;
    margin-top: 1px;
    margin-bottom: 19px;
    background-color: #f8f7f7;
}

.bq2 p {
    padding-left: 16px;
    padding-top: 4px;
    margin-bottom: 14px;
    background: url(../images/quotes.png) 0 1px no-repeat;
    font-style: italic;
}

.bq2+.bq2 {
    margin-top: 46px;
}

.bq2 .bq_bot {
    color: #626161;
}

.bq2 .bq_bot a {
    font-weight: 300;
}

.ver {
    position: relative;
}

.ver:after, .ver:before {
    width: 1px;
    right: 30px;
    content: '';
    background-color: #ccc;
    display: block;
    position: absolute;
    bottom: 26px;
    top: 119px;
}

.ver:before {
    right: auto;
    left: 30px;
}

.video {
    margin-bottom: 20px;
    padding-top: 1px;
    width: 510px;
    display: block;
}

.video iframe  {
    height: 297px;
    width: 100%;
}

.block2+.block2 {
    margin-top: -8px;
}

a.gal {
    position: relative;
    top: 1px;
    display: block;
    margin-bottom: 16px;
    border: 1px solid #ccc;
    background: url(../images/magnify.png) center center no-repeat #C60800;
}

a.gal img {
    width: 100%;
    box-shadow: 0 0 0 #fff;
    transition: 0.5s ease;
    -o-transition: 0.5s ease;
    -webkit-transition: 0.5s ease;
}

a.gal:hover img {
    opacity: 0.5;
}

.gallery  {
    overflow: hidden;
    padding-top: 26px;
}

.gallery a.btn {
    margin-top: 19px;
}

.gallery  h2 {
    padding-top: 62px;
}


@media screen and (min-width: 200px) and (max-width: 640px){

}

/*=======================  Maps  =======================*/
.col1 {
    color: #BC2001;
}

.col1 a:hover, a.col1:hover {
    color: #f00;
}

.col2 {
    color: #f00;
}

.map {
    overflow: hidden;
    position: relative;
    padding-top: 1px;
}
 
.map+h2 {
    padding-top: 70px;
    margin-bottom: 10px;
}

.map figure {
    position: relative;
	display: block;
	width: 100%;
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	-o-box-sizing: border-box;
	box-sizing: border-box;
}

.map figure iframe {
	width: 100%;
	height: 312px;
	max-width: 100%;
}

.map address {
    position: relative;
    padding-left: 35px;
	display: block;
}

.m_phone {
    position: relative;
    padding-left: 35px;
}

.map h2 {
    margin-bottom: 9px;
    padding-top: 14px;
}

.map .fa {
    display: block;
    left: 0;
    top: 0;
    position: absolute;
    color: #f00; /*4f4d4d*/
    font-size: 14px;
    line-height: 20px;
}

.map a {
    display: inline-block;
    padding-left: 35px;
    position: relative;
}


@media only screen and (max-width: 995px) {
 .map figure iframe {
    width: 80%;
    height: 280px;
    max-width: 80%;
}

.map h2 {
    margin-bottom: 9px;
    padding-top: 14px;
}

.map a {
    display: inline-block;
    padding-left: 0px;
    position: relative;
}

}

@media only screen and (max-width: 767px) {
    .map figure iframe {
    width: 70%;
    height: 280px;
    max-width: 70%;
}

.map h2 {
    margin-bottom: 9px;
    padding-top: 14px;
}

.map a {
    display: inline-block;
    padding-left: 0px;
    position: relative;
}

}



@media screen and (min-width: 200px) and (max-width: 640px){

.map figure iframe {
    width: 35%;
    height: 280px;
    max-width: 45%;
}

.map h2 {
    margin-bottom: 9px;
    padding-top: 14px;
}

.map a {
    display: inline-block;
    padding-left: 35px;
    position: relative;
}

}

/*=======================  Footer  =======================*/
footer {
	display: block;
    text-align: center;
    padding: 30px 0 60px;
    font-size: 15px;
    color: #BC2001;
    line-height: 15px;
}

#toTop {
    display: none;
    text-decoration: none;
    position: fixed;
    bottom: 40px;
    left: 51%;
    margin-left: 500px;
    overflow: hidden;
    width: 50px;
    height: 52px;
    border: none;
    text-indent: -999px;
    z-index: 20;
    background: url(../images/to-top.png) no-repeat left 0;
    transition: 0s ease;
    -o-transition: 0s ease;
    -webkit-transition: 0s ease;
}

#toTop:hover {
    outline: none;
    background-position: right 0;
}

.clear {
    float: none !important;
    clear: both;
}

.clear.cl1 {
    height: 24px;
}

.clear.cl2 {
    height: 25px;
}
.white {
    color: #000;
    padding-bottom: 65px;
    background: url(../images/white_bg.png) 0 0 repeat-x #f5f5f5;
}

.white h1 {
    margin-bottom: 30px;
    font: bold 30px/30px 'Marvel', sans-serif;
    color: #c80b14;
    padding-top: 10px;
}
.white .col3 {
    color: #cd2808;
}
.wrapper, .extra_wrapper {
    overflow: hidden;
}

#img li img{
  width:150px;
  height: 150px;
  border:2px solid #e9e9e9;

}

@media screen and (min-width: 200px) and (max-width: 640px){
  footer {
    text-align:left;
}
}
  
/*=======================  Slider  =======================*/
div#slider {
    width: 80%;
    max-width: 1100px;
    overflow: hidden;
}

div#slider figure {
    position: relative; 
    width: 500%;
    margin: 0;
    padding: 0;
    font-size: 0;
    text-align: left;
    animation: 10s slidy infinite;
}

div#slider figure img {
    width: 20%;
    height: 40%;
    float: left;
}

@keyframes slidy {
    0%  { left: 0%; }
    15% { left: 0%; }
    20% { left: -100%; }
    35% { left: -100%; }
    40% { left: -200%; }
    55% { left: -200%; }
    60% { left: -300%; }
    75% { left: -300%; }
    80% { left: -400%; }
    95% { left: -400%; }
    100% { left: -400%; }
}
@media screen and (min-width: 200px) and (max-width: 640px){
    div#slider {
    width: 60%;
    max-width: 1100px;
    overflow: hidden;
}
     
 }

/*=======================  Slider1  =======================*/
* + .row {
  margin-top: 18px;
}
 
div#slider1 {
    width: 50%;
    max-width: 500px;
    overflow: hidden;
}

div#slider1 figure {
    position: relative; 
    width: 500%;
    margin: 0;
    padding: 0;
    font-size: 0;
    text-align: left;
    animation: 10s slidy infinite;
}

div#slider1 figure img {
    width: 20%;
    height: auto;
    float: left;
}

@keyframes slidy {
    0%  { left: 0%; }
    15% { left: 0%; }
    20% { left: -100%; }
    35% { left: -100%; }
    40% { left: -200%; }
    55% { left: -200%; }
    60% { left: -300%; }
    75% { left: -300%; }
    80% { left: -400%; }
    95% { left: -400%; }
    100% { left: -400%; }
}


/*=======================  Well  =======================*/
.well {
  padding-top: 50px;
  padding-bottom: 50px;
}

.well1 {
  padding-top: 32px;
  padding-bottom: 60px;
}

.well2 {
  padding-top: 40px;
  padding-bottom: 40px;
}

.well3 {
  padding-top: 59px;
  padding-bottom: 61px;
}

.well4 {
  padding-top: 90px;
  padding-bottom: 50px;
}

/*=======================  Banner  =======================*/
.banner_wr {
  position: relative;
  min-height: 308px;
}

.banner {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
}

.banner:before, .banner:after {
  display: table;
  content: "";
  line-height: 0;
}

.banner:after {
  clear: both;
}

.banner li {
  position: relative;
  margin-top: 30px;
  width: 25%;
  height: 250px;
  padding: 25px 29px 20px;
  float: left;
  color: #fff;
  background:#b48600;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  vertical-align: bottom;
  -moz-transition: 0.3s all ease;
  -o-transition: 0.3s all ease;
  -webkit-transition: 0.3s all ease;
  transition: 0.3s all ease;
}

.banner li:hover {
  margin-top: 0px;
  height: 280px;
  padding-bottom: 50px;
}

.banner li [class*="fa-"] {
  font-size: 62px;
  line-height: 1;
  color: inherit;
}

.banner li a {
  position: absolute;
  bottom: 25px;
  right: 10px;
}

.banner li a:before {
  font-family: "FontAwesome";
  font-size: 35px;
  line-height: 1;
  color: inherit;
  content: "";
  /* content: ""; */
}

.banner li a:hover {
  opacity: .7;
}

.banner li:hover a {
  right: 0px;
}

.banner li:nth-child(1) {
  background: url(../images/vet-pro1.jpg) right no-repeat;
  /* background: #57aacd; */
  border: 11px solid #fff;
}

.banner li:nth-child(2) {
  background: url(../images/epi11.jpg) right no-repeat;
  /* background: #55b0d6; */
  border: 11px solid #fff;
}

.banner li:nth-child(3) {
  background: url(../images/bro-num1.jpg) right no-repeat;
  /* background: #5bb7de; */
  border: 11px solid #fff;
}
.banner li:nth-child(4) {
  background: url(../images/vet-pro1.jpg) right no-repeat;
  /* background: #5bb7de; */
 border: 11px solid #fff;
}

.banner h3 {
  font-size: 35px;
  text-shadow: 1px 1px #aa7c00;
  color: #b48600;
}

.banner p {
  line-height: 28px;
  color: #fff;
}

.banner [class*="fa-"] + h3 {
  margin-top: 17px;
}

.banner h3 + p {
  margin-top: 13px;
}

@media (max-width: 1199px) {
  .banner {
    position: static;
  }
  
  .banner li {
    width: 50%;
    margin-top: 0;
  }
  
  .banner li a {
    right: 30px;
  }
  
  .banner li:hover {
    height: 358px;
    padding-bottom: 20px;
  }
}

@media (max-width: 767px) {
  .banner li {
    text-align: center;
    width: 100%;
    height: auto;
    margin-top: 20px;
  }
  
  .banner li a {
    margin-top: 30px;
    display: inline-block;
    position: static;
  }
  
  .banner li:hover {
    height: auto;
    margin-top: 20px;
}
.banner li:nth-child(1) {
  background: url(../images/vet-pro.jpg) right no-repeat;
  /* background: #57aacd; */
  border: 11px solid #fff;
}

.banner li:nth-child(2) {
  background: url(../images/epi.jpg) right no-repeat;
  /* background: #55b0d6; */
  border: 11px solid #fff;
}

.banner li:nth-child(3) {
  background: url(../images/bro-num.jpg) right no-repeat;
  /* background: #5bb7de; */
  border: 11px solid #fff;
}
.banner li:nth-child(4) {
  background: url(../images/vet-pro.jpg) right no-repeat;
  /* background: #5bb7de; */
 border: 11px solid #fff;
}


.banner li {
  position: relative;
  margin-top: 30px;
  width: 25%;
  height: 250px;
  padding: 25px 29px 20px;
  float: none;
}

.banner li:hover {
  height: 270px;
  padding-bottom: 40px;
}

.banner li a {
  position: absolute;
  bottom: 25px;
  right: 10px;
}
.banner h3 {
  font-size: 20px;
}
  }
@media screen and (min-width: 200px) and (max-width: 640px){
  .banner li:nth-child(1) {
  background: url(../images/vet-pro.jpg) right no-repeat;
  /* background: #57aacd; */
  border: 11px solid #fff;
}

.banner li:nth-child(2) {
  background: url(../images/epi.jpg) right no-repeat;
  /* background: #55b0d6; */
  border: 11px solid #fff;
}

.banner li:nth-child(3) {
  background: url(../images/bro-num.jpg) right no-repeat;
  /* background: #5bb7de; */
  border: 11px solid #fff;
}

.banner li {
  position: relative;
  margin-top: 30px;
  width: 25%;
  height: 250px;
  padding: 25px 29px 20px;
  float: none;
}

.banner li:hover {
  height: 270px;
  padding-bottom: 40px;
}

.banner li a {
  position: absolute;
  bottom: 25px;
  right: 10px;
}
.banner h3 {
  font-size: 20px;
}

}

/*=======================  Product List  =======================*/
.product-list li .box:hover .icon {
  background: #b48600;
}

.product-list li .box_cnt__no-flow {
  padding-left: 30px;
}

.product-list * + hr {
  margin-top: 50px;
}

.product-list hr + * {
  margin-top: 50px;
}

.product-list h3 + p {
  margin-top: 6px;
}

@media (max-width: 767px) {
  .product-list hr {
    display: none;
  }
  
  .product-list hr + * {
    margin-top: 30px;
  }
  
  .product-list li .box {
    text-align: center;
  }
  
  .product-list li .box_aside {
    float: none;
  }
  
  .product-list li .box_aside .icon {
    display: inline-block;
  }
  
  .product-list li .box_cnt__no-flow {
    margin-top: 20px;
    padding-left: 0;
  }
}
/*=======================  Main  =======================*/
main {
  display: block;
  background: #fff;
}

main .container.hr {
  padding-bottom: 50px;
}

main p + a[href^="mailto:"] {
  display: inline-block;
  margin-top: 10px;
  font-size: 16px;
  color: #8C5E00;
}

main p + a[href^="mailto:"]:hover {
  text-decoration: underline;
}

a[href^="callto:"]:hover {
  color: #8C5E00;
}

.video {
  position: relative;
  width: 100%;
  padding-bottom: 69%;
}

.video iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
