/*@-webkit-viewport{width:device-width}*/
/*@-moz-viewport{width:device-width}*/
/*@-ms-viewport{width:device-width}*/
/*@-o-viewport{width:device-width}*/
/*@viewport{width:device-width}*/
root {
    --gray-color: #888;
}

* { margin:0; padding:0;  }
body { color:#666; font-family:Raleway, sans-serif; line-height:17px;margin-top:110px; }
a { text-decoration:none; }

.sliderImg { overflow:hidden; }
.sliderImgContainer { display:-webkit-inline-box; position:relative; width:100%; height:100%; }
.sliderImgContainer > div { height:100%; width:100%; background-repeat:no-repeat; background-size:cover; background-position:center; position:relative; }
.sliderContainer { overflow:hidden; padding:0; }
.sliderContainer > div { display:-webkit-inline-box; position:relative; margin:20px 40px 50px 40px; }
.sliderImg { position:relative; height:500px; background-repeat:no-repeat; background-size:cover; background-position:center; background: #bababa; }
.slidImgText { background:rgba(0,0,0,0.70); padding: 10px 30px; width: calc(100% - 60px); text-align:left; position: absolute; bottom:0; }
.slidImgText h1 { margin-top:0px; margin-bottom:0px; text-align: left; font-size:32px; }
.slidImgText h3 { color:#ddd; font-size: 20px; margin:0; font-weight: 400; line-height: 1.3em; }
.slidImgText p { color:white; text-align:left; font-size: 16px; font-weight: 400; line-height: 1.3em; }
.slidImgText a { background: #6e7bbc; padding: 5px 10px; margin-top: 10px !important; display: inline-block; text-align: center; font-size: 12px; color: #ffffff; }
.sliderImgLink { display:none; }
.sliderArrow { position:absolute; width:0; cursor:pointer; padding:25px; border:1px solid #fff; background-position:center; background-size:30px; background-color:rgba(255,255,255,0.70); background-repeat:no-repeat; }
.sliderArrow:hover { background-color:#fff; border:1px solid #6F7CBC; }
.sliderNextArrow { right:20px; background-image:url("../../images/icons/arrow-right.png"); }
.sliderBackArrow { left:20px; background-image:url("../../images/icons/arrow-left.png"); }
.sliderObject .sliderItemA, .sliderObject .sliderItemB, .sliderObject .sliderItemC, .sliderObject .sliderItemD { display:block; text-align:center; }
.sliderItemA { text-align:center; width:19vw; min-width:180px;}
.sliderItemA h3 { color:#777; margin:40px 0 20px 0; }
.sliderItemA img { max-width:100%; }
.sliderItemA a { color:#6F7CBC; }
.sliderItemA a:hover { text-decoration: underline; }

.sliderItemB { text-align:center; width:20vw; }
.sliderItemB .title { display:block; font-size:26px; line-height:30px; height:60px; font-weight:300; color: #6e7bbc; }
.sliderItemB b { display:block; font-size:26px; padding:15px 0; margin:15px 0; border-top:1px solid #aaa; border-bottom:1px solid #aaa; color:#555; font-weight:800; }
.sliderItemB .otherText { font-weight:bold; color:#ccc; font-size:18px; display:inline-block; }
.sliderItemB p { margin:30px 0; font-size:14px; line-height:20px; text-align:center; }
.sliderItemB img { max-width:100%; }
.sliderItemB a { text-align:center; display:block; color:#6F7CBC; margin-bottom:30px; }
.sliderItemB a:hover { text-decoration: underline; }

.sliderItemC { text-align:left; width:25vw; }
.sliderItemC h3 { color:#777; margin:40px 0 5px 0; }
.sliderItemC p { margin:30px 0; font-size:18px; line-height:25px; }
.sliderItemC a { display:block; color:#6F7CBC; margin-bottom:30px; }
.sliderItemC a:hover { text-decoration: underline; }

.sliderItemD h3 { color:#777; margin:40px 0 5px 0; }
.sliderItemD p { margin:30px 0; font-size:18px; line-height:25px; }
.sliderItemD a { display:block; color:#6F7CBC; margin-bottom:30px; }
.sliderItemD a:hover { text-decoration: underline; }

.MYSA_slider { margin-bottom:0px !important; }
#sliderApplicazioni { margin-bottom: 25px !important; }

/*****  PERSONAL CSS  *****/
/* BLUE:#6F7CBC */
footer { background-color:#000; color:#fff; font-size:15px; line-height:20px; padding-top:30px; }
footer table { width:calc(100% - 60px); margin:0 30px 50px 30px; text-align: center;}
footer table thead th:not(.tdEmpty) { border-bottom: 2px solid #999; padding-bottom: 10px; font-size: 20px; font-weight: 500; }
footer table td { vertical-align: top; }
footer table b { padding: 20px; display: inline-block; color: #616ead; font-size: 18px; }
footer table ul:not(#ulApplication) { border-top: 1px solid #444; }
footer table ul li { list-style-type: none; padding: 5px; border-bottom: 1px solid #444; color:#ddd; }
footer table ul li a { color:#fff !important; display: block; }
footer > #footerDescr { font-size: 12px; padding:30px; border-top:7px solid #5d5d5d; position:relative; }
footer > #footerDescr > b { font-size:16px; display:inline-block; }
footer > #footerDescr > a { color:#fff !important; }
footer > #footerDescr > #lnkCms { position: absolute; bottom:30px; right:40px; }
footer #lnkPrivacy, #lnkFornitura { font-size: 14px; font-weight: bold; }
footer #lnkPrivacy:hover, #lnkFornitura:hover { text-decoration: underline; }
footer .footerTitle { border-bottom: 2px solid #999; padding-bottom: 10px; font-size: 20px; font-weight: 400; display: block; margin-top:40px; }

#menuTop { margin-bottom:-3px; display:inline-block; position: fixed; z-index: 1010; width: 100%; top: 120px; left: 0; background: white; border-bottom: 1px solid #ddd; }
#menuTop #menuLiv1 { float:right; margin-right:30px; margin-top:9px; }
#menuTop #menuLiv1 > li { list-style-type:none; float:left; font-weight:bold; padding:5px 20px; border-left:1px solid #bbb; border-bottom:4px solid #fff; color:#555 !important; }
#menuTop #menuLiv1 > li:hover { border-bottom:4px solid #6F7CBC; cursor:pointer; }
#menuTop #menuLiv1 > li:hover > .submenu { display:flex; }
#menuTop #menuLiv1 > li:last-child { border-right:1px solid #bbb; }
#menuTop #menuLiv1 > li > a { color:#555 !important; }
#menuTop #menuLiv1 > li.active { border-bottom:4px solid #888; }
#menuTop #SecondaryMenuContent { background-color: white; border:1px solid #ddd; box-shadow: 0px 5px 15px -5px #999; }
#menuTop .SecondaryMenu { display:block; color:#6F7CBC; padding:13px 20px 12px 20px; font-weight:bold; border-bottom:1px solid #ddd; font-size:14px; }
#menuTop .SecondaryMenu:hover { background-color: #f1f1f1; }
#menuTop .SecondaryMenu.active { color:white; background-color: #6f7cbc; }
#menuTop .TertiaryMenu { background-color: white; border:1px solid #ddd; box-shadow: 0px 5px 15px -5px #999; max-height: calc(100vh - 250px); overflow-y: auto; }
#menuTop .TertiaryMenu a { display:block; color:#555; padding:10px; font-weight:400; border-bottom:1px solid #ddd; font-size:14px; }
#menuTop .TertiaryMenu a:hover { background-color: #f1f1f1; color:#6F7CBC; }
#menuTop .TertiaryMenu a:first-of-type { padding:13px 10px 12px; }
#menuTop .TertiaryMenu a:last-of-type { padding:13px 10px 12px; }
#imgMenuBurger { display:inline-block; background-image: url(../../images/menuBurger.png); background-size: contain; background-position: center; width: 40px; height: 40px; margin-right: 30px; margin-bottom: 10px; }
div.clickable { cursor:pointer; }

#fixedMenu > div { display: flex; width: 100%; background-color: white; position:absolute; left:0; box-shadow: 0 10px 20px -5px #aaa;}
#fixedMenu span { display:block; color:#6F7CBC; padding:0 15px 15px; font-weight:bold; font-size:16px; border-bottom:1px solid #aaa; }
#fixedMenu a {display: block; color: #555; padding: 10px; font-weight: 400; font-size: 14px; border-bottom: 1px solid #aaa; }
#fixedMenu a:hover { background-color: #f1f1f1; color:#6F7CBC; border-left: 1px solid #aaa; border-right: 1px solid #aaa; }

#ulMenuBurger { background: #fff; max-height: calc(100vh - 40px); overflow: auto; }
#ulMenuBurger > li:first-of-type { color:#777; padding: 15px 20px; display: block; text-align: center; }
#ulMenuBurger > li { border-bottom: 1px solid #ddd; text-align: center; }
#ulMenuBurger > li.active > a { background-color:#6F7CBC; color:#fff; }
#ulMenuBurger > li a { color:#777; padding: 15px 20px; display: block; text-align: center;  font-weight: bold; }
#SecondaryMenuBurgerContent { border:5px solid #6e7bbc; border-top:none; }
#SecondaryMenuBurgerContent li > a { color: #6e7bbc!important; font-weight: bold; }
#SecondaryMenuBurgerContent li { border-bottom:1px solid #ddd; }
#SecondaryMenuBurgerContent > li:last-of-type {border-bottom:none;}
#SecondaryMenuBurgerContent li a.active { background-color: #f1f1f1 }
#TertiaryMenuBurgerContent { background-color: white; margin:15px -10px -5px; border: 1px solid #ddd; border-bottom:none; }
#TertiaryMenuBurgerContent a { color:#777; font-weight: normal!important; border-bottom: 1px solid #ddd; }
#ulMenuBurger #liMenuSocial a { display: inline-block }

h1 { color:#6F7CBC; text-align:center; font-size:38px; line-height:1.5em; font-weight:400; margin:25px 0; }
h2 { text-align:center; padding:0 10%; font-size:20px; font-weight:bold; color:var(--gray-color); line-height:1.8em; }
h3 { color:#6F7CBC; font-size:22px; line-height:30px; font-weight:bold; margin:20px 0; }
p { color:#666; font-size:16px; line-height:25px; }

/* MYSA CUSTOM */
.titolo_piccolo { font-size: 36px; margin-top:40px; }
.titolo_piccolo small { font-size:24px;font-weight:bold; }
.bigDescr { text-align:center; padding:0 10%; font-size:16px; line-height:25px; color: #555; font-weight: 500; }
.bgGreyImg { background-color:#f2f2f2; margin:0 40px 40px; }

.bgGrey { background-color:#f2f2f2; margin:0 40px 40px; }
.bgGrey h3 { color:#6e7bbc; }
a.pulsantePagina { color: #6e7bbc; display: inline-block; border: 1px solid #6e7bbc; padding: 10px; margin-bottom: -1px; margin-right: -1px; text-align: center; width: calc(50% - 21px);}
a.pulsantePagina:last-of-type { margin-bottom: 40px; }
a.pulsantePagina:hover { cursor:pointer;color: #fff; background-color: #6e7bbc; }
.staffRuolo { border-top:1px dashed #ccc; padding-top: 15px; margin-top:-1px; }
.staffNome { border-bottom:1px dashed #ccc; padding-bottom: 20px!important; }

/* PRODUCT PAGE */
.hrGrey { border:none !important; height:10px; background-color:#bbb; }
#imgProdTop { height:40vh; width:100%; background-repeat:no-repeat; background-size:cover; background-position:center; }
#breadcrumb { padding:13px 10px; border-bottom:1px solid #ddd; color:var(--gray-color); position: fixed; top:161px; left: 0; width: calc(100% - 20px); background: white; z-index: 1000; }
.columnContainer { display:flex; padding:40px; }
.columnContainer .colExt { width:30vw; }
.columnContainer > #colIcons { text-align:center; }
.columnContainer > #colIcons img { max-height:100px; }
.columnContainer > #colCenter { width:70vw; margin:0 40px; margin-top: -30px; }
#prodDescr { text-align:left; }
#previewProd { outline:1px solid #ddd; outline-offset:5px; width:620px; height:620px; margin:0 40px; background-size:cover; margin:0 auto; }
#staticImg { height:625px; background-repeat:no-repeat; background-position:center; margin:0 auto; background-size:contain; }
#view360 { height:625px;text-align:center; }
#divBubble { border-top:1px solid #ddd; border-bottom:1px solid #ddd; text-align:center; padding:5px 0; margin:10px auto; width:630px; }
.bubble { display: inline-block; background-color: #ddd; border: 1px solid #666; border-radius: 3px; cursor: pointer; padding: 5px 15px; margin:0 1px; font-size: 15px; color: #666; }
.bubble.active { background-color:#6F7CBC; border-color:#6F7CBC; color:white; }
.imgArr { width:30px; cursor:pointer; }
#arrLeft { float:left; }
#arrRight { float:right; }
#recommendedContainer { text-align:center; }
#recommendedContainer div { display:inline-block; width:200px; }
#recommendedContainer div img { display:block; width:150px; margin:0 auto; }
.imgDivider { height:75px; border: 0px; background-image:url('/images/uploads/fascia_honeycomb-grigio-blu-starcell_h105.jpg'); background-repeat:no-repeat; background-size:cover; background-position:center; }
#technicalSheet { background-color:#eee; width:80vw; margin:0 auto; border:1px dashed #aaa; margin-bottom:50px; padding:10px 0; font-size:20px; line-height:35px; }
#technicalSheet .dataSheetField { border-bottom:1px solid #ddd; display:flex; }
#technicalSheet .dataSheetField:last-of-type { border-bottom:none; }
#technicalSheet div .etichetta { width:calc(30%); display:inline-block; padding:10px 20px; margin-right:-1px; border-right:1px solid #ddd; text-align:right; font-weight:bold; }
#technicalSheet div .value { width:70%; display:inline-block; padding:10px 20px; border-left:1px solid #ddd; }

@media screen and (min-width: 1100px) and (max-width: 1600px) {
    nav .submenu { width:80% !important; }
}

@media only screen and (max-width: 1450px) {
    h3 { font-size: 20px; }
    a.pulsantePagina { display: block; width: 350px; }
    .mysa_row p, .tblSection td p, #prodDescr, #prodDidascalia { font-size:14px !important; line-height: 20px;}
}

@media only screen and (max-width: 1430px) {
    .columnContainer { display:inline-block; }
    .columnContainer .colExt:first-of-type { width:calc(100vw - 100px); text-align: center; margin-bottom:100px;}
    .columnContainer > #colCenter { float:left; width:50vw; margin-bottom: 30px; margin-top: -50px; }
    .columnContainer .colExt:last-of-type { float:right; margin-bottom: 30px }
    /*.bgGrey p { font-size:20px !important; line-height: 20px;}*/
    #divBubble { margin-bottom:50px; }
    footer { font-size: 12px; }
    footer table b { font-size: 16px; }
    footer table thead { font-size: 18px; }
    #linkProductContainer { display: none; }
    #linkProductContainerBottom { display: flex; width: 90%; margin: 0 auto; text-align: center; padding-left: 10% }
    #linkProductContainerBottom a { width:40vw; margin:0 40px 30px; }
    #datasheet { width: 85% !important; }
    .mysa_row:not(.separatore) { min-height: 0px !important; }
}

@media only screen and (max-width: 1250px) {
    #linkProductContainerBottom { padding-left: 0%  }
    #datasheet { width: 95% !important; }
    footer .hiddenMobile { display: none !important; }
    footer #trApplicationMobile { display: table-row !important; }
}

@media only screen and (max-width:1130px) {
    #menuTop { display:none; }
    #breadcrumb { top:120px; }
}

@media only screen and (max-width: 1100px) {
    nav .submenu { width: 100% !important; }
    .sliderObject h3 { font-size: 20px; }
    .MYSA_slider { margin-top:20px; }
    .mysa_row { display: block !important; padding: 0 7%; }
    .mysa_row > div { padding: 0 !important; }
    .mysa_row > div:last-of-type img { padding: 0 0 70px 0 !important; }
    .mysa_row > div > img { margin: 0!important; }
    .bgGrey { display: flex !important; }
    .bgGreyImg { padding: 1px 7%;}
    .tblSection { display: block !important; padding: 0 7%; }
    .tblSection td { display: block !important; padding: 20px 0px 70px !important; width: 100% !important; }
    .tblSection td:first-of-type { padding-bottom: 30px !important; padding-top:75px !important; }
    .tblSection td img { width: 100% !important; }
    .bigDescr { padding: 0; margin-bottom:25px !important; }
    .titolo_piccolo { font-size: 36px !important; margin-bottom: 40px !important; line-height: 1.5em !important; padding: 0 20px; }
    .columnContainer > #colCenter { margin: 0 auto !important;  float:none; margin: 0 auto !important; width: 100%; }
    .columnContainer .colExt:last-of-type { float:none; margin-bottom: 30px; text-align: center; width: 100%; }
    .columnContainer .colExt:first-of-type { margin-bottom:0px;}
    #divBubble { width:auto !important; }
    a.pulsantePagina { display: inline-block; width: calc(50% - 21px); }
}

@media only screen and (max-width: 900px) {
    footer table td { display: block !important; width: 100% !important; padding:0 !important; }
    footer { font-size: 15px; }
    footer table b { font-size: 18px; }
    footer table thead { font-size: 20px; }
}

@media only screen and (max-width: 800px) {
    .titolo_piccolo small { font-size: 20px !important; }
}

@media only screen and (max-width: 770px) {
    #linkProductContainerBottom { display: block; width: 100%; margin-bottom: 20px; }
    #linkProductContainerBottom a { width: calc(100% - 140px); }
    .bgGrey h3 { font-size: 20px; }
    .tblSection td:first-of-type { padding-top:45px !important; }
    .tblSection td { padding: 20px 0px 40px !important; }
    .mysa_row:first-of-type h3 { margin-top:40px !important; }
    .mysa_row > div:last-of-type img { padding: 0 0 40px 0 !important; }
    a.pulsantePagina { display: block; width: 350px; }
}

@media only screen and (max-width: 760px) {
    #breadcrumb { font-size: 12px !important; }
    h1 { font-size: 30px; margin: 20px 0; }
    h2 { font-size: 16px !important; line-height: 1.4em !important; }
    .titolo_piccolo { font-size: 28px !important; margin-bottom: 40px !important; line-height: 1.5em !important; padding: 0 20px; }
    .titolo_piccolo small { font-size: 18px !important; }
    footer { font-size: 13px; }
    .slidImgText h1 { font-size: 32px; line-height: 30px; margin-bottom: 10px; }
    .slidImgText h3 { font-size: 18px; }
    #datasheet { font-size: 10px !important; }
    .trTitle { font-size:16px !important; }
    #colCenter { position: relative; height: 350px; }
    #colCenter #staticImg { display: block !important; position: absolute; top:0; left:-30px; height: 350px; width:calc(100% + 60px) }
    #colCenter #view360 { display: none !important; }
    #divBubble { display: none; }
    .columnContainer .colExt:last-of-type { margin-top:40px;}
    #prodDidascalia { font-size: 14px !important; line-height: 20px !important; }
    .tblSection td img { width: 100% !important; }
}