@keyframes fadein {
    from { opacity: 0; }
    to   { opacity: 1; }
}
@-moz-keyframes fadein {
    from { opacity: 0; }
    to   { opacity: 1; }
}
@-webkit-keyframes fadein {
    from { opacity: 0; }
    to   { opacity: 1; }
}
@-ms-keyframes fadein {
    from { opacity: 0; }
    to   { opacity: 1; }
}
@-o-keyframes fadein {
    from { opacity: 0; }
    to   { opacity: 1; }
}

* {
	border: none;
	border-radius: 0;
	padding: 0px;
	margin: 0px;
	outline: none;
	transition: all 200ms ease;
}

html, body {
	width: 100%;
	height: 100%;
	color: #333;
	background-color: #fff;
	font-size: 18px;
	font-family: Inter, Roboto, "Helvetica Neue", Helvetica, Arial, sans-serif, "Noto Color Emoji", "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
}

.hidden,
.hidden-no-js {
	display: none;
}

.white {
	color: #333;
	background-color: #fff;
}

.grey {
	color: #333;
	background-color: #f8f8f8;
}
.grey-gradient {
	color: #333;
	background-image: linear-gradient(#fff, #f4f4f4);
}

.red {
	color: #fff;
	background-color: #dc3231;
}

.dark {
	color: #bde6fb;
	background-color: #191f22;
}

.black {
	color: #fff;
	background-color: #1b1b1b;
}

.frame {
        box-shadow: inset 0 0 0 1px #e0e0e0;
}

/*
 * CONTAINER
 */

.container {
	max-width: 1280px;
	margin: 0 auto;
	overflow: hidden;
}
@media screen and (max-width: 1360px) {
	.container {
		max-width: 960px;
		margin: 0 auto;
	}
}
@media screen and (max-width: 1024px) {
	.container {
		max-width: 702px;
		margin: 0 auto;
	}
}
@media screen and (max-width: 768px) {
	.container {
		width: -webkit-calc(100% - 64px);
		width: -moz-calc(100% - 64px);
		width: -ms-calc(100% - 64px);
		width: -o-calc(100% - 64px);
		width: calc(100% - 64px);
		margin: 0 auto;
	}
}
@media screen and (max-width: 480px) {
	.container {
		width: -webkit-calc(100% - 32px);
		width: -moz-calc(100% - 32px);
		width: -ms-calc(100% - 32px);
		width: -o-calc(100% - 32px);
		width: calc(100% - 32px);
		margin: 0 auto;
	}
}

.container.wide {
	max-width: 1920px;
}
.container.narrow {
	max-width: 768px;
}

.row {
	overflow: hidden;
}

/*
 * CONTENT
 */

#content {
	transition: none;
}

.col-1,
.col-2,
.col-3,
.col-4,
.col-5,
.col-6,
.col-7,
.col-8,
.col-9,
.col-10,
.col-11,
.col-12 {
	display: block;
	float: left;
}

.col-1 {width: 8.33%;}
.col-2 {width: 16.66%;}
.col-3 {width: 25%;}
.col-4 {width: 33.33%;}
.col-5 {width: 41.66%;}
.col-6 {width: 50%;}
.col-7 {width: 58.33%;}
.col-8 {width: 66.66%;}
.col-9 {width: 75%;}
.col-10 {width: 83.33%;}
.col-11 {width: 91.66%;}
.col-12 {width: 100%;}

@media screen and (max-width: 1024px) {
	.col-3 {width: 50%;}

	.col-4 {width: 100%;}

	.col-9 {width: 100%;}
}
@media screen and (max-width: 768px) {
	.col-3 {width: 100%;}

	.col-5 {width: 100%;}

	.col-6 {width: 100%;}

	.col-7 {width: 100%;}

	.col-8 {width: 100%;}
}

.margin-auto {margin: auto !important;}
.margin-0 {margin: 0 !important;}

.max-width-100 {max-width: 100%;}

.float-none {float: none;}
.float-left {float: left;}
.float-right {float: right;}

.valign-top {vertical-align: top;}
.valign-middle {vertical-align: middle;}
.valign-bottom {vertical-align: bottom;}

.d-block {display: block !important;}
.d-inline-block {display: inline-block !important;}
.d-table {display: table !important;}
.d-table-cell {display: table-cell !important;}

/*
 * TEXT
 */

h1 {
	font-size: 80px;
        letter-spacing: -0.022em;
	font-weight: 700;
	line-height: 1.1;
	margin: 0 0 0.5em 0;
}

h2 {
	font-size: 60px;
        letter-spacing: -0.022em;
	font-weight: 600;
	line-height: 1.1;
	margin: 0  0 0.5em 0;
}

h3 {
	font-size: 40px;
        letter-spacing: -0.022em;
	font-weight: 700;
	margin: 0 0 0.5em 0;
}

h4 {
	font-size: 30px;
        letter-spacing: -0.021em;
	font-weight: 600;
	margin: 0 0 0.5em 0;
}

h5 {
	font-size: 24px;
        letter-spacing: 0.019em;
	font-weight: 700;
	text-transform: uppercase;
	margin: 0 0 0.5em 0;
}

h6 {
	font-size: 18px;
        letter-spacing: 0.08em;
	font-weight: 700;
	text-transform: uppercase;
	opacity: 0.5;
	margin: 0 0 0.5em 0;
}

p {
	font-size: 24px;
        letter-spacing: -0.019em;
	line-height: 1.5;
	margin: 1.5em 0;
}

p.huge {
	font-size: 40px;
	font-weight: 600;
        letter-spacing: -0.022em;
	line-height: 1.15;
	margin: 1em 0;
}

@media screen and (max-width: 768px) {
	p.huge {
		font-size: 30px;
		letter-spacing: -0.021em;
	}
}

p.drop-cap:first-letter {
	float: left;
	font-weight: 700;
	font-size: 74px;
	line-height: 60px;
	padding-top: 5px;
	padding-right: 8px;
}

blockquote {
        font-weight: 600;
        color: #787878;
}

.emoji {
	font-weight: 400;
	font-family: noto color emoji, apple color emoji,segoe ui emoji,android emoji,emojisymbols,emojione mozilla,twemoji mozilla,segoe ui symbol;
}

.no-emoji {
	font-family: Inter, Roboto, "Helvetica Neue", Helvetica, Arial, sans-serif;
}

#content ul,
#content ol {
        margin: 0 0 0 32px;
	font-size: 24px;
	letter-spacing: -0.019em;
	line-height: 1.5;
}

@media screen and (max-width: 768px) {
	h1 {
		font-size: 56px;
		letter-spacing: -0.022em;
	}

	h2 {
		font-size: 40px;
		letter-spacing: -0.022em;
		margin: 0 0 0.5em 0;
	}

	h3 {
		font-size: 30px;
		letter-spacing: -0.021em;
	}

	h4 {
		font-size: 24px;
		letter-spacing: -0.019em;
	}

	h5 { font-size: 18px; }

	h6 { font-size: 18px; }

	p {
		font-size: 20px;
		letter-spacing: -0.017em;
	}

	#content ul,
	#content ol {
		font-size: 20px;
		letter-spacing: -0.017em;
	}

}

.font-normal,
.font-400 {
        font-weight: 400 !important;
}
.font-500 {
        font-weight: 500 !important;
}
.font-600 {
        font-weight: 600 !important;
}
.font-bold,
.font-700 {
        font-weight: 700 !important;
}

blockquote {
	font-size: 18px;
        letter-spacing: -0.014em;
	line-height: 1.75;
	margin: 1.5em 0;
}

sup {
	font-size: 50%;
	vertical-align: top;
	position: relative;
	bottom: -.13em;
}

small {
	font-size: 14px !important;
        letter-spacing: -0.006em !important;
}

label {
	font-size: 16px;
        letter-spacing: -0.011em;
	font-weight: 700;
	color: rgba(51,51,51,0.5);
}

.muted { opacity: 0.5; }

a {
	color: inherit;
	text-decoration: underline;
	display: inline-block;
}
a:hover {
	color: #15a6f0;
}
.dark a {
	color: #bde6fb;
}
.black a {
	color: #fff;
}

a.no-decoration {
	text-decoration: none;
}

a strong {
	transition: none;
}

a.learn-more {
	color: #15a6f0;
	font-weight: 700;
	text-decoration: none;
	display: inline-block;
}
a.learn-more:hover {
	text-decoration: underline;
}
a.learn-more.button:hover {
	text-decoration: none;
}
a.learn-more.red {
	color: #dc3231;
	background-color: transparent;
}
a.learn-more.flat {
	color: inherit;
	font-weight: 400;
}
.black a.learn-more {
	color: #fff;
}

a.learn-more::after {
	color: inherit;
	content: "\203a";
	font-style: normal;
	font-weight: inherit;
	padding-left: 8px;
	position: absolute;
	transition: padding 200ms ease;
}
	a.learn-more:hover::after,
	a.learn-more:active::after,
	a.learn-more:hover:active::after {
		padding-left: 16px;
	}

.text-center {text-align: center;}
.text-left {text-align: left;}
.text-right {text-align: right;}

label span {
	font-weight: 400;
}

input,
select {
	border: none;
	display: inline-block;
	outline: none;
        padding: 16px 24px;
	border-radius: 8px;
	background-color: rgba(51,51,51,0.1);
	border: none;
	color: #333;
	text-decoration: none;
	font-family: Inter, Roboto, "Helvetica Neue", Helvetica, Arial, sans-serif, "Noto Color Emoji", "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
	font-weight: 400;
	font-size: 24px;
        line-height: 32px;
        letter-spacing: -0.019em;
}
	input:focus,
	select:focus,
	input.checked,
	select.checked {
		background-color: rgba(51,51,51,0.2);
	}

select::-ms-expand {
    display: none;
}
select {
        -webkit-appearance: none;
        -moz-appearance: none;
        appearance: none;
        background-image: url("https://assets.zorincdn.com/images/widgets/select.svg");
        background-position: center right;
        background-repeat: no-repeat;
}

::-webkit-input-placeholder {
	color: #333;
	opacity: 0.5;
}
:-moz-placeholder {
	color: #333;
	opacity: 0.5;
}
:-moz-input-placeholder {
	color: #333;
	opacity: 0.5;
}
:-ms-input-placeholder {
	color: #333;
	opacity: 0.5;
}

input[type=number]::-webkit-inner-spin-button, 
input[type=number]::-webkit-outer-spin-button { 
    -webkit-appearance: none; 
    margin: 0; 
}

textarea {
	border: none;
	background-color: rgba(51,51,51,0.1);
	border-radius: 8px;
	color: #333;
	display: inline-block;
	outline: none;
	padding: 16px 24px;
	font-family: Inter, Roboto, "Helvetica Neue", Helvetica, Arial, sans-serif, "Noto Color Emoji", "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
	font-size: 24px;
        line-height: 32px;
        letter-spacing: -0.019em;
	resize: none;
	overflow: hidden;
}
	textarea:focus {
		background-color: rgba(51,51,51,0.2);
	}

@media screen and (max-width: 768px) {
	input,
	select,
	textarea {
		font-size: 20px;
		letter-spacing: -0.017em;
	}
}

/*
 * TABLE
 */

table {
	border-collapse: collapse;
	width: 100%;
	margin: 0 auto;
	font-size: inherit;
	letter-spacing: -0.019em;
	line-height: 1.75;
}

@media screen and (max-width: 768px) {
	table {
		font-size: 20px;
		letter-spacing: -0.017em;
	}
}
@media screen and (max-width: 480px) {
	table {
		font-size: 18px;
		letter-spacing: -0.014em;
	}
}

thead {
	text-transform: uppercase;
}

td,
th {
	padding: 8px 16px;
	text-align: center;
}

th.hide {
	border:0;
	background: none;
}

.tick {
	color: #26c89c;
	font-family: Inter, Roboto, "Helvetica Neue", Helvetica, Arial, sans-serif;
}

td,th {
	text-align: left;
}
td+td, th+th {
	text-align: center;
}

th {
	font-weight: 700;
}

tr:nth-child(odd) > td {
	background-color: rgba(51,51,51,0.03);
}

/*
 * BUTTONS
 */

button,
a.button {
	border-radius: 8px;
	background-color: rgba(51,51,51,0.1);
	border: none;
	color: #333;
	text-decoration: none;
	font-weight: 400;
	margin: 8px;
        line-height: 32px;
        padding: 16px 24px;
}

small a.button {
        padding: 8px 12px;
}

button {
	font-size: 24px;
        letter-spacing: -0.019em;
	cursor: pointer;
	font-family: Inter, Roboto, "Helvetica Neue", Helvetica, Arial, sans-serif, "Noto Color Emoji", "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
}

@media screen and (max-width: 768px) {
	button {
		font-size: 20px;
		letter-spacing: -0.017em;
	}
}

a.button {
}
	button:hover,
	a.button:hover {
		background-color: rgba(51,51,51,0.2);
		text-decoration: none;
	}
	button:active,
	button:hover:active,
	button.checked,
	button.checked:hover,
	button.checked:active,
	button.checked:hover:active,
	a.button:active,
	a.button:hover:active {
		background-color: #15a6f0;
		color: #fff;
		text-decoration: none;
		box-shadow: 0 4px 8px rgba(21,166,240,0.3);
	}

button.suggested,
a.button.suggested {
	background-color: #15a6f0;
	color: #fff;
	font-weight: 700;
}
	button.suggested:hover,
	a.button.suggested:hover {
		background-color: #5dc1f5;
		color: #fff;
	}
	button.suggested:active,
	button.suggested:hover:active,
	a.button.suggested:active,
	a.button.suggested:hover:active {
		background-color: #0b77ad;
		color: #fff;
		box-shadow: 0 4px 8px rgba(11,119,173,0.3);
	}

button.suggested.white,
a.button.suggested.white,
.black button.suggested,
.black a.button.suggested {
	background-color: #15a6f0;
	color: #fff;
}
	button.suggested.white:hover,
	a.button.suggested.white:hover,
	.black button.suggested:hover,
	.black a.button.suggested:hover {
		background-color: #5dc1f5;
		color: #fff;
	}
	button.suggested.white:active,
	button.suggested.white:hover:active,
	a.button.suggested.white:active,
	a.button.suggested.white:hover:active,
	.black button.suggested:active,
	.black button.suggested:hover:active,
	.black a.button.suggested:active,
	.black a.button.suggested:hover:active {
		background-color: #0b77ad;
		color: #fff;
		box-shadow: 0 4px 8px rgba(11,119,173,0.3);
	}

button.flat,
a.button.flat {
	background-color: transparent;
	border-color: transparent;
	color: #333;
}
	button.flat:hover,
	a.button.flat:hover {
		background-color: rgba(51,51,51,0.1);
	}
	button.flat:active,
	button.flat:hover:active,
	button.flat.checked,
	button.flat.checked:hover,
	button.flat.checked:active,
	button.flat.checked:hover:active,
	a.button.flat:active,
	a.button.flat:hover:active {
		background-color: #15a6f0;
		color: #fff;
	}


.dark button,
.dark a.button {
	background-color: #293338;
	color: #bde6fb;
}

	.dark button:hover,
	.dark a.button:hover {
		background-color: #3a474d;
	}
	.dark button:active,
	.dark button:hover:active,
	.dark button.checked,
	.dark button.checked:hover,
	.dark button.checked:active,
	.dark button.checked:hover:active,
	.dark a.button:active,
	.dark a.button:hover:active {
		background-color: #bde6fb;
		color: #191f22;
		box-shadow: 0 4px 8px rgba(189,230,251,0.3);
	}

.dark button.suggested,
.dark a.button.suggested {
	background-color: #bde6fb;
	color: #191f22;
}
	.dark button.suggested:hover,
	.dark a.button.suggested:hover {
		background-color: #fff;
		color: #191f22;
	}
	.dark button.suggested:active,
	.dark button.suggested:hover:active,
	.dark a.button.suggested:active,
	.dark a.button.suggested:hover:active {
		background-color: #75caf6;
		color: #191f22;
		box-shadow: 0 4px 8px rgba(117,202,246,0.3);
	}

.dark button.flat,
.dark a.button.flat {
	background-color: transparent;
	border-color: transparent;
	color: #bde6fb;
}
	.dark button.flat:hover,
	.dark a.button.flat:hover {
		background-color: transparent;
		color: #bde6fb;
	}
	.dark button.flat:active,
	.dark button.flat:hover:active,
	.dark button.flat.checked,
	.dark button.flat.checked:hover,
	.dark button.flat.checked:active,
	.dark button.flat.checked:hover:active,
	.dark a.button.flat:active,
	.dark a.button.flat:hover:active {
		background-color: #bde6fb;
		color: #191f22;
	}

.black button,
.black a.button {
	background-color: rgba(255,255,255,0.1);
	color: #fff;
}
	.black button:hover,
	.black a.button:hover {
		background-color: rgba(255,255,255,0.2);
	}
	.black button:active,
	.black button:hover:active,
	.black button.checked,
	.black button.checked:hover,
	.black button.checked:active,
	.black button.checked:hover:active,
	.black a.button:active,
	.black a.button:hover:active {
		background-color: #15a6f0;
		color: #fff;
		box-shadow: 0 4px 8px rgba(21,166,240,0.3);
	}

/*
 * STYLE CLASSES
 */

.cc-floating,
.shadow {
	box-shadow: 0 10px 30px 0 rgba(0,0,0,0.2);
}
@media screen and (max-width: 768px) {
	.shadow {
		box-shadow: 0 5px 10px 0 rgba(0,0,0,0.2);
	}
}

.cc-floating.cc-theme-classic {
	border-radius: 8px !important;
}

a.cc-btn {
	text-decoration: none;
}

.rounded { border-radius: 8px; }

/*
 * TOOLTIP
 */

.tooltip {
    position: relative;
    display: inline-block;
    cursor: default;
}

.tooltip .tooltip-text {
    visibility: hidden;
    background-color: rgba(0, 0, 0, 0.8);
    background-clip: padding-box;
    border: 1px solid rgba(255, 255, 255, 0.1);
    width: 200px;
    color: #FFF;
    text-align: center;
    border-radius: 8px;
    padding: 8px;
    position: absolute;
    top: -5px;
    right: 105%; 
    z-index: 1;
}

.tooltip:hover .tooltip-text {
    visibility: visible;
}

/*
 * BORDER
 */

hr {
	display: block;
	background-color: rgba(51,51,51,0.15);
	width: 50%;
	height: 1px;
	margin: 0 auto;
}

/*
 * SECTION
 */

section {
	padding: 128px 0;
	position: relative;
}

section.extra-padding {
	padding: 256px 0;
}
@media screen and (max-width: 1024px) {
	section.extra-padding {
		padding: 128px 0;
	}
}
section.less-padding {
	padding: 64px 0;
}
section.smallest-padding {
	padding: 32px 0;
}
section.no-padding {
	padding: 0;
}

section#disclaimers {
	padding: 64px 0 0 0;
}
section#disclaimers ol {
	margin: 1em 0;
	padding: 0 32px;
	list-style-type: decimal;
}
section#disclaimers ol li {
	padding: 4px;
	font-size: 12px;
	opacity: 0.5;
	line-height: 1.25;
}

/*
 * NAVIGATION
 */

nav {
	width: 100%;
	height: 72px;
	line-height: 72px;
	font-size: 18px;
        letter-spacing: -0.014em;
        border: none;
}

nav a.button,
nav button {
	margin-top: 10px;
	margin-bottom: 10px;
	line-height: 1.5em;
}

nav#main {
	background-color: #fff;
	position: absolute;
	top: 0px;
	z-index: 5;
	text-align: center;
}

	nav#main .logotype {
		display: inline-block;
		float: left;
		left: 0;
		width: 42px;
		height: 36px;
		margin: 18px 4px 18px 0;
		background-image: url("https://assets.zorincdn.com/images/nav/logo.svg");
		background-size: 42px 36px;
		background-repeat: no-repeat;
		background-position: center center;
		background-origin: content-box;
	}

	ul.menu {
		display: inline-block;
		list-style: none;
		position: relative;
		margin: 0;
	}

	nav ul.menu li {
		font-size: 18px;
		letter-spacing: -0.014em;
		line-height: 72px;
		display: inline;
		float: left;
	}
	        nav#main ul.menu li {
			margin: 0 16px;
	        }

	nav#main #main-menu {
		margin-left: auto;
		margin-right: auto;
		transform: translateX(-24px);
	}

	nav#main #login-menu {
		float: right;
		right: 0;
	}

		nav ul.menu li a {
			text-align: center;
			display: inline-block;
			text-decoration: none;
			line-height: 72px;
			padding: 0 20px;
			font-weight: 400;
			box-shadow: none;
			color: rgba(51,51,51,0.5);
		}
		nav ul.menu li a:hover {
			color: #333;
		}
		nav#main ul.menu li a {
			font-weight: 600;
			text-transform: uppercase;
                        letter-spacing: 0.019em;
		}
		nav ul.menu li.current a {
			font-weight: 500;
			color: #333;
		}
		nav#main ul.menu li.current a {
			font-weight: 700;
			box-shadow: inset 0 -3px #333;
		}

		nav ul.menu li.new::before {
	                font-size: 10px;
	                letter-spacing: 0.08em;
	                font-weight: 700;
	                color: #dc3231;
	                border-radius: 999px;
	                margin-left: 20px;
                        transform: translateY(-20px);
	                content: 'NEW';
	                position: absolute;
                        opacity: 0.75;
                        height: 0;
		}

	nav#main .container {
		height: 72px;
	}

	nav#main .responsive {
		display: none;
		float: right;
	}

	nav#main .responsive a.button {
		display: inline-block;
	}

	nav#main .responsive.open a.button {
		background-color: #15a6f0;
		color: #fff;
		box-shadow: 0 4px 8px rgba(21,166,240,0.3);
	}

        nav#main a.button {
                line-height: 20px;
        }

.dark nav {
	border-color: rgba(189,230,251,0.15);
}

	.dark nav#main .logotype {
		background-image: url("https://assets.zorincdn.com/images/nav/logo-dark.svg");
	}
		.dark nav ul.menu li.current a {
			box-shadow: inset 0 -3px #bde6fb;
		}

.black nav {
	border-color: rgba(255,255,255,0.15);
}

	.black nav .logotype {
		background-image: url("https://assets.zorincdn.com/images/nav/logo-white.svg");
	}
		.black nav ul.menu li.current a {
			box-shadow: inset 0 -3px #fff;
		}

@media screen and (max-width: 1024px) {
        nav#main ul.menu li {
		margin: 0;
        }
}

@media screen and (max-width: 768px) {
	nav#main .container {
		max-width: 100%;
		margin: 0 0 0 32px;
	}

	nav#main ul.menu {
		display: none;
	}

	nav#main #main-menu {
		transform: translateX(0);
	}

	nav#main ul.menu.open {
		display: inline-block;
		position: absolute;
		top: 72px;
		right: 0;
		width: 100%;
		background-color: #fff;
		border-style: solid;
		border-color: rgba(51,51,51,0.15);
		border-width: 0 0 1px 0;
		box-shadow: 0 10px 15px 0 rgba(0,0,0,0.05);

		-webkit-animation: fadein 0.5s ease;
		moz-animation: fadein 0.5s ease;
		ms-animation: fadein 0.5s ease;
		o-animation: fadein 0.5s ease;
		animation: fadein 0.5s ease;

		-webkit-transform: translateZ(0);
		-moz-transform: translateZ(0);
		-ms-transform: translateZ(0);
		-o-transform: translateZ(0);
		transform: translateZ(0);
	}

	nav#main ul.menu.open li {
		display: block;
		float: left;
		width: 100%;
	}

	nav#main ul.menu.open li a {
		padding: 0 32px;
		text-align: left;
		width: -webkit-calc(100% - 64px);
		width: -moz-calc(100% - 64px);
		width: -ms-calc(100% - 64px);
		width: -o-calc(100% - 64px);
		width: calc(100% - 64px);
		box-shadow: none;
	}
		nav#main ul.menu.open li.current a {
			font-weight: 700;
		}
		nav#main ul.menu li a:active,
		nav#main ul.menu li.current a:active {
			background-color: #15a6f0;
			color: #fff;
		}
		nav ul.menu li.new::before {
	                margin-left: 32px;
		}

	nav#main .responsive {
		display: inline-block;
	}
}

@media screen and (max-width: 480px) {
	nav#main .container {
		max-width: 100%;
		margin: 0 0 0 16px;
	}

	nav#main ul.menu.open li a {
		padding: 0 16px;
	}

	nav ul.menu li.new::before {
                margin-left: 16px;
	}
}

nav.scroll-hidden {
	opacity: 0;
}

nav.secondary,
nav.tertiary {
	z-index: 4;
}

nav.secondary {
	white-space: nowrap;
	overflow-x: auto;
        overflow-y: hidden;
	border-style: solid;
	border-color: rgba(51,51,51,0.15);
	border-width: 1px 0;
        height: 70px;
        line-height: 70px;
}
nav.secondary ul.menu li,
nav.secondary ul.menu li a {
	font-size: 16px;
        line-height: 70px;
}
nav.secondary a.button {
	font-size: 16px;
        line-height: 18px;
}
nav.secondary a img {
	margin-right: 16px;
	width: 48px;
	height: 48px;
	display: inline-block;
	vertical-align: middle;
}
	nav.secondary a img.logotype {
		width: auto;
		height: 15px;
	}

nav.tertiary {
        text-align: center;
}
nav.tertiary ul.menu {
        padding: 0 16px;
	background-color: rgba(51,51,51,0.05);
        border-radius: 8px;
}
nav.tertiary ul.menu li a {
	line-height: 72px;
        color: #333;
        font-weight: 500;
}
nav.tertiary ul.menu li a:hover {
        color: #15a6f0;
}

nav.sticky {
	position: fixed;
	top: 0;
	width: 100%;
	background-color: rgba(255,255,255,0.95);
	opacity: 1;
	border-color: transparent;
	box-shadow: 0 10px 15px 0 rgba(0,0,0,0.05);
}
.dark nav.sticky {
	background-color: rgba(25,31,34,0.95);
}
.black nav.sticky {
	background-color: rgba(27,27,27,0.95);
}

nav.sticky + #content {
	padding-top: 72px;
}

@media screen and (max-width: 480px) {
	nav.tertiary ul.menu {
                padding: 0 !important;
	}

	nav.tertiary ul.menu li a {
		padding: 0 8px;
	}
}

nav.tertiary.sticky {
	height: 72px;
}
nav.tertiary.sticky ul.menu {
        margin: 0;
	border-style: hidden;
        background-color: transparent;
}
nav.tertiary.sticky ul.menu li a {
	line-height: 72px;
}



/*
 * PLACEHOLDERS
 */

.nav-placeholder {
	display: block;
	height: 72px;
}

.placeholder-32 {
	display: block;
	height: 32px;
}

.placeholder-64 {
	display: block;
	height: 64px;
}


/*
 * FOOTER
 */

footer {
	padding: 32px 0;
	line-height: 2;
}

	footer span {
		font-weight: 700;
	}

	footer .logo {
		padding: 32px 0;
		float: none;
	}

		footer .logo .icon {
			display: block;
			margin: 0 auto;
			width: 70px;
			height: 64px;
			background-image: url("https://assets.zorincdn.com/images/footer/logo.svg");
			background-size: 70px 60px;
			background-repeat: no-repeat;
			background-position: center center;
			background-origin: content-box;
			opacity: 0.25;
		}
		footer .logo .icon:hover,
		footer .logo .icon:active,
		footer .logo .icon:active:hover {
			opacity: 1;
		}

	footer .newsletter {
		padding: 32px 0;
		margin: 0 auto;
		float: none;
	}

	footer .sitemap {
		padding: 32px 0;
	}

		footer .sitemap .col-4 {
			margin: 1em 0;
		}

	footer .social {
		padding: 32px 0;
	}

		footer .social .icons {
			text-align: center;
			height: 64px;
		}

		footer .social .icons .network {
			display: inline-block;
			width: 64px;
			height: 64px;
			background-size: 64px 64px;
			background-repeat: no-repeat;
			background-position: center center;
			background-origin: content-box;
			margin-right: 128px;
		}
		footer .social .icons .network:last-child {
			margin-right: 0;
		}
		footer .social .icons .network:active {
			opacity: 0.25;
		}

		footer .social .icons .network.facebook {
			background-image: url("https://assets.zorincdn.com/images/footer/facebook.svg");
		}

		footer .social .icons .network.twitter {
			background-image: url("https://assets.zorincdn.com/images/footer/twitter.svg");
		}

	footer .legal {
		padding: 32px 0;
		display: block;
		font-size: 12px;
		color: rgba(189,230,251,0.5);
	}

	footer .legal .info {
		text-align: center;
	}

	footer .legal .info .copyright,
	footer .legal .info .terms {
		display: block;
		float: none;
	}

	footer .legal .info .copyright {
		margin-right: 0;
	}

	footer .legal .info .terms a {
		padding-right: 16px;
		margin-right: 14px;
		border-style: solid;
		color: rgba(189,230,251,0.5);
		border-color: rgba(189,230,251,0.15);
		border-width: 0 1px 0 0;
		font-weight: 400;
	}
	footer .legal .info .terms a:last-child {
		margin-right: 0;
		padding-right: 0;
		border-style: none;
	}
	footer .legal .info .terms a:hover,
	footer .legal .info .terms a:active,
	footer .legal .info .terms a:hover:active {
		color: #bde6fb;
	}

@media screen and (max-width: 704px) {
	footer .social .icons .network {
		margin-right: 32px;
	}

	footer .legal .info {
		text-align: center;
	}

	footer .legal .info .copyright,
	footer .legal .info .terms {
		display: block;
		float: none;
	}

	footer .legal .info .copyright {
		margin-right: 0;
	}
}
