/* 
	Table of Contents

	     01. Animations -------------------------------
	I.   Generic --------------------------------------
	     01. Reset ------------------------------------
	     02. Base -------------------------------------
	         Desktop ----------------------------------
	         Mobile -----------------------------------
	     03. Fonts ------------------------------------
	     04. Helpers ----------------------------------
	         Clear ------------------------------------
	         Notext -----------------------------------
	         Hidden -----------------------------------
	         Alignleft --------------------------------
	         Alignright -------------------------------
	         Disabled ---------------------------------
	         Grid -------------------------------------
	         Links ------------------------------------
	         Responsive Helpers -----------------------
	II.  Regions --------------------------------------
	     01. Container --------------------------------
	     02. Content ----------------------------------
	     03. Footer -----------------------------------
	         Desktop ----------------------------------
	         Mobile -----------------------------------
	     04. Header -----------------------------------
	         Desktop ----------------------------------
	         Mobile -----------------------------------
	     05. Main -------------------------------------
	     06. Shell ------------------------------------
	     07. Sidebar ----------------------------------
	     08. Wrapper ----------------------------------
	         Mobile -----------------------------------
	III. Modules --------------------------------------
	     01. Button -----------------------------------
	         Btn Blue ---------------------------------
	         Button Block -----------------------------
	         Desktop ----------------------------------
	     02. Form Elements ----------------------------
	     03. Form -------------------------------------
	     04. Fullsize Image ---------------------------
	     05. Intro ------------------------------------
	         Desktop ----------------------------------
	         Tablet -----------------------------------
	         Mobile -----------------------------------
	     06. List -------------------------------------
	     07. List Features ----------------------------
	         Desktop ----------------------------------
	         Tablet Portrait --------------------------
	         Mobile -----------------------------------
	     08. Logo -------------------------------------
	     09. Nav --------------------------------------
	     10. Section ----------------------------------
	     11. Slider -----------------------------------
	     12. Table ------------------------------------
	     13. Widget -----------------------------------
 */

/* ------------------------------------------------------------ *\
	Animations
\* ------------------------------------------------------------ */

@-webkit-keyframes rotate-color-blue {
	0%   { color: #00a4d2; -webkit-transform: translateY(-900px); transform: translateY(-900px); }
	25% { -webkit-transform: translateY(-700px); transform: translateY(-700px); }
	50%  { -webkit-transform: translateY(-400px); transform: translateY(-400px); }
	65% { color: #00a4d2; -webkit-transform: translateY(-200px); transform: translateY(-200px); }
	75% { color: #00a4d2; }
	90% { color: #04e2fd; -webkit-transform: translateY(0); transform: translateY(0); }
	100% { color: #00a4d2; -webkit-transform: translateY(0); transform: translateY(0); }
}

@keyframes rotate-color-blue {
	0%   { color: #00a4d2; -webkit-transform: translateY(-900px); transform: translateY(-900px); }
	25% { -webkit-transform: translateY(-700px); transform: translateY(-700px); }
	50%  { -webkit-transform: translateY(-400px); transform: translateY(-400px); }
	65% { color: #00a4d2; -webkit-transform: translateY(-200px); transform: translateY(-200px); }
	75% { color: #00a4d2; }
	90% { color: #04e2fd; -webkit-transform: translateY(0); transform: translateY(0); }
	100% { color: #00a4d2; -webkit-transform: translateY(0); transform: translateY(0); }
}

@-webkit-keyframes rotate-color-grey {
	0%   { color: #9b9b9b; -webkit-transform: translateY(-1000px); transform: translateY(-1000px); }
	25% { -webkit-transform: translateY(-900px); transform: translateY(-900px); }
	50%  { -webkit-transform: translateY(-600px); transform: translateY(-600px); }
	65% { color: #9b9b9b; -webkit-transform: translateY(-400px); transform: translateY(-400px); }
	80% { color: #9b9b9b; }
	90% { color: #fefefe; -webkit-transform: translateY(0); transform: translateY(0); }
	100% { color: #9b9b9b; -webkit-transform: translateY(0); transform: translateY(0); }
}

@keyframes rotate-color-grey {
	0%   { color: #9b9b9b; -webkit-transform: translateY(-1000px); transform: translateY(-1000px); }
	25% { -webkit-transform: translateY(-900px); transform: translateY(-900px); }
	50%  { -webkit-transform: translateY(-600px); transform: translateY(-600px); }
	65% { color: #9b9b9b; -webkit-transform: translateY(-400px); transform: translateY(-400px); }
	80% { color: #9b9b9b; }
	90% { color: #fefefe; -webkit-transform: translateY(0); transform: translateY(0); }
	100% { color: #9b9b9b; -webkit-transform: translateY(0); transform: translateY(0); }
}

@media (max-width: 1600px) {
	@-webkit-keyframes rotate-color-blue {
		0%   { color: #00a4d2; -webkit-transform: translateY(-700px); transform: translateY(-700px); }
		25% { -webkit-transform: translateY(-500px); transform: translateY(-500px); }
		50%  { -webkit-transform: translateY(-250px); transform: translateY(-250px); }
		65% { color: #00a4d2; -webkit-transform: translateY(-100px); transform: translateY(-100px); }
		75% { color: #00a4d2; }
		90% { color: #04e2fd; -webkit-transform: translateY(0); transform: translateY(0); }
		100% { color: #00a4d2; -webkit-transform: translateY(0); transform: translateY(0); }
	}
	@keyframes rotate-color-blue {
		0%   { color: #00a4d2; -webkit-transform: translateY(-700px); transform: translateY(-700px); }
		25% { -webkit-transform: translateY(-500px); transform: translateY(-500px); }
		50%  { -webkit-transform: translateY(-250px); transform: translateY(-250px); }
		65% { color: #00a4d2; -webkit-transform: translateY(-100px); transform: translateY(-100px); }
		75% { color: #00a4d2; }
		90% { color: #04e2fd; -webkit-transform: translateY(0); transform: translateY(0); }
		100% { color: #00a4d2; -webkit-transform: translateY(0); transform: translateY(0); }
	}

	@-webkit-keyframes rotate-color-grey {
		0%   { color: #9b9b9b; -webkit-transform: translateY(-800px); transform: translateY(-800px); }
		25% { -webkit-transform: translateY(-600px); transform: translateY(-600px); }
		50%  { -webkit-transform: translateY(-400px); transform: translateY(-400px); }
		65% { color: #9b9b9b; -webkit-transform: translateY(-200px); transform: translateY(-200px); }
		80% { color: #9b9b9b; }
		90% { color: #fefefe; -webkit-transform: translateY(0); transform: translateY(0); }
		100% { color: #9b9b9b; -webkit-transform: translateY(0); transform: translateY(0); }
	}

	@keyframes rotate-color-grey {
		0%   { color: #9b9b9b; -webkit-transform: translateY(-800px); transform: translateY(-800px); }
		25% { -webkit-transform: translateY(-600px); transform: translateY(-600px); }
		50%  { -webkit-transform: translateY(-400px); transform: translateY(-400px); }
		65% { color: #9b9b9b; -webkit-transform: translateY(-200px); transform: translateY(-200px); }
		80% { color: #9b9b9b; }
		90% { color: #fefefe; -webkit-transform: translateY(0); transform: translateY(0); }
		100% { color: #9b9b9b; -webkit-transform: translateY(0); transform: translateY(0); }
	}
}

@media (max-width: 767px) {
	@-webkit-keyframes rotate-color-blue {
		0%   { color: #00a4d2; -webkit-transform: translateY(-300px); transform: translateY(-300px); }
		25% { -webkit-transform: translateY(-200px); transform: translateY(-200px); }
		50%  { -webkit-transform: translateY(-100px); transform: translateY(-100px); }
		65% { color: #00a4d2; -webkit-transform: translateY(-50px); transform: translateY(-50px); }
		70% { -webkit-transform: translateY(0); transform: translateY(0); }
		80% { color: #00a4d2; }
		90% { color: #04e2fd; -webkit-transform: translateY(0); transform: translateY(0); }
		100% { color: #00a4d2; -webkit-transform: translateY(0); transform: translateY(0); }
	}
	@keyframes rotate-color-blue {
		0%   { color: #00a4d2; -webkit-transform: translateY(-300px); transform: translateY(-300px); }
		25% { -webkit-transform: translateY(-200px); transform: translateY(-200px); }
		50%  { -webkit-transform: translateY(-100px); transform: translateY(-100px); }
		65% { color: #00a4d2; -webkit-transform: translateY(-50px); transform: translateY(-50px); }
		70% { -webkit-transform: translateY(0); transform: translateY(0); }
		80% { color: #00a4d2; }
		90% { color: #04e2fd; -webkit-transform: translateY(0); transform: translateY(0); }
		100% { color: #00a4d2; -webkit-transform: translateY(0); transform: translateY(0); }
	}

	@-webkit-keyframes rotate-color-grey {
		0%   { color: #9b9b9b; -webkit-transform: translateY(-400px); transform: translateY(-400px); }
		25% { -webkit-transform: translateY(-300px); transform: translateY(-300px); }
		50%  { -webkit-transform: translateY(-200px); transform: translateY(-200px); }
		65% { color: #9b9b9b; -webkit-transform: translateY(-100px); transform: translateY(-100px); }
		70% { -webkit-transform: translateY(0); transform: translateY(0); }
		80% { color: #9b9b9b; }
		90% { color: #fefefe; -webkit-transform: translateY(0); transform: translateY(0); }
		100% { color: #9b9b9b; -webkit-transform: translateY(0); transform: translateY(0); }
	}

	@keyframes rotate-color-grey {
		0%   { color: #9b9b9b; -webkit-transform: translateY(-400px); transform: translateY(-400px); }
		25% { -webkit-transform: translateY(-300px); transform: translateY(-300px); }
		50%  { -webkit-transform: translateY(-200px); transform: translateY(-200px); }
		65% { color: #9b9b9b; -webkit-transform: translateY(-100px); transform: translateY(-100px); }
		70% { -webkit-transform: translateY(0); transform: translateY(0); }
		80% { color: #9b9b9b; }
		90% { color: #fefefe; -webkit-transform: translateY(0); transform: translateY(0); }
		100% { color: #9b9b9b; -webkit-transform: translateY(0); transform: translateY(0); }
	}
}

.cols:after { content: ''; line-height: 0; display: table; clear: both;
}

/* ------------------------------------------------------------ *\
	I.   Generic
\* ------------------------------------------------------------ */

/* ------------------------------------------------------------ *\
	Reset
\* ------------------------------------------------------------ */

*,
*:before,
*:after { padding: 0; margin: 0; outline: 0; box-sizing: border-box; }

article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
menu,
nav,
section,
summary,
main { display: block; }

html { tap-highlight-color: rgba(0,0,0,0); }

body { -moz-osx-font-smoothing: grayscale; -webkit-font-smoothing: antialiased; font-smoothing: antialiased; -webkit-text-size-adjust: none; -ms-text-size-adjust: none; text-size-adjust: none; }

img,
iframe,
video,
audio,
object { max-width: 100%; }

img,
iframe { border: 0 none; }

img { height: auto; display: inline-block; vertical-align: middle; }

b,
strong { font-weight: bold; }

address { font-style: normal; }

svg:not(:root) { overflow: hidden; }

a,
button,
input[type="submit"],
input[type="button"],
input[type="reset"],
input[type="file"],
input[type="image"],
label[for] { cursor: pointer; }

a[href^="tel"],
button[disabled],
input[disabled],
textarea[disabled],
select[disabled] { cursor: default; }

button::-moz-focus-inner,
input::-moz-focus-inner { padding: 0; border: 0; }

input[type="text"],
input[type="password"],
input[type="date"],
input[type="datetime"],
input[type="datetime-local"],
input[type="month"],
input[type="week"],
input[type="email"],
input[type="number"],
input[type="search"],
input[type="tel"],
input[type="time"],
input[type="url"],
input[type="color"],
textarea,
a[href^="tel"] { -webkit-appearance: none; -moz-appearance: none; appearance: none; }

input[type="search"]::-webkit-search-cancel-button,
input[type="search"]::-webkit-search-decoration { -webkit-appearance: none; }

textarea { overflow: auto; -webkit-overflow-scrolling: touch; overflow-scrolling: touch; }

button,
input,
optgroup,
select,
textarea { font-family: inherit; font-size: inherit; color: inherit; -moz-osx-font-smoothing: grayscale; -webkit-font-smoothing: antialiased; font-smoothing: antialiased; }

button,
select { text-transform: none; }

table { width: 100%; border-collapse: collapse; border-spacing: 0; }

nav ul,
nav ol { list-style: none outside none; }

/* ------------------------------------------------------------ *\
	Base
\* ------------------------------------------------------------ */

body { min-width: 320px; background: #000000; font-family: 'Gotham', sans-serif; font-size: 2vh; line-height: 1.3; color: #ffffff; }

a { color: inherit; text-decoration: none; }

a:hover { text-decoration: underline; }

a[href^="tel"] { text-decoration: none; }

h1,
h2,
h3,
h4,
h5,
h6 { margin-bottom: 0.65em; }

h1 { font-size: 40px; }

h2 { font-size: 35px; }

h3 { font-size: 30px; }

h4 { font-size: 24px; }

h5 { font-size: 20px; }

h6 { font-size: 18px; }

p,
ul,
ol,
dl,
table,
blockquote { margin-bottom: 1.3em; }

h1[class],
h2[class],
h3[class],
h4[class],
h5[class],
h6[class],
h1:last-child,
h2:last-child,
h3:last-child,
h4:last-child,
h5:last-child,
h6:last-child,
p:last-child,
ul:last-child,
ol:last-child,
dl:last-child,
table:last-child,
blockquote:last-child { margin-bottom: 0; }

/* Desktop */

@media (max-width: 1600px) {
	body { font-size: 3vh; }
}

/* Mobile */

@media (max-width: 767px) {
	body { font-size: 15px; }
}

/* ------------------------------------------------------------ *\
	Fonts
\* ------------------------------------------------------------ */

@font-face {
	font-family: 'Gotham';
	src: url('fonts/Gotham-Bold.eot');
	src: url('fonts/Gotham-Bold.eot?#iefix') format('embedded-opentype'),
		url('fonts/Gotham-Bold.woff2') format('woff2'),
		url('fonts/Gotham-Bold.woff') format('woff'),
		url('fonts/Gotham-Bold.ttf') format('truetype'),
		url('fonts/Gotham-Bold.svg#Gotham-Bold') format('svg');
	font-weight: bold;
	font-style: normal;
}

@font-face {
	font-family: 'Gotham';
	src: url('fonts/Gotham-Book.eot');
	src: url('fonts/Gotham-Book.eot?#iefix') format('embedded-opentype'),
		url('fonts/Gotham-Book.woff2') format('woff2'),
		url('fonts/Gotham-Book.woff') format('woff'),
		url('fonts/Gotham-Book.ttf') format('truetype'),
		url('fonts/Gotham-Book.svg#Gotham-Book') format('svg');
	font-weight: normal;
	font-style: normal;
}

@font-face {
	font-family: 'Gotham';
	src: url('fonts/Gotham-Medium.eot');
	src: url('fonts/Gotham-Medium.eot?#iefix') format('embedded-opentype'),
		url('fonts/Gotham-Medium.woff2') format('woff2'),
		url('fonts/Gotham-Medium.woff') format('woff'),
		url('fonts/Gotham-Medium.ttf') format('truetype'),
		url('fonts/Gotham-Medium.svg#Gotham-Medium') format('svg');
	font-weight: 500;
	font-style: normal;
}

/* ------------------------------------------------------------ *\
	Helpers
\* ------------------------------------------------------------ */

/*  Clear  */

.clear:after { content: ''; line-height: 0; display: table; clear: both; }

/*  Notext  */

.notext { white-space: nowrap; text-indent: 100%; text-shadow: none; overflow: hidden; }

.notext-old { font-size: 0; line-height: 0; text-indent: -4000px; }

/*  Hidden  */

[hidden],
.hidden { display: none; }

/*  Alignleft  */

.alignleft { float: left; }

/*  Alignright  */

.alignright { float: right; }

/*  Disabled  */

[disabled],
.disabled { cursor: default; }

/*  Grid  */

.cols { margin: 0 -15px; }

.cols:after { }

.col { float: left; width: 100%; padding: 0 15px; }

.col-1of2 { width: 50%; }

/*  Links  */

.link { font-size: 3vh; color: #00d9f3; transition: color .4s; }

.link:hover { color: #ffffff; text-decoration: none; }

/*  Responsive Helpers  */

.visible-xs-block,
.visible-xs-inline,
.visible-xs-inline-block,
.visible-sm-block,
.visible-sm-inline,
.visible-sm-inline-block,
.visible-md-block,
.visible-md-inline,
.visible-md-inline-block,
.visible-lg-block,
.visible-lg-inline,
.visible-lg-inline-block { display: none !important; }

@media (max-width: 767px) {
	.hidden-xs { display: none !important; }
	.visible-xs-block { display: block !important; }
	.visible-xs-inline { display: inline !important; }
	.visible-xs-inline-block { display: inline-block !important; }
}

@media (min-width: 768px) and (max-width: 1023px) {
	.hidden-sm { display: none !important; }
	.visible-sm-block { display: block !important; }
	.visible-sm-inline { display: inline !important; }
	.visible-sm-inline-block { display: inline-block !important; }
}

@media (min-width: 1024px) and (max-width: 1199px) {
	.hidden-md { display: none !important; }
	.visible-md-block { display: block !important; }
	.visible-md-inline { display: inline !important; }
	.visible-md-inline-block { display: inline-block !important; }
}

@media (min-width: 1200px) {
	.hidden-lg { display: none !important; }
	.visible-lg-block { display: block !important; }
	.visible-lg-inline { display: inline !important; }
	.visible-lg-inline-block { display: inline-block !important; }
}

/* ------------------------------------------------------------ *\
	II.  Regions
\* ------------------------------------------------------------ */

/* ------------------------------------------------------------ *\
	Container
\* ------------------------------------------------------------ */

.container {}

/* ------------------------------------------------------------ *\
	Content
\* ------------------------------------------------------------ */

.content {}

/* ------------------------------------------------------------ *\
	Footer
\* ------------------------------------------------------------ */

.footer { position: fixed; bottom: 0; left: 0; width: 100%; height: 104px; padding: 42px 46px; text-align: right; }

.footer .copyright { font-size: 16px; color: #838383; }

/* Desktop */

@media (max-width: 1600px) {
	.footer { position: absolute; bottom: 0; left: 0; width: 100%; height: 52px; padding: 21px 23px; text-align: right; }

	.footer .copyright { font-size: 10px; color: #838383; }
}

/* Mobile */

@media (max-width: 767px) {
	.footer { text-align: center; }

	.footer .copyright { font-size: 8px; }
}

/* ------------------------------------------------------------ *\
	Header
\* ------------------------------------------------------------ */

.header { text-align: center; width: 100%; height: 25vh; position: absolute; top: 0; left: 0; z-index: 10; }

.header-content .logo img { width: auto; height: 100%; }

/* Desktop */

@media (max-width: 1600px) {
	.header { height: 20vh; }
}

/* Mobile */

@media (max-width: 767px) {
	.header { height: 15vh; }
}

/* ------------------------------------------------------------ *\
	Main
\* ------------------------------------------------------------ */

.main {}

/* ------------------------------------------------------------ *\
	Shell
\* ------------------------------------------------------------ */

.shell { max-width: 1220px; padding-left: 10px; padding-right: 10px; margin: auto; }

.shell-fluid { max-width: none; }

/* ------------------------------------------------------------ *\
	Sidebar
\* ------------------------------------------------------------ */

.sidebar {}

/* ------------------------------------------------------------ *\
	Wrapper
\* ------------------------------------------------------------ */

.wrapper { height: 100vh; position: relative; overflow: hidden; }

.wrapper-bg { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }

.wrapper-inner { position: relative; z-index: 2; min-height: 100vh; padding: 170px 0 52px; }

/* Mobile */

@media (max-width: 767px) {
	.wrapper-inner { padding-top: 155px; }
}

/* ------------------------------------------------------------ *\
	III. Modules
\* ------------------------------------------------------------ */

/* ------------------------------------------------------------ *\
	Button
\* ------------------------------------------------------------ */

.btn { display: inline-block; vertical-align: middle; text-align: center; cursor: pointer; transition: background .4s, color .4s, opacity .4s, visibility .4s;
	-webkit-appearance: none;
	   -moz-appearance: none;
	 		appearance: none;
}

.btn:hover { text-decoration: none; }

/*  Btn Blue  */

.btn-blue { padding: 10px 22px; border: 4px solid #ffffff; background: #00bdde; font-size: 2.5vh; color: #ffffff; text-transform: uppercase; }

.btn-blue:hover { background: #ffffff; color: #00bdde; }

/*  Button Block  */

.btn-block { display: block; padding-left: 0; padding-right: 0; }

/* Desktop */

@media (max-width: 1600px) {
	.btn-blue { padding: 5px 11px; border: 2px solid #ffffff; font-size: 12px; }
}

/* ------------------------------------------------------------ *\
	Form Elements
\* ------------------------------------------------------------ */

input::-webkit-input-placeholder { color: inherit; opacity: 1; }

input::-moz-placeholder { color: inherit; opacity: 1; }

input:-ms-input-placeholder { color: inherit; opacity: 1; }

input::placeholder { color: inherit; opacity: 1; }

textarea::-webkit-input-placeholder { color: inherit; opacity: 1; }

textarea::-moz-placeholder { color: inherit; opacity: 1; }

textarea:-ms-input-placeholder { color: inherit; opacity: 1; }

textarea::placeholder { color: inherit; opacity: 1; }

input:-webkit-autofill { -webkit-text-fill-color: inherit; -webkit-box-shadow: 0 0 0 1000px #fff inset; }

.field {}

.textarea {}

.select {}

.radio {}

.checkbox {}

/* ------------------------------------------------------------ *\
	Form
\* ------------------------------------------------------------ */

.form {}

/* ------------------------------------------------------------ *\
	Fullsize Image
\* ------------------------------------------------------------ */

.fullsize-image { background-position: center bottom; background-repeat: no-repeat; background-size: cover; }

.fullsize-image > img { display: none; }

/* ------------------------------------------------------------ *\
	Intro
\* ------------------------------------------------------------ */

.intro { display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; text-align: center; width: 100%; height: 100vh; padding: 10px; position: absolute; top: 0; left: 0; }

.intro .intro-content { width: 100%; }

.intro .intro-inner strong,
.intro .intro-inner span { display: block; line-height: .85; text-transform: uppercase; text-shadow: 0px 10px 30px rgba(0,0,0,0.38); opacity: 0; -webkit-transform: translateY(-1000px); -ms-transform: translateY(-1000px); transform: translateY(-1000px); }

.intro .intro-inner strong { margin-bottom: 6px; font-size: 8vh; color: #00a3d1; transition: opacity .8s, color .8s; transition-delay: .7s; -webkit-animation: rotate-color-blue 2.5s linear; animation: rotate-color-blue 2.5s linear; }

.intro .intro-inner span { font-size: 6vh; color: #9b9b9b; font-weight: bold; transition: opacity 1s, color 1s; transition-delay: .5s; -webkit-animation: rotate-color-grey 2.5s linear; animation: rotate-color-grey 2.5s linear; }

.intro.expanded .intro-inner span,
.intro.expanded .intro-inner strong { -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); opacity: 1; }

.intro .intro-body { max-width: 50%; margin: 5vh auto 0; }

.intro.expanded .intro-body-outer { opacity: 1; transition-delay: 1.5s; }

.intro .intro-body-outer { opacity: 0; transition: opacity .5s; }

.intro .intro-foot { margin-top: 1vh; }

.intro .intro-actions { margin-top: 1vh; }

.intro .intro-actions-inner { margin-bottom: 2vh; }

/* Desktop */

@media (max-width: 1600px) {
	.intro .intro-inner strong,
	.intro .intro-inner span { -webkit-transform: translateY(-800px); -ms-transform: translateY(-800px); transform: translateY(-800px); }

	.intro .intro-inner strong { font-size: 10vh; }
	.intro .intro-inner span { font-size: 8vh; }

	.intro .intro-body { max-width: 70%; margin-bottom: 3vh; transition-delay: 1s; }
}

/* Tablet */

@media (max-width: 1023px) {
	.intro .intro-inner strong { font-size: 8vh; }
	.intro .intro-inner span { font-size: 6vh; }

	.intro .intro-body { max-width: 70%; margin-bottom: 3vh; }
}

/* Mobile */

@media (max-width: 767px) {
	.intro .intro-inner strong,
	.intro .intro-inner span { -webkit-transform: translateY(-500px); -ms-transform: translateY(-500px); transform: translateY(-500px); -webkit-animation-duration: 1.5s; animation-duration: 1.5s; }

	.intro .intro-body { max-width: 100%; transition-delay: 2.5s; }
}

/* ------------------------------------------------------------ *\
	List
\* ------------------------------------------------------------ */

[class^="list-"] { list-style: none outside none; }

/* ------------------------------------------------------------ *\
	List Features
\* ------------------------------------------------------------ */

.list-features { position: relative; display: inline-block; padding: 24px 0; font-size: 0; }

.list-features:after,
.list-features:before { position: absolute; top: 0; bottom: 20px; width: 68px; border: 4px solid #00d9f3; content: ''; }

.list-features:before { left: 6px; border-right: none; }

.list-features:after { right: 6px; border-left: none; }

.list-features li { position: relative; z-index: 2; display: inline-block; margin: 0 36px 20px; font-size: 3vh; font-weight: 500; vertical-align: top; }

.list-features li:nth-child(2n) { margin: 0 0 20px; }

.list-features a { transition: color .4s; }

.list-features a:hover { color: #00d9f3; text-decoration: none; }

/* Desktop */

@media (max-width: 1600px) {
	.list-features { padding: 12px 0; font-size: 0; }
	.list-features:after,
	.list-features:before { position: absolute; top: 0; bottom: 10px; width: 34px; border: 2px solid #00d9f3; content: ''; }
	.list-features:before { left: 3px; border-right: none; }
	.list-features:after { right: 3px; border-left: none; }

	.list-features li:nth-child(2n), 
	.list-features li:last-child:after { display: none; }
	
	.list-features li { position: relative; z-index: 2; display: inline-block; margin: 0 18px 10px; font-size: 15px; font-weight: 500; vertical-align: top; }
	.list-features li:after { position: absolute; top: 1px; right: -20px; width: 2px; height: 16px; background: #ffffff; content: ''; -webkit-transform: rotate(-26deg); -ms-transform: rotate(-26deg); transform: rotate(-26deg); }
	.list-features a { transition: color .4s; }
	.list-features a:hover { color: #00d9f3; text-decoration: none; }
}

/* Tablet Portrait */

@media (max-width: 1023px) {
	.list-features { margin-left: -10px; margin-right: -10px; }
	.list-features:before { left: -5px; }
	.list-features:after { right: -5px; }
	.list-features li { margin: 0 10px 10px; }
	.list-features li:after { right: -12px; }
}

/* Mobile */

@media (max-width: 767px) {
	.list-features { display: block; padding-left: 8px; padding-right: 8px; margin-left: 0; margin-right: 0; }
	.list-features li { display: block; margin: 0 0 10px; }
	.list-features li:after { display: none; }
}

/* ------------------------------------------------------------ *\
	Logo
\* ------------------------------------------------------------ */

.logo { display: inline-block; height: 100%; }

.logo img { width: auto; height: 90%; }

/* ------------------------------------------------------------ *\
	Nav
\* ------------------------------------------------------------ */

.nav {}

/* ------------------------------------------------------------ *\
	Section
\* ------------------------------------------------------------ */

.section {}

/* ------------------------------------------------------------ *\
	Slider
\* ------------------------------------------------------------ */

.slider {}

.slider .slides { list-style: none outside none; }

/* ------------------------------------------------------------ *\
	Table
\* ------------------------------------------------------------ */

.table {}

/* ------------------------------------------------------------ *\
	Widget
\* ------------------------------------------------------------ */

.widgets { list-style: none outside none; }
