@import url("https://use.typekit.net/vhg3hbo.css");

$theme1: #000000;
$theme2: #dddddd;
$theme3: #1e384b;
$theme4: #a8acb4;
$theme5: #2dccd3;

$sm: 768px;
$md: 992px;
$lg: 1024px;
$hd: 1200px;
$hhd: 1440px;
$max: 1600px;

%transition {
	-webkit-transition: all 0.3s ease;
	transition: all 0.3s ease;
}

%transition2 {
	-webkit-transition: all 0.8s ease;
	transition: all 0.8s ease;
}

@mixin flex1() {
	display: flex;
	justify-content: space-between;
	align-items: center;
	flex-wrap: wrap;
}

@mixin heading1() {
	@extend %font5;
	font-size: 34px;
	margin-bottom: 25px;
	position:relative;
	padding-bottom:15px;
	&:before{
		content:'';
		position:absolute;
		background: #000;
		width: 40px;
		height:3px;
		bottom:0;
		left:0;
		@media only screen and (min-width: $md) {
			width: 45px;
			height:5px;
		}
	}
	@media only screen and (min-width: $md) {
		font-size: 54px;
		margin-bottom: 30px;
		padding-bottom:25px;
		line-height:1.1;
	}
	@media only screen and (min-width: 1900px) {
		font-size: 58px;
	}
}

@mixin heading2() {
	@extend %font5;
	font-size: 34px;
	margin-bottom: 30px;
	position:relative;
	@media only screen and (min-width: $md) {
		font-size: 54px;
		margin-bottom: 40px;
		line-height:1.1;
	}
	@media only screen and (min-width: 1900px) {
		font-size: 58px;
	}
}

@mixin heading3() {
	@extend %font5;
	font-size: 16px;
	letter-spacing:0.5px;
	margin-bottom: 20px;
	@media only screen and (min-width: $md) {
		font-size: 17px;
		line-height: 1.3;
	}
}


@font-face {
	font-family: 'Karla Light';
	font-style: normal;
	font-weight: normal;
	src: local('Karla Light'), url('../fonts/Karla-Light.woff') format('woff');
}

@font-face {
	font-family: 'Karla Medium';
	font-style: normal;
	font-weight: normal;
	src: local('Karla Medium'), url('../fonts/Karla-Medium.woff') format('woff');
}

@font-face {
	font-family: 'Karla SemiBold';
	font-style: normal;
	font-weight: normal;
	src: local('Karla SemiBold'), url('../fonts/Karla-SemiBold.woff') format('woff');
}



%font1 {
    font-family: 'Karla Light', sans-serif;
}
%font2 {
    font-family: 'Karla Medium', sans-serif;
}

%font3 {
    font-family: 'Karla SemiBold', sans-serif;
}
%font4 {
    font-family: freight-big-pro, serif;
	font-weight: 400;
	font-style: normal;
}
%font5 {
    font-family: freight-big-pro, serif;
	font-weight: 700;
	font-style: normal;
}