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

	Holding CSS
	Designed & Handcrafted by The Pixel Parlour

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



/*------------------------------------------------------------------*/
/*	1.	CSS Resets
/*------------------------------------------------------------------*/

html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td { margin: 0; padding: 0; border: 0; outline: 0; font-size: 100%; vertical-align: baseline; background: transparent; }
body { line-height: 1.2; }
ol, ul { list-style: none; }
blockquote, q { quotes: none; }
blockquote:before, blockquote:after, q:before, q:after { content: ''; content: none; }
:focus { outline: 0; }
ins { text-decoration: none; }
del { text-decoration: line-through; }
table { border-collapse: collapse; border-spacing: 0; }

.clearfix:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; } .clearfix { display: inline-block; } /* Hide from IE Mac \*/ .clearfix { display: block; } /* End hide from IE Mac */ .none { display: none; } /* End Clearfix */

.hidden { display: none; }

.alignleft { float: left; }
.alignright { float: right; }
.aligncenter { margin-left: auto; margin-right: auto; display: block; clear: both; }

.clear { clear: both; display: block; font-size: 0; height: 0; line-height: 0; width:100%; }

section, article, header, footer, nav, aside, hgroup { display: block; }



/*------------------------------------------------------------------*/
/*	2.	Common Styles
/*------------------------------------------------------------------*/

/*--------------------------------------------------------------------
	
	font: Poppins
  font-family: 'Poppins', Helvetica, Arial, sans-serif;
  font-weight: 300 (light), 500 (medium), 600 (semibold);

  font: Lilita One
  font-family: 'Lilita One', Helvetica, Arial, sans-serif;
  font-weight: 400 (regular);
	
--------------------------------------------------------------------*/

/* Hide Text Whilst Fonts Load */
.wf-loading h1,
.wf-loading h2,
.wf-loading h3,
.wf-loading h4,
.wf-loading h5,
.wf-loading h6,
.wf-loading p,
.wf-loading ol li,
.wf-loading ul li { visibility: hidden; }

/* Show Text Once Fonts Loaded */
.wf-active h1,
.wf-active h2,
.wf-active h3,
.wf-active h4,
.wf-active h5,
.wf-active h6,
.wf-active p,
.wf-active ol li,
.wf-active ul li,
.wf-inactive h1,
.wf-inactive h2,
.wf-inactive h3,
.wf-inactive h4,
.wf-inactive h5,
.wf-inactive h6,
.wf-inactive p,
.wf-inactive ol li,
.wf-inactive ul li, { visibility: visible; }

.doc-loader { position: fixed; left: 0px; top: 0px; width: 100%; height: 100%; z-index: 1000; }
.doc-loader td { background-color: #FFF; text-align: center; vertical-align: middle; }

* { margin: 0; padding: 0; }
html { min-height: 100%; background-color: #1C268D; }
body { min-width: 320px; height: 100%; font-family: 'Poppins', Helvetica, Arial, sans-serif; font-weight: 300; color: #FFF; margin: 0; text-align: center; -webkit-text-size-adjust: none; }

@media screen and (min-width: 0px) and (max-width: 600px) {
body { font-size: 13px; }
}

img { width: auto; max-width: 100%; height: auto; vertical-align: bottom; }

h1, h2, h3, h4, h5, h6 { font-family: 'Lilita One', Helvetica, Arial, sans-serif; font-weight: 400; color: #FFF; margin: 0 0 20px 0; }
h1 { font-size: 2.5em; color: #FFDB42; }
h2 { font-size: 1.8em; }
h3 { font-size: 1.5em; }

p { max-width: 80%; font-size: 1.2em; margin: 30px auto 20px auto; opacity: 0.7; }

/* CSS Animation */
a,
.scrolldown,
.animatefast { 
transition: all 0.3s ease-out;
-webkit-transition: all 0.3s ease-out;
-moz-transition: all 0.3s ease-out;
-ms-transition: all 0.3s ease-out;
-o-transition: all 0.3s ease-out;
}

.animateslow { 
transition: all 0.6s ease-out;
-webkit-transition: all 0.6s ease-out;
-moz-transition: all 0.6s ease-out;
-ms-transition: all 0.6s ease-out;
-o-transition: all 0.6s ease-out;
}

.animatesuperslow { 
transition: all 0.8s ease-in-out;
-webkit-transition: all 0.8s ease-in-out;
-moz-transition: all 0.8s ease-in-out;
-ms-transition: all 0.8s ease-in-out;
-o-transition: all 0.8s ease-in-out;
}

a { color: #CB0044; text-decoration: none; }
a:hover { color: #E37222; }



/*------------------------------------------------------------------*/
/*	3.	Universal Elements
/*------------------------------------------------------------------*/

.holdingwrapper { margin: 0 auto; overflow: hidden; }
.holdingouter { position: relative; display: table; max-width: 580px; margin: 0 auto; z-index: 6; }
.holdingcontent { display: table-cell; vertical-align: middle; }
.holdingcontent.mobile { display: block; padding: 0 20px; }

.logo { width: 80%; max-width: 400px; margin: 40px auto; }
.logo span { display: none; }
.logo svg { fill: #FFF; }
.intro { margin: 0 0 40px 0; }

ul.social_links { font-size: 0; line-height: 0; }
ul.social_links li { display: inline-block; font-size: 12px; line-height: 44px; margin-left: 7px !important; margin-right: 7px !important; }
ul.social_links li span.text { display: none; }
ul.social_links li span.icon { }
ul.social_links li svg { fill: #000; vertical-align: top; }
ul.social_links li a { display: block; width: 44px; height: 24px; color: #FFF; padding: 10px 0; background-color: #FFDB42; border-radius: 50%; }
ul.social_links li a:hover { background-color: #FE0191; }

/*--- Social Links ---*/
/*
ul.social_links li span.icon svg circle,
ul.social_links li span.icon svg path,
ul.social_links li span.icon svg polygon { fill: #000; }
ul.social_links li a:hover span.icon svg circle,
ul.social_links li a:hover span.icon svg path,
ul.social_links li a:hover span.icon svg polygon { fill: #333; }


/* Parallax Background */
.holdingwrapper.has_parallax_bkgd { position: relative; }
.holdingwrapper .parallax_shape { position: absolute; margin: 40px 0 0 0; opacity: 0; }
.holdingwrapper .parallax_shape.loaded { margin: 0; opacity: 1; }
.holdingwrapper .parallax_shape svg { width: 100%; }


/*- 2025 Parallax Shapes: Content Blocks -*/
.left_shape_top {
  width: 293px;
  top: 10%;
  left: -5%;
  opacity: 1;
}
.left_shape_top svg { fill: #FFDB42; transform: rotate(10deg); }

.left_shape_bottom {
  width: 212px;
  top: 70%;
  left: -5%;
  opacity: 1;
}
.left_shape_bottom svg { fill: #FE0191 !important; transform: rotate(16deg); }

.right_shape_top {
  width: 263px;
  top: 5%;
  right: -5%;
  opacity: 1;
}
.right_shape_top svg { fill: #FF6700 !important; transform: rotate(-13deg); }

.right_shape_bottom {
  width: 293px;
  top: 80%;
  right: -5%;
  opacity: 1;
}
.right_shape_bottom svg { fill: #00FF00 !important; transform: rotate(10deg); }

/* Go 20% Smaller */
@media screen and (min-width: 0px) and (max-width: 960px) {
.left_shape_top { width: 234px; }
.left_shape_bottom { width: 170px; }
.right_shape_top { width: 210px; }
.right_shape_bottom { width: 234px; }
}

/* Go 40% Smaller & Push Out */
@media screen and (min-width: 0px) and (max-width: 768px) {
.left_shape_top { width: 176px; left: -8%; }
.left_shape_bottom { width: 127px; left: -8%; }
.right_shape_top { width: 158px; right: -8%; }
.right_shape_bottom { width: 176px; right: -8%; }
}

/* Go 60% Smaller & Push Out Further */
@media screen and (min-width: 0px) and (max-width: 480px) {
.left_shape_top { width: 117px; left: -11%; }
.left_shape_bottom { width: 85px; left: -11%; }
.right_shape_top { width: 105px; right: -11%; }
.right_shape_bottom { width: 117px; right: -11%; }
}

/* Opacity */
@media screen and (min-width: 0px) and (max-width: 660px) {
.parallax_shape { opacity: 0.8 !important; }
}

/* Credit */
.credit { position: fixed; right: 0; bottom: 0; font-size: 12px; color: rgba(255,255,255,0.5); padding: 10px 30px 10px 20px; background-color: #323C99; border-top-left-radius: 22px; z-index: 6; }
.credit a { color: #FFF; border-bottom: 1px solid transparent; }
.credit a:hover { border-bottom-color: rgba(255,255,255,0.3); }

@media screen and (min-width: 0px) and (max-width: 600px) {
.credit { position: relative; margin: 30px 0 -50px 0; border-radius: 0; }
}

@media screen and (min-height: 0px) and (max-height: 500px) {
.credit { position: relative; margin: 30px 0 -50px 0; border-radius: 0; }
}