*, *:after, *:before  {
         margin: 0  ;
         padding: 0  ;
         -webkit-box-sizing: border-box  ;
         -moz-box-sizing: border-box  ;
         box-sizing: border-box }
@font-face  {
         font-family: 'brock'  ;
         src: url('../FONTS/BrockScript.ttf') }
body  {
         overflow-wrap: break-word  ;
         overflow-x: hidden  ;
         background-color: #000  ;
         color: #ddd }
#M a , #N a  {
         outline: none }
/* desktop - text */ 
#Mtitle  {
         font-family: Times new roman  ;
         font-size: 24px }
.mMainLi a  {
         //font-family: 'Open Sans Condensed', sans-serif  ;
         font-family: 'Open Sans Condensed'  ;
         font-size: 24px }
.mSubUl li a  {
         //font-family: 'Open Sans Condensed', sans-serif  ;
         font-family: 'Open Sans Condensed'  ;
         font-size: 22px }
/* desktop */ 
*  {
         outline: none }
#M  {
         //display: none /* temp dev */  ;
         transition: all 1.0s 0.3s  ;
         position: fixed  ;
         z-index: 6  ;
         top: 0  ;
         right: 0  ;
         height: 60px  ;
         width: 100%  ;
         overflow: hidden  ;
         padding: 10px  ;
         color: rgb( 250,250,250 )  ;
         border-bottom: 3px solid  ;
         border-image: linear-gradient( 30deg , rgb( 160,140,110 )10% , rgb( 220,200,170 )50% , rgb( 160,140,110 )80% )  ;
         border-image-slice: 1  ;
         background: url( '../img/menu/stars.png' ) #000  ;
         background-position: 0px 60px  ;
         background-size: cover  ;
         background-repeat: no-repeat }
#M:hover  {
         background-position: 0px -60px  ;
         height: 300px }
#Mtitle  {
         display: none  ;
         float: left }
.mMainUl  {
         list-style-type: none }
.mMainLi  {
         float: right }
.mMainLi a  {
         color: rgb( 250,250,250 )  ;
         text-decoration: none  ;
         padding-right: 25px  ;
         padding-left: 5px  ;
         padding-bottom: 15px }
.mMainLi:hover .mSubUl  {
         opacity: 1.0  ;
         transform: rotateY( 0deg ) }
.mSubUl  {
         transition: all 0.8s 0.1s ease-in  ;
         position: absolute  ;
         margin-top: -5px  ;
         transform-origin: 50% 50%  ;
         transform: rotateY( 90deg )  ;
         opacity: 0.0  ;
         border-top: 1px solid #fff  ;
         list-style-type: none }
.mSubUl li  {
         clear: both }
.mSubUl li:hover a  {
         color: rgb( 220,180,130 ) }
.mSubUl li:before  {
         content: '⋅' }
#Mlogo  {
         padding-top: 40px }
#Mlogo img  {
         width: 300px }
.p  {
         margin-top: 20px  ;
         margin-bottom: 20px }
/* mobile - text */ 
.mainNodeTex  {
         font-family: 'Open Sans Condensed', sans-serif  ;
         font-size: 23px }
.singleNode a  {
         font-family: 'Open Sans Condensed', sans-serif  ;
         font-size: 23px }
.subNode a  {
         font-family: 'Open Sans Condensed', sans-serif  ;
         font-size: 20px }
#Nmenu  {
         font-family: 'Open Sans Condensed', sans-serif  ;
         font-size: 23px }
#Ntitle a  {
         //font-family: 'Open Sans Condensed', sans-serif  ;
         font-family: times new roman  ;
         font-size: 23px }
#Nclose  {
         //font-family: 'Open Sans Condensed', sans-serif  ;
         font-family: 'Tangerine'  ;
         font-size: 60px  ;
         font-weight: bold }
/* mobile */ 
#Ncon  {
         //display: none /* temp dev */  ;
         position: fixed  ;
         backface-visibility: hidden  ;
         z-index: 6  ;
         top: 0  ;
         right: 0  ;
         overflow: hidden  ;
         width: 100%  ;
         color: rgb( 250,250,250 ) }
#Ncon a  {
         text-decoration: none  ;
         color: rgb( 250,250,250 ) }
#Ncon a:hover  {
         color: rgb( 220,180,130 ) }
#N  {
         display: none  ;
         transition: all 1s 0s  ;
         height: auto  ;
         max-height: 60px  ;
         width: 100%  ;
         padding-top: 15px  ;
         padding-bottom: 40px  ;
         padding-left: 5px  ;
         border-bottom: 3px solid  ;
         border-image: linear-gradient( 30deg , rgb( 160,140,110 )10% , rgb( 220,200,170 )50% , rgb( 160,140,110 )80% )  ;
         border-image-slice: 1  ;
         background: url( '../img/menu/stars.png' ) #000  ;
         background-position: 0px 60px  ;
         background-size: 200%  ;
         background-repeat: no-repeat }
#Nuls  {
         margin-top: 50px  ;
         overflow-y: auto  ;
         clear: both  ;
         max-height: 80vh }
#Ntitle  {
         //display: none  ;
         float: right  ;
         padding-left: 3% }
#Ntitle #TEL  {
         width: 30px  ;
         background-color: #fff  ;
         margin-right: 10px }
#Ntitle #PIN  {
         margin-right: 10px  ;
         width: 29px  ;
         background-color: #000 }
#Nmenu  {
         transition: transform 1s 0s  ;
         float: right  ;
         padding-right: 3% }
#Nmenu img  {
         width: 100% }
#Nlogo  {
         transition: all 1s 0s  ;
         position: absolute  ;
         right: -10px  ;
         top: 80px  ;
         left: 40%  ;
         transform: rotateY( 90deg )  ;
         opacity: 0.0 }
#Nlogo img  {
         width: 100% }
#Nclose  {
         position: absolute  ;
         right: 0px  ;
         top: -5px  ;
         //margin-top: -70px  ;
         padding-left: 10px  ;
         padding-right: 10px  ;
         //transform: translate3d( 500px , 0px , 0px )  ;
         transform: translateX( 100px )  ;
         transition: all 0.8s 0.0s  ;
         text-align: right }
#Nclose img  {
         width: 32px  ;
         height: 32px }
#N:hover  {
         background-position: 0px -40px  ;
         max-height: 100vh }
#N:hover #Nlogo  {
         transform: rotateY( 0deg )  ;
         opacity: 1.0 }
#N:hover #Nmenu  {
         //transform: translate3d( 100px , 0px , 0px )  ;
         transform: rotateY( 90deg ) }
#N:hover + #Nclose  {
         //transform: translate3d( 0px , 0px , 0px )  ;
         transform: translateX( 0px ) }
.mainNode , .singleNode  {
         width: 70%  ;
         position: relative  ;
         z-index: 2  ;
         overflow: hidden }
.subNode  {
         transition: all 1s  ;
         position: relative  ;
         z-index: 3  ;
         height: 0px  ;
         font-size: 20px  ;
         padding-left: 20px }
.mainNodeTex:after  {
         transition: all 1s  ;
         content: ' ▾ ' }
.mainNode:focus .mainNodeTex:after  {
         content: ' ▵ '  ;
         // ▵ ▿ ⇑ ⇓ ▴ ▾ }
.mainNode:focus .subNode  {
         height: 30px }
.mainNode:focus  {
         outline: 0  ;
         pointer-events: none }
.mainNode:focus .subNode  {
         pointer-events: auto }
.subNode:before  {
         content: ' ⋅ ' }
@media all and (max-width: 900px)  {
         #M  {
                  display: none }
         #N  {
                  display: block }} 
#LOADING  {
         color: #fff  ;
         transition: transform 0.75s 0.25s ease-in-out , opacity 0.5s 0.5s ease-in-out  ;
         position: fixed  ;
         z-index: 11  ;
         top: 0  ;
         bottom: 0  ;
         left: 0  ;
         right: 0  ;
         display: flex  ;
         background-color: #000  ;
         perspective: 1000px }
#LOADING-TEX  {
         font-family: 'Open Sans Condensed', sans-serif  ;
         font-size: 33px  ;
         margin: auto  ;
         text-align: center  ;
         background-color: #000  ;
         width: 100%  ;
         animation: rot 3s linear infinite }
#LOADING-TEX  img  {
         width: 30% }
@keyframes rot  {
         0%  {
                  transform: rotateY( 0deg ) }
         100%  {
                  transform: rotateY( -360deg ) }}
@media all and (max-width: 700px)  {
         #LOADING-TEX  img  {
                  width: 80% }} 
/* text */ 
#BIGclose  {
         font-family: Monospace  ;
         font-size: 22px }
#LEFT , #RIGHT  {
         font-size: 27px }
#LEFTARR  {
         margin-right: 30px }
#RIGHTARR  {
         margin-left: 30px }
#CLOSEARR  {
         border: 1px solid #fff  ;
         border-radius: 40%  ;
         padding: 10px  ;
         font-weight: bold }
.swiper-container  {
         width: 100%  ;
         height: 100%  ;
         backface-visibility: hidden }
.swiper-wrapper  {
         /* width: 100% */  ;
         /* height: 100% */ }
.swiper-slide  {
         //border: 1px solid #666  ;
         //background-image: linear-gradient( 60deg , rgba( 0,0,0,0.5 )15% , rgba( 220,200,170,0.5 )50% , rgba( 200,180,150,0.5 )52% )  ;
         display: flex }
.swiper-slide img  {
         margin: auto  ;
         /* width: 100% */ }
.wide , .tall  {
         height: 100%  ;
         width: auto }
#BIGc  {
         //transition: transform 1s , opacity 0.5s ease-in-out  ;
         transition: all 0.7s ease-in-out  ;
         //transition: all 1s cubic-bezier( 0.25 , 0.1 , 0.25 , 1 )  ;
         //transform: translate3d( -100% , 0 , 0 )  ;
         transform: scale( 0 , 0 )  ;
         opacity: 0  ;
         position: fixed  ;
         backface-visibility: hidden  ;
         z-index: 1  ;
         top: 60px  ;
         left: 0px  ;
         right: 0px  ;
         bottom: 0px  ;
         background-color: #000  ;
         overflow: hidden }
#BIG  {
         background: url( 'imgs/stars.png' )  ;
         //border-bottom: 1px solid #666  ;
         height: 80%  ;
         width: 100%  ;
         background-color: #000 }
#BIGclose  {
         //position: absolute  ;
         //backface-visibility: hidden  ;
         //z-index: 1  ;
         transition: all 4s 0s  ;
         opacity: 0  ;
         width: 100%  ;
         margin-top: 2%  ;
         margin-bottom: 2%  ;
         text-align: center }
.arr  {
         outline: none  ;
         padding: 2%  ;
         border: 1px solid #000  ;
         background-color: #000  ;
         color: #fff  ;
         font-size: 25px }
.arr:hover  {
         border: 1px solid #aaa }
#WALL  {
         position: fixed  ;
         backface-visibility: hidden  ;
         top: 60px  ;
         left: 0px  ;
         right: 0px  ;
         height: 95vh  ;
         z-index: -1  ;
         font-size: 99px  ;
         display: flex  ;
         //opacity: 0.6  ;
         background: url( 'imgs/stars.png' ) }
#WALL img  {
         margin: auto  ;
         height: 100% }
#MAIN  {
         min-height: 150vh  ;
         margin-top: 70px  ;
         //padding: 5% }
#PROL  {
         font-family: 'brock'  ;
         font-size: 66px  ;
         color: #fff  ;
         text-align: center  ;
         padding: 4%  ;
         float: left }
#LEFT  {
         font-family: 'Open Sans Condensed', sans-serif  ;
         font-size: 27px  ;
         width: 50%  ;
         float: left }
#RIGHT  {
         font-family: 'Open Sans Condensed', sans-serif  ;
         font-size: 27px  ;
         width: 50%  ;
         float: right }
#GAL  {
         clear: both }
#GAL0 , #GAL1 , #GAL2  {
         padding-bottom: 9%  ;
         width: 33%  ;
         overflow: hidden  ;
         float: left }
.img  {
         position: relative  ;
         width: 100%  ;
         height: 100% }
.img img  {
         padding: 20px  ;
         width: 100% }
.imgafter  {
         position: absolute  ;
         top: 0  ;
         bottom: 0  ;
         left: 0  ;
         right: 0  ;
         backface-visibility: hidden  ;
         transition: all 0.3s  ;
         border: 1px solid rgba( 0,0,0,0 ) }
.imgafter:hover  {
         border: 1px solid rgb( 150,150,150 ) }
@media all and (max-width: 700px)  {
         #M  {
                  display: none }
         #N  {
                  display: block }
         #PROL  {
                  width: 100% }
         #BIGc  {
                  transition: all 0.6s cubic-bezier( 0.25 , 0.1 , 0.25 , 1 ) }
         #BIGclose  {
                  font-size: 18px }
         #LEFT , #RIGHT  {
                  font-size: 22px  ;
                  float: none  ;
                  width: 100% }
         #LEFT  {
                  padding-bottom: 0 }
         #RIGHT  {
                  padding-top: 0 }
         #GAL0 , #GAL1 , #GAL2  {
                  float: none  ;
                  width: 100% }}
@media screen and (orientation:portrait)  {
         .wide  {
                  height: auto  ;
                  width: 100% }
         .tall  {
                  height: 100%  ;
                  width: auto }
         #WALL img  {
                  width: 80%  ;
                  height: auto }}
#EPILOGUE  {
         clear: both }
a  {
         outline: none }
.fl  {
         display: flex  ;
         flex-wrap: wrap  ;
         justify-content: space-around }
.fl > div  {
         margin-top: 3%  ;
         margin-bottom: 3% }
.socmed  {
         width: 35px  ;
         margin: 10px }
.epos  {
         width: 30px  ;
         margin: 10px }
.epos1  {
         height: 20px  ;
         margin: 0px }
#EPILOGUE  {
         border-top: 1px solid #666  ;
         background-color: #000  ;
         color: #ccc  ;
         //padding-top: 1%  ;
         padding-bottom: 2%  ;
         transition: all 1s 0s  ;
         text-align: center  ;
         transform: translate3d( -3000px , 0px , 0px ) }
#EPILOGUE .tex  {
         font-family: 'Open Sans Condensed', sans-serif  ;
         font-size: 25px }
#EPILOGUE a  {
         transition: all 1s 0s  ;
         border-bottom: 1px solid #000 }
#EPILOGUE a:hover  {
         border-bottom: 1px solid #eee }
@media all and (max-width: 700px)  {
         #EPILOGUE  {
                  transform: translate3d( -1000px , 0px , 0px ) }
         #EPILOGUE .tex  {
                  font-size: 20px }}