*{
	margin:0px;
	padding:0px;
	font-family:arial, verdana, Times, serif;
	font-weight:normal;
}

body{
	background: url("../images/bg_img.jpg") no-repeat center center fixed;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
}
a{
	color:#fff;
}

/* input,  textarea{
	color:#6A572F; 	font-family: Verdana; font-size:13px;
}
input
{
	padding:6px 24px 6px 24px;
	border:none;
	background:#6A572F; color:#E8E7D3;
	font-family:'big caslon',georgia,'times new roman',serif;
	letter-spacing:2px;
	cursor:pointer;
	text-transform:uppercase;
} */

input{margin:2px; height:30px; padding-left:3px; font-size:1rem;}
button{ border:0; text-decoration:none; padding:6px; font-size:1rem; background-color:rgba(211, 211, 211, .1); border:1px dotted; color:white; margin:0px;}
.login_btn{
	display:inline-block;
}
.login_btn button{
	width:173px;
}
@media screen and (max-width: 770px){
	.login_btn{
		display:block;
	}
	.login_btn button{
		width:179px;
		margin-left:3px;
	}
	.login_btn::before{
		content: "\A";
		white-space: pre;
	}
}

#main_container{
	margin: 0px auto;
	width:80%;
	max-width:1024px;
	border:0px solid #cc0000;
}

#title{
	color:#fff;
	height:5px;
	width:80%;
	margin: 0px auto;
	border:0px solid #cc0000;
}

#content_container{
	margin:0px auto;
	margin-bottom:20px;
	padding-top:50px;
	width:100%;
	/** min-height:230px; **/
	border:0px solid #cc0000;
	background-repeat: repeat;
}

.content_box{
	color:#fff;
	border:1px solid #000;
	background-color: rgba(0, 0, 0, .85);
	margin-bottom:20px;
}

.quick_link_date{
	font-size:0.6rem;
}
@media screen and (max-width: 770px) {
	.quick_link_date{
		display:none;
	}
	/* .quick_link_date::before{
		content: "\A";
		white-space: pre;
	} */
	/* .quick_link_date::after{
		content: "\A";
		white-space: pre;
		font-size:0.2rem;
	} */
}



.job_title_box{
	width:calc(100% - 20px);
	padding:10px;
	/* color: rgba(195, 195, 195, 1); */
	color: white;
	background-color: rgba(211, 211, 211, .1);
	font-size: 0.9rem;
	line-height: 1.1rem;
}
.job_title_role{
	float:left;
}
.job_title_company{
	float:right;
}
@media screen and (max-width: 770px) {
	.job_title_company{
		clear: both;
		float:left;
	}
}
.job_title_box_smol{
	display:inline-block;
	margin-left:5px;
	font-size:0.7rem;
	font-style:italic;
	/* color: rgba(195, 195, 195, 1); */
}

.content{
	padding:10px;
	color:#fff;
}

.content h2{
	margin: 10px;
	font-size:1rem;
}
.content p{
	margin: 20px 30px;
	font-size:0.8rem;
	line-height:1rem;
}

.reference_jobpos{
	font-size:0.7rem;
	color: rgba(195, 195, 195, 1);
}
.reference_company{
	font-size:0.7rem;
	display:inline-block;
	/* margin-left:10px; */
	text-align:right;
	font-style:italic;
}
/* @media only screen and (max-width: 600px) {
	.content h2{
		margin: 10px;
		font-size:3rem;
	}
	.content p{
		margin: 20px 30px;
		font-size:2rem;
	}
} */

.content a{
	color:#BFBFBF;
	text-decoration:none;
}
.content a:hover{
	color:#FFF;
}

.toggle_header{
		margin-top:2px;
		background-color:#363636;
		border:1px dotted grey;
		font-size:0.8rem;
}
.toggle_header:hover{
	cursor:pointer;
	background-color:#545454;
}
.toggle_header_subtxt{
	font-size:0.75rem;
	margin-left:5px;
	color: rgba(200, 200, 200, 1);
}
@media screen and (max-width: 770px) {
	.toggle_header_subtxt::before{
		content: "\A";
		white-space: pre;
	}
}
.toggle_indicator{
	display:inline-block;
	margin-left:10px;
}

.project_container .content {
    display: none;
    padding : 5px;
		color:#fff;
		background-color:#212121;
		margin-bottom:2px;
		border-left:1px dotted grey;
		border-right:1px dotted grey;
		border-bottom:1px dotted grey;
}
.project_container .content p{
		margin: 20px 10px;
}
.project_img{
	width:100px; height:auto;
}

.inline{ display:none; }

.tech_stack_box{
	width:calc(100% - 20px);
	padding:10px;
	color: rgba(214, 214, 214, 1);
	background-color: rgba(211, 211, 211, .1);
	font-size: 0.7rem;
	line-height: 1.1rem;
}
.tech_stack_box_small{
	font-size: 0.6rem;
	font-style:italic;
}


#footer{
	text-align:right;
	font-size:12px;
	width:100%;
	height:60px;
	color:#fff;
	margin: 5px auto;
	border-top:1px solid #D9D9D9;
}

#footer_right{float:left; margin-top:1px; border:0px;}
#footer_right img{float:left; margin-top:1px; border:0px;}
#footer_right a{float:left;margin-top:1px; color:#fff; text-decoration:none;}

#navigation{
	position: fixed;
	bottom: 0;
	width: 100%;
	height: 30px;
	z-index: 1000;
	background-color: #000;
	padding:5px 0px 2px 30px;
	border:0px;
	border-top:1px;
	border-style:solid;
	border-color: #fff;
}

#navigation_center{
	width:200px;
	margin:0px auto;
}

#navigation a{
	float:left;
	text-decoration:none;
	text-align:center;
	width:80px;
	font-size:12px;
	color:#fff;
	background-color: #222;
	margin:3px 10px 1px 0px;
	padding: 2px;
	border:1px solid #ccc;
}

#navigation a:hover{
	background-color: #494949;
}

a.site_link{
	padding:2px;
	text-decoration:none;
	font-size:10px;
	font-weight:bold;
	font-family:"Verdana";
	color:#000;
}

/********************************/

.bar{
	color:#fff; background-color:#000; border:0px solid #fff; height:80px; padding:5px; margin-bottom:3px;
	font-size: 12px;
    font-family: arial,verdana,Times,serif;
    font-weight: normal;
}

.bar:hover{
	background-color:#3D3D3D;
}

.bar hr{
	margin:2px;
	color:#222;
}

.bar_thumb{
	background-color:#000; border:1px solid #ccc; float:left; margin: 4px 10px 0px 5px;
}

/********************************/


.featherlight-next:hover span, .featherlight-previous:hover span {
    /* top: 10px;
    right: 10px;
    left: 85%; */
		color:rgba(0, 0, 0, .8);
}

.home_icon{
	width:18px; height:18px;
	margin:0 auto;
	background-size: 18px;
	background-image: url('data:image/svg+xml;utf8,<svg class="svg-icon" style="width: 0.5em; height: 0.5em; vertical-align: middle;fill: white;overflow: hidden;" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M423.23842 889.236714l0-266.284739 177.523159 0 0 266.284739 221.903949 0L822.665529 534.190395l133.142369 0L512 134.762263 68.191078 534.190395l133.142369 0 0 355.047342L423.23842 889.237737z" /></svg>');
}


.videoWrapper {
  position: relative;
  padding-bottom: 56.25%;
  /* 16:9 */
  padding-top: 25px;
  height: 0;
}

.videoWrapper iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}