*,
*::before,
*::after {
    box-sizing: border-box;
}

html {
    font-family: sans-serif;
    line-height: 1.15;
    -webkit-text-size-adjust: 100%;
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}

body {
    margin: 0;
    height: 100%;
    text-align: left;
}

hr {
    box-sizing: content-box;
    height: 0;
    overflow: visible;
}

h1,
h2,
h3,
h4,
h5,
h6,
p {
    margin-top: 0;
}

abbr[title] {
    text-decoration: underline;
    text-decoration: underline dotted;
    cursor: help;
    border-bottom: 0;
    text-decoration-skip-ink: none;
}

address {
    margin-bottom: 1rem;
    font-style: normal;
    line-height: inherit;
}

ol,
ul,
dl {
    margin-top: 0;
    margin-bottom: 1rem;
}

ol ol,
ul ul,
ol ul,
ul ol {
    margin-bottom: 0;
}

dd {
    margin-bottom: .5rem;
    margin-left: 0;
}

blockquote {
    margin: 0 0 1rem;
}

small {
    font-size: 80%;
}

sub,
sup {
    position: relative;
    font-size: 75%;
    line-height: 0;
    vertical-align: baseline;
}

sub {
    bottom: -0.25em;
}

sup {
    top: -0.5em;
}

a:not([href]):not([tabindex]) {
    color: inherit;
    text-decoration: none;
}

a:not([href]):not([tabindex]):hover:focus {
    color: inherit;
    text-decoration: none;
}

a:not([href]):not([tabindex]):focus {
    outline: 0;
}

pre,
code,
kbd,
samp {
    font-size: 1em;
}

pre {
    margin-top: 0;
    margin-bottom: 1rem;
    overflow: auto;
}

figure {
    margin: 0 0 1rem;
}

img {
    vertical-align: middle;
}

table {
    border-collapse: collapse;
}

caption {
    text-align: left;
    caption-side: bottom;
}

th {
    text-align: inherit;
}

label {
    display: inline-block;
}

button {
    border-radius: 0;
}

button:focus {
    outline: 1px dotted;
    outline: 5px auto -webkit-focus-ring-color;
}

input,
button,
select,
optgroup,
textarea {
    margin: 0;
    font-family: inherit;
    font-size: inherit;
    line-height: inherit;
}

button,
input {
    overflow: visible;
}

button,
select {
    text-transform: none;
}

select {
    word-wrap: normal;
}

button,
[type="button"],
[type="reset"],
[type="submit"] {
    -webkit-appearance: button;
}

button::-moz-focus-inner,
[type="button"]::-moz-focus-inner,
[type="reset"]::-moz-focus-inner,
[type="submit"]::-moz-focus-inner {
    padding: 0;
    border-style: none;
}

input[type="date"],
input[type="time"],
input[type="datetime-local"],
input[type="month"] {
    -webkit-appearance: listbox;
}

textarea {
    resize: vertical;
}

fieldset {
    min-width: 0;
    padding: 0;
    margin: 0;
    border: 0;
}

legend {
    display: block;
    width: 100%;
    max-width: 100%;
    padding: 0;
    margin-bottom: .5rem;
    font-size: 1.5rem;
    line-height: inherit;
    white-space: normal;
}

progress {
    vertical-align: baseline;
}

[type="number"]::-webkit-inner-spin-button,
[type="number"]::-webkit-outer-spin-button {
    height: auto;
}

[type="search"] {
    outline-offset: -2px;
    -webkit-appearance: none;
}

[type="search"]::-webkit-search-decoration {
    -webkit-appearance: none;
}

::-webkit-file-upload-button {
    font: inherit;
    -webkit-appearance: button;
}

output {
    display: inline-block;
}

summary {
    display: list-item;
    cursor: pointer;
}

::-moz-placeholder {
    opacity: 1;
}

input[type=submit] {
    cursor: pointer;
}

.ui-skin.digitalocean {
    background-color: #0069ff;
}

.ui-skin.alpha form.ui-form {
    background-color: pink;
    color: black;
}

.ui-skin.alpha form.ui-form a {
    background-color: lightgray;
    color: blue;
}

.ui-skin.alpha form.ui-form a:hover {
    background-color: gray;
    color: darkblue;
}

.ui-skin.alpha form.ui-form input:not([type=submit]) {
    background-color: #ffd6dd;
    color: black;
    border-color: #ffaab9;
}

.ui-skin.alpha form.ui-form input:not([type=submit]):focus {
    color: black;
}

.ui-skin.alpha form.ui-form input:not([type=submit])::placeholder {
    color: #ff93a6;
}

.ui-skin.alpha form.ui-form input[type=submit] {
    background-color: #ff7d94;
    color: white;
    border: 0;
}

.ui-skin.alpha form.ui-form input[type=submit]:hover {
    background-color: #ff6781;
}


/*
// SKIN: DIGITALOCEAN
.ui-skin.digitalocean {
	form.ui-form {
		background-color: white;
		color: @darkestgray;
		a {

		}
		input {
			&:not([type=submit]) {
				background-color: @nearwhite;
				color: black;
				border-color: @shadednearwhite;
				&:focus {
				}
				&::placeholder {
				}
			}	
		}
	}
}
*/

.ui-layout.digitalocean form.ui-form {
    width: 66%;
    margin: 0 auto;
    padding: 40px;
    border-radius: 3px;
}

.ui-layout.digitalocean form.ui-form input {
    width: 100%;
    border-radius: 3px;
    margin: 20px auto;
    padding: 15px;
}

.ui-layout.digitalocean form.ui-form input:not([type=submit]) {
    font-size: 18px;
    border-size: 2px;
    border-style: solid;
}

.ui-layout.digitalocean form.ui-form input[type=submit] {
    font-size: 17px;
    border-size: 2px;
    border-style: solid;
}


/*
input {
	border: none;
	padding: 0;
	outline: none;
	-webkit-appearance: none;
}

input[type=submit] {
	cursor: pointer;
}

#page {
	position: relative;
	min-height: 100%;
}


/// WIDGET: NAVIGATION

nav ul {
	margin: 0;
	padding: 0;
}

nav li {
    list-style-type: none;
}

nav a {
    text-decoration: none;
}


/// WIDGET: UI-MENU

.ui-menu.horizontal .ui-stack span {
    vertical-align: middle;
}

.ui-menu.horizontal {
    width: 100%;
}

.ui-menu.horizontal nav.left li {
    float: left;
}

.ui-menu.horizontal nav.right li {
    float: right;
}


/// WIDGET: FORM

.ui-form input {
    display: block;
}

.ui-form input[type=submit] {}


/// WIDGET: BUTTON

.ui-button {}


/// SIZES


// page

#page>section {
    padding-bottom: 60px;
}

#page>footer {
    position: absolute;
    bottom: 0;
    height: 60px;
    width: 100%;
}


// theme

.ui-theme {
    font-size: 14px;
}


// menu, horizontal

.ui-menu.horizontal {
    height: 60px;
}

.ui-menu.horizontal li {
    line-height: 60px;
    max-height: 60px;
    padding: 0 15px;
    display: inline-block;
}

.ui-menu.horizontal .logo {
    margin-bottom: 5px;
}

.ui-menu.horizontal .logo .file {
    font-size: 120%;
}

.ui-menu.horizontal .logo .phone {
    margin-left: .9em;
}


// button

.ui-theme.light .ui-button {
    height: 40px;
    border-radius: 18px;
}


// ui-form

.ui-theme.light .ui-form.container {
    position: relative;
    text-align: center;
}

.ui-theme.light form.ui-form {
    width: 50%;
    min-width: 240px;
    max-width: 360px;
    margin: 0 auto;
    margin-top: 50px;
    padding: 30px;
    border-radius: 10px;
}

.ui-theme.light form.ui-form input:not([type=submit]) {
    height: 20px;
    width: 100%;
    padding: 10px 0;
    margin: 10px 0;
    font-size: 16px;
    font-weight: bold;
}

.ui-theme.light form.ui-form input[type=submit] {
    width: 100%;
    margin-top: 30px;
    padding: 5px 0;
    font-size: 14px;
}


/// FONTS

.ui-theme.light {
    font-family: "Helvetica Neau", Helvetica, Arial, Verdana, sans-serif;
}

.ui-theme.light .ui-button {
    text-transform: uppercase;
}

.ui-theme.light {
    background-color: @background-color;
    color: @color;
}


// menu, horizontal

.ui-theme.light .ui-menu.horizontal a {
    color: #333;
    text-shadow: 0 0 1px rgba(0, 0, 0, 0)
}

.ui-theme.light .ui-menu.horizontal a:hover {
    color: black;
    text-shadow: 0 0 1px rgba(0, 0, 0, .75)
}

.ui-theme.light .ui-menu.horizontal .selected a {
    color: darkcyan;
    pointer-events: none;
}

.ui-theme.light .ui-menu.horizontal a .logo {
    color: slategray;
}

.ui-theme.light .ui-menu.horizontal a:hover .logo {
    color: darkcyan;
}

.ui-theme.light .ui-menu.horizontal .avatar i {
    color: orange;
}

.ui-theme.light .ui-menu.horizontal .avatar b {
    color: white;
}

.ui-theme.light .ui-menu.horizontal .button.outline a {
    border-radius: 999px;
    border: 2px solid @mediumcyanish;
    padding: 3px 8px;
    background-color: white;
    color: black;
}

.ui-theme.light .ui-menu.horizontal .button.outline a:hover {
    background-color: @mediumcyanish;
    color: white;
}


// pane

.ui-theme.light .ui-pane.left {
    background-color: white;
    color: #666;
}

.ui-theme.light .ui-pane.right {
    background-color: white;
    color: black;
    border-left: 1px solid #ccc;
}

.ui-theme.light .ui-pane a {
    color: #333;
}


// button

.ui-theme.light .ui-button {
		background-color: @sign-in-form-submit-background-color;
    color: @sign-in-form-submit-text-color;
    border: 1px solid @sign-in-form-submit-background-border-color;
}

.ui-theme.light .ui-button:hover {
    background-color: @sign-in-form-submit-background-hover-color;
}


// form

// light

.ui-theme.light form.ui-form {
    background-image: radial-gradient(circle at 1% 1%, @sign-in-form-background-color, @sign-in-form-background2-color);
}

.ui-theme.light .ui-form input:not([type=submit]) {
    background-color: transparent;
    color: @sign-in-form-text-color;
}

.ui-theme.light .ui-form ::-webkit-input-placeholder {
	color: @sign-in-form-placeholder-color;
}

.ui-theme.light .ui-form input:not([type=submit]) {
    border-bottom: 1px solid @sign-in-form-border-color;
}

// digitalocean

// theme
.ui-theme.digitalocean {
	background-color: @oceanblue;
	font-family: "proxima-nova", helvetica;
	font-size: 17px;
}

.ui-theme.digitalocean a {
	color: @oceanblue;
}

// notice
.ui-theme.digitalocean .ui-notice {
	font-size: 15px;
	.failure {
		background-color: @mustardyellow;
		color: @blackmustardyellow;
	}
	.success {
		background-color: @coolishgreen;
		color: white;
	}
}

// button
.ui-theme.digitalocean .ui-button {
	font-size: 17px;
	border-radius: 3px;
	padding: 15px;
	&.success {
		background-color: @coolishgreen;
		color: white;
		&:hover {
			background-color: @dimcoolishgreen;
		}
	}
}

// forms
.ui-theme.digitalocean form.ui-form {
	background-color: white;
	color: @darkestgray;
	width: 66%;
	margin: 0 auto;
	padding: 40px;
	border-radius: 3px;
	input {
		width: 100%;
		&:not([type=submit]) {
			background-color: @nearwhite;
			color: black;
			font-size: 18px;
			border: 2px solid @shadednearwhite;
			border-radius: 3px;
			margin: 20px auto;
			padding: 15px;
		}	
	}
}

// footer
.ui-theme.digitalocean footer {
	margin: 20px auto;
	text-align: center;
}

.ui-theme.digitalocean.site footer {
	background-color: black;
	color: gray;
	font-size: 14px;
	dt {
		color: white;
	}
	a:hover {
		color: white;
	}
}
*/


/*
.page {
    font-family: Arial, Helvetica, sans-serif;
    color: white;
    background-color: #333;
    width: 100%;
    height: 100%;
    clip: auto;
    overflow: hidden;
    position: absolute;
}
*/


/* @hacks:
1: Add the correct box sizing in Firefox.
2: Show the overflow in Edge.
3: Remove the bottom border in Firefox <39.
4: Work around a Firefox bug where the transparent `button` background results in a loss of the default `button` focus styles.
5: Remove the margin in Firefox and Safari.
6: Show the overflow in Edge.
7: Remove the inheritance of text transform in Firefox.
8: Remove the inheritance of word-wrap in Safari.
9: Prevent a WebKit bug where (10) destroys native `audio` and `video` controls in Android 4.
10: Correct the inability to style clickable types in iOS and Safari.
11: Remove inner border and padding from Firefox, but don't restore the outline like Normalize.
12: Remove the default appearance of temporal inputs to avoid a Mobile Safari bug where setting a custom line-height prevents text from being vertically centered within the input.
13: Correct the text wrapping in Edge.
14: Add the correct vertical alignment in Chrome, Firefox, and Opera.
15: Correct the cursor style of increment and decrement buttons in Chrome.
16: Correct the outline style in Safari.
17: This overrides the extra rounded corners on search inputs in iOS so that our `.form-control` class can properly style them. Note that this cannot simply be added to `.form-control` as it's not specific enough. For details, see
18: Remove the inner padding in Chrome and Safari on macOS.
19: Correct the inability to style clickable types in iOS and Safari.
20: Change font properties to `inherit` in Safari.
21: Remove opacity in Firefox.
*/