/**
 * --------------------------------------------------------------------------------
 * Main Stylesheet
 * --------------------------------------------------------------------------------
*/

.transition(@property) {
    -webkit-transition: @property;
    -ms-transition: @property;
    transition: @property;
}

@primary-color: #43c6ac;
@secondary-color: #f8ffae;
@white-color: #fff;
@dark-color: #444;
@border-color: #e0e0e0;
@footer-bg-color: #282f35;

@font-size: 1.6rem;
@line-height: @font-size*1.5;
@theme-margin: @line-height*3;

/**
 *
 * #.# General
 *
 */
ul,
ol {
	margin: 0;
	padding: 0;
	list-style-position: inside;
}

a {
	text-decoration: none;
	color: @primary-color;
	transition: all .3s ease;
}

a, a:hover, a:focus {
	outline: 0;
    @include transition( all 300ms ease );
}

/* Text selection color */

/* Mozilla based browser */
::-moz-selection {
	background-color: @primary-color;
	color: #fff;
}

/* Opera browser */
::-o-selection {
	background-color: @primary-color;
	color: #fff;
}

/* Internet Explorer browser*/
::-ms-selection {
	background-color: @primary-color;
	color: #fff;
}

/* Chrome and safari browser */
::-webkit-selection {
	background-color: @primary-color;
	color: #fff;
}

/* Default */
::selection {
	background-color: @primary-color;
	color: #fff;
}

.right {
	float: right;
}

.dark {
	background-color: #f9f8f8;
}

.center {
	text-align: center;
}

.bold {
	font-weight: 700;
}

.radius {
	border-radius: .3rem;
}

.radius-big {
    border-radius: 1.2rem;
}

.shadow {
	box-shadow: 0 0 4rem rgba(42, 49, 57, 0.05);
}

.slick-dots li.slick-active button:before {
	color: @white-color;
}

.slick-dots li button:before {
	font-size: @font-size*3;
	color: @white-color;
}

.parallax {
	background-attachment: fixed;
	background-position: center;
	background-repeat: no-repeat;
	background-size: cover;
}

.vertical-align {
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex !important; /** Overrides other display properties to make the contents align vertically **/

	align-items: center;
}

.bordered {
	border-bottom: 1px solid @border-color;
}

.underline {
	display: inline-block;
	margin-bottom: .6rem;
	height: .2rem;
	width: 5rem;
	background-color: @primary-color;
}

.container {
	padding: @theme-margin 0;
}

.u-full-width {
	padding: @theme-margin 0;

	.container {
		padding: 0;
	}
}

.columns,
.column {
	padding: 0 @font-size;
}

/**
 *
 * #.# Top Bar
 *
 */

.top-bar {
	background-color: @primary-color;
	color: @white-color;

	.row {
		padding: 0;
	}

	span,
	p {
		font-size: 1.4rem;
		font-weight: 700;
		margin-bottom: 0 !important;
		line-height: 3.5rem;
	}

	.left {
		span {
			margin-right: 1rem;
		}
	}

	.right {
		text-align: right;
	}

	.office-hour {
		&:before {
			content: "\f017";
			font: normal 400 normal 1.6rem/1 FontAwesome;
			margin-right: .4rem;
			vertical-align: middle;
		}
	}

	.phone {
		&:before {
			content: "\f095";
			font: normal 400 normal 1.6rem/1 FontAwesome;
			margin-right: .4rem;
			vertical-align: middle;
		}
	}

	.address {
		&:before {
			content: "\f041";
			font: normal 400 normal 1.6rem/1 FontAwesome;
			margin-right: .4rem;
			vertical-align: middle;
		}
	}

	.e-mail {
		&:before {
			content: "\f003";
			font: normal 400 normal 1.6rem/1 FontAwesome;
			margin-right: .4rem;
		}
	}

}

.social-icons {
	float: right;
	margin-left: 1rem;
	line-height: 3.5rem;

	li {
		display: inline-block;
		margin-right: 1rem;
		list-style-type: none;
	}

	.social-icon {
		&:after {
	    	color: @white-color;
	    	font: normal normal normal 1.6rem/1 FontAwesome;
		}
	}

	.facebook:after {
    	content: "\f09a";
	}

	.twitter:after {
	    content: "\f099";
	}

	.youtube:after {
		content: "\f16a";
	}

	.pinterest:after {
		content: "\f0d2";
	}

	.linked-in:after {
		content: "\f08c";
	}

	.instagram:after {
		content: "\f16d";
	}
}

/**
 *
 * #.# Header
 *
 */

/* Header Container */

.site-header {
	position: relative;
	background-color: @white-color;

	.row {
		padding: 0;
	}
}

header,
footer,
.ct-bottom-bar,
.top-bar {
	.container {
		padding: 0;
	}
}

.site-title {
	margin: 2rem 0px;

	a {
		display: -webkit-flex;
		display: -moz-flex;
		display: -ms-flex;
		display: -o-flex;
		display: flex;
	}
}

/* Small devices (landscape phones, less than 768px) */
@media (max-width: 767.98px) {
	.vertical-align {
		display: -webkit-flex;
		display: -moz-flex;
		display: -ms-flex;
		display: -o-flex;
		display: block !important; /** Overrides other display properties to make the contents align vertically **/

		align-items: center;
	}
}

.back-to-top {
  position: fixed;
  right: 2%;
  bottom: 4%;
  display: none;

	span {
		background-color: white;
		color: #555555;
		font-size: 22px;
		font-weight: 900;
		text-align: center;
		line-height: 39px;
		border-radius: 50%;
		width: 40px;
		height: 40px;
		box-shadow: 0px 2px 16px 0px rgba(0,0,0,0.16);
	}
}
