html, body {padding:0; margin:0; background:#ebebeb; min-width:320px;}
.wrapper {background:#f2f2f2; position:relative; z-index:10; margin-bottom:230px;}
.border-top {width:100%; height:20px; background:#fff; position:fixed; left:0; top:0; z-index:200;}
.border-bottom {width:100%; height:20px; background:#fff; position:fixed; left:0; bottom:0; z-index:200;}
.border-left {width:20px; height:100%; background:#fff; position:fixed; left:0; top:0; z-index:200;}
.border-right {width:20px; height:100%; background:#fff; position:fixed; right:0; top:0; z-index:200;}

.rightside {width:50%; float:right; position:fixed; top:0; right:0;}
.leftside {width:50%; float:left; padding-bottom:20px;}
.leftside img {display:block; opacity:0; width:90%; margin:0 0 0 20px;}

header {width:90%; max-width:565px; position:relative; margin:0;}
header div {display:inline-block; position:absolute; left:0; top:50px;}
header div img.icon-logo {display:block; margin:0 auto;}
header div h3 {padding:0; margin:-10px 0 0 0; font:normal 18px/25px 'texgyreadventorbold', 'lucida sans', arial, sans-serif; color:#000; text-align:center;}
header div h4 {padding:0; margin:0; font:normal 14px/20px 'texgyreadventorregular', 'lucida sans', arial, sans-serif; color:#929497; text-align:center;}
header .menutoggle {position:absolute; right:20px; top:90px; cursor:pointer; z-index:150;}

header ul {padding:0; margin:0; list-style:none; display:block; vertical-align:top; position:fixed; z-index:100; width:100%; left:20px; background:#f2f2f2; max-height:0; overflow:hidden;
transition:0.5s;
-webkit-transition:0.5s;
}
header ul li {display:inline-block; width:100%; max-width:100%; text-align:left; height:48px; padding:3px 0; border-bottom:1px solid #ddd;}
header ul li span {display:inline; float:left; padding-left:10px;}
header ul li span.ic {display:inline-block; padding:0;}
header ul li a img {display:block; padding-right:50px;}
header ul li a {display:block; text-align:left; font:normal 18px/48px 'texgyreadventorregular', 'lucida sans', arial, sans-serif; color:#666; text-decoration:none;}
header ul li a:hover {color:#3166af;}

header ul.toggle {max-height:500px; padding-bottom:50px; padding-top:130px;}

header ul li span.ic {display:block; width:45px; height:48px; background:red; margin:0 auto;
transition:0.5s;
-webkit-transition:0.5s;
}
header ul li span.icon1 {background:url(../../images/icon-home.png);}
header ul li span.icon2 {background:url(../../images/icon-centre-dentaire.png);}
header ul li span.icon3 {background:url(../../images/icon-saint-denis.png);}
header ul li span.icon4 {background:url(../../images/icon-dentiste.png);}
header ul li span.icon5 {background:url(../../images/icon-traitements-dentaires.png);}
header ul li span.icon6 {background:url(../../images/icon-edente-complet.png);}
header ul li span.icon7 {background:url(../../images/icon-implants-dentaires.png);}
header ul li span.icon8 {background:url(../../images/icon-contact-centre.png);}
header ul li:hover span.ic img {opacity:0;}

.content {margin-top:200px; width:90%; max-width:565px;}
.content h3 {padding:20px 0 10px 0; margin:0; font:normal 22px/33px 'texgyreadventorbold', 'lucida sans', arial, sans-serif; color:#212121;}
.content h4 {padding:6px 0; margin:0; font:normal 14px/21px 'texgyreadventorbold', 'lucida sans', arial, sans-serif; color:#212121;}
.content p {padding:0; margin:0; font:normal 16px/24px 'texgyreadventorregular', 'lucida sans', arial, sans-serif; color:#333;}
.content p a {font:normal 16px/24px 'texgyreadventorregular', 'lucida sans', arial, sans-serif; color:#3166af; text-decoration:underline; }
.content p a:hover {text-decoration:underline; color:#3166af;}

.content .social {margin-top:30px; height:62px; padding-left:80px; background:url(../images/partager.png) no-repeat left top;}
.content .social a {padding:0 30px 0 0; margin:0; font:normal 12px/16px 'texgyreadventorregular', 'lucida sans', arial, sans-serif; color:#212121; text-decoration:none;}
.content .social a.fb:hover {text-decoration:underline; color:#3a589e;}
.content .social a.tw:hover {text-decoration:underline; color:#16bde9;}
.content .social a.em:hover {text-decoration:underline; color:#3166af;}
.content dl {padding-top:30px;}
.content dl dt {padding:0 0 10px 0; margin:0; font:normal 18px/27px 'texgyreadventorbold', 'lucida sans', arial, sans-serif; color:#212121;}
.content dl dd {padding:0; margin:0;}
.content dl dd a {font:normal 16px/24px 'texgyreadventorregular', 'lucida sans', arial, sans-serif; color:#333; text-decoration:none;}
.content dl dd a:hover {text-decoration:underline; color:#3166af;}



footer {display:block; padding-top:30px; padding-bottom:40px; position:fixed; bottom:0; width:100%;}
footer .footer-inner {width:90%; max-width:1130px; position:relative; margin:0 auto;}
footer h3 {padding:0; margin:0; font:normal 18px/25px 'texgyreadventorbold', 'lucida sans', arial, sans-serif; color:#000; text-align:center;}
footer h4 {padding:0; margin:0; font:normal 14px/20px 'texgyreadventorregular', 'lucida sans', arial, sans-serif; color:#929497; text-align:center;}
footer .line {width:70%; height:1px; background:#c0c0c0; margin:20px auto 50px auto;}
footer .foot-links {float:right; margin-top:20px;}
footer .foot-links a {margin:0 0 0 20px; font:normal 14px/21px 'texgyreadventorbold', 'lucida sans', arial, sans-serif; color:#000; text-decoration:none;}
footer .foot-links a:hover {text-decoration:underline; color:#3166af;}
footer .address h5 {padding:0; margin:0; font:normal 14px/21px 'texgyreadventorbold', 'lucida sans', arial, sans-serif; color:#000;}
footer .address p {padding:0; margin:0; font:normal 14px/21px 'texgyreadventorregular', 'lucida sans', arial, sans-serif; color:#000;}

@media only screen and (max-width: 768px) {
.rightside {width:100%; max-width:90%; margin:0 auto; float:none; position:static; border-top:1px solid transparent;}
.leftside {width:100%; max-width:90%; margin:0 auto; float:none; padding-bottom:20px;}
header {margin:0; padding:0; max-width:100%; width:100%;}
header div {display:inline-block; position:absolute; top:50px;}
header .menutoggle {right:10px;}
.content {margin-top:180px; width:90%; max-width:700px;}

footer .foot-links {float:none; text-align:center; margin-bottom:10px;}
footer .foot-links a {margin:0 5px;}
footer .address {text-align:center;}
footer .line {margin:10px auto 30px auto;}
.content {padding-top:0; width:90%; max-width:700px;}
header ul {position:absolute; top:150px; left:0; width:100%;}
header ul.toggle {max-height:500px; padding-bottom:20px; padding-top:20px;}
.leftside img {display:block; opacity:0; width:95%; margin:0 auto;}
}
@media only screen and (max-width: 480px) {
.border-top,
.border-bottom,
.border-left,
.border-right {display:none;}
header div {left:50%; margin-left:-100px;}
header .menutoggle {top:50px;}
}
