/* --------------------------------------------------- * GENERAL --------------------------------------------------- */ div.row.zonepage div.texte a { color: #383636; text-decoration: underline; } div.row.zonepage div.texte ul { margin-left: 20px; } img.alignleft { float: left; margin: 0 10px 0 0; } body { margin: 0; padding: 0; background: #383636; color: #383636; font-family: Verdana; } .row { max-width: 1000px; } #footer-menu{display:none;} #menu { margin: 0; padding: 0; background: #fff; border-bottom: 3px solid #e03c31;} #menu .row { } #menu .row nav.top-bar { background: none; margin: 0; padding: 0; line-height: auto; min-height: 140px; } #menu .row nav.top-bar ul.title-area li.name { background: none; width: 210px; } #menu .row nav.top-bar ul.title-area li.name h1 { height: 100%; width: 210px; } #menu .row nav.top-bar ul.title-area li.name h1 a { height: 90px; width: 257px; display: block; background: url('../image/logo-trcc.jpg') no-repeat center; text-indent: -9999em; margin: 20px 0 0;} #menu .row nav.top-bar section.top-bar-section { background: none; } #menu .row nav.top-bar section.top-bar-section ul { float:right; background: none; margin: 0; padding: 0; } #menu .row nav.top-bar section.top-bar-section ul li { background: none; margin: 0; padding: 0; border-right: 1px solid #c3c2c2; } #menu .row nav.top-bar section.top-bar-section ul li a { background: none; color: #383636; font-weight: normal; padding: 61px 10px; margin: 0; font-size: 13px; line-height: 18px; font-family: 'Ubuntu', sans-serif; } #menu .row nav.top-bar section.top-bar-section ul li:first-child { border-left: 1px solid #c3c2c2; } #menu .row nav.top-bar section.top-bar-section ul li a:hover { border: none; color: #fff; background: #e03c31; } /* #menu .row nav.top-bar section.top-bar-section ul li:hover { border-right: 1px solid #e03c31; } */ /* #menu .row nav.top-bar section.top-bar-section ul li:hover:first-child { border-left: 1px solid #e03c31; } */ #menu .row nav.top-bar section.top-bar-section ul li:hover a { border: none; color: #fff; background: #e03c31; } #menu .row nav.top-bar section.top-bar-section ul li > a::after { border-top-color: rgba(56, 54, 54, 0.496094); } #menu .row nav.top-bar section.top-bar-section ul li > a:hover::after { border-top-color: rgba(255, 255, 255, 0.496094); } #menu .row nav.top-bar section.top-bar-section ul li ul { background: #383636; padding: 0; margin: 0; border-top: 3px solid #e03c31; } #menu .row nav.top-bar section.top-bar-section ul li ul li { border: none; border-bottom: 1px solid #605e5e; padding: 0; margin: 0; } #menu .row nav.top-bar section.top-bar-section ul li ul li a { background: #383636; border: none; padding: 15px 10px; font-size: 14px; line-height: 1em; margin: 0; color: #b7b7b7; min-width: 250px; } #menu .row nav.top-bar section.top-bar-section ul li:hover ul li a { background: #383636;} #menu .row nav.top-bar section.top-bar-section ul li ul li a:hover { background: #e03c31; border: none; color: #fff;} #menu .row nav.top-bar section.top-bar-section ul li ul li:hover { border: none; background: none; border-bottom: 1px solid #605e5e; } .toplink{display:none;color:#B7B7B7;font-size:12px; margin:0 0 0 15px;} .toplink:hover{color:#e03c31;} .lw_list_latest_posts{list-style:none;} .lw_list_latest_posts li{padding: 25px 0; border-top:2px solid #6D6E71;} .lw_list_latest_posts li:first-child{border-top:none;} @media only screen and (max-width: 240px)/* smartphone */ { #menu .row nav.top-bar ul.title-area li.name h1 a { height: 90%; width: 65%; display: block; background: url('../image/logo-trcc.jpg') no-repeat center / cover;} /*#footer-menu{display:block;}*/ } @media only screen and (max-width: 979px)/* tablette et plus petit */ { #menu .row nav.top-bar section.top-bar-section ul li a { background: none; color: #383636; font-weight: normal; padding: 10px 15px; margin: 0; font-size: 14px; line-height: 18px; font-family: 'Ubuntu', sans-serif; } #menu .row nav.top-bar section.top-bar-section ul { background: #383636; } #menu .row nav.top-bar ul.title-area { min-height: 120px; } #menu .row nav.top-bar.expanded ul.title-area { background: none; } #menu .row nav.top-bar ul.title-area li.toggle-topbar.menu-icon { background: none; top: 20px; } #menu .row nav.top-bar section.top-bar-section ul li > a:hover::after { border-top-color: #e03c31; } #menu .row nav.top-bar section.top-bar-section ul li:first-child { border: none; border-bottom: 1px solid #605e5e; } #menu .row nav.top-bar section.top-bar-section ul li { border: none; border-bottom: 1px solid #605e5e; padding: 0; margin: 0; } #menu .row nav.top-bar section.top-bar-section ul li a { background: #383636; border: none; padding: 15px 10px; font-size: 14px; line-height: 1em; color: #b7b7b7; min-width: 250px; } #menu .row nav.top-bar .toggle-topbar a { color: #383636; font-family: 'Ubuntu', sans-serif; } #menu .row nav.top-bar .toggle-topbar a span { -webkit-box-shadow: 0 10px 0 1px #383636, 0 16px 0 1px #383636, 0 22px 0 1px #383636; box-shadow: 0 10px 0 1px #383636, 0 16px 0 1px #383636, 0 22px 0 1px #383636; } .toplink{display:inline;} } @media only screen and (min-width: 980px)/* ordi */ { } #intro { background: url('../image/fond-intro.jpg') no-repeat center; background-size: cover; height: 130px; } #content { background: #fff; position: relative; } #footer div.col { float: left; margin: 26px 0 0 0; padding: 0 20px 20px; border-left: 1px solid #605e5e; font-size: 11px; color: #b7b7b7; height: 160px; } #footer div.col:first-child { border-left: none; } #footer div.col a { color: #b7b7b7; } #footer div.col h6 { font-size: 14px; padding: 0; margin: 0; } #footer div.col h6 a { font-size: 14px; } #footer div.col ul { padding: 0; margin: 16px 0 0 15px; list-style-type: square; } #footer p.copyright { padding: 30px 25px; margin: 0; color: #b7b7b7; line-height: 1.4em; font-size: 10px; font-style: italic; } #footer p.copyright a { color: #b7b7b7; text-decoration: underline; } @media only screen and (max-width: 767px) { #footer div.col { display: none; overflow: hidden; } #footer p.copyright { padding: 30px 25px; margin: 0; color: #b7b7b7; line-height: 1.4em; font-size: 10px; font-style: italic; } #footer p.copyright a { color: #b7b7b7; text-decoration: underline; } } @media only screen and (min-width: 768px) and (max-width: 979px)/* tablette widescreen*/ { #footer div.col { display: none; overflow: hidden; } #footer p.copyright { padding: 30px 25px; margin: 0; color: #b7b7b7; line-height: 1.4em; font-size: 10px; font-style: italic; } #footer p.copyright a { color: #b7b7b7; text-decoration: underline; } } /* --------------------------------------------------- * HOMEPAGE --------------------------------------------------- */ #intro.home { height: 460px; } #intro.home h1 { font-size: 32px; line-height: 1.3em; font-weight: normal; font-family: Verdana; padding: 0; margin: 50px 0; color: #383636; } #content.home .row.line1 { margin-top: -70px; } #content.home .row.line1 .columns { margin-top: -70px; margin-bottom: 40px; } #content.home .row .columns .row { margin: 0; } #content.home .row .columns { margin-bottom: 40px; } #content.home .row .columns .bloc { padding: 15px; border-top: 5px solid #e03c31; border-bottom: 1px solid #cecece; background: #fff; height: 290px; } #content.home .row .columns .bloc.manufacturing { background: #fff url('../image/ill-ContractManufacturing.jpg') bottom no-repeat; } #content.home .row .columns .bloc.products-services { background: #fff url('../image/ill-ProductsServices.jpg') bottom no-repeat; } #content.home .row .columns .bloc p.h2 { color: #e03c31; margin: 0; padding: 0 0 25px 0; font-size: 22px; font-family: 'Ubuntu', sans-serif; } #content.home .row .columns .bloc p.a { font-size: 14px; padding: 0; margin: 0; } #content.home .row .columns .bloc p.a a { color: #383636; } #content.home .row .columns .bloc p.a a:hover span.color { color: #e03c31; } #content.home img.ill-resource.wp-post-image { width: 90%; } span.fleche { display: inline-block; width: 26px; height: 12px; } span.fleche span { display: inline-block; width: 16px; height: 16px; background: url('../image/fleche_16x16.png') no-repeat; } #content.home .row .columns .bloc div.sliders { margin: 0; padding: 0; } #content.home .row .columns .bloc div.sliders div.columns { margin: 0; padding: 0; } #content.home .row .columns .bloc div.navigation { float: right; margin: 20px 0 10px 0; padding: 0; } #content.home .row .columns .bloc div.navigation a.prev { margin: 0 3px 0 0; height: 33px; width: 28px; background: #f2f2f2 url('../image/prev.png') no-repeat center; display: block; float: left; text-indent: -9999em; } #content.home .row .columns .bloc div.navigation a.next { height: 33px; width: 28px; background: #d0d1d3 url('../image/next1.png') no-repeat center; display: block; float: left; text-indent: -9999em; } #content.home .row .columns .bloc.contactinformations { height: 350px; } #content.home .row .columns .bloc.contactinformations h3 { font-size: 14px; padding: 10px 0 3px 0; margin: 0; } #content.home .row .columns .bloc.contactinformations p.contact { font-size: 12px; padding: 0; margin: 0; line-height: 1.3em; } #content.home .row .columns .bloc.contactinformations p.contact.first { font-size: 14px; } #content.home .row .columns .bloc.contactinformations p.contact span.strong { font-weight: bold; } #content.home .row .columns .bloc.contactinformations p.contact a { color: #383636; text-decoration: underline; } #content.home .row .columns .bloc.contactinformations p.contact a:hover { color: #e03c31; } #content.home form { margin-top: 30px; } #content.home form input.text { border: 1px solid #cecece; -webkit-box-shadow: none; box-shadow: none; color: #383636; } #content.home form input[type="submit"] { -webkit-box-shadow: none; box-shadow: none; color: #fff; background: #e03c31; border: none; padding: 10px 15px; font-size: 14px; font-weight: normal; float: right; } #content.home form ::-webkit-input-placeholder { color:#383636; } #content.home form ::-moz-placeholder { color:#383636; } /* firefox 19+ */ #content.home form :-ms-input-placeholder { color:#383636; } /* ie */ #content.home form input:-moz-placeholder { color:#383636; } @media only screen and (max-width: 767px) { #intro.home { min-height:180px;height: auto; } #intro.home h1 { font-size: 20px; line-height: 1.3em; font-weight: normal; font-family: Verdana; padding: 0; margin: 25px 0; color: #383636; } #content.home .row.line1 { margin-top: 0; } #content.home .row.line1 .columns { margin-top: 0; margin-bottom: 40px; } #content.home .row .columns .row { margin: 0; } #content.home .row .columns { margin-bottom: 40px; } #content.home .row .columns .bloc { padding: 15px; border-top: 5px solid #e03c31; border-bottom: 1px solid #cecece; height: 180px; } #content.home .row .columns .bloc.products-services { background-image: none; margin-top: -30px; } #content.home .row .columns .bloc.manufacturing { background-image: none; } #content.home .row .columns .bloc.contactinformations { /*height: 350px;*/ } #content.home .row .columns .bloc p.h2 { padding: 0 0 15px 0; font-size: 18px; } #content.home .row .columns .bloc p.a { font-size: 12px; padding: 0; margin: 0; } } @media only screen and (min-width: 768px) and (max-width: 979px) { #intro.home { height: 250px; } #intro.home h1 { font-size: 24px; line-height: 1.3em; font-weight: normal; font-family: Verdana; padding: 0; margin: 30px 0 25px 15px; color: #383636; } #content.home .row.line1 { margin-top: -30px; } #content.home .row.line1 .columns { margin-top: -30px; margin-bottom: 40px; } #content.home .row .columns .bloc.products-services { background-image: none; } #content.home .row .columns .bloc.manufacturing { background-image: none; } #content.home .row .columns .bloc p.h2 { padding: 0 0 15px 0; line-height: 1.2em; } #content.home .row .columns .bloc.resource { height: 350px; } } @media only screen and (min-width: 980px) { } /* --------------------------------------------------- * PAGE INTERIEUR --------------------------------------------------- */ #intro h1 { font-size: 36px; line-height: 1.3em; font-weight: normal; font-family: Verdana; padding: 0; margin: 20px 0; color: #383636; } #content { padding: 0 0 40px 0; } #content div.columns.content { margin-top: -40px; background: #fff; border-top: 7px solid #e03c31; } #content div.columns.content div.breadcrumbs { font-size: 10px; padding: 10px 10px 45px 10px; border: none; background: none; } #content div.columns.content div.breadcrumbs a { color: #383636; font-size: 10px; padding-bottom: 45px; border: none; background: none; } #content div.columns.content div.breadcrumbs a.active { font-weight: bold; } #content div.columns.content div.zonepage { font-size: 12px; padding: 10px; line-height: 1.5em;} #content div.columns.content div.zonepage header { padding: 0 0 40px 0; } #content div.columns.content div.zonepage header h2 { font-size: 2em; padding: 0 0 15px 0; margin: 0; } #content div.columns.content div.zonepage header h3 { font-weight: normal; font-size: 1.6em; color: #6d6e71; padding: 0 50px 0 0; margin: 0; } #content div.columns.content div.zonepage div.ligne { padding: 0; margin: 0 -15px 40px; border-bottom: 3px solid #eaeaea; } #content div.columns.content div.zonepage header h4 { color: #e03c31; padding: 0; font-size: 1.7em; margin: 0; } #content div.columns.content div.zonepage header p { font-weight: normal; font-size: 1.25em; color: #6d6e71; padding: 5px 100px 5px 0; margin: 0; } #content div.columns.content div.zonepage div.texte { padding: 0 100px 0 0; margin: 0; line-height: 1.6em; color: #6d6e71; } #content div.columns.content div.zonepage div.texte img.align-left { padding: 0; margin: 3px 10px 10px 0; float: left; } #content div.columns.content div.zonepage div.texte h1 { padding: 0; margin: 0; font-size: 1.9em; } #content div.columns.content div.zonepage div.texte h2 { padding: 0; margin: 0; font-size: 1.7em; } #content div.columns.content div.zonepage div.texte h3 { padding: 0; margin: 0; font-size: 1.5em; } #content div.columns.content div.zonepage div.texte h4 { padding: 0; margin: 0; font-size: 1.3em; color: #e03c31 } #content div.columns.content div.zonepage div.texte h5 { padding: 0; margin: 0; font-size: 1.3em; } #content div.columns.content div.zonepage div.texte h6 { padding: 0; margin: 0; font-size: 1.1em; color: #e03c31 } #content div.columns.content div.zonepage div.texte ul.lw_list_latest_posts h3 { padding: 0 0 20px 0; } #content div.contactus { padding: 36px 0 35px 25px; margin: 0; font-size: 12px; } #content div.contactus p.h1 { font-weight: bold; font-size: 1.7em; color: #e03c31; padding: 0px 0 30px 40px; margin: 0; background: url('../image/fleche_27x27.jpg') no-repeat 0 3px; } #content div.contactus p.h3 { font-weight: bold; font-size: 1.2em; padding: 0 0 10px 0; margin: 0; } #content div.contactus p.contact { padding: 0; margin: 0; } #content div.contactus p.contact a { color: #383636; } #content nav.navigationdroite { padding: 36px 0 35px 25px; margin: 0; font-size: 12px; } #content nav.navigationdroite ul { padding: 0; margin: 0; list-style: none; } #content nav.navigationdroite ul li { padding: 0; margin: 0; } #content nav.navigationdroite ul li a { padding: 15px 6px; margin: 0; display: block; border-bottom: 1px solid #6d6e71; color: #6d6e71; font-size: 1.2em; } #content nav.navigationdroite ul li.active a { border-bottom: 2px solid #e03c31; color: #e03c31; font-weight: bold; } @media only screen and (max-width: 767px) { #intro { height: auto; } } @media only screen and (max-width: 979px)/* tablette et plus petit */ { #content div.columns.content { margin-top: -40px; background: #fff; } #content div.columns.content{ margin:0; border-top: none; } #intro { background: url("../image/fond-intro-responsive.jpg")center center no-repeat !important; background-size:cover; border-bottom: 7px solid #e03c31; } #content div.columns.content div.zonepage div.texte{ padding:0; } #content div.columns.content div.zonepage header h3{ padding:0; } } @media only screen and (max-device-width: 979px)/* tablette et plus petit */ { #content div.columns.content { margin-top: -40px; background: #fff; } #content div.columns.content{ margin:0; border-top: none; } #intro { background: url("../image/fond-intro-responsive.jpg")center center no-repeat !important; background-size:cover; border-bottom: 7px solid #e03c31; } #content div.columns.content div.zonepage div.texte{ padding:0; } #content div.columns.content div.zonepage header h3{ padding:0; } } /* --------------------------------------------------- * PAGE TUNNEL --------------------------------------------------- */ #content div.columns.content div.liste { font-size: 12px; } #content div.columns.content div.liste div.columns div.bloc { margin: 0 0 15px 0;} #content div.columns.content div.liste div.columns div.bloc a.bloc { color: #383636; position: relative; display: block; padding: 0; border-top: 5px solid #e03c31; border-bottom: 1px solid #cecece; background: #fff; height: 250px; } #content div.columns.content div.liste div.columns div.bloc a.bloc img { height: 80px; width: 100%; background: #ccc; } #content div.columns.content div.liste div.columns div.bloc a.bloc div.txt { position: absolute; top: 80px; bottom: 0; left: 0; right: 0; background: #fff; padding: 10px 15px;} #content div.columns.content div.liste div.columns div.bloc a.bloc div.txt h4 { font-size: 1.3em; color: #383636; } #content div.columns.content div.liste div.columns div.bloc a.bloc div.txt p { line-height: 1.5em; } span.fleche { display: inline-block; width: 26px; height: 12px; } span.fleche span { display: inline-block; width: 16px; height: 16px; background: url('../image/fleche_16x16.png') no-repeat; margin: 0 0 0 10px; } #content div.columns.content div.liste div.columns div.bloc a.bloc:hover {border-top: 5px solid #000066; background: #fff; box-shadow: 0 2px 5px -1px rgba(0, 0, 0, 0.7); } a.bloc:hover span.fleche span { background: url('../image/fleche_16x16_h.png') no-repeat;} .alignright{ float:right; display:inline-block; } .wp-caption{ padding:3px; border:1px solid #6D6E71; } p.wp-caption-text{ margin:0; } img.ill-resource{ margin:6px 0 0 0 !important; } a[href^="mailto:"]{ color:#383636; text-decoration:underline !important; } a[href^="mailto:"]:hover{ color:#E03C31 !important; } /* * * Brand revamp, March 2020 * * */ /* General/home page: */ :root { --darkBlue: #132048; --blue: #0054a4; --orange: #f37321; --black: #000; --gray: #e6e7e8; } body { background: var(--black); color: var(--black); } #menu { border-bottom: 3px solid var(--blue); } #footer div.col, #footer div.col a { color: white; } #footer p.copyright { color: var(--gray); } #footer div.col { border-left: 1px solid var(--gray); } #intro.home h1 { color: var(--black); } #content.home .row .columns .bloc p.a a { color: var(--black); } #content.home .row .columns .bloc p.a a .color { color: var(--black); font-style: italic; text-decoration: underline; display: block; } #content.home .row .columns .bloc { border-bottom: 1px solid var(--gray); } #content.home .row .columns .bloc { border-top: 5px solid var(--blue); } #content.home form input[type="submit"] { background: var(--orange); } #content.home .row .columns .bloc p.h2 { color: var(--black); } span.fleche span { background: url('../image/fleche_16x16-2020.png') no-repeat !important; vertical-align: bottom; } #menu .row nav.top-bar ul.title-area li.name h1 a { height: 90px; width: 257px; display: block; background: url('../image/trcc-canada-logo-new.png') no-repeat center; text-indent: -9999em; margin: 20px 0 0; } #menu .row nav.top-bar section.top-bar-section ul li > a::after { border-top-color: var(--black) !important; } #menu .row nav.top-bar section.top-bar-section ul li:hover a, #menu .row nav.top-bar section.top-bar-section ul li ul li a:hover { /* background: var(--orange); */ background: white; color: black; } #menu .row nav.top-bar section.top-bar-section ul li ul li a:hover { text-decoration: underline; } #menu .row nav.top-bar section.top-bar-section ul li ul li a { /* background: var(--black); */ color: black; background: white; } #menu .row nav.top-bar section.top-bar-section ul li:first-child { border-left: 1px solid var(--gray); } #menu .row nav.top-bar section.top-bar-section ul li { border-right: 1px solid var(--gray); } #menu .row nav.top-bar section.top-bar-section ul li:hover ul li a { /* background: var(--black); */ background: white; } #menu .row nav.top-bar section.top-bar-section ul li:hover ul li a:hover { /* background: var(--orange) */ } /* Sub-pages */ #content div.columns.content { border-top: 7px solid var(--blue); } #content div.columns.content div.zonepage header h4 { color: var(--orange); } #content div.contactus p.h1 { color: var(--orange); } #content nav.navigationdroite ul li.active a { border-bottom: 2px solid var(--orange); color: var(--orange); } #content nav.navigationdroite ul li a:hover { color: var(--darkBlue); } #content div.columns.content div.zonepage div.texte { color: black; } #content nav.navigationdroite ul li a { border-bottom: 1px solid var(--gray); } #content nav.navigationdroite ul li a { color: var(--blue); } a[href^="mailto:"] { color: var(--blue) !important; } a[href^="mailto:"]:hover { color: var(--darkBlue) !important; } #content div.contactus p.h1 { background: url('../image/fleche_27x27-2020.jpg') no-repeat 0 3px; } #content div.columns.content div.zonepage div.texte h6 { color: var(--orange); } #content div.columns.content div.zonepage header { padding-bottom: 20px; } div.row.zonepage div.texte a { color: var(--blue); } div.row.zonepage div.texte a:hover { color: var(--darkBlue); }