/** ==================================================

bopthemes

	- Project: Brants
	- Version: 1.0
	- Last change: 06/08/2016

==========

TABLE OF CONTENT

	01. Import google fonts

	-- Basics and settings

	02. Basics
	03. Grid system
	04. Typography
	05. Links
	06. Blockquotes
	07. Buttons
	08. Forms
	09. Lists
	10. Code
	11. Tables
	12. Misc

	-- Elements

	13. Loader
	14. Header
	15. Sections
	16. Hero
	17. Grid
	18. Pagination
	19. Blog
	20. Social
	21. Footer
	22. Media queries

================================================== */





/** 01. Import google fonts */
/** ================================================== */

	
	@import url("https://fonts.googleapis.com/css?family=Open+Sans:300,400,600,700");




/** 02. Basic */
/** ================================================== */

	body {
		font-family: 'Open Sans', sans-serif;
		font-size: 16px;
		line-height: 1.6;
		color: #666;
		overflow-x: hidden;
		overflow-y: scroll;
		background: #fff;
		-webkit-font-smoothing: antialiased
	}

	*,
	::before,
	::after {
		margin: 0;
		padding: 0;
		outline: 0;
		border: 0;
		-webkit-box-sizing: border-box;
		-moz-box-sizing: border-box;
		box-sizing: border-box
	}

	::selection {
		color: #fff;
		background: #000
	}

	::-moz-selection {
		color: #fff;
		background: #000
	}





/** 03. Grid system */
/** ================================================== */

	.container {
		width: 960px;
		margin: 0 auto;
		position: relative
	}

	.row {
		margin-top: 0px;
	}

	.row:first-child {
		margin-top: 0
	}

	.column {
		float: left;
		padding-right: 15px;
		padding-left: 15px;
		position: relative
	}

	.column:first-child {
		padding-left: 0
	}

	.column:last-child {
		padding-right: 0
	}

	.column.col-1 {
		width: 10%
	}

	.column.col-2 {
		width: 16.666%
	}

	.column.col-3 {
		width: 25%
	}

	.column.col-4 {
		width: 33.333%
	}

	.column.col-5 {
		width: 41.666%
	}

	.column.col-6 {
		width: 50%
	}

	.column.col-7 {
		width: 58.333%
	}

	.column.col-8 {
		width: 66.666%
	}

	.column.col-9 {
		width: 70%;
		margin-left: 15%;
		margin-right:15%;
	}

	.column.col-10 {
		width: 83.333%
	}

	.column.col-11 {
		width: 91.666%
	}

	.column.col-12 {
		width: 100%
	}

	.column.offset-by-1 {
		margin-left: 8.333%
	}

	.column.offset-by-2 {
		margin-left: 16.666%
	}

	.column.offset-by-3 {
		margin-left: 25%
	}

	.column.offset-by-4 {
		margin-left: 33.333%
	}

	.column.offset-by-5 {
		margin-left: 41.666%
	}

	.column.offset-by-6 {
		margin-left: 50%
	}

	.column.offset-by-7 {
		margin-left: 58.333%
	}

	.column.offset-by-8 {
		margin-left: 66.666%
	}

	.column.offset-by-9 {
		margin-left: 70%
	}

	.column.offset-by-10 {
		margin-left: 83.333%
	}

	.column.offset-by-11 {
		margin-left: 91.666%
	}

	.container::after,
	.row::after,
	.clear::after {
		content: '';
		display: block;
		clear: both
	}

	.header-image {
		width: 100%;
		height: auto;
		background-color:#000;
		display: block;
		position: relative;
		float: left;
		clear: both;
		margin-top: 100;
	}



/** 04. Typography */
/** ================================================== */

	h1,
	h2,
	h3,
	h4,
	h5,
	{
		font-family: 'Open Sans', sans-serif;
		font-style: normal;
		color: #666;
		margin-top: 25px
	}

	

	h1:first-child,
	h2:first-child,
	h3:first-child,
	h4:first-child,
	h5:first-child,
	h6:first-child {
		margin-top: 0
	}

	h1.big-title {
		font-size: 80px;
		line-height: 1.125;
		font-weight: 400;
	}

	h1 {
		font-size: 60px;
		line-height: 1.2;
		font-weight: 400;
	}

	h2 {
		font-size: 48px;
		line-height: 1.25;
		font-weight: 400;
	}

	h3 {
		font-size: 42px;
		line-height: 1.28;
		font-weight: 300;

	}

	h4 {
		font-size: 36px;
		line-height: 1.35;
		font-weight: 400;
		text-align: center;
	}

	h5 {
		font-size: 28px;
		line-height: 1.45;
		font-weight: 300;
		text-align: center;
		padding-top: 5px;
	}

	h6 {
		font-size: 18px;
		line-height: 1.35;
		font-weight: 400 !important;
		font-family: 'Open Sans', sans-serif;
		font-style: normal;
		color: #8270B3;
		margin-top: 0px

	}

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

	p {
		margin-top: 25px;
		font-weight:300;
	}

	p:first-child {
		margin-top: 0
	}

	p.lead {
		font-size: 22px
	}

	.headline-about h4 {
		font-size: 36px;
		line-height: 1.35;
		font-weight: 400;
		text-align: left;
	}
	.intertitle {
		font-weight: 400;
		color: #8270B3;
		font-size: 16px;
	}

	p.credits {
		font-weight: 300;
		color: #b9b9b9;
		font-size: 12px;
		text-align: center;
		top: 0;
	}

	.language {
			color: #bbbdbf !important;
			padding-left: 20px;
	}

	.detail {
		font-size: 12px;
	}
	.bold {
		font-weight: 700;
		font-size:;
		margin-bottom: 10px;
	}

/** 05. Links */
/** ================================================== */

	a {
		text-decoration: none;
		color: inherit
	}

	a.link {
		color: #ae8f51
	}

	a.link:hover {
		color: #000
	}




/** 06. Blockquotes */
/** ================================================== */

	blockquote {
		margin-top: 25px;
		font-size: 18px;
		font-style: italic;
		color: #000;
		padding: 50px;
		background: #f7f7f7
	}

	blockquote:first-child {
		margin-top: 0
	}





/** 07. Buttons */
/** ================================================== */

	.btn,
	button,
	input[type="submit"],
	input[type="reset"],
	input[type="button"] {
		display: inline-block;
		height: 40px;
		padding: 0 40px;
		margin-top: 25px;
		font-family: 'Source Sans Pro';
		font-size: 16px;
		font-weight: 600;
		color: inherit;
		line-height: 38px;
		letter-spacing: .05px;
		background-color: transparent;
		border: 1px solid #e6e6e6;
		cursor: pointer
	}

	.btn:first-child,
	button:first-child,
	input[type="submit"]:first-child,
	input[type="reset"]:first-child,
	input[type="button"]:first-child {
		margin-top: 0
	}

	.btn.primary,
	button.primary,
	input[type="submit"].primary,
	input[type="reset"].primary,
	input[type="button"].primary {
		color: #fff;
		background-color: #ae8f51;
		border-color: #ae8f51
	}

	.btn.primary.outline,
	button.primary.outline,
	input[type="submit"].primary.outline,
	input[type="reset"].primary.outline,
	input[type="button"].primary.outline {
		color: #ae8f51;
		background-color: transparent;
		border-color: #ae8f51
	}

	.btn.dark,
	button.dark,
	input[type="submit"].dark,
	input[type="reset"].dark,
	input[type="button"].dark {
		color: #fff;
		background-color: #000;
		border-color: #000
	}

	.btn.dark.outline,
	button.dark.outline,
	input[type="submit"].dark.outline,
	input[type="reset"].dark.outline,
	input[type="button"].dark.outline {
		color: #000;
		background-color: transparent;
		border-color: #000
	}





/** 08. Forms */
/** ================================================== */

	form {
		margin-top: 25px
	}

	form:first-child {
		margin-top: 0
	}

	input[type="email"],
	input[type="number"],
	input[type="password"],
	input[type="search"],
	input[type="text"],
	input[type="tel"],
	input[type="url"],
	textarea,
	select {
		font-family: 'Source Sans Pro';
		font-size: 16px;
		width: 100%;
		height: 50px;
		padding: 0 15px;
		background: #fff;
		border: 1px solid #e6e6e6
	}

	input[type="email"]:focus,
	input[type="number"]:focus,
	input[type="password"]:focus,
	input[type="search"]:focus,
	input[type="text"]:focus,
	input[type="tel"]:focus,
	input[type="url"]:focus,
	textarea:focus,
	select:focus {
		border-color: #d9d9d9
	}

	textarea {
		padding: 15px;
		min-height: 100px;
		resize: none
	}

	label,
	legend {
		font-size: 14px;
		font-weight: 600
	}

	input[type="checkbox"],
	input[type="radio"] {
		display: inline
	}





/** 09. Lists */
/** ================================================== */

	ul,
	ol {
		margin-top: 25px
	}

	ul:first-child,
	ol:first-child {
		margin-top: 0
	}

	ul li,
	ol li {
		margin: 5px 0 0 20px;
		padding: 0 0 0 10px
	}

	ul ul,
	ol ul,
	ul ol,
	ol ol {
		margin: 15px 0 0 25px
	}





/** 10. Code */
/** ================================================== */

	code {
		display: inline-block;
		font-size: 90%;
		padding: 0 15px;
		color: inherit;
		margin: 0 5px;
		white-space: nowrap;
		text-shadow: 0 1px 0 rgba(255, 255, 255, .9);
		background: #f2f2f2
	}

	pre {
		margin-top: 25px
	}

	pre:first-child {
		margin-top: 0
	}

	pre code {
		display: block;
		padding: 25px 50px;
		white-space: pre
	}





/** 11. Tables */
/** ================================================== */

	table {
		width: 100%;
		max-width: 100%;
		margin-top: 25px;
		border-collapse: collapse;
		border-spacing: 0
	}

	table:first-child {
		margin-top: 0
	}

	table thead {
		border-bottom: 2px solid #000
	}

	table th,
	table td {
		padding: 10px 15px;
		text-align: left;
		border-bottom: 1px solid #e6e6e6
	}

	table th {
		font-weight: 600
	}

	table th:first-child,
	table td:first-child {
		padding-left: 0
	}

	table th:last-child,
	table td:last-child {
		padding-right: 0
	}





/** 12. Misc */
/** ================================================== */

	.float-right {
		float: right
	}

	.float-left {
		float: left
	}

	.text-center {
		text-align: center
	}

	.text-right {
		text-align: right
	}

	.text-left {
		text-align: left
	}

	.text-light {
		color: #fff
	}

	.text-color {
		color: #ae8f51
	}

	img {
		height: auto;
		max-width: 100%
	}

	.img-responsive {
		display: block;
		min-width: 100%;
		max-width: 100%
	}

.video {
    position: relative;
    padding-bottom: 56.25%;
    padding-top: 0px; 
    height: 0; 
    overflow: hidden;
}
.video iframe,
.video object,
.video embed
.video video {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

video::-internal-media-controls-download-button {
    display:none;
}

video::-webkit-media-controls-enclosure {
    overflow:hidden;
}

video::-webkit-media-controls-panel {
    width: calc(100% + 30px); /* Adjust as needed */
}



/** 13. Loader */
/** ================================================== */

	.loader {
		position: fixed;
		top: 0;
		right: 0;
		bottom: 0;
		left: 0;
		z-index: 9999;
		background-color: #fff
	}


	.loading {
		width: 30px;
		height: 30px;
		border-radius: 50%;
		position: absolute;
		top: 50%;
		left: 50%;
		margin: -15px 0 0 -15px ;
		border: 2px solid #9b7aaa;
		border-top: 4px solid transparent;
		-webkit-animation: loader-anim .7s infinite linear;
		animation: loader-anim .7s infinite linear
	}

	@-webkit-keyframes loader-anim {
		from {
			-webkit-transform: rotate(0deg);
			-moz-transform: rotate(0deg);
			-ms-transform: rotate(0deg);
			-o-transform: rotate(0deg);
			transform: rotate(0deg)
		}

		to {
			-webkit-transform: rotate(360deg);
			-moz-transform: rotate(360deg);
			-ms-transform: rotate(360deg);
			-o-transform: rotate(360deg);
			transform: rotate(360deg)
		}

	}

	@keyframes loader-anim {
		from {
			-webkit-transform: rotate(0deg);
			-moz-transform: rotate(0deg);
			-ms-transform: rotate(0deg);
			-o-transform: rotate(0deg);
			transform: rotate(0deg)
		}

		to {
			-webkit-transform: rotate(360deg);
			-moz-transform: rotate(360deg);
			-ms-transform: rotate(360deg);
			-o-transform: rotate(360deg);
			transform: rotate(360deg)
		}

	}





/** 14. Header */
/** ================================================== */

	.site-header {
		width: 100%;
		height: 90px;
		position: fixed;
		top: 0;
		left: 0;
		background: #fff;
		z-index: 1000;
		-webkit-transition: all .3s ease-in-out;
		-moz-transition: all .3s ease-in-out;
		-ms-transition: all .3s ease-in-out;
		-o-transition: all .3s ease-in-out;
		transition: all .3s ease-in-out;
	}

	.site-header.resized {
		height: 80px
	}

	.header-logo a {
		font-family: 'Squada One';
		font-size: 28px;
		color: #000;
		line-height: 120px
	}

	.header-logo img {
		height: 80px;
		margin-top: 5px
	}

	.header-logo a,
	.header-logo img {
		-webkit-transition: all .3s ease-in-out;
		-moz-transition: all .3s ease-in-out;
		-ms-transition: all .3s ease-in-out;
		-o-transition: all .3s ease-in-out;
		transition: all .3s ease-in-out
	}

	.site-header.resized .header-logo a {
		line-height: 80px
	}

	.site-header.resized .header-logo img {
		margin-top: 0px
	}

	.trigger-nav {
		height: 30px;
		margin-top: 30px;
		cursor: pointer
	}

	.trigger-nav {
		-webkit-transition: all .3s ease-in-out;
		-moz-transition: all .3s ease-in-out;
		-ms-transition: all .3s ease-in-out;
		-o-transition: all .3s ease-in-out;
		transition: all .3s ease-in-out
	}

	.site-header.resized .trigger-nav {
		margin-top: 25px
	}

	.burger-icon {
		width: 30px;
		height: 23px;
		position: relative;
		margin-top: 5px
	}

	.icon-bar {
		width: 100%;
		height: 2px;
		position: absolute;
		right: 0;
		background: #612E89;
	}

	.icon-bar.top {
		top: 0
	}

	.icon-bar.middle {
		top: 50%;
		width: 100%;
		margin-top: -1px
	}

	.icon-bar.bottom {
		bottom: 0
	}

	.icon-bar {
		-webkit-transition: all .3s ease-in-out;
		-moz-transition: all .3s ease-in-out;
		-ms-transition: all .3s ease-in-out;
		-o-transition: all .3s ease-in-out;
		transition: all .3s ease-in-out
	}

	.trigger-nav.close .icon-bar.top {
		background: #bdbdbd;
		top: 50%;
		margin-top: -1px;
		-webkit-transform: rotate(-45deg);
		-moz-transform: rotate(-45deg);
		-ms-transform: rotate(-45deg);
		-o-transform: rotate(-45deg);
		transform: rotate(-45deg);
	}

	.trigger-nav.close .icon-bar.middle {
		width: 0;
		opacity: 0;
	}

	.trigger-nav.close .icon-bar.bottom {
		background: #bdbdbd;
		bottom: 50%;
		margin-bottom: -1px;
		-webkit-transform: rotate(45deg);
		-moz-transform: rotate(45deg);
		-ms-transform: rotate(45deg);
		-o-transform: rotate(45deg);
		transform: rotate(45deg);
	}

	.header-nav {
		height: 30px;
		margin-right: 50px;
		margin-top: 30px;
		visibility: hidden;
		opacity: 0;
		-webkit-transition: all .3s ease-in-out;
		-moz-transition: all .3s ease-in-out;
		-ms-transition: all .3s ease-in-out;
		-o-transition: all .3s ease-in-out;
		transition: all .3s ease-in-out
	}

	.header-nav.visible {
		visibility: visible;
		opacity: 1
	}

	.site-header.resized .header-nav {
		margin-top: 25px
	}

	.menu {
		list-style: none
	}

	.menu li {
		display: inline-block;
		margin: 0 0 0 25px;
		padding: 0;
		line-height: 30px;
		position: relative;
		opacity: 0;
		top: -50px;
		-webkit-transition: all .3s ease-in-out;
		-moz-transition: all .3s ease-in-out;
		-ms-transition: all .3s ease-in-out;
		-o-transition: all .3s ease-in-out;
		transition: all .3s ease-in-out
	}

	.menu li:first-child {
		margin-left: 0
	}

	.menu li.show-item {
		opacity: 1;
		top: 0
	}

	.menu li a {
		font-weight: 400
	}

	.menu li a:hover {
		color: #9b7aaa;
		-webkit-transition: all .3s ease-in-out;
		-moz-transition: all .3s ease-in-out;
		-ms-transition: all .3s ease-in-out;
		-o-transition: all .3s ease-in-out;
		transition: all .3s ease-in-out
	}
	.menu li a.active {
		color: #9b7aaa
	}



/** 15. Sections */
/** ================================================== */

	.main-content {
		padding: 20px 0 0;
		width:100%;
		position: relative;
		display: block;
		clear: both;
		float: left;
	}
	.project-title {
		padding-top: 80px;
	}

	section,
	.section {
		margin-top: 50px;
		margin-bottom: 40px;
		position: relative;
		clear: both;
	}


	.about {
		margin-top: 50px;
	}

	.headline-about {
		margin-top: 90px;
	}

	.about-icon{
		height: 65px;
	}

	.about-image{
		height: 85px;
	}
	

	.aboutskills{
			padding-bottom: 20px;
			padding-top: 20px;
			text-align: center !important;
		}

	.aboutexperience {
			padding-bottom: 20px;
			padding-left: 40px;
			padding-top: 30px;
			font-weight: 300 !important;
		}

	.portfolio {
		margin-top: 70px;
		width:100%;
		overflow: hidden;
	}

	.stroke-gray {
		border-bottom: solid 1px #bdbdbd;
		width: 100%;
	}

	.header-visual {
		padding-top: 40px;
	}


/** 16. Hero */
/** ================================================== */

	.hero {
		position: relative
	}

	.hero:first-child {
		margin-top: 0
	}

	.hero-image {
		position: absolute;
		top: 0;
		right: 0;
		bottom: 0;
		left: 0;
		z-index: 1
	}





/** 17. Grid */
/** ================================================== */

	.entry {
		position: relative;
		overflow: hidden;
	}

	.entry-image,
	.entry-content {
		position: absolute;
		top: 0;
		right: 0;
		bottom: 0;
		left: 0;
		z-index: 1
	}

	.entry-content.hidden {
		background: rgba(155, 122, 170, .95);
		visibility: hidden;
		opacity: 0
	}

	.entry-content {
		-webkit-transition: all .3s ease-in-out;
		-moz-transition: all .3s ease-in-out;
		-ms-transition: all .3s ease-in-out;
		-o-transition: all .3s ease-in-out;
		transition: all .3s ease-in-out
	}

	.entry:hover .entry-content.hidden {
		visibility: visible;
		opacity: 1
	}

	.entry-desc {
		position: absolute;
		top: 43%;
		right: 50px;
		left: 40px;
		z-index: 1
	}

	.entry-desc.bottom-desc {
		top: 0;
		bottom: 50px
	}

	.entry-cat {
		text-transform: uppercase;
		font-size: 14px;
		font-weight: 400;
		color: rgba(255, 255, 255, .65);
		text-align: center;

	}

	.entry-title {
		margin: 0;
		color: #fff;
		font-weight: 300;

	}

	.entry.team-entry .entry-cat {
		color: #fff
	}

	.stroke-divide {
		border-bottom: solid 1.5px rgba(255,255,255, 0.3);
		border-spacing: 0 50px;
		height: 5px;
		width: 90px;
		margin: auto;
	}


/** 18. Pagination */
/** ================================================== */

	.prev-pag,
	.next-pag {
		max-width: 240px;
		width: 15%;
		position: relative;
	}
	.prev-next-pagination a {
		width: 120px;
		border: solid 1px #9b7aaa;
		border-radius: 7px;
		padding: 10px;
		font-weight: 00;
		text-align: center;
		font-size: 18px;
		font-weight: 400;
		color: #9b7aaa !important;
		font-family: 'Open Sans', sans-serif;
	}
	.prev-next-pagination a:hover {
		background-color: #9b7aaa;
		color: #fff !important;
		font-weight: 400;
		border-radius: 7px;
		font-family: 'Open Sans', sans-serif;
		-webkit-transition: all .5s ease-in-out;
		-moz-transition: all .5s ease-in-out;
		-ms-transition: all .5s ease-in-out;
		-o-transition: all .5s ease-in-out;
		transition: all .5s ease-in-out
	}

	.prev-pag .icon,
	.next-pag .icon {
		display: none;
		width: 50px;
		height: 30px;
		position: relative
		margin:0;
		display: block;
	}

	.prev-pag .icon::before,
	.next-pag .icon::before,
	.prev-pag .icon::after,
	.next-pag .icon::after {
		content: '';
		width: 15px;
		height: 2px;
		position: absolute;
		background: #9b7aaa;
	}

	.prev-pag .icon::before,
	.next-pag .icon::before {
		top: 0;
		margin-top: 9px
	}

	.prev-pag .icon::after,
	.next-pag .icon::after {
		bottom: 0;
		margin-bottom: 9px
	}

	.prev-pag .icon::before,
	.next-pag .icon::after {
		-webkit-transform: rotate(-50deg);
		-moz-transform: rotate(-50deg);
		-ms-transform: rotate(-50deg);
		-o-transform: rotate(-50deg);
		transform: rotate(-50deg)
	}

	.prev-pag .icon::after,
	.next-pag .icon::before {
		-webkit-transform: rotate(50deg);
		-moz-transform: rotate(50deg);
		-ms-transform: rotate(50deg);
		-o-transform: rotate(50deg);
		transform: rotate(50deg)
	}

	.next-pag .icon::before,
	.next-pag .icon::after {
		right: 0
	}

	.header-title {
		position: relative;
		width: 70%;
		max-width: 1000px;
		display: block;
		text-align: center;
	}



/** 19. Blog */
/** ================================================== */

	.blog {
		margin-right: 50px;
		margin-left: 50px
	}

	.entry-post {
		background: #f2f2f2
	}

	.post-image,
	.post-thumbnail {
		padding-top: 50px
	}

	.post-image:first-child,
	.post-thumbnail:first-child {
		padding-top: 0
	}

	.entry-post .entry-header {
		padding: 50px 50px 0
	}

	.entry-post .entry-header .entry-meta span {
		display: inline-block;
		margin-left: 15px;
		font-size: 14px;
		color: #999
	}

	.entry-post .entry-header .entry-meta span:first-child {
		margin-left: 0
	}

	.entry-post .entry-header .entry-meta span i {
		margin-right: 5px
	}

	.entry-post .entry-header .entry-title {
		color: #000
	}

	.entry-sumary {
		padding: 25px 50px 50px
	}

	.entry-post.quote-post {
		background: #000
	}

	.entry-post.quote-post::before {
		font-family: FontAwesome;
		content: '\f10d';
		font-size: 80px;
		line-height: 1em;
		color: rgba(255, 255, 255, .2);
		position: absolute;
		top: 25px;
		left: 25px
	}

	.entry-post.quote-post .entry-header,
	.entry-post.quote-post .entry-sumary {
		position: relative;
		z-index: 1
	}

	.entry-post.quote-post .entry-header .entry-title {
		color: #fff
	}

	.entry-post.single-post {
		background: 0
	}

	.entry-post.single-post .entry-header {
		padding-left: 0
	}

	.entry-post.single-post .entry-header:first-child {
		padding-top: 0
	}

	.entry-post.single-post .entry-sumary {
		padding: 50px 0 0
	}

	.widget {
		padding: 50px 0;
		border-top: 5px solid #f2f2f2
	}

	.widget:first-child {
		border-top: 0;
		padding-top: 0
	}

	.widget-header {
		padding-bottom: 25px
	}

	.widget.recent-posts ul {
		list-style: none
	}

	.widget.recent-posts ul li {
		margin: 25px 0 0 0;
		padding: 0
	}

	.widget.recent-posts ul li:first-child {
		margin-top: 0
	}

	.widget.recent-posts ul li .entry-header {
		padding: 15px 25px
	}





/** 20. Social */
/** ================================================== */

	.social-list {
		list-style: none
	}

	.social-list li {
		display: inline-block;
		position: relative;
		margin: 0 0 0 25px;
		padding: 0
	}

	.social-list li:first-child {
		margin-left: 0
	}

	.social-list li a {
		color: inherit
	}

	.social-list li a:hover {
		color: #000
	}



/** 21. Footer */
/** ================================================== */

	.site-footer {
		padding-bottom: 25px;
		margin-top: 70px;
		position: relative
	}

	.site-footer .copy {
		font-size: 14px;
		padding-top:10px;
		padding-bottom: 10px;
	}





/** 22. Media queries */
/** ================================================== */

	@media (max-width:1024px) {
		.container {
			width: 90%
		}

		.language {
			padding-left: 20px
		}

	}

	@media (max-width:770px) {

		h1 {
			font-size: 54px
		}

		h2 {
			font-size: 48px
		}

		h3 {
			font-size: 42px
		}

		h4 {
			font-size: 34px
		}

		h5 {
			font-size: 30px
		}

		h6 {
			font-size: 24px
		}
		
		.language {
			padding-left: 20px
		}

		section,
		.section {
			margin-top: 40px;
			margin-bottom: 30px;
			position: relative;
			clear: both;
		}

	}
	@media (max-width:769px) {

		h1 {
			font-size: 48px
		}

		h2 {
			font-size: 42px
		}

		h3 {
			font-size: 36px
		}

		h4 {
			font-size: 28px
		}

		h5 {
			font-size: 24px
		}

		h6 {
			font-size: 18px
		}

		.language {
			padding-left: 0px
		}

		body {
			overflow-y: auto
		}

		.container {
			width: 80%
		}
		.column {
		width: 100% !important;
		margin: 0 !important;
		padding: 0;
		margin-top: 25px
		}

		.about-icon{
		height: 100px;
		}

		.about-image{
		height: 150px;
		}

		img.about-icon img.about-image {
    	display: block;
    	margin: 0 auto;
		}

		.aboutskills{
			padding-bottom: 50px;
			padding-top: 20px;
			text-align: center !important;
		}

		.aboutexperience {
			padding-bottom: 20px;
			padding-top: 30px;
			padding-left: 0px;
		}

		.column:first-child {
			margin-top: 0
		}

		.header-nav {
			height: 100% !important;
			position: fixed;
			top: 90px;
			right: 0;
			left: 0;
			margin: 0;
			padding: 40px 10%;
			background: rgba(255, 255, 255, 0.95);
			-webkit-transition: all .0s ease-in-out;
			-moz-transition: all .0s ease-in-out;
			-ms-transition: all .0s ease-in-out;
			-o-transition: all .0s ease-in-out;
			transition: all .0s ease-in-out
		}

		.site-header.resized .header-nav.visible {
			top: 90px;
			margin-top: 0;

		}

		.menu li {
			display: block;
			margin: 30px 0 0 0;
			top: 0;
			font-size: 40px;
			line-height: 75px;
			text-align: center;
			-webkit-transition: all .6s ease-in-out;
			-moz-transition: all .6s ease-in-out;
			-ms-transition: all .6s ease-in-out;
			-o-transition: all .6s ease-in-out;
			transition: all .6s ease-in-out
		}

		.menu li:first-child {
			margin-top: 0
		}

		.prev-pag .icon,
		.next-pag .icon {
			display: block
		}

		.blog-sidebar {
			display: none
		}


	}

	@media (max-width:560px) {


		h1 {
			font-size: 42px
		}

		h2 {
			font-size: 36px
		}

		h3 {
			font-size: 28px
		}

		h4 {
			font-size: 24px
		}

		h5 {
			font-size: 20px
		}

		h6 {
			font-size: 18px
		}

		.language {
			padding-left: 0px
		}


		.blog {
			margin-right: 10%;
			margin-left: 10%
		}

		.entry-post .entry-header,
		.entry-post.quote-post .entry-sumary {
			padding: 25px
		}

		.entry-post .entry-header .entry-meta span {
			display: block;
			margin: 0
		}

		.entry-post .entry-header .entry-title {
			margin-top: 15px
		}

		.entry-sumary {
			display: none
		}

		.entry-post.single-post .entry-header {
			padding: 25px 0
		}

		.entry-post.quote-post .entry-sumary,
		.entry-post.single-post .entry-sumary {
			display: block
		}

		.entry-post.single-post .entry-header .entry-meta span {
			display: block;
			margin: 0;
			padding: 5px 15px;
			background: #f2f2f2
		}

		.social-list li {
			display: block;
			position: relative;
			margin: 5px 0 0 0;
			padding: 0
		}

		.social-list li:first-child {
			margin-top: 0
		}

		.social-list li a {
			display: block;
			text-align: center;
			font-size: 14px;
			padding: 5px;
			color: inherit;
			background: #f2f2f2
		}

		.social-list li a:hover {
			color: #000
		}

	}

	@media (max-width:320px) {
		
		.language {
			padding-left: 0px
		}

		.blog {
			margin-right: 0;
			margin-left: 0
		}

		section,
		.section {
			margin-top: 30px;
			margin-bottom: 20px;
			position: relative;
			clear: both;
		}

	}

/* This beautiful CSS-File has been crafted with LESS (lesscss.org) and compiled by simpLESS (wearekiss.com/simpless) */