﻿/*
	--------------------------
	Global Styles
	--------------------------
*/

/*#region  Custom Classes
-----------------------------  */
/*#region Loading Animation */

.ldng { margin: 0 auto; width: 20px; height: 20px; text-align: center; }
    .ldng.sml { width: 10px; height: 10px; }
    .ldng > div { background-color: #727d89; height: 100%; width: 3px; margin: 0 0 0 1px; float: left; border-radius: 2px; -moz-animation: wave 1.2s infinite ease-in-out; -o-animation: wave 1.2s infinite ease-in-out; -webkit-animation: wave 1.2s infinite ease-in-out; animation: wave 1.2s infinite ease-in-out; }

    .ldng div:nth-child(1) { -moz-animation-name: wave1; -o-animation-name: wave1; -webkit-animation-name: wave1; animation-name: wave1; }
    .ldng div:nth-child(2) { -moz-animation-name: wave2; -o-animation-name: wave2; -webkit-animation-name: wave2; animation-name: wave2; -moz-animation-delay: -1.1s; -o-animation-delay: -1.1s; -webkit-animation-delay: -1.1s; animation-delay: -1.1s; }
    .ldng div:nth-child(3) { margin-top: 0; -moz-animation-name: wave3; -o-animation-name: wave3; -webkit-animation-name: wave3; animation-name: wave3; -moz-animation-delay: -1.0s; -o-animation-delay: -1.0s; -webkit-animation-delay: -1.0s; animation-delay: -1.0s; }
    .ldng div:nth-child(4) { -moz-animation-name: wave4; -o-animation-name: wave4; -webkit-animation-name: wave4; animation-name: wave4; -moz-animation-delay: -0.9s; -o-animation-delay: -0.9s; -webkit-animation-delay: -0.9s; animation-delay: -0.9s; }
    .ldng div:nth-child(5) { -moz-animation-name: wave5; -o-animation-name: wave5; -webkit-animation-name: wave5; animation-name: wave5; -moz-animation-delay: -0.8s; -o-animation-delay: -0.8s; -webkit-animation-delay: -0.8s; animation-delay: -0.8s; }

@keyframes wave1 {
    0%, 50%, 100% { -moz-transform: scaleY(1.0); -ms-transform: scaleY(1.0); -o-transform: scaleY(1.0); -webkit-transform: scaleY(1.0); transform: scaleY(1.0); }
    5% { -moz-transform: scaleY(0.8); -ms-transform: scaleY(0.8); -o-transform: scaleY(0.8); -webkit-transform: scaleY(0.8); transform: scaleY(0.8); }
    20% { -moz-transform: scaleY(1.6); -ms-transform: scaleY(1.6); -o-transform: scaleY(1.6); -webkit-transform: scaleY(1.6); transform: scaleY(1.6); }
}

@keyframes wave2 {
    0%, 50%, 100% { -moz-transform: scaleY(1.0); -ms-transform: scaleY(1.0); -o-transform: scaleY(1.0); -webkit-transform: scaleY(1.0); transform: scaleY(1.0); }
    20% { -moz-transform: scaleY(1.6); -ms-transform: scaleY(1.6); -o-transform: scaleY(1.6); -webkit-transform: scaleY(1.6); transform: scaleY(1.6); }
}

@keyframes wave3 {
    0%, 50%, 100% { -moz-transform: scaleY(1.0); -ms-transform: scaleY(1.0); -o-transform: scaleY(1.0); -webkit-transform: scaleY(1.0); transform: scaleY(1.0); }
    20% { -moz-transform: scaleY(1.5); -ms-transform: scaleY(1.5); -o-transform: scaleY(1.5); -webkit-transform: scaleY(1.5); transform: scaleY(1.5); }
}

@keyframes wave4 {
    0%, 50%, 100% { -moz-transform: scaleY(1.0); -ms-transform: scaleY(1.0); -o-transform: scaleY(1.0); -webkit-transform: scaleY(1.0); transform: scaleY(1.0); }
    20% { -moz-transform: scaleY(1.35); -ms-transform: scaleY(1.35); -o-transform: scaleY(1.35); -webkit-transform: scaleY(1.35); transform: scaleY(1.35); }
}

@keyframes wave5 {
    0%, 50%, 100% { -moz-transform: scaleY(1.0); -ms-transform: scaleY(1.0); -o-transform: scaleY(1.0); -webkit-transform: scaleY(1.0); transform: scaleY(1.0); }
    20% { -moz-transform: scaleY(1.2); -ms-transform: scaleY(1.2); -o-transform: scaleY(1.2); -webkit-transform: scaleY(1.2); transform: scaleY(1.2); }
}

/*#endregion */

/*#region  Logo Animation 
    --------------------------  */

.lgan { display: block; position: relative; overflow: hidden; border-style: solid; border-width: 4px; z-index: 1; height: 60px; width: 60px; border-radius: 50%; margin-left: 1em; -moz-transform: scale(1.1); -ms-transform: scale(1.1); -o-transform: scale(1.1); -webkit-transform: scale(1.1); transform: scale(1.1); }
    .lgan.sml { width: 30px; height: 30px; opacity: 0.5; }
    .lgan.xsml { width: 20px; height: 20px; opacity: 0.5; }

    .lgan > span { display: block; width: 10%; background-color: #fff; position: absolute; bottom: 0; -moz-transform-origin: bottom; -ms-transform-origin: bottom; -o-transform-origin: bottom; -webkit-transform-origin: bottom; transform-origin: bottom; -moz-animation: size 2.5s infinite ease-in-out; -o-animation: size 2.5s infinite ease-in-out; -webkit-animation: size 2.5s infinite ease-in-out; animation: size 2.5s infinite ease-in-out; }
        .lgan > span:nth-child(1) { left: 15%; height: 60%; }
        .lgan > span:nth-child(2) { left: 30%; height: 85%; -moz-animation-delay: 0.2s; -o-animation-delay: 0.2s; -webkit-animation-delay: 0.2s; animation-delay: 0.2s; }
        .lgan > span:nth-child(3) { left: 45%; height: 75%; -moz-animation-delay: 0.4s; -o-animation-delay: 0.4s; -webkit-animation-delay: 0.4s; animation-delay: 0.4s; }
        .lgan > span:nth-child(4) { left: 60%; height: 65%; -moz-animation-delay: 0.55s; -o-animation-delay: 0.55s; -webkit-animation-delay: 0.55s; animation-delay: 0.55s; }
        .lgan > span:nth-child(5) { left: 75%; height: 65%; -moz-animation-delay: 0.65s; -o-animation-delay: 0.65s; -webkit-animation-delay: 0.65s; animation-delay: 0.65s; }

        .lgan > span:before { content: " "; display: block; background-color: #fff; position: absolute; left: 0; top: 0; width: 100%; height: 150%; z-index: -1; -moz-transform: skewY(-30deg); -ms-transform: skewY(-30deg); -o-transform: skewY(-30deg); -webkit-transform: skewY(-30deg); transform: skewY(-30deg); -moz-transform-origin: 0; -ms-transform-origin: 0; -o-transform-origin: 0; -webkit-transform-origin: 0; transform-origin: 0; }

@-moz-keyframes size {
    0%, 100% { -moz-transform: scaleY(1); -ms-transform: scaleY(1); -o-transform: scaleY(1); -webkit-transform: scaleY(1); transform: scaleY(1); }
    10% { -moz-transform: scaleY(1.1); -ms-transform: scaleY(1.1); -o-transform: scaleY(1.1); -webkit-transform: scaleY(1.1); transform: scaleY(1.1); }
    20% { -moz-transform: scaleY(0.5); -ms-transform: scaleY(0.5); -o-transform: scaleY(0.5); -webkit-transform: scaleY(0.5); transform: scaleY(0.5); }
    30% { -moz-transform: scaleY(1); -ms-transform: scaleY(1); -o-transform: scaleY(1); -webkit-transform: scaleY(1); transform: scaleY(1); }
}

@-webkit-keyframes size {
    0%, 100% { -moz-transform: scaleY(1); -ms-transform: scaleY(1); -o-transform: scaleY(1); -webkit-transform: scaleY(1); transform: scaleY(1); }
    10% { -moz-transform: scaleY(1.1); -ms-transform: scaleY(1.1); -o-transform: scaleY(1.1); -webkit-transform: scaleY(1.1); transform: scaleY(1.1); }
    20% { -moz-transform: scaleY(0.5); -ms-transform: scaleY(0.5); -o-transform: scaleY(0.5); -webkit-transform: scaleY(0.5); transform: scaleY(0.5); }
    30% { -moz-transform: scaleY(1); -ms-transform: scaleY(1); -o-transform: scaleY(1); -webkit-transform: scaleY(1); transform: scaleY(1); }
}

@keyframes size {
    0%, 100% { -moz-transform: scaleY(1); -ms-transform: scaleY(1); -o-transform: scaleY(1); -webkit-transform: scaleY(1); transform: scaleY(1); }
    10% { -moz-transform: scaleY(1.1); -ms-transform: scaleY(1.1); -o-transform: scaleY(1.1); -webkit-transform: scaleY(1.1); transform: scaleY(1.1); }
    20% { -moz-transform: scaleY(0.5); -ms-transform: scaleY(0.5); -o-transform: scaleY(0.5); -webkit-transform: scaleY(0.5); transform: scaleY(0.5); }
    30% { -moz-transform: scaleY(1); -ms-transform: scaleY(1); -o-transform: scaleY(1); -webkit-transform: scaleY(1); transform: scaleY(1); }
}

/*#endregion */

/*#endregion */

/*#region  Typography 
--------------------------  */

h1 { font-family: "acumin-pro",sans-serif; font-size: 1.75em; letter-spacing: -0.05em; margin: 0 0 1em 0; }
h2 { font-family: "acumin-pro",sans-serif; font-size: 1.25em; font-weight: 600; letter-spacing: -0.05em; }
h3 { font-family: "acumin-pro",sans-serif; font-weight: 600; letter-spacing: -0.05em; }

input, textarea, select { padding: 0.5em 0.75em; border-radius: 0.25em; font-family: "acumin-pro",sans-serif; font-weight: 300; }
button { border-radius: 0.25em; font-family: "acumin-pro",sans-serif; font-weight: 300; } 
main p a { border-bottom-style: solid; border-bottom-width: 1px; }

/*#endregion */

/*#region  body 
--------------------------  */

body { text-align: left; font-family: "acumin-pro",sans-serif; font-style: normal; font-weight: 300; font-size: 1em; line-height: 1.5em; width: 100%; padding: 0; margin: 0; min-width: 18.75em; letter-spacing: -0.05em; }

/*#endregion */

/*#region  Header 
--------------------------  */

    body > header { text-align: center; }
        body > header > span { font-family: "acumin-pro",sans-serif; font-size: 0.9em; font-weight: 700; }

/*#endregion */

/*#region  Main 
--------------------------  */

    body > main { top: 2.5em; }

/*#endregion */

/*#region  Footer 
--------------------------  */

footer { font-family: "acumin-pro",sans-serif; }

/*#endregion */

