/* parametric stylesheet APX v0.000  */





:root {
    

    
    --mainbak:#100c02;
    --marker: #e6e2d8 ; 
    --highlight:  #e6e2d8 ; 
    --maintext: #e6e2d8 ;    
    
    
    --white:  #e6e2d8 ; 
    
    
    
    
    
    
    --color1: #b59b0c ;    
    --color2: #225234 ;    
    --color3: #1c1501 ;   
    
     
    --b000: #000 ;   
    
    
    
    
}







/* base & text */






@font-face {
  font-family: 'ABCGaisyrGreek';
  src: url('fonts/ABCGaisyrGreek-Medium.woff2') format('woff2'),
       url('fonts/ABCGaisyrGreek-Medium.woff') format('woff');
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'ABCGaisyrGreek';
  src: url('fonts/ABCGaisyrGreek-MediumItalic.woff2') format('woff2'),
       url('fonts/ABCGaisyrGreek-MediumItalic.woff') format('woff');
  font-weight: 500;
  font-style: italic;
  font-display: swap;
}

@font-face {
  font-family: 'ABCROMCondensed';
  src: url('fonts/ABCROMCondensed-Heavy.woff2') format('woff2'),
       url('fonts/ABCROMCondensed-Heavy.woff') format('woff');
  font-weight: 900;
  font-style: normal;
  font-display: swap;
}






   


html {
    min-width: 320px;
}

        
	body {
        
        min-width:320px;
        
        font-family: 'ABCGaisyrGreek', sans-serif;
        
        /*
        
        
        font-weight: 100;
        
        FIX THIS
        font-size: 100%;
        font-size: 1.10vmax;
        
        
        
        */
            font-weight: 400;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
         text-rendering: geometricPrecision;
        
        
        
        
        font-size: 100%;
        
        
        letter-spacing: 0.00em;
        word-spacing: 0.0em;
        
        display: flex;
        min-height: 100vh;
        flex-direction: column;
        
        margin:0; padding:0;  
        
        background-color: var(--mainbak);  
        color: var(--maintext);

        
        


}



@media (min-width: 720px) {	
    
        
	body {
        
        

}
}




@media (min-width: 990px) {	
    
        
	body {
        
        

}
}








    .wrap {flex: 1;  min-width: 320px;}




	 a:link,  a:visited {text-decoration:none; color: var(--marker); transition: all 0.25s ease-in-out;   }
	 a:hover 			{text-decoration:none; color: var(--highlight);}






p {  }

h1 {  font-size: 2.0em;  line-height:normal;    letter-spacing:-0.010em;   font-synthesis: none;}
h1 a:link {}
h1 a:visited {}
h1 a:hover {}

h2 {font-size: 1.4em;   font-weight:normal;} 
h2 a:link { }
h2 a:visited { }
h2 a:hover { }

h3 {font-size: 1.4em;   font-weight:normal;} 
h3 a:link { }
h3 a:visited { }
h3 a:hover { }


h4 {}
h4 a:link {  }
h4 a:visited { }
h4 a:hover { }



.minitext { font-size: 0.76em;        letter-spacing: 0.15em;}
.minitext2 { font-size: 0.8em;        letter-spacing: 0.05em;}
.minitext3x { font-size: 1.0em;       }
.minitext3 { font-size: 1.0em;       }

@media (min-width: 720px) {	
    
    h1 {  font-size: 2.7em;  line-height:normal;    letter-spacing:-0.010em; }

  .minitext3x { font-size: 1.15em;       }
  .minitext3 { font-size: 1.15em;       }


    }



.ftw {color: var(--white);  } /* font color white */
.ftw a:link {color: var(--white);   }
.ftw a:visited {color: var(--white);   }
.ftw a:hover {color: var(--white);  }





/*
*/






.bigtfix.fixed {
  position: fixed;
  top: 2em;
  left: 0;
  width: 100%;
  z-index: 8;
}




.fit-box {
  width: 100%;
  box-sizing: border-box;
  text-align: center;
}

.fit-box-inner {
  display: inline-block;
  white-space: nowrap;
  font-family: 'ABCROMCondensed', sans-serif;
  font-weight: 800;
  line-height: 0.8;
}



.text-spacer {
  height: 0.8em; /* ίδιο με line-height */
}


  .bigtfix {  padding: 7em 1em 1em 1em ;  }


@media (min-width: 720px) {	

  .bigtfix {  padding: 8em 1em 0em 1em ;   }


    }

@media (min-width: 1200px) {	

  .bigtfix {   }


    }

@media (min-width: 1900px) {	

  .bigtfix {  padding: 8em 0em 0em 0em ; }


    }


















/* Modal background */


.tmspacer {margin-top: 0px;}




@media (min-width: 720px) {	


.tmspacer {margin-top: -75px;}
    
}




.modal {
  display: none;
  position: fixed;
  z-index: 9999;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0,0,0,1.0);
}

/* Modal content box — SCROLL FIX */
.modal-content {
  max-height: 100vh;     /* important */
  overflow-y: auto;      /* enables vertical scroll */
  box-sizing: border-box;
}

/* Close button */
.close {
  float: left; 
  font-weight: bold;
}

.close:hover {
  color: red;
}

.close img {
    width: 75px;
    height: auto;
    display: block; 
    pointer-events: all !important;
    padding: 15px 10px 10px 15px; 
    cursor: pointer;
    z-index: 3000;
}


.close,
.close * {
    pointer-events: all !important;
}

.close {
    position: relative;
    background: rgba(0,255,0,0.);
}

.close::after {
    display: none !important;
}






.modalxx ul,
.modalxx ul ul { 
  list-style: none;
  padding-left: 0;   
  margin: 0;        
}

.modalxx ul li {
  margin: 0.5em 0;   
  font-size: 1em;
  line-height: 1.25em;
}

.modalxx ul li.cat-parent {
  font-size: 1.2em;
  font-weight: bold;
  margin-left: 0;    
}






ul,
 ul ul { 
  list-style: none;
  padding-left: 0;   
  margin: 0;        
}

 ul li {
  margin: 0.5em 0;   
  font-size: 1em;
  line-height: 2.0em;
}

 ul li.cat-parent {
  font-size: 1.2em;
  font-weight: bold;
  margin-left: 0;    
}
















hr {
    border: none;
    height: 1px; 
    background: var(--color3) ;
    opacity: 0.66;
        
}








.bakside1 {    background-color:  var(--color2) ;  }

a:link .bakside1,
a:visited .bakside1 {
  color: var(--b000)  !important;
  text-decoration: none; transition: all 0.25s ease-in-out;  
}
a:hover .bakside1 {
    /*
  color:  var(--white)  !important;
  color: rgba(0,0,0,0.2)   !important;
  text-decoration: none;
    */
}



.bakside2 {    background-color:  var(--color1)    }


a:link .bakside2,
a:visited .bakside2 {
  color: var(--b000)  !important;
  text-decoration: none; transition: all 0.25s ease-in-out;  
}
a:hover .bakside2 {
    /*
  color:  var(--white)  !important;
  color: rgba(0,0,0,0.2)   !important;
  text-decoration: none;
    */
}

.bakside3 {    background-color:  var(--color3)    }


a:link .bakside3,
a:visited .bakside3 {
  color:  var(--white)  !important;
  text-decoration: none; transition: all 0.25s ease-in-out;  
}
a:hover .bakside3 {
    /*
  color:var(--color1)   !important;
    
rgba(255,255,255,0.2)
    
  color: rgba(255,255,255,0.2)   !important;
  text-decoration: none;
    */
}




.bakside3x {    background-color: var(--mainbak);    }


a:link .bakside3x,
a:visited .bakside3x {
  color:  var(--white)  !important;
  text-decoration: none; transition: all 0.25s ease-in-out;  
}
a:hover .bakside3x {
      background-color:  var(--maintext) ;
  color:var(--color1)   !important;
  text-decoration: none;
}







	 a:link,  a:visited {text-decoration:none; color: var(--marker); transition: all 0.25s ease-in-out;   }
	 a:hover 			{text-decoration:none; color: var(--highlight);}




/* SINGLE-----------------------*/



.blackspacer {padding-bottom: 50px;}

.leftfix {   position:relative; }


@media (min-width: 990px) {	
    
    
.blackspacer {padding-bottom: 230px;}

.leftfix {  position:fixed;  z-index:5}
 
}


.singlepostbak {
    background: var(--mainbak);
    color:var(--maintext);    
}


.singlepost {
    
    line-height:1.45em;  
     font-size: 1.38em;  
}

.singlepost h2 {
    
     font-size: 1.6em;  
    line-height:1.45em;  
}


.singlepost  img {
    display: block;
    margin: 6em auto 6em auto ; 
}


.instagram-media {
    margin: 6em auto !important;
}






@media (min-width: 720px) {.singlepost  img {  mix-blend-mode: screen;    } }





.wp-caption {width:100%; }
.wp-caption-text { margin: -3em 0px 4em 0px; font-style: italic; }



.singlepost a {    text-decoration:none; color: var(--marker); transition: all 0.25s ease-in-out;    }
.singlepost a:hover,
.singlepost a:focus { text-decoration:none; color: var(--highlight);    }


/*
@media (max-width: 720px) {	
    
    
    

.singlepostbak {
    background: #fff7e0;
    color:var(--mainbak);
    
}



.singlepost a {    text-decoration:none; color: var(--mainbak); transition: all 0.25s ease-in-out;    }
.singlepost a:hover,
.singlepost a:focus { text-decoration:underline; color: var(--highlight);    }

      
}

*/






.leftspacer {height:5vw; }


@media (min-width: 720px) {	
    
.leftspacer {height:100px; }
    
}





.outersinglex1 {
    
    color: var(--color3)  !important;
    background:  var(--color1) ;  
    height:auto; 
    z-index: 1;  
    position:relative;  
    top: 0; 
    left: 0;
}



 .outersinglex1 a:link,  .outersinglex1 a:visited {
  color: var(--color3)  !important;
    opacity: 1;
  text-decoration: none; transition: all 0.25s ease-in-out;  
}
 .outersinglex1 a:hover {
  color: var(--color3)  !important;
    opacity: 0.5;
  text-decoration: none;
}







.outersinglex2 {
    
   color: var(--color3)  !important;
    background:  var(--color2) ;  
    height:auto; 
    z-index: 1;  
    position:relative;  
    top: 0; 
    left: 0;
}



 .outersinglex2 a:link,  .outersinglex2 a:visited {
  color: var(--color3)  !important;
    opacity: 1;
  text-decoration: none; transition: all 0.25s ease-in-out;  
}
 .outersinglex2 a:hover {
  color: var(--color3)  !important;
    opacity: 0.5;
  text-decoration: none;
}









.outersinglex3 {
    
    color:  var(--white)  !important;
    background:  var(--color3) ;  
    height:auto; 
    z-index: 1;  
    position:relative;  
    top: 0; 
    left: 0; 
}



 .outersinglex3 a:link,  .outersinglex3 a:visited {
  color:  var(--white)  !important;
    opacity: 1;
  text-decoration: none; transition: all 0.25s ease-in-out;  
}

 .outersinglex3 a:hover {
  color: var(--white)  !important;
    opacity: 0.5;
  text-decoration: none;
}










.container {
  display: block;
  width: 100%;
}









@media (min-width: 990px) {	


.leftspacer {height:15vh}
    
.outersinglex1  , .outersinglex2 , .outersinglex3 {
    
    height: 100vh; 
    z-index: 1;  
    position: sticky;  
    top: 0; 
    left: 0; 
}

    
    

.container {
  display: flex;
  width: 100%;
}



}


















/* When the viewport is taller than it is wide (portrait ratio) */
@media (max-aspect-ratio: 8/3) {
    
      .fullvh {   min-height: 50vw;  }
      .fullvhx {  height: 50vw;  }
      .outer { height: 50vh; }
    
}


/* When the viewport is wider than it is tall (landscape ratio) */
@media (min-aspect-ratio: 4/3) {
    
    
    .fullvh {   min-height: 100vh;  }
    .fullvhx {   height: 100vh;  }
    .outer { height: 100vh;  }
    
}








/*        default
.outer {

    
    height: 100vh; 
    
}
*/

.outer h1 {
    font-size: 3.0em; 
    text-transform: uppercase;
    font-family: 'ABCROMCondensed', sans-serif;
    font-weight: 500 ; 
    line-height: 1.0em;
    letter-spacing: -0.020em;
    
    
    overflow-wrap: anywhere;
}

@media (min-width: 450px) {	

.outer h1 {
    font-size: 6.0em;
    padding: 0.0em;
}

  }




@media (min-width: 690px) {	

.outer h1 {
    font-size: 7.0em;
    padding: 0.0em;
}

  }




@media (min-width: 990px) {	

.outer h1 {
    font-size: 6.2em;
    padding: 0.0em;
}

  }




@media (min-width: 1890px) {	

.outer h1 {
    font-size: 9.6em;
    padding: 0.0em;
}

  }


.wrapper {
  display: flex;
  flex-direction: column;
  height: 100%;        /* fills the .outer */
}

.top, .middle, .bottom {
  display: flex;
  align-items: center;     /* vertical center inside each section */
  justify-content: center; /* horizontal center */
}

.top {
  height: 6em;   
}

.bottom {
  height: 4em;  
}

.middle {
  flex: 1;       
}



.middlex {
 
  align-items: center;     /* vertical center inside each section */
  justify-content: center; /* horizontal center */
}


.middlex {
  flex: 1;       
}
















/* header */

.left-box {
  position: absolute;  /* overlays other content */
  top: 0;              /* stick to top of page */
  z-index: 10;         /* forward of everything else */
  display: flex;
  align-items: center;
  justify-content: left;
  left: 0;
}



.right-box {
  position: absolute;  /* overlays other content */
  top: 10;      
  z-index: 0;         /* forward of everything else */
  display: flex;
  align-items: center;
  justify-content: right;
  padding-top: 0.35em;     
  font-family:Gotham, "Helvetica Neue", Helvetica, Arial, "sans-serif" ;  font-weight:100 ;
  font-size: 3em;
  right: 0;
}





















.halfhover1 {
  position: relative;
  overflow: hidden; /* makes sure overlay doesn’t spill out */
}

.halfhover1::after {
  content: '';
  position: absolute;
  top: 0; left: 0; right: 0; bottom: 0;
  background: rgba(181,155,12,0.0);
  transition: background 0.3s ease;
  z-index: 1;
}

.bighover:hover .halfhover1::after {
  background: rgba(65,125,87,0.00015);
}









.halfhover2 {
  position: relative;
  overflow: hidden; /* makes sure overlay doesn’t spill out */
}

.halfhover2::after {
  content: '';
  position: absolute;
  top: 0; left: 0; right: 0; bottom: 0;
  background: rgba(65,125,87,0.0);
  transition: background 0.3s ease;
  z-index: 1;
}

.bighover:hover .halfhover2::after {
  background: rgba(181,155,12,0.00015);
}









.halfhover3 {
  position: relative;
  overflow: hidden; /* makes sure overlay doesn’t spill out */
}

.halfhover3::after {
  content: '';
  position: absolute;
  top: 0; left: 0; right: 0; bottom: 0;
  background: rgba(181,155,12,0.0);
  transition: background 0.3s ease;
  z-index: 1;
}

.bighover:hover .halfhover3::after {
  background: rgba(181,155,12,0.00015);
}


























/* formatting */














/* formatting */

/*
*/

::-moz-selection {
    color:  var(--white); 
    background:  var(--color2);
}

::selection {
    color:  var(--white); 
    background:  var(--color2);
}





/* ============= scrollbar */


/* width */
::-webkit-scrollbar {
    width: 5px;
	background:  var(--mainbak);
}

/* Track */
::-webkit-scrollbar-track {
    background:  var(--mainbak); 
}

/* Handle */
::-webkit-scrollbar-thumb {
    background:  var(--marker); 
}

/* Handle on hover */
::-webkit-scrollbar-thumb:hover {
    background:  var(--highlight); 
}
	










/* search form styles */

.searchform  {  }

.searchform input {padding:2px; display: inline-block; font-size: 0.9em; margin-top: -3px;
    /*
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
   border-radius: 5px;
*/

}

.searchtext { border:none; border-bottom:  1px solid #aaa; width:75%; max-width: 200px; }
.searchbtn { border: 1px solid #aaa; width:23%; max-width: 100px; cursor: pointer; font-weight: bold;  color:#aaa; background:  var(--white);}
.searchbtn:hover {  color: var(--white);}






























.galleryboxsize {
    position: relative;
    overflow: hidden;
}

.bb-gallery-slideshow {
    width: 100%;
    height: 70vw;
}

.bb-gallery-slideshow img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: contain;
    opacity: 0;
    transition: opacity 1s ease; /* fade duration */
    background-color:  rgba(0,0,0,0);
}

.bb-gallery-slideshow img.active {
    opacity: 1;
}




@media (min-width: 990px) {	

.bb-gallery-slideshow {
    width: 100%;
    height: 35vw;
}



}







.bb-search {
    position: relative;
    width: 100%;
    text-align: center;
}

/* invisible left spacer for perfect centering */
.bb-search::before {
    content: "";
    position: absolute;
    left: 0.6em;
    top: 50%;
    transform: translateY(-50%);
    width: 25px;
    height: 25px;
}

/* INPUT */
.bb-search input[type="search"] {
    width: 100%;
    padding: 1em 0em 1em 0em; /* equal space left & right */
    background: transparent;
    border: none;
    border-bottom: 1px solid rgba(255,255,255,0); /* invisible initially */
    font: inherit;
    color: inherit;
    outline: none;
    text-align: center;
    transition: border-color 0.25s ease;
    cursor: pointer;
}

/* placeholder inherits style */
.bb-search input::placeholder {
    color: inherit;
    opacity: 1;
    text-align: center;
    transition: opacity 0.2s ease;
}

/* hide placeholder ONLY when typing */
.bb-search input:not(:placeholder-shown)::placeholder {
    opacity: 0;
}

/* search icon */
.bb-search-btn {
    position: absolute;
    right: 0.6em;
    top: 50%;
    transform: translateY(-50%);
    width: 25px;
    height: 25px;
    background: url('/wp-content/themes/apx/_images/search.svg') no-repeat center;
    background-size: contain;
    border: none;
    padding: 0;
    cursor: pointer;
    opacity: 0;
    transition: opacity 0.25s ease;
}

/* ACTIVE STATE */
.bb-search:focus-within input[type="search"] {
    border-bottom: 1px solid rgba(255,255,255,0.25);
    text-align: center;
    cursor: text;
}

.bb-search:focus-within .bb-search-btn {
    opacity: 0.8;
}





/* INPUT base color */
.bb-search input[type="search"] {
    color: var(--maintext);
    -webkit-text-fill-color: var(--maintext);
}

/* Prevent Chrome white autofill background */
.bb-search input[type="search"],
.bb-search input[type="search"]:focus,
.bb-search input[type="search"]:active {
    background: transparent !important;
    color: var(--maintext) !important;
    -webkit-text-fill-color: var(--maintext) !important;
    box-shadow: none !important;
}

/* Chrome autofill override */
.bb-search input:-webkit-autofill,
.bb-search input:-webkit-autofill:hover,
.bb-search input:-webkit-autofill:focus,
.bb-search input:-webkit-autofill:active {
    -webkit-text-fill-color: var(--maintext) !important;
    box-shadow: 0 0 0px 1000px transparent inset !important;
    transition: background-color 9999s ease-in-out 0s;
}















.mailchimp-subscribe {
pointer-events: auto;
position: relative;
z-index: 5;
}



.mailchimp-subscribe input[type="email"] {

    background: transparent;
    border: none;
    border-bottom: 1px solid transparent;

    text-align: center;
    color: var(--marker);

    outline: none;
    
    font-family: 'ABCGaisyrGreek', sans-serif;
    font-weight: 400;
    font-size: 100%;
}

/* placeholder */
.mailchimp-subscribe input::placeholder {
    color: var(--marker);
    opacity: 1;
}

/* hide placeholder on click */
.mailchimp-subscribe input:focus::placeholder {
    opacity: 0;
}

/* bottom border on click */
.mailchimp-subscribe input:focus {
    border-bottom: 1px solid var(--marker);
}

/* hide button */
.mailchimp-subscribe button {
    display: none;
}


.mailchimp-subscribe input[type="email"] {
    width: 300px;
    box-sizing: border-box;
}