/*!
Site name: GATE 44
Author: UMMON IT
Author URI: https://www.ummon.it
Description: Custom Coming Soon Page
Version: 1.0.0-rc.6
Requires PHP: 7.4
License: Reserved use

Normalizing styles have been helped along thanks to the fine work of
Nicolas Gallagher and Jonathan Neal https://necolas.github.io/normalize.css/
*/

/*--------------------------------------------------------------
>>> TABLE OF CONTENTS:
----------------------------------------------------------------
0.0 Root declarations
	0.1 Variables
1.0 Generic
	1.1 Normalize
	1.2 Box sizing
2.0 Base
	2.1 Typography
	2.2 Elements
	2.3 Links
3.0 Components
4.0 Media Queries

--------------------------------------------------------------*/

/*--------------------------------------------------------------
0.0 Root declarations
--------------------------------------------------------------*/

/* 0.1 Variables
--------------------------------------------- */

:root {
	/*Content area*/
	--mobbar_height: 0px;
	--wpab_height: 0px;/*Wordpress admin bar height*/
	--real-viewport: calc(100vh - var(--wpab_height) - var(--mobbar_height));

	/* Full RESPONSIVE TYPOGRAPHY */
	--fr-fsize-landscape: 1vw;
	--fr-fsize-portrait: 1.5vh;
	/* END Full RESPONSIVE TYPOGRAPHY */

	/*Paddings & Margins*/
	--roundpad: 1rem;

	/* Colours */
	--col-text: #373737;
	--col-dkgry: #373737;
	--col-mdgry: #757575;
	--col-ltgry: #e3e3e3;
	--col-link: #373737;

	/*Font sizes*/
	--rtext: 1rem;
}

/*--------------------------------------------------------------
1.0 Generic
--------------------------------------------------------------*/

/* 1.1 Normalize
--------------------------------------------- */

/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */

/* Document
	 ========================================================================== */

/**
 * 1. Correct the line height in all browsers.
 * 2. Prevent adjustments of font size after orientation changes in iOS.
 */
html {
	line-height: 1.15;
	-webkit-text-size-adjust: 100%;
}

/* Sections
	 ========================================================================== */

/**
 * Remove the margin in all browsers.
 */
body {
	margin: 0;
}

/**
 * Render the `main` element consistently in IE.
 */
main {
	display: block;
}

/**
 * Correct the font size and margin on `h1` elements within `section` and
 * `article` contexts in Chrome, Firefox, and Safari.
 */
h1 {
	font-size: 2em;
	margin: 0.67em 0;
}

/* Text-level semantics
	 ========================================================================== */

/**
 * Remove the gray background on active links in IE 10.
 */
a {
	background-color: transparent;
}


/* 1.2 Box sizing
--------------------------------------------- */

/* Inherit box-sizing to more easily change it's value on a component level.
@link http://css-tricks.com/inheriting-box-sizing-probably-slightly-better-best-practice/ */
*,
*::before,
*::after {
	box-sizing: inherit;
}

html {
	box-sizing: border-box;
}

/*--------------------------------------------------------------
2.0 Base
--------------------------------------------------------------*/

/* 2.1 Typography
--------------------------------------------- */

html {
	/* UMM Base font declaration */
	font-family: 'cormorant-garamond', serif;/*Main font*/
	font-weight: 400;/*Main font standard weight*/
	font-style: normal;
	font-size: var(--fr-fsize-landscape)/* FULL RESPONSIVE LAYOUT */
}

body {
	color: var(--col-text);
	font-size: var(--rtext);
}

h1 {
	clear: both;
}

h1, h2, strong, .bold {
	font-weight: 600;
}

/* 2.2 Elements
--------------------------------------------- */
body {
	display: flex;
	flex-direction: column;
	height: var(--real-viewport);
	width: 100%;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;	
}

h1, h2, h3 {
    margin: 0;
    font-weight: 400;
    text-transform: uppercase;
    font-size: var(--ltext);
    text-align: center;
}

h2 {
    margin: 2rem 0 1rem;
}

figure {
    padding: 0;
    margin: 0;
    line-height: 0;
    text-align: center;
}

ul {
    list-style: none;
    margin: 0;
    padding: 0;
    text-align: center;
}

main, figure {
    position: relative;
    z-index: 20;
}

li {
	margin-bottom: .5em;
}

li > a {
    text-decoration: none;
    font-size: var(--rtext);
}

/* 2.3 Links
--------------------------------------------- */
a {
	color: var(--col-link);
}

a:visited {
	color: var(--col-link);
}

a:hover,
a:focus,
a:active {
	color: var(--col-link);
}

a:focus {
	outline: thin dotted;
}

a:hover,
a:active {
	outline: 0;
}

/*--------------------------------------------------------------
# 3.0 Components
--------------------------------------------------------------*/

.clearfix:after {
    visibility: hidden;
    display: block;
    font-size: 0px;
    content: " ";
    clear: both;
    height: 0px;
}

#page {
    display: flex;
    flex-direction: column;
    flex-grow: 1;
    position: relative;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
    padding: var(--roundpad);
    height: 100%;
    align-items: center;
    justify-content: center;
}

.bgmask {
    background-color: rgba(255,255,255,.7);
    position: absolute;
    width: 100%;
    height: 100%;
    z-index: 1;
}

.logo {
    width: 20rem;
    height: auto;
    max-width: 90%;
}

.csoontxt {
    font-size: 2rem;
    margin: 1em 0;
    display: inline-block;
}



/*--------------------------------------------------------------
4.0 Media Queries
--------------------------------------------------------------*/

/* Portrait mode only */
/* FULL RESPONSIVE TYPOGRAPHY */
@media screen and ( orientation: portrait ) {

	:root {
		--rtext: 1.1rem;
		--ltext: 1.1rem;
	}

	html {
	    font-size: var(--fr-fsize-portrait);
	}


}

/* Portrait mode AND under 400px */
@media screen and ( max-width: 400px ) and (orientation: portrait) {


}