/*fix issues with IE*/
.img-thumbnail {width: auto;}


/*fonts*/

	/*font type for my name*/
	@font-face
	{
		font-family: V-de-vacia-deFharo;
		src: url(../fonts/V-de-vacia-deFharo.ttf);
	}

	/*Job Title*/
	@font-face
	{
		font-family: kristaly;
		src: url(../fonts/kristaly/KristalyPersonalUse.ttf);
	}


	.language-icons 
	{
	    font-size: calc(30px + (40 - 30) * ((100vw - 300px) / (1600 - 300)));
	    padding-top:15px;
	}
	.hex 
	{
	    width: 70px;
	    height: 70px;
	    background: #eee;
	    /*position: relative;*/
	}
	.hex:before
	{
	    content:"";
	    /*position: absolute;*/
	}
	.hex:before 
	{
		  top: 4px;  /* border width */
		  left: 4px;  /* border width */
		  height: calc(100% - 8px);  /* 100% - (2 * border width) */
		  width: calc(100% - 8px);  /* 100% - (2 * border width) */
		  background: #eee;
	}
	.hex, .hex:before
	{
		-webkit-clip-path: polygon(50% 0%, 100% 25%, 100% 75%, 50% 100%, 0% 75%, 0% 25%);
  		clip-path: polygon(50% 0%, 100% 25%, 100% 75%, 50% 100%, 0% 75%, 0% 25%);
	}


/*header*/
	#My-Name
	{
		color: #337ab7;
		font-family: V-de-vacia-deFharo;
		/*20 min 40 max*/
		font-size: calc(28px + (40 - 28) * ((100vw - 300px) / (1600 - 300)));
		margin-left: 5px;
		
	}

	#Job-Title
	{
		font-family: kristaly;
		/*14 min 30 max*/
		font-size: calc(14px + (30 - 14) * ((100vw - 300px) / (1600 - 300)));
		margin-left: 5px;		
	}

/*heading formatings*/
	h1.white-bkg-H1
	{
		color: #337ab7;
		clear:left;
		background: white;
		box-shadow: 5px 5px 18px 0px rgba(0,0,0,0.75);
		border-radius: 3px;
		display: inline-block;
		padding:10px;
		margin:10px;
		text-shadow: #fff 0 1px 1px, #bfbfbf 0 2px 2px;
	}

	.subheading
	{
		margin-left:10px;
	}

	h1
	{
		font-size: calc(24px + (40 - 24) * ((100vw - 300px) / (1600 - 300)));
	}


	h2
	{
		font-size: calc(14px + (30 - 14) * ((100vw - 300px) / (1600 - 300)));
	}

	h3
	{
		font-size: calc(14px + (25 - 14) * ((100vw - 300px) / (1600 - 300)));
	}

/*General formating*/
	a.text-a
	{
		color:#004887;
		text-decoration: underline;
	}

	a.text-a:hover
	{
		cursor:pointer;
	}
	.c-wh
	{
		color:white;
	}

	.main-section
	{
		background:#eee;
		padding: 15px 15px 10px 15px;
	}

	video
	{
		display: block;
		margin:0 auto;
	}

	#skils-overview
	{
		margin-bottom: 10px;
	}


	hr.section-mark 
	{
		overflow: visible;
	    padding: 0;
	    border: none;
	    border-top: medium double #333;
	    color: #333;
	    text-align: center;
	}
	hr.section-mark:after 
	{
		content: "§";
	    display: inline-block;
	    position: relative;
	    top: -0.7em;
	    font-size: 1.5em;
	    padding: 0 0.25em;
	    background: white;
	}

	.btn-primary, .btn.btn-primary:hover, .btn.btn-primary:focus
	{
		background: #337ab7;
	}
/*raised card*/
	.raised-card
	{
		color: #337ab7;
		clear:left;
		background: white;
		box-shadow: 5px 5px 18px 0px rgba(0,0,0,0.75);
		border-radius: 3px;
		display: inline-block;
		font-size: 1.2em;
		padding:10px;
		margin: 0px 20px 0px 20px;
		width:95%;
	}

	.raised-card > li
	{
		margin-left:20px;
	}

	.raised-card-header
	{
		color: #337ab7;
		text-align: center;
		text-shadow: #fff 0 1px 1px, #bfbfbf 0 2px 2px;
		font-weight: bold;
	}

	.raised-card-subheader
	{
		margin-top:10px;
		font-weight: bold;
		text-align: center;
		text-shadow: #fff 0 1px 1px, #bfbfbf 0 2px 2px;
	}

	.raised-card-description
	{
		margin: 15px 10px 10px 10px;
	}
/*Banners*/
	.Grey-Banner
	{
		background:#eee;
		border-color: #999999;
		border-width: 1px;
	}

	.Blue-Banner
	{
		background: #337ab7;
		color:white;
		margin-top: 3px;
	}

/*progress bars*/
	.progress-bar-primary
	{
		background: #337ab7;
	}

	.progress
	{
		font-size: calc(14px + (20 - 14) * ((100vw - 300px) / (1600 - 300)));
		height: calc(20px + (25 - 20) * ((100vw - 300px) / (1600 - 300)));
	}

/*buttons*/
	.btn.btn-primary-hover:hover, .btn.btn-primary-hover:focus
	{
	  	background: #004887;
		box-shadow: 0px 0px 5px #000000;
  		z-index: 2;
  		-webkit-transition: all 200ms ease-in;
  		-webkit-transform: scale(1.08);
  		-ms-transition: all 200ms ease-in;
		-ms-transform: scale(1.08);
		-moz-transition: all 200ms ease-in;
		-moz-transform: scale(1.08);
		transition: all 200ms ease-in;
		transform: scale(1.08);
	}

	.rm-btn-border
	{
		border-color: #337ab7;
	}


	.thumbnail-landscape-images
	{
		width:200px;
		border: 1px solid black;
	}

	.thumbnail-landscape-images-hover:hover, .thumbnail-landscape-images-hover:focus
	{
		background: #004887;
		box-shadow: 0px 0px 5px #000000;
		cursor:pointer;
		-webkit-transition: all 200ms ease-in;
		-webkit-transform: scale(3.08) translate(50px,0);
		-ms-transition: all 200ms ease-in;
		-ms-transform: scale(3.08) translate(50px,0);
		-moz-transition: all 200ms ease-in;
		-moz-transform: scale(3.08) translate(50px,0);;
		transition: all 200ms ease-in;
		transition: all 200ms ease-in;
		transform: scale(3.08) translate(-20px,20px);
		z-index: 2;
	}

/*images*/
	.landscape-images
	{
		margin-top:5%;
		width:calc(200px + (600 - 200) * ((100vw - 300px) / (1600 - 300)));
	}

/*carousel*/
	.carousel
	{
		background-color: #337ab7;
		color:white;
		margin-top: 5px;
	}

	.carousel-item
	{
		margin-top: 10px;
	}

	.carousel-inner
	{
		padding-bottom:3em;
	}

	.carousel-row
	{
		margin-left:50px;
		margin-right:50px;
	}

	.carousel-indicators > li
	{
		border: 1px solid black;
		background-color: #337ab7;
	}



/*footer*/
	footer
	{
		color:white;
		background: #337ab7;

	}