/* * * Theme Name: Miratech * Theme URI: http://www.miratech.com * Description: Thème Wordpress de Miratech.com * Author: Miratech * Author URI: http://www.miratech.com * License: GNU General Public License version 3.0 * License URI: http://www.gnu.org/licenses/gpl-3.0.html * Version: 1.0 * Text Domain: wpf * * Designed & Handcrafted by Franck Maurin for http://www.miratech.com * All files, unless otherwise stated, are released under the GNU General Public License * version 3.0 (http://www.gnu.org/licenses/gpl-3.0.html) * * 0. Reset & Clearfix * 1. Typography * 2. Colors * 3. Icons * 4. Structure (& templates) * 5. Header * 6. Aside * 7. Footer * 8. Contents * 9. Contact * 10. Includes * 11. Responsive design * 12. Print * 13. IE Fix * */ /* * * 0. Reset & Clearfix * (Based on work by Eric Meyer: http://meyerweb.com/eric/tools/css/reset/index.html) */ html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video { margin: 0; padding: 0; border: 0; font-size: 100%; vertical-align: baseline; font-family: inherit; font-weight: inherit; font-style: inherit; outline: 0; } article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display: block; } body { line-height: 1; } ol, ul { list-style: none; } blockquote, q { quotes: none; } blockquote:before, blockquote:after, q:before, q:after { content: ''; content: none; } table { border-collapse: collapse; border-spacing: 0; } caption, th, td { font-weight: normal; text-align: left; } h1, h2, h3, h4, h5, h6 { clear: both; } a { text-decoration:none; } a img { border: none; } :focus { outline: 0; } .clear { clear:both; } /* * * 1. Typography * */ body, input, textarea { font: normal 14px/1.625 "pt-sans", "Helvetica Neue", Helvetica, Arial, sans-serif; } hr { background-color: #ccc; border: 0; height: 1px; margin-bottom: 1.625em; } p { margin-bottom: 1.625em; } ul { margin: 0 0 1.625em 1.3em; } ul { list-style: disc; } ol { list-style: none; margin: 0 0 1.625em 0; } ol > li { padding-left: 60px; margin: 0 0 1.625em 0; min-height: 42px; } ol > li:nth-child(1), ol > li.child-1 { background: url(images/bullet-1.png) no-repeat; } ol > li:nth-child(2), ol > li.child-2 { background: url(images/bullet-2.png) no-repeat; } ol > li:nth-child(3), ol > li.child-3 { background: url(images/bullet-3.png) no-repeat; } ol > li:nth-child(4), ol > li.child-4 { background: url(images/bullet-4.png) no-repeat; } ol > li:nth-child(5), ol > li.child-5 { background: url(images/bullet-5.png) no-repeat; } ol ol { list-style: upper-alpha; } ol ol ol { list-style: lower-roman; } ol ol ol ol { list-style: lower-alpha; } ul ul, ol ol, ul ol, ol ul { margin-bottom: 0; } dl { margin: 0 1.625em; } dt { font-weight: bold; } dd { margin-bottom: 1.625em; } strong, b { font-weight: bold; } cite, em, i { font-style: italic; } blockquote { font: italic normal Georgia, "Bitstream Charter", serif; margin: 0 3em; } blockquote em, blockquote i, blockquote cite { font-style: normal; } blockquote cite { font:300 12px "Helvetica Neue", Helvetica, Arial, sans-serif; letter-spacing: 0.05em; text-transform: uppercase; } pre { font: 13px/1.5 "Courier 10 Pitch", Courier, monospace; margin-bottom: 1.625em; background: #f4f4f4; overflow: auto; padding: 0.75em 1.625em; } code, kbd, samp, var { font: 13px Monaco, Consolas, "Andale Mono", "DejaVu Sans Mono", monospace; } abbr, acronym, dfn { border-bottom: 1px dotted #666; cursor: help; } address { display: block; margin: 0 0 1.625em; } ins { background: #fff9c0; text-decoration: none; } sup, sub { font-size: 10px; height: 0; line-height: 1; position: relative; vertical-align: baseline; } sup { bottom: 1ex; } sub { top: .5ex; } table td { vertical-align: middle; } .entry-content table, .entry-content table td, .entry-content table img, .entry-content table p { border:none; margin:0 0 5px 0; } .alignleft { display: inline; float: left; margin-right: 1.625em; } .alignright { display: inline; float: right; margin-left: 1.625em; } .aligncenter { clear: both; display: block; margin-left: auto; margin-right: auto; } table td.aligntop { vertical-align: top; } a { text-decoration: none; } a:focus, a:active, a:hover { text-decoration: underline; } .box-border .entry-content a { text-decoration:none; border-bottom:dotted 1px #133E69; } .box-border .entry-content a:hover { text-decoration:none; border-bottom:solid 1px #133E69; } .entry-content h1, .entry-title { font: 400 40px/1.1em "ff-cocon-web-pro", sans-serif; margin-bottom:20px; } .entry-content h2 { font: 400 20px/1.4em "ff-cocon-web-pro", sans-serif; margin-bottom:20px; background:url(images/icons/three-dot.png) no-repeat 0 24px; padding:10px 0 0 23px; } .entry-content h3 { font: 400 15px/1.4em "ff-cocon-web-pro", sans-serif; } /* * * 2. Colors * */ /* black */ body, #site-title a, input[type=text]:focus, textarea:focus, #access li:hover > a, #access a:focus, .indexed.format-image footer.entry-meta a, .indexed.format-image .wp-caption .wp-caption-text:before, .entry-header .comments-link a { color: #444; } /* blue */ a, .breadcrumb a.page-parent, .entry-content h1, .entry-content h2, .entry-title, .entry-content h3, .wrapper-blue, .bulle-list, .page-template-home-offers-php li, .entry-content strong { color: #133e69; } /* blue gray */ .breadcrumb li span, .page-template-contact-php .wpcf7-text, .page-template-contact-php .wpcf7-textarea, .page-template-contact-php label, .page-template-contact-php .mandatory, .date { color: #899fb4; } /* gray */ .entry-meta, #site-description, input[type=text], input[type=password], textarea, .edit-link a, a.comment-reply-link, .format-quote blockquote, .indexed.format-image .wp-caption .wp-caption-text, #footer #colophon { color: #999; } /* white */ .page-link a:hover, .edit-link a:hover, .indexed.format-image footer.entry-meta a:hover, article.feature-image.small .entry-summary p a, article.feature-image.small .entry-summary p a:hover, article.feature-image.large .entry-title a, #access .menu-primary-container a:hover, #access .menu-primary-container a:active, #access .menu-primary-container a:focus, #access .current-menu-item a, #access .current-page-ancestor a, #wrapper .btn, .box-title, .box-info, .box-info a, input.wpcf7-submit, input.wpcf7-submit:hover, input.wpcf7-submit:focus, input.wpcf7-submit:active { color: #fff; } /* * * 3. Icons & Buttons * */ .box-title .queue { background:url(images/queue.png); width:10px; height:5px; display:block; line-height:1px; font-size:1px; position:absolute; right:-10px; top:0; } #wrapper .breadcrumb .page-parent-home { background:url(images/icons/home-breadcrumb.png); width:15px; height:15px; display:block; line-height:1px; font-size:1px; text-indent:-9999px; margin-top:3px; } #access .menu-primary-container .menu-item-home a { background:url(images/icons/home.png) no-repeat center #fff; height:20px; width:20px; text-indent: -9999px; } #access .menu-primary-container .menu-item-home a:hover, #access .menu-primary-container .menu-item-home a:active, #access .menu-primary-container .menu-item-home a:focus, #access .menu-primary-container .menu-item-home.current-menu-item a { background:url(images/icons/home-hover.png) no-repeat center #133e69; } #wrapper .btn { padding: 5px 10px; text-transform: uppercase; text-decoration: none; font: 400 14px/20px "ff-cocon-web-pro", sans-serif; position:relative; -moz-border-radius: 4px; border-radius: 4px; background:#f05646; -moz-box-shadow: 0 4px 0 #c04538; box-shadow: 0 4px 0 #c04538; behavior: url(http://miramind.fr/v5/wp-content/themes/miratech/js/pie/PIE.php); } #wrapper .btn:hover, #wrapper .btn:focus { background-color:#c04538; -moz-box-shadow: 0 4px 0 #90342a; box-shadow: 0 4px 0 #90342a; } #wrapper .btn:active { background-color:#c04538; -moz-box-shadow: none; box-shadow: none; position:relative; top:3px; } .box .btn { float:right; } .wrapper-white .btn { margin-right:20px; float:right; } #secondary .box .btn, #wrapper .realisation-testimony .btn { height:20px; padding:0 8px; font-size:12px; -moz-box-shadow: 0 2px 0 #c04538; box-shadow: 0 2px 0 #c04538; } #wrapper #secondary .btn:hover, #wrapper #secondary .btn:focus { -moz-box-shadow: 0 2px 0 #90342a; box-shadow: 0 2px 0 #90342a; } #wrapper #secondary .btn:active { background-color:#c04538; -moz-box-shadow: none; box-shadow: none; position:relative; top:2px; } #wrapper .wrapper-btn-twitter { position:relative; z-index: 99; } #wrapper .btn-twitter { background:url(images/icons/twitter.png) no-repeat 8px 2px #333333; -moz-box-shadow: 0 4px 0 #292929; box-shadow: 0 4px 0 #292929; padding-left: 38px; position:relative; padding: 3px 10px 0px 38px;} #wrapper .btn-twitter:hover, #wrapper .btn-twitter:focus { background-color:#1f1f1f; -moz-box-shadow: 0 4px 0 #000; box-shadow: 0 4px 0 #000; } #wrapper #footer .btn-twitter:active { background-color:#1f1f1f; -moz-box-shadow: none; box-shadow: none; } input.wpcf7-submit { padding: 5px 10px; text-transform: uppercase; text-decoration: none; font: 400 14px/20px "ff-cocon-web-pro", sans-serif; border:none; -moz-border-radius: 4px; border-radius: 4px; background:#f05646; -moz-box-shadow: 0 4px 0 #c04538; box-shadow: 0 4px 0 #c04538; float: right; behavior: url(http://miramind.fr/v5/wp-content/themes/miratech/js/pie/PIE.php); } input.wpcf7-submit:hover, input.wpcf7-submit:focus { background-color:#c04538; -moz-box-shadow: 0 4px 0 #90342a; box-shadow: 0 4px 0 #90342a; } input.wpcf7-submit:active { background-color:#c04538; -moz-box-shadow: none; box-shadow: none; position:relative; top:3px; } /* * * 4. Structure * */ body { text-align: center; background: url(images/noise.png) #eee; } #wrapper { overflow: hidden; } .inner { margin:0 auto; max-width: 1000px; padding:0; text-align:left; position:relative; } #main { clear: both; padding:0; border-top:10px solid #c4e7f9; } #main .inner { padding: 40px 0; } #primary { float: left; margin: 0; width: 66%; clear:both; } #secondary { float: right; margin: 0 0 0 2%; width: 32%; } .left-sidebar #primary { float: right; margin: 0 7.6%; width: 58.4%; } .left-sidebar #secondary { float: left; margin-left: 7.6%; width: 18.8%; } /* * * 5. Header * */ #header { position: relative; z-index: 9999; background:#c4e7f9; } #header .inner { padding:24px 20px; max-width: 960px; } #site-title a img{ margin-left:4px; float: left; } #site-description { position: absolute !important; clip: rect(1px 1px 1px 1px); /* IE6, IE7 */ clip: rect(1px, 1px, 1px, 1px); } #access { clear: both; display: block; margin: 0 auto; width: 100%; } #select-menu-primary, #access #trigger-menu { display:none; } #access .menu-primary-container { position:absolute; right:0; top:40px; } #access .menu-primary-container ul { font-size: 14px; list-style: none; } #access .menu-primary-container li { float: left; position: relative; margin-left:10px; } #access .menu-primary-container a { display: block; text-transform: uppercase; font: 400 14px/20px "ff-cocon-web-pro", sans-serif; text-decoration: none; padding:5px 10px; -moz-border-radius: 4px; border-radius: 4px; background:#fff; -moz-box-shadow: 0 4px 0 #e8e8e8; box-shadow: 0 4px 0 #e8e8e8; behavior: url(http://miramind.fr/v5/wp-content/themes/miratech/js/pie/PIE.php); } #access .menu-primary-container a:hover, #access .menu-primary-container a:focus { background: #133e69; -moz-box-shadow: 0 4px 0 #091f34; box-shadow: 0 4px 0 #091f34; } #access .menu-primary-container .current-menu-item a, #access .menu-primary-container .current-page-ancestor a, #access .menu-primary-container a:active { background: #133e69; -moz-box-shadow: none; box-shadow: none; position:relative;top:3px;} #access .menu-languages-container { position:absolute; right:-2px; top:0px; height:22px; background:url(images/icons/flag-background.png)no-repeat top right; -moz-border-radius-bottomright: 4px; -moz-border-radius-bottomleft: 4px; } .menu-languages-container ul{ list-style:none; padding:0px;} .menu-languages-container li{ margin-top:4px; margin-left:5px; float:left;} .menu-languages-container a { display:block; float:left; width:20px; height:12px; text-indent:-9999px; -moz-border-radius: 4px; border-radius: 4px; opacity: 0.4; -moz-box-shadow: 0 2px 0 #949cb2; box-shadow: 0 2px 0 #949cb2; behavior: url(http://miramind.fr/v5/wp-content/themes/miratech/js/pie/PIE.php); } .menu-languages-container a:hover, .menu-languages-container a:focus { -moz-box-shadow: 0 2px 0 #949cb2; box-shadow: 0 2px 0 #949cb2; opacity:1; } .menu-languages-container a:active, .menu-languages-container .menu-item-5 a { -moz-box-shadow: none; box-shadow: none; opacity:1; position:relative; top:1px; } .menu-item-4 a{ background:url(images/icons/drapeau-francais.png) no-repeat;} .menu-item-5 a{ background:url(images/icons/drapeau-anglais.png) no-repeat; margin-right:7px;} .assistive-text { clip: rect(1px 1px 1px 1px); /* IE6, IE7 */ clip: rect(1px, 1px, 1px, 1px); position: absolute !important; } #access a.assistive-text:active, #access a.assistive-text:focus { background: #eee; border-bottom: 1px solid #ddd; color: #1982d1; clip: auto !important; font-size: 12px; text-decoration: underline; position: absolute; top: 0; left: 7.6%; } /* * * 6. Aside, blocs, wrappers * */ .box { padding:40px 6px 10px 6px; border: solid transparent 14px; margin-bottom:30px; position:relative; background:rgba(255, 255, 255, 0.5); border-radius: 4px; -moz-border-radius: 4px; border-image: url(images/pattern-cross.png) 14 round; -pie-background:rgba(255, 255, 255, 0.5); behavior: url(http://miramind.fr/v5/wp-content/themes/miratech/js/pie/PIE.php); } #secondary .box { padding-top:30px; } .box-border { padding:15px 30px; background-color: white; display:block; -moz-background-clip: padding; -webkit-background-clip: padding; background-clip: padding-box; border: 10px solid rgba(255,255,255,0.5); position:relative; -moz-border-radius: 4px; border-radius: 4px; behavior: url(http://miramind.fr/v5/wp-content/themes/miratech/js/pie/PIE.php); } .box-title { -moz-border-radius-topleft: 4px; -moz-border-radius-bottomright: 0; -webkit-border-radius: 4px; -webkit-border-top-right-radius: 0; border-radius: 4px; border-radius-topright: 0; -pie-border-radius: 4px 0 4px 4px; border-radius: 4px; border-top-right-radius: 0; background:#899fb4; float:left; padding: 7px 19px; text-transform: uppercase; text-decoration: none; font: 400 20px/25px "ff-cocon-web-pro", sans-serif; behavior: url(http://miramind.fr/v5/wp-content/themes/miratech/js/pie/PIE.php); } .breadcrumb .box-title { position:relative; float:left; top:0; left:0; margin-bottom:-15px; } .box .box-title { position:absolute; top:-20px; left:5px; } #secondary .box-title, .box-metro .box-title{ position:absolute; top:-20px; left:5px; padding: 5px 10px; font: 400 15px/25px "ff-cocon-web-pro", sans-serif; } .wrapper-white .box-title { position:absolute; top:-5px; left:20px; z-index:2; } .box-title:hover, .box-title:focus { text-decoration: none; } .breadcrumb { padding:0; margin:0; list-style: none; position:relative; top:-45px; left:20px; zoom:1; } ul.breadcrumb { left:40px; top:-22px; } .breadcrumb li { padding:5px 5px 0 0; display: block; float:left; } .breadcrumb .page-parent { font: 400 15px/25px "ff-cocon-web-pro", sans-serif; float:left; text-transform: uppercase; } .breadcrumb .arrow { float:left; margin:0 8px 0 6px; } .wrapper-blue { background:url(images/noise-header.png) #C4E7F9; } .wrapper-white { background:#fff; clear:both; position:relative; } .widget_publications_widget ul, .widget_testimonies_widget ul { list-style-type:none; margin:0px;} .widget_publications_widget li { margin-bottom:10px;} .widget_publications_widget ul a { display:block; background-color:white; -moz-border-radius: 4px; border-radius: 4px; padding:10px; min-height:90px; color:#444; margin: 0px 5px; } .widget_publications_widget img { float:left;} .widget_publications_widget ul div {display:table-cell; height:90px; padding-left:10px; margin-bottom:0px; vertical-align:middle; } .widget_publications_widget .publi-home {padding-left:0px; width: 965px;} .widget_testimonies_widget blockquote { background:url('images/icons/quotes2.png') white no-repeat 15px 15px; position:relative; -moz-border-radius: 4px; border-radius: 4px; min-height:20px; margin:0px; padding:15px;} .page-template-revue-presse-php blockquote p, .widget_testimonies_widget blockquote p { margin-left:45px; margin-bottom:0px; } .page-template-revue-presse-php .author, .widget_testimonies_widget .author { margin-left:60px; color:#005d81;} .widget_testimonies_widget blockquote .queue-quote { background:url(images/queue-quote.png); width:20px; height:20px; display:block; line-height:1px; font-size:1px; position:absolute; left:30px; bottom:-20px; } .widget_references_widget ul{ margin-left:30px; margin-top:10px; list-style-type:disc; font-size:16px; line-height:22px; color:#899fb4; } /* * * 7. Footer * */ #footer { clear: both; background: url(images/noise-footer.png); padding: 30px 0; color:#7a7a7a; font-size:14px; zoom:1; } #footer .inner { padding:0 20px; max-width: 960px; } #footer ul a { color:#bdbdbd; } #footer .menu-primary-container *, #footer .menu-secondary-container, #footer .menu-secondary-container * { display:inline; } #footer .menu-primary-container { margin-bottom:20px; font-size: 18px; } #footer .menu-primary-container ul, #footer .menu-secondary-container ul { margin-left:0; } #footer .menu-primary-container li:first-child, #footer .menu-primary-container li:last-child span { display: none; } #footer .menu-primary-container span { font-size:16px; padding:0 2px; } #footer .menu-secondary-container span{ font-size:12px; padding:0 2px; } #footer .btn-twitter-wrapper { position:absolute; top:5px; right:20px; } #footer p.responsive { margin-bottom:0; } /* * * 8. Contents * */ .page-title { font-size: 10px; font-weight: 500; letter-spacing: 0.1em; line-height: 2.6em; margin: 0 0 2.6em; text-transform: uppercase; } .page-title a { font-size: 12px; font-weight: bold; letter-spacing: 0; text-transform: none; } .hentry, .no-results { border-bottom: 1px solid #ddd; position: relative; } .hentry{ border-bottom: none; } .hentry:last-child, .no-results { border-bottom: none; } .blog .sticky .entry-header .entry-meta { clip: rect(1px 1px 1px 1px); /* IE6, IE7 */ clip: rect(1px, 1px, 1px, 1px); position: absolute !important; } .entry-title { clear: both; } .entry-title, .entry-title a { text-decoration: none; } .entry-meta { clear: both; font-size: 12px; line-height: 18px; } .entry-meta a { font-weight: bold; } .single-author .entry-meta .by-author { display: none; } .entry-content table, .comment-content table { margin: 0 0 1.625em; width: 100%; } .entry-content th, .comment-content th { font-size: 10px; font-weight: 500; letter-spacing: 0.1em; line-height: 2.6em; text-transform: uppercase; } .entry-content td, .comment-content td { border-top: 1px solid #ddd; padding: 6px 0; } .entry-content #s { width: 75%; } .comment-content ul, .comment-content ol { margin-bottom: 1.625em; } .comment-content ul ul, .comment-content ol ol, .comment-content ul ol, .comment-content ol ul { margin-bottom: 0; } dl.gallery-item { margin: 0; } .page-link { clear: both; display: block; margin: 0 0 1.625em; } .page-link a { background: #eee; margin: 0; padding: 2px 3px; text-decoration: none; } .page-link a:hover { background: #888; font-weight: bold; } .page-link span { margin-right: 6px; } .edit-link a { background: #eee; -moz-border-radius: 3px; border-radius: 3px; margin-left:4px; font-size: 12px; line-height: 1.5em; font-weight: 300; text-decoration: none; padding: 2px 8px; } .entry-meta .edit-link a:hover, .commentlist .edit-link a:hover { background: #888; } .entry-content .edit-link { clear: both; display: block; } /* Images */ .entry-content img { max-width: 97.5%; /* Fluid images for posts, comments, and widgets */ } .entry-content img[class*="align"], .entry-content img[class*="wp-image-"], .entry-content img[class*="attachment-"] { height: auto; width:auto; max-width: 100%; /* Make sure images with WordPress-added height and width attributes are scaled correctly */ } img.size-full, img.size-large { max-width: 97.5%; width: auto; /* Prevent stretching of full-size and large-size images with height and width attributes in IE8 */ height: auto; /* Make sure images with WordPress-added height and width attributes are scaled correctly */ } .entry-content img.wp-smiley { border: none; margin-bottom: 0; margin-top: 0; padding: 0; } p img, .wp-caption { margin-top: 0.4em; } .wp-caption { background: #fff; margin-bottom: 1.625em; max-width: 96%; padding: 9px; } .wp-caption img { display: block; margin: 0 auto; max-width: 98%; } .wp-caption .wp-caption-text, .gallery-caption { color:#899fb4; text-align:center; } .wp-caption .wp-caption-text { margin-bottom: 0.6em; padding: 10px 0 5px 0; position: relative; } #main .gallery { margin: 0 auto 1.625em; } #main .gallery a img { border: none; } img#wpstats { display: block; margin: 0 auto 1.625em; } #main .gallery-columns-4 .gallery-item { width: 23%; padding-right: 2%; } #main .gallery-columns-4 .gallery-item img { width: 100%; height: auto; } /* Image borders */ #main .gallery .gallery-icon img { /* Add fancy borders to all WordPress-added images but not things like badges and icons and the like */ border: 1px solid #ddd; padding: 6px; } .wp-image-1446, .wp-image-1447, .wp-image-1449 { width: 80% !important;} .wp-caption img { border-color: #eee; } a:focus img[class*="align"], a:hover img[class*="align"], a:active img[class*="align"], a:focus img[class*="wp-image-"], a:hover img[class*="wp-image-"], a:active img[class*="wp-image-"], #main .gallery .gallery-icon a:focus img, #main .gallery .gallery-icon a:hover img, #main .gallery .gallery-icon a:active img { /* Add some useful style to those fancy borders for linked images ... */ background: #eee; border-color: #bbb; } .wp-caption a:focus img, .wp-caption a:active img, .wp-caption a:hover img { /* ... including captioned images! */ background: #fff; border-color: #ddd; } /* Make sure embeds and iframes fit their containers */ embed, iframe, object { max-width: 100%; } /* Password Protected Posts */ .post-password-required .entry-header .comments-link { margin: 1.625em 0 0; } .post-password-required input[type=password] { margin: 0.8125em 0; } .post-password-required input[type=password]:focus { background: #f7f7f7; } /* Navigation */ #main nav { clear: both; overflow: hidden; } #main nav a { font-size: 12px; font-weight: bold; line-height: 2.2em; } #nav-above { padding: 0 0 1.625em; } #nav-above { display: none; } .paged #nav-above { display: block; } .nav-previous { float: left; width: 50%; } .nav-next { float: right; text-align: right; width: 50%; } #main nav .meta-nav { font-weight: normal; } /* Singular navigation */ #nav-single { float: right; position: relative; top: -0.3em; text-align: right; z-index: 1; } #nav-single .nav-previous, #nav-single .nav-next { width: auto; } #nav-single .nav-next { padding-left: .5em; } #nav-single .nav-previous { padding-right: .5em; } /* * * 9. Contact * */ .page-template-contact-php #header { position:relative; z-index:5; -webkit-box-shadow: 0px 0px 30px rgba(0,0,0,0.5); -moz-box-shadow: 0px 0px 30px rgba(0,0,0,0.5); box-shadow: 0px 0px 30px rgba(0,0,0,0.5); } .page-template-contact-php #main { border-top: none; } #map-canvas { width:100%; } #main .inner-map-canvas { margin-top: -445px; margin-bottom: 445px; padding: 0; zoom:1; } .box-info, .box-metro { -webkit-box-shadow: 0px 0px 4px rgba(204,204,204,0.8); -moz-box-shadow: 0px 0px 4px rgba(204,204,204,0.8); box-shadow: 0px 0px 4px rgba(204,204,204,0.8); position:relative; width: 285px; behavior: url(http://miramind.fr/v5/wp-content/themes/miratech/js/pie/PIE.php); } .box-info { -moz-border-radius: 4px; border-radius: 4px; background: #133e69; margin-bottom: 15px; margin-right: 5px; text-align: center; float:right; padding: 15px 15px 20px; } .box-info img { margin-bottom:5px; } .box-info address { line-height:1.3em; margin:0 0 10px 0; } .box-info address a { font-weight: bold; } .box-info .btn { display: block; text-align: center; } .box-metro { -moz-border-radius: 4px; border-radius: 4px; background:#fff; float:right; text-align: left; padding:40px 15px 20px; clear:both; margin-right:5px; } .box-metro .box-title { top: -5px; left:15px; } .box-metro p { line-height:32px; margin:0; } .box-metro p img { margin-right:5px; vertical-align: bottom; } .page-template-contact-php .wpcf7-form { padding:10px 0 0 147px; } .page-template-contact-php .wpcf7-form p { position:relative; margin-bottom:10px; } .page-template-contact-php .wpcf7-form .wpcf7-form-control-wrap { display:block; padding-right:60px; margin-right:10px; } .page-template-contact-php .wpcf7-form .error { background:url(images/icons/error.png) right 8px no-repeat; } .page-template-contact-php .wpcf7-form .valid { background:url(images/icons/valid.png) right 5px no-repeat; } .page-template-contact-php .wpcf7-form label { width:145px; text-align: right; position:absolute; top:5px; left:-152px; font-size:18px; } .page-template-contact-php .wpcf7-text, .page-template-contact-php .wpcf7-textarea { width:100%; border:2px solid #bec9d4; padding:5px 10px; -moz-border-radius: 4px; border-radius: 4px; } .page-template-contact-php .wpcf7-text:focus, .page-template-contact-php .wpcf7-textarea:focus { border-color:#899fb4; color:#444; } .page-template-contact-php .mandatory { margin-top:-9px; padding-left:152px; padding-right:140px; font-size:18px; } .page-template-contact-php #errors { margin-top:-9px; padding-left:152px; padding-right:140px; color:#c00; font-size:18px; } .page-template-contact-php div.wpcf7-mail-sent-ok { margin:-9px 0 10px; padding:0 140px 0 0; color:#398F14; font-size:18px; border: none; } .page-template-contact-php .wpcf7-submit { position:relative; right:44px; top:-10px; -webkit-appearance: none; } .page-template-contact-php .wpcf7-submit:active { top:-7px; } #trigger-map { display: none; } .validationMessage{ color:#eb1c23;} /* * * 10. Includes * */ /* home */ .home #main .inner { padding:30px 0; } .home #main .inner .box { margin:0; z-index:99; } .home #main .wrapper-blue .inner { padding:55px 0; } .home .wrapper-blue h1 { margin-top:10px; } .home .wrapper-blue p { font-size:18px; } .home .wrapper-blue .entry-content { width:45.5%; margin-right:2%; float:left; position:relative; left:20px; } .home .wrapper-blue .entry-thumbnail { width:50%; position:absolute; bottom:-1px; right:0; } .home .wrapper-blue .entry-thumbnail img { width:100%; height:auto; display: block; } .home .wrapper-blue .entry-thumbnail img { /*width:100%; height:100%;*/ } .home .wrapper-blue a { text-decoration:none; border-bottom:dotted 1px #133E69; } .home .wrapper-blue a:hover { text-decoration:none; border-bottom:solid 1px #133E69; } .home .wrapper-blue a.btn, .home .wrapper-blue a.btn:hover{ border-bottom:none; } #home-secondary .wrapper-box { margin-right:2%; width:100%; float:left; } #home-secondary .wrapper-box .box { padding-bottom:40px; } #wrapper #home-secondary .wrapper-box .btn-wrapper { position:absolute; right:6px; bottom:10px; } #home-secondary .wrapper-widget_testimonies_widget { margin-right:0; } .reference-list { margin:0; padding:0; list-style:none; text-align:center; } .reference-list li { margin:0 8px; display:inline; } .reference-list li.reference-hidden { display:none; } .inner-bulle-list .btn-wrapper, .inner-reference-list .btn-wrapper { clear:both; text-align: right; padding:20px 0 3px; } .inner-bulle-list .btn-wrapper .btn, .inner-reference-list .btn-wrapper .btn { float:none; } .bulle-list { padding:0; list-style:none; } .bulle-list li { margin:5px; padding-top:73px; width:173px; height:100px; float:left; text-align:center; background-repeat:no-repeat; background-position:center; font-size:16px; line-height:1em; } .bulle-list strong { font: 400 40px/1em "ff-cocon-web-pro", sans-serif; display: block; } .bulle-chiffres-blogs { background-image:url(images/bulles/bulle-chiffres-blogs.png); } .bulle-chiffres-clients { background-image:url(images/bulles/bulle-chiffres-clients.png); } .bulle-chiffres-contact { background-image:url(images/bulles/bulle-chiffres-contact.png); } .bulle-chiffres-croissance{ background-image:url(images/bulles/bulle-chiffres-croissance.png); } .bulle-chiffres-existence { background-image:url(images/bulles/bulle-chiffres-existence.png); } .bulle-chiffres-international { background-image:url(images/bulles/bulle-chiffres-international.png); } .bulle-chiffres-labos { background-image:url(images/bulles/bulle-chiffres-labos.png); } .bulle-chiffres-pays { background-image:url(images/bulles/bulle-chiffres-pays.png); } .bulle-chiffres-surprises { background-image:url(images/bulles/bulle-chiffres-surprises.png); } .bulle-chiffres-utilisateurs { background-image:url(images/bulles/bulle-chiffres-utilisateurs.png); } /* offres */ .page-template-home-offers-php h2 { margin-bottom:10px; background-image:none; padding:0; } .box-sitemap { clear:both; } .box-sitemap .col { width:32%; margin:0 2% 2% 0; float:left; } .box-sitemap .col-3, .box-sitemap .col-6 { margin-right:0; } .box-sitemap .entry-content { text-align: center; } .box-sitemap .col img { height:60px } .box-sitemap ul { margin:0; list-style: none; font-size:16px; text-align:left; } .box-sitemap ul a { text-decoration:none; border-bottom:dotted 1px #133E69; } .box-sitemap ul a:hover { text-decoration:none; border-bottom:solid 1px #133E69; } .page-template-offer-php h1.entry-title { padding:10px 0; } .page-template-offer-php h1.entry-title img { float:left; margin-right:15px; } /* references */ .page-template-references-php #main { background-color:white;} .page-template-references-php #secondary .box { background-color:#fafafa;} .page-template-references-php .wp-caption { /* float:left; padding:0px; margin:0px; */} .page-template-references-php #primary { text-align:center; } .page-template-references-php .wp-caption { padding:0 0 50px; margin:0 auto; display:inline-block; position:relative; } .page-template-references-php .wp-caption img { padding-top:20px; margin:0 auto; display:inline; } .page-template-references-php .wp-caption p { padding:0px; margin:0; display:inline; width:160px; position: absolute; bottom: 30px; left: 0; z-index: 2; } /* press releases */ .page-template-revue-presse-php #primary{ width:100%;} .page-template-revue-presse-php ul { list-style-type:none; margin:0px;} .page-template-revue-presse-php blockquote{ background:url(images/icons/quotes2-white.png) #f4f6f8 no-repeat 15px 15px; position:relative; -moz-border-radius: 4px; border-radius: 4px; min-height:20px; margin:0px; padding:15px; } .page-template-revue-presse-php blockquote .queue-quote { background:url(images/queue-quote-gray.png); width:20px; height:20px; display:block; line-height:1px; font-size:1px; position:absolute; left:30px; bottom:-20px; } /* réalisations */ .realisation-list { clear:both; } .realisation { margin-bottom:20px; position:relative; overflow: hidden; } .realisation-presentation { padding:20px; background:#fafafa; background: rgba(255,255,255,0.5); position:relative; -moz-border-radius: 4px; border-radius: 4px; z-index: 10; behavior: url(http://miramind.fr/v5/wp-content/themes/miratech/js/pie/PIE.php); } .realisation h2 { font-weight: bold; font-size: 18px; } .realisation h3 { text-transform: uppercase; margin-top:20px; } .realisation-carousel { float:left; width:65%; } .carousel-view ul { margin:0; padding:0; list-style: none; position:relative; } .carousel-view ul li { position:relative; top:0; left:0; width:100%; } .carousel-view img { max-width:100%; } .carousel-nav { text-align:center; } .carousel-nav img { margin:10px 0 0; background:url(images/carousel-bullet.png) no-repeat center center;} .carousel-nav img:hover, .carousel-nav img.active { background-image:url(images/carousel-bullet-active.png); } .realisation-info { float:right; width: 32%; } .realisation-prestation { margin:15px 0 20px; padding:0; list-style:none; } .realisation-prestation li { background: url(images/checked.png) no-repeat 0 2px; padding-left:20px; } .realisation-link { color: #899fb4; } .realisation-testimony { padding:60px 20px 20px; background:#fafafa; background: rgba(255,255,255,0.5); position:absolute; top:0; left:300px; z-index: 20; -moz-border-radius: 4px; border-radius: 4px; behavior: url(http://miramind.fr/v5/wp-content/themes/miratech/js/pie/PIE.php); display: none; } .realisation blockquote a.trigger-testimony { text-decoration: underline; } .realisation blockquote a.trigger-testimony:hover { text-decoration: none; } .page-template-realisations-php .widget_testimonies_widget blockquote p { margin-bottom: 1em; } .realisation-testimony-close { position:absolute; right:20px; top:18px; } /* * * 11. Responsive design * */ /* menu trop long qui passe sur le logo */ @media (max-width: 1000px) { #access .menu-primary-container { margin-right:10px } } @media (max-width: 900px) { .widget_publications_widget ul a { width: 45%;} } /* ipad vertical 768px */ @media (min-width: 767px) and (max-width: 768px) { .bulle-list { margin-left:90px; } } @media (max-width: 800px) { /* Simplify the basic layout */ #main #primary { margin: 0; width: auto; float:none; } #main #secondary, .home .wrapper-blue .entry-thumbnail, #footer .menu-primary-container { display:none; } #footer .btn-twitter-wrapper { top:0; } #footer .responsive { padding-right:200px; } .home .wrapper-blue .entry-content { float:none; width:100%; margin:0; } #home-secondary .wrapper-box { margin-right:0; width:100%; float:none; } #home-secondary .widget_testimonies_widget { margin-bottom:0; } .box-sitemap .col { width:49%; height:auto; margin:0 2% 2% 0; float:left; } .box-sitemap .col-3 { margin-right:2%; } .box-sitemap .col-2, .box-sitemap .col-4, .box-sitemap .col-5, .box-sitemap .col-6 { margin-right:0; } .widget_publications_widget ul a { width: 45%;} } /* mini tablette 480px */ @media (max-width: 650px) { #header .inner { text-align: left; } #site-title a img { float:left; } #access .menu-primary-container { position:absolute; right:0; top:40px; width:100px; margin-right:0px} #menu-primary, ul.breadcrumb { display:none; } #select-menu-primary { display:block; opacity:0; height:30px; width:72px; margin:0; position:absolute; top:0; right:20px; z-index: 10; border:solid 17px white; } #access #trigger-menu { display:inline; position:absolute; top:0; right:10px; padding-right:25px; position: relative;} #access #trigger-menu img{ position: absolute; top: 10px; right: 8px;} #footer .btn-twitter-wrapper { margin-top:20px; position:relative; top:0; right:0; } #footer .responsive { padding-right:0; } body, input, textarea { font-size: 16px; } .entry-content h1, .entry-title { font-size: 30px; } .entry-content h2 { font-size: 18px; } .entry-content h3 { font-size: 16px; } .box-title { font-size: 16px; } #secondary .box-title, .box-metro .box-title{ font-size: 16px; } /* Floated content doesn't work well at this size */ .alignleft, .alignright { display: block; float: none; margin-left: 0; margin-right: 0; } /* offers */ .box-sitemap .col { width:auto; height:auto; margin:0 0 20px; float:none; } /* contact */ #main .inner-map-canvas { margin:0; padding:20px 0; } #main .inner-map-canvas .box-info { margin:0 2% 25px; width:auto; float:none; } #main .inner-map-canvas .box-metro { margin:0 2% -30px; width:auto; float:none; } .page-template-contact-php .wpcf7-form { padding-left:20px; } .page-template-contact-php .wpcf7-form label { width:auto; text-align: left; display: block; position: static; } .page-template-contact-php .mandatory, .page-template-contact-php #errors { padding-left:20px; line-height:1em; } .page-template-contact-php div.wpcf7-mail-sent-ok { line-height:1.2em; } #wrapper-map-canvas { position:relative; } #trigger-map { display:block; position:absolute; top:5px; right:5px; } /* realisation */ .realisation-carousel { margin-bottom:10px; width:100%; float:none; } .realisation-info { width:100%; float:none; } .realisation a.trigger-testimony { display:none; } /*Home*/ .widget_publications_widget ul a { width: 96%; float:none; margin-bottom:10px;} .widget_publications_widget li { margin-bottom:0px;} .page-template-society-php .our-job img{ width:98% !important; margin:0px 0px 10px 0px !important;} } @media only screen and (min-device-width: 320px) and (max-device-width: 480px) { .entry-content h1, .entry-title { font-size: 26px; } /* home */ .widget_publications_widget ul a, .widget_publications_widget ul a div { min-height:0; height:auto; } .widget_publications_widget img { display:none; } .reference-list li { margin:0 1%; width:48%; } .page-template-references-php .wp-caption-text { display: none; } .bulle-list { margin:0; } .bulle-list li { margin:0; width:140px; padding-top:60px; height:80px; background-size: 140px; font-size:14px; } .bulle-list strong { font-size:24px; } } /* * * 12. Print * */ @media print { body { background: none !important; font-size: 10pt; } footer.entry-meta a[rel=bookmark]:link:after, footer.entry-meta a[rel=bookmark]:visited:after { content: " [" attr(href) "] "; /* Show URLs */ } #wrapper { clear: both !important; display: block !important; float: none !important; max-width: 100%; position: relative !important; } #header { border-top: none !important; padding: 0; } #header hgroup { margin: 0; } #site-title a { font-size: 21pt; } #site-description { font-size: 10pt; } #header #searchform, #header img, #access, .entry-meta .edit-link a, #content nav, .entry-header .comments-link, .page-link, #respond, .widget-area, #footer, #comments { display: none; } #main { border-top: none; box-shadow: none; } #primary { float: left; margin: 0; width: 100%; } .singular #primary { margin: 0; width: 100%; } .singular .entry-header .entry-meta { position: static; } .singular .entry-header, .singular .entry-content, .singular footer.entry-meta, .singular #comments-title { margin: 0; width: 100%; } .singular .hentry { padding: 0; } .entry-title, .singular .entry-title { font-size: 21pt; } .entry-meta { font-size: 10pt; } .singular #author-info { background: none; border-bottom: none; border-top: none; margin: 2.2em 0 0; padding: 0; } } /* * * 13. IE Fix * */ /* fix typekit irregular line-height */ #ie6 #access .menu-primary-container a, #ie7 #access .menu-primary-container a, #ie8 #access .menu-primary-container a, #ie9 #access .menu-primary-container a, #ie6 #main .btn, #ie7 #main .btn, #ie8 #main .btn, #ie9 #main .btn, #ie6 #wrapper .btn-twitter, #ie7 #wrapper .btn-twitter, #ie8 #wrapper .btn-twitter, #ie9 #wrapper .btn-twitter, #ie6 input.wpcf7-submit, #ie7 input.wpcf7-submit, #ie8 input.wpcf7-submit, #ie9 input.wpcf7-submit, #ie6 #secondary .box-title, #ie7 #secondary .box-title, #ie8 #secondary .box-title, #ie9 #secondary .box-title, #ie6 .box-metro .box-title, #ie7 .box-metro .box-title, #ie8 .box-metro .box-title, #ie9 .box-metro .box-title { padding-top: 8px; padding-bottom: 2px; } #ie6 .box-title, #ie7 .box-title, #ie8 .box-title, #ie9 .box-title { padding-top: 15px; padding-bottom: 5px; } #ie6 #secondary .box .btn, #ie7 #secondary .box .btn, #ie8 #secondary .box .btn, #ie9 #secondary .box .btn { padding-top: 4px; padding-bottom: 0; } /* template fixing margin */ #ie6 #header .inner, #ie7 #header .inner { padding-bottom:0 } #ie6 .clear, #ie7 .clear { height:1px; } #ie6 .box-metro p, #ie7 .box-metro p { margin:5px 0 -7px; } #ie6 .box-metro p img, #ie7 .box-metro p img { position:relative; top:-13px; } #ie6 #main .inner-map-canvas, #ie7 #main .inner-map-canvas { margin-bottom:40px; } /* fix client page removing caption */ #ie6 .page-template-references-php .wp-caption, #ie7 .page-template-references-php .wp-caption { float:left; display:block; }