:root
{
        --MONET_STRUCTURE_CONTAINER_WIDTH:              98%;
        --MONET_STRUCTURE_CONTAINER_HEIGHT:             53%;
        --MONET_STRUCTURE_CONTAINED_ELEMENT_WIDTH:      90%;
        --MONET_STRUCTURE_HEADER_WIDTH:                 var(--MONET_STRUCTURE_CONTAINED_ELEMENT_WIDTH);  
        --MONET_STRUCTURE_BANNER_IMAGE_WIDTH:           var(--MONET_STRUCTURE_CONTAINED_ELEMENT_WIDTH); 
        --MONET_STRUCTURE_NAVIGATION_WIDTH:             var(--MONET_STRUCTURE_CONTAINED_ELEMENT_WIDTH); 
        --MONET_STRUCTURE_NAVIGATION_HEIGHT:            4.5rem;
        --MONET_STRUCTURE_CATEGORY_NAVIGATION_WIDTH:    var(--MONET_STRUCTURE_CONTAINED_ELEMENT_WIDTH); 
        --MONET_STRUCTURE_CONTENT_WIDTH:                var(--MONET_STRUCTURE_CONTAINED_ELEMENT_WIDTH); 
        --MONET_STRUCTURE_QUERY_LOOP_PATTERN_WIDTH:     var(--MONET_STRUCTURE_CONTAINED_ELEMENT_WIDTH); 
        --MONET_STRUCTURE_FOOTER_WIDTH:                 var(--MONET_STRUCTURE_CONTAINED_ELEMENT_WIDTH);  
        --MONET_STRUCTURE_FOOTER_HEIGHT:                7.5rem;  
        --MONET_STRUCTURE_MARGIN_VERTICAL:              3rem;
  
        --MONET_COLOR_DARK_BLUE_4E6189:                 #4E6189;
        --MONET_COLOR_GREEN_43867C:                     #53867C66;
        --MONET_COLOR_LIGHT_GREY_F2F2F2:                #F2F2F2;
        --MONET_COLOR_DARK_GREY_B3B4B7:                 #B3B4B7;

        --MONET_COLOR_WHITE_FFFFFF:                     #FFFFFF;
        --MONET_COLOR_BLACK_000000:                     #000000;
        --MONET_COLOR_PURPLE:                           #716168;
        --p:                                            var(--MONET_COLOR_PURPLE);

        --MONET_STYLE_FONT_FAMILY:                      helvetica, arial, sans-serif;
        --MONET_STYLE_ROOT_FONT_SIZE:                   10px;
        --MONET_STYLE_FONT_SIZE:                        10px;
        --MONET_STYLE_FONT_SIZE_NAVIGATION:             calc(var(--MONET_STYLE_FONT_SIZE) + .75rem); 
        
        position: relative;  
        font-size:62.5%;
} 

html:has(iframe) iframe html body { outline:11px solid red; }

/* HTML ELEMENTS */
/* height: 101%; */
html { overflow-y: scroll;  }

body   
{ 
                color:                  var(--MONET_COLOR_PURPLE);         
                background-color:       var(--MONET_COLOR_BLACK_000000);
                font-family:            var(--MONET_STYLE_FONT_FAMILY); 
                font-size:              1rem;              
}
a       {  color:var(--MONET_COLOR_PURPLE); text-decoration:none; }

/* BUY ME A COFFEE */
.MONET_TEMPLATE_PART_STRUCTURE_CONTAINER .MONET_TEMPLATE_PART_STRUCTURE_BUY_ME_A_COFFEE 
{ margin:0 auto; position:relative; right:0; }

/* WORDPRESS */
.wp-site-blocks                                 { background-color:var(--MONET_COLOR_BLACK_000000); margin:0; padding:0;  }
.wp-block-navigation__container:only-child      { flex-grow:0;}
.wp-block-post-excerpt__excerpt                 { margin:2rem auto; }
/* .wp-block-template-part                          { background-color:var(--MONET_COLOR_BLACK_000000); } */

/* STRUCTURE */
.MONET_TEMPLATE_PART_STRUCTURE_CONTAINER
{
        width:                  var(--MONET_STRUCTURE_CONTAINER_WIDTH);
        height:                 var(--MONET_STRUCTURE_CONTAINER_HEIGHT);
        background-color:       var(--MONET_COLOR_BLACK_000000);
        margin:                 0 auto; 
        margin-top:             .7rem;  
        font-size:              2.0rem;      
}

/* HEADER */
.MONET_TEMPLATE_PART_STRUCTURE_HEADER           
{ 
        margin:var(--MONET_STRUCTURE_MARGIN_VERTICAL) auto; 
        width:var(--MONET_STRUCTURE_HEADER_WIDTH);
}
.wp-block-site-logo  img                        { margin-top:.5rem; min-width:18rem;}

.MONET_TEMPLATE_PART_STRUCTURE_HEADER_CUSTOM_HTML_ENLARGE_LOGO img { width:auto; height:95vh; display:none; background-color:black;}
.MONET_TEMPLATE_PART_STRUCTURE_HEADER .wp-block-site-logo:hover ~ .MONET_TEMPLATE_PART_STRUCTURE_HEADER_CUSTOM_HTML_ENLARGE_LOGO img 
{ 
        display:block; 
        position:absolute;
        top:30px; 
        right:.75rem;  
        z-index:99;
        margin:0 auto;

}
/* .MONET_TEMPLATE_PART_STRUCTURE_HEADER .wp-block-site-logo:hover ~ .MONET_TEMPLATE_PART_STRUCTURE_HEADER_CUSTOM_HTML_ENLARGE_LOGO img:hover 
{ 
        display:block;         
        position:relative;
        bottom:30px; 
        right:.3rem; 
        z-index:99;
} */


/* FEATURED IMAGE IN ARTWORK POST TEMPLATE */
.MONET_TEMPLATE_PART_STRUCTURE_POST_ARTWORK_FEATURED_IMAGE                      { width:50%; margin:0 auto; }
.MONET_TEMPLATE_PART_STRUCTURE_POST_ARTWORK_FEATURED_IMAGE:hover                { width:90%; margin:0 auto; }

/* PORTFOLIO ITEM IFRAME */
#MONET_POST_PORTFOLIO_IFRAME                                                    { outline:0px outset silver; width:100%; height:50rem; }
#MONET_POST_PORTFOLIO_IFRAME html { outline:22px solid red;  }   

.MONET_TEMPLATE_PART_POST_SINGLE_POST_META_INFORMATION                          { border:0px inset red; }
.MONET_TEMPLATE_PART_POST_SINGLE_ITEM_FEATURED_IMAGE                            { border:0px inset red; }
/* FEATURED IMAGE IN QUERY LOOP */

/* PAGE */
.MONET_TEMPLATE_PART_STRUCTURE_PAGE_CONTENT_404  { width:var(--MONET_STRUCTURE_BANNER_IMAGE_WIDTH);  margin:var(--MONET_STRUCTURE_MARGIN_VERTICAL) auto; }

/* QUERY LOOP */
.MONET_TEMPLATE_PART_STRUCTURE_QUERY_LOOP_PATTERN figure:nth-of-type(1):hover ~ figure    { display:block; }
.MONET_TEMPLATE_PART_STRUCTURE_QUERY_LOOP_PATTERN figure:nth-of-type(2)                   
{ 
        outline:19px outset var(--p); 
        display:none;
        position:relative;
        left:-400px;
        bottom:15px; 
        width:70vw; 
        height:auto;
        z-index:1;
}
.MONET_TEMPLATE_PART_STRUCTURE_QUERY_LOOP_PATTERN nav                                           { margin-bottom:4rem; }
.MONET_TEMPLATE_PART_STRUCTURE_QUERY_LOOP_PATTERN figure:nth-of-type(2):hover                   { display:block; font-size:1.6rem; }
.MONET_TEMPLATE_PART_STRUCTURE_QUERY_LOOP_PATTERN p                                             { margin:1rem auto;  }

/* BANNER */
.MONET_TEMPLATE_PART_STRUCTURE_BANNER_IMAGE                                     { width:var(--MONET_STRUCTURE_BANNER_IMAGE_WIDTH);  margin:var(--MONET_STRUCTURE_MARGIN_VERTICAL) auto; }

/* NAVIGATION */
/* .MONET_TEMPLATE_PART_STRUCTURE_NAVIGATION *                                     { outline:0px solid red; } */
.MONET_TEMPLATE_PART_STRUCTURE_NAVIGATION                   
{ 
        width:                  var(--MONET_STRUCTURE_NAVIGATION_WIDTH); 
        height:                 var(--MONET_STRUCTURE_NAVIGATION_HEIGHT); 
        margin:                 var(--MONET_STRUCTURE_MARGIN_VERTICAL) auto;  
        color:                  var(--MONET_COLOR_LIGHT_GREY_F2F2F2); 
        font-size:              var(--MONET_STYLE_FONT_SIZE_NAVIGATION); 

}
.MONET_TEMPLATE_PART_STRUCTURE_NAVIGATION nav                                   { height:100%; }
.MONET_TEMPLATE_PART_STRUCTURE_NAVIGATION nav ul li:hover                       { background-color:var(--MONET_COLOR_GREEN_43867C); }
.MONET_TEMPLATE_PART_STRUCTURE_NAVIGATION nav ul                                { width:100%; height:100%; }
.MONET_TEMPLATE_PART_STRUCTURE_NAVIGATION nav ul li                             { width:32%; height:100%; }
.MONET_TEMPLATE_PART_STRUCTURE_NAVIGATION nav ul li a                           { width:100%; text-align:center; color:var(--MONET_COLOR_PURPLE);  }
.MONET_TEMPLATE_PART_STRUCTURE_NAVIGATION nav ul li a span                      { display:inline-block; margin:auto auto;  color:var(--MONET_COLOR_PURPLE); }

/* CATEGORY NAVIGATION */
.MONET_TEMPLATE_PART_STRUCTURE_CATEGORY_NAVIGATION                              
{ 
        width:var(--MONET_STRUCTURE_CATEGORY_NAVIGATION_WIDTH);
        margin:var(--MONET_STRUCTURE_MARGIN_VERTICAL) auto; 
}
.MONET_TEMPLATE_PART_STRUCTURE_CATEGORY_NAVIGATION > div div,
.MONET_TEMPLATE_PART_STRUCTURE_CATEGORY_NAVIGATION > div form   { width:50%; display:inline; }

.MONET_TEMPLATE_PART_STRUCTURE_CATEGORY_NAVIGATION select       { width:25rem; height:3.35rem; background-color:black; color:var(--p);}
.MONET_TEMPLATE_PART_STRUCTURE_CATEGORY_NAVIGATION input        { width:25rem; height:3.35rem; }

/* QUERY LOOP PATTERN */
.MONET_TEMPLATE_PART_STRUCTURE_QUERY_LOOP_PATTERN               { width:var(--MONET_STRUCTURE_QUERY_LOOP_PATTERN_WIDTH); }


/* CONTENT */
.MONET_TEMPLATE_PART_STRUCTURE_CONTENT                              { width:var(--MONET_STRUCTURE_CONTENT_WIDTH); }
.MONET_TEMPLATE_PART_STRUCTURE_CONTENT h2                           { margin-block-start:0; color:#4e6189; }
.MONET_TEMPLATE_PART_STRUCTURE_CONTENT figure                       { text-align:center;}
.MONET_TEMPLATE_PART_STRUCTURE_CONTENT form                         { margin-top:1rem; width:90% }
.MONET_TEMPLATE_PART_STRUCTURE_CONTENT p                            { margin:2.2rem;}
.MONET_TEMPLATE_PART_STRUCTURE_CONTENT p:last-of-type               { margin-bottom:0; padding-bottom:2rem;}

/* FOOTER */
.MONET_TEMPLATE_PART_STRUCTURE_FOOTER                               
{       
        text-align:center;
        width:var(--MONET_STRUCTURE_FOOTER_WIDTH); 
        height: var(--MONET_STRUCTURE_FOOTER_HEIGHT); 
        font-size:1.6rem;
}

.MONET_TEMPLATE_PART_STRUCTURE_FOOTER > div,
.MONET_TEMPLATE_PART_STRUCTURE_FOOTER > figure d{ margin:2rem; }

/* MEDIA QUERIES */
@media screen and (max-width: 475px)
{ 
        :root
        {
                --MONET_STYLE_FONT_SIZE_NAVIGATION:  
                calc(var(--MONET_STYLE_FONT_SIZE) + 1.0rem);                 
        }
        .MONET_TEMPLATE_PART_STRUCTURE_CONTENT .MONET_VIDEO video 
        { 
                outline: 0px solid red;
                width: 400px;
                height:400px;
                scale: 0.85;
                position: relative;
        } 
                
        .MONET_TEMPLATE_PART_STRUCTURE_NAVIGATION                                       { width:85vw; height:auto; margin-bottom:var(--MONET_STRUCTURE_MARGIN_VERTICAL); }
        .MONET_TEMPLATE_PART_STRUCTURE_NAVIGATION nav .wp-block-navigation.no-wrap      { --navigation-layout-wrap: wrap;} 
}
/*
@media screen and (max-width: 768px)
{
        :root 
        { 
                --MONET_STRUCTURE_CONTAINER_WIDTH:              100%;
                --MONET_STRUCTURE_CONTAINED_ELEMENT_WIDTH:      85%;  
        }

        #MONET_POST_PORTFOLIO_IFRAME   { outline:22px solid green; }
        
}
*/
/* @media screen and (min-width: 769px) and (max-width: 900px)
{
        :root 
        { 
                --MONET_STRUCTURE_CONTAINER_WIDTH:              75%;
                --MONET_STRUCTURE_CONTAINED_ELEMENT_WIDTH:      100%;  
        } 
}
*/
@media screen and (min-width: 1000px)
{
        :root 
        { 
                --MONET_STRUCTURE_CONTAINER_WIDTH:              50vw;
                --MONET_STRUCTURE_CONTAINED_ELEMENT_WIDTH:      90%;  
        }
} 




/*
.MONET_TEMPLATE_PART_STRUCTURE_HEADER div:nth-of-type(2)                        { background-color:var(--MONET_COLOR_BLACK_000000); z-index:2; }
.MONET_TEMPLATE_PART_STRUCTURE_HEADER div:nth-of-type(2) img                    { width:auto; height:80vh; display:none; background-color:black;}
.MONET_TEMPLATE_PART_STRUCTURE_HEADER .wp-block-site-logo:hover ~ div img 
{ 
        display:block; 
        position:relative;
        bottom:30px; 
        right:.3rem; 
        z-index:99;
        margin:0 auto;
}
.MONET_TEMPLATE_PART_STRUCTURE_HEADER div:nth-of-type(2) img:hover { display:block; 
        
        position:relative;
        bottom:30px; 
        right:.3rem; 
        z-index:99;
}
*/