/* Theme Name: Nsink Theme URI: http://www.nsink.fr/ Description: Thème Agence Webmarketing Hôtelier Nsink Author: nsink Version: 1.0 License: GNU General Public License Tags: black, blue, white, two-columns, fixed-width, custom-header, custom-background, threaded-comments, sticky-post, translation-ready, microformats, rtl-language-support, editor-style, custom-menu */ /** COULEURS #222222 = Texte Gris foncé #fe8040 = Liens h1, h2, h3 Orange #424248 = Gris anthracite Logo #c5c4c4 = Gris CLair Comme logo #f5f5f5 = gris sidebar **/ /* ===================== BASIQUE ===================== */ html, div, span, applet, object, iframe, blockquote, a, abbr, acronym, address, big, cite, code, del, dfn, font, img, ins, kbd, q, s, samp, strike, sub, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td{ background:transparent; border:0; font-size:100%; margin:0; outline:0; padding:0; vertical-align:baseline;} body { background-color:#ffffff; font-family: Helvetica, Arial; font-size: 14x; color: #424248; margin: 0; padding: 0;} h1, h2, h3, h4, h5, h6, ul, li, p, em, strong, pre, code{ font-size:100%; font-style:normal; font-weight:400; line-height:inherit; margin:0; padding:0;} a img, img, a{ border:0; text-decoration:none;} a{ color:#fe8040; text-decoration:none;} a:hover{ text-decoration:underline;} form{ display:block;} label, button{ cursor:pointer;} strong{ font-weight:bold;} em{font-style: italic} p{ margin:10px 0; font-size: 14px } ul, li{ list-style:none; margin:0; padding:0;} .orange {font-size:13px; color: #fe8040} .gris {color: #222222} .bleu {color: #447b9c} .title {font-size:15px; font-weight:bold; color:#447b9c} ul.list li {list-style:url(img/puce-orange.gif) inside; color:#424248; font-size:14px; padding-left: 20px; line-height: 20px} .justify{ text-align:justify} .divider {background: url(img/title-bg.png) top left no-repeat; display: block; height: 17px; width: 466px; margin: 25px auto;} .cb {clear: both} .cl {clear: left} .cr {clear: right} .quote { color:#777777; font-family:serif; font-size:20px; line-height:40px; font-style:italic;} p.quote {background: url(img/quote.png) 0% 20% no-repeat; font-family: Calibri, Arial, Serif; color:#777777; padding: 30px 20px 30px 55px; border-bottom:1px solid #c5c4c4; border-top:1px solid #c5c4c4; min-height:32px; margin-top:30px; margin-bottom:20px; width: 605px} /* ===================== TITRE Hn ===================== */ h1 { font:normal 16px Century Gothic, arial, serif; font-weight:bold; margin:7px 0 7px 0; color:#424248} h2 { font:normal 16px Century Gothic, arial, serif; font-weight:bold; margin:10px 0 10px 0; color:#424248} h3 { font:normal 16px Century Gothic, arial, serif; font-weight:bold; margin:10px 0 10px 0; color:#424248} /* ===================== WRAP ===================== */ .wrap{position:relative;width: 990px; margin: 0 auto; } /* ===================== HEADER ===================== */ #header { height: 110px;} a.logo{ -webkit-transition:All 1s ease; -moz-transition:All 1s ease; -o-transition:All 1s ease; -webkit-transform: rotate(0deg) scale(1) skew(0deg) translate(0px); -moz-transform: rotate(0deg) scale(1) skew(0deg) translate(0px); -o-transform: rotate(0deg) scale(1) skew(0deg) translate(0px); } a.logo:hover, a.logo:focus, a.logo:active { -webkit-transform: rotate(-5deg) scale(1) skew(0deg) translate(-15px); -moz-transform: rotate(-5deg) scale(1) skew(0deg) translate(-15px); -o-transform: rotate(-5deg) scale(1) skew(0deg) translate(-15px); } .logo { display:block; width:190px; height: 75px; margin-top:3px; float:left;} /* ===================== TOP MENU ===================== */ #top-menu {float:right; background-color:#424248 ; height: 22px; margin-top: 0px; -webkit-border-bottom-right-radius: 10px; -webkit-border-bottom-left-radius: 10px; -moz-border-radius-bottomright: 10px; -moz-border-radius-bottomleft: 10px; border-bottom-right-radius: 10px; border-bottom-left-radius: 10px; padding: 5px 10px 0 10px; } #top-menu ul li { list-style: none; display: block; margin: 0; float: left; padding:0 6px; } #top-menu ul li a { font:normal 11px 'Droid Sans', arial, serif; color:#ffffff; display: block; text-decoration: none; float: left; padding:2px; -webkit-transition-property: color, background; -webkit-transition-duration: 0.3s, 0.3s; -webkit-transition-timing-function: linear, ease-in; } #top-menu ul li a:hover { background:#eee; color:#222222; padding:2px; border-radius:3px;-moz-border-radius:3px;-webkit-border-radius:3px;} /* ===================== MENU ===================== */ #menu { float:right; height: 40px; margin-top: 30px; padding-right:13px; background:#ffffff; border-top:1px solid #c5c4c4; border-bottom:1px solid #c5c4c4; } #menu ul.topnav { list-style: none; margin: 0; float: left; font-size: 14px; } #menu ul.topnav li { float: left; padding: 8px 0 8px 12px; font-size: 14px; position: relative; z-index: 100; } #menu ul.topnav li > a { font:normal 14px 'Droid Sans', arial, serif; color:#000000; text-decoration: none;display: block; float: left; padding:4px;} .topnav li > a:hover, .tonav li.current_page_item a, .topnav li.current_page_parent a, .topnav li.current-menu-ancestor a, .topnav li.current-menu-item a, .topnav li.current_page_item li a, .topnav li.current_page_parent li a, .topnav li.current-menu-ancestor li a, .topnav li.current-menu-item li a, .topnav li.sfHover a { background:#eee; padding:4px; } .topnav li > a, .topnav li.current_page_item, .topnav li.current_page_parent, .topnav li.current-menu-ancestor, .topnav li.current-menu-item, .topnav li.selected { border-radius:3px;-moz-border-radius:3px;-webkit-border-radius:3px;} #menu li span { width: 19px; height: 35px; float: left; background: url(img/subnav_btn.png) no-repeat center top; margin: -4px 0 0 5px } #menu ul.topnav li span.subhover {background-position: center bottom; cursor: pointer;} /*-- Changement au survol de la flèche (bouton Drop Down)--*/ #menu ul.topnav li ul.sub-menu { list-style: none; font-size: 12px; position: absolute; left: 0; top: 39px; margin: 0; padding: 0; display:none; } #menu ul.topnav li ul.sub-menu li{ margin: 0; padding: 0; clear: both; width: 140px; background:#fff;} #menu ul.topnav li ul.sub-menu li a { display:block; color:#555555; width: 125px; border:1px solid #DBDBDB; height: 25px; line-height: 25px; float: left; font-size:11px; padding-left: 10px; } #menu ul.topnav li ul.sub-menu li a:hover { background-image: linear-gradient(bottom, rgb(238,238,238) 14%, rgb(255,255,255) 69%); background-image: -o-linear-gradient(bottom, rgb(238,238,238) 14%, rgb(255,255,255) 69%); background-image: -moz-linear-gradient(bottom, rgb(238,238,238) 14%, rgb(255,255,255) 69%); background-image: -webkit-linear-gradient(bottom, rgb(238,238,238) 14%, rgb(255,255,255) 69%); background-image: -ms-linear-gradient(bottom, rgb(238,238,238) 14%, rgb(255,255,255) 69%); background-image: -webkit-gradient( linear, left bottom, left top, color-stop(0.14, rgb(238,238,238)), color-stop(0.69, rgb(255,255,255)) ); width:125px;} /* ===================== MENU WITHOUT NAV ===================== */ #menu div.topnav { list-style: none; margin: 0; float: left; background: #ffffff; font-size: 14px; padding-left: 10px } #menu div.topnav li { float: left; text-decoration: none; padding-right: 20px; font-family: Georgia, Arial; line-height: 40px; font-size: 14px; position: relative;z-index: 10; } #menu div.topnav li a { color: #ffffff; display: block; text-decoration: none; float: left; } #menu div.topnav li a:hover { line-height: 42px; height: 38px; color: #c5c4c4 } /* ===================== searchform ===================== */ #search { width: 210px; height: 40px; float: left; display: inline; } #s { background: #ffffff; -webkit-border-radius: 10px; -moz-border-radius: 7px; border-radius: 7px; -moz-box-shadow:inset 0 0 5px #000000; -webkit-box-shadow:inset 0 0 5px #000000; box-shadow:inset 0 0 5px #000000;; border: none; width: 190px; color: #ccc; font-size: 100%; top: 0; height: 24px; font-family: Georgia, Arial; font-size: 12px } #searchform { float: right; padding-top: 7px; padding-right: 10px; } #searchform, #searchform div { position: relative; } #searchsubmit { background: url(img/search-btn.png) no-repeat left top; height: 24px; width: 24px; border: none; text-indent: -999%; line-height: 1px; } form#searchform input#s { padding: 0 10px; width: 150px; } /* ===================== CONTAINER ===================== */ #container {background: #ffffff; width: 990px; margin: 0 auto } /* ===================== SLIDESHOW ===================== */ #slideshow { margin-top:20px; background-color: #ffffff;} .slides_container { width: 990px; overflow:hidden; position:relative; display:none; } .slides_container div.slide {display:block; width: 990px; height: 340px; } .pagination { margin:0 13px 0 0; auto 0; float:right; } .pagination li { float:left; margin:0 1px; list-style:none;} .pagination li a {display:block;width:12px; height:0; padding-top:12px; background-image:url(img/pagination.png); background-position:0 0; float:left; overflow:hidden;} .pagination li.current a {background-position:0 -12px; } .caption { width:300px; font-family:Georgia, Arial; text-align:right; z-index:500; position:absolute; top:70px; left:670px; } .caption h2 { font-size:17px; color:#777777; font-weight:normal; font-family: Century gothic, arial, serif; margin:10px 0 10px 0;} .caption p { font-size:13px; color:#c5c4c4 ; font-family: Century gothic, arial, serif;} .caption span a { font-style:italic; color:#fe8040; font-size:13px; font-family: Arial, serif; } /* ===================== CONTENT HOME ===================== */ .global { width:700px; margin-top:30px ; float:left;} .bloc { float:left; width:330px; margin:10px 20px 0 0; font-size:13px;} .bloc a.rotator { -webkit-transition:All 1s ease; -moz-transition:All 1s ease; -o-transition:All 1s ease; -webkit-transform: rotate(0deg) scale(1) skew(0deg) translate(0px); -moz-transform: rotate(0deg) scale(1) skew(0deg) translate(0px); -o-transform: rotate(0deg) scale(1) skew(0deg) translate(0px); } .bloc a.rotator:hover, .bloc a.rotator:focus, .bloc a.rotator:active { -webkit-transform: rotate(360deg) scale(1) skew(0deg) translate(0px); -moz-transform: rotate(360deg) scale(1) skew(0deg) translate(0px); -o-transform: rotate(360deg) scale(1) skew(0deg) translate(0px); } .bloc p { margin:0px; font-size: 13px} a#rotator1 {display: inline-block; background: url(img/rotator-home.png) top left no-repeat; width: 82px; height: 82px;float: left; margin: 0 10px 0 0; text-align: center; cursor: default} a#rotator2 {display: inline-block; background: url(img/rotator-home.png) top right no-repeat; width: 82px; height: 82px;float: left; margin: 0 10px 0 0; text-align: center; cursor: default} a#rotator3 {display: inline-block; background: url(img/rotator-home.png) center left no-repeat; width: 82px; height: 82px;float: left; margin: 0 10px 0 0; text-align: center; cursor: default} a#rotator4 {display: inline-block; background: url(img/rotator-home.png) center right no-repeat; width: 82px; height: 82px;float: left; margin: 0 10px 0 0; text-align: center; cursor: default} a#rotator5 {display: inline-block; background: url(img/rotator-home.png) bottom left no-repeat; width: 82px; height: 82px;float: left; margin: 0 10px 0 0; text-align: center; cursor: default} a#rotator6 {display: inline-block; background: url(img/rotator-home.png) bottom right no-repeat; width: 82px; height: 82px;float: left; margin: 0 10px 0 0; text-align: center; cursor: default} #content {margin-top:10px; padding-bottom: 30px;} .apropos {width: 680px; padding-right: 20px; padding-bottom: 15px; margin-bottom: 15px; border-bottom: 1px solid #c5c4c4 ; float:left; line-height: 18px} .article { width: 680px; margin-top:10px; padding-right: 20px; float:left; } .article p { margin:0px; font-size: 13px;} .article h4 { font-size:13px; font-weight:bold; color:#447b9c; font-family: 'Droid Sans', arial, serif; margin-bottom:5px;} .article span a {font-style:italic; color:#fe8040; font-size:12px; font-family: Arial, serif;} /* ===================== POST HOME ===================== */ .posthome { width: 300px; height: 360px; padding: 20px; border-top: 1px solid #fff; float: left; } .posthome .thumb { width: 300px; height: 147px; margin-top: 5px} .posthome .thumb img { background: url(img/posthome-bg.png) no-repeat top left; padding: 11px; width: 284px; height: 125px;-moz-box-shadow: 0 0 2px 2px #cccccc;-webkit-box-shadow: 0 0 2px 2px#cccccc;box-shadow: 0 0 2px 2px #cccccc; } .posthome h2 a { color:#424248 } .posthome h2 a:hover { text-decoration:underline;} .posthome .post-content { padding: 5px; width: 290px; } .posthome .post-content .read_more { float: right;background: url(img/read-more-btn.png) no-repeat; display: block; text-align: center;width: 121px; height: 40px; } .posthome .post-content .read_more a { color:#ffffff ; font-size: 0.9em;line-height: 26px} .posthome .post-content .read_more a:hover { line-height: 28px } .posthome .post_meta { margin: 5px 0; } .posthome .entry p { text-align: justify } /* ===================== SIDE BAR ===================== */ #sidebar { width: 285px; margin: 0; float: right; display: inline; margin-top:40px; background: #f5f5f5; border:2px solid #eeeeee; box-shadow: 1px 1px 5px #999999; -webkit-border-radius: 7px; -moz-border-radius: 7px; border-radius: 7px;} #sidebar .widget { padding: 25px 0 5px 0; float: left } #sidebar .widget h3.widgettitle {background: url(img/arrow.png) 10% 50% no-repeat #ffffff; padding: 5px 20px 5px 50px; width: 216px; margin:20px 0; color:#424248; font-size: 16px; } #sidebar .widget .textwidget {padding:0 20px; width: 245px} #sidebar .widget #calendar_wrap {padding:0 20px; width: 245px} #sidebar .widget #searchform {padding:0 20px; width: 245px} #sidebar .widget ul {padding:0 20px; width: 245px} .updated {font-size: 12px; font-weight: normal; color:#fe8040; margin:10px 0 10px;} #mc_signup {padding: 0 20px; width:245px; text-align: right } #mc_signup label {font-size: 13px; font-weight: normal; } #mc_signup input, #mc-embedded-subscribe {margin: 5px 0; width: 155px; height: 17px; -webkit-border-radius: 3px; border:1px solid #eeeeee; -moz-border-radius: 3px; border-radius: 3px; box-shadow: 1px 1px 2px #999999;} .mc_signup_submit {text-align: right; margin-top:5px } .mc_signup_submit input.button {font-weight:bold; width: 240px !important; background:#843f2e; height:25px !important; border:none; color:#ffffff;} .mc_signup_submit input.button:hover {padding-top: 3px; cursor:pointer} .btn-contact {display: inline-block; position: relative; background: url(img/contact.png) top left no-repeat; width: 246px; height: 80px; cursor: pointer; opacity: 1; /* opacite au survol */ -ms-filter:"prodig:DXImageTransform.Microsoft.Alpha(Opacity=90)"; /* Hack IE 8 */ filter: alpha(opacity = 100); /* Hack IE 5-7 */} .btn-contact:hover {opacity: 0.9;/* l'opacite que vous voulez au depart */ border: none;/* enlever les border d'une image en lien */ -ms-filter: "prodig:DXImageTransform.Microsoft.Alpha(Opacity=35)"; /* Hack IE8 */ filter: alpha(opacity = 90); /* Hack IE 5-7 */ -webkit-transition: opacity 0.3s ease-in-out;/* transition pour Chrome et Safari */ -moz-transition: opacity 0.3s ease-in-out;/* transition pour Firefox */ -o-transition: opacity 0.3s ease-in-out;/* transition pour Opéra */ transition: opacity 0.3s ease-in-out; /* on écrit cette ligne à la fin de façon à ce que ce soit elle qui soit prise en compte lorsque l'attribut transition sera pris en compte par tous les navigateurs */} .btn-contact:active {background: url(img/contact.png) bottom left no-repeat; top:2px; width: 246px; height: 80px} .btn-services {margin-top:10px; display: inline-block; position: relative; background: url(img/services.png) top left no-repeat; width: 246px; height: 80px; cursor: pointer;opacity: 1; /* opacite au survol */ -ms-filter:"prodig:DXImageTransform.Microsoft.Alpha(Opacity=90)"; /* Hack IE 8 */ filter: alpha(opacity = 100); /* Hack IE 5-7 */} .btn-services:hover {opacity: 0.9;/* l'opacite que vous voulez au depart */ border: none;/* enlever les border d'une image en lien */ -ms-filter: "prodig:DXImageTransform.Microsoft.Alpha(Opacity=35)"; /* Hack IE8 */ filter: alpha(opacity = 90); /* Hack IE 5-7 */ -webkit-transition: opacity 0.3s ease-in-out;/* transition pour Chrome et Safari */ -moz-transition: opacity 0.3s ease-in-out;/* transition pour Firefox */ -o-transition: opacity 0.3s ease-in-out;/* transition pour Opéra */ transition: opacity 0.3s ease-in-out; /* on écrit cette ligne à la fin de façon à ce que ce soit elle qui soit prise en compte lorsque l'attribut transition sera pris en compte par tous les navigateurs */} .btn-services:active {background: url(img/services.png) bottom left no-repeat; top:2px; width: 246px; height: 80px} .btn-solutions {display: inline-block; position: relative; background: url(img/solution.png) top left no-repeat; width: 246px; height: 80px; cursor: pointer; opacity: 1; /* opacite au survol */ -ms-filter:"prodig:DXImageTransform.Microsoft.Alpha(Opacity=90)"; /* Hack IE 8 */ filter: alpha(opacity = 100); /* Hack IE 5-7 */} .btn-solutions:hover {opacity: 0.9;/* l'opacite que vous voulez au depart */ border: none;/* enlever les border d'une image en lien */ -ms-filter: "prodig:DXImageTransform.Microsoft.Alpha(Opacity=35)"; /* Hack IE8 */ filter: alpha(opacity = 90); /* Hack IE 5-7 */ -webkit-transition: opacity 0.3s ease-in-out;/* transition pour Chrome et Safari */ -moz-transition: opacity 0.3s ease-in-out;/* transition pour Firefox */ -o-transition: opacity 0.3s ease-in-out;/* transition pour Opéra */ transition: opacity 0.3s ease-in-out; /* on écrit cette ligne à la fin de façon à ce que ce soit elle qui soit prise en compte lorsque l'attribut transition sera pris en compte par tous les navigateurs */} .btn-solutions:active {background: url(img/solution.png) bottom left no-repeat; top:2px; width: 246px; height: 80px} ul.follow { background: url(img/follow.png) top left no-repeat} ul.follow li { line-height: 29px; padding-left: 17px;-webkit-transition:All 0.6s ease; -moz-transition:All 0.6s ease; -o-transition:All 0.6s ease; -webkit-transform: rotate(0deg) scale(1) skew(0deg) translate(0px); -moz-transform: rotate(0deg) scale(1) skew(0deg) translate(0px); -o-transform: rotate(0deg) scale(1) skew(0deg) translate(0px);} ul.follow li:hover { -webkit-transform: rotate(0deg) scale(1) skew(0deg) translate(10px); -moz-transform: rotate(0deg) scale(1) skew(0deg) translate(10px); -o-transform: rotate(0deg) scale(1) skew(0deg) translate(10px); } ul.follow li a {color:#424248; font-family: 'Droid Sans', Arial; font-size: 14px;} ul.follow li a:hover {text-decoration: none; cursor: pointer} #s2 { background: #ffffff; -webkit-border-radius: 10px; -moz-border-radius: 7px; border-radius: 7px; -moz-box-shadow:inset 0 0 5px #000000; -webkit-box-shadow:inset 0 0 5px #000000; box-shadow:inset 0 0 5px #000000; padding-left:5px;border: none; width: 180px; color: #ccc; font-size: 100%; top: 0; height: 24px; font-family: Georgia, Arial; font-size: 0.8em } #searchform2 { padding-top: 7px; padding-right: 10px; } #searchform2, #searchform2 div { position: relative; } /* ===================== FOOTER ===================== */ #footer_bg { background-color:#424248; clear:both; width:100%; color: #fff;font-size: 13px; border-top:3px solid #c5c4c4; margin-top:20px;} #footer {position:relative; width: 990px; margin: 0 auto;} #footer .bloc-foot { margin:30px 20px 30px 0; display: block; float: left; width: 300px; height: 200px; background: #f5f5f5; border:2px solid #eeeeee; box-shadow: 2px 2px 5px #eeeeee; -moz-box-shadow: 1px 1px 5px #eeeeee;-webkit-box-shadow: 1px 1px 5px #eeeeee; -webkit-border-radius: 7px; -moz-border-radius: 7px; border-radius: 7px;} h3.footertitle {background: url(img/arrow.png) 5% 50% no-repeat #ffffff; padding: 5px 20px 5px 40px; width: 240px; margin:20px 0 15px 0 ; color:#424248; font-size: 16px; } ul.xoxo { padding: 0 20px} ul.xoxo li {line-height: 22px;-webkit-transition:All 0.6s ease; -moz-transition:All 0.6s ease; -o-transition:All 0.6s ease; -webkit-transform: rotate(0deg) scale(1) skew(0deg) translate(0px); -moz-transform: rotate(0deg) scale(1) skew(0deg) translate(0px); -o-transform: rotate(0deg) scale(1) skew(0deg) translate(0px);} ul.xoxo li:hover { -webkit-transform: rotate(0deg) scale(1) skew(0deg) translate(10px); -moz-transform: rotate(0deg) scale(1) skew(0deg) translate(10px); -o-transform: rotate(0deg) scale(1) skew(0deg) translate(10px); } ul.xoxo li a {color:#424248; font-family: 'Droid Sans', Arial; font-size: 14px;} ul.xoxo li a:hover {text-decoration: none; cursor: pointer} .bloc-foot .textwidget { padding: 0 20px; color:#424248; font-family: 'Droid Sans', Arial; font-size: 14px;} .gotop a { background: url(img/top.png) 0 0 no-repeat; display:block; height:40px; left:450px; position:absolute; text-decoration:none; top:-20px; width:40px;} /* ===================== PAGES ===================== */ .contenu-titre h1 {color:#424248; font-family: Century Gothic, Arial; font-size: 18px; font-weight:bold; padding-bottom:5px; margin-bottom:15px; border-bottom: 1px dotted #fe8040; } .post { padding-right:20px; width: 680px; } .post p { text-align: justify; } .post ul {margin-left: 10px; margin-bottom:10px} .post ul li { font-size:13px; list-style:url(img/puce-orange.gif) inside; line-height:17px;} .post ul li a { color:#424248 } .post ul li a:hover { color:#fe8040 } .post h2 { font-size: 16px; color: #447b9c; margin-bottom: 15px; margin-top: 20px} .post .canvas { width: 640px; height: 400px; background-color: #77a300; margin: 20px 0 60px 0; } .post .entry .img-page img { margin-top: 10px; margin-bottom:10px; float: left; width: 640px; height: 250px; -moz-box-shadow: 0 0 2px 2px #cccccc;-webkit-box-shadow: 0 0 2px 2px#cccccc;box-shadow: 0 0 2px 2px #cccccc;} .post .entry img.wp-post-image { margin-top: 10px; margin-bottom:10px; float: left; width: 640px; height: 250px;-moz-box-shadow: 0 0 2px 2px #cccccc;-webkit-box-shadow: 0 0 2px 2px#cccccc; box-shadow: 0 0 2px 2px #cccccc;} .btn-devis {margin-top:10px; display: inline-block; position: relative; background: url(img/devis.png) top left no-repeat; width: 137px; height: 58px; cursor: pointer;opacity: 1; /* opacite au survol */ -ms-filter:"prodig:DXImageTransform.Microsoft.Alpha(Opacity=90)"; /* Hack IE 8 */ filter: alpha(opacity = 100); /* Hack IE 5-7 */} .btn-devis:hover {opacity: 0.9;/* l'opacite que vous voulez au depart */ border: none;/* enlever les border d'une image en lien */ -ms-filter: "prodig:DXImageTransform.Microsoft.Alpha(Opacity=35)"; /* Hack IE8 */ filter: alpha(opacity = 90); /* Hack IE 5-7 */ -webkit-transition: opacity 0.3s ease-in-out;/* transition pour Chrome et Safari */ -moz-transition: opacity 0.3s ease-in-out;/* transition pour Firefox */ -o-transition: opacity 0.3s ease-in-out;/* transition pour Opéra */ transition: opacity 0.3s ease-in-out; /* on écrit cette ligne à la fin de façon à ce que ce soit elle qui soit prise en compte lorsque l'attribut transition sera pris en compte par tous les navigateurs */} .btn-devis:active {background: url(img/devis.png) bottom left no-repeat; top:2px; width: 137px; height: 58px} /* ===================== PAGES SANS SIDEBAR ===================== */ .contenu-titre-big h1 {color:#424248; font-family: Century Gothic, Arial; font-size: 18px; font-weight: bold; padding-bottom:5px; margin-bottom:15px; border-bottom: 1px dotted #fe8040; } .full-width { padding: 0; width: 990px; margin-top:20px ;} .post-full { padding: 20px 0 20px 0; width: 990px; } .post-full p { text-align: justify; } .post-full h2 { font-size: 17px; color: #447b9c} .post-full h3 { margin:0px ; padding: 0px; float: left; color: #424248; text-decoration: none; font-size: 20px; margin-top: 20px; margin-left: 10px; text-transform: uppercase } .post-full h3 a {color: #424248; text-decoration: none;} .post-full .img-page img { margin-top: 10px; margin-bottom:10px; float: left; width: 990px; height: 250px; -moz-box-shadow: 0 0 2px 2px #cccccc;-webkit-box-shadow: 0 0 2px 2px#cccccc;box-shadow: 0 0 2px 2px #cccccc;} .post-full .img.wp-post-image { margin-top: 10px; margin-bottom:10px; float: left; width: 990px; height: 250px;-moz-box-shadow: 0 0 2px 2px #cccccc;-webkit-box-shadow: 0 0 2px 2px#cccccc; box-shadow: 0 0 2px 2px #cccccc;} .compet-left {margin-top:20px; width: 480px; margin-right: 26px; float: left;} .compet-right {margin-top:20px; width: 480px; margin-right: 0px; float: left;} .bloc-compet { margin-top:20px; padding:10px; background-color:#f5f5f5; display: block; width: 460px; border: 2px solid #eeeeee; -webkit-transition:All 0.5s ease; -moz-transition:All 0.5s ease; -o-transition:All 0.5s ease; -webkit-transform: rotate(0deg) scale(1) skew(0deg) translate(0px); -moz-transform: rotate(0deg) scale(1) skew(0deg) translate(0px); -o-transform: rotate(0deg) scale(1) skew(0deg) translate(0px); } .bloc-compet:hover {background-color: #FE8040; box-shadow: 1px 1px 3px #999999; -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px;-webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px;-webkit-transform: rotate(-3deg) scale(1.04) skew(0deg) translate(0px); -moz-transform: rotate(-3deg) scale(1.04) skew(0deg) translate(0px); -o-transform: rotate(-3deg) scale(1.04) skew(0deg) translate(0px); } .bloc-competr { margin-top:20px;padding:10px; border: 2px solid #eeeeee;background-color:#f5f5f5; display: block; width: 460px; -webkit-transition:All 0.5s ease; -moz-transition:All 0.5s ease; -o-transition:All 0.5s ease; -webkit-transform: rotate(0deg) scale(1) skew(0deg) translate(0px); -moz-transform: rotate(0deg) scale(1) skew(0deg) translate(0px); -o-transform: rotate(0deg) scale(1) skew(0deg) translate(0px); } .bloc-competr:hover { background-color: #FE8040; box-shadow: 1px 1px 3px #999999; -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px;-webkit-transform: rotate(3deg) scale(1.04) skew(0deg) translate(0px); -moz-transform: rotate(3deg) scale(1.04) skew(0deg) translate(0px); -o-transform: rotate(3deg) scale(1.04) skew(0deg) translate(0px);} span#video {display: inline-block; background: url(img/picto.png) 0% 0% no-repeat; height: 70px; width: 70px;float: left; } span#web {display: inline-block; background: url(img/picto.png) 0% 50% no-repeat; height: 70px; width: 70px;float: left; } span#conseil {display: inline-block; background: url(img/picto.png) 0% 25% no-repeat; height: 70px; width: 70px;float: left; } span#socialm {display: inline-block; background: url(img/picto.png) 50% 50% no-repeat; height: 70px; width: 70px;float: left; } span#dev {display: inline-block; background: url(img/picto.png) 75% 25% no-repeat; height: 70px; width: 70px;float: left; } span#veille {display: inline-block; background: url(img/picto.png) 50% 25% no-repeat; height: 70px; width: 70px;float: left; } span#redac {display: inline-block; background: url(img/picto.png) 100% 75% no-repeat; height: 70px; width: 70px;float: left; } span#ergo {display: inline-block; background: url(img/picto.png) 100% 0% no-repeat; height: 70px; width: 70px;float: left; } span#com {display: inline-block; background: url(img/picto.png) 100% 50% no-repeat;height: 70px; width: 70px;float: left; } span#print {display: inline-block; background: url(img/picto.png) 50% 75% no-repeat;height: 70px; width: 70px;float: left; } span#photo {display: inline-block; background: url(img/picto.png) 0% 75% no-repeat;height: 70px; width: 70px;float: left; } /* ===================== BLOG ===================== */ .content-left { width: 670px; float:left; padding-bottom:40px; margin-top: 35px; font-family:Helvetica, Arial;} .content-left .ref {float:left; background: url(img/bg-img.png) top left no-repeat; height:255px; padding-top:15px;text-align:center; width:440px;margin-left:-15px;} .content-left .ref img {height:235px; width:370px;} .content-left .ref-content { text-align: justify} .content-left .ref-content h2 { text-align: left; font-family:'Droid Sans', Arial; font-size:14px;} .content-left .ref-content span.more { display:block; float: left; background:#d56834;padding: 4px 20px; font-size: 13px; -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; } .content-left .ref-content span.more a {color: #ffffff } .content-right { width: 285px; margin: 0 0 0 0; padding-bottom: 20px; float: right; display: inline; margin-top:40px; background: #f5f5f5; border:2px solid #eeeeee; box-shadow: 1px 1px 5px #999999; -webkit-border-radius: 7px; -moz-border-radius: 7px; border-radius: 7px; } .content-right .bloc-c { padding: 0 0 5px 25px;color:#424248; font-family:'Droid Sans', Arial; font-size:14px;} .content-right h3 {background: url(img/arrow.png) 10% 50% no-repeat #ffffff; padding: 5px 20px 5px 50px; width: 216px; margin:20px 0; color:#424248; font-size: 16px; } .content-right span.more-right { text-align: center; display:block; background:#d56834; padding: 10px 15px; margin:20px 0 0 25px; font-weight: bold; width: 70%; font-size: 13px; -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; } .content-right span.more-right a {color: #ffffff } .content-right span.more-ref { text-align: center; display:block; background:#2e617e; padding: 10px 15px; margin:20px 0 0 25px; font-weight: bold; width: 70%; font-size: 13px; -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; } .content-right span.more-ref a {color: #ffffff } /* ===================== ALL POST ===================== */ .allpost { width: 670px; height: 175px; padding: 20px 0px 0px 10px; border-bottom: 1px dotted #cccccc; float: left; } .allpost .post-image { position:relative; width: 230px; height: 145px; margin-top: 5px; margin-right: 10px; float: left} .allpost .post-image img { padding: 7px; margin-top: -3px; width: 200px; height: 130px;-moz-box-shadow: 0 0 2px 2px #cccccc; -webkit-box-shadow: 0 0 2px 2px #cccccc; box-shadow: 0 0 2px 2px #cccccc; } .allpost h2 a { color:#32373D} .allpost h2 a:hover { text-decoration:underline;} .allpost .allpost-content { padding: 5px; width: 400px; float: left } .allpost .post-meta { margin: 5px 0; color: #333333; text-transform: uppercase; font-size: 12px} .allpost .post-meta a { color:#d56834} .allpost .post-meta a:hover {text-decoration:underline; } .allpost .post-content span.more { display:block; float: right; background:#d56834;padding: 4px; font-size: 13px; -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; } .allpost .post-content span.more a {color: #ffffff } .allpost .post-content a { color:#32373D;} .allpost .post-content a:hover {text-decoration:underline; } .allpost .entry p { text-align: justify } .allpost .entry { vertical-align: top } .allpost .entry ul li {} .allpost .post-image span.new { display:block; height: 90px; position: absolute; width:96px;top:-3px; left:119px; background: url(img/top2.png) top left no-repeat} .widget_categories ul li a {list-style:url(img/puce-orange.gif) inside; color:#424248; font-family:'Droid Sans', Arial; font-size:14px;} .widget_categories ul li a:hover {text-decoration: none} .widget_categories ul li {line-height: 29px; padding-left: 17px;-webkit-transition:All 0.6s ease; -moz-transition:All 0.6s ease; -o-transition:All 0.6s ease; -webkit-transform: rotate(0deg) scale(1) skew(0deg) translate(0px); -moz-transform: rotate(0deg) scale(1) skew(0deg) translate(0px); -o-transform: rotate(0deg) scale(1) skew(0deg) translate(0px);} .widget_categories ul li:hover { -webkit-transform: rotate(0deg) scale(1) skew(0deg) translate(10px); -moz-transform: rotate(0deg) scale(1) skew(0deg) translate(10px); -o-transform: rotate(0deg) scale(1) skew(0deg) translate(10px); } .tagcloud {padding: 0 20px} /* ===================== PAGINATION ===================== */ ul.page-numbers { width: 100%; display:block; float: left; margin-top: 20px} ul.page-numbers li {float:left; } ul.page-numbers li a {color:#6b6b6b; font-weight: bold; display: block; background: url(img/pagination2.png) 0% 33% no-repeat;padding: 6px 0 0 11px; height:23px; width: 20px } ul.page-numbers li span { color:#ffffff; font-weight: bold; display: block; background: url(img/pagination2.png) 0% 66% no-repeat;padding: 8px 0 0 11px; height:21px; width: 20px} ul.page-numbers li a.next.page-numbers {color:#ffffff; font-weight: bold; display: block;background: url(img/pagination2.png) 0% 100% no-repeat;padding: 8px 0 0 11px; height:21px; width: 20px} ul.page-numbers li a.prev.page-numbers { color:#ffffff; font-weight: bold; display: block;background: url(img/paginationé.png) 0% 0% no-repeat;padding: 8px 0 0 11px; height:21px; width: 20px} /* ===================== WORDPRESS ===================== */ .aligncenter { display: block; margin: 0 auto; } .alignright { float: right; margin: 0 0 1em 1em; } .alignleft { float: left; margin: 0 1em 1.2em 0; } .alignleft2 { float: left; margin: 0 1em 1.2em 0; } .floatleft { float: left; } .floatright { float: right; } img.aligncenter, img.alignright, img.alignleft { border: 1px solid #DDD; text-align: center; background: #F3F3F3; padding: 4px;} img.alignleft2 {text-align: center;} .textcenter { text-align: center; } .textright { text-align: right; } .textleft { text-align: left; } .wp-caption { border: 1px solid #DDD; text-align: center; background: #F3F3F3; padding-top: 4px; margin: 10px } .wp-caption img { margin: 0; padding: 0; border: none } .wp-caption .wp-caption-text { font-size: 11px; line-height: 18px; padding: 0 4px 5px; margin: 0 } /* ===================== Accordeon ===================== */ .accordion { width:100%;margin: 20px 0 20px 0;display: block; background: #f5f5f5; border:2px solid #eeeeee; box-shadow: 1px 1px 3px #999999; -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px;} h3.acc-title { margin:5px 5px 5px 10px; color: #424248 } h3.acc-title a { font-size: 15px; line-height:28px; text-decoration:none; display: block; background: url(img/arrow-title.png) 100% 50% no-repeat; color: #424248; cursor: pointer } .acc-content { text-align:justify; margin: 15px 0 0 0; padding: 0 10px 15px 10px; font-size: 13px; } .acc-content ul li { list-style:url(img/puce-orange.gif) inside; line-height:17px;} .acc-content ul li a { color:#fe8040 } .acc-content ul li a:hover { text-decoration: underline } span.btn-arrow a { background: url(img/plus.png) 100% 10% no-repeat; text-decoration: none; padding-right:15px; margin: 10px 0 0 0; float: right; color:#424248; height: 30px; display: block; cursor: pointer;font-family:Arial, serif;font-size:12px; font-style:italic;} .btn-seo-b { display:block; background: url(img/audit-seo.png) top left no-repeat; width: 306px ; height: 124px;} .btn-seo-c { display:block; background: url(img/audit-seo.png) bottom left no-repeat; width: 306px ; height: 124px;} .audit-seo { float: left; margin:20px 60px 0 0 } .audit-seo-l { float: left; margin:20px 0px 0 0 } /* ============== NewtGen Gallery ===========*/ #ngg-gallery-thumbnail { margin: 20px 0 20px 0; width: 700px} #ngg-gallery-thumbnail a {width:200px; height: 150px; float: left; margin-right: 30px; margin-bottom: 30px; display: inline-block; position:relative; text-decoration: none} #ngg-gallery-thumbnail a img {width:200px; height: 150px; border: none; -webkit-border-radius: 7px; -moz-border-radius: 7px; border-radius: 7px; border: 4px solid #dbdbdb} #ngg-gallery-thumbnail a span {position:absolute; top:25px; left:25px; display: none;} #ngg-gallery-thumbnail a:hover span {display:block; } #ngg-gallery-thumbnail span.ngg-title {width:160px ; top:30px; left:25px; color: #ffffff; font-weight: bold; z-index: 2} #ngg-gallery-thumbnail span.ngg-descr {width:160px ; margin-top: 25px; left:25px; color: #ffffff; font-size: 12px; z-index: 2} #ngg-gallery-thumbnail span.ngg-plus {display:block; width:33px; height: 33px; ; top:110px; left:160px; background:url(img/ngg-plus.png) no-repeat;z-index: 2} #ngg-gallery-thumbnail span.ngg-bg { top:0; left:0; width: 200px; height:150px; background:#000; -webkit-border-radius: 7px; -moz-border-radius: 7px; border-radius: 7px; border: 4px solid #dbdbdb; z-index: 1} /* ============== Forms Formation ===========*/ form.validate { color:#222222; background: #F5F5F5 url(img/form.png) no-repeat 90% 50%; border: 2px solid #eeeeee; padding:10px; font-family: Georgia; font-size: 14px; -moz-box-shadow: 1px 1px 3px #999999; -webkit-box-shadow: 1px 1px 3px #999999; -moz-border-radius: 5px; -webkit-border-radius: 5px;} .contact-form { color:#222222; background: #F5F5F5 url(img/qr-code.png) no-repeat 100% 10%; border: 2px solid #eeeeee; padding:10px; font-family: Georgia; font-size: 14px; -moz-box-shadow: 1px 1px 3px #999999; -webkit-box-shadow: 1px 1px 3px #999999; -moz-border-radius: 5px; -webkit-border-radius: 5px;} .contact-form-audit { color:#222222; border: 2px solid #eeeeee; padding:10px; font-family: Georgia; font-size: 14px; -moz-box-shadow: 1px 1px 3px #999999; -webkit-box-shadow: 1px 1px 3px #999999; -moz-border-radius: 5px; -webkit-border-radius: 5px;} #mc_embed_signup h3 {padding-left: 20px} .mc-field-group { padding-left:20px; margin-bottom: 10px} .mc-field-group input, .wpcf7-form-control-wrap input { display:inline;border-radius: 3px 3px 3px 3px; border: 1px solid #EEEEEE; box-shadow:#999999 1px 1px 2px; height:25px; margin: 5px 0 5px 0; width:235px;} .mc-field-group label { font-size: 13px} .asterisk { color:#fe8040;} .mc-field-group select, .wpcf7-form-control-wrap select { margin-top:4px; border:1px solid #CFCFCF; color:#949494; font-size:12px; font-style:italic; height:30px; line-height:37px; padding-left:10px; width:240px;} .mc-field-group select option, .wpcf7-form-control-wrap option { color:#949494; display:block; font-size:12px; font-style:italic; height:40px; line-height:40px; padding-left:10px; width:241px;} .wpcf7-form-control-wrap textarea { display:inline;border-radius: 3px 3px 3px 3px; border: 2px solid #EEEEEE; box-shadow:#999999 1px 1px 2px; height:130px; margin: 5px 0 5px 0; width:335px;} .textarea-sidebar span textarea { width:235px !important;} .wpcf7-submit {font-weight:bold; width: 240px !important; background:#fe8040; margin-top:20px; height:25px !important; border:none; color:#ffffff;} #mc-embedded-subscribe.button {font-weight:bold; width: 240px !important; background:#fe8040; height:25px !important; border:none; color:#ffffff;} .post-bg {background-color: #F5F5F5;border: 2px solid #eeeeee;padding:10px;-moz-box-shadow: 1px 1px 3px #999999;-webkit-box-shadow: 1px 1px 3px #999999;-moz-border-radius: 5px;-webkit-border-radius: 5px; font-size:13px;} .post-bg h2 {margin-top:0; margin-bottom:10px } .options-left {float:left; width: 340px; } .options-left ul li { list-style: none; margin-bottom: 10px; height: 40px;} .options-left ul li a { font-size: 13px; display: block; padding-top:12px;-webkit-transition:All 0.4s ease; -moz-transition:All 0.6s ease; -o-transition:All 0.6s ease; -webkit-transform: rotate(0deg) scale(1) skew(0deg) translate(0px); -moz-transform: rotate(0deg) scale(1) skew(0deg) translate(0px); -o-transform: rotate(0deg) scale(1) skew(0deg) translate(0px); } .options-left ul li a:hover { text-decoration:none; color:#424248; -webkit-transform: rotate(0deg) scale(1) skew(0deg) translate(10px); -moz-transform: rotate(0deg) scale(1) skew(0deg) translate(10px); -o-transform: rotate(0deg) scale(1) skew(0deg) translate(10px);} .options-right { float:left; width: 340px; font-size: 14px} .options-right ul li { list-style: none; margin-bottom: 10px; height: 40px;} .options-right ul li a { font-size: 13px; display: block; padding-top:12px; -webkit-transition:All 0.4s ease; -moz-transition:All 0.6s ease; -o-transition:All 0.6s ease; -webkit-transform: rotate(0deg) scale(1) skew(0deg) translate(0px); -moz-transform: rotate(0deg) scale(1) skew(0deg) translate(0px); -o-transform: rotate(0deg) scale(1) skew(0deg) translate(0px);} .options-right ul li a:hover {text-decoration:none; color:#424248; -webkit-transform: rotate(0deg) scale(1) skew(0deg) translate(10px); -moz-transform: rotate(0deg) scale(1) skew(0deg) translate(10px); -o-transform: rotate(0deg) scale(1) skew(0deg) translate(10px);} .option-1 span { background: url(img/icone-options.png) 0 0 no-repeat; float: left; clear: left; height:40px; width: 40px; margin-right: 7px; } .option-2 span { background: url(img/icone-options.png) 100% 67% no-repeat; float: left; clear: left; height:40px; width: 40px; margin-right: 7px } .option-3 span { background: url(img/icone-options.png) 0 33% no-repeat; float: left; clear: left; height:40px; width: 40px; margin-right: 7px } .option-4 span { background: url(img/icone-options.png) 100% 0 no-repeat; float: left;clear: left; height:40px; width: 40px; margin-right: 7px } .option-5 span { background: url(img/icone-options.png) 50% 33% no-repeat; float: left; clear: left; height:40px; width: 40px; margin-right: 7px } .option-6 span { background: url(img/icone-options.png) 100% 33% no-repeat; float: left; clear: left; height:40px; width: 40px; margin-right: 7px } .option-7 span { background: url(img/icone-options.png) 50% 0 no-repeat; float: left;clear: left; height:40px; width: 40px; margin-right: 7px } .option-8 span { background: url(img/icone-options.png) 50% 67% no-repeat; float: left; clear: left; height:40px; width: 40px; margin-right: 7px } .option-9 span { background: url(img/icone-options.png) 0 66% no-repeat; float: left; clear: left; height:40px; width: 40px; margin-right: 7px } .option-10 span { background: url(img/icone-options.png) 0 100% no-repeat; float: left;clear: left; height:40px; width: 40px; margin-right: 7px } .option-11 span { background: url(img/icone-options.png) 100% 100% no-repeat; float: left; clear: left; height:40px; width: 40px; margin-right: 7px } .option-12 span { background: url(img/icone-options.png) 50% 100% no-repeat; float: left; clear: left; height:40px; width: 40px; margin-right: 7px } ul.webmarketing { margin: 0px; padding: 0px;} ul.webmarketing li { list-style: none; margin: 30px 0; float:left; padding: 0} li a.web-1 { background: url(img/webmarketing.png) 0 0 no-repeat; float: left; clear: left; height:75px; width: 170px; } li a.web-1:hover { background: url(img/webmarketing.png) 0 33% no-repeat; height:75px; width: 170px; } li a.web-2 { background: url(img/webmarketing.png) 33% 0 no-repeat; float: left; clear: left; height:75px; width: 170px; } li a.web-2:hover { background: url(img/webmarketing.png) 33% 33% } li a.web-3 { background: url(img/webmarketing.png) 66% 0 no-repeat; float: left; clear: left; height:75px; width: 170px; } li a.web-3:hover { background: url(img/webmarketing.png) 66% 33% } li a.web-4 { background: url(img/webmarketing.png) 100% 0 no-repeat; float: left; clear: left; height:75px; width: 170px; } li a.web-4:hover { background: url(img/webmarketing.png) 100% 33% } li a.web-5 { background: url(img/webmarketing.png) 0 66% no-repeat; float: left; clear: left; height:75px; width: 170px; } li a.web-5:hover { background: url(img/webmarketing.png) 0% 100% } li a.web-6 { background: url(img/webmarketing.png) 33% 66% no-repeat; float: left; clear: left; height:75px; width: 170px; } li a.web-6:hover { background: url(img/webmarketing.png) 33% 100% } li a.web-7 { background: url(img/webmarketing.png) 66% 66% no-repeat; float: left; clear: left; height:75px; width: 170px; } li a.web-7:hover { background: url(img/webmarketing.png) 66% 100% } li a.web-8 { background: url(img/webmarketing.png) 100% 66% no-repeat; float: left; clear: left; height:75px; width: 170px; } li a.web-8:hover { background: url(img/webmarketing.png) 100% 100% } .btn-contact-2 {margin-top:10px; display: inline-block; position: relative; background: url(img/petit-contact.png) top left no-repeat; width: 137px; height: 58px; cursor: pointer;opacity: 1; /* opacite au survol */ -ms-filter:"prodig:DXImageTransform.Microsoft.Alpha(Opacity=90)"; /* Hack IE 8 */ filter: alpha(opacity = 100); /* Hack IE 5-7 */} .btn-contact-2:hover {opacity: 0.9;/* l'opacite que vous voulez au depart */ border: none;/* enlever les border d'une image en lien */ -ms-filter: "prodig:DXImageTransform.Microsoft.Alpha(Opacity=35)"; /* Hack IE8 */ filter: alpha(opacity = 90); /* Hack IE 5-7 */ -webkit-transition: opacity 0.3s ease-in-out;/* transition pour Chrome et Safari */ -moz-transition: opacity 0.3s ease-in-out;/* transition pour Firefox */ -o-transition: opacity 0.3s ease-in-out;/* transition pour Opéra */ transition: opacity 0.3s ease-in-out; /* on écrit cette ligne à la fin de façon à ce que ce soit elle qui soit prise en compte lorsque l'attribut transition sera pris en compte par tous les navigateurs */} .btn-contact-2:active {background: url(img/petit-contact.png) bottom left no-repeat; top:2px; width: 137px; height: 58px} #mobile { position:relative; height:453px; width:230px; margin-left: 20px; } #mobile img { position:absolute; left:0; cursor: pointer; -webkit-transition: opacity 0.6s ease-in-out; -moz-transition: opacity 0.6s ease-in-out; -o-transition: opacity 0.6s ease-in-out; -ms-transition: opacity 0.6s ease-in-out; transition: opacity 0.6s ease-in-out; } #mobile img.top-m:hover { opacity:0; cursor: pointer; } .cross-left {float:left; width: 340px; margin-top: 20px } .cross-left ul li { list-style: none; margin-bottom: 10px; min-height: 70px;font-size: 13px;} .cross-left ul li a { font-size: 13px; padding-top:12px; } .cross-left ul li a:hover { text-decoration:none; color:#fe8040; } .cross-right { float:left; width: 340px; font-size: 14px; margin-top: 20px} .cross-right ul li { list-style: none; margin-bottom: 10px; min-height: 70px;font-size: 13px; } .cross-right ul li a { font-size: 13px; padding-top:12px;} .cross-right ul li a:hover {text-decoration:none; color:#fe8040; } .cross-1 span { background: url(img/icone-cross.png) 66% 0 no-repeat; float: left; clear: left; height:64px; width: 64px; margin-right: 7px; } .cross-2 span { background: url(img/icone-cross.png) 66% 100% no-repeat; float: left; clear: left; height:64px; width: 64px; margin-right: 7px } .cross-3 span { background: url(img/icone-cross.png) 100% 0% no-repeat; float: left; clear: left; height:64px; width: 64px; margin-right: 7px } .cross-4 span { background: url(img/icone-cross.png) 0% 100% no-repeat; float: left;clear: left; height:64px; width: 64px; margin-right: 7px } .cross-5 span { background: url(img/icone-cross.png) 100% 100% no-repeat; float: left; clear: left; height:64px; width: 64px; margin-right: 7px } .cross-6 span { background: url(img/icone-cross.png) 33% 0% no-repeat; float: left; clear: left; height:64px; width: 64px; margin-right: 7px } .cross-7 span { background: url(img/icone-cross.png) 0 0 no-repeat; float: left;clear: left; height:64px; width: 64px; margin-right: 7px } .cross-8 span { background: url(img/icone-cross.png) 33% 100% no-repeat; float: left; clear: left; height:64px; width: 64px; margin-right: 7px } /* ============= PRICING TABLE ===========*/ .site-pricing { margin-top:30px; background: url(img/pricing-plan-nsink.png) 90% 0 no-repeat; padding-top: 120px; padding-bottom: 70px} .site-pricing ul.label { padding: 0px; margin: 0 0 0 0 } .site-pricing ul.label li { font-size:15px;display: block; list-style: none; width: 170px; padding: 0px; margin-bottom: 27px;} .pricing-web { margin-top:30px; background: url(img/pricing-table-forfait.png) 90% 0 no-repeat; padding-top: 100px; padding-bottom: 70px} .pricing-web ul.label { padding: 0px; margin: 0 0 0 0 } .pricing-web ul.label li { font-size:14px; display: block; list-style: none; width: 230px; padding: 0px; margin-bottom: 16px;} .solution {float:left; width:220px; height:170px; background-color: #F5F5F5; margin:20px 10px 20px 60px; border: 2px solid #eeeeee; padding:10px 10px 20px 10px;-moz-box-shadow: 1px 1px 3px #999999;-webkit-box-shadow: 1px 1px 3px #999999;-moz-border-radius: 5px;-webkit-border-radius: 5px; -webkit-transition:All 0.5s ease; -moz-transition:All 0.5s ease; -o-transition:All 0.5s ease; -webkit-transform: rotate(0deg) scale(1) skew(0deg) translate(0px); -moz-transform: rotate(0deg) scale(1) skew(0deg) translate(0px); -o-transform: rotate(0deg) scale(1) skew(0deg) translate(0px);} .solution:hover {background-color: #FE8040; box-shadow: 1px 1px 3px #999999; -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px;-webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px;-webkit-transform: rotate(-3deg) scale(1.04) skew(0deg) translate(0px); -moz-transform: rotate(-3deg) scale(1.04) skew(0deg) translate(0px); -o-transform: rotate(-3deg) scale(1.04) skew(0deg) translate(0px); } .solution:hover a {color:#424248; text-decoration:none } .solution p {text-align: left;} .solution h2 {color: #424248; margin-top: 10px} .solution-last {float:left; width:210px; height:140px; background-color: #F5F5F5; margin-left:210px; margin-top: 20px; border: 2px solid #eeeeee;padding:10px 10px 20px 10px;-moz-box-shadow: 1px 1px 3px #999999;-webkit-box-shadow: 1px 1px 3px #999999;-moz-border-radius: 5px;-webkit-border-radius: 5px;-webkit-transition:All 0.5s ease; -moz-transition:All 0.5s ease; -o-transition:All 0.5s ease; -webkit-transform: rotate(0deg) scale(1) skew(0deg) translate(0px); -moz-transform: rotate(0deg) scale(1) skew(0deg) translate(0px); -o-transform: rotate(0deg) scale(1) skew(0deg) translate(0px);} .solution-last:hover {background-color: #FE8040; box-shadow: 1px 1px 3px #999999; -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px;-webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px;-webkit-transform: rotate(-3deg) scale(1.04) skew(0deg) translate(0px); -moz-transform: rotate(-3deg) scale(1.04) skew(0deg) translate(0px); -o-transform: rotate(-3deg) scale(1.04) skew(0deg) translate(0px); } .solution-last:hover a {color:#424248; text-decoration:none } .solution-last p {text-align: left;} .solution-last h2 {color: #424248; margin-top: 10px} .article-presse { float:left; display:block; width:100%; padding-bottom:15px; padding-top:10px; margin-bottom:10px; border-bottom: 1px dotted #555555} .article-presse:hover { background-color:#f5f5f5} .presse-left { width: 170px; float:left; padding-right:10px; } .presse-right { width:481px; float:left; padding-right:5px; text-align:justify; }