@import url("w2default.css");
@import url("https://fonts.googleapis.com/css?family=Montserrat:300,500,700");
* { color: #404040; font-family: "Montserrat", sans-serif; font-weight: 500; font-size: 16px; line-height: 20px; }

html { background-color: #fff; }

html, body { height: 100%; }

input[type="submit"] { background-color: #e6411c; color: #fff; font-size: 14px; font-weight: bold; white-space: nowrap; height: 40px; padding: 0 25px; border-radius: 25px; }

h2, h2 * { color: #1aace9; font-size: 40px; line-height: 44px; }

.wrapper { width: 1200px; }

.innerwrapper { width: calc(1200px - 30%); margin: 0 auto; }

.general-section { padding: 80px 0; }

.btn { display: inline-flex; align-items: center; height: 50px; padding: 0 25px; border: solid 2px #e6411c; border-radius: 25px; }

.btn .text { color: #e6411c; white-space: nowrap; }

.btn .icon { background: url("../images/icons-01.svg") no-repeat 0 0; background-size: 600px 600px; display: inline-flex; align-items: center; justify-content: center; width: 30px; height: 30px; }

.btn:hover { background-color: #e6411c; }

.btn:hover .text { color: #fff; }

.btn:hover .icon { background-position: 0 -30px; }

.btn-white { background-color: #fff; border-color: #fff; }
.btn-white .text { color: #1f4864 !important; font-size: 14px; font-weight: bold; }

.btn-orange { background-color: #e6411c; border-color: #e6411c; }
.btn-orange .text { color: #fff !important; font-size: 14px; }
.btn-orange .icon { background-position: 0 -30px; }

.btn-orange:hover { background-color: #1aace9; border-color: #1aace9; }

.btn-outerwhite { border-color: #fff; }

.btn-outerwhite .icon { background-position: 0 -30px; }

.btn-outerwhite:hover { background-color: #fff; }

.btn-outerwhite:hover .text { color: #1f4864 !important; }

.btn-outerwhite:hover .icon { background-position: 0 -90px; }

.box { position: relative; }

.box .invalidfield { display: none; color: #e6411c; font-size: 10px; line-height: 12px; position: absolute; bottom: -15px; }

.box.error .invalidfield { display: block; }

.box.error input, .box.error textarea, .box.error select { border-color: #c00; }

.box-knowmore { padding-top: 30px; }

.box-knowmore .btn { padding: 0 10px 0 25px; }

span.mandatory { background: url("../images/mandatory.png") no-repeat center center; display: inline-flex; width: 10px; height: 10px; }

.db-content blockquote { background: url(../images/blockquote.png) no-repeat 0 36px; padding: 30px 0 30px 50px; }

.db-content blockquote, .db-content blockquote * { color: #1f4864; font-family: "Montserrat", sans-serif; font-weight: bold; font-size: 26px; line-height: 30px; }

.db-content a { color: #1aace9; }

#loading-container { background: rgba(255, 255, 255, 0.9) url(../images/loading.gif) no-repeat center center; width: 100%; height: 100%; top: 0; left: 0; position: fixed; z-index: 100000000000000000; display: flex; justify-content: center; align-items: center; display: none; }

header { position: fixed; top: 0; left: 0; width: 100%; height: 80px; padding-top: 0; z-index: 10001; box-shadow: 0 0 0 #000; transition: all 0.5s ease; }

header * { color: #fff; }

header .wrapper { display: flex; justify-content: space-between; height: 100%; }

header .wrapper .left { display: flex; height: 100%; transition: margin-left 0.3s ease; }

header .left .logo { display: flex; align-items: center; height: 100%; margin-right: 40px; }
header .left .logo a { display: block; }
header .left .logo img { font-size: 20px; line-height: 20px; font-weight: bold; white-space: nowrap; width: 150px; height: 26px; }
header .left .menu { padding: 0 30px; }
header .left .menu, header .left nav, header .left nav ul.lev1, header .left nav li.lev1 { height: 100%; }
header .left nav ul.lev1 { display: flex; }
header .left nav li.lev1 { display: flex; align-items: center; margin-right: 30px; padding-top: 10px; position: relative; }
header .left nav a.lev1 { display: block; height: 30px; overflow: hidden; position: relative; font-size: 14px; }
header .left nav a.lev1:after { content: ""; display: block; position: absolute; bottom: -5px; left: 0; width: 100%; height: 0; border-top: dotted 4px #fff; transition: bottom 0.5s ease; }
header .left nav li.active a.lev1:after, header .left nav a.lev1:hover:after { bottom: 0; }
header .left nav ul.lev2 { background-color: #1aace9; position: absolute; top: 80px; left: 0; min-width: 240px; padding: 15px 20px; border-radius: 5px; opacity: 0; visibility: hidden; margin-top: 20px; transition: all 0.5s ease; box-shadow: 0 0 5px rgba(64, 64, 64, 0.5); }
header .left nav ul.lev2:before { content: ""; background: url("../images/arrow-submenu.png") no-repeat 0 0; display: block; position: absolute; top: -10px; left: 20px; width: 24px; height: 10px; }
header .left nav li.lev1:hover ul.lev2 { opacity: 1; visibility: visible; margin-top: 0; }
header .left nav li.lev2 { padding: 2px 0; }
header .left nav a.lev2 { color: #1f4864; font-size: 14px; line-height: 14px; white-space: nowrap; }
header .left nav li.lev2.active a.lev2 { color: #fff; }
header .left .search { display: flex; align-items: center; height: 100%; }
header .left nav li.lev2 a.lev2:hover, header .left nav li.lev2 a.lev2.active { color: #fff; }

header .right .hello { font-size: 10px; line-height: 20px; border: solid 1px #fff; padding: 2px 5px; font-weight: normal; border-radius: 20px 0 0 20px; margin-right: 0; }
header .right .btn-logout { height: 26px; border-radius: 0px 20px 20px 0; border-width: 1px; padding: 0 5px; transition: all 0.3s ease; }
header .right .btn-logout:hover { border-color: #e6411c; }
header .right .btn-logout:hover .text { color: #fff !important; }
header .right .btn-logout .text { font-size: 10px; font-weight: normal; }
header .right .languages { display: flex; margin-left: 20px; }
header .right .languages a { display: inline-flex; align-items: center; justify-content: center; width: 22px; height: 22px; border-radius: 30px; border: solid 1px #fff; text-transform: uppercase; font-size: 8px; transition: all 0.3s ease; }
header .right .languages a:not(:last-child) { margin-right: 5px; }
header .right .languages a.active { background-color: #e6411c; border-color: #e6411c; color: #fff; pointer-events: none; }
header .right .languages a:hover { background-color: #fff; color: #e6411c; box-shadow: 0 0 5px rgba(64, 64, 64, 0.5); }

body.products header .left .search { display: none; }

body.truncated .languages a { border: solid 1px #ededed; color: #1f4864; }

body.truncated .hello { color: #1f4864; border-color: #a6a6a6; border-right: none; }

body.truncated .right .btn-logout { border-color: #e6411c; border-width: 1px; }

body.truncated .right .btn-logout .text { color: #e6411c !important; }

body.truncated .right .btn-logout:hover .text { color: #fff !important; }

.form-generalsearch { width: 250px; position: relative; }

.form-generalsearch .text { background-color: transparent; color: #fff; font-size: 12px; width: 100%; height: 30px; padding-right: 40px; border: solid 1px #fff; border-radius: 15px; transition: all 0.5s ease; }

.form-generalsearch .text::placeholder { color: #ededed; }

.form-generalsearch .submit { background: url("../images/icons-01.svg") no-repeat -59px -15px; background-size: 300px; position: absolute; width: 15px; height: 15px; padding: 0; right: 10px; top: 8px; }

header .right { height: 100%; display: flex; align-items: center; position: relative; }

header .right .btn-poplogin { height: 40px; position: relative; z-index: 1; }

header .right .btn-poplogin:hover { background-color: #e6411c; border-color: #e6411c; }

header .right .btn-poplogin:hover .text { color: #fff !important; }

#form-login { background-color: #fff; position: absolute; top: -210px; /*top: 0;*/ right: 0; width: 300px; height: 170px; padding: 15px 30px; border-radius: 10px; transition: top 1s ease; z-index: 2; box-shadow: 0 0 5px rgba(64, 64, 64, 0.5); }

#form-login.active { top: 20px; }

#form-login .box-title { color: #1f4864; font-size: 14px; line-height: 14px; font-weight: bold; margin-bottom: 5px; }
#form-login .box-username, #form-login .box-password { border: solid 1px #a6a6a6; border-radius: 5px; padding: 7px; display: block; }
#form-login .box-username { margin-bottom: 10px; }
#form-login .username, #form-login .password { color: #a6a6a6; font-size: 14px; height: 20px; border-color: transparent; }
#form-login .label { font-size: 10px; line-height: 10px; margin-bottom: 3px; }
#form-login .box-submit { position: absolute; bottom: -20px; right: 30px; display: flex; align-items: center; border-radius: 30px; }
#form-login .box-submit .submit { background-color: #e6411c; transition: all 0.3s ease; }
#form-login .box-submit .submit:hover { background-color: #1aace9; }
#form-login .btn-close { border: solid 1px #a6a6a6; border-radius: 100%; position: absolute; top: 15px; right: 30px; width: 15px; height: 15px; display: flex; justify-content: center; align-items: center; }
#form-login .btn-close:before { background: url("../images/icons-01.svg") no-repeat -35px -14px; background-size: 140px; content: ""; width: 7px; height: 7px; }
#form-login .btn-close:hover { background-color: #e6411c; border-color: #e6411c; }
#form-login .btn-close:hover:before { background-position: -35px -7px; }

body.truncated header { background-color: #fff; box-shadow: 0 0 50px rgba(0, 0, 0, 0.2); }
body.truncated header .left .logo img { display: none; }
body.truncated header .left .logo a:before { background: url("../images/header-logo-color.svg") no-repeat 0 0; content: ""; color: #1f4864; display: block; width: 150px; height: 26px; }
body.truncated header nav a.lev1 { color: #1f4864; }
body.truncated header nav li.active a.lev1:after, body.truncated header nav a.lev1:hover:after { bottom: 0; color: #1f4864; border-color: #1f4864; }
body.truncated header .right .btn-poplogin { box-shadow: 0 0 5px rgba(64, 64, 64, 0.5); }
body.truncated .form-generalsearch .text { background-color: transparent; color: #1f4864; border-color: #a6a6a6; }
body.truncated .form-generalsearch .text::placeholder { color: #a6a6a6; }
body.truncated .form-generalsearch .submit { background-position: -59px 0; }

footer { box-shadow: 0 0 20px rgba(64, 64, 64, 0.5); }
footer * { color: #1f4864; font-size: 10px; }
footer .wrapper { display: flex; padding: 20px 0; justify-content: space-between; }
footer .wrapper a { text-transform: uppercase; font-size: 12px; }
footer .wrapper a:not(:last-child) { margin-right: 20px; }
footer .wrapper a:hover { text-decoration: underline; }
footer .left, footer .mid, footer .right { display: flex; align-items: center; }
footer .left .box-copyright { white-space: nowrap; }
footer .left .box-2020, footer .left .box-feei { height: 26px; margin-left: 10px; }
footer .left .box-norte2020 { height: 20px; margin-left: 10px; }
footer .left .box-2020 a, footer .left .box-feei a, footer .left .box-norte2020 a { pointer-events: none; }
footer .left .box-2020 img, footer .left .box-feei img, footer .left .box-norte2020 img { height: 100%; }

/* ################################### MENU MOBILE ################################### */
#mobile-menu-switch { width: 40px; height: 40px; position: fixed; top: 20px; left: 20px; z-index: 10002; cursor: pointer; transition: all 0.3s ease; }

#mobile-menu-switch span { background-color: #fff; display: block; width: 30px; height: 2px; border-radius: 2px; position: absolute; left: 5px; }

#mobile-menu-switch span:nth-child(1) { top: 10px; }

#mobile-menu-switch span:nth-child(2) { top: 19px; }

#mobile-menu-switch span:nth-child(3) { bottom: 10px; }

.truncated #mobile-menu-switch span { background-color: #1f4864; }

#mobile-menu-switch.active { background-color: #fff; left: 250px; z-index: 10002; border-radius: 0 5px 5px 0; box-shadow: 0 0 30px rgba(0, 0, 0, 0.3); }

#mobile-menu-switch.active span { background-color: #1f4864; }

#mobile-menu-switch.active span:nth-child(1) { transform: rotate(45deg); top: 20px; }

#mobile-menu-switch.active span:nth-child(2) { display: none; }

#mobile-menu-switch.active span:nth-child(3) { transform: rotate(-45deg); top: 20px; }

#mobile-menu { background-color: #fff; position: fixed; width: 250px; box-shadow: 0 0 5px rgba(64, 64, 64, 0.5); height: 100%; box-shadow: 0 0 30px rgba(0, 0, 0, 0.3); z-index: 10002; left: -250px; opacity: 0; transition: all 0.3s ease; }

#mobile-menu .container .search { display: flex; height: 80px; align-items: center; justify-content: center; width: 100%; border-bottom: solid 1px #ededed; }

#mobile-menu .container .text { background-color: transparent; color: #1f4864; font-size: 16px !important; font-weight: 300; width: 100%; height: 30px; padding-right: 40px; border: solid 1px #a6a6a6; border-radius: 15px; transition: all 0.5s ease; }

#mobile-menu .container .form-generalsearch { width: 220px; }

#mobile-menu .container .form-generalsearch .text::placeholder { color: #a6a6a6; }

#mobile-menu .container .form-generalsearch .submit { background: url("../images/icons-01.svg") no-repeat -59px 0; background-size: 300px; position: absolute; width: 15px; height: 15px; padding: 0; right: 10px; top: 8px; }

#mobile-menu .container a { font-size: 16px; padding: 20px; display: block; border-bottom: solid 1px #ededed; color: #1f4864; }

#mobile-menu.active { left: 0; opacity: 1; }

#mobile-menu .container li.children > a { border-bottom: none; padding-bottom: 10px; }

#mobile-menu .container li.lev2 a { font-size: 12px; color: #a6a6a6; border-bottom: none; padding: 10px 20px 10px 40px; }

#mobile-menu .container li ul.lev2 { border-bottom: solid 1px #ededed; padding-bottom: 10px; }

#mobile-menu .container a.logo { display: none; }

/* ################################### HOME ################################### */
#banner { background-color: #1f4864; height: 100%; position: relative; }
#banner .gallery { position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 1; }
#banner .gallery .swiper-container { height: 100%; }
#banner .wrapper { display: flex; align-items: center; height: 100%; padding: 140px 0; position: relative; z-index: 5; }
#banner .wrapper .content { width: 50%; }
#banner .wrapper .content * { color: #fff; }
#banner .wrapper .title { font-size: 50px; line-height: 60px; padding-bottom: 40px; margin-bottom: 30px; position: relative; text-shadow: 0px 0px 10px rgba(255, 255, 255, 0.4); }
#banner .wrapper .title:after { content: ""; background-color: #fff; position: absolute; bottom: 0; left: 0; width: 100px; height: 10px; display: block; border-radius: 10px; box-shadow: 0px 0px 10px rgba(255, 255, 255, 0.4); }
#banner .box-scroll { position: absolute; bottom: 40px; right: 0; display: inline-flex; align-items: center; z-index: 4; }
#banner .box-scroll .text { color: #1f4864; font-size: 14px; white-space: nowrap; }
#banner .box-scroll .icon { background: #fff url("../images/icons-01.svg") no-repeat -28px 0; background-size: 550px; display: inline-flex; width: 30px; height: 30px; align-content: center; justify-content: center; border: solid 2px #e6411c; border-radius: 30px; margin-left: 20px; }
#banner .mask-a { background-color: rgba(31, 72, 100, 0.6); position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 2; pointer-events: none; }
#banner .mask-a:before { background: url("../images/banner-grad.png") repeat-x 0 center; content: ""; width: 100%; height: 100%; position: absolute; top: 0; left: 0; }
#banner .mask-b { background: url("../images/banner-mask.svg") no-repeat right bottom; background-size: cover; position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 3; }

#home-presentation .wrapper { display: flex; }
#home-presentation .box-image { width: 33.33%; padding-right: 15px; }
#home-presentation .box-image img { width: 100%; max-width: 300px; }
#home-presentation .box-title { width: 33.33%; padding: 0 15px; }
#home-presentation .box-text { width: 33.33%; padding-left: 15px; }

#home-products { background-color: #1f4864; padding: 180px 0; position: relative; z-index: 2; }
#home-products * { color: #fff; }
#home-products .mask { position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 3; pointer-events: none; }
#home-products .mask:before { background: url("../images/mask-top-products-home.svg") repeat-x center center; background-size: auto 100%; content: ""; position: absolute; top: 0; left: 0; width: 100%; height: 100px; }
#home-products .mask:after { background: url("../images/mask-bot-products-home.svg") repeat-x center center; background-size: auto 100%; content: ""; position: absolute; top: auto; bottom: 0; width: 100%; height: 70px; }
#home-products .back { position: absolute !important; top: 0; left: 0; width: 100%; height: 100%; position: relative; z-index: 1; display: flex; }
#home-products .back .left { width: 50%; height: 100%; }
#home-products .back .right { width: 50%; height: 100%; }
#home-products .front { height: 100%; position: relative; z-index: 2; }
#home-products .front .wrapper .content { width: 50%; padding-right: 30px; }

#home-support { padding-top: 0; position: relative; z-index: 3; }
#home-support .wrapper { background-color: #fff; margin-top: -120px; padding: 60px; border-radius: 5px; box-shadow: 0 0 20px rgba(64, 64, 64, 0.3); position: relative; }
#home-support .wrapper .title { color: #1aace9; position: relative; display: flex; align-items: center; white-space: nowrap; }
#home-support .wrapper .title:after { content: ""; width: 100%; height: 0; border-bottom: dotted 4px #1aace9; margin-left: 30px; }
#home-support .content { display: flex; align-items: center; }
#home-support .content .left { padding-right: 30px; }
#home-support .content .left img { max-width: 300px; }
#home-support .content .right, #home-support .content .right * { color: #a6a6a6; }
#home-support .box-knowmore { display: flex; justify-content: center; position: absolute; bottom: -25px; left: 0; width: 100%; }

/* ################################### ABOUT US ################################### */
#secbanner { background: #1f4864; height: 300px; padding: 80px 0; position: relative; }
#secbanner .wrapper { height: 100%; display: flex; align-items: center; position: relative; z-index: 2; }
#secbanner .wrapper .content { text-align: center; width: 100%; }
#secbanner .wrapper .content .title { color: #fff; position: relative; display: flex; align-items: center; justify-content: center; white-space: nowrap; text-shadow: 0px 0px 10px rgba(255, 255, 255, 0.4); }
#secbanner .wrapper .content .title:before, #secbanner .wrapper .content .title:after { content: ""; display: inline-flex; width: 100px; height: 0; border-bottom: dotted 4px #fff; margin-right: 30px; box-shadow: 0px 0px 10px rgba(255, 255, 255, 0.4); }
#secbanner .wrapper .content .title { color: #fff; position: relative; display: flex; align-items: center; white-space: nowrap; }
#secbanner .wrapper .content .title:after { margin: 0 0 0 30px; }
#secbanner .wrapper .content .subtitle { color: #fff; padding-top: 20px; font-size: 20px; line-height: 25px; font-weight: bold; max-height: 50px; width: 60%; margin: 0 auto; text-align: center; text-shadow: 0px 0px 10px rgba(255, 255, 255, 0.4); }
#secbanner .mask { background-color: rgba(31, 72, 100, 0.6); position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 1; }

#secbanner:after { content: ""; background: url("../images/mask-banner-about-us.svg") repeat-x center bottom; background-size: 1920px auto; display: block; position: absolute; bottom: 0; left: 0; width: 100%; height: 50px; z-index: 3; }

body.about-us #secbanner:after { background: url("../images/mask-banner-about-us.svg") repeat-x center bottom; background-size: 1920px auto; }

body.quality #secbanner:after { background: url("../images/mask-banner-quality.svg") repeat-x center bottom; background-size: 1920px auto; }

body.contacts #secbanner:after { background: url("../images/mask-banner-contacts.svg") repeat-x center bottom; background-size: 1920px auto; }

body.products #secbanner:after { background: url("../images/mask-banner-products.svg") repeat-x center bottom; background-size: 1920px auto; }

body.support #secbanner:after { background: url("../images/mask-banner-products.svg") repeat-x center bottom; background-size: 1920px auto; }

#aboutus-links { background: url("../images/prefooter.png") repeat-x center bottom; }

.list-a { display: grid; grid-gap: 30px; grid-template-columns: repeat(3, 1fr); }
.list-a .item a { background-color: #1f4864; height: 250px; display: flex; align-items: center; justify-content: center; flex-direction: column; text-align: center; border-radius: 5px; box-shadow: 5px 0 20px rgba(0, 0, 0, 0.3); margin-top: 0; transition: margin-top 0.5s ease, box-shadow 0.5s ease; position: relative; overflow: hidden; }
.list-a .item:hover a { margin-top: -20px; box-shadow: 5px 0 50px rgba(0, 0, 0, 0.6); }
.list-a .item a:before { content: ""; background-color: rgba(0, 0, 0, 0.6); position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 1; pointer-events: none; }
.list-a .item .text { color: #fff; font-size: 26px; line-height: 30px; font-weight: bold; display: inline-flex; padding: 0 20px; position: relative; z-index: 2; text-shadow: 0px 0px 10px rgba(255, 255, 255, 0.4); }
.list-a .item .icon { background: #e6411c url("../images/icons-01.svg") no-repeat -400px -50px; background-size: 1000px; display: inline-flex; width: 50px; height: 50px; border-radius: 50px; margin-bottom: 20px; position: relative; z-index: 2; }
.list-a .item:hover .icon { background-position: 0 -50px; }

/* ################################### SUPPORT ################################### */
.grid-list .grid-item { width: 33.33%; padding: 0 15px 30px; opacity: 0; transition: opacity 0.3s ease; }
.grid-list .grid-item.grid-item-enabled { opacity: 1; }
.grid-list .grid-item-content { background-color: #fff; box-shadow: 0 0 10px rgba(0, 0, 0, 0.2); top: 0; border-radius: 5px; transition: all 0.3s ease; }
.grid-list .grid-item-content:hover { top: -5px; box-shadow: 0 0 40px rgba(0, 0, 0, 0.5); }
.grid-list .grid-item a { display: block; position: relative; }
.grid-list .grid-item .top-icon { background: #1aace9 url("../images/icons-01.svg") no-repeat 0 0; background-size: 1200px; position: absolute; top: -30px; left: 50%; margin-left: -30px; width: 60px; height: 60px; border-radius: 60px; display: inline-block; }
.grid-list .grid-item .info { padding: 30px; display: block; }
.grid-list .grid-item .image { background-color: #1f4864; height: 214px; display: block; border-radius: 5px 5px 0 0; }
.grid-list .grid-item .noimage { display: block; height: 20px; }
.grid-list .grid-item .title { color: #1aace9; font-size: 20px; line-height: 23px; font-weight: bold; margin-bottom: 10px; display: block; }
.grid-list .grid-item .description { font-size: 14px; line-height: 17px; display: block; }
.grid-list .grid-item .knowmore { display: flex; align-items: center; border-top: solid 1px #ededed; height: 60px; padding: 0 30px; position: relative; border-radius: 0 0 5px 5px; transition: background-color 0.3s ease; }
.grid-list .grid-item .knowmore .text { color: #e6411c; font-weight: bold; white-space: nowrap; display: inline-flex; margin-right: 5px; }
.grid-list .grid-item .knowmore .line { display: inline-flex; width: 100%; height: 0; border-top: dotted 4px #a6a6a6; margin: 0 5px; }
.grid-list .grid-item .knowmore .icon { background: url("../images/icons-01.svg") no-repeat -6px -6px; background-size: 600px; display: inline-flex; width: 20px; height: 20px; flex-shrink: 0; }
.grid-list .grid-item .knowmore:hover { background-color: #e6411c; }
.grid-list .grid-item .knowmore:hover .text { color: #fff; }
.grid-list .grid-item .knowmore:hover .line { border-color: #fff; }
.grid-list .grid-item .knowmore:hover .icon { background-position: -6px -36px; }
.grid-list .grid-item[data-type="file"] .top-icon { background-position: -540px -60px; }
.grid-list .grid-item[data-type="video"] .top-icon { background-position: -600px -60px; }
.grid-list .grid-item[data-type="externalurl"] .top-icon { background-position: -660px -60px; }

/* ################################### QUALITY ################################### */
#quality-certificates h2 { position: relative; display: flex; align-items: center; justify-content: center; white-space: nowrap; margin-bottom: 60px; }

#quality-certificates h2:before, #quality-certificates h2:after { content: ""; display: inline-flex; width: 100px; height: 0; border-top: dotted 4px #1aace9; margin: 0 30px; }

.list-b { display: flex; flex-wrap: wrap; }
.list-b .item { background-color: #fff; display: flex; min-height: 290px; overflow: hidden; box-shadow: 0 0 20px rgba(0, 0, 0, 0.3); width: calc(50% - 20px); border-radius: 5px; margin: 10px; }
.list-b .item .left { background-color: #fff; width: 50%; flex-shrink: 0; background-size: contain; background-position: center 0; }
.list-b .item .right { width: 50%; display: flex; flex-direction: column; justify-content: space-between; }
.list-b .item .right .info { padding: 50px; }
.list-b .item .right .title { color: #1aace9; }
.list-b .item .right .description, .list-b .item .right .description * { color: #a6a6a6; }
.list-b .item .right .knowmore { display: flex; align-items: center; padding: 0 50px 50px; }
.list-b .item .right .knowmore .btn { padding: 0 5px 0 15px; height: 40px; }
.list-b .item .right .knowmore .btn .text { font-size: 14px; }

/* ################################### PRODUCTS ################################### */
body.products .general-section { margin-bottom: 80px; }

body.products footer { background-color: #fff; position: fixed; bottom: 0; left: 0; width: 100%; }

#products-presentation { padding-bottom: 0; }

#products-presentation .db-content p { webkit-column-break-inside: auto; page-break-inside: auto; break-inside: auto; }

#products-list { min-height: 600px; }

#products-list .top-container { display: flex; justify-content: space-between; border: solid 1px #ededed; margin-bottom: 50px; padding: 15px; border-radius: 50px; transition: box-shadow 0.3s ease; }
#products-list .top-container .box-label { white-space: nowrap; }
#products-list .top-container .box-search { margin-left: 10px; }
#products-list .top-container .box-reset { margin-left: 10px; }
#products-list .top-container .box-reset a { height: 30px; }

#products-list .top-container .left { display: flex; align-items: center; }

#products-list .top-container .left .box-label { margin-right: 5px; color: #a6a6a6; }

#products-list .top-container .left select { background-size: auto; border: solid 1px #e6411c; height: 30px; width: 280px; border-radius: 30px; color: #e6411c; font-size: 14px; }

#products-list .top-container .left option, #products-list .top-container .left optgroup[label] { color: #a6a6a6; font-weight: bold; }

#products-list .top-container .left optgroup[label] option { color: #404040; font-weight: normal; }

#products-list .top-container .right { color: #e6411c; display: flex; align-items: center; white-space: nowrap; margin-left: 30px; margin-right: 15px; }

#products-list .top-container #form-searchproduct { width: 250px; position: relative; width: 360px; }

#products-list .top-container #form-searchproduct .text { background-color: transparent; color: #1f4864; font-size: 12px; width: 100%; height: 30px; padding-right: 40px; border: solid 1px #a6a6a6; border-radius: 15px; transition: all 0.5s ease; }

#products-list .top-container #form-searchproduct.showresults .text { width: calc(100% - 30px); }

#products-list .top-container #form-searchproduct .text::placeholder { color: #a6a6a6; }

#products-list .top-container #form-searchproduct .submit { background: url("../images/icons-01.svg") no-repeat -59px 0; background-size: 300px; position: absolute; width: 15px; height: 15px; padding: 0; right: 10px; top: 8px; transition: right 0.3s ease; }

#products-list .top-container #form-searchproduct.showresults .submit { right: 40px; }

#products-list .top-container #form-searchproduct .reset { background: #a6a6a6 url("../images/reset.png") no-repeat center center; position: absolute; top: 5px; right: 0; width: 20px; height: 20px; border-radius: 30px; opacity: 0; pointer-events: none; transition: opacity 0.3s ease; }

#products-list .top-container #form-searchproduct .reset:hover { background-color: #e6411c; }

#products-list .top-container #form-searchproduct.showresults .reset { opacity: 1; pointer-events: all; }

#products-list .top-container #form-searchproduct .results { background-color: #fff; width: 100%; height: auto; border-radius: 5px; box-shadow: 0 0 20px rgba(0, 0, 0, 0.3); opacity: 0; overflow: hidden; visibility: hidden; position: absolute; transition: all 0.3s ease; }

#products-list .top-container #form-searchproduct.showresults .results { opacity: 1; visibility: visible; z-index: 4; }

#products-list .top-container #form-searchproduct.showresults .results a { display: flex; height: 50px; align-items: center; border-bottom: solid 1px #e1e1e1; transition: background-color 0.3s ease; }

#products-list .top-container #form-searchproduct .results a:hover { background-color: #ededed; }

#products-list .top-container #form-searchproduct .results a:last-child { border-bottom: none; }

#products-list .top-container #form-searchproduct .results a .image { width: 50px; height: 100%; border-right: solid 1px #e1e1e1; margin-right: 15px; }

#products-list .top-container #form-searchproduct .results a .info { padding-right: 15px; display: flex; flex-direction: column; }

#products-list .top-container #form-searchproduct .results a .info .name { color: #1aace9; font-weight: 700; font-size: 14px; line-height: 14px; transition: color 0.3s ease; }

#products-list .top-container #form-searchproduct .results a:hover .info .name { color: #e6411c; }

#products-list .top-container #form-searchproduct .results a .info .category { font-size: 10px; line-height: 14px; color: #a6a6a6; }

#products-list .top-container #form-searchproduct .results .moreresults { padding: 20px 25px; height: auto; position: relative; justify-content: space-between; transition: background-color 0.3s ease; }

#products-list .top-container #form-searchproduct .results .moreresults .text { border: none; height: auto; padding: 0; border-radius: 0; width: auto; font-size: 16px; font-weight: 700; color: #e6411c; }

#products-list .top-container #form-searchproduct .results .moreresults .total { background-color: #e6411c; border-radius: 20px; display: flex; justify-content: center; align-items: center; min-width: 20px; min-height: 20px; padding: 0 6px; font-size: 10px; font-weight: 700; color: #fff; margin-right: 20px; transition: background-color 0.3s ease, color 0.3s ease; }

#products-list .top-container #form-searchproduct .results .moreresults:before { background: url("../images/icons-01.svg") no-repeat 0 0; background-size: 400px; content: ""; width: 20px; height: 20px; position: absolute; right: 20px; }

#products-list .top-container #form-searchproduct .results .moreresults:hover { background-color: #e6411c; }

#products-list .top-container #form-searchproduct .results .moreresults:hover .text { color: #fff; }

#products-list .top-container #form-searchproduct .results .moreresults:hover .total { background-color: #fff; color: #e6411c; }

#products-list .top-container #form-searchproduct .results .moreresults:hover:before { background-position: 0 -20px; }

#products-list .top-container #form-searchproduct .results .noresults { padding: 20px; text-align: center; color: #a6a6a6; }

#products-list .grid-list .grid-item-content:hover { box-shadow: 0 0 10px rgba(0, 0, 0, 0.2); }

/* ################################### CONTACTS ################################### */
#contacts-form h2, #contacts-form h2 * { font-size: 30px; line-height: 33px; }

#form-contacts .top, #form-contacts .bot { display: flex; }
#form-contacts .top { margin-bottom: 30px; }
#form-contacts .top .left, #form-contacts .bot .left { width: 50%; padding-right: 15px; }
#form-contacts .top .right, #form-contacts .bot .right { width: 50%; padding-left: 15px; }
#form-contacts .top .box { position: relative; }
#form-contacts .top .box .label { background-color: #fff; position: absolute; top: -5px; left: 15px; font-size: 10px; line-height: 10px; white-space: nowrap; padding: 0 10px; pointer-events: none; display: flex; align-items: center; }
#form-contacts .top .box .label .mandatory { margin-left: 5px; }
#form-contacts .box:not(:last-child) { margin-bottom: 20px; }
#form-contacts .box input[type="text"], #form-contacts .box textarea { border-radius: 5px; border-color: #a6a6a6; }
#form-contacts .box .message { height: 260px; }
#form-contacts .bot .left * { color: #a6a6a6; font-size: 12px; line-height: 15px; }
#form-contacts .bot .right { display: flex; justify-content: flex-end; position: relative; }
#form-contacts .bot .right .submit { background: #fff url("../images/submit.png") no-repeat right center; color: #e6411c; height: 50px; display: inline-flex; align-items: center; padding-right: 40px; width: auto; border: solid 2px #e6411c; transition: background-color 0.3s ease; }
#form-contacts .bot .right .submit:hover { background: #e6411c url("../images/submit-white.png") no-repeat right center; color: #fff; }

#contacts-otherinfo { background: url("../images/prefooter.png") repeat-x center bottom; }
#contacts-otherinfo .wrapper { background-color: #fff; padding: 60px; border-radius: 5px; box-shadow: 0 0 20px rgba(64, 64, 64, 0.3); }
#contacts-otherinfo .contents { display: grid; grid-gap: 30px; grid-template-columns: repeat(2, 1fr); }
#contacts-otherinfo .contents .item .top { display: flex; align-items: center; position: relative; margin-bottom: 10px; }
#contacts-otherinfo .contents .item .top .icon { background: url("../images/icons-01.svg") no-repeat 0 0; background-size: 800px 800px; display: inline-flex; width: 40px; height: 40px; margin-right: 10px; flex-shrink: 0; }
#contacts-otherinfo .contents .item:nth-child(1) .top .icon { background-position: -240px -160px; }
#contacts-otherinfo .contents .item:nth-child(2) .top .icon { background-position: -280px -160px; }
#contacts-otherinfo .contents .item .top:after { content: ""; display: inline-flex; width: 100%; height: 0; border-top: dotted 4px #a6a6a6; }
#contacts-otherinfo .contents .item .bot { padding-left: 50px; }
#contacts-otherinfo .contents .item .bot, #contacts-otherinfo .contents .item .bot * { color: #404040; font-size: 20px; line-height: 26px; }
#contacts-otherinfo .contents .item .bot span { color: #1aace9; margin-right: 10px; line-height: 0px !important; }
#contacts-otherinfo .contents .item:nth-child(2) br { display: none; }

/* ################################### PRODUCTS ################################### */
#products-list .grid-item .image { position: relative; height: auto; box-shadow: 0 7px 7px -7px rgba(64, 64, 64, 0.5); }
#products-list .grid-item .image img { width: 100%; }
#products-list .grid-item .info { padding: 30px; }
#products-list .grid-item .info .title { font-size: 20px; line-height: 23px; }
#products-list .grid-item .info .description, #products-list .grid-item .info .description *, #products-list .grid-item .info .features, #products-list .grid-item .info .features * { font-size: 14px; line-height: 17px; }
#products-list .grid-item .info .description p:not(:last-child), #products-list .grid-item .info .features p:not(:last-child) { margin-bottom: 5px; }
#products-list .grid-item .info .features-content { padding-top: 20px; }
#products-list .grid-item .info .features-content .title { color: #1aace9; font-size: 14px; line-height: 17px; margin-bottom: 5px; }
