@import url('https://fonts.googleapis.com/css?family=Montserrat:200,300,400');

body {background: #f7f7f7 url("../images/pattern.png") repeat top left;}

.gris {
  background: rgba(0, 0, 0, 0.2);
}

.gris:first-child {
  background: rgba(0, 0, 0, 0.1);
}

.col-md-6,.col-md-12 {
  height:100%;
}

.rubalise {background-image: repeating-linear-gradient(145deg, #eee, #eee 30px, orange 30px, orange 60px);}
.rubalisefine {background-image: repeating-linear-gradient(145deg, #fff, #fff 6px, orange 3px, orange 10px);}
.rubalise-miramas {height:15px;background-image: repeating-linear-gradient(145deg, #eee, #eee 30px, #01DDFF 30px, #01DDFF 60px);}
.rubalise-vauvert {height:15px;background-image: repeating-linear-gradient(145deg, #eee, #eee 30px, #00CE2C 30px, #00CE2C 60px);}
.rubalise-manosque {height:15px;background-image: repeating-linear-gradient(145deg, #eee, #eee 30px, #003B91 30px, #003B91 60px);}
.rubalise-avignon {height:15px;background-image: repeating-linear-gradient(145deg, #eee, #eee 30px, #D65050 30px, #D65050 60px);}
.rubalise-velleron, {height:15px;background-image: repeating-linear-gradient(145deg, #eee, #eee 30px, #00BEC8 30px, #00BEC8 60px);}

 
 
.lacarraire {background: url("../images/lacarraire.jpg")no-repeat;background-size: contraint; }
.velleron {background: url("../images/velleron.jpg") no-repeat;background-size: contraint; }
.vauvert {background: url("../images/vauvert.jpg") no-repeat ;background-size: contraint; }
.manosque {background: url("../images/manosque.jpg") no-repeat ;background-size: contraint; }
.avignon {background: url("../images/avignon.jpg") no-repeat ;background-size: contraint; }
 
.colorful {
	background:grey;
/*	background:
		-webkit-linear-gradient(45deg, hsla(181, 95%, 42%, 1) 0%, hsla(181, 95%, 42%, 0) 70%),
		-webkit-linear-gradient(315deg, hsla(252, 0%, 96%, 1) 10%, hsla(252, 0%, 96%, 0) 80%),
		-webkit-linear-gradient(225deg, hsla(227, 0%, 87%, 1) 10%, hsla(227, 0%, 87%, 0) 80%),
		-webkit-linear-gradient(135deg, hsla(217, 0%, 87%, 1) 100%, hsla(217, 0%, 87%, 0) 70%);
	background:
		linear-gradient(45deg, hsla(181, 95%, 42%, 1) 0%, hsla(181, 95%, 42%, 0) 70%),
		linear-gradient(135deg, hsla(252, 0%, 96%, 1) 10%, hsla(252, 0%, 96%, 0) 80%),
		linear-gradient(225deg, hsla(227, 0%, 87%, 1) 10%, hsla(227, 0%, 87%, 0) 80%),
		linear-gradient(315deg, hsla(217, 0%, 87%, 1) 100%, hsla(217, 0%, 87%, 0) 70%);*/
	}
	
	
.link {font-variant: small-caps;padding:0;margin:0;text-decoration:none;color:#999}
.link a {display:inline-block;color:#444; text-decoration:none;background:#FFF;padding:5px}
.link a:hover {color: #444;background:#EEE}
.link.grey {color:#999;text-align:left}
.link.grey a {display:inline-block;color:#F1A31B; text-decoration:none;background:#FFF;padding:5px;border-radius:30px;height:27px;width:27px;text-align:center}


.nom {font-family: Arial, Helvetica, sans-serif; color:#444; font-size:14px; font-variant: small-caps}
.adresse {font-family: Arial, Helvetica, sans-serif; font-size: 11px; color: #555; font-variant: small-caps; padding: 5px 0;	white-space: nowrap;}
img.logo {height:50px}

.col-left {width:100px }
.col-mid {width:200px }
.col-right {width:300px }

@media only screen and (min-width:320px) and (max-width: 580px) 
{
img.logo {height:30px}
.nom {font-family: Arial, Helvetica, sans-serif; color:#444; font-size:10px; font-variant: small-caps}
.adresse {font-family: Arial, Helvetica, sans-serif; font-size: 8px; color: #555; font-variant: small-caps; padding: 5px 0;}
.col-left {width:100px }
.col-mid {width:100px }
.col-right {width:100px }
		
}

    /* 3 equal-width columns Layout Pattern CSS */
    @media only screen and (max-width: 699px) {
        td[class="pattern"] table { width: 100%; }
        td[class="pattern"] .col{
            width: 33%;
        }
    }
    @media only screen and (max-width: 580px) {
        td[class="pattern"] .col{
            width: 100%;
            display: block;
        }
        td[class="pattern"] .col-left,
        td[class="pattern"] .col-mid {
            margin-bottom: 20px;
        }
    }
	
	.roll-button {
    position: relative;
    display: inline-block;
    font-family: 'Montserrat', sans-serif;
    font-size: 33px;
    line-height: 24px;
    font-weight: 700;
    padding: 12px 35px;
    color: #fff;
    text-transform: uppercase;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    -o-border-radius: 3px;
    border-radius: 3px;
    -webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
    -ms-transition: all 0.3s;
    -o-transition: all 0.3s;
    transition: all 0.3s;
}

.vcenter {
    display: inline-block;
    vertical-align: middle;
    float: none;
}

.center {
  display: block;
  margin-left: auto;
  margin-right: auto;
  width: 50%;
}

.classdutexte {
  display: none;
}
 
.classdutexte:hover {
  display: block;
}
.ombre {

-webkit-box-shadow: 10px 10px 54px -25px rgba(0,0,0,0.75);
-moz-box-shadow: 10px 10px 54px -25px rgba(0,0,0,0.75);
box-shadow: 10px 10px 54px -25px rgba(0,0,0,0.75);
}