@charset "UTF-8";

@import url('../../fonts/fonts.css');

:root
{
	--color-green:                                  #66cc33;
	--color-gray:                                   #646567;
	--color-light-gray:                             #9c9e9f;
	--color-red:                                    #e2001a;
	--navigation-image-width:                       1830px;
	--navigation-image-height:                      2787px;
	--navigation-item-width:                        calc(var(--navigation-image-width) / 5);
	--navigation-item-height:                       calc(var(--navigation-image-height) / 3);
	--navigation-text-height:                       45px;
	--navigation-text-color:                        #cfe699;
	--navigation-text-background-color:             #621b44f0;
	--navigation-text-transparent-background-color: #621b44d0;
	--site-padding-x:                               3rem;
	--site-padding-y:                               2rem;
	--site-content-padding-x:                       2.5rem;
}

*
{
	margin:  0;
	padding: 0;
}

html
{
	font-family: 'Noto Sans', sans-serif;
	font-size:   10pt;
}

a
{
	color: var(--color-light-gray);
}

h1
{
	padding: var(--site-padding-y) var(--site-padding-x) 1.6rem var(--site-padding-x);
}

h1 a
{
	font-size:       2rem;
	color:           var(--color-green);
	text-decoration: none;
}

#navigation
{
	padding:  0 var(--site-padding-x);
	position: relative;
	width:    var(--navigation-image-width);
	height:   var(--navigation-item-height);
}

#navigation ul
{
	margin:     0;
	padding:    0;
	height:     var(--navigation-item-height);
	list-style: none;
}

#navigation ul li
{
	font-size:        1.5rem;
	background-image: url('../../images/navigation.jpg');
}

#navigation ul li,
#navigation ul li h2,
#navigation ul li a
{
	height: 100%;
}

#navigation ul li,
#navigation ul li h2,
#navigation ul li a,
#navigation ul li span
{
	display:     inline-block;
	width:       var(--navigation-item-width);
	line-height: 0;
}

[data-full-page-content='false'] #navigation ul li[data-is-active-navigation='false']
{
	background-position-y: calc(0 * var(--navigation-item-height) * -1);
}

[data-full-page-content='true'] #navigation ul li[data-is-active-navigation='false']
{
	background-position-y: calc(2 * var(--navigation-item-height) * -1);
}

[data-full-page-content='false'] #navigation ul li[data-is-active-navigation='false']:hover
{
	background-position-y: calc(1 * var(--navigation-item-height) * -1);
}

[data-full-page-content='false'] #navigation ul li[data-is-active-navigation='true']
{
	background-position-y: calc(2 * var(--navigation-item-height) * -1);
}

[data-full-page-content='false'] #navigation ul li[data-navigation-item='news']
{
	background-position-x: calc(0 * var(--navigation-item-width) * -1);
}

[data-full-page-content='true'] #navigation ul li[data-navigation-item='news']
{
	background-position-x: calc(0 * var(--navigation-item-width) * -1);
}

[data-full-page-content='false'] #navigation ul li[data-navigation-item='clients']
{
	background-position-x: calc(1 * var(--navigation-item-width) * -1);
}

[data-full-page-content='true'] #navigation ul li[data-navigation-item='clients']
{
	background-position-x: calc(1 * var(--navigation-item-width) * -1);
}

[data-full-page-content='false'] #navigation ul li[data-navigation-item='illustration']
{
	background-position-x: calc(2 * var(--navigation-item-width) * -1);
}

[data-full-page-content='true'] #navigation ul li[data-navigation-item='illustration']
{
	background-position-x: calc(2 * var(--navigation-item-width) * -1);
}

[data-full-page-content='false'] #navigation ul li[data-navigation-item='comic']
{
	background-position-x: calc(3 * var(--navigation-item-width) * -1);
}

[data-full-page-content='true'] #navigation ul li[data-navigation-item='comic']
{
	background-position-x: calc(3 * var(--navigation-item-width) * -1);
}

[data-full-page-content='false'] #navigation ul li[data-navigation-item='artist']
{
	background-position-x: calc(4 * var(--navigation-item-width) * -1);
}

[data-full-page-content='true'] #navigation ul li[data-navigation-item='artist']
{
	background-position-x: calc(4 * var(--navigation-item-width) * -1);
}

#navigation ul li span
{
	position:       absolute;
	width:          var(--navigation-item-width);
	height:         var(--navigation-text-height);
	line-height:    var(--navigation-text-height);
	text-align:     center;
	font-size:      1.9rem;
	font-weight:    bold;
	text-transform: uppercase;
}

[data-full-page-content='false'] #navigation ul li span
{
	margin-top:       39.5rem;
	color:            transparent;
	background-color: transparent;
}

[data-full-page-content='false'] #navigation ul li[data-is-active-navigation='false']:hover span,
[data-full-page-content='true'] #navigation ul li[data-is-active-navigation='false'] span
{
	color: var(--navigation-text-color);
}

[data-full-page-content='false'] #navigation ul li[data-is-active-navigation='false']:hover span,
[data-full-page-content='true'] #navigation ul li[data-is-active-navigation='false']:hover span
{
	background-color: var(--navigation-text-background-color);
}

[data-full-page-content='true'] #navigation ul li[data-is-active-navigation='false'] span
{
	background-color: var(--navigation-text-transparent-background-color);
}

#siteContent
{
	box-sizing: border-box;
	position:   relative;
	width:      var(--navigation-item-width);
	text-align: center;
}

[data-full-page-content='false'] #siteContent
{
	margin-top: calc(var(--navigation-item-height) * -1);
	height:     var(--navigation-item-height);
}

[data-full-page-content='true'] #siteContent
{
	margin-top: calc(var(--navigation-item-height) * -1 + var(--navigation-text-height));
	height:     calc(var(--navigation-item-height) - var(--navigation-text-height));
}

#siteContent[data-content-type='news']
{
	left: calc(0 * var(--navigation-item-width) + var(--site-padding-x));
}

#siteContent[data-content-type='clients']
{
	left: calc(1 * var(--navigation-item-width) + var(--site-padding-x));
}

#siteContent[data-content-type='illustration']
{
	left: calc(2 * var(--navigation-item-width) + var(--site-padding-x));
}

#siteContent[data-content-type='comic']
{
	left: calc(3 * var(--navigation-item-width) + var(--site-padding-x));
}

#siteContent[data-content-type='artist']
{
	left: calc(4 * var(--navigation-item-width) + var(--site-padding-x));
}

#siteContent[data-content-type='imprint']
{
	left:  calc(0 * var(--navigation-item-width) + var(--site-padding-x));
	width: calc(5 * var(--navigation-item-width));
}

#siteContent a
{
	color:           var(--color-gray);
	text-decoration: none;
}

#siteContent h2
{
	padding:        0 var(--site-content-padding-x);
	height:         calc(var(--navigation-text-height) + 10px);
	line-height:    calc(var(--navigation-text-height) + 10px);
	font-size:      1.6rem;
	text-transform: uppercase;
	color:          var(--navigation-text-background-color);
}

#siteContent .contentWrapper
{
	padding:    0 var(--site-content-padding-x);
	overflow-y: auto;
}

[data-full-page-content='false'] #siteContent .contentWrapper
{
	height: calc(var(--navigation-item-height) - (var(--navigation-text-height) + 10px));
}

[data-full-page-content='true'] #siteContent .contentWrapper
{
	height: calc(var(--navigation-item-height) - var(--navigation-text-height) - (var(--navigation-text-height) + 10px));
}

#siteContent .contentWrapper .content {
	margin-bottom: 1.3rem;
}

#siteContent .contentWrapper .content[data-type='title'] [data-property='title']
{
	margin-top:    1.1rem;
	margin-bottom: 0;
	font-size:     1.16rem;
}

#siteContent .contentWrapper .content[data-type='content'] [data-property='content']
{
	margin-top:  0.3rem;
	line-height: 1.5rem;
}

#siteContent .contentWrapper .content[data-type='titled-content'] [data-property='title']
{
	margin-top:    1.1rem;
	margin-bottom: 0;
	font-size:     1.16rem;
}

#siteContent .contentWrapper .content[data-type='titled-content'] [data-property='content']
{
	margin-top:  0.3rem;
	line-height: 1.5rem;
}

#siteContent .contentWrapper .content[data-type='hyperlink'] [data-property='uri']
{
	font-weight: bold;
}

#siteContent .contentWrapper .content[data-type='pdf'] [data-property='uri']
{
	font-weight: bold;
}

#siteContent .contentWrapper .content[data-type='pdf'] [data-property='uri'] .fas
{
	margin-right: 0.3rem;
}

#siteContent .contentWrapper .content[data-type='image'] [data-property='thumbnailUri']
{
	width: 100%;
}

#footer
{
	padding: 0 var(--site-padding-x) var(--site-padding-y) var(--site-padding-x);
	width:   var(--navigation-image-width);
	color:   var(--color-light-gray);
}

#footer [data-type='content']:nth-child( 1 )
{
	margin-top: 1.8rem;
}

#footer [data-type='content']:nth-child( 1 ) strong
{
	color: var(--color-green);
}

#footer [data-type='content']:nth-child( 2 )
{
	margin-top: 1.3rem;
}