/* ------- Home ------- */

html#home { 
  margin:0;
  padding:0;
  background: url(../images/prague-bg.jpeg) no-repeat center fixed; 
  -webkit-background-size: cover; /* pour anciens Chrome et Safari */
  background-size: cover; /* version standardisée */
}

html#prague2 { 
  margin:0;
  padding:0;
  background: url(../images/prague2-bg.jpg) no-repeat center fixed; 
  -webkit-background-size: cover; /* pour anciens Chrome et Safari */
  background-size: cover; /* version standardisée */
}

html#prague3 { 
  margin:0;
  padding:0;
  background: url(../images/prague3-bg.jpg) no-repeat center fixed; 
  -webkit-background-size: cover; /* pour anciens Chrome et Safari */
  background-size: cover; /* version standardisée */
}

html#prague4 { 
  margin:0;
  padding:0;
  background: url(../images/prague4-bg.jpg) no-repeat center fixed; 
  -webkit-background-size: cover; /* pour anciens Chrome et Safari */
  background-size: cover; /* version standardisée */
}

html#berlin { 
  margin:0;
  padding:0;
  background: url(../images/berlin3-bg.jpg) no-repeat center fixed; 
  -webkit-background-size: cover; /* pour anciens Chrome et Safari */
  background-size: cover; /* version standardisée */
}

html#vienne { 
  margin:0;
  padding:0;
  background: url(../images/vienne-bg.jpg) no-repeat center fixed; 
  -webkit-background-size: cover; /* pour anciens Chrome et Safari */
  background-size: cover; /* version standardisée */
}

html#budapest { 
  margin:0;
  padding:0;
  background: url(../images/budapest-bg.jpg) no-repeat center fixed; 
  -webkit-background-size: cover; /* pour anciens Chrome et Safari */
  background-size: cover; /* version standardisée */
}

html#bratislava { 
  margin:0;
  padding:0;
  background: url(../images/bratislava-bg.jpg) no-repeat center fixed; 
  -webkit-background-size: cover; /* pour anciens Chrome et Safari */
  background-size: cover; /* version standardisée */
}

body {
    font-family: Sans PT, Arial, sans-serif;
    min-width: 320px;
}

.content-text {
  padding: 20px;
  font-family: 'PT Sans', sans-serif;
  color: #000;
  font-size : 17px;
}

img.logo {
	position: absolute;
	display: block;
	margin-left: 40%;
	margin-top: 1%;
	height: 105px;
	width: ;
	z-index: 9999;
}

#event img{
	position: absolute;
    width:;
    height:;
	padding-left: 23%;
	padding-top: 12%;
	z-index: 8;
}

#dmc img{
	position: absolute;
    width:;
    height:;
	padding-left: 59%;
	padding-top: 12%;
	z-index: 2;
}

.content-text h2 {
  color: #ec432e;
  font-size:30px;
  margin-bottom: 14px;
}

.gauche{
  float: left;
  width: 20%;
  font-size: 16px;
}
.gauche a:visited{
color: #000
}
.gauche a:link{
color: #000
}

.centre{
  float: left;
  width: 40%;
  font-size: 16px;
  margin-left: 5%;
}
.droite a:visited{
color: #000
}
.droite a:link{
color: #000
}

.droite{
  float: left;
  width: 25%;
  font-size: 16px;
  margin-left: 10%;
}

.intro{
  width: 60%;
  margin-left: 20%;
  font-size: 16px;
}

/* ------ Header ------ */

#header {
	height: 110px;
	width: 100%;
	position: fixed;
    background-color: rgba(235, 235, 235, 1);
    position relative;
    margin-top: -8px;
    margin-left: -5px;
    z-index: 99;
}





/* ------ Town Banner ------ */

.town-banner {
  position: absolute;
  width:250px;
  height: 200px;
}

.town-banner.prague {
  background: url(../images/pprague3.jpg) no-repeat;
  margin-left: 24%;
  margin-top: 5%;
}

.town-banner.budapest {
  background: url(../images/bbudapest.jpeg) no-repeat;
  margin-left: 58%;
  margin-top: 5%;
}

.town-banner.bratislava {
  background: url(../images/bbratislava.jpeg) no-repeat;
  margin-left: 75%;
  margin-top: 5%;
}

.town-banner.vienna {
  background: url(../images/vvienne.jpeg) no-repeat;
  margin-left: 7%;
  margin-top: 5%;
}

.town-banner.berlin {
  background: url(../images/bberlin.jpg) no-repeat;
  margin-left: 41%;
  margin-top: 5%;
}

.town-banner a {
  display:block;
  width:100%; height: 100%;
}

.town-banner a:hover span {
  background: #ec432e;
}

.town-banner span {
  display:block;
  background: #c5331f;
  background: rgba(197,51,31,0.8);
  color: white;
  font-weight:bold;
  padding: 3px 8px 3px 8px;
  font-size: 18px;
  position: absolute;
  left:10px;
  bottom:10px;
}

.town-banner.big span {
    font-size: 28px;
}

.town-banner.big.prague {
  background: url(../images/banner_prague.jpg) no-repeat;
  margin-left: 23%;
  margin-top: 20px;
  position: relative;
  width:680px;
  height: 160px;
}

.town-banner.big.budapest {
  background: url(../images/banner_budapest.jpg) no-repeat;
  margin-left: 23%;
  margin-top: 20px;
  position: relative;
  width:680px;
  height: 160px;
}

.town-banner.big.bratislava {
  background: url(../images/banner_bratislava.jpg) no-repeat;
  margin-left: 23%;
  margin-top: 20px;
  position: relative;
  width:680px;
  height: 160px;
}

.town-banner.big.vienna {
  background: url(../images/banner_vienna.jpg) no-repeat;
  margin-left: 23%;
  margin-top: 20px;
  position: relative;
  width:680px;
  height: 160px;
}

.town-banner.big.berlin {
  background: url(../images/banner_berlin.png) no-repeat;
  margin-left: 23%;
  margin-top: 20px;
  position: relative;
  width:680px;
  height: 160px;
}



/* ------- Footer ------- */


.mid_content_info {
    float: left;
    font-size: 13px;
    margin-top: 0px;
    margin-left: 25%;
    width: 450px;
}

#mid_content a:visited{
color: #000
}
#mid_content a:link{
color: #000
}
#mid_content a:hover{
color: #ec432e
}

.mid_content_info h2 {
    font-size: 16px;
    font-weight: bold;
    height: 28px;
    margin-bottom: 15px;
    margin-left: 50px;
    padding: 12px 0 0 59px;
}

.mid_content_info a {
    color: #000;
 text-decoration:none; 
}

.mid_content_info a:hover
{
color: #FF5B46;
text-decoration: underline;
}

#mid_content {
    border-bottom: 2px solid #ec432e;
    height: 0px;
}

#facebook {
    background: url(../images/icon-facebook.png) no-repeat;
}

#youtube {
    background: url(../images/icon-youtube.png) no-repeat;
}

#linkedin {
    background: url(../images/icon-linkedin.png) no-repeat;
}

p#copyright {
    clear: both;
    float: left;
    font-size: 16px;
    color: #000;
}

#contact {
    background: url(../images/tel.png) no-repeat left;
}

#about {
    background: url(../images/stylo.png) no-repeat left;
}

#copyright {
    line-height: 18px;
    margin-left: -1%;
}

#footer_connect {
    width: 313px;
}

#footer_connect a {
    float: left;
    height: 91px;
    margin: 0 0 0 18px;
    margin-left: 20px;
    margin-top: -90px;
    text-indent: -9999px;
    width: 50px;
}

#footer_logo {
    background: url(../images/petit-logo.png) no-repeat;
    display: block;
    float: right;
    margin-right: 2%;
    margin-top: -5%;
    height: 52px;
    text-indent: -9999px;
    width: 171px;
    z-index: 1;
}


/* ------ Menu ------*/

.container {
    margin: auto;
    width: 1300px;
}

h1 {
    float: left;
    margin-top: 37px;
}

h1 a {
    background: url(../images/petit-logo.png) no-repeat;
    display: block;
    height: 52px;
    text-indent: -9999px;
    width: 171px;
    margin-left: -10px;
}

.content-text {
  padding: 20px;
}

.content-text h2 {
  color: #ec432e;
  font-size:30px;
  margin-bottom: 14px;
}

#main_menu {
    float: left;
    margin-top: 3%;
    margin-left: 5%;
    z-index: 1;
    
}

.first_list {
    float: left;
    margin: 0 14px;
    z-index: 1;
    list-style-type: none;
}

.main_menu_first {
    color: #ec432e;
    font-size: 13px;
    font-weight: bold;
    padding: 8px 8px;
    text-transform: uppercase;
    z-index: 1;
    text-decoration: none;
}

.main_menu_first:hover {
    border-top: 5px solid #ec432e;
    z-index: 1;
}

.with_dropdown {
    position: relative;
    z-index: 1;
}

.with_dropdown li a {
    display: block;
    z-index: 1;
}

.with_dropdown ul {
    background-color: rgba(255, 255, 255, 0.7);
    border-bottom: 5px solid #ec432e;
    padding: 12px 0;
    position: absolute;
    top: 24px;
    visibility: hidden;
    width: 197px;
    z-index: 1;
}

.first_list:hover.first_list ul {
    visibility: visible;
    z-index: 1;
}

.with_dropdown .main_menu_first {
    background: url(../images/arrow_down.png) no-repeat 92%;
    padding-right: 23px;
    z-index: 1;
}

.with_dropdown:hover .main_menu_first {
    background: #fff url(../images/arrow_down.png) no-repeat 92%;
    border-top: 5px solid #ec432e;
    color: #ec432e;
    z-index: 1;
}

.second_list {
    margin: 0 5px;
    padding: 10px;
    z-index: 1;
    list-style-type: none; 
    text-decoration: none;
}

.second_list_border {
    border-bottom: 1px solid #ec432e;
    z-index: 1;
}

.main_menu_second {
    color: #000;
    font-size: 13px;
    text-transform: capitalize;
    z-index: 1;
    text-decoration: none;
}

.main_menu_second:hover {
    color: #ec432e;
    z-index: 1;
}

/* ------ Slide ------ */


#slideshow {
	position: relative;
	width: 980px;
	height: 461px;
	padding: 15px;
	margin: 0 auto 2em;
	border: 1px solid #ddd;
	background: #FFF;
	/* CSS3 effects */
	background: linear-gradient(#FFF, #FFF 20%, #EEE 80%, #DDD);
	border-radius: 2px 2px 2px 2px;
	box-shadow: 0 0 3px rgba(0,0,0, 0.2);
}
 
/* avanced box-shadow
 * tutorial @
 * http://www.creativejuiz.fr/blog/les-tutoriels/ombre-avancees-avec-css3-et-box-shadow 
*/
#slideshow:before,
#slideshow:after {
	position: absolute;
	bottom:16px;
	z-index: -10;
	width: 50%;
	height: 20px;
	content: " ";
	background: rgba(0,0,0,0.1);
	border-radius: 50%;
	box-shadow: 0 0 3px rgba(0,0,0, 0.4), 0 20px 10px rgba(0,0,0, 0.7);
}
#slideshow:before {
	left:0;
	transform: rotate(-4deg);
}
#slideshow:after {
	right:0;
	transform: rotate(4deg);
}

/* gestion des dimensions et débordement du conteneur */
#slideshow .container {
	position:relative;
	width: 980px;
	height: 461px;
	overflow: hidden;
}
	
/* on prévoit un petit espace gris pour la timeline */
#slideshow .container:after {
	position:absolute;
	bottom: 0; left:0;
	content: " ";
	width: 100%;
	height: 1px;
	background: #999;
}
/* 
   le conteneur des slides
   en largeur il fait 100% x le nombre de slides
*/
#slideshow .slider {
	position: absolute;
	left:0; top:0;
	width: 500%;
	height: 461px;
}

/* annulation des marges sur figure */
#slideshow figure {
	position:relative;
	display:inline-block;
	padding:0; margin:0;
}
/* petit effet de vignette sur les images */
#slideshow figure:after {
	position: absolute;
	display:block;
	content: " ";
	top:0; left:0;
	width: 100%; height: 100%;
	box-shadow: 0 0 65px rgba(0,0,0, 0.5) inset;
}

/* styles de nos légendes */
#slideshow figcaption {
	position:absolute;
	left:0; right:0; bottom: 5px;
	padding: 20px;
	margin:0;
	border-top: 1px solid rgb(225,225,225);
	text-align:center;
	letter-spacing: 0.05em;
	word-spacing: 0.05em;
	font-family: Calibri, Trebuchet MS, Georgia, Times, serif;
	background: #fff;
	background: rgba(255,255,255,0.7);
	color: #ec432e;
	text-shadow: -1px -1px 0 rgba(255,255,255,0.3);
}

@-webkit-keyframes slider {
	0%, 15%, 100%	{ left: 0 }
	20%, 35%		{ left: -100% }
	40%, 55%		{ left: -200% }
	60%, 75%		{ left: -300% }
	80%, 95%		{ left: -400% }
}
@-moz-keyframes slider {
	0%, 15%, 100%	{ left: 0 }
	20%, 35%		{ left: -100% }
	40%, 55%		{ left: -200% }
	60%, 75%		{ left: -300% }
	80%, 95%		{ left: -400% }
}
@-o-keyframes slider {
	0%, 15%, 100%	{ left: 0 }
	20%, 35%		{ left: -100% }
	40%, 55%		{ left: -200% }
	60%, 75%		{ left: -300% }
	80%, 95%		{ left: -400% }
}
@keyframes slider {
	0%, 15%, 100%	{ left: 0 }
	20%, 35%		{ left: -100% }
	40%, 55%		{ left: -200% }
	60%, 75%		{ left: -300% }
	80%, 95%		{ left: -400% }
}


/* complétez le sélecteur : */
#slideshow .slider {
	/* ... avec la propriété animation */
	animation: slider 40s infinite;
}

#timeline {
	position: absolute;
	background: #999;
	bottom: 15px;
	left: 15px;
	height: 1px;
	background: rgb(236,67,46);
	background: rgba(236,67,46,1);
	width: 0;
	/* fonction d'animation */
	animation: timeliner 40s infinite;
}

@-webkit-keyframes timeliner {
	0%, 20%, 40%, 60%, 80%, 100%	{ width: 0;		}
	15%, 35%, 55%, 75%, 95%			{ width: 980px;	}
}
@-moz-keyframes timeliner {
	0%, 20%, 40%, 60%, 80%, 100%	{ width: 0;		}
	15%, 35%, 55%, 75%, 95%			{ width: 980px;	}
}
@-o-keyframes timeliner {
	0%, 20%, 40%, 60%, 80%, 100%	{ width: 0;		}
	15%, 35%, 55%, 75%, 95%			{ width: 980px;	}
}
@keyframes timeliner {
	0%, 20%, 40%, 60%, 80%, 100%	{ width: 0;		}
	15%, 35%, 55%, 75%, 95%			{ width: 980px;	}
}

@-webkit-keyframes figcaptionner {
	0%, 20%, 40%, 60%, 80%, 100%						{ bottom: -55px;	}
	5%, 15%, 25%, 35%, 45%, 55%, 65%, 75%, 85%, 95%		{ bottom: 5px;		}
}
@-moz-keyframes figcaptionner {
	0%, 20%, 40%, 60%, 80%, 100%						{ bottom: -55px;	}
	5%, 15%, 25%, 35%, 45%, 55%, 65%, 75%, 85%, 95%		{ bottom: 5px;		}
}
@-o-keyframes figcaptionner {
	0%, 20%, 40%, 60%, 80%, 100%						{ bottom: -55px;	}
	5%, 15%, 25%, 35%, 45%, 55%, 65%, 75%, 85%, 95%		{ bottom: 5px;		}
}@keyframes figcaptionner {
	0%, 20%, 40%, 60%, 80%, 100%						{ bottom: -55px;	}
	5%, 15%, 25%, 35%, 45%, 55%, 65%, 75%, 85%, 95%		{ bottom: 5px;		}
}

/* ajouter à l'élément : */
#slideshow figcaption {
	/* ... la propriété animation */
	animation: figcaptionner 40s infinite;
}


/* ------ Tableau ------ */

.hide { 
  position: absolute;
  top: -9999px;
  left: -9999px;
}

#tabs {
  margin-left: 18%;
  margin-top: ;
  font-size: 16px;
}

#tabs .list-wrap {
  margin-bottom: 20px;
  padding:10px;
  width:798px;
  background: url(../images/content-bg.png);
  box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.4);
  font-family: 'PT Sans', sans-serif;
  color: #555;
}

#tabs .list-wrap p {
  margin-bottom: 0;
}

#tabs ul.nav {
  position: relative;
  left:-5%;
  top: 1px;
  margin:0;
  z-index:0;
}

#tabs ul.nav li {
  float:left;
  display:inline-block;
  padding: 2px;
  width: 160px; height: 38px;
  text-align:center;
  background: #D9D9D9;
  line-height: 18px;
}

#tabs ul.nav.services li {
  width: 270px;
  line-height: 18px;
}
 
#tabs ul.nav li.last {
  margin-right:0;
}

#tabs ul.nav li a {
  text-decoration:none;
  display:block;
  width:100%; height: 100%;
  color:#555;

  border: 1px solid #cecece;
  border-bottom: none;
  text-shadow: 0 1px 0 #eee;
  background: url(../images/tabs-bg-current.png) repeat-x;

  -webkit-border-top-left-radius: 3px;
  -webkit-border-top-right-radius: 3px;
  -moz-border-radius-topleft: 3px;
  -moz-border-radius-topright: 3px;
  border-top-left-radius: 3px;
  border-top-right-radius: 3px;
}

#tabs ul.nav li a:hover {
  background: #E6E7E8;
  color:#555;
}

#tabs ul.nav li a.current {
  color:#fff;
  border: 1px solid #ec432e;
  border-bottom: none;
  background: #ec432e url(../images/tabs-bg.png) repeat-x;
  text-shadow: 0 1px 0 #444;
}

#tabs td.hour {
  text-align:right;
  font-weight:bold;
  width: 30px;
}

#tabs td {
  vertical-align: text-top;
}

#tabs td.nadpis {

  text-align:right;
  color: #ec432e;
  width:110px;
  padding-right: 10px;
  font-weight:bold;
}

#tabs h3 {
  margin-bottom: 5px;
}

.content-text h3 {
  color: #ec432e;
  margin-bottom: 5px;
}

.fleft {
  float: left;          
}

#tabs a:visited {
color: #555;
}

#tabs a:link {
color: #555;
}

a:hover
{
text-decoration: underline;
}


/* ------ Devis ------ */

.formular label {
  width: 35%;
  margin-right: 20px;
  text-align:right;
}

.formular span.star {
  color: #ec432e;
  font-size:16px;
}

.formular span.star.title {
  margin-left:38%;
}

.formular fieldset {
  
}

input[type="submit"] {
  border-radius: 3px;
  padding: 3px;
  border: none;
  background: #ec432e url(../images/inputs.png) repeat-x;
  color:#fff;
  cursor: pointer;
}

@-moz-document url-prefix() { 
  input[type="submit"] {
    padding: 2px;
  }
}

input[type="submit"]:hover {
  background: #ff0000 
}

.formular input[type=submit] {
  width: 70px;
  margin-left: 40%;
}

.formular td {
  width:161px;
}

.formular.es td {
  width:inherit;
}

.formular input[type=text], .formular input[type=email], .formular textarea {
  border-radius: 3px;
  width: 370px;
  margin: 2px 0 2px 0;
  border: 1px solid #d5d5d5;
  padding: 0 5px 0 5px;
  outline:none;
  height: 20px;
}

.formular textarea:focus{
  border: 1px solid #737373;
}

.textarea {
  padding-top: 10px;
}

.formular input:focus {
  border: 1px solid #737373;
}

.formular input[type=checkbox] {
  width: 12px;
}

.formular textarea {
  height: 100px;
}

.formular input#date, .formular input#date2 {
  width: 100px;
}
.formular input#flexible {
  margin-left: 170px;
}

.formular input#zip {
  width: 80px;
}

.formular input#phone, .formular input#fax{
  width: 120px;
}

.formular input#web, .formular input#mail {
  width: 140px;
}


/* ------ Reference ------ */

.gal-container {
  width:602px;
  height: 302px;
  position: relative;
  margin:auto;
}

.gal-container:hover #next, .gal-container:hover #prev {
  visibility: visible;
  opacity:1;
}

#gallery-ref {
  width: 602px;
  height: 302px;
  margin:auto;
}

.photo{
width: 80%;
float: left;
margin: 10%;
margin-top: 0px;
}



.alexandre {
  width: 167px;
  height: 250px;
  background: url(../images/alexandre.png) no-repeat;
  margin-left: 9%;
  margin-top: 5%;
}

.lisa {
  width:167px;
  height: 250px;
  background: url(../images/lisa-cabanier.jpg) no-repeat;
  margin-left: 26%;
  margin-top: 5%;
}

.bertrand {
  width: 167px;
  height: 250px;
  background: url(../images/bertrand.png) no-repeat;
  margin-left: 43%;
  margin-top: 5%;
}

.monika {
  width: 167px;
  height: 250px;
  background: url(../images/monika.png) no-repeat;
  margin-left: 60%;
  margin-top: 5%;
}

.michal {
  width: 167px;
  height: 250px;
  background: url(../images/michal.png) no-repeat;
  margin-left: 77%;
  margin-top: 5%;
}



/* ------ Newsletter ------ */

.content-top-border {
  height:3px;
  background: url(../images/content-top-border.png) repeat-x;
}

.wrapper {
	margin-right: 9%;
	margin-top: 26%;
	float: right;
}

.subscribe {
	background: #F3F3F3;
	box-shadow: 3px 3px 5px rgba(0,0,0,0.8);
	width: 340px;
}

.subscribe-wrapper {
	padding: 1px;
}

.subscribe h2 {
	text-align:center;
	margin-bottom: 5px;
	color: #ec432e;
	text-shadow: 0 1px 0 #F5F5F5;
}

.subscribe input[type="text"] {
	border-radius: 20px;
	width:190px; height: 18px;
	position: relative;
	left: 0px;
	outline: none;
	border: 1px solid #ABADB3;
}

.subscribe input[type="text"]:focus {
	border: 1px solid #333;
}

.subscribe.size input[type="submit"] {
	position: relative;
	left: 25px;
	font-size: 17px;
}