$color_heading: #2c2e30;
$color_paragraph: #556066;
$color_gray: #b0bebf;
$color_white: white;
$color_link: #169eb5;
$color_purple: #8d66d8;
$color_code_token: #3bc5cc;
$color_hr: rgba(99,206,153,1);
$color_shadow: rgba(151,110,229,0.2);
$color_triangle_block: #41ade5;
$color_purple_shade: rgba(151,110,229,0.4);
$color_blue_shade: rgba(91, 201, 163, 1);
$color_blue_shade_2: rgba(58, 142, 206, 1);
$color_lt_blue: #eaf8f9;
$color_lt_yellow: #fff7d5;

//fonts

$heading-font: 'Muli-ExtraLight','HelveticaNeue-Light', 'Helvetica Neue Light', 'Helvetica Neue', Helvetica, Arial, 'Lucida Grande', sans-serif;
$main-font: 'Muli-Light','HelveticaNeue-Light', 'Helvetica Neue Light', 'Helvetica Neue', Helvetica, Arial, 'Lucida Grande', sans-serif;

//margins

$percent_lg: 12%;
$percent_md: 100px;
$percent_sm: 40px;

//mixins

$side-nav-width: 200px;
$top-nav-height: 100px;
$side-nav-padding-large: 10px;
$side-nav-padding-small: 30px;
$nav-breakpoint: 900px;


@mixin nav-large {
  @media screen and (min-width: #{$nav-breakpoint}) {
    @content;
  }
}

@mixin nav-small {
  @media screen and (max-width: $nav-breakpoint) {
    @content;
  }
}

//shared styles

%uppercase {
	text-transform: uppercase;
	font-weight: bold;
	letter-spacing: 0.1em;
}

%transition {
	-moz-transition: all .2s;
	-webkit-transition: all .2s;
	transition: all .2s;
  -o-transition: all .2s;
}

//Hide/show div on mobile

.mobile-hide {
	display: initial;

	@include nav-small {
  	display: none;
	}
}

.mobile-show {
	display: none;

	@include nav-small {
  	display: block;
	}
}

.mobile-grow {
  @include nav-small {
		width:100%;
	}
}

.hide {
  display: none;
}

.show  {
  display: block;
}

//Hide Global Message

#global-message {
	display: none;
}