@import url('https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,100;0,300;0,400;0,500;0,700;0,900;1,100;1,300;1,400;1,500;1,700;1,900&display=swap');
*{box-sizing: border-box}
* [onclick] {cursor: pointer; }
body,html{overflow-x: hidden;}
body { font-family: "Roboto", sans-serif; margin:140px 0 0 0; width:100%; font-size:62.5%; overflow-x: hidden;}
a:link{color:rgba(213, 68, 1, 1); text-decoration: none}
a:visited{color:#882B00}
a:hover{ color:rgba(136, 43, 0, 1)}
a:active{color: #882B00;}
h1{font-size:2.6em;}
h2{font-size:1.6em;}
h3{font-size:1.4em; color: #1F1F20}
h4{font-size:1.2em;}
h5{font-size:1.2em;}
h6{font-size:1.2em}
.mobi-only,.quick-enquiry-block,.menu-top>label,#mobi-toggle,#navOverlay,.item-hide{display:none}
.ecat-value{box-sizing: content-box; visibility:hidden;position:absolute; max-width:100px; top:0; left:0; z-index:-1}

.pro-details-find,.btn1{display: inline-block; padding:18px 12px; min-width: 144px; text-align:center; font-size:16px; background:rgba(213, 68, 1, 1); color: #fff !important}
.btn-bg{display: inline-block; padding:18px 12px; min-width: 144px; text-align:center; font-size:16px; border: 1px solid  rgba(0, 0, 0, 1); color: #000}
a > button{ display: contents; all: unset}

/*================== MAIN SECTION ============================*/
.back_page{ width:100%; font-size:16px; color: rgba(82, 87, 92, 1); padding:15px; line-height: 1.8em; display: table}
.back_page p{text-align:justify;}
.breadcrum-block{margin: 0; padding: 0; display: flex; flex-wrap: wrap;}
.breadcrum-block li{list-style: none;color:  rgba(31, 31, 32, 1); padding-right: 10px; font-size: 12px }
.breadcrum-block a{color:  rgba(31, 31, 32, 1); font-weight: bold; text-decoration: underline}
.arteor-netatmo-banner,.connected-home-banner,.arteor-netatmo-back_page{margin-right: calc((100vw - 1280px) / -2); margin-left: calc((100vw - 1280px) / -2); width: 100vw }
.netatmo-distributors-back_page,.connected-switches-sockets-back_page{margin-right: calc((100vw - 1280px) / -2); margin-left: calc((100vw - 1280px) / -2); width: 100vw; padding: 0}

.electrical-solution{position:absolute; visibility:hidden; z-index:999999;}
.electric-socket-1{width:100%; z-index:100; position: fixed; top: 0; display: flex;  flex-wrap: wrap; justify-content: space-between; background: #fff; border-bottom: 1px solid rgba(226, 228, 230, 1); max-width: 1663px; margin: auto; left: 0; right: 0;}
.electrical-header{ max-width:1140px; width: 100%; margin:0 auto; display: flex; flex-wrap: wrap; align-items: flex-end;}
.electrical-supplies-2{ position:relative; width:100%;}
.electrical-section{ max-width:1280px; margin:auto auto;}
.menu-top-container{display: flex; justify-content: space-between; flex-wrap:wrap; width: 100%}

.electric-socket-1.custom-menu-scroll-down{ background-color: #fff}
.electric-socket-1.custom-menu-scroll-down .nav > li > span, .electric-socket-1.custom-menu-scroll-down .nav > li > a{color:#000}
.electric-socket-1.custom-menu-scroll-down .portal-block{display: none}
.electric-socket-1.custom-menu-scroll-down .menu-top-container{width: 30%}
.electric-socket-1.custom-menu-scroll-down .menu-top{order: -1}
.electric-socket-1.custom-menu-scroll-down .widget-container{width: 100%}
.electric-socket-1.custom-menu-scroll-down .electrical-header{justify-content: space-between; align-items: center;}
.electric-socket-1.custom-menu-scroll-down:before{display: none}
.electric-socket-1.custom-menu-scroll-down .logo{height: 80px}
.electric-socket-1.custom-menu-scroll-down .search input{color: #73757b}
.electric-socket-1.custom-menu-scroll-down .search a img{filter: invert(100%);}
.electric-socket-1.custom-menu-scroll-down .search ::-webkit-input-placeholder {color: #73757b;}
.electric-socket-1.custom-menu-scroll-down .search ::-moz-placeholder{color: #73757b;}
.electric-socket-1.custom-menu-scroll-down .search :-ms-input-placeholder {color: #73757b;}
.electric-socket-1.custom-menu-scroll-down .search :-moz-placeholder {color: #73757b;}
.electric-socket-1.custom-menu-scroll-down{}

/*================= MENUS ======================*/
.menu-top{ position:relative;}

.menu-top label{display: none}
.nav{margin:0; padding:0}
.nav > li{float: left; position:relative; list-style:none}
.nav > li{color:#fff}
.nav > li > span,.nav > li > a{display: inline-block; color:rgba(31, 31, 32, 1); ; text-transform:uppercase; padding:0 25px; line-height:47px; font-size:1.4em; text-decoration:none; transition:all .3s; background-color:transparent !important;}
.nav > li span:hover, .nav > li:hover > span,.nav > li a:hover, .nav > li:hover > a{cursor: pointer}

.dropdown-menu li{position:relative; list-style: none;border-bottom:1px solid #f1f1f1; width: 100%}
.dropdown-menu li:last-of-type{border:none }
.dropdown-menu{padding:0; margin:0; display: none; background-color:rgba(255,255,255,.9) !important; min-width:250px; left:20px; position:absolute; box-shadow: 0 0 1px 1px rgba(0,0,0,.175); font-size: 14px}
.dropdown-menu a{color:#404040; transition:background-color .3s; padding: 10px 15px; display: block }
.dropdown-menu li:hover a{color:rgba(213, 68, 1, 1);}
.dropdown-menu.long-dropdown{min-width: 440px; justify-content: space-between}
.dropdown-menu.long-dropdown li{width: 49%}

/*================ Dropdown ===================*/
@media screen and (min-device-width: 768px){	
	.active{border:solid 1px #fff}
	.dropdown:hover:not(.CLOSEDROPDOWN) .dropdown-menu{display:flex; flex-wrap: wrap}
}

.menu-where-buy {width:auto; position: relative; font-size:.9em; text-transform:uppercase;display: flex; align-items: center;}
.menu-where-buy > div > a{transition:background-color .5s; font-size: 0.9em;}
.menu-where-buy a:hover{color:#1F1F20}
.menu-where-buy ul{padding: 0}

.menu-where-buy > ul > li{float: left; list-style: none; font-weight:bold; padding:19px 30px; position:relative; margin-top:-12px !important;}
.menu-where-buy > ul > li:first-of-type{padding: 0; white-space: nowrap}
.menu-where-buy > ul > li:first-of-type a{padding:19px 30px !important; display: inline-block;}
.menu-where-buy > ul > li:last-of-type{padding-left:0; padding-right:0}
.menu-where-buy > ul > li a{color: white}
.menu-where-buy  li ul{position: absolute; display: none; width:180px; padding:7px 20px; border-left:5px solid #1F1F20; left:-45px;  background-color: white; box-shadow: 1px 1px 2px 1px #666; }
.menu-where-buy  li:hover ul{display: block}
.menu-where-buy  li ul li{list-style: none; }
.menu-where-buy  li ul li a{color: #333; line-height:35px; }
.menu-where-buy span{color:#fff;}
.menu-where-buy i{font-size: 18px}
.menu-where-buy sup{font-size: 12px; position:unset}

.menu-side{position:relative; padding: 20px; width:20%; background: #fff; border: solid 1px #E2E4E6;}
.menu-side ul{padding: 0; margin-bottom: 0}
.menu-side li{list-style: none; font-size: 1em; padding:0; margin-top:1px; line-height:18px; display: flex}
.menu-side span{font-size:1.2em; font-weight: bold; color: #1F1F20; border-bottom: 1px solid #E2E4E6; width: 100%; display: block; padding-bottom: 10px; margin-bottom: -10px;}
.menu-side span:nth-of-type(2){margin-top: 40px; display: inline-block}
.menu-side a{padding:13px 0; display: inline-block; width:100%; color: #1F1F20; font-size: 14px}
.menu-side a img{ margin-right: 5px;}
.menu-side li:hover a{font-weight: bold}

.text-block-main,.dowload-solution-block{display: flex; justify-content: space-between; flex-wrap: wrap; padding-top: 30px; align-items: flex-start; margin-bottom: 20px;}
.reference-projects-text,.text-block,.services-text,.download-software-block,.download-brochure-block{width: 77%; background-color: #fff; padding: 20px; margin-bottom: 30px;}
.download-brochure > div h3{margin-bottom: 0; font-weight: normal; font-size: 16px; line-height: 20px; border-bottom: solid 2px rgb(213 68 1); padding-bottom: 5px; min-height: 50px}

/*==================== LOGO =======================*/
.logo{position:relative; width: 160px; height: 140px; background-color: #ED1C24}
.logo a{width: 100%; height: 100%; display: flex; align-items: center; padding: 18px}
.logo img{width: 100%; height: auto; display: block}

.portal-block{width:63%; display: flex; align-items: center; height: 100%;}
.portal-block > ul{padding: 0; width: 100%; margin: 0; display: flex; flex-wrap: wrap; justify-content: space-between}
.portal-block > ul > li{list-style: none; position: relative}
.portal-block > ul > li > span,.portal-block > ul > li  > a{color:rgba(115, 117, 123, 1); display: flex; align-items: center; padding: 15px; font-size: 14px;}
.portal-block > ul > li  > span img,.portal-block > ul > li  > a img{display: block; margin-right: 7px; filter: brightness(40%);}

/*===================== SEARCH ======================*/
.widget-container{width:35%; display: flex; align-items: center;    border: 1px solid rgba(115, 117, 123, 1);}
.widget-container > div{width: 100%}
.search{ position:relative;font-weight:normal; width: 100%; height:46px; background: rgba(255, 255, 255, 0.3); align-items: center; justify-content: space-between; padding: 0 5px; display: flex}
.search div{position:relative; float:left; border:1px solid #D6D2D2; border-bottom-left-radius:5px; border-top-left-radius:5px; width:50%; height:17px; padding:3px; padding-left:5px; padding-top:1px;}
.search a{position:relative;text-align:center; padding:4px}
.search a img{display: block; filter: brightness(40%);}
.search input{ position:relative; border:none !important; color:#73757b; height:100%; width: 88%; background: transparent;    outline: none;}

/*Google Custom*/
.search-box > div{ position:relative !important; float:right; }
.search-box > div > span{ position:absolute; right:0px; float:right;  z-index: -1; font-size:22px; }

.gsc-input{background: white; padding:0 !important}
.gsc-input *{border: none !important; padding:0 !important; box-shadow: none !important}
.gsc-search-box{ padding: 0px !important; height: 26px;}
.gsc-input-box{margin:0 !important; height:27px !important; width:165px; background-color: transparent !important}
.gsc-input{height:32px !important; border: solid 1px white; margin:0; margin-top:-5px !important}
.gsc-search-box input{height:auto !important; width:auto !important; background: none !important; font-size:.9em !important}
button.gsc-search-button, button.gsc-search-button:hover{background-color: #2A336E !important; border: none !important; border-radius: 0 !important;padding: 5px !important ;margin: 0 !important;}
#___gcse_0 > form > table.gsc-search-box > tbody > tr > td.gsc-search-button{opacity: 0}

.search ::-webkit-input-placeholder {color: white;}
.search ::-moz-placeholder{color: white;}
.search :-ms-input-placeholder {color: white;}
.search :-moz-placeholder {color: white;}

.basket-displaytotal{ font-size: 16px; font-weight: bold;color: #707070;  text-align: center; left: 30px; position:absolute }
.portal-dropdown > a:hover{ color:#1F1F20}
.portal-dropdown .fa{font-size: 18px;}
.portal-dropdown{ position:relative}
.portal-dropdown{ position:absolute;background-color:#ffffff; text-transform: uppercase;font-size:12px; width:360px; z-index:101; top: 50%; right: 0%; transform: translate(0%, 34%); display:none; border: solid 1px #dbdbdb; border-radius: 4px;}
.portal-dropdown{ position:absolute;background-color:#ffffff; text-transform: uppercase;font-size:12px; width:360px; z-index:101; top: 50%; left: 0%; transform: translate(0, 17%); display:none; border: solid 1px #dbdbdb; border-radius: 4px;}
.portal-dropdown ul li,.portal-dropdown ul li{ list-style:none}
.portal-dropdown ul,.user-block ul{ padding:0; margin:0}
.portal-dropdown ul:first-of-type li,.user-block ul:first-of-type li{ text-align:center}
.portal-dropdown ul .btn1,.user-block ul .btn1{ min-width:150px;font-size: inherit; margin: auto; color: #fff}
.portal-dropdown ul .btn1:hover,.user-block ul .btn1:hover{ text-decoration:none}
.portal-dropdown ul:first-of-type li:last-of-type a,.user-block ul:first-of-type li:last-of-type a{ color:#ED1C24}
.portal-dropdown ul:first-of-type li:last-of-type, .user-block ul:first-of-type li:last-of-type{ padding-top:0}
.portal-dropdown ul:last-of-type,.portal-dropdown ul:nth-of-type(3),.portal-dropdown ul:nth-of-type(2),.portal-dropdown ul:last-of-type{ display:flex;flex-wrap: wrap;}
.portal-dropdown ul:last-of-type{ border-top:1px solid #dbdbdb;}
.portal-dropdown ul:nth-of-type(3) li,.portal-dropdown ul:nth-of-type(2) li,.portal-dropdown ul:last-of-type li,.portal-dropdown ul:last-of-type li{ width:50%; border-bottom:0; border-right:1px solid #dbdbdb; text-align: center}
/*.portal-dropdown ul:last-of-type li:last-of-type{width: 100%; border-top: 1px solid #dbdbdb;}*/
.portal-dropdown ul:nth-of-type(2) {border-bottom: 1px solid #ccc;}
.portal-dropdown ul li,.user-block ul li{ list-style:none; text-align:left;border-bottom: 1px solid #ccc; transition:all 0.5s }
.portal-dropdown ul li:first-of-type,.user-block ul li:first-of-type{ border-bottom:none}
.portal-dropdown ul li,.user-block ul li{display: inline-block; padding:12px 20px; width:100%}
.portal-dropdown ul li a,.user-block ul li a{ color:#333232}
.portal-dropdown ul li:hover a,.user-block ul li:hover a{ text-decoration:underline}
.portal-dropdown:before,.portal-dropdown:before{ content:"";border-style: solid; border-style: dashed; border-width: 9px; border-color: transparent; border-top-width: 0; border-bottom: 9px solid #dbdbdb; width: 0; height: 0; font-size: 0;  line-height: 0; position: absolute; bottom: 98%; left:15%; transform: translate(-50% , -50%); z-index: -1;}
.portal-dropdown:before{ bottom: 96%;}
.sign-block-text{color: #363435;font-size: 12px;line-height: 15px; font-weight:bold; margin-right: 8px;}
.sign-block-text a{color: #fff}
.sign-block-text a:hover{ color:#1F1F20}
#basketOrder_totalitems{ position:absolute !important; right:auto !important; color:#1F1F20 !important; top:7px !important; left:22px}

#ExtContent_Popup .portal-dropdown,#ExtContent_Popup .portal-dropdown{background-color:#ffffff; text-transform: uppercase;font-size:12px; width:100%;transform:unset;position:relative;display:block}
#ExtContent_Popup .portal-dropdown .btn1,#ExtContent_Popup .portal-dropdown .btn1{ padding:8px 10px !important}
#ExtContent_Popup .portal-dropdown ul, #ExtContent_Popup .portal-dropdown ul{ padding:0; margin:0; width:100%; display: flex; flex-wrap: wrap;}
#ExtContent_Popup .portal-dropdown ul:first-of-type li,#ExtContent_Popup .portal-dropdown ul:first-of-type li{ text-align:center}
#ExtContent_Popup .portal-dropdown ul .btn1,#ExtContent_Popup .portal-dropdown ul .btn1{ min-width:150px; color:#fff}
#ExtContent_Popup .portal-dropdown ul .btn1:hover,#ExtContent_Popup .portal-dropdown ul .btn1:hover{ text-decoration:none}
#ExtContent_Popup .portal-dropdown ul:first-of-type li:last-of-type a,#ExtContent_Popup .portal-dropdown ul:first-of-type li:last-of-type a{ color:#ED1C24}
#ExtContent_Popup .portal-dropdown ul:first-of-type li:last-of-type,#ExtContent_Popup .portal-dropdown ul:first-of-type li:last-of-type{ padding-top:0; color: #404040;}
#ExtContent_Popup .portal-dropdown ul:last-of-type li{ width:100%; border-bottom:0; border-right:1px solid #dbdbdb;}
#ExtContent_Popup .portal-dropdown ul:last-of-type li{ width:50%}
#ExtContent_Popup .portal-dropdown ul li,#ExtContent_Popup .portal-dropdown ul li{ list-style:none; text-align:left;border-bottom: 1px solid #ccc; transition:all 0.5s }
#ExtContent_Popup .portal-dropdown ul li{border-right: 1px solid #ccc;}
#ExtContent_Popup .portal-dropdown ul:first-of-type li:first-of-type,#ExtContent_Popup .portal-dropdown ul:first-of-type li:first-of-type{ border-bottom:none}
#ExtContent_Popup .portal-dropdown ul li,#ExtContent_Popup .portal-dropdown ul li{display: inline-block; padding:12px 8px; width:100%}
#ExtContent_Popup .portal-dropdown ul li a,#ExtContent_Popup .portal-dropdown ul li a{ color:#404040; text-decoration:none}
#ExtContent_Popup .portal-dropdown ul li:hover a,#ExtContent_Popup .portal-dropdown ul li:hover a{ text-decoration:underline}
#ExtContent_Popup .portal-dropdown:before,#ExtContent_Popup .portal-dropdown:before{ display:none;}

#ExtContent_Popup .portal-dropdown ul:nth-of-type(3),#ExtContent_Popup .portal-dropdown ul:nth-of-type(2),.portal-dropdown ul:last-of-type{display:flex;}
#ExtContent_Popup .portal-dropdown ul:nth-of-type(2) li{width:50%;border-right:1px solid #dbdbdb;}
#ExtContent_Popup .portal-dropdown ul:nth-of-type(3){ width:100%}
#ExtContent_Popup .portal-dropdown ul:nth-of-type(3) li{ width:50%; border-left: 1px solid #ccc;}
#ExtContent_Popup .portal-dropdown ul:last-of-type li{width:50%;border-bottom:0;border-right:1px solid #dbdbdb;}
#ExtContent_Popup .portal-dropdown ul:last-of-type li:first-of-type span{ display:none }
#ExtContent_Popup .portal-dropdown ul li{ list-style:none; text-align:left;border-bottom: 1px solid #ccc; transition:all 0.5s }

.home-banner{ display:flex; margin:auto; position:relative; max-width:1663px; width:100%;text-align:center; overflow:hidden}
.home-banner:before{content: ""; position: absolute; left: 0; bottom:0; background:rgb(92 82 82 / 50%); width: 50%; height: 560px; z-index: 2;backdrop-filter: blur(17px)}
.csslider1 > .cs_description .cs_title strong{font-size: 60px; line-height: 60px; display: block; margin-bottom:20px}
.csslider1 > .cs_description .cs_wrapper b{font-size: 28px; line-height: 30px; font-weight: normal; text-transform: uppercase;}
.csslider1 > .cs_description .cs_descr p{font-size: 18px; line-height: 28px; font-weight: normal; display: block; margin-bottom: 55px}
.csslider1 > .cs_description .home-btn{display: inline; padding: 17px 36px; background: #fff; color: #000 !important; font-size: 16px; margin-bottom: 25px}
.csslider1 > .cs_description > label span{width: 100%}

.home-banner2{ display:table; max-width:1663px; width:100vw; max-height:450px; }
.home-banner2 p{ font-size:16px !important; line-height:22px; height:54px}
.home-banner2 h2{ font-size:28px; text-transform:none; font-weight:normal; margin:0}

.intro-recommended-products{display:flex;justify-content: space-around; flex-wrap: wrap; max-width: 1280px; align-items: baseline; margin: 50px auto; padding: 0 15px}
.intro-recommended-products > span{color: rgba(82, 87, 92, 1); font-size: 14px; width: 100%; text-align: center; text-transform: uppercase; padding: 10px; margin-bottom: 20px }
.intro-recommended-products > span strong{font-size: 40px; line-height: 40px; display: block; color:rgba(31, 31, 32, 1);    margin-top: 10px;}
.home-intro-products{display: flex; flex-wrap: wrap; justify-content: space-around; margin: auto; max-width: 1280px; width: 100%}
.home-intro-products > div{border: solid 1px transparent; width: 32%; box-shadow: 0 0 10px rgba(0, 0, 0, .15); transition: .3s all}
.home-intro-products > div:hover{ width: 32%; box-shadow: 0 0 10px rgba(0, 0, 0, .15); border: solid 1px #c1c1c1}
.home-intro-products > div h2 a{color: #F00; text-transform: uppercase; font-size: 18px; font-weight: normal}
.home-intro-products > div p{ font-size: 16px; line-height: 22px; color: #666}
.home-intro-products > div > div img{ width:100%; height: auto; display: block}
.home-intro-products > div > div:last-of-type{padding: 15px}
.home-intro-products > div label{ cursor: pointer; width: 100%}
.home-intro-products > div .btn-intro{font-size: 16px; font-weight: bold; color: #666; display: block; margin-top: 30px; }
.home-intro-products > div:hover .btn-intro{color: #F00;}

.intro-products-solutions{display: flex; flex-wrap: wrap; justify-content: space-between; max-width: 1280px; padding: 0 15px; width: 100%; margin:100px auto}
.intro-products-solutions > div{display: flex; flex-wrap: wrap; justify-content: space-between; width: 50%; align-content: space-between;}
.intro-products-solutions > div > div{position: relative; }
.intro-products-solutions > div > div > span{height: 100%; top:0; left: 0; display: flex; color: #fff; position: absolute;    flex-direction: column; align-items: center;}
.intro-products-solutions > div > div > span a{ border-bottom: solid 2px #fff; color: #fff; padding-bottom: 5px; font-size: 16px; position: relative; right: 55px;}
.intro-products-solutions > div img{width: 100%; height: auto; display: block}
.intro-products-solutions > div h2{ font-size:38px; font-weight: 200; line-height: 42px;}
.intro-products-solutions .products-1st-block{width: 48%}
.products-1st-block > div{width: 100%}
.products-1st-block > div:first-of-type span{background: linear-gradient(90deg, #AA8418 0%, rgba(170, 132, 24, 0) 100%);
background-blend-mode: multiply; flex-direction: column; justify-content: center;}
.products-1st-block > div > span{display: flex; align-items: center; flex-wrap: wrap; width:60%; }
.products-1st-block > div:last-of-type span{background: linear-gradient(269.32deg, #9A7241 1.14%, rgba(154, 114, 65, 0) 99.41%); background-blend-mode: multiply; right: 0; left: unset}
.products-2nd-block > div{width: 48%}
.products-2nd-block > div > span{width: 100%; height: 50% !important; }
.products-2nd-block > div:first-of-type span{background: linear-gradient(180deg, #2B7878 3.7%, rgba(26, 116, 116, 0) 100%);}
.products-2nd-block > div:first-of-type span h2{margin-top: 60px}
.products-2nd-block > div:last-of-type span{background: linear-gradient(0deg, #EE717C 0.56%, rgba(238, 113, 124, 0) 98.28%);
background-blend-mode: multiply; bottom: 0; top: unset; }
.products-2nd-block > div:last-of-type span h2{margin-top: 60px}

.sub-intro-text{ display:flex; margin-top:40px; justify-content: space-around; flex-wrap: wrap; }
.sub-intro-text > p{font-size:26px; line-height: 38px; width: 100%; margin-top: 0; margin-bottom: 40px; text-align: center}
.sub-intro-text > p a{color: rgba(213, 68, 1, 1)}

.intro-sub-block-bg{background:rgb(240 241 242); margin-left: calc((100vw - 1280px )/ -2 ); width: 100vw; margin-right: calc((100vw - 1280px )/ -2 ); display: flex; flex-wrap: wrap; justify-content: space-between;padding: 25px 0 0 }
.intro-sub-block-bg > div{max-width: 1280px; width: 100%; margin: auto}
.aboutus-sub-block{background:#fff; margin-left: calc((100vw - 1280px )/ -2 ); width: 100vw; margin-right: calc((100vw - 1280px )/ -2 ); display: flex; flex-wrap: wrap; justify-content: space-between; }
.legrand-group-sub-block .back_page { max-width: 800px; margin: 0}
.legrand-group-sub-block{ display: flex; flex-wrap: wrap; justify-content: space-between; width:60%}
.legrand-group-sub-block > div > h2{margin-top: 50px}
.legrand-group-sub-block > div > .btn-sub{ border-bottom: solid 2px #1F1F20; color: #1F1F20; padding-bottom: 5px;}
.legrand-group-sub-block > div > .btn-sub .fa-fw{margin-left: 5px}
.aboutus-sub-block-img{width: 38%}
.aboutus-sub-block-img img{width: 100%; height: auto; display: block; position: relative; top: 60px}
.intro-sub-block-bg-text{color: #000; margin: 55px 0;}
.intro-sub-block-bg-text ul strong{width: 100%; position: relative; display: block; margin: 10px 0 10px; font-weight: normal; font-size: 20px}
.intro-sub-block-bg-text ul strong:after{ content: ""; border-top: solid 1px #fff; height: .1rem; width:58%; display: inline-block; -webkit-flex-basis: 58%; position: absolute; right: 0; bottom: 5px;}

.intro-sub-block-bg-text ul li a{color:#1F1F20}
.intro-sub-block-bg-text ul li .fa-fw{font-size: 5px; margin-right: 10px; display: inline-block;color:#1F1F20}
.intro-sub-block-bg-text ul li{list-style: none; width: 48%; display: flex; align-items: baseline;}
.intro-sub-block-bg-text ul{padding: 0; margin: 0; display: flex; flex-wrap: wrap; justify-content: space-between}

.services-summary{ width: 100%; display: flex; flex-wrap: wrap; justify-content: space-between; padding: 0; margin: 20px auto}
.services-summary > p{ font-size: 16px !important; margin:5px 0}
.distribution-boards-text h2,.warranty-period-block h2,.ups-list-block h2,.maintenance-busbar-text h2,.services-summary > h2{ font-weight: normal; font-size: 45px; text-transform: none; margin-bottom: 20px; line-height: 52px; margin-top: 20px; text-align: left}
.warranty-period-block h2{float: left}
.timeline-h2 h2{; width: 100%; line-height: 38px; font-size: 34px}
.distribution-boards-text h2 strong,.warranty-period-block h2 strong,.ups-list-block h2 strong,.maintenance-busbar-text h2 strong,.services-summary > h2 strong{ font-weight: normal; color: #d54401; }
.services-summary-block{width: 100%; display: flex; flex-wrap: wrap; justify-content: space-between; margin-top: 70px; padding: 0}
.services-summary-block > div{ width: 23%; position: relative;box-shadow: 0 0 4px 1px rgb(0 0 0 / 60%); padding:15px 15px 0 15px;transition: all .3s;}
.services-summary-block > div img{ width: 100%; height: auto; display: block}
.services-summary-block > div > span{ padding: 15px; display: flex; position: absolute; bottom: 0; background-color: rgba(0,0,0,0.70); color: #fff; width: 100%; left: 0;transition: all .3s; height: 145px; overflow: hidden;flex-wrap: wrap;}
.services-summary-block > div > span h2{ margin-top: 10px;font-weight: normal; text-transform: capitalize; font-size: 22px; margin-bottom: 0}
.services-summary-block > div:hover > span{height: 180px;}
.services-summary-block > div > span > span{ opacity: 0; transition: all .3s;}
.services-summary-block > div:hover > span > span{opacity: 1; transition: all .3s;}
.services-summary-block > div p{ text-align: left; min-height: 75px; margin: 0}
.services-summary-block > div > span > span a{ font-weight: bold; display: flex; flex-wrap: wrap; align-items: center; margin-top: -5px; color: #fff}
.services-summary-block > div > span > span a .fa-fw{border: solid 1px; height: 25px;  width: 25px; border-radius: 40px; display: flex; align-items: center; justify-content: space-around; margin-right: 15px; transition: all .3s;}
.services-summary-block > div > span > span a:hover .fa-fw{background-color: #fff;}
.services-summary-block > div > span > span a:hover{color: #d54401}

.services-projects-block{width: 100%; display: flex; flex-wrap: wrap; justify-content: space-between;}
.services-projects{margin-top: 80px;  padding-top: 80px;}
.services-projects-block > span { width: 100%}
.services-projects-block > span > h2{font-size: 75px; font-weight: 800;  text-transform: uppercase; margin: 0; line-height: 75px; color: #fff; position: relative; left: 17%; top: -30%;}
.services-projects-block > span > h2 strong{font-weight: 800;color: #d54401}
.services-projects-block > div{ width:23%; display: flex; flex-wrap: wrap; justify-content: space-around; align-items: flex-start; margin-bottom:30px; padding:20px; align-content: flex-start; box-shadow: 0 0 4px 1px rgb(0 0 0 / 60%); background-color: #fff}
.services-projects-block > h2{margin-bottom: 30px; font-size: 30px; font-weight: 900; line-height: 32px; width: 100%}
.services-projects-block > h2 strong{font-weight: 900; color: #d54401}
.services-projects-block > div > span{ width:28%; height: 80px}
.services-projects-block > div > span img{ width: 100%; display: block; height: auto; transition: all .8s ease 0s; -moz-transition: all .8s ease 0s; -webkit-transition: all .8s ease 0s; }
.services-projects-block > div:hover > span img{-moz-transform: scale(1.2) rotateZ(-3deg); -webkit-transform: scale(1.2) rotateZ(-3deg); transform: scale(1.2) rotateZ(-3deg); }

.services-projects-block > div > strong{ width: 100%; text-align: center; font-size: 16px}
.services-projects-block > div > p{ width:100%; text-align: center; margin-bottom: 0}
.services-projects-block > img{ width: 100%; height: auto; display: block}
.services-industries-block > div{ width: 18%; margin-bottom: 0; align-content: space-between;}

.services-table{ width: 100%; display: table; background-color: #f1f1f1; }
.transformers-table{background-color:#cfdfd2}
.transformers-table td strong{ color: #469648}
.transformers-table td.table-th strong{color:#285a2f}
.services-table, .services-table td { border:2px solid black; border-collapse: collapse; font-size: 16px}
.services-table  tr > td{ padding: 10px; text-align: center}

.services-ul{ padding: 0 0 0 20px}
.services-ul li{ font-size: 16px; padding: 5px 0;}
.services-image img{ width: 100%; height: auto; display: block}
.services-image,.text-block-side-image{overflow: hidden}

.img-animation-slide{animation: 3s ease-out 0s 1 slideInFromLeft; }
@keyframes slideInFromLeft{
  0% {transform: translateX(-100%);}
  100% {transform: translateX(0);}
}

.maintenance-transformers-block{flex-wrap: wrap; display: flex;  width: 100%; justify-content: space-between; }
.busbar-block{flex-wrap: wrap; display: flex;  width: 100%; justify-content: space-between; margin-top: 10px}
.busbar-block ul{ width: 32%; border:2px solid black; padding: 0 0 10px 20px; background-color: #fbeadb; }
.busbar-block ul strong{border-bottom:2px solid black; width: 100%; display: block; margin-bottom: 8px; color:#ff0303; font-size: 16px; padding: 5px 0;}
.busbar-block ul li{ padding-right:10px; color: #000; margin-left: 15px; font-size: 16px; padding-top: 5px; line-height: 25px; text-align: left;}
.ups-ul-block ul{background-color: #7fb369;}
.ups-ul-block ul li{ color: #fff}
.ups-ul-block ul strong{ color: #f6fff6}

.ups-list-block{width: 70%; margin-top: 70px;}
.ups-img-block{ width: 26%; text-align: right; margin-top: 70px;}
.ups-list-block ol{ padding: 0 0 0 15px; display: table; font-size: 16px}
.ups-list-block ol li{padding: 5px 0; line-height: 25px}
.ups-list-block ul{padding: 0 0; margin-top: 0; font-size: 16px;color: #0073c1;}
.ups-list-block ul strong{ font-size: 18px}
.ups-list-block ul li{ margin-left: 15px;padding: 5px 0; line-height: 25px}
.ups-list-block ol li{}

.services-text p{ float: unset; font-size: 16px !important}

.reference-projects-block > div{ display: flex; flex-wrap: wrap; justify-content: space-between; padding: 30px 0; border-bottom: 1px solid #d8d8d8;}
.reference-projects-block > div > div{ width:58%; }
.reference-projects-block > div > div h2{  margin-top: 0 }
.reference-projects-block > div > div h2 strong{display: block; margin-bottom: 5px; font-size: 14px; color: #d54401; }
.reference-projects-block > div > div:first-of-type{ width:35%; }
.reference-projects-block > div > div ul{padding: 0 0 0 20px}
.reference-projects-block > div > div img{ width: 100%; display: block; height: auto}
.reference-projects-block .readmore-btn { border: solid 2px #d54401; color: #d54401; padding:9px 20px; font-size: 14px; font-weight: bold; max-width: 165px; display: flex; flex-wrap: wrap; align-items: center; text-transform: uppercase;}
.reference-projects-block .readmore-btn .fas { margin-left: 10px}
.reference-projects-block span{display: flex; flex-wrap: wrap; width: 100%; align-items: center;}
.reference-projects-block span .fa-download{ border: solid 2px #d54401; width: 35px; height: 35px; display: flex; align-items: center; justify-content: space-around; border-radius: 30px; margin-right: 20px}

.reference-projects-text > div{display: flex; flex-wrap: wrap; justify-content: space-between; }
.reference-projects-text > div > div{ width: 50%}
.reference-projects-text > div:last-of-type > div{  background-color: #f3f2f1; margin-top:40px}
.reference-projects-text > div > div h2{ margin-top: 0; position: relative; height: 35px}
.reference-projects-text > div > div h2:before{ content:""; position:absolute; left:0; width:20%; height:1px; background-color:#000;border-radius: 10px; top:100%}
.reference-projects-text > div > div:nth-of-type(odd){ padding: 30px}
.reference-projects-text > div:nth-of-type(even) > div:nth-of-type(odd){ padding: 0}
.reference-projects-text > div:nth-of-type(even) > div:last-of-type{ padding: 30px}
.reference-projects-text > div > div> img{ width:100%; height: auto; display: block}

.download-software-block{}
.download-software-block > div{background-color: #f3f2f1; display: flex; flex-wrap: wrap; justify-content: space-between; margin-bottom: 20px}
.download-software-block > div > div{ width: 50%; padding: 30px;}
.download-software-block > div > div h2{ position: relative; min-height:35px}
.download-software-block > div > div h2:before{ content:""; position:absolute; left:0; width:20%; height:1px; background-color:#000;border-radius: 10px; top:100%}

.download-software-block > div > div ul{ margin: 0 0 20px 0; padding: 0 0 0 20px}
.discover-btn { background-color: #d54401; color: #fff !important; padding:12px 20px; font-size: 14px; font-weight: bold; max-width: 190px; display: flex; flex-wrap: wrap; align-items: center; text-transform: uppercase; justify-content: space-around;}
.download-software-block .discover-btn img { margin-left: 10px}
.download-software-block > div > div > img{ width:100%; height: auto; display: block}
.activation-key-ul strong{ margin-left: -15px; display: block}
.activation-key-p {text-align: left}

.video-block h3{min-height: 58px}
.download-video{display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between}
.download-video > h2{width: 100%; color: #1F1F20; font-size: 32px; text-align: center}
.download-video > div{width:31% !important; padding: 0 !important}
.download-video > div iframe{position: relative; z-index:0; width: 100%}
.download-video > div h3{font-weight:300; font-size: 26px; margin-top: 0}

.download-software{display: flex; flex-wrap: wrap; justify-content: space-between}
.download-software strong{text-transform: uppercase; padding-bottom:20px; display: inline-block}
.download-software > div{width:48%; }
.download-software > div > div{width:100%; border-bottom: dashed 1px #ccc; padding-top:20px}
.download-software > div > div > div{display: table-cell;}
.download-software > div > div > div:first-of-type a{background:url(images/icons/btn-download.jpg) no-repeat; width:40px; height:40px; display: inline-block; position: relative; top:-5px}

.ups-services-video h3{min-height: 58px}

/*===================== OUR PURPOSE, OUR VALUES ======================*/
.our-purpose-our-values{ background-color: #f4f4f4; margin-top: 30px}
.our-purpose-our-values > img{ width: 100%; height: auto; display: block}
.our-purpose-our-values > div{padding: 0 15px; background-color: #fff; width: 97%; margin: 12px auto; display: table; float: none;}
.our-purpose-our-values > h2{ background-color:#38495c; color:#fff; font-weight:normal;font-size: 25px; padding:25px 15px; margin:0}
.ceo-block{display: flex !important; flex-wrap: wrap; justify-content: space-between; padding: 15px !important}
.ceo-block > div{ width: 65%}
.ceo-block > div img{ display: block}
.ceo-block > div:first-of-type{ width: 35%}
.ceo-block > div h2{margin-top: revert; margin-bottom: 10px}
.ceo-block > div > div{ width: 100%; margin-top: 15px;}
.ceo-block > div > div > a{font-size: 20px;}

.values-text p{margin: 4px 0}
.paragraph-bg{background-color: #877ca4 !important; color: #fff; padding: 2rem 1rem !important}
.paragraph-bg p{font-size: 30px !important; line-height: 36px; text-align: center;}

.values-video iframe{ display: block}
.values-video{ padding: 15px !important}
.values-img{display: flex !important; flex-wrap: wrap; justify-content: space-between; padding-bottom: 15px !important;}
.our-value-block > div h2,.values-img h2{margin: revert; width: 100%}
.values-img > div{ width: 20%}
.values-img > div img{ width: 100%; height: auto; display: block}

.our-value-block{display: flex !important; flex-wrap: wrap; justify-content: space-between; padding: 15px !important;}
.our-value-block > div{ width:48%}
.our-value-img > div > img{ width: 100%; height: auto; display: block}
.our-value-img > div{display: inline-block; position: absolute; width: 100%; }
.our-value-img{position: relative; overflow: hidden;height: 385px}
.our-value-block > div p{ margin: 10px 0}
.our-value-text > h2{ margin-bottom: 0 !important}

.page-title{width:100%; background: url(images/electrical-and-digital-banner.webp) no-repeat; display: flex; position: relative; min-height: 250px}
.page-title:before{content:""; position: absolute; left: 0; top: 0; width: 100%; height: 100%; background: rgba(53, 53, 54, 0.8);}
.page-title.ethics-fraud-banner:before{display: none}
.page-title > div{max-width: 1280px; margin: auto; width: 100%; padding: 0 15px; position: relative; text-align: center}
.page-title > div h1{color: #fff; font-size:50px; text-transform: uppercase;}
.ups-title{color: #fff}
.ups-title > p{color: #fff; font-size: 20px; text-align: center; line-height: 28px; max-width: 1280px;  margin: auto auto 20px;}
.ups-accessories-ul{ text-align: left}
.text-p.ups-accessories-ul{text-align: center}

.services-projects-banner{background: url(images/services-projects.webp) no-repeat !important; background-size:100% auto !important; min-height:429px;}
.career-title{background: url(images/careers-banner.webp) no-repeat fixed; background-size:100% auto;}
.download-title{background: url(images/download-banner.webp) no-repeat fixed; background-size:100% auto;}
.showroom-title{background: url(images/showroom-banner.webp) no-repeat fixed; background-size:100% auto;}
.training-title{background: url("images/training-banner.webp") no-repeat fixed; background-size:100% auto;}
.contactus-title{background: url(images/contactus-banner.jpg) no-repeat fixed; background-size:100% auto;}
.ethics-fraud-banner{background: url(images/ethics-fraud-banner.webp) no-repeat fixed; background-size:100% auto;}
.transformers-banner{background: url(images/transformers-banner.webp) no-repeat !important; background-size:100% auto !important;}
.distribution-boards-banner{background: url(images/distribution-boards-banner.webp) no-repeat !important; background-size:100% auto;}
.busbar-banner{background: url(images/busbar-banner.webp) no-repeat !important; background-size:100% auto !important;}
.ups-banner{background: url(images/ups-banner.webp) no-repeat  !important; background-size:100% auto !important;}
.csr-title{background: url(images/csr-commitments.webp) no-repeat  !important; background-size:100% auto !important;}
.promoting-diversity-title{background: url(images/promoting-diversity-and-inclusion.webp) no-repeat  !important; background-size:100% auto !important;}
.mitigating-climate-title{background: url(images/mitigating-climate-change.webp) no-repeat  !important; background-size:100% auto !important;}
.circular-economy-title{background: url(images/developing-more-circular-economy.webp) no-repeat  !important; background-size:100% auto !important;}
.serving-customers-title{background: url(images/serving-our-customers.webp) no-repeat  !important; background-size:100% auto !important;}
.responsible-business-title{background: url("images/csr-being-responsible-business.webp") no-repeat  !important; background-size:100% auto !important;}

.page-title.csr-banner{ min-height: 450px; background-size: contain !important; background-position: center !important;}
.page-title.csr-banner::before{ display: none;}

.contactus-title{width:100%; background: url(images/contactus-banner.webp) no-repeat;}
.our-purpose-our-values-title{background: url(images/our-purpose-our-values-banner.webp) no-repeat; background-size:100% auto; min-height:340px; display: flex}
.paia-title{width:100%; height:200px; float: left; background: url(images/paia-manual-banner.webp) no-repeat fixed; background-size:100% auto; padding-left: 10px;}
.belgian-defense-banner{width:100%; height:200px; float: left; background: url(images/belgian-defense-banner.png) no-repeat fixed; background-size:100% auto; padding-left: 10px;}
.databalance-banner{width:100%; height:200px; float: left; background: url(images/databalance-banner.webp) no-repeat fixed; background-size:100% auto; padding-left: 10px;}
.dtix-banner{width:100%; height:200px; float: left; background: url(images/dtix-banner.webp) no-repeat fixed; background-size:100% auto; padding-left: 10px;}
.ficolo-banner{width:100%; height:200px; float: left; background: url(images/ficolo-banner.webp) no-repeat fixed; background-size:100% auto; padding-left: 10px;}
.iomart-banner{width:100%; height:200px; float: left; background: url(images/iomart-banner.webp) no-repeat fixed; background-size:100% auto; padding-left: 10px;}

.single-phase-ups-banner{width:100%; height:200px; float: left; background: url(images/single-phase-ups-banner.webp) no-repeat fixed; background-size:100% auto; padding-left: 10px;}
.software-download-banner{width:100%; height:200px; float: left; background: url(images/software-download.png) no-repeat fixed; background-size:100% auto; padding-left: 10px;}
.reference-projects-banner{width:100%; height:200px; float: left; background: url("images/reference-projects.webp") no-repeat fixed; background-size:cover;}
.three-phase-ups-banner{width:100%; height:200px; float: left; background: url(images/three-phase-ups-banner.webp) no-repeat fixed; background-size:100% auto; padding-left: 10px;}
.keor-dc-banner{width:100%; height:300px; float: left; background: url(images/keor-dc-banner.webp) no-repeat fixed; background-size:100% auto; padding-left: 10px;}
.daker-dk-plus-banner{width:100%; height:300px; float: left; background: url(images/daker-dk-plus-banner.webp) no-repeat fixed; background-size:100% auto; padding-left: 10px;}
.new-keor-multiplug-banner{width:100%; height:300px; float: left; background: url(images/new-keor-multiplug-banner.webp) no-repeat fixed; background-size:100% auto; padding-left: 10px;}
.megaline-megaline-rack-banner{width:100%; height:300px; float: left; background: url(images/megaline-megaline-rack-banner.webp) no-repeat fixed; background-size:100% auto; padding-left: 10px;}
.keor-sp-banner{width:100%; height:300px; float: left; background: url(images/keor-sp-banner.webp) no-repeat fixed; background-size:100% auto; padding-left: 10px;}
.keor-spe-tower-banner{width:100%; height:300px; float: left; background: url(images/keor-spe-tower-banner.webp) no-repeat fixed; background-size:100% auto; padding-left: 10px;}
.keor-pdu-banner{width:100%; height:300px; float: left; background: url(images/keor-pdu-banner.webp) no-repeat fixed; background-size:100% auto; padding-left: 10px;}
.keor-lp-banner{width:100%; height:300px; float: left; background: url(images/keor-lp-banner.webp) no-repeat fixed; background-size:100% auto; padding-left: 10px;}
.keor-compact-banner{width:100%; height:300px; float: left; background: url(images/keor-compact-banner.webp) no-repeat fixed; background-size:100% auto; padding-left: 10px;}
.keor-t-evo-banner{width:100%; height:300px; float: left; background: url(images/keor-t-evo-banner.webp) no-repeat fixed; background-size:100% auto; padding-left: 10px;}
.keor-hp-banner{width:100%; height:300px; float: left; background: url(images/keor-hp-banner.webp) no-repeat fixed; background-size:100% auto; padding-left: 10px;}
.keor-hpe-banner{width:100%; height:300px; float: left; background: url(images/keor-hpe-banner.webp) no-repeat fixed; background-size:100% auto; padding-left: 10px;}
.keor-xpe-banner{width:100%; height:300px; float: left; background: url(images/keor-xpe-banner.webp) no-repeat fixed; background-size:100% auto; padding-left: 10px;}
.trimod-mcs-banner{width:100%; height:300px; float: left; background: url(images/trimod-mcs-banner.webp) no-repeat fixed; background-size:100% auto; padding-left: 10px;}
.keor-mod-banner{width:100%; height:300px; float: left; background: url(images/keor-mod-banner.webp) no-repeat fixed; background-size:100% auto; padding-left: 10px;}
.keor-spe-rt-banner{width:100%; height:300px; float: left; background: url(images/keor-spe-rt-banner.webp) no-repeat fixed; background-size:100% auto; padding-left: 10px;}
.trimod-he-banner{width:100%; height:300px; float: left; background: url(images/trimod-he-banner.webp) no-repeat fixed; background-size:100% auto; padding-left: 10px;}
.upsaver-banner{width:100%; height:300px; float: left; background: url(images/upsaver-banner.webp) no-repeat fixed; background-size:100% auto; padding-left: 10px;}
.ups-accessories-banner{width:100%; height:300px; float: left; background: url(images/ups-accessories-banner.webp) no-repeat fixed; background-size:100% auto; padding-left: 10px;}
.battery-cabinets-banner{width:100%; height:300px; float: left; background: url(images/battery-cabinets-banner.webp) no-repeat fixed; background-size:100% auto; padding-left: 10px;}
.sensors-banner{width:100%; height:300px; float: left; background: url(images/ups-accessories-sensors-banner.webp) no-repeat fixed; background-size:100% auto; padding-left: 10px;}
.ups-upsaver-banner{width:100%; height:300px; float: left; background: url(images/ups-upsaver.webp) no-repeat fixed; background-size:100% auto; padding-left: 10px;}
.software-banner{width:100%; height:300px; float: left; background: url(images/software-banner.webp) no-repeat fixed; background-size:100% auto; padding-left: 10px;}
.categories-banner{width:100%; height:300px; float: left; background: url(images/categories-banner.webp) no-repeat fixed; background-size:100% auto; padding-left: 10px;}
.keor-s-banner{width:100%; height:300px; float: left; background: url(images/keor-s-banner.webp) no-repeat fixed; background-size:100% auto; padding-left: 10px;}
.ups-documentations-banner{width:100%; height:300px; float: left; background: url(images/ups-documentation-banner.webp) no-repeat fixed; background-size:100% auto; padding-left: 10px;}
.arteor-netatmo-title{width:100%; height:200px; float: left; background: url(images/arteor-netatmo-connected-switches-sockets.webp) no-repeat fixed; background-size:100% auto; background-size: cover; background-position: center;}

.brands-list-nav{background:#d54401; display: flex; flex-wrap: wrap; justify-content: space-between; padding: 0 50px; }
.brands-list-nav li{ list-style: none}
.brands-list-nav li a{color: #fff; display: block; padding: 10px}
.brands-list-nav li:hover a{background: #ed1c24}
.brands-list-nav{}

.csr-intro{max-width: 800px; width: 100%; margin: auto; text-align: center}
.csr-intro p{text-align: center}
.csr-commitments{padding: 20px 0 40px}
.executive-block{ position: relative; display: flex; flex-wrap: wrap; align-items: center}
.executive-block:before{content: ""; position: absolute; top: 0; left: 0; width: 100%; height: 100%; opacity: 0.8; background: #3c3535; background: -webkit-gradient(linear, left top, right top, color-stop(0%, #3c3535), color-stop(100%, #828282)); background: -webkit-linear-gradient(0deg, #3c3535 0%, #828282 100%); background: -webkit-gradient(linear, left top, right top, from(#3c3535), to(#828282)); background: -webkit-linear-gradient(left, #3c3535 0%, #828282 100%); background: linear-gradient(90deg, #3c3535 0%, #828282 100%);}
.executive-block img{width: 100%; height: auto; display: block}
.executive-block > span{ position: absolute;  right: 0; left:0; margin: auto; color: #fff; max-width: 750px; width: 100%; text-align: center}
.executive-block .csr-comment{font-size: 34px; line-height: 44px; text-align: center; font-weight: 100; margin: 0}
.executive-block .csr-comment .fa-fw{font-size:36px }
.executive-block .csr-title-tag{ display: block; font-size: 12px; font-weight: bold; text-transform: uppercase}
.executive-block .csr-name{ display: block; font-size: 22px; text-transform: uppercase}

.greenhouse-gas-block{display: flex; flex-wrap: wrap; justify-content: space-between; padding: 0 15px; margin: 20px 0}
.greenhouse-gas-block > div{width: 65%}
.greenhouse-gas-block .greenhouse-gas-block-img{width: 33%}
.greenhouse-gas-block > div img{width: 100%; height: auto; display: block}

.commitments-sustainable-future h2{text-align: center; display: block; margin-top: 40px;}
.commitments-sustainable-future{}
.commitments-sustainable-future > div{display: flex; flex-wrap: wrap; justify-content: space-between}
.commitments-sustainable-future > div p{min-height: 86px}
.commitments-sustainable-future .btn-csr{ color: #756c6c; border: solid 1px #756c6c; padding: 10px 16px; font-size: 14px}
.commitments-sustainable-future .btn-csr:hover{ background-color: #756c6c; color: #fff}
.commitments-sustainable-future > div:last-of-type{max-width: 800px; margin: auto}
.commitments-sustainable-future > div:last-of-type > div{width: 47%}
.commitments-sustainable-future > div img{width: 100%; height: auto; display: block}
.commitments-sustainable-future > div > div{width: 30%; text-align: center; margin: 25px 0}

.corporate-social-responsibility{display: flex; margin: 30px 0 50px}
.corporate-social-responsibility iframe{display: block}
.csr-2050-target{ width: 100%; margin-bottom: 30px; display: block}
.csr-2050-target img{ width: 100%; height: auto; display: block}

.csr-roadmap{max-width: 1024px; display: flex; justify-content: space-between; flex-wrap: wrap; margin: auto}
.csr-roadmap > div{width: 48%;}
.csr-roadmap > h2{width: 100%; text-align: center}
.csr-roadmap > div img{width: 100%; height: auto; display: block}

.csr-roadmap-block{align-items: center}
.csr-roadmap-block .btn1{}

.csr-roadmap .csr-news-block{ display: flex; justify-content: space-between; flex-wrap: wrap; margin-bottom: 30px; width: 50%}
.csr-news-block > div{width: 32%;}
.csr-news-block > div img{width:100%; height: auto; display: block}

.discover-block{display: flex; flex-wrap: wrap; margin-bottom: 50px;}
.discover-block > h2{width: 100%}
.discover-block > div{width:100%; display: flex; flex-wrap: wrap; justify-content: space-between }
.discover-block > div > div{width: 24%}
.discover-block > div > div .fa-fw{border: solid 1px; width: 30px; height: 30px; display: flex; align-items: center; justify-content: space-around; font-size: 14px; }
.discover-block > div > div a{margin-top: 20px; display: flex; flex-wrap: wrap; text-transform: uppercase; font-size: 20px; justify-content: space-between}
.discover-block > div > div a span{width: 86%}
.discover-block > div > div img{width: 100%; height: auto; display: block}

.living-commitments-block{max-width: 1024px; margin: auto}
.legrand-rainbow-block{width: 100%; display: flex; justify-content: space-between; flex-wrap: wrap;}
.legrand-rainbow-block > div{width: 48%;  margin:20px 0 30px}
.legrand-rainbow-block > div h2{min-height: 58px; font-weight: normal; margin-bottom: 0;}
.legrand-rainbow-block > div img{width: 100%; height: auto; display: block}

/*===================== TIMELINE ======================*/
.historical-tabs{display: flex; margin-top: 30px; flex-wrap: wrap; justify-content: space-between}
.historical-tabs > div{ padding: 12px 32px; background-color: #595959; border-top-left-radius: 5px; border-top-right-radius: 5px; color: #fff; border: 1px solid #595959; cursor:pointer; z-index: 1; min-width: 19%; text-align: center;}
.historical-tabs > div:hover{ background-color: rgba(89,89,89,0.8); border: 1px solid rgba(89,89,89,0.8);}
.historical-tabs > div.active{ background-color: #fff; color: #000; border-bottom-color: #fff;}

.historical-timeline{display: flex; flex-basis: 40%; flex-direction: column; position: relative; padding-top: 50px; padding-bottom: 130px; border: 1px solid #595959; padding-left: 16px; padding-right: 16px; margin-top:-1px;}

.historical-timeline > div{width: calc( (50% - 20px) - 5px);box-shadow:0 0 4px 1px rgba(0,0,0,0.6);position:relative;display: flex;border-radius: 5px;min-height: 240px;}
.historical-timeline > div{margin-bottom: -80px;}
.historical-timeline > div > div{padding: 10px;align-items: center;}
.historical-timeline > div > div:nth-child(1){max-width:40%}
.historical-timeline > div > div:nth-child(1) img{max-width:100%;max-height: 100%;display: inline-block; position: relative; top: 50%;transform: translate(0px, -50%);}
.historical-timeline > div > div:nth-child(2){width:100%}
.historical-timeline > div:after{background-color: #fff;content: "\00a0";display: block;height: 30px;width:  30px;position: absolute;top: 50%;transform: translate(-50%,-50%) rotate( 45deg );}

.historical-timeline > div:nth-child(odd){align-self:flex-start;}
.historical-timeline > div:nth-child(odd):after{box-shadow: 2px -2px 2px 0 rgba( 0, 0, 0, .3 );left: 100%;}

.historical-timeline > div:nth-child(even){align-self:flex-end;background-color: #595959; color: #fff; flex-direction: row-reverse;}
.historical-timeline > div:nth-child(even):after{box-shadow: -2px 2px 2px 0 rgba( 0, 0, 0, .3 );left: 0;background-color: #595959}

.historical-timeline > div  * {color: inherit}
.historical-timeline > div > div:nth-child(2){padding: 16px 20px;}
.historical-timeline > div h2{text-align:center; font-size: 20px; margin: 0}
.historical-timeline > div h3{text-align:center; font-size: 16px; margin: 0}
.legrand-logo-block img{display: inline-block; left:50%;transform:translate(-50%); position: relative;}
.historical-timeline .ul-block ul{ padding:0; width:50%; float:left}
.historical-timeline .ul-block-fix{ padding-left:20px}

.career-block,.training-block{display: flex; flex-wrap: wrap; justify-content: space-between; margin: 50px auto}
.text-block-text-side{width:60%; padding-right: 10px; float: left}
.text-block-side-image{width:37%; float: right !important; margin-bottom:40px; }
.text-block-products{margin-top:125px; min-height:400px; float: left; width:63%; margin-left:2%}
.place-note{margin-top:150px !important; margin-left:100px !important; font-size:26px; font-weight:bold;}
.disclaimer-text ul, .disclaimer-text ol {padding: 0 0 0 20px; margin: 0;}

.ethics-compliance-block{ text-align: center; max-width: 800px; margin: auto; float: none !important;}
.ethics-compliance-block h2{font-size: 32px; margin-bottom: 10px; text-transform: none; font-weight: normal; line-height: 36px}

.corruption-block{display: flex; flex-wrap: wrap; justify-content: space-between; width: 100%; background-color: #eceef0; color: #000; margin:30px auto}
.text-block-fraud-text h2,.corruption-block > div h2{text-transform: none !important; font-weight: normal; font-size: 30px; position: relative; height: 60px}
.text-block-fraud-text h2:before,.corruption-block > div h2:before{content: ""; position: absolute; width: 30px; height: 2px; background: #000; bottom: 7px}
.corruption-block > div{width: 66%;}
.corruption-block > div:first-of-type{padding-left: 20px; padding-bottom: 15px;}
.corruption-block > div p{margin-bottom: 0}
.corruption-block > div ul{padding: 0 0 0 15px; margin: 0}
.corruption-block > div img{width: 100%; height: auto; display: block}
.corruption-block > div:last-of-type{ width: 31%}
.quote-ethics img{width: 100%; height: auto; display: block}
.related-documents-block{display: flex; flex-wrap: wrap; justify-content: space-between; width: 100%; padding: 15px; margin:30px auto}
.related-documents-block > div{width: 31%; text-align: center; margin-bottom: 20px}
.related-documents-block > div h2{font-weight: normal; margin-top: 20px; min-height: 36px; color: #000; text-transform: capitalize; font-size: 18px;}
.related-documents-block > div img{width: 100%; height: auto; display: block}

.ethics-mailbox{color: #fff; background: #67a69e; padding: 30px; margin: 50px auto}
.ethics-mailbox h2{margin-top: 0; font-weight: normal; font-size: 18px}
.ethics-mailbox .btn1{color: #fff; background: transparent; border: solid 2px #fff; padding:10px 15px}

.text-block-fraud-text{ padding: 0 20px}
.text-block-fraud-text ul{ padding:0 0 0 15px; margin: auto}
.text-block-fraud-text ul li{ padding:3px 0; }

.text-block-fraud{margin: 20px auto; max-width: 1024px; width: 100%}
.text-block-fraud > div{display: flex;flex-wrap: wrap;justify-content: space-between;width: 100%;color: #000;margin:20px auto;}
.text-block-fraud > div > div{width: 50%}
.text-block-fraud > div > div img{width:100%; height: auto; display: block}

.slide-bg-btn span a{ border:solid 5px #fff !important; margin:5px; display: inline-block; }
.slide-bg-btn,.slide-block-parent2  .slide-block > div{ background-color:#b9a681}
.slide-block-parent2{background-color:#b9a681 !important}
.slide-block-parent2 .slide-block > div{ padding-bottom:10px}
.slide-block-parent2  .slide-block > div span{ float:left}
.slide-block-parent2  .slide-block > div img{ display:block; margin:auto; margin-top:5px}
.slide-block-parent2  .slide-block p{ font-size:18px; font-weight:bold; text-transform:uppercase; color:#fff; margin-top:0}
.slide-block-parent2  .slide-block span a{color:#fff; font-size:14px; margin-left:15px}
.slide-block-parent2  .slide-block span .fa{ margin:auto 5px}

.fade-in-ready{margin-left: 100%; opacity:0}
.fade-out-text{opacity: 0; margin-left: -100%; transition: all 0.5s}
.fade-in-text{opacity: 1; margin-left: 0%;transition: all 0.5s}

#VVjHKOu-1596528946883 html,#tawkchat-minified-wrapper,.round #tawkchat-status-text-container,#maximizeChat,.theme-background-color{ background-color:#ed1c24 !important; }

.ethics-block{margin-bottom: 30px}
.acting-ethics-block{ background-color:#f4f4f4; display:table; width:100%; margin-top: 30px}
.acting-ethics-block > div{ padding:15px; width:100%; display:table; border-bottom:solid 1px #e1e1e1}
.acting-ethics-block img{ display:block; width:100%; height:auto}
.acting-ethics-block h2{ background-color:#b9a681; color:#fff; font-weight:normal;font-size: 25px; padding:25px 15px; margin:0}

.care-law-block > div{ width:100%; display: flex; flex-wrap: wrap; justify-content: space-between}
.care-law-block > div > div { padding:30px 0}
.care-law-block > div > div:last-of-type{width:65%; padding:8px 0}

.ethic-block {transition: all 0.5s; padding-bottom: 25px; }
.ethic-block h2{cursor: pointer; padding:15px; background-color:#fff;transition: all 0.5s; font-size: 20px; text-transform: uppercase;}
.ethic-block > div > div{padding: 30px 0;}
.ethic-block > div > div:first-of-type{ width: 65%; padding:8px 0 0 15px}
.ethic-block > div{display: flex; flex-wrap: wrap; justify-content: space-between}
.text-block-fraud > div:last-of-type > div > span{ color:#000; font-weight:bold; width:100%; border-bottom:1px solid #e6e2d8; display:block; padding:10px 13px}
.text-block-fraud > div:last-of-type > div span > .fa{ float:right; font-size:19px; color:#b9a681}
.text-block-fraud h2{text-transform: uppercase;}


.continual-progress-block{ display:table !important}
.continual-progress-block > div { width:100% !important; display:table !important; margin:auto}
.continual-progress-block > div > div{ width: calc(99.5% / 3); float:left}
.continual-progress-block > div > div > div:first-of-type{ height:170px; text-align:center}
.continual-progress-block > div > div img{ max-width: 100%; max-height: 100%;margin-bottom: 20px;}
.continual-progress-block > div h4{ text-align:center}
.continual-progress-block > div h3{ margin-bottom:0}
.continual-progress-block p{ padding:0 10px 0 0; text-align:center}

/*UPS Power Supply*/

.breadcrumb{margin:30px 0; color:#FFF; font-weight:600; text-shadow: 0px 1px 5px #4a4a4a;}
.ups-product-top-block > div:last-of-type{ height: auto !important}

.ups-accessories-block{display: flex; flex-wrap: wrap; justify-content: space-between; max-width: 1140px; margin:50px auto; width: 100%;}
.ups-accessories-block > div{ width: 48%; display: flex; flex-direction: column; justify-content: space-between; align-items: center; box-shadow: 0 13px 16px 2px rgb(0 0 0 / 13%); padding: 50px 25px; background: #7aa6f5; background: linear-gradient(135deg,#7aa6f5,#4b74bf); color: #fff;}
.ups-accessories-block > div p{ font-size: 30px !important}
.ups-accessories-block > div:last-of-type{ width: 48%; background: #4ba6de; background: linear-gradient(135deg,#4ba6de,#40c7c9);}
.ups-accessories-block .btn-accessories{ color: #fff; border: 1px solid #fff; font-weight: bold; padding: 12px 42px; border-radius: 50px; text-align: center; transition: .3s all}
.ups-accessories-block > div .btn-accessories:hover{ background-color: #4ba6de; border: 1px solid transparent}
.ups-accessories-block > div:last-of-type .btn-accessories:hover{background-color: #7aa6f5;}
.ups-documentations-block{display: flex; flex-wrap: wrap; justify-content: space-between;}
.ups-documentations-block > span{ width: 100%}
.ups-documentations-block > span ul{ padding: 0; display: flex; flex-wrap: wrap;}
.ups-documentations-block > span ul li{ list-style: none; min-width: 20%; padding: 5px 0; font-size:18px; margin-right: 20px;}
.ups-documentations-block > span ul li label{margin-left: 5px;}
.ups-documentations-block > div{ width:23%; border: solid #CCC; padding: 20px; margin: 18px 0; text-align: center;position: relative}
.ups-documentations-block > div > a:last-of-type{font-size:25px}
.ups-documentations-block > div > a{ }
.ups-documentations-block > div > a ul{ }
.ups-documentations-block > div h3{ font-size: 18px; text-transform: uppercase}
.ups-documentations-block > div img{ height: auto; display: block; margin: auto}
.ups-documentations-block > div ul{ padding:0 10px 10px; text-align: left; background-color: #ff9000; border-radius: 4px;box-shadow: 0 0 5px 1px #ccc; position: absolute; width: 90%;  left: 0; right: 0; margin:0 auto; z-index: 1; transition: .3s all; display: none; top: 80%}
.ups-documentations-block > div:hover ul{ display: block;}
.ups-documentations-block > div ul li > a{ color: #fff; padding: 4px 0; display: block}
.ups-documentations-block > div ul li{ list-style: none;line-height: 20px; border-bottom: 1px solid rgb(255 255 255 / 31%);}
.ups-documentations-block > div ul li:last-of-type{ border-bottom: 0}
.ups-documentations-block > div h3 > span{margin-bottom: 10px; font-size: 14px; color: rgb(213 68 1); display: block}
.shop-online-notice{ display: flex; justify-content: space-around; padding: 15px; background-color: #d54401; }
.shop-online-notice a{color: #fff; font-size: 22px;}
.shop-online-notice p{margin: 0;}

.delivering-node{display: flex; justify-content: space-between; flex-wrap: wrap; margin: auto; max-width: 1140px; width: 100%; margin-top: 20px; }
.delivering-node > div{ width: 48%; padding: 24px; border: 1px solid #C0C0C0;}
.delivering-node > div img{ width: 100%; height: auto; display: block}

/*================= Single & Three Phase UPS Layout ======================*/
.ups-container{text-align:center; width: 100%; padding-top: 20px; }
.ups-container > ul{ padding: 0; width: 50%; margin: auto; font-size: 16px;}
.three-col-ups{float:left; width:30%; margin-right:1%; margin-top: 1em; margin-left: 2%; margin-bottom: 3em;}
hr{border:1px solid #CCCCCC78; margin-top: 1em; margin-bottom: 1em;}
.text-heading{font-size: 2.14286em;font-weight: 700;line-height: 1;letter-spacing: 0.8px; color:#3c3535;}
.text-heading-block .text-heading{ font-size: 1.6em}
.text-heading strong{ font-weight:normal; display:block; margin-top:10px;}
.text-sub-heading{font-size: 1.9em; font-weight: 300; line-height: 1; letter-spacing: 0.8px; letter-spacing: .8px; word-wrap: break-word; color: #404040;   margin-top: -18px;}
.text-product-name{font-size: 1.6em; font-weight: 700; line-height: 1; letter-spacing: 0.8px; letter-spacing: .8px; word-wrap: break-word; color: #404040; display: flex; flex-wrap: wrap; align-items: center;}
.text-product-name .fas{ width:25px; height:25px;   display: flex; border: 1px solid #d54401; justify-content: space-around; align-items: center; border-radius: 50px; margin-right:9px; font-size:16px;}
.fas-plus{ margin: 0 auto; width: 25px; height: 25px; display: flex; border: 1px solid #fff; justify-content: space-around; align-items: center; border-radius: 50px;}
/*.img{box-shadow: 0px 8px 5px #CCC; padding:10px; border:1px solid #CCC;}*/
.a-two-active{color:#FFF;}
.clear-float{clear:both;}
.text-p{ color:#3c3535; font-size:1.14286em !important;}
.product-preview {position:relative}
.product-preview .link-card__image {border:2px solid #e2e2e2; padding:15px}
.product-preview.is-new:before {content:"new";background-color:#4ca7e0;color:#fff;font-size:1.42857em;font-weight:600;text-transform:uppercase;padding:10px 15px;position:absolute;top:0;right:0;width:50px;height:30px;z-index:100
}
.banner-text{font-size:16px !important; font-weight:200; text-align:center; color:#FFF;}
.text-col-white{ color:#FFF;}
.sub-heading-two{ text-align:center; font-size:2.3em; color:#FFF; font-weight:300; letter-spacing:1px; word-wrap: break-word; }
.applications-nav{display: flex; flex-wrap: wrap; justify-content: space-between; width: 100%; margin-bottom: 20px}
.applications-nav > strong{ border-left:3px solid rgb(213 68 1); padding-left: 10px; width: 100%; font-size: 22px; font-weight: normal; margin-bottom: 20px; color: #000}
.applications-nav > ul{padding: 0; margin: 0; display: flex; flex-wrap: wrap; gap: 10px; }
.applications-nav ul li{list-style: none; padding: 2px 10px;  border: 1px solid #999; border-radius: 4px;}
.ups-product-display > div{position: relative; }
.ups-product-display > div > p{ text-align: center; font-weight: bold; font-size: 16px !important}
.ups-product-display > div > span{background-color:#4ca7e0;color:#fff;font-size:1.42857em;font-weight:600;text-transform:uppercase;padding:10px 15px;position:absolute;top:0;right:0; z-index:100}
.ups-product-top-block{position: relative; overflow: hidden}
.ups-product-top-block > div{ background: #fff !important}
.ups-product-top-block #ups-scroll{ max-width: 1140px; margin: auto}
.ups-product-top-block #ups-scroll > div{ width:274px; height: auto; margin: 0 6px}
.ups-product-top-block > div img{}
.ups-product-top-block > span{ position:absolute; top:50%; transform: translate(0,-50%);font-size: 20px; z-index:1; left:10px}
.ups-product-top-block > span > a{ color:#fff; text-decoration:none; width: 30px; height: 30px; display: flex; align-items: center; justify-content: space-around; border-radius: 25px; text-shadow:2px 2px 4px #000000;}
.ups-product-top-block > span:last-of-type{ right:10px; left:unset}
#ups-scroll {position: relative; width: fit-content; display: grid; grid-auto-flow: column; grid-template-rows: auto; flex-wrap: wrap; transition: all 0.8s; }

.general-features-block.general-features-ul{ width: 65% !important}
.general-features-block.general-function-ul{ width: 28% !important}
.general-features-block.general-function-ul ul{ width: 100%}

.general-features-ul-block > div{}
.ups-general-features{ margin-top: 0 !important}
.ups-producct-summary{ width: 100%; max-width: 1140px; margin: auto; display:flex; flex-wrap:wrap; justify-content: space-between; align-items: center;}
.ups-producct-summary > div{ width: 48%}
.ups-producct-summary > div img{ width: 100%; display: block; height: auto}
.ups-producct-summary > div h2{ font-size: 25px; margin: 20px 0 35px}

.btn-video,.btn-product{background-color: #4ca7e0; letter-spacing: .3px; line-height: 1; padding: 12px 24px; text-transform: uppercase; color: #fff !important; font-weight: 700}
.btn-video{ border-radius: 50px}
.keor-mod-block{display: flex; flex-wrap: wrap;}
.keor-mod-block:nth-of-type(even){justify-content: flex-end; margin-top: 70px}
.keor-mod-block:nth-of-type(even) > div > div:first-of-type{ order:1}

.up-categories-summary > p{ text-align: center; font-size: 18px !important}
.resources-tools-block{display: flex; justify-content: space-between; align-items: center; max-width: 1140px; margin: auto; flex-wrap: wrap;  }
.resources-tools-block > div{ width:32%; display: flex; flex-direction: column; justify-content: space-between; align-items: center; box-shadow: 0 13px 16px 2px rgb(0 0 0 / 13%); padding: 50px 25px; background: #7aa6f5; background: linear-gradient(135deg,#7aa6f5,#4b74bf); color: #fff;}
.resources-tools-block > div:nth-of-type(2){  background: #4ba6de; background: linear-gradient(135deg,#4ba6de,#40c7c9);}
.resources-tools-block > div:nth-of-type(3){background: #49679c; background: linear-gradient(135deg,#49679c,#2a4371);}

.resources-tools-block > div h2{ margin: 30px 0 50px; font-size: 30px; font-weight: normal; text-transform: capitalize;}
.resources-tools-block > div .btn-accessories{ color: #fff; border: 1px solid #fff; font-weight: bold; padding: 12px 42px; border-radius: 50px; text-align: center; transition: .3s all; text-transform: none;}
.resources-tools-block > div .btn-accessories:hover{ background-color: #4ba6de; border: 1px solid transparent}
.resources-tools-block > div:last-of-type .btn-accessories:hover{background-color: #7aa6f5;}

.up-categories-summary > h2{font-size: 2.14286em;font-weight: 700; letter-spacing: 0.8px; color:#3c3535; text-align: center; line-height: 42px; margin-bottom: 0; display: block}
.up-categories-summary > h2 strong{font-weight: normal; line-height: 1; letter-spacing: 0.8px; letter-spacing: .8px; word-wrap: break-word; color: #404040; display: block;font-size: 30px; margin-top: 20px;}

/*================= Product Page Layout ==============*/
.ups-product-display,.ups-intro-pro, .ups-description{ display:flex; flex-wrap:wrap; justify-content: space-between; max-width: 1140px;width: 100%;margin: 20px auto;}
.ups-intro-pro > div, .ups-description > div{ width:48%;}
.ups-intro-pro > div p{ width: 100%}
.ups-intro-pro > div > ul{ padding: 0 0 0 15px}
.ups-product-display > div > img,.ups-description > div > img{ width:100%; height:auto; display:block;}
.ups-description > div > ul > ol{ padding:0 0 0 10px;}
ol{font-size:14px; line-height:25px; color:#666;}
.ups-description{margin-top:100px}
.three-col-ups img{box-shadow: 0px 10px 15px #ccc; border: 1px solid #CCC; width: 100%; height: auto; display: block}
.ups-intro-pro > div > img{ position:relative; margin-top: -170px; width: 100%; height: auto; display: block}
.product-info-btn{ display: flex;flex-wrap:wrap;}
.product-info-btn > a{background-color: #fff;border: 1px solid #4ca7e0; padding: 10px; font-size:14px !important; font-weight:600; color:#4ca7e0; display: flex; max-width: 120px; width: 100%; justify-content: space-between; align-items: center; float: left; margin-right: 10px}
.product-info-btn > a:hover{background-color:#4ca7e0; color:#FFF;}
.shop-now-btn{background-color:#4ca7e0 !important; color:#FFF !important;}
.shop-now-btn:hover{background-color:#fff !important; color:#4ca7e0 !important;}
.ups-product-display > div{width: 24%; background-color:#FFF; margin-bottom: 30px;   }
.ups-product-display .text-product-name{ font-size:1.3em; background-color: #f3f2f1; padding: 15px 13px;margin-bottom: 0; display: flex; flex-wrap: wrap; align-items: center;}
.all-product-block{ background:#d54401 !important; color:#FFF; height:294px; align-items: center; display: flex; flex-wrap: wrap; justify-content: space-around;}
.all-product-block h2{ font-size: 25px; font-weight: 700; text-align:center; line-height: 28px}
.ups-download-main{ background-color:#09C; display:flex; width:100vw; flex-wrap: wrap;padding-top: 40px; color:#FFF;padding-bottom: 40px; margin-left: calc((100vw - 1280px) / -2); margin-right: calc((100vw - 1280px) / -2)}
.download-list{font-size:1.8em; font-weight:300; color:#FFF; text-transform:uppercase; line-height: 3.2em;  list-style:none; display: flex; flex-wrap: wrap;  padding: 0; width: 100%; }
.download-list > li{ margin: 0 10px; width: 100%; border-bottom: 1px solid #fff; position: relative; transition: .3s all}
.download-list > li > span{width: 100%; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between;}
.download-list > li > ul{margin: 0; display: none; padding: 0 0 0 15px}
.download-list > li:hover > ul{ display: block}
.download-list > li > ul > li{ list-style: none; border-bottom: 1px solid #fff;}
.download-list > li > ul > li:last-of-type{ border: none}
.download-list > li > ul > li a{ font-size: 16px}
.download-list-container{  margin: 20px auto; width: 100%; display: flex; flex-wrap: wrap; justify-content: space-between; max-width: 1140px; border-bottom: 1px solid #FFF; align-items: center;}
.download-heading{ line-height: 1; letter-spacing: .8px; word-wrap: break-word;font-size:24px; font-weight:500;}
.featured-img{box-shadow: 0px 10px 15px #CCC; border:1px solid #CCC; width: 100%; height: auto; display: block; padding: 15px}
.fas-tog{ font-size:35px; color:#4ca7e0; }
.language-icon{ justify-content: space-around; align-items: center; color:#FFF !important; padding:0 ; width: 100%; display: block}
.download-list-container:last-of-type{ border-bottom: none;}
.download-list-container > strong {font-size: 20px;}


/*================= Single & Three Phase UPS Layout ======================*/
.three-col-ups{float:left; width:30%; margin-right:1%; margin-top: 1em; margin-left: 2%; margin-bottom: 3em;}
hr{border:1px solid #CCCCCC78; margin-top: 1em; margin-bottom: 1em;}
.text-heading{font-size: 2.14286em;font-weight: 700;line-height: 1;letter-spacing: 0.8px; color:#3c3535;}
.text-heading-block .text-heading{ font-size: 1.6em}
.text-heading strong{ font-weight:normal; display:block; margin-top:10px;}
.text-sub-heading{font-size: 1.9em; font-weight: 300; line-height: 1; letter-spacing: 0.8px; letter-spacing: .8px; word-wrap: break-word; color: #404040;   margin-top: -18px;}
.text-product-name{font-size: 1.6em; font-weight: 700; line-height: 1; letter-spacing: 0.8px; letter-spacing: .8px; word-wrap: break-word; color: #404040; display: flex; flex-wrap: wrap; align-items: center;}
.text-product-name .fas{ width:25px; height:25px;   display: flex; border: 1px solid #d54401; justify-content: space-around; align-items: center; border-radius: 50px; margin-right:9px; font-size:16px;}
.fas-plus{ margin: 0 auto; width: 25px; height: 25px; display: flex; border: 1px solid #fff; justify-content: space-around; align-items: center; border-radius: 50px;}
/*.img{box-shadow: 0px 8px 5px #CCC; padding:10px; border:1px solid #CCC;}*/
.a-two-active{color:#FFF;}
.clear-float{clear:both;}
.text-p{ color:#3c3535; font-size:1.14286em !important;text-align: center !important;}
.product-preview {position:relative}
.product-preview .link-card__image {border:2px solid #e2e2e2; padding:15px}
.product-preview.is-new:before {content:"new";background-color:#4ca7e0;color:#fff;font-size:1.42857em;font-weight:600;text-transform:uppercase;padding:10px 15px;position:absolute;top:0;right:0;width:50px;height:30px;z-index:99
}

/*==== Red Dot ====*/
.red-dot-blocks{display: flex;flex-wrap: wrap;justify-content: space-between;box-shadow: 0 2px 4px rgba(0, 0, 0, .2), 0 0 2px rgba(0, 0, 0, .05);padding: 15px;align-items: center}
.red-dot-blocks > div{width: 48%}
.red-dot-blocks > div img{display: block;width: 100%;height: auto}
.red-dot-blocks > div strong{font-size: 20px;text-align: left;margin: 10px 0}
.red-dot-blocks > div p{text-align: left}
.red-dot-blocks > div p > strong{font-size: 16px}

.banner-text{font-size:16px !important; font-weight:200; text-align:center; color:#FFF;}
.text-col-white{ color:#FFF;}
.sub-heading-two{ text-align:center; font-size:2.3em; color:#FFF; font-weight:300; letter-spacing:1px; word-wrap: break-word; }

.general-features-block{display:flex; flex-wrap:wrap; justify-content: space-between; width: 100% !important; align-content: baseline;}
.general-features-block > h2{ width: 100%}
.general-features-block > ul{ width: 48%; padding: 0 0 0 15px; margin: 0}
.general-features-block > ul h2{ margin-left: -15px}

.ups-product-display > div{position: relative; }
.ups-product-display > div > p{ text-align: center; font-weight: bold; font-size: 16px !important}
.ups-product-display > div > span{background-color:#4ca7e0;color:#fff;font-size:1.42857em;font-weight:600;text-transform:uppercase;padding:10px 15px;position:absolute;top:0;right:0; z-index:100}
.ups-product-top-block{position: relative; overflow: hidden}
.ups-product-top-block > div{ background: #fff !important}
.ups-product-top-block #ups-scroll{ max-width: 1140px; margin: auto}
.ups-product-top-block #ups-scroll > div{ width:274px; height: auto; margin: 0 6px}
.ups-product-top-block > div img{}
.ups-product-top-block > span{ position:absolute; top:50%; transform: translate(0,-50%);font-size: 20px; z-index:1; left:10px}
.ups-product-top-block > span > a{ color:#fff; text-decoration:none; width: 30px; height: 30px; display: flex; align-items: center; justify-content: space-around; border-radius: 25px; text-shadow:2px 2px 4px #000000;}
.ups-product-top-block > span:last-of-type{ right:10px; left:unset}
#ups-scroll {position: relative; width: fit-content; display: grid; grid-auto-flow: column; grid-template-rows: auto; flex-wrap: wrap; transition: all 0.8s; }

.general-features-block.general-features-ul{ width: 65% !important}
.general-features-block.general-function-ul{ width: 28% !important}
.general-features-block.general-function-ul ul{ width: 100%}

.general-features-ul-block{ background-color: #f3f2f1; display: flex; flex-wrap: wrap; width: 100vw; margin-left: calc((100vw - 1280px) / -2); margin-right: calc((100vw - 1280px) / -2);}
.general-features-ul-block > div{}
.ups-general-features{ margin-top: 0 !important}
.ups-producct-summary{ width: 100%; max-width: 1140px; margin: auto; display:flex; flex-wrap:wrap; justify-content: space-between; align-items: center;}
.ups-producct-summary > div{ width: 48%}
.ups-producct-summary > div img{ width: 100%; display: block; height: auto}
.ups-producct-summary > div h2{ font-size: 25px; margin: 20px 0 35px}

.fas-plus.text-col-white{ margin: 0 auto; width: 25px; height: 25px; display: flex; border: 1px solid #fff; justify-content: space-around; align-items: center; border-radius: 50px;}

.btn-video,.btn-product{background-color: #4ca7e0; letter-spacing: .3px; line-height: 1; padding: 12px 24px; text-transform: uppercase; color: #fff !important; font-weight: 700}
.btn-video{ border-radius: 50px}
.keor-mod-block{display: flex; flex-wrap: wrap;}
.keor-mod-block:nth-of-type(even){justify-content: flex-end; margin-top: 70px}
.keor-mod-block:nth-of-type(even) > div > div:first-of-type{ order:1}
.keor-mod-block > div{ max-width: 1140px; width: 100%; display: flex; flex-wrap: wrap; justify-content: space-between; }
.keor-mod-block > div > div{ width: 60%}
.keor-mod-block > div > div ul{ padding: 0 0 0 20px}
.keor-mod-block > div > div:last-of-type{ width:40%; padding:0 50px 25px}
.keor-mod-block > div > div img{ width: 100%; height: auto; display: block}
.keor-mod-block > div > div h2{ line-height: 25px; font-size: 25px; letter-spacing: 0.8px; margin-top: 0}

.featured-img{box-shadow: 0px 10px 15px #CCC; border:1px solid #CCC; width: 100%; height: auto; display: block; padding: 15px}
.ups-product-display > div{width: 24%; background-color:#FFF; margin-bottom: 30px;   }
.ups-product-main{background-color:#f3f2f1; padding-top:20px; display:flex; width:100vw; flex-wrap: wrap;margin-left: calc((100vw - 1280px) / -2); margin-right: calc((100vw - 1280px) / -2)}
.ups-product-display .text-product-name{ font-size:1.3em; background-color: #f3f2f1; padding: 15px 13px;margin-bottom: 0; display: flex; flex-wrap: wrap; align-items: center;}
.all-product-block{ background:#d54401 !important; color:#FFF; height:294px; align-items: center; display: flex; flex-wrap: wrap; justify-content: space-around;}

.ups-intro-text{ display: table; width: 100vw; margin-left: calc((100vw - 1280px) / -2); margin-right: calc((100vw - 1280px) / -2); background-color:#dfdfdf}
.ups-accessories-intro{margin-top: 50px; margin-bottom: 50px}
.ups-intro-text > p{text-align: center; font-size: 24px; color: rgb(213 68 1); max-width: 1280px; margin: auto; padding: 40px 15px; line-height:32px;}

.up-categories-bg{background-color: #f3f2f1; display: table; width: 100vw; margin-left: calc((100vw - 1280px) / -2); margin-right: calc((100vw - 1280px) / -2); padding: 50px 15px}
.up-categories-summary > p{ text-align: center; font-size: 18px !important}
.resources-tools-block{display: flex; justify-content: space-between; align-items: center; max-width: 1140px; margin: auto; flex-wrap: wrap; }
.resources-tools-block > div{ width:32%; display: flex; flex-direction: column; justify-content: space-between; align-items: center; box-shadow: 0 13px 16px 2px rgb(0 0 0 / 13%); padding: 50px 25px; background: #7aa6f5; background: linear-gradient(135deg,#7aa6f5,#4b74bf); color: #fff;}
.resources-tools-block > div:nth-of-type(2){  background: #4ba6de; background: linear-gradient(135deg,#4ba6de,#40c7c9);}
.resources-tools-block > div:nth-of-type(3){background: #49679c; background: linear-gradient(135deg,#49679c,#2a4371);}

.resources-tools-block > div h2{ margin: 30px 0 50px; font-size: 30px; font-weight: normal; text-transform: capitalize;}
.resources-tools-block > div .btn-accessories{ color: #fff; border: 1px solid #fff; font-weight: bold; padding: 12px 42px; border-radius: 50px; text-align: center; transition: .3s all; text-transform: none;}
.resources-tools-block > div .btn-accessories:hover{ background-color: #4ba6de; border: 1px solid transparent}
.resources-tools-block > div:last-of-type .btn-accessories:hover{background-color: #7aa6f5;}

.award-block{display: flex; flex-wrap: wrap; justify-content: space-between; margin: auto; max-width: 1140px; align-items: center;}
.award-block > div{ width: 50%}
.award-block > div h2{ font-size: 25px}
.award-block > div:last-of-type{ padding: 50px}
.award-block > div img{ width: 100%; height: auto; display: block}
.funzioni-block{ display: table; background: url("images/ups-products/bg-placeholder.jpg") no-repeat;
    background-size: cover; text-align: center; width: 100%; align-items: center; flex-wrap: wrap; }
.funzioni-block > div{ width: 60%; margin: 100px auto}
.funzioni-block > div img{ width: 100%; height: auto; display: block}
.funzioni-block > div h2{ font-size: 30px; margin-bottom: 50px}
.sliderWrapp{ margin: 60px auto}

.battery-performance-block{max-width: 1140px; margin: auto; width: 100%; display: flex; flex-wrap: wrap; justify-content: space-between;}
.battery-performance-block h2{ width: 100%; font-size: 25px; text-align: center}
.battery-performance-block > div > ul{ padding: 0}
.battery-performance-block > div > ul > li{ list-style: none; margin: 2px 0; transition: all .35s ease-in-out; padding: 15px; display: block;position: relative; font-size: 16px}
.battery-performance-block > div > ul > li a{ color: #3c3535; font-size: 16px; font-weight: bold; display: block; transition: all .35s ease-in-out;}
.battery-performance-block > div > ul > li:hover{background-color: rgb(213 68 1); }
.battery-performance-block > div > ul > li:first-of-type:hover{background-color:transparent; }
.battery-performance-block > div > ul > li:hover a{color: #fff}
.battery-performance-block > div:first-of-type{}
.keor-block > div:first-of-type {width: 28%;}
.keor-block > div:last-of-type{width:70%!important;}
.keor-block > div > ul > li:after { height:-webkit-fill-available!important;}
.battery-performance-block > div:last-of-type{width:84%;}
.battery-performance-block > div > div{ background-color: #fff}
.battery-performance-block > div img{ width: 100%; height: auto; display: block}
.battery-performance-block > div > div:not(.active){ display:none}
.intro-services-block .active{ border:none}
.battery-performance-block > div > ul > li:after {content: ""; border-left: 12px solid transparent; border-top: 25px solid transparent; border-bottom: 25px solid transparent; position: absolute;  top: 0; right: -20px; width: 8px; height:5px; transition: all .35s ease-in-out;}
.battery-performance-block > div > ul > li:hover:after{content: ""; border-left-color: rgb(213 68 1);}
.battery-performance-block > div > ul > li:first-of-type:after{content: "";display: none}
.battery-performance-block .active-tab:after{content: "";border-left: 12px solid rgb(213 68 1); border-top: 25px solid transparent; border-bottom: 25px solid transparent; position: absolute;  top: 0; right: -20px; width: 8px; height:5px; transition: all .35s ease-in-out;}
.battery-performance-block .active-tab{background-color: rgb(213 68 1); }
.battery-performance-block .active-tab a{ color: #fff}
.battery-performance-bg{background-color: #e2e2e2; display: flex; width: 100vw; margin-left: calc((100vw - 1280px) / -2); margin-right: calc((100vw - 1280px) / -2);}

.alpes-technologies-title{background: url("images/alpes-technologies.webp") no-repeat fixed; background-size:100% auto;}
.arteor-netatmo{background:none; margin-top:-90px}
.et_pb_text_0 h1,.et_pb_column_1_3 h4, .et_pb_column_1_4 h4, .et_pb_column_1_5 h4, .et_pb_column_1_6 h4, .et_pb_column_2_5 h4{ color:#333 !important}

.img-3d-block{background-color: #e2e2e2; display: flex; flex-wrap: wrap; justify-content: space-around; padding: 35px 0;}
.img-3d-block.keor-sp-bg{max-width: 600px; margin: auto; background-color: transparent}
.img-3d-block.keor-sp-bg > div > div{ height: auto !important}
.img-3d-block.keor-sp-bg > div > span:before{content: ""; position: absolute; left: 0; right: 0; width: 100%; height: 100px;background-color: #e2e2e2; margin: auto; top: 0; bottom: 0; z-index: -1;}
.img-3d-block.keor-sp-bg > div > span{ top: 0}
.img-3d-block img{width: 100%;  height: 100%; object-fit: contain;}
.img-3d-block > div{ text-align: center}
.img-3d-block > div h2{ font-weight: normal; text-align: center; font-size: 32px;line-height: 40px; margin-top: 20px}
.img-3d-block > div h2 strong{ display: block}
.img-3d-block > div > .fas{ color: #d54401; font-size: 30px; transform: rotateY(180deg);}
.img-3d-block > div > span{pointer-events:none;position: relative; border: solid 1px #000; width: 100%; display: block; top:-20px}
.img-3d-block > div > span .fas{ position: absolute; top: 0; bottom: 0; left: 0;  background-color: #ff9000; width: 30px; height: 30px; color: #fff; display: flex; align-items: center; justify-content: space-around; border-radius: 40px; margin: auto;transform: rotate(90deg);}

.ups-services-block{display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; max-width: 1140px;margin: auto}
.ups-services-block > h2{font-size: 2.14286em;font-weight: 700; letter-spacing: 0.8px; color:#3c3535; text-align: center; line-height: 42px; width: 100%; display: block; margin: 25px 0}
.ups-services-block > div{ width: 32%}
.ups-services-block > div > a h2{ font-size: 22px; display: flex; flex-wrap: wrap;}
.ups-services-block > div > a h2 .fas{ width:25px; height:25px;   display: flex; border: 1px solid #d54401; justify-content: space-around; align-items: center; border-radius: 50px; margin-right:9px; font-size:16px; color: #404040}

.ups-services-block > div img{ width: 100%; display: block; height: auto}
.ups-catalogue-block{ width: 100vw; display: flex; flex-wrap:wrap; justify-content: space-around; background: url(images/ups-catalogue.jpg) no-repeat; min-height: 590px; align-items: center; margin-left: calc((100vw - 1280px) / -2); margin-right: calc((100vw - 1280px) / -2);}
.ups-catalogue-block > div{display: flex; flex-wrap:wrap; justify-content: space-between; align-items: baseline; width: 29%}
.ups-catalogue-block > div > h2{font-size: 40px; color: #fff; text-align: center; width: 100%}
.ups-catalogue-block > div > h2 .fas{ font-size:17px; border: solid 2px #fff; border-radius: 50px; margin:10px auto;  width: 35px; height: 35px; display: flex; align-items: center; justify-content: space-around}
.ups-catalogue-block > div .btn-catalogue{border: 2px solid #fff; padding: 12px  24px; border-radius:50px; margin: 5px; color: #fff; font-size: 14px; font-weight: bold; text-transform: uppercase; transition: all .3s}
.ups-catalogue-block > div .btn-catalogue .fas{ margin-left: 10px}
.ups-catalogue-block > div .btn-catalogue:hover{ background: #d54401; border: 2px solid #d54401}


/*================= Single & Three Phase UPS Layout END ======================*/

/*================= software ===================*/
.software-main-block{display: flex; flex-wrap: wrap; margin: 25px 0; justify-content: space-between}
.software-heading{font-size: 1.14286em;letter-spacing: .4px;color:#d54401;}
.col-left{ width:45%; list-style:none;}
.col-mid{ width:20%;}
.col-right{ width:28%; }
.aplication{  margin: 25px 0 0 30px; border-left: 1px solid #d54401;padding: 0 15px; color:#3c3535;}
.software-title{  font-weight: 700;font-size: 2.14286em;line-height: 1;letter-spacing: .8px; margin-top: -8px;}
.free-label{background-color: red;color: #fff;padding: 0 5px;}
.sofware-p{  font-size: 1em; color: #a5a5a5; font-weight: 600;}
.btn-downloads a{background-color: #e2e2e2; border-radius: 50px;color: #a5a5a5 !important;width: 220px;margin-left: 15px;padding: 10px 25px;text-align: center;white-space: normal;font-weight: 600;}
.btn-downloads a:hover { background-color: #d54401; color:#FFF !important;}
.details{ background-color:#ECECEC; font-size:16px; font-weight:500; padding: 8px; display: inline-block;
margin-top: 20px; }
.detailsbtn { color:#d54401; background-color: #ECECEC; font-size: 16px;font-weight: 500;padding: 8px;display: inline-block;margin-top: 20px;cursor:pointer; border-left: 1px solid #d54401; }
.detailsbtn:hover{ background-color:#d54401; color:#FFF;}
.btn-downloads{display: flex;
flex-wrap: wrap;
align-items: center;}

.image-card {box-shadow: 0 13px 16px 2px rgba(0,0,0,.13);  position: relative;  margin-bottom: 50px;}
.image-card-title {padding: 0px 50px;  font-size: 1.5em;  font-weight: 700;  line-height: 1;  text-transform: uppercase;  color: #3c3535;  text-align: center;}
.categories-three-col{float: left;  width: 30%;  margin-right: 1%;  margin-top: 1em;  margin-left: 2%;  margin-bottom: 3em;}

.btn.btn-primary {background-color: #d54401; color: #fff; left: 140px;}
.btn.is-outside { position: absolute; right: 15px; bottom: -9px;}
.btn.has-arrow {position: relative; padding: 12px 48px 12px 24px;
}
.btn.has-shadow {box-shadow: 3px 3px 7px 0 rgba(0,0,0,.23);
}
.btn.is-rounded { border-radius: 50px;}
.btn.btn-primary:active, .btn.btn-primary:focus, .btn.btn-primary:hover { background-color:#d54401;}

.btn.has-arrow::after {content: "→"; font-family: lg icons; font-style: normal; font-size: 12px; font-weight: 400; line-height: 1; position: absolute; right: 25px; top: 50%; transform: translateY(-50%); }

.warranty-period-block img{ width:80%; height: auto; display: block}
.quality-products{ margin-top: 50px}
.quality-products img{ margin-top: 20px; height: auto; width: 100%; display: block}

.privacy-personal-info{flex-wrap: wrap; display: flex;  width: 100%; justify-content: space-between; }
.privacy-personal-info ul{ padding: 0; margin: 0; width: 33%}
.privacy-personal-info ul li{ list-style: none}


/*ARROW*/
.historical-timeline > span{width: 2px;height: calc( 100% - 20px );background-color:#ED1C24;position:absolute;left: 50%;transform:translate(-50%);top: 10px;}
.historical-timeline > span:before{width: 0;content: "";height: 0;border-style: solid;border-width: 0 10px 40px 10px;border-color: transparent transparent #ED1C24 transparent;position:absolute; top: -4px;left: 50%;transform: translate(-50%);}
.historical-timeline > span:after{content:"";width: 0;height: 0;border-style: solid;border-width: 40px 10px 0 10px;border-color: #ED1C24 transparent transparent transparent;position:absolute;bottom: -4px;left: 50%;transform: translate(-50%);}

.historical-timeline:not(.active){display: none;}

.legrand-services-banner{background:none;  height:429px; padding: 0; position: relative}
.legrand-services-banner > div{ height: 100%; display: flex; margin:0 auto;align-items: flex-end; position: absolute; left: 0; right: 0}
.legrand-services-banner > div h1{font-size:80px; font-weight: 800; text-shadow: 1px 1px 5px #000; text-transform: uppercase !important; margin: 0; line-height: 80px; text-align: left}
.legrand-services-banner video{object-fit: fill; min-width: 100%; min-height: 100%; }
.legrand-services-banner:before{display: none}
.services-projects-banner > div h1 {position: relative; left: 0; top: 36%;}
.services-projects-banner > div h1 strong{font-weight: 800; color: rgb(213 68 1);}

/*================== LINKEO DATA CENTER PDUs ============================*/
.linkeo-banner{background: url("images/linkeo-data-center-pdus.webp") no-repeat; background-size:cover; height: 390px}
.linkeo-basic-banner{background: url(images/linkeo-basic-pdu.webp) no-repeat; background-size:cover; height: 390px}
.linkeo-intelligent-banner{background: url(images/linkeo-intelligent-pdu.webp) no-repeat; background-size:cover; height: 390px}
.linkeo-pdu-accessories-banner{background: url(images/linkeo-pdu-accessories.webp) no-repeat; background-size:cover; height: 390px}
.linkeo-banner:before,.linkeo-basic-banner:before,.linkeo-intelligent-banner:before,.linkeo-pdu-accessories-banner:before{display: none}

.pdus-text-block h1{ font-weight: 900; color: #000;font-size: 65px; margin-top: 30px;}
.pdus-text-block h1 strong{ color: #e96429; font-weight: 900;}
.pdus-text-block > span{font-size: 40px; margin: 70px; display: block;}
.pdus-text-block{ color: #000}
.pdus-text-block > div{display: flex; justify-content: space-between; flex-wrap: wrap; max-width: 1140px; align-items: flex-end;margin:30px auto}
.pdus-text-block > div > div{ width: 32%; background-color: #fafafa; border-radius: 10px }
.pdus-text-block > div > div > a{display: flex; flex-wrap: wrap; justify-content: space-around;}
.pdus-text-block > div > div > a > h2{ width: 100%; text-align: center; font-size: 20px}
.pdus-text-block > div > div img{ display: block; width: 100%; height: auto;}

.pdus-text-block > div > span{width: 100%; display: flex; flex-wrap: wrap; background: url("images/pdus/zero-u-horizontal-1u.jpg"); background-size: contain; padding: 20px; border-radius: 10px}
.pdus-text-block > div > span > strong{}
.pdus-text-block > div > span > div{ width: 50%;}
.pdus-text-block > div > span p{ font-size: 20px !important; width: 100%;}
.pdus-text-block > div > span strong{ font-size: 25px; margin:25px 0 30px 0; width: 100%; display: block}

.pdu-delivering-performance{ max-width: 1140px; margin: auto; color: #000; margin-top: 35px; display: table; width: 100%}
.pdu-delivering-performance > h2{ font-weight: 900; color: #000; text-transform: uppercase !important; font-size: 45px; margin-top: 30px;}
.pdu-delivering-performance > h2 strong{ color: #e96429; font-weight: 900;}
.pdu-delivering-performance > p{font-size: 30px !important;  display: block;}
.pdu-delivering-performance > div{display: flex; flex-wrap: wrap;}
.pdu-delivering-performance > div > span{ width: 21%;background-color: #fff; margin-right: 2%; margin-top: 10px;}
.pdu-delivering-performance > div > span img{border: 1px solid #C0C0C0; width: 100%; height: auto; display: block}
.pdu-delivering-performance > div > span h3{ text-align: center; font-size: 20px; line-height: 24px;}
.pdu-delivering-performance > div > span:hover iframe,.pdu-delivering-performance > div > span:hover img{-webkit-box-shadow: 2px 2px 24px 0px rgba(0,0,0,0.75);-moz-box-shadow: 2px 2px 24px 0px rgba(0,0,0,0.75);box-shadow: 2px 2px 24px 0px rgba(0,0,0,0.75);transition:all 0.75s ease; -webkit-transition: all 0.75s ease; -moz-transition: all 0.75s ease; -o-transition: all 0.75s ease;}

.pdu-delivering-performance > div > div{ width: 50%; background-color: #e96429; color: #fff; position: relative}
.pdu-delivering-performance > div > div img{ width: 100%; height: auto; display: block}
.pdu-delivering-performance .pdu-text{ padding: 50px;}
.pdu-delivering-performance .pdu-text p{ line-height: 28px; font-size: 16px !important}
.pdu-delivering-performance .pdu-text:first-of-type::after{ content:""; position:absolute; left:100%; top:45%;border:solid 30px #e96429; border-bottom:solid 30px transparent; border-top:solid 30px transparent;border-right:solid 30px transparent;z-index: 1;}
.pdu-delivering-performance .pdu-text:last-of-type::after{ content:""; position:absolute; right:100%; top:45%; border:solid 30px #e96429; border-bottom:solid 30px transparent;border-top:solid 30px transparent;border-left:solid 30px transparent; z-index: 1;}
.pdu-delivering-performance > div > div h2{font-size:18px; margin-top: 0;}

.basic-pdus-text-block{display: flex; justify-content: space-between; flex-wrap: wrap; width: 100%; max-width: 1140px; margin: 80px auto auto; color: #000; font-size: 16px}
.basic-pdus-text-block > div{ width: 48%}
.basic-pdus-text-block > div > h2{ margin: 0; background-color: #e96429; color: #fff; padding:15px 25px; font-weight: normal; font-size: 22px; text-transform: capitalize; line-height: 32px; display: flex; flex-wrap: wrap;     align-items: center; height: 94px}
.basic-pdus-text-block > div > h2 span{ display: block; width: 100%}
.basic-pdus-text-block > div img{ width: 100%; height: auto; display: block}
.basic-pdus-text-block > div > h3{ font-weight: 900; font-size: 26px; padding: 0 15px;color: #000; margin-top: 40px;}
.basic-pdus-text-block > div  strong{ font-size: 18px; padding: 0 15px; display: block; margin:  10px 0}
.basic-pdus-text-block > div ul{ padding: 0 30px; margin: 0 0 40px 0 }
.basic-pdus-text-block > div ul li{ padding: 6px 0; line-height: 20px;}
.basic-pdus-text-block .pdu-loacl-metering{background-color: #e96429; color: #fff; padding: 10px 0 15px; margin: 26px 0} 
.basic-pdus-text-block .pdu-loacl-metering ul{  margin-bottom: 0}


.modbus-cascading{display: flex; justify-content: space-between; flex-wrap: wrap; margin: auto; max-width: 1140px; width: 100%; margin-top: 20px; font-size: 16px; background-color: #ff5a11; color: #fff; padding: 20px}
.modbus-cascading ul{ padding:  0 0 0 20px}
.modbus-cascading ul li{ padding: 6px 0; line-height: 20px}
.modbus-cascading > h2{ width: 100%;margin-bottom: 0; font-weight: normal; font-size: 22px;}
.modbus-cascading > img{ margin: auto;display: block}
.modbus-cascading.standalone,.modbus-cascading.usb-cascading{ background-color: #fff; color: #000000}
.modbus-cascading.standalone{ background-color: #cfb9a9;color: #000000}
.modbus-cascading.standalone p{ font-size: 16px; margin: 0; position: relative; bottom: -40px;}
.facilitating-deployment-maintenance{display: flex; justify-content: space-between; flex-wrap: wrap; max-width: 1140px;  margin: auto; color: #000; margin-top: 40px;}
.facilitating-deployment-maintenance > div{ width: 100%;display: flex; justify-content: space-between; flex-wrap: wrap;}
.facilitating-deployment-maintenance > div h2{ width: 100%; text-transform: none; font-size: 22px;}
.facilitating-deployment-maintenance > div > div{ width: 33%; margin-bottom: 15px;}
.facilitating-deployment-maintenance > div > div h3{ font-size: 18px}

.home-autmation-block{ width:100%;display: flex; justify-content: space-between; flex-wrap: wrap; margin-bottom:45px;}
.home-autmation-block > div{ width:100%; margin:auto;text-align:center; display:flex; flex-wrap: wrap;justify-content:space-between;}
.home-autmation-block > div > div{ width:19%}
.home-autmation-block > div > div > a > div{position:relative; width:230px; height:240px; background-color:#fff; margin-right:auto; margin-left:auto; margin-bottom:10px; margin-top:10px; padding:0px; color:#404040; font-size:0.9em; line-height:12px; border: 1px solid #C0C0C0;}
.home-autmation-block > div > div > a > div img{display:block; margin: auto;position: absolute;top: 0;left: 0;bottom: 0;right: 0;}
.home-autmation-block > div > div > a > div:hover{-webkit-box-shadow: 2px 2px 24px 0px rgba(0,0,0,0.75);-moz-box-shadow: 2px 2px 24px 0px rgba(0,0,0,0.75);box-shadow: 2px 2px 24px 0px rgba(0,0,0,0.75);transition:all 0.75s ease; -webkit-transition: all 0.75s ease; -moz-transition: all 0.75s ease; -o-transition: all 0.75s ease;}
.home-autmation-block > div > div h2{margin-bottom: 0; font-weight: normal; font-size: 16px; line-height: 20px; border-bottom: solid 2px rgb(213 68 1); padding-bottom: 5px; min-height: 50px}
.arteor-netatmo-video h3{min-height: 58px}

.netatmo-reseller{ max-width:1140px; width:100%; margin:auto; display: flex; justify-content: space-between; flex-wrap: wrap;}
.netatmo-reseller > div{ width:31%; box-shadow: 0px 2px 18px 0px rgb(0 0 0 / 14%); padding:10px; text-align:center; margin-bottom: 30px;}
.netatmo-reseller > div h3{color: #333333; font-size: 20px; font-weight: bold; margin:20px 0}
.netatmo-reseller > div p span{ font-weight:bold}
.netatmo-reseller > div p{ width:90%; margin:auto; font-size:16px}

.buy-product-block { width:100%; display:flex; flex-wrap: wrap; justify-content: space-between }
.buy-product-block > div{ width:32%;height:240px; border: 1px solid #ccc; padding:10px; margin:1% 0}
.buy-product-block > div > div{ float:right; display:inline-block; width:56%; }
.buy-product-block > div h2{ font-size:15px}
.buy-product-block > div > div:first-of-type{ float:left; width:150px; height:130px}
.buy-product-block > div > div img{ max-width: 150px; max-height: 130px;object-fit: contain;left: 50%;position: relative;transform: translate(-50%);}
.buy-product-block > div > div ul{ padding:0; padding-left:10px}
.buy-product-block > div > div ul li{ list-style:none}
.buy-product-block > div > div ul li a{ color:#202020}

/*===================== DOWNLOAD ======================*/
.disclaimer-text .download-brochure{ margin: 0 auto;  display: flex; flex-wrap: wrap; justify-content: space-between; width: 100% !important}
.download-brochure{ margin: 0 auto;  display: flex; flex-wrap: wrap; gap:0 22px}
.download-brochure > div h2{ width: 100%; font-weight: normal; text-transform: uppercase; font-size: 16px; text-align: center;}
.download-brochure > div{ width:23%; margin-bottom: 30px}
.download-brochure > div > span{ display: block; margin-top: 10px; text-align: center;line-height: 22px}
.download-brochure > div > span a{ }
.download-brochure > div img{ width: 100%; height: auto; display: block; border: solid 2px #bbc0c8; padding: 4px;}
.download-brochure > div .fa-fw{ margin-right: 10px;} 
.download-brochure > div p{ margin-bottom: 0}
.download-text-block .brochure-text { color: #004F71;}

.login-register{width:980px; margin: auto; display:table; margin-top:80px}
.login-register h1{ color:#595959}
.login-register table{width:100%}
.login-register table td{padding:10px; display: inline-block; width: 50%;}
.login-register table input[type=text],.login-register table input[type=password], .login-register table input[type=email], .login-register table select, .login-register table textarea{padding: 12px; width:100%; margin-top: 5px; border: #ccc solid 1px; height:41px; color:#202020 !important;}
.login-register button{margin: auto}
.login-register .btn1{padding: 15px 20px}
.login-register h1{text-align: center}
.login-register textarea{font-family:Arial, Helvetica, sans-serif;font-size:11px; padding:2px !important; margin:0px !Important;}

.login-login > div{width:50%; float: left}
.login-login > div h2{margin-top: 0}
.login-login ul{margin-top: 0}
.login-login > div:last-of-type{width: auto; float: right; background-color: #f1f1f1; padding: 40px; line-height: 22px}
.login-login > div:first-of-type{margin-top: 20px}
.login-login table td{padding-left:0px}
.login-login a{display: inline-block; margin-top: 15px}

.login-forgot{visibility:hidden; position:absolute;}

#Divider_RegisterWindow.login-register{position: static !important}

.product-register{ width:100%; display:table; margin-top:0}
.product-register h2{ margin-top:0}
.product-register tr{ width:100%}
.product-register tr td{ width:50%; display:inline-block}
.product-register .promotions-block input{ margin:15px 10px 15px 0; width: unset}
.product-register .promotions-block label{ font-size:14px; margin-right: 25px;}
.product-register td strong{ display:block; font-weight:normal}
.product-register input[type="file"] { cursor: pointer; background-color: #EDEBEB; border: solid 1px #ccc; border-radius: 4px; width:100%; padding:8px}
.zone-file{position:absolute;z-index:999;top:7px;left:100px;width:200px;height:30px;background-color:#EDEBEB;padding-left:40px;padding-top:4px; text-transform: uppercase;}
.form-uploaddoc{ position:relative; width:100%}
.zone-float-right{ margin-top:20px}
.zone-itemreturn-table{border:2px solid #c0c0c0;width:700px;}
.zone-itemreturn-table tr:nth-child(1){background-color:#c0c0c0;font-weight:bold;text-align:center;}
.zone-itemreturn-table td{padding:3px;}
.zone-itemreturn-table td:nth-child(1){width:350px;}
.zone-itemreturn-table td:nth-child(2){width:120px;}
.zone-itemreturn-table td:nth-child(3){width:80px;}
.zone-itemreturn-table td:nth-child(4){width:40px;}
.zone-itemreturn-table td:nth-child(5){width:150px;}


.contact-us{width: 100%}
.contact-us > div{ width: 100%}
.contact-us h2{text-transform: uppercase; font-size:.9em}

.contactus-extra-info{width: 90% !important; display: flex; flex-wrap: wrap; justify-content: space-between; margin-top: 60px;}
.contactus-extra-info > h2{ font-size: 22px;font-weight:normal;margin-bottom: 30px; margin-top: 0 }
.contactus-extra-info > div{ width:48%; margin-bottom: 34px;  padding: 40px; background: #ffffff; box-shadow: 0 0 29px #efeded;}
.contactus-extra-info > div h2{  font-size:.9em; margin-top:0; margin-bottom: 20px }
.contactus-extra-info > div ul{ padding:0; margin:0;margin-bottom: 30px;}
.contactus-extra-info > div iframe{ display:block}
.contactus-extra-info > div ul li{ list-style:none; color:#888; margin-bottom: 10px; width:100%; text-align: left; display: flex; flex-wrap: wrap; align-items: baseline;}
.contactus-extra-info > div ul li > a{ text-decoration:none; color: rgb(102, 102, 102);display: flex; flex-wrap: wrap; align-items: baseline;}
.contactus-extra-info > div ul li:last-of-type > a{ width: 100%}
.contactus-extra-info > div ul li a > span{ width: 85%}
.contactus-extra-info > div ul li .far,.contactus-extra-info > div ul li .fas{font-size: 14px; padding-right: 10px; color: #222; border: 1px solid #ddd; display:block; text-align: center; padding: 12px; height: 40px; width: 40px; margin-right: 10px; border-radius: 100%; float: left;}

/*===================== Contact us ======================*/
.contactus-block{display: flex; flex-wrap:wrap; justify-content: space-between; margin-top: 20px }
.contactus-block h2{ width: 100%; font-weight: normal;text-align: center; margin-bottom: 0; text-transform: uppercase;}
.contactus-block p{width: 100%;text-align: center}
.contactus-block > div{ width: 32%; box-shadow: 6px 4px 18px rgb(0 0 0 / 8%); border: solid 1px #292929; border-radius: 4px; padding:30px 15px 20px 0; display: flex; flex-wrap: wrap; justify-content: space-between; transition: .3s all; background-color: #fff;}
.contactus-block > div ul{ padding: 0; margin: 0}
.contactus-block > div ul li{ list-style: none;    line-height: 22px;}
.contactus-block > div ul li:first-of-type{  padding-bottom: 9px; }
.contactus-block > div:hover{ box-shadow:none}
.contactus-block > div > span strong{ display: block; font-size: 20px; color: #000; margin-bottom: 5px;}
.contactus-block > div > span:first-of-type{ width: 90px; height: 70px; border-radius: 0 50px 50px 0; background-color:#ED1C24; color:#fff; font-size: 34px; display: flex; align-items: center; justify-content: space-around;}
.contactus-block > div:nth-of-type(2) > span:first-of-type{ background-color: rgba(213, 68, 1, 1);}
.contactus-block > div:nth-of-type(3) > span:first-of-type{ background-color: rgba(136, 43, 0, 1);}
.contactus-block > div > span:last-of-type{ width:70%; line-height: 24px}
.contactus-block > div > span:last-of-type > a{ display: block; margin: 5px 0}

.enquiry{ display:table;width:100%; margin:auto; margin-bottom: 20px}
.captcha {color:#666;}
.enquiry h2{margin-top: 40px; font-weight: normal}
.enquiry table{width: 100%}
.enquiry .btn1 {margin-top: 22px; font-weight: bold; padding: 12px 15px; color: white !important; border-radius: 1px !important; text-decoration:none}
.enquiry input, .enquiry select, .enquiry textarea{background-color: white; color: #666; font-family:Arial, Helvetica, sans-serif; padding: 12px ; width: 100%; font-size: 16px !important; border:1px solid #c0c0c0;}

.showroom-enquiry p{font-size: 20px}

.disclaimer-text ul,.disclaimer-text ol{ padding:0 0 0 20px; margin:0}
.disclaimer-text ul li,.disclaimer-text ol li{ padding:5px 0}
.text-block.disclaimer-text h2{ font-weight:normal}
.text-block.disclaimer-text > div{ display: flex; justify-content: space-between; flex-wrap: wrap; width:50%; margin-top:20px}
.text-block.disclaimer-text > div > a{min-width:150px; }
.tcs-block > td > div {display: flex;flex-wrap: nowrap;align-items: center;justify-content: unset !important;}
.tcs-block div input {width: 4%;height: 25px;margin-right: 10px; margin-left:0}
.tcs-block > td > div > label > span > a{color: rgba(82, 87, 92, 1) !important; font-weight:normal}

.branch-block{margin-left: calc((100vw - 1280px) / -2); margin-right: calc((100vw - 1280px) / -2);width: 100vw; display: flex; background: rgba(82, 87, 92, 1)}
.branch-block > div{max-width: 1280px; margin:80px auto; display: flex; flex-wrap: wrap; justify-content: space-between; padding: 0 15px; width: 100%}
.branch-block > div > div{width: 49%; border-radius: 8px; overflow: hidden; position: relative}

.branch-block > div > div img{width:100%; height: auto; display: block}
.branch-block > div > div > span{background-color:#353536; border-bottom-right-radius: 8px; border-bottom-left-radius: 8px; justify-content: center; align-items: center; height: 32px; padding-left: 16px; padding-right: 16px; font-size: 15px; display: flex; position: absolute; top: 0; color: #fff; left: 5%}
.branch-block > div > div > div{z-index: 3;  background-image: linear-gradient(#0000, #00000069); justify-content: space-between; align-items: flex-end; padding: 24px; display: flex; position: absolute; inset: 0%; color: #fff; flex-wrap: wrap}
.branch-block > div > div > div h2{font-size: 28px; font-weight: normal;}
.branch-block > div > div > div div{font-size: 15px; line-height: 26px; width: 58%}
.branch-block > div > div > div div ul{ padding: 0; margin: 0}
.branch-block > div > div > div div ul li{list-style: none}
.branch-block > div > div > div div ul li a{color: #fff}

/*======================== THANK YOU & ERROR 4040 ==========================*/
.custom-404,.thank-you-custom{min-height:300px;}

/*===========================FORM===========================*/
.email_show{display: none !important;}
.email_remove{}
.form-field-input.noCap{
	width: 100% !important;
}
.form-field *, .form-field, *[id*='_form_parent']{
    color:#808080;
    width: 100%;
}

*[id*='_form_parent'] > *.form-field{ float:left; width: 48%;}
*[id*='_form_parent'] > *:nth-child(even){margin-left: 0.5%;}
*[id*='_form_parent'] > *:nth-child(odd){margin-right: 1%;}
*[id*='_form_parent'] > *:nth-child(odd):last-child{width: 100%;}

*[id*='_form_parent']:after{float: none; clear: both; width: 100%; display: block; content: ' '}

.form-field textarea{font-family:Arial,Helvetica,sans-serif;}
.form-field:not(:last-child){ margin-bottom: 15px;}
.form-field-note{color:#f00; margin-top:5px;}
.form-field-title{
    margin-bottom: 10px;
    font-weight: bold;
}
.form-field > input, .form-field > select, .form-field > textarea{
    padding: 6px;
    border-color: #d4d4d4;
    border-width: 1px;
}
.form-field-break{padding: 10px 0px; width: 100% !important; }
.form-submit{
    width: 100%;
    max-width: 200px;
    display: inline-block;
    position: relative;
    left: 50%;
    transform: translate(-50%, 0);
	-ms-transform: translate(-50%,0%); 
    
    text-align: center;
    padding: 10px;
}

@media screen and (max-width: 600px){
    *[id*='_form_parent'] > *{width: 100% !important; display: block !important; margin-left: 0 !important; margin-right: 0 !important;}
}

/*******************************************************************************
                                Places
*******************************************************************************/
*{box-sizing: border-box;}
#places_locator_Main{ width: 100vw; }
#places_locator_search{ padding: 15px 15px; width: 100%;display: grid; grid-template-columns: 1fr; grid-gap: 6px;height: max-content;}

#places_locator_search > *{width: 100%; padding: 3px;}
#places_locator_search > *:last-child:nth-child(2n-1){ grid-column: 1/-1;}
#Divider_PlacesLocator{ height: 600px; position: relative;}
#places_locator_sidebar_parent{ max-height: 80%; width: 30%; display:grid; grid-column:1fr; position: absolute;top:15px; left: 15px; z-index: 1; background-color: #fff;box-shadow:0px 0px 7px #000000ab}
#places_locator_sidebar{overflow-y: auto;height: max-content;max-height: 100%;}
#places_locator_sidebar > div{ width: 100%; padding: 15px; overflow-y: auto; }
*[id^="map_marker_id_"]  *:not(:first-child) > *{display: inline-block; padding: 2px 4px;}
*[id^="map_marker_id_"] > div > *:first-child{width: 10%;}
*[id^="map_marker_id_"] > div > *:nth-child(2){width: 90%; display: inline-block;}

#places_locator_sidebar > div:not(:last-child){ border-bottom: solid black 1px; }
#place_locator_map{ height: 100%; width: 100%;width: 100vw;margin-inline: calc( (100vw - 100%) / -2)}

/*BOTTOM LIST*/
#places_locator_sidebar{overflow-y: auto;height: max-content;max-height: 100%;display: grid; grid-template-columns: repeat(3,1fr);gap: 16px;}
#places_locator_sidebar > div{ width: 100%; padding: 15px; overflow-y: auto; border: 1px solid #ccc !important;}

/*------------------ FOOTER --------------*/
.footer{ color:#fff; width:100%;  background-color:#353536; display:table; padding: 0 15px; position: relative}
.footer > span{display: flex; max-width: 1663px; margin: auto;}
.footer > span strong{background:rgba(237, 28, 36, 1); padding: 24px 20px; font-size: 12px; position: relative; left: -15px}
.footer > div{text-align:left; width:100%; margin: auto; max-width: 1280px; font-size:15px; line-height:22px; display: flex; flex-wrap: wrap; justify-content: space-between;}
.footer > div > div{ width:20%; margin: 25px 0 }
.footer > div > div:nth-of-type(2),.footer > div > div:nth-of-type(3),.footer > div > div:nth-of-type(4){ width:16%; }
.footer > div > div ul{margin: 0; padding: 0 }
.footer > div > div ul strong{text-transform: uppercase; display: block; width: 100%; margin: 20px 0}
.footer > div > div ul li{list-style: none;padding:  3px 0}
.footer > div > div a{ color: #fff }
.social-media-block ul{display: flex; flex-wrap: wrap;justify-content: space-between;}
.social-media-block ul li{width: 32px; height: 32px; background: #fff; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-around;}
.social-media-block ul li a{color: #353536 !important;}
.footer > div > ul{display: flex; flex-wrap: wrap; justify-content: space-between; padding: 0; width: 40%}
.footer > div > ul li{ list-style: none; font-size: 12px}
.footer > div > ul a{color: #fff;}

#_Products_Summary .nav-categorylist,#_Products_Summary ._Product_Heading{padding:0 15px}

.row{clear: left;}
.row0{clear: left; line-height:1px;}

@media not all and (min-resolution:.001dpcm) {
}
@media (min-width: 1664px) and (max-width: 2560px){
	
}

@media only screen  and (min-width : 2280px){
}

@media screen and (max-width: 1280px){
}
@media (min-width: 1024px) and (max-width: 1330px){
	.footer{ padding:0 10px }
	
}

@media only screen and (max-width: 1024px){
	body{ display: table}
		
}

@media (min-width: 600px) and (max-width: 1023px){
	body{ }
	.electrical-header{max-width: 800px}
	.portal-block{width: 63%}
	.nav > li > span, .nav > li > a{font-size: 16px; padding: 0 15px;}
	.intro-products-solutions{margin:50px auto}
	
	.csslider1 > .cs_description > label{bottom: 60px !important; max-width: 70% !important;}
	.home-banner:before{width: 75%}
	.csslider1 > .cs_description .cs_descr p{margin-bottom: 35px; margin-top: 0}
	.csslider1 > .cs_description .cs_title strong br{display: none}
	.csslider1 > .cs_description .cs_title strong{ font-size: 40px; line-height: 32px;}
	.page-title{min-height: 170px; height: auto}
	.intro-products-solutions > div h2{font-size: 28px;}
	.aboutus-sub-block,.intro-sub-block-bg{margin:20px auto}
	.historical-tabs > div{min-width: 10%; padding: 12px 28px}
	
	.historical-timeline > div img{width: 100%}
	.menu-side{width: 25%}
	.reference-projects-text, .text-block, .services-text, .download-software-block, .download-brochure-block{width: 72%}
	.services-summary{width: 100%}
	.legrand-services-banner video{height: auto}
	
	.branch-block{margin: auto}
	.contactus-block > div > span:last-of-type{width: 64%}
		.battery-performance-bg,.general-features-ul-block,.ups-download-main,.ups-product-main,.general-features-ul-block,.arteor-netatmo-banner, .connected-home-banner, .arteor-netatmo-back_page,.netatmo-distributors-back_page, .connected-switches-sockets-back_page,.ups-catalogue-block,.up-categories-bg,.ups-intro-text{margin: auto; width: 100%}
	.footer > div > div{width: 22%}
}

@media screen and (max-device-width: 768px){	
	
}

@media screen and (max-width:599px){
	body{display: block; margin-top: 100px !important}
	.ecat-value{max-width:9px !important;} /*---- important do not remove  ----*/
	.mobi-only{ display: block !important}
	img{max-width: 100%; height: auto}
	
	.electric-socket-1.custom-menu-scroll-down{ background-color: #fff}
	.electric-socket-1.custom-menu-scroll-down .nav > li > span, .electric-socket-1.custom-menu-scroll-down .nav > li > a{color:#000}
	.electric-socket-1.custom-menu-scroll-down .portal-block{display: unset}
	.electric-socket-1.custom-menu-scroll-down .menu-top-container{width: 100%}
	.electric-socket-1.custom-menu-scroll-down .menu-top{order: -1}
	.electric-socket-1.custom-menu-scroll-down .widget-container{width: auto}
	.electric-socket-1.custom-menu-scroll-down .electrical-header{justify-content: space-between; align-items: center;}
	.electric-socket-1.custom-menu-scroll-down:before{display: none}
	.electric-socket-1.custom-menu-scroll-down .logo{height: auto}
	.electric-socket-1.custom-menu-scroll-down .search input{color: #b2b0b0}
	.electric-socket-1.custom-menu-scroll-down .search a img{filter: brightness(40%);}
	.electric-socket-1.custom-menu-scroll-down .search ::-webkit-input-placeholder {color: #b2b0b0;}
	.electric-socket-1.custom-menu-scroll-down .search ::-moz-placeholder{color: #b2b0b0;}
	.electric-socket-1.custom-menu-scroll-down .search :-ms-input-placeholder {color: #b2b0b0;}
	.electric-socket-1.custom-menu-scroll-down .search :-moz-placeholder {color: #b2b0b0;}
	
	.logo{width: 30%;left: 0px; height: auto}
	.electrical-header{width:70%; padding:10px; order:-1}
	.electrical-supplies-2, .electrical-section{width:100%;}	
	.widget-container{width: auto;}
	.search{height: 35px}
	
	.electric-socket-1 .search input{color: #b2b0b0}
	.electric-socket-1 .search ::-webkit-input-placeholder {color: #b2b0b0;}
	.electric-socket-1 .search ::-moz-placeholder{color: #b2b0b0;}
	.electric-socket-1 .search :-ms-input-placeholder {color: #b2b0b0;}
	.electric-socket-1 .search :-moz-placeholder {color: #b2b0b0;}
	.search a img, .portal-block > ul > li > span img, .portal-block > ul > li > a img,.portal-block > ul > li > span img, .portal-block > ul > li > a img{filter: brightness(40%) !important;}
	.electric-socket-1{background: #fff !important;width: calc(100% - 50px); float: right; right: 0; height: 100px;
    border-bottom: 1px solid rgba(226, 228, 230, 1) !important; margin: 0; left: unset;}
	
	.portal-block > ul > li > span, .portal-block > ul > li > a{padding: 10px 5px}
	.portal-block > ul > li:nth-of-type(4),.portal-block > ul > li:nth-of-type(3),.portal-block > ul > li:nth-of-type(2),.electric-socket-1:before{display: none}
	
	.home-intro-products > div{width: 100%; margin: 10px 0;}
	.intro-products-solutions > div,.intro-products-solutions .products-1st-block{width: 100%}
	.intro-products-solutions > div > div{width: 100%; height: 230px; margin: 10px 0}
	
	.intro-products-solutions > div img{height: 100%; object-fit: cover;}
	.intro-products-solutions > div > div > span{width: 100%; padding: 15px}
	.intro-products-solutions > div h2{ font-size: 32px; line-height: 34px;}
	.intro-products-solutions > div h2 br{display: none}
	
	.products-2nd-block > div > span{height: 100% !important}
	.intro-products-solutions{margin: 15px auto}
	.intro-recommended-products{margin: 0 auto 50px auto}
	
	.page-title{ min-height: 170px; background-size: cover; height: auto; padding: 0}
	.page-title > div{padding: 15px}
	.page-title > div h1{font-size: 35px; margin: 0}
	
	.ups-title > p{font-size: 16px}
	.ups-title h1{text-align: left; margin: 13px 0; font-size: 31px}
	.up-categories-summary > h2{ font-size: 26px}
	.ups-product-display > div,.three-col-ups,.ups-services-block > div,.categories-three-col{ width: 100%; margin:2% 0}
	.up-categories-summary{display: flex; flex-wrap: wrap; text-align: center; justify-content: space-around;}
	.btn.btn-primary{ margin: auto; left: 0}
	.btn.is-outside{ right: 0}
	.ups-intro-pro > div, .ups-description > div,.ups-intro-pro > div, .ups-description > div,.resources-tools-block > div{ width: 100%}	
	.three-col-ups,.ups-container,.ups-catalogue-block > div{ width: 100%; padding: 0 15px}
	.ups-product-display,.ups-description,.ups-intro-pro,.ups-services-block{ padding: 0 15px}
	.ups-catalogue-block > div .btn-catalogue{ width: 100%; text-align: center;}
	.ups-catalogue-block{min-height: 300px;}
	.ups-accessories-block > div{ width: 100% !important}
	.ups-documentations-block{}
	.ups-documentations-block > span ul li{ width: 100%; margin: 0}
	.ups-documentations-block > div{ width: 49%}
	
	.ups-intro-pro > div > img{ margin-top: 0}
	.ups-product-top-block #ups-scroll > div{width: 165px;}
	.general-features-block > ul{ width: 100%}
	.product-info-btn > a{ max-width: 120px !important}
	.img-3d-block > div h2{ font-size:20px }
	.img-3d-block > div{ width: 100%}
	.img-3d-block.keor-sp-bg > div > div{ width: 100% !important}
	.battery-performance-block > div:first-of-type,.battery-performance-block > div:last-of-type{ width: 100%; padding: 0 15px}
	.battery-performance-block > div > ul > li{ width: 90%}
	.ups-product-top-block > div{max-width:80vw !important;}
	
	.keor-mod-block{ margin-top: 30px !important}
	.keor-mod-block > div > div h2{ line-height: 32px}
	.keor-mod-block:nth-of-type(odd) > div > div:first-of-type{order: 1}
	.btn-video{ width: 100%; display: block; text-align: center}
	
	.award-block > div,.keor-mod-block > div > div,.general-features-block.general-features-ul{ width: 100% !important}
	.award-block > div:last-of-type,.keor-mod-block > div > div:last-of-type,	.ups-producct-summary > div{ width: 100%; padding: 0}

	.battery-performance-bg,.general-features-ul-block,.ups-download-main,.ups-product-main,.general-features-ul-block,.arteor-netatmo-banner, .connected-home-banner, .arteor-netatmo-back_page,.netatmo-distributors-back_page, .connected-switches-sockets-back_page,.ups-catalogue-block,.up-categories-bg,.ups-intro-text{margin: auto; width: 100%}
	.up-categories-bg{padding: 0}
	
	.ups-intro-pro > div > img{margin: auto}
	.ups-container > ul,.general-features-block > ul{width: 100%}
	
	#_Products_Summary #_Products_Section{display: flex !important; flex-direction: row; flex-wrap: wrap;}
	#_Products_Summary ._card_category_condensed{padding: 15px !important; width: 100%}
	
	.et_pb_text_0 h1{ margin-bottom:0}
	.et_pb_bg_layout_dark h1{ margin-top:0}
	.et_pb_fullwidth_header .et_pb_fullwidth_header_container{ width:100% !important}
	.header-content h1{ font-size:26px !important}
	.header-content-container .header-content{ margin:auto; width:100% !important}
	.home-autmation-block > div{flex-direction: column;}
	.home-autmation-block > div > div{ width:auto; margin-bottom: 20px;}
	
	.ecommerce-logo > div{ width:95%; margin:auto}
	.netatmo-reseller > div{ margin:5px auto; width:100%;}
	.pdu-delivering-performance,.pdus-text-block{ padding: 0 15px}
	.pdu-delivering-performance{ margin: auto}
	.pdus-text-block > div > div{ width: 100%; margin-bottom: 10%;}
	.pdu-delivering-performance > div > div{ width: 100%}
	
	.pdus-text-block > span{font-size: 32px;margin: 50px 0; line-height: 29px;}
	.pdus-text-block h1{ font-size: 40px; line-height: 50px;}
	.pdus-text-block > div > span > div{ width: 100%}
	.pdu-delivering-performance > h2{font-size: 32px; line-height: 29px;}
	.pdu-delivering-performance > div{ margin: 15px 0}
	.pdu-delivering-performance .pdu-text:first-of-type::after,.pdu-delivering-performance .pdu-text:last-of-type::after{ display: none}
	.pdu-delivering-performance .pdu-text{padding: 20px }
	.basic-pdus-text-block{ margin: 50px auto auto}
	.modbus-cascading > img{width: 100%; height: auto;}
	.modbus-cascading > h2{line-height: 28px}

	.facilitating-deployment-maintenance{padding: 0 15px}
	.facilitating-deployment-maintenance > div > div{ width: 100%}
	.basic-pdus-text-block > div,.pdu-delivering-performance > div > span{ width: 100%; padding: 0}
	.linkeo-pdu-accessories-banner{ height: 110px !important}
	.basic-pdus-text-block .pdu-loacl-metering,.basic-pdus-text-block > div ul{ margin: 0}
	
	.reference-projects-block > div > div{ width: 100% !important}
	.reference-projects-block > div > div h2{ margin-top: 20px;}
	.download-software-block > div > div,.reference-projects-text > div > div{ width: 100%; padding: 15px !important}
	.reference-projects-text > div:last-of-type > div{ margin-top: 0}
	.reference-projects-text{padding: 15px}
	.reference-projects-text > div > div:nth-of-type(odd){}
	.reference-projects-text .projects-img{order: 1}
	.download-software-block > div > div h2,.reference-projects-text > div > div h2{height: auto}
	
	.buy-product-block > div{width: 100%; height: auto}
	.buy-product-block > div > div{width: 52%}
	
	.download-software-block .software-img{order:-1}
	.software-main-block >div{width: 100%}
	
	.aboutus-sub-block,.intro-sub-block-bg{margin:20px auto}
	.aboutus-sub-block-img img{width: 100%; top:0}
	.intro-sub-block-bg-text ul li,.aboutus-sub-block-img,.legrand-group-sub-block{width: 100%}
	.legrand-group-sub-block > div > h2{margin-top: 20px}
	.sub-intro-text > p,.intro-sub-block-bg-text{margin: 0}
	.sub-intro-text > p{font-size: 22px; line-height: 32px;}
	
	.our-purpose-our-values > div,.our-value-block > div{ width: 100%; }
	.ceo-block > div{ width: 100% !important}
	.our-purpose-our-values > h2{font-size: 20px;}
	.our-value-img{ height: auto; min-height: 260px;  order: 1;}
	.our-value-block,.values-text,.ceo-block,.values-video{padding: 15px 0 !important}
	
	.historical-timeline > div{ margin-bottom:30px}
	.historical-timeline > div > div:nth-child(1),.historical-timeline > div:nth-child(even),.historical-timeline > div:nth-child(odd){ width:100%;flex-direction: column;}
	.historical-timeline > div{ display:flex;flex-direction: column; min-height:auto}
	.historical-timeline > div > div:nth-child(1) img{ transform:unset}
	.historical-timeline > span:before,.historical-timeline > span:after,.historical-timeline > span,.historical-timeline > div:nth-child(even):after,.historical-timeline > div:nth-child(odd):after{ display:none}
	.historical-tabs > div{margin: 2px;}
	.historical-tabs{ flex-direction: column;}
	.historical-timeline > div > div:nth-child(1){margin: auto}
	
	.download-brochure > div{width: 48%}
	
	.reference-projects-block > div > div{ width: 100% !important}
	.reference-projects-block > div > div h2{ margin-top: 20px;}
	.download-software-block > div > div,.reference-projects-text > div > div{ width: 100%; padding: 15px !important}
	.reference-projects-text > div:last-of-type > div{ margin-top: 0}
	
	.corruption-block > div{width: 100%; padding: 15px}
	.corruption-block > div:last-of-type{padding: 0; width: 100%}
	.related-documents-block,.text-block-fraud > div > div{width: 100%; padding: 0}
	
	.text-block-fraud-text{order: -1}
	.career-block > div, .training-block > div,.related-documents-block > div{width: 100%}
	.career-block, .training-block{margin: 0 auto}
	
	.menu-side{display: none}
	.reference-projects-text, .text-block, .services-text, .download-software-block, .download-brochure-block{width: 100%}
	.download-video > div{width: 100% !important}
	
	.distribution-boards-text h2, .warranty-period-block h2, .ups-list-block h2, .maintenance-busbar-text h2, .services-summary > h2{line-height: 40px; font-size: 32px;}
	.quality-products img{ height: auto}
	.services-table, .services-table td{ font-size: 11px}
	.services-projects-block > div,.warranty-period-block img,.busbar-block ul{ width: 100%}
	.services-projects-block > h2{ font-size: 24px; text-align: left}
	.services-industries-block > div{ width: 49% !important; margin-bottom: 8px;}
	.services-projects-block > div > span{ width: 70%; height: auto}
	.services-summary-block > div{ width: 100%; margin: 10px 0}
	.services-projects{ padding:50px 15px 0}
	.legrand-services-banner{top: 0; min-height: 105px; height: auto}
	.services-projects-banner > div h1 strong br{ display: none}
	.legrand-services-banner > div h1,.services-projects-banner > div h1{ top:0; font-size: 30px; line-height: 30px}
	.legrand-services-banner > div{ padding: 0 10px}
	.legrand-services-banner video{ height: 105px}

	.quality-products,.services-summary-block{margin-top: 0}
	.services-projects-block{margin-bottom: 20px}
	.services-projects{ margin-top:0}
	.services-projects-block > div > span img{width: auto; margin: auto}
	
	.text-block-text-side{width: 100%; margin-top: 0}
	.maintenance-transformers-block > div{width: 100%}
	.text-block-side-image{width: 100%; padding:0}
	.text-block-side-image img{ width: 100%; height: auto;}

	.contactus-block > div{ width: 100%; margin: 10px 0}
	.enquiry table td{display: block}
	.enquiry input, .enquiry select, .enquiry textarea{font-size: 14px}
	
	.branch-block{margin: auto}
	.branch-block > div{margin:40px auto}
	.branch-block > div > div{width: 100%; margin:20px auto}
	.branch-block > div > div > div div{width: 100%}
	.branch-block > div > div > div h2{margin-bottom: 10px}
	
	/*=============== Search Toggle ==============	
	#mobi-toggle-search:checked ~ * .search-toggle{top:0px; transition: all 0.25s}
	#mobi-toggle-search:NOT(checked) ~ * .search-toggle{top:-115px;transition: all 0.25s}
	.search-toggle{background-color: #fff;width: 100vw;overflow:hidden;transition:all 0.25s;order:2; display: flex; flex-direction:row;justify-content:center;align-items: center;position:fixed; left:0; padding:0 10px; height:100px;z-index:10000; transform-origin: bottom center; height:115px; border:none; border-radius:0 }
	.search input{height:40px;}
	.mobi-toggle-search-btn{ flex-shrink: 0; width: 32px; height:32px; font-size: 20px; background-color:#231f1e; color: #fff; border-radius: 32px; justify-content: center; align-items: center; display: flex !important; margin:0;}
	.mobi-toggle-search-btn-close{ flex-shrink: 0; width: 34px; height: 40px; display: flex; font-size: 20px; background-color:#231f1e; color: #fff; border-radius: 2px; justify-content: center; align-items: center; display: flex !important;}
	*/
	/*=============== Thank you ==============*/
	.thank-you div,.thank-you{ width:100%}
	.thank-you-title{ left:auto; white-space:normal; font-size:4.5em}
	.thank-you div{ top:auto}
	.thank-you-contact{ margin-top:0}
	.thank-you div{ left:auto}
	
	.text-block.disclaimer-text > div{ width:100%}
	.text-block.disclaimer-text > div > a{ width:100%; margin:5px 0}
	.tcs-block div{ line-height:20px}
	.tcs-block div input{ width:10%}
	
	/*=============== Mobile banner ==============*/	
	.csslider1{ height:100%}
	.home-banner{min-height: 400px}
	.home-banner:before{height: 250px; width: 100%}
	.home-banner h2{font-size: 26px;   line-height: 28px;}
	.cs_title .cs_wrapper{ bottom:0}
	.mobile-banner{ position:absolute;background-color: rgba(0, 0, 0, 0.5); bottom:0;color: #fff; margin: 0; font-size: 20px; line-height: 26px; left: 0; width:100%; height:85%}
	.csslider1 > .cs_description > label{ max-width:100% !important; width:100%; left:0 !important}
	.home-banner .cs_title h1{ font-size:26px}
	.home-banner .cs_title .cs_wrapper{ padding:0 15px; font-size:26px}
	.mobile-banner > span{ position:unset; font-size:32px; line-height:32px}
	.home-banner .cs_descr .cs_wrapper{padding:0 15px; }
	.home-banner .cs_descr .cs_wrapper br{ display:none}
	.home-banner .btn-learn-more{ margin-left:15px; margin-top:15px}
	.home-banner .cs-title-align{ margin:0}
	.csslider1 > .cs_description > label{ bottom: 0 !important; transform: translate(0, 39%);}
	.csslider1 > .cs_description .cs_title strong { font-size: 32px; line-height: 32px;}
	.csslider1 > .cs_description .cs_title strong br{display: none}
	.csslider1 > .cs_description .cs_wrapper b{font-size: 22px; line-height: 22px; margin-bottom: 10px;}
	.csslider1 > .cs_description .cs_descr p{font-size: 16px; margin: 0; display: none}
	.csslider1 > .cs_description > label > .cs_descr{padding:0 15px}
	.csslider1 > .cs_description .home-btn{display: inline-block; margin-bottom: 0}
	.csslider1 > .cs_description > label span {width: 96%;}


	/*=============== MENU ==============*/
	.portal-block > ul > li > span, .portal-block > ul > li > a{color:rgb(115 117 123) !important}
	.portal-block{width: 100%}
	.dropdown-menu.long-dropdown li,.nav > li{width: 100%}
	.nav > li > span, .nav > li > a{color: rgba(31, 31, 32, 1) !important; line-height: 36px; width: 100%}
	.dropdown:focus .dropdown-menu,.dropdown:hover .dropdown-menu{display:block !important; margin:0;left:0;position:relative;border-radius:0 !important;min-width: 100%;}
	.navbar-toggle{position:relative; width:20%; margin:0; text-align:center}	
	.menu-top{position: absolute; top: 70px; width: 100%}	
	.dropdown-menu{margin-left: 20px}	
	
	.footer > div > ul{width: 100%}
	.footer > div > div{width: 100%; margin: 0;}
	.footer > div > div:nth-of-type(2), .footer > div > div:nth-of-type(3), .footer > div > div:nth-of-type(4){width: 32%}
}

@media screen and (max-width: 599px){
	.menu-top{ background-color:#fff; left: 0; position:fixed; top:0; height:100px; width:50px; overflow:hidden; padding:0px; transition:all 0.3s; z-index:100; border-bottom: 1px solid rgba(226, 228, 230, 1);}
	#mainNav{padding:10px;overflow-y:auto;height:calc(100vh - 100px)}
	.menu-top>label{color:rgb(115 117 123);display:block;height:100px;padding:0;position:relative;margin-bottom:0}
	.menu-top>label>i{font-size: 1.5rem;color:rgb(115 117 123);line-height:100px;text-align:center;width:50px;transition:all 0.1s ease 0.3s}
	#navOverlay{display:block;width:100%;height:100%;background-color:rgba(0,0,0,0.8);position:fixed;top:0;left:0;transform:translate(-100%);transition:all 0.25s ease-out 0.1s;z-index:100}
	#mobi-toggle:checked ~ .electric-socket-1 .menu-top>label i::before{content:"\f00d";font-size:2.5rem}
	#mobi-toggle:checked ~ .electric-socket-1 .menu-top{height:100vh;width:250px}
	#mobi-toggle:checked ~ * #navOverlay{transform:translate(0)}
}