/* mobile */
@media screen and (max-width: 768px)
{
    #back-table { background: url(images/back-table.png) center center; }
    #bak-1 { background: url(images/slide1b.jpg) top center; height: 400px; }
    #bak-2 { background: url(images/slide2b.jpg) top center; height: 400px; }
    #bak-3 { background: url(images/slide3.jpg) center center; height: 400px; }
    #bak-4 { background: url(images/slide4.jpg) top center; height: 400px; }
    #bak-5 { background: url(images/slide5.jpg) top right; height: 400px; }
    #bottom { display: none; }
    #col-20 { width: 100%; float:left; }
    #col-25 { width: 100%; float:left; }
    #col-33 { width: 100%; float:left; }
    #col-40 { width: 50%; float:left; }
    #col-50 { width: 50%; float:left; }
    #col-60 { width: 50%; float:left; }
    #col-1000 { max-width: 1000px; margin: auto; padding: 10px; }
    #col-1200 { max-width: 1200px; margin: auto; padding: 10px; }
    #col-height { padding: 30px; height: ; margin: 10px; background-color: #f5f5f5; }
    #col-web { padding: 20px; height: ; margin: 20px; background-color: #fff; border: 1px solid #eee; background-color: #fff; }
    #contact { width: 100%; background-color: #5a5953; padding-bottom: 40px; padding-top: 20px; color: #fff }
    #contenu { max-width: 100%; margin: auto; margin-top: 0px; margin-bottom: 0px; }
    #faq { position:fixed; top:50%; right:0px; z-index:21000; border: 1px solid #ddd; }
    #galerie-g { width: 100%; float:left; overflow: hidden; margin-right: 0%; margin-left: 0%; margin-top: 0%; margin-bottom: 0%; }
    #galerie-d { width: 100%; float:left; overflow: hidden; margin-right: 0%; margin-left: 0%; margin-top: 0%; margin-bottom: 0%; }
    #img { max-width: 100%; vertical-align: bottom; }
    #img70 { max-width: 70%; vertical-align: bottom; margin: 15%; }
    #img80 { max-width: 80%; vertical-align: bottom; margin: 10%; }
    #img100 { max-width: 100%; vertical-align: bottom; }
	#logo { width: 140px; float: none; position: absolute; top: 50px; left: 3%; z-index: 5500; }
    #menu { top: 0%; z-index: 2000; width: 100%; border: 0px solid #E9E9E9; background: #fff; }
    #order { border: 2px solid #fff; position: absolute; top: 25%; right: 50%; margin-right: -150px; z-index: 500; width: 300px color: #fff; text-decoration: none; font-size: 40px; padding: 6px; }
    #order2 { width: 350px; color: #fff; text-decoration: none; font-size: 30px; padding: 7px; padding-bottom: 10px; background: #ff0000; display: block; margin-top: 40px; border-radius: 4px; }
    #padding-40 { padding: 10px; }
    #titre { float: none; top: 43px; left: 0px; z-index: 1000; width: 100%; position: fixed; }
    #top { float: none; position: fixed; bottom: 0px; right: 0px; z-index: 5000; }
    #top2 { display: none; }
}

/* tablette */
@media screen and (min-width: 769px) and (max-width: 1024px)
{
    #back-table { background: url(images/back-table.png) center center; }
    #bak-1 { background: url(images/slide1b.jpg) top center; height:800px; }
    #bak-2 { background: url(images/slide2b.jpg) top center; height:740px; }
    #bak-3 { background: url(images/slide3.jpg) center center; height:800px; }
    #bak-4 { background: url(images/slide4.jpg) top center; height:800px; }
    #bak-5 { background: url(images/slide5.jpg) top right; height:800px; }
    #bottom { float: none; position: absolute; bottom: 5%; z-index: 500; float: none; left: 50%; margin-left: -35px; width:70px; }
    #col-20 { width: 50%; float:left; }
    #col-25 { width: 50%; float:left; }
    #col-33 { width: 33%; float:left; }
    #col-40 { width: 40%; float:left; }
    #col-50 { width: 50%; float:left; }
    #col-60 { width: 60%; float:left; }
    #col-1000 { max-width: 1000px; margin: auto; padding: 20px; }
    #col-1200 { max-width: 1200px; margin: auto; padding: 20px; }
    #col-height { padding: 10px; height: ; margin: 20px; background-color: #f5f5f5; }
    #col-web { padding: 20px; height: ; margin: 10px; background-color: #fff; border: 1px solid #eee; background-color: #fff; }
    #contact { width: 100%; background-color: #5a5953; padding-bottom: 40px; padding-top: 20px; color: #fff }
    #contenu { max-width: 100%; margin: auto; margin-top: 0px; margin-bottom: 0px; }
    #faq { position:fixed; top:50%; right:0px; z-index:21000; border: 1px solid #ddd; }
    #galerie-g { width: 48.5%; float:left; overflow: hidden; margin-right: 0.5%; margin-left: 1%; margin-top: 0.5%; margin-bottom: 0.5%; }
    #galerie-d { width: 48.5%; float:left; overflow: hidden; margin-right: 1%; margin-left: 0.5%; margin-top: 0.5%; margin-bottom: 0.5%; }
    #img { max-width: 100%; vertical-align: bottom; }
    #img70 { max-width: 70%; vertical-align: bottom; margin: 15%; }
    #img80 { max-width: 80%; vertical-align: bottom; margin: 10%; }
    #img100 { max-width: 100%; vertical-align: bottom; }
	#logo { width: 140px; float: none; position: absolute; top: 50px; left: 3%; z-index: 5500; }
    #menu { float:none; position:fixed; top:0%; z-index:2000; width:100%; border:1px solid #E9E9E9; background:#fff; }
    #mobile { display: none; }
    #order { border: 2px solid #fff; position: absolute; top: 25%; right: 50%; margin-right: -150px; z-index: 500; width: 300px; color: #fff; text-decoration: none; font-size: 40px; padding: 6px; }
    #order2 { width: 350px; color: #fff; text-decoration: none; font-size: 30px; padding: 7px; padding-bottom: 10px; background: #ff0000; display: block; margin-top: 40px; border-radius: 4px; }
    #padding-40 { padding: 40px; }
    #titre { float: none; top: 43px; left: 0px; z-index: 1000; width: 100%; position: fixed; }
    #top { display: none; }
    #top2 { float: none; position: fixed; bottom: 20px; right: 40px; z-index: 5000; }
}

/* bureau */
@media screen and (min-width: 1025px)
{
    #back-table { background: url(images/back-table.png) center center; }
    #bak-1 { background: url(images/slide1b.jpg) top center; height:800px; }
    #bak-2 { background: url(images/slide2b.jpg) top center; height:740px; }
    #bak-3 { background: url(images/slide3.jpg) center center; height:800px; }
    #bak-4 { background: url(images/slide4.jpg) top center; height:800px; }
    #bak-5 { background: url(images/slide5.jpg) top right; height:800px; }
    #bottom { float: none; position: absolute; bottom: 10%; z-index: 500; float: none; left: 50%; margin-left: -35px; width:70px; }
    #col-20 { width: 20%; float:left; }
    #col-25 { width: 25%; float:left; }
    #col-33 { width: 33%; float:left; }
    #col-40 { width: 40%; float:left; }
    #col-50 { width: 50%; float:left; }
    #col-60 { width: 60%; float:left; }
    #col-1000 { max-width: 1000px; margin: auto; padding: 20px; }
    #col-1200 { max-width: 1200px; margin: auto; padding: 20px; }
    #col-height { padding: 30px; height: ; margin: 20px; background-color: #f5f5f5; }
    #col-web { padding: 20px; height: ; margin: 10px; background-color: #fff; border: 1px solid #eee; background-color: #fff; }
    #contact { width: 100%; background-color: #5a5953; padding-bottom: 40px; padding-top: 20px; color: #fff }
    #contenu { max-width: 100%; margin: auto; margin-top: 0px; margin-bottom: 0px; }
    #faq { position:fixed; top:50%; right:0px; z-index:21000; border: 1px solid #ddd; }
    #galerie-g { width: 48.5%; float:left; overflow: hidden; margin-right: 0.5%; margin-left: 1%; margin-top: 0.5%; margin-bottom: 0.5%; }
    #galerie-d { width: 48.5%; float:left; overflow: hidden; margin-right: 1%; margin-left: 0.5%; margin-top: 0.5%; margin-bottom: 0.5%; }
    #img { max-width: 100%; vertical-align: bottom; }
    #img70 { max-width: 70%; vertical-align: bottom; margin: 15%; }
    #img80 { max-width: 80%; vertical-align: bottom; margin: 10%; }
    #img100 { max-width: 100%; vertical-align: bottom; }
	#logo { width: 140px; float: none; position: absolute; top: 50px; left: 3%; z-index: 5500; }
    #menu { float:none; position:fixed; top:0%; z-index:2000; width:100%; border:1px solid #E9E9E9; background:#fff; }
    #mobile { display: none; }
    #order { border: 2px solid #fff; position: absolute; top: 25%; right: 50%; margin-right: -150px; z-index: 500; width: 300px; color: #fff; text-decoration: none; font-size: 40px; padding: 6px; }
    #order2 { width: 350px; color: #fff; text-decoration: none; font-size: 30px; padding: 7px; padding-bottom: 10px; background: #ff0000; display: block; margin-top: 40px; border-radius: 4px; }
    #padding-40 { padding: 40px; }
    #titre { float: none; top: 43px; left: 0px; z-index: 1000; width: 100%; position: fixed; }
    #top { display: none; }
    #top2 { float: none; position: fixed; bottom: 20px; right: 40px; z-index: 5000; }
}