@charset "UTF-8";
/* nicolamatteomunari.com CSS Document */
/* 2023 © Nicola-Matteo Munari. All rights reserved */

/*GENERAL*/
body{cursor:default;/*display:none;*/overflow-x:hidden;margin:-1.5px 0 -1.5px 0;font:/*9.5px*/10px/12px "Helvetica"/*Arial*/,sans-serif;font-weight:bold;letter-spacing:.012em;text-rendering:optimizeLegibility;transition:background .4s;opacity: 0;transition:opacity .6s ease-in}
img{display:block;max-width:100%}
.hide1500{display:inherit}
.hide650{display:inherit}
.hide500{display:inherit}
.show1500{display:none}
.show750{display:none}
.show650{display:none}
.show500{display:none}

/*DARKMODE*/
.darkmode{background:#000;color:#FFF;-webkit-font-smoothing:antialiased;font-smoothing:antialiased}
.darkmode a:hover,.darkmode .selected{color:rgb(135,135,135)}
.darkmode a:active{color:rgb(90,90,90)}
.darkmode .nochange{color:inherit}
.darkmode .nochange:hover{color:inherit}
.darkmode #overlay{background:#000}
/*.darkmode .swiper-slide{background:#000}/*PRE turned off*/
.darkmode .swiper-button-prev{cursor:url(../svg/nmm-prev-w.svg), w-resize}
.darkmode .swiper-button-next{cursor:url(../svg/nmm-next-w.svg), w-resize}
.darkmode .lightbox{cursor:url("../svg/nmm-close-w.svg") 3 0, pointer;background:#000}
.darkmode .fullframe{color:#FFF}
.darkmode .phototitle{color:#FFF}

/*LINKS*/
a,a:visited{cursor:pointer;color:inherit;text-decoration:none;transition:color .4s}
a:hover,.selected{color:rgb(155,155,155);/*filter:hue-rotate(180)*/}
a:active{color:rgb(210,210,210)}
.nochange{color:inherit}
.nochange:hover{color:inherit}
/*FX use img instead of .negative for a global effect on all images*/
.negative{transition:all .4s}
a:hover .negative{-webkit-filter:invert(1);filter:invert(1)}

/*TYPOGRAPHY*/
.default{font:9.5px/12px "Arial",sans-serif;font-weight:bold;letter-spacing:.012em;text-transform:uppercase;/*transition:color .4s*/}
.default a{transition:color .2s/*FIND A BETTER SOLUTION*/}
.nolink{transition:color .4s}
.large{margin:0 10px;width:calc(100% - 20px);font:60px/60px 'Times New Roman',sans-serif;letter-spacing:.0025em;transition:all .4s}
.medium{margin:0 10px;width:calc(100% - 20px);font:30px/32px 'Times New Roman',sans-serif;letter-spacing:.005em;transition:color .4s}
.text{font:16px/18px 'Times New Roman',sans-serif;letter-spacing:.005em;transition:color .0s}
.seriestitle{float:left;margin:10px 30px 0 10px;width:calc(33.3333% - 33.5px);font:9.5px/12px "Arial",sans-serif;font-weight:bold;letter-spacing:.012em;text-transform:uppercase;transition:color .4s}
.serieslinks{float:left;margin:0 10px;width:calc(65.5% - 20px);font:30px/32px 'Times New Roman',sans-serif;letter-spacing:.005em}
p{text-indent:100px;margin:0}/*check if needed*/
.scaps{font-variant:small-caps}

/*HEADER*/
header{z-index:9998;position:fixed;margin:10px -10px;width:calc(100% + 20px);text-transform:uppercase}
#maintitle,#subtitle{float:left;margin:0 20px;width:calc(33.3333% - 40px)}
#subtitle{cursor:default;transition:color .4s/*PRE width:calc(41.6668% - 40px)*/}
#submenu,#mainmenu{float:left;margin:0 20px;width:calc(16.6666% - 40px)}
/*PRE #submenu{width:calc(8.3333% - 40px)}*/
#phonemenu{float:left;margin:0 20px;width:calc(11.1106% - 40px)}
#mainmenu,#phonemenu{text-align:right}
#phonemenu{display:none}
#switcher{float:right;width:64px;display:contents}

/*OVERLAY MENU*/
#overlay{z-index:9999;position:fixed;overflow-y:auto;overflow-x:hidden;top:0;left:0;margin:-2.5px 0;height:calc(100% + 2.5px);width:100%;visibility:hidden;opacity:0;background:#FFF;/*transition-property:transform;transition-duration:.4s;-webkit-overflow-scrolling:touch;transition:all .4s*/transition:all .4s}
#overlay.open{visibility:visible;opacity:1}
#overclose{position:fixed;top:8.5px;right:10px;font:9.5px/12px "Arial",sans-serif;font-weight:bold;letter-spacing:.012em;text-transform:uppercase}
#overmenu{margin:10px;width:calc(100% - 20px);font:40px/40px "Times New Roman",serif}
#overlay a{transition:color .25s}
#oversubmenu{margin:10px;width:calc(100% - 20px);text-transform:uppercase}

/*WRAPPERS*/
.mainwrapper{float:left}
.top10wrapper{float:left;margin-top:10px}
.shopwrapper{overflow:hidden;float:left;margin-top:calc(140px + 20px)/*;border:1px solid #000 activate to check margin-top*/}

/*DIVS*/
.fullwidth{width:100%}
.left-h{margin:10px;width:calc(50% - 30px);transition:all .4s}
.right-h{float:right;margin:10px;width:calc(50% - 30px);transition:all .4s}
.left-v{/*margin:10px 10px;width:calc(33.3333% - 23.5px)*/margin:10px;width:calc(33.3333% - 33.5px);transition:all .4s}
.right-v{/*margin:10px 0 0 0;float:right;width:calc(33.3333% - 23.5px)*/float:right;margin:10px;width:calc(33.3333% - 33.5px);transition:all .4s}
.dida{bottom:0;/*bottom is useless*/margin-top:calc(-2px + 2.5px);text-transform:uppercase;transition:color .4s}

/*FULLFRAME*/
.fullframe{position:relative;width:100%;height:calc(100vh + 1px);color:#000}
.horizontal{overflow:hidden;position:absolute;top:50%;left:50%;margin:0;width:calc(41.6665% /*PRE 50%!!!*/- 40px);transform:translate(-50%,-50%);transition:all .4s}
.vertical{overflow:hidden;position:absolute;top:50%;left:50%;margin:0;width:calc(33.3333% - 33.5px);transform:translate(-50%,-50%);transition:all .4s}
.caption{margin-top:calc(-2px + 2.5px);text-transform:uppercase}
.fraction{float:right;margin-top:-1px;font-weight:normal}

/*SWIPER*/
.swiper{position:relative;width:100%;height:100vh}
.swiper-wrapper{display:flex;position:relative;width:100%;height:100%}
.swiper-slide{overflow:hidden;display:flex;flex-shrink:0;justify-content:center;align-items:center;position:relative;width:100%;height:100%;/*background:#FFF/*PRE turned off*/;padding-top:6px/*to correct caption height*/}
.slide-horizontal{width:calc(50% - 30px);transition:all .4s}
.slide-vertical{width:calc(33.3333% - 33.5px);transition:all .4s}
.swiper-button-prev{cursor:url(../svg/nmm-prev-k.svg), w-resize;z-index:8999;position:absolute;top:0;left:0;width:50vw;height:100vh}
.swiper-button-next{cursor:url(../svg/nmm-next-k.svg), e-resize;z-index:8999;position:absolute;top:0;right:0;width:50vw;height:100vh}
@media (max-width:650px){.swiper-button-prev,.swiper-button-next{display:none}}

/*LIGHTBOX*/
.lightbox{cursor:url("../svg/nmm-close-k.svg") 3 0, pointer;display:none;position:fixed;z-index:9999;top:0;left:0;width:100%;height:100%;overflow:scroll/*default is visible*/;background:#FFF}
.lightbox img{width:100%/*default is auto*/}
.fadein{animation:opac .4s}
@keyframes opac{from{opacity:0}to{opacity:1}}
.fadeout{animation:show .4s;animation-fill-mode:forwards}
@keyframes show{0%{opacity:1}100%{opacity:0}}
/*.lightbox-photo{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);transition:all .4s}/*margin:0;width:100%;height:auto;/*max-width:calc(100% - 48px);max-height:calc(100% - 48px);*/
.lightbox-photo-h,.lightbox-photo-v{position:absolute;top:0%;left:0%}

/*PHOTO GRID*/
.photogrid{margin:0 -10px;width:calc(100% + 20px);height:auto}
.photobox{overflow:hidden;position:relative;float:left;margin:20px;width:calc(33.3333% - 40px);transition:all .4s}
.photo{width:100%;transition:all .35s ease}
.phototitle{position:absolute;height:100%;width:100%;transform:translate(0%,-51.5%);text-align:center;text-transform:uppercase;color:#000;transition:.35s ease-in;opacity:0}
.photobox:hover .photo{opacity:.15}/*OPTIONAL filter:invert(1)*/
.photobox:hover .phototitle{opacity:1}

/*PHOTO W/OUT DESCRIPTION*/
.headingbox{position:relative;float:left;margin:10px -10px;width:calc(100%)}
.heading{float:left;margin:0 20px;width:calc(16.6666% - 40px);text-transform:uppercase}
.payspaceshort{position:relative;float:left;margin:0 20px;width:calc(33.3333% - 40px)}
.paypreleft{position:relative;float:left;margin:0 20px;width:calc(33.3333% - 40px)/*default is 8.3333%-40px*/;text-transform:uppercase/*;text-align:right*/}
.paypreright{position:relative;float:left;margin:0 20px;width:calc(25% - 40px);text-transform:uppercase}
/*PHOTO W/ DESCRIPTION*/
.payspacelong{position:relative;float:left;margin:0 20px;width:calc(66.6666% - 40px);transition:all .4s}
.paywrap{float:left;width:100%}
.abstractbox{float:left;margin:0 30px 0 10px;width:calc(49.9999% - 40px);font:30px/32px 'Times New Roman',sans-serif;letter-spacing:.005em;transition:color .4s}
.abstract{max-width:1100px/*max 1150px • min 1050px*/}
.payspace{float:left;margin:0 30px 0 10px;width:calc(24.9993% - 27.5px - 75px - 40px)}
.payblockleft{position:relative;float:left;margin:0 30px 40px 10px;width:75px/*default is 4.1666%*/;line-height:13.5px;text-transform:uppercase}
.payblockright{position:relative;float:left;margin:0 10px 40px 10px;width:calc(11.6666% - 20px);min-width:168px;line-height:13.5px;text-transform:uppercase}
/*.related{display:inline-grid;vertical-align:bottom;margin:0 20px 30px 10px;width:calc(75.0001% - 30px);text-transform:uppercase;transition:color .4s}*/
.related{overflow:visible;position:relative;display:inline-grid;vertical-align:bottom;margin:0 20px 30px 10px;width:calc(75.0001% - 30px);text-transform:uppercase;line-height:6.5px;top:-3px}
.item{width:fit-content}
.item img{overflow:visible;position:absolute;max-width:350px;max-height:350px;transform:translate(0%,-100%);top:0%;left:0%;z-index:1/*-10*/;opacity:0;visibily:hidden;pointer-events:none}
.relatedphone{display:none;float:left;margin:10px;width:calc(100% - 20px);text-transform:uppercase;transition:all .4s}
.addinfo{display:inline-grid;margin:0 10px 30px 20px;width:auto/*calc(50% - 30px)*/;max-width:505px;font:16px/18px 'Times New Roman',sans-serif;letter-spacing:.005em;transition:color .4s}
.addinfo a{display:contents}

/*.heading,*/.payblock{float:left;margin:0 10px;width:calc(16.6666% - 20px);font:9.5px/12px "Arial",sans-serif;font-weight:bold;letter-spacing:.012em;text-transform:uppercase;transition:color .4s}
.payblock{margin-top:20px}
.ciao{width:100%;border:1px solid green}

/*FOOTER*/
footer{margin:0 -10px;width:calc(100% + 20px);text-transform:uppercase}
#footercopy{float:left;margin:10px 20px;width:calc(33.3333% - 40px)}
#footermail{float:left;margin:10px 20px;width:calc(33.3333% - 40px)}
#footercopy{cursor:default;transition:color .4s}
#footermenu{float:left;margin:10px 20px;width:calc(33.3333% - 40px)}
#footerlast{float:right}
#footerphone{overflow:hidden;display:none;float:left;margin:10px 20px;width:calc(100% - 40px)}

@media(max-width:2155px){
.large{font:52px/52px 'Times New Roman',sans-serif}
.medium{font:24px/26px 'Times New Roman',sans-serif}
.abstractbox{font:24px/26px 'Times New Roman',sans-serif}
.serieslinks{font:24px/26px 'Times New Roman',sans-serif}
#subtitle{width:calc(33.333% - 40px)}
#submenu{width:calc(16.6666% - 40px)}
.payspace{width:calc(16.6666% - 27.5px - 75px - 40px)}
.related{width:calc(66.6666% - 30px)}
#footermail{width:calc(33.3333% - 40px)}
#footermenu{width:calc(33.3333% - 40px)}
}

@media(max-width:1825px){
.large{font:48px/48px 'Times New Roman',sans-serif}
.lightbox-photo-h{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}
}

@media(max-width:1620px/*1575px*//*REDESIGN*/){
.hide1500{display:none}
.show1500{display:inline-block}
.horizontal{width:calc(49.9999% - 40px)}
.abstractbox{margin:0 30px 32px 10px;width:calc(100% - 20px)}
.abstract{max-width:100%}
.payspace{width:calc(66.6666% - 141px + 115px)}
.related{width:calc(49.9999% - 30px)}
}

@media(max-width:1550px){
.large{font:44px/44px 'Times New Roman',sans-serif}
}

@media(max-width:1230px/*1260px*/){
.related{width:calc(33.3333% - 35px)}
}

@media(max-width:1075px/*1090px*/){
#submenu{width:calc(22.221% - 40px)}
#mainmenu{display:none}
#phonemenu{display:inline}
.horizontal{width:calc(66.6666% - 40px)}
.vertical{width:calc(50% - 40px)}
.slide-horizontal{width:calc(66.6666% - 35px)}
.slide-vertical{width:calc(50% - 30px)}
.heading{width:calc(25% - 40px)}
.addinfo{width:calc(66.6666% - 30px)}
}

@media(max-width:1015px){
.lightbox-photo-v{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}
}

@media(max-width:950px){
.payspace{width:calc(50% - 20px)}
/*.addinfo{max-width:525px}*/
#footermail{width:calc(16.6666% - 40px)}
#footermenu{width:calc(49.9999% - 40px)}
}

@media(max-width:805px/*855px*/){
.large{font:40px/40px 'Times New Roman',sans-serif}
.horizontal{width:calc(74.9999% - 20px)}
.lightbox{overflow:visible}
.lightbox img{width:auto}
.lightbox-photo{max-width:calc(100% - 20px);max-height:calc(100% - 20px)}
.photobox{width:calc(50% - 40px)}
.left-v{width:calc(50% - 30px)}
.right-v{width:calc(50% - 30px)}
.slide-horizontal{width:calc(75% - 35px)}
.slide-vertical{width:calc(50% - 30px)}
.addinfo{margin:10px;width:calc(100% - 20px);max-width:405px}
.related{display:none}
.relatedphone{display:block;padding:15px 0 15px 0}
}

@media(max-width:650px/*INCREASE SPACE BELOW SHOP BUTTON*/){
.large{font:36px/36px 'Times New Roman',sans-serif}
.show650{display:inline-block}
.hide650{display:none}
.horizontal{width:calc(87.5% - 20px)}
.vertical{width:calc(75% - 20px)}
.heading{width:calc(33.3333% - 40px)}
.payspace{width:calc(31.25% - 20px)}
.payblockleft{margin:0 20px 0 10px;width:calc(16.6666% - 30px)}
.payblockright{margin:0 10px 0 20px;width:calc(33.3333% - 30px)}
.addinfo{margin-top:40px}
#footercopy,#footermail,#footermenu,#footerlast{display:none}
#footerphone{display:block}
}

@media(max-width:615px){
#subtitle{width:calc(50% - 40px)}
#submenu{display:none}
#phonemenu{width:calc(16.6666% - 40px)}
}

@media(max-width:576px){
.large{font:29px/30px 'Times New Roman',sans-serif}
.show750{display:block}
.photobox{width:calc(100% - 40px)}
.left-h{width:calc(75% - 20px)}
.right-h{width:calc(75% - 20px)}
.horizontal{width:calc(100% - 20px)}
.slide-horizontal{width:calc(100% - 20px)}
.slide-vertical{width:calc(75% - 20px)}
.payheading{width:calc(48% - 33.5px)}
.serieslinks{width:calc(100% - 20px);font:20px/22px 'Times New Roman',sans-serif}
}

@media(max-width:500px){
#maintitle{width:calc(50% - 40px)}
#subtitle{width:calc(33.3333% - 40px)}
}