*/
opacity: 0;
position: absolute;
top: 0;
left: 50%;
transform: translateX(-50%);
}
div.wngInfo li:nth-child(2) a.images-container > img:nth-child(2) {
position: relative;
top: -50px;
}
/* hover */
div.productsWng a.images-container:hover > img:nth-child(1),
div.wngInfo a.images-container:hover > img:nth-child(1) {
opacity: 0;
z-index: 1;
}
div.productsWng a.images-container:hover > img:nth-child(2),
div.wngInfo a.images-container:hover > img:nth-child(2) {
opacity: 1;
height: inherit;
z-index: 2;
}
footer .wngContact {
background: #252c32;
padding-bottom: 35px;
}
footer .wngContact .section-content {
color: #fff;
padding: 0px;
}
footer .wngContact ul li {
padding: 0 20px;
line-height: normal;
list-style-type: none;
display: inline-block;
white-space: nowrap;
font-size: 20px;
font-weight: 300;
}
footer .wngContact a {/*color: #e5064b;*/
color: rgba(255,255,255,.55);
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
transition: all 0.3s ease;
white-space: nowrap;
}
footer .wngContact a:hover {/*color: #ba0f40;*/
color: rgba(255,255,255,1);
text-decoration: none;
}
/* OTHER STYLES */
.w-toplink:focus {
color: #fff !important;
}
.w-toplink:hover {
color: #fff !important;
}
p {
margin-bottom: 25px;
}
.title p {
margin: 0;
}
.powermail_create p {
text-align: left;
font-size: 22px;
}
/* tarteaucitron */
#tarteaucitronRoot * {
font-family: "ars-maquette-web", Arial, sans-serif !important;
}
#tarteaucitronAlertBig #tarteaucitronDisclaimerAlert,
#tarteaucitronAlertBig #tarteaucitronDisclaimerAlert b {
font: 14px "ars-maquette-web", Arial, sans-serif !important;
}
#tarteaucitronAlertBig #tarteaucitronCloseAlert,
#tarteaucitronAlertBig #tarteaucitronPersonalize {
font-size: 14px !important;
text-transform: uppercase;
}
#tarteaucitronAlertBig {
background: rgba(37, 44, 50, 0.95) !important;
padding: 10px 5% !important;
}
#tarteaucitronAlertBig #tarteaucitronCloseAlert {
background: #9b26b6 !important;
color: #ffffff !important;
text-align: center;
margin: 5px 0px 5px 0px;
padding: 10px 30px !important;
display: inline-block;
border: 0;
font-weight: bold;
font-size: 12px;
cursor: pointer;
text-transform: none !important;
border-radius: 50px;
}
#tarteaucitron #tarteaucitronServices .tarteaucitronMainLine,
#tarteaucitron #tarteaucitronServices .tarteaucitronMainLine:hover,
#tarteaucitronAlertSmall #tarteaucitronCookiesListContainer #tarteaucitronCookiesList .tarteaucitronTitle,
#tarteaucitron #tarteaucitronServices .tarteaucitronTitle,
#tarteaucitron #tarteaucitronInfo,
#tarteaucitron #tarteaucitronServices .tarteaucitronDetails,
#tarteaucitronAlertSmall #tarteaucitronCookiesListContainer #tarteaucitronClosePanelCookie,
#tarteaucitron #tarteaucitronClosePanel {
background: #9b26b6 !important;
}
#tarteaucitron .tarteaucitronBorder,
#tarteaucitron #tarteaucitronServices .tarteaucitronMainLine {
border-color: #9b26b6 !important;
}
#tarteaucitronAlertBig #tarteaucitronPersonalize {
border-color: #2bb673 !important;
background: #2bb673 !important;
color: #FFFFFF !important;
text-align: center;
margin: 5px 0px 5px 0px;
padding: 8px 30px !important;
display: inline-block;
border: 0;
font-weight: bold;
font-size: 12px;
cursor: pointer;
text-transform: none !important;
border-radius: 50px;
}
#tarteaucitronPercentage {
background: #2bb673 !important;
height: 3px !important;
}
/*Loader*/
.loader{
width:100%;
height:100%;
background:#fbfbfb;
position: fixed;
z-index: 99999999999;
display:flex;
align-items: center;
justify-content: center;
}
.loader img{
}
/*************************** CUSTOM RESPONSIVE CSS TYPO3 ***************************/
@media screen and (max-width: 1520px) {
#comment .img-comment {
width: 80%;
right: -10%;
}/* Safari 4.0 - 8.0 */
@-webkit-keyframes example {
0% {
bottom: -300px;
}
100% {
bottom: -280px;
}
}/* Standard syntax */
@keyframes example {
0% {
bottom: -300px;
}
100% {
bottom: -280px;
}
}
}
@media (min-width: 1200px) {
footer .wngContact .col-md-8 ul {
text-align: right;
}
footer .wngContact ul li:first-child {
padding-left: 0;
}
footer .wngContact ul li:last-child {
padding-right: 0;
}
}
@media (max-width: 1199px) {
.wng-data {
text-align: center;
}
.l-header.sticky .w-logo-img {
padding-top: 17px;
padding-bottom: 17px;
}
}
@media (min-width: 992px) and (max-width: 1199px) {
.wngContact .section-content > .row > div {
text-align: center;
}
}
@media (min-width: 992px) {
footer .wngContact .col-md-8 ul li {
float: none;
width: auto;
}
}
/* Media Queries - Screen under 1000px */
@media screen and (max-width: 1000px) {
.l-header.full_width .l-header-h {
padding: 0px !important;
}
.l-header .w-logo {
float: left;
margin-bottom: 0px;
margin-top: 15px;
}
.l-header.transparent .w-logo, .l-header.green .w-logo,
.l-header.white .w-logo {
margin-top: 0px;
}
.l-header.white .touch_enabled .w-nav-control, .l-header.white .login-icon .fa {
color: #000;
}
.l-header.white .touch_enabled .w-nav-control:hover,
.l-header.white .login-icon:hover .fa {
color: #9b26b6;
}
.l-header.green .touch_enabled .w-nav-control:hover,
.l-header.green .login-icon:hover .fa {
color: #fff;
}
.l-header.white .login-icon {
border: 1.5px solid #000;
}
.l-header.white .login-icon:hover {
border: 1.5px solid #9b26b6;
}
.l-header.green .login-icon:hover {
border: 1.5px solid #000;
}
#logo-svg {
height: 50px !important;
margin-top: 3px;
width: 180px;
}
.w-nav-control {
margin-top: 15px;
}
.l-header .w-nav {
float: none;
width: auto;
}
.l-header .w-nav .w-nav-anchor {
line-height: 50px;
}
.l-header {
line-height: 50px;
}
.l-header.transparent-white .w-logo-link {
width: 200px;
}
.l-header.transparent-white-scroll .w-logo-link {
margin-top: 0px;
width: auto;
}
.l-header.transparent-white-scroll .w-logo-link .w-logo-img {
height: 70px !important;
}
.l-header.scroll .w-logo-img {
height: 70px !important;
}
.l-header.scroll .w-logo-link {
width: auto !important;
}
}
/* Media Queries - Screen under 992px */
@media screen and (max-width: 992px) {/* FOOTER */
.loader img {
width: 20vw;
}
.graph .bar-1 {
background-color: rgba(155, 38, 182, 0.05);
}
.graph .bar-2 {
background-color: rgba(155, 38, 182, 0.1);
}
.graph .bar-3 {
background-color: rgba(155, 38, 182, 0.15);
}
#accueil .text-header-section .point-wng {
margin-left: 10px;
width: 2.5vw;
}
div.productsWng a.images-container > img {
width: 40%;
max-width: 100%;
margin: auto;
}
.product .images-container {
margin-top: 0;
}
footer .wngInfo h3 {
margin-top: 0px !important;
}
.graph {
position: absolute;
bottom: 0;
right: 0;
transform: scale(0.5);
transform-origin: right bottom;
}
.l-header .w-nav-list li:last-of-type .w-nav-anchor {
margin-bottom: 25px;
}
.l-header.scroll .w-logo-img {
height: 70px !important;
width: 65% !important;
}
.l-header.sticky .w-logo-img {
padding-top: 0px;
padding-bottom: 0px;
}
.social-links {
margin-top: 30px;
}
#pour-qui .col-md-6:first-child {
padding-bottom: 100px;
display: inline-block;
}
#pour-qui .col-md-6:nth-child(2) {
position: initial;
}
.l-header .w-logo-img {
width: 100%;
}
#comment .img-comment {
width: 100%;
position: relative;
right: initial;
top:0;
}
#comment .col-md-8 {
margin-bottom: -160px;
}/* Safari 4.0 - 8.0 */
@-webkit-keyframes example {
0% {
top: 0px;
}
100% {
top: 20px;
}
}/* Standard syntax */
@keyframes example {
0% {
top: 0px;
}
100% {
top: 20px;
}
}
#comment > .l-subsection, #comment section.l-subsection {
padding-bottom: 0px;
}
footer .productsWng .productsWngImg.mailtoo {
background-size: auto;
}
footer .productsWng .productsWngImg.mailtoo:hover {
background-size: auto;
}
.category {
top: 40px;
}
.col-md-3.col-xs-12.product {
padding-bottom: 30px;
}
.col-md-3.col-xs-12.product:nth-child(4) {
padding-bottom: 0;
}
.wng-data {
text-align: center;
}
#tarteaucitronAlertBig #tarteaucitronCloseAlert,
#tarteaucitronAlertBig #tarteaucitronPersonalize {
margin-top: 10px;
}
footer .wngInfo .wngLogo {
width: 80%;
}
footer .wngInfo .wngLogo.color {
left: 50%;
transform: translateX(-50%);
}
.mailtoo{
margin-top: -25px !important;
}
}
/* Media Queries - Screen under 768px */
@media screen and (max-width: 768px) {
#pour-qui .col-md-6:first-child {
padding-bottom: 60px;
}
.l-subsection h2 {
font-size: 40px;
}
.l-header .w-logo {
width: 200px;
margin-top: 0px;
}
.l-header .w-logo-img {
width: 65%;
height: 70px !important;
}
footer .wngInfo .wngLogo {
max-width: 80%;
}
#accueil .l-subsection.background {
background-attachment: inherit;
}
#accueil .text-header-section .slogan-icon {
font-size: 13vw;
}
#accueil .text-header-section h1 {
font-size: 8vw;
}
#accueil:after {
height: 40px;
}
#accueil .text-header-section .sep-text {
margin: 0px 15px;
}
#accueil .text-header-section h2 {
font-size: 6vw;
}
#accueil .l-subsection.background {
padding: 100px 0px 70px 0px;
}
.powermail_fieldwrap_type_submit div {
margin-top: 20px;
}
#accueil:before {
height: 120px;
}
#accueil .text-header-section .slogan-icon .icon-tree {
width: 17vw;
top: 4vh;
}
#accueil .text-header-section .slogan-icon .icon-paper {
width: 22vw;
top: 4vh;
}
.login-header .login-btn-container .button {
font-size: 12px;
margin-bottom: 25px;
margin-right: 30px;
margin-top: 10px;
padding: 10px 30px;
}
#pourquoi .services-block {
margin-top: 40px;
margin-bottom: 40px;
min-height: inherit;
height: auto;
}
#pourquoi .l-subsection h2 {
text-align: center;
}
#pour-qui .l-subsection {
padding: 0px;
}
#pourquoi .services-block h3 {
margin: 10px 0;
}
#contact .powermail_fieldset .layout1, #contact .powermail_fieldset .layout2 {
padding: 0px !important;
width: 100% !important;
}
#contact .powermail_fieldset .layout3 {
margin-right: 0px;
padding: 0px !important;
}/* FOOTER */
div.productsWng a.images-container > img {
width: 50%;
}
footer .productsWng .col-sm-3 {
float: left;
width: 25%;
}
footer .wngInfo h3 {
font-size: 22px;
}
}
/* Media Queries - Screen under 635px */
@media screen and (max-width: 635px) {
.l-subsection {
padding: 35px 0;
}
#pourquoi .l-subsection {
padding: 5px 0px 15px;
}
#accueil .container-fluid {
margin-bottom: 61px;
}
#accueil .slider-info {
bottom: -61px;
font-size: 22px;
}
#footer-contact .productsWng .col-sm-4 {
float: none;
margin-bottom: 40px;
width: 100%;
}
#footer-contact .productsWng .col-sm-4:last-of-type {
margin-bottom: 0px;
}
#footer-contact .productsWng .productsWngImg.mailtoo {
background-size: auto;
}
#footer-contact .productsWng .productsWngImg.webcommune {
background-size: auto;
}
#footer-contact .productsWng .productsWngImg.rapportAnnuel {
background-size: auto;
}
#footer-contact .productsWng .productsWngImg.mailtoo:hover {
background-size: auto;
}
#footer-contact .productsWng .productsWngImg.webcommune:hover {
background-size: auto;
}
#footer-contact .productsWng .productsWngImg.rapportAnnuel:hover {
background-size: auto;
}
}
@media screen and (max-width: 600px) {
#comment .col-md-8 {
margin-bottom: -50px;
}
}
/* Media Queries - Screen under 575px */
@media screen and (max-width: 575px) {
.login-header .login-btn-container {
display: block;
padding: 0 40px;
}
.login-header .login-btn-container .button {
display: block;
float: none;
width: 100%;
}
.mailtoo{
margin-top:-15px !important;
}
}
/* Media Queries - Screen under 450px */
@media screen and (max-width: 450px) {
.l-header.full_width .l-header-h {
padding: 0px 0px !important;
}
.login-header {
padding: 20px 20px 0px;
}
.login-header .login-form .input-field {
padding: 0px;
}
.login-header .login-form .input-field label {
left: 0px;
}
.login-icon .fa {
margin-top: 5px;
}
#logo-svg {
margin-top: 7px;
width: 150px;
}
.l-subsection {
padding: 25px 0;
}
#accueil .l-subsection.background {
}
#accueil .title h2 {
font-size: 36px;
}
.l-subsection .button {
margin-top: 40px;
}
}
/* Media Queries - Screen under 400px */
@media screen and (max-width: 400px) {
.login-header .login-btn-container {
padding: 0 20px;
}
footer ul li {
font-size: 20px;
}
}