@charset "utf-8";
/* CSS Document */

body {	
	margin: 0px;
	padding: 0px;
	background-color: #FFFFFF;
}

#container {
	width: 1366px;
	height: auto;
	padding: 0px;
	margin: 0px auto;
	clear: both;
}

#header {
	width: 100%;
	height: auto;
	margin: 0px auto;
	position: relative;
}

#logo {
	width: 100%;
	max-width: 93px;
	height: auto;
	max-height: 24px;
	position: absolute;
	margin-top: 41px;
	margin-left: 131px;
}

#about {
	font-family: 'Montserrat', sans-serif;
	font-weight: 600;
	font-size: 12px;
	margin-top: 38px;
	margin-left: 982px;
	position: absolute;
	color: #FFFFFF;
}

#about a {
	color: #FFFFFF;
	text-decoration: none;
}

#about a:hover {
	display: inline-flex;
	color: #FFFFFF;
	border-bottom: 3px solid #FFFFFF;
	margin-right: -25px;
	padding-bottom: 6px;
	width: 100%;
	-webkit-transition: 0.1s;
	-moz-transition: 0.1s;
	transition: 0.1s;
}

#about a.active_about {
	display: inline-flex;
	color: #FFFFFF;
	border-bottom: 3px solid #FFFFFF;
	margin-right: -25px;
	padding-bottom: 6px;
	width: 100%
}

#project {
	font-family: 'Montserrat', sans-serif;
	font-weight: 600;
	font-size: 12px;
	margin-top: 38px;
	margin-left: 1077px;
	position: absolute;
	color: #FFFFFF;
}

#project a {
	color: #FFFFFF;
	text-decoration: none;
}

#project a:hover {
	display: inline-flex;
	color: #FFFFFF;
	border-bottom: 3px solid #FFFFFF;
	margin-right: -38px;
	padding-bottom: 6px;
	width: 100%;
	-webkit-transition: 0.1s;
	-moz-transition: 0.1s;
	transition: 0.1s;
}

#project a.active_project {
	display: inline-flex;
	color: #FFFFFF;
	border-bottom: 3px solid #FFFFFF;
	margin-right: -38px;
	padding-bottom: 6px;
	width: 100%
}

#contact {
	font-family: 'Montserrat', sans-serif;
	font-weight: 600;
	font-size: 12px;
	margin-top: 38px;
	margin-left: 1178px;
	position: absolute;
	color: #FFFFFF;
}

#contact a {
	color: #FFFFFF;
	text-decoration: none;
}

#contact a:hover {
	display: inline-flex;
	color: #FFFFFF;
	border-bottom: 3px solid #FFFFFF;
	margin-right: -38px;
	padding-bottom: 6px;
	width: 100%;
	-webkit-transition: 0.1s;
	-moz-transition: 0.1s;
	transition: 0.1s;
}

#contact a.active_contact {
	display: inline-flex;
	color: #FFFFFF;
	border-bottom: 3px solid #FFFFFF;
	margin-right: -38px;
	padding-bottom: 6px;
	width: 100%
}

nav {
	display: none;
}

#myBtn {
  display: none;
  position: fixed;
  width: 56px;
  height: 56px;
  bottom: 20px;
  right: 30px;
  border: none;
  outline: none;
  background-color: #565656;
  opacity: 0.4;
  color: white;
  cursor: pointer;
  font-size: 20px;
}

#myBtn:hover {
  background-color: #565656;
  opacity: 0.7;
}

#footer_about_hl {
	font-family: 'Montserrat', sans-serif;
	font-weight: 400;
	font-size: 24px;
	margin-left: 207px;
	margin-top: 20px;
	position: absolute;
	color: #565656;	
}

#footer_email {
	font-family: 'Raleway', sans-serif;
	font-weight: 400;
	font-size: 12px;
	font-style: italic;
    width: 360px;
	height: 42px;
    padding: 15px;
    margin-left: 207px;
	margin-top: 90px;
    display: inline-block;
    border: 1px solid #a2a2a2;
	border-radius: 25px;
    box-sizing: border-box;
	position: absolute;
	background-color:transparent;
}

.popup {
	width: 111px;
	height: 42px;
	margin-left: 580px;
	margin-top: 90px;
    position: absolute;
    display: inline-block;
    cursor: pointer;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

.popup .popuptext {
    visibility: hidden;
	font-family: 'Raleway', sans-serif;
	font-weight: 400;
	font-size: 12px;
	margin-left: -370px;
	margin-top: 10px;
    color: #565656;
    position: absolute;
}

.popup .popuptext::after {
    content: "";
    position: absolute;
}

.popup .show {
    visibility: visible;
    -webkit-animation: fadeIn 1s;
    animation: fadeIn 1s;
}

#instagram {
	width: 29px;
	height: 29px;
	position: absolute;
	margin-left: 933px;
	margin-top: 73px;
}

#facebook {
	width: 29px;
	height: 29px;
	position: absolute;
	margin-left: 975px;
	margin-top: 73px;
}

#behance {
	width: 29px;
	height: 29px;
	position: absolute;
	margin-left: 1017px;
	margin-top: 73px;
}

#footer_copyright {
	font-family: 'Raleway', sans-serif;
	font-weight: 400;
	font-size: 10px;
	margin-left: 933px;
	margin-top: 125px;
	color: #565656;
}

/*----------------------------------------CSS INDEX---------------------------------------------*/
#index_hero_banner {
	background-image:url(images/00-1_hero-banner-bg_01.jpg);
	width: 1366px;
	height: 650px;
	margin: 0px auto;
	padding: 0px;
}

#index_hero_banner_text_hl {
	font-family: 'Montserrat', sans-serif;
	font-weight: 400;
	font-size: 64px;
	color: #FFFFFF;
	margin-top: 190px;
	margin-left: 580px;
	position: absolute;
}

#index_hero_banner_text_bc {
	font-family: 'Montserrat', sans-serif;
	font-weight: 300;
	font-size: 18px;
	color: #FFFFFF;
	margin-top: 320px;
	margin-left: 490px;
	text-align: center;
	line-height: 150%;
	position: absolute;
}

#m_index_hero_banner_text_bc {
	display: none;
}

#work_button {
	background-color: #11FFEE00;
    border: 1px solid #FFFFFF;
	border-radius: 25px;
	width: 150px;
	height: 42px;
    color: #FFFFFF;
    text-align: center;
    text-decoration: none;
    display: inline-block;
	font-family: 'Montserrat', sans-serif;
	font-weight: 700;
    font-size: 10px;
    margin-top: 416px;
	margin-left: 522px;
    -webkit-transition-duration: 0.4s;
	-moz-transition-duration: 0.4s;
    transition-duration: 0.4s;
    cursor: pointer;
}

#work_button:hover {
    background-color: #FFFFFF;
    color: #565656;
}

#hire_button {
	background-color: #11FFEE00;
    border: 1px solid #FFFFFF;
	border-radius: 25px;
	width: 150px;
	height: 42px;
    color: #FFFFFF;
    text-align: center;
    text-decoration: none;
    display: inline-block;
	font-family: 'Montserrat', sans-serif;
	font-weight: 700;
    font-size: 10px;
    margin-top: 416px;
	margin-left: 20px;
    -webkit-transition-duration: 0.4s;
	-moz-transition-duration: 0.4s;
    transition-duration: 0.4s;
    cursor: pointer;
	position: absolute;
}

#hire_button:hover {
    background-color: #FFFFFF;
    color: #565656;
}

#index_about {
	width: 1366px;
	height: 364px;
	margin: 0px auto;
	padding: 0px;
	background-color: #FFFFFF;
}

#index_about_hl {
	font-family: 'Montserrat', sans-serif;
	font-weight: 300;
	color: #565656;
	font-size: 36px;
	margin-top: 42px;
	margin-left: 211px;
	position: absolute;
}

#m_index_about_hl {
	display: none;
}

#index_about_bc {
	font-family: 'Montserrat', sans-serif;
	font-weight: 300;
	font-size: 14px;
	color: #565656;
	line-height: 200%;
	margin-top: 135px;
	margin-left: 211px;
	position: absolute;
}

#m_index_about_bc {
	display: none;
}

#more_about_button {
	background-color: #11FFEE00;
    border: 1px solid #565656;
	border-radius: 25px;
	width: 190px;
	height: 42px;
    color: #565656;
    text-align: center;
    text-decoration: none;
    display: inline-block;
	font-family: 'Montserrat', sans-serif;
	font-weight: 700;
    font-size: 10px;
    margin-top: 240px;
	margin-left: 211px;
    -webkit-transition-duration: 0.4s;
	-moz-transition-duration: 0.4s;
    transition-duration: 0.4s;
    cursor: pointer;
	position: absolute;
}

#more_about_button:hover {
    background-color: #565656;
    color: #FFFFFF;
}

#index_project {
	width: 1366px;
	height: 1062px;
	margin: 0px auto;
	padding: 0px;
	background-color: #FFFFFF;
}

#index_project_banner {
	background-image:url(images/01-4_bg-portfolio_02.jpg);
	width: 1366px;
	height: 279px;
	margin: 0px auto;
	padding: 0px;
	position: absolute;
}

#index_project_content {
	width: 1105px;
	height: 890px;
	background-color: #FFFFFF;
	margin-top: 155px;
	margin-left: 131px;
	position: absolute;
	box-shadow: 0px 0px 20px 0.5px #E7E7E7;
}

#index_project_hl {
	font-family: 'Montserrat', sans-serif;
	font-weight: 300;
	font-size: 36px;
	margin-top: 50px;
	margin-left: 404px;
	position: absolute;
	color: #565656;
}

#index_project_bc {
	font-family: 'Raleway', sans-serif;
	font-weight: 400;
	font-size: 14px;
	margin-top: 132px;
	margin-left: 296px;
	position: absolute;
	color: #565656;
}

#m_index_project_bc {
	display: none;
}

#index_project_1 {
	width: 298px;
	height: 221px;
	position: absolute;
	margin-top: 230px;
	margin-left: 79px;
}

#index_project_2 {
	width: 298px;
	height: 221px;
	position: absolute;
	margin-top: 230px;
	margin-left: 403px;
}

#index_project_3 {
	width: 298px;
	height: 221px;
	position: absolute;
	margin-top: 230px;
	margin-left: 727px;
}

#index_project_4 {
	width: 298px;
	height: 221px;
	position: absolute;
	margin-top: 481px;
	margin-left: 79px;
}

#index_project_5 {
	width: 298px;
	height: 221px;
	position: absolute;
	margin-top: 481px;
	margin-left: 403px;
}

#index_project_6 {
	width: 298px;
	height: 221px;
	position: absolute;
	margin-top: 481px;
	margin-left: 727px;
}

#index_work_button {
	background-color: #11FFEE00;
    border: 1px solid #565656;
	border-radius: 25px;
	width: 150px;
	height: 42px;
    color: #565656;
    text-align: center;
    text-decoration: none;
    display: inline-block;
	font-family: 'Montserrat', sans-serif;
	font-weight: 700;
    font-size: 10px;
    margin-top: 782px;
	margin-left: 480px;
    -webkit-transition-duration: 0.4s;
	-moz-transition-duration: 0.4s;
    transition-duration: 0.4s;
    cursor: pointer;
	position: absolute;
}

#index_work_button:hover {
    background-color: #565656;
    color: #FFFFFF;
}

#index_contact {
	width: 1366px;
	height: 289px;
	margin: 0px auto;
	padding: 0px;
	background-color: #FFFFFF;
	position: relative;
}

#index_contact_hl {
	font-family: 'Montserrat', sans-serif;
	font-weight: 300;
	font-size: 36px;
	margin-top: 30px;
	margin-left: 207px;
	position: absolute;
	color: #565656;
}

#index_contact_bc {
	font-family: 'Raleway', sans-serif;
	font-weight: 400;
	font-size: 14px;
	color: #565656;
	margin-top: 120px;
	margin-left: 207px;
	position: absolute;
}

#m_index_contact_bc {
	display: none;
}

#index_contact_button {
	background-color: #11FFEE00;
    border: 1px solid #565656;
	border-radius: 25px;
	width: 150px;
	height: 42px;
    color: #565656;
    text-align: center;
    text-decoration: none;
    display: inline-block;
	font-family: 'Montserrat', sans-serif;
	font-weight: 700;
    font-size: 10px;
    margin-top: 190px;
	margin-left: 207px;
    -webkit-transition-duration: 0.4s;
	-moz-transition-duration: 0.4s;
    transition-duration: 0.4s;
    cursor: pointer;
	position: absolute;
}

#index_contact_button:hover {
    background-color: #565656;
    color: #FFFFFF;
}

#footer_index {
	width: 1366px;
	height: 190px;
	background-color: #eeeeee;
	margin: 0px auto;
	padding: 0px;
	position: absolute;
}

#footer_index_hl {
	font-family: 'Montserrat', sans-serif;
	font-weight: 300;
	font-size: 24px;
	margin-left: 207px;
	margin-top: 20px;
	position: absolute;
	color: #565656;	
}

/*----------------------------------------CSS ABOUT---------------------------------------------*/

#about_hero_banner {
	background-image:url(images/01-1_hero-banner_about_01.jpg);
	width: 1366px;
	height: 397px;
	margin: 0px auto;
	padding: 0px;
}

#about_about {
	width: 1366px;
	height: 678px;
	margin: 0px auto;
	padding: 0px;
	background-color: #FFFFFF;
}

#about_about_image {
	background-image:url(images/01-2_profile-image_03.jpg);
	width: 382px;
	height: 401px;
	position: absolute;
	margin-top: 107px;
	margin-left: 210px;
}

#about_about_hl {
	font-family: 'Montserrat', sans-serif;
	font-weight: 400;
	font-size: 36px;
	color: #565656;
	margin-top: 65px;
	margin-left: 643px;
	position: absolute;
}

#about_about_bc {
	font-family: 'Raleway', sans-serif;
	font-weight: 500;
	font-size: 14px;
	color: #565656;
	line-height: 210%;
	margin-top: 150px;
	margin-left: 643px;
	position: absolute;
}

#m_about_about_bc {
	display: none;
}

.download_cv_button {
	background-image:url(images/01-3_download-icon_03.png);
	background-repeat: no-repeat;
	background-position-x: 30px;
	background-position-y: 12px;
	background-color: #11FFEE00;
    border: 1px solid #565656;
	border-radius: 25px;
	width: 211px;
	height: 42px;
    color: #565656;
    text-align: center;
    text-decoration: none;
    display: inline-block;
	font-family: 'Montserrat', sans-serif;
	font-weight: 700;
    font-size: 10px;
    margin-top: 548px;
	margin-left: 640px;
    -webkit-transition-duration: 0.4s;
	-moz-transition-duration: 0.4s;
    transition-duration: 0.4s;
    cursor: pointer;
	position: absolute;
}

.download_cv_button:hover {
    background-color: #565656;
    color: #FFFFFF;
}

#about_project {
	width: 1366px;
	height: 780px;
	margin: 0px auto;
	padding: 0px;
	background-color: #FFFFFF;
}

#about_project_banner {
	background-image:url(images/01-1_hero-banner_about_01.jpg);
	width: 1366px;
	height: 279px;
	margin: 0px auto;
	padding: 0px;
	position: absolute;
}

#about_project_content {
	width: 1105px;
	height: 600px;
	background-color: #FFFFFF;
	margin-top: 153px;
	margin-left: 131px;
	position: absolute;
	box-shadow: 0px 0px 20px 0.5px #E7E7E7;
}

#about_project_hl {
	font-family: 'Montserrat', sans-serif;
	font-weight: 400;
	font-size: 36px;
	color: #565656;
	margin-top: 45px;
	margin-left: 404px;
	position: absolute;
}

#about_project_bc {
	font-family: 'Raleway', sans-serif;
	font-weight: 500;
	font-size: 14pt;
	color: #565656;
	margin-top: 135px;
	margin-left: 220px;
	position: absolute;
}

#m_about_project_bc {
	display: none;
}

#about_project_1 {
	width: 298px;
	height: 221px;
	position: absolute;
	margin-top: 235px;
	margin-left: 79px;
}

#about_project_2 {
	width: 298px;
	height: 221px;
	position: absolute;
	margin-top: 235px;
	margin-left: 403px;
}

#about_project_3 {
	width: 298px;
	height: 221px;
	position: absolute;
	margin-top: 235px;
	margin-left: 727px;
}

#about_work_button {
	background-color: #11FFEE00;
    border: 1px solid #565656;
	border-radius: 25px;
	width: 150px;
	height: 42px;
    color: #565656;
    text-align: center;
    text-decoration: none;
    display: inline-block;
	font-family: 'Montserrat', sans-serif;
	font-weight: 700;
    font-size: 10px;
    margin-top: 490px;
	margin-left: 480px;
    -webkit-transition-duration: 0.4s;
	-moz-transition-duration: 0.4s;
    transition-duration: 0.4s;
    cursor: pointer;
	position: absolute;
}

#about_work_button:hover {
    background-color: #565656;
    color: #FFFFFF;
}

#about_contact {
	width: 1366px;
	height: 289px;
	margin: 0px auto;
	padding: 0px;
	background-color: #FFFFFF;
	position: relative;
}

#about_contact_hl {
	font-family: 'Montserrat', sans-serif;
	font-weight: 400;
	font-size: 36px;
	margin-top: 30px;
	margin-left: 207px;
	position: absolute;
	color: #565656;
}

#about_contact_bc {
	font-family: 'Raleway', sans-serif;
	font-weight: 400;
	font-size: 14px;
	color: #565656;
	margin-top: 120px;
	margin-left: 207px;
	position: absolute;
}

#m_about_contact_bc {
	display: none;
}

#about_contact_button {
	background-color: #11FFEE00;
    border: 1px solid #565656;
	border-radius: 25px;
	width: 150px;
	height: 42px;
    color: #565656;
    text-align: center;
    text-decoration: none;
    display: inline-block;
	font-family: 'Montserrat', sans-serif;
	font-weight: 700;
    font-size: 10px;
    margin-top: 190px;
	margin-left: 207px;
    -webkit-transition-duration: 0.4s;
	-moz-transition-duration: 0.4s;
    transition-duration: 0.4s;
    cursor: pointer;
	position: absolute;
}

#about_contact_button:hover {
    background-color: #565656;
    color: #FFFFFF;
}

#footer_about {
	width: 1366px;
	height: 190px;
	background-color: #eeeeee;
	margin: 0px auto;
	padding: 0px;
	position: absolute;
}

/*----------------------------------------CSS PROJECT---------------------------------------------*/

#project_project_banner {
	background-image:url(images/02-1_hero-banner-project.jpg);
	width: 1366px;
	height: 397px;
	margin: 0px auto;
	padding: 0px;
}

#project_project_content {
	width: 1105px;
	height: 1121px;
	background-color: #FFFFFF;
	margin-top: -94px;
	margin-left: 131px;
	box-shadow: 0px 0px 20px 0.5px #E7E7E7;
	position: relative;
}

#project_hl {
	font-family: 'Montserrat', sans-serif;
	font-weight: 300;
	font-size: 36px;
	margin-top: 50px;
	margin-left: 404px;
	position: absolute;
	color: #565656;
}

#project_bc {
	font-family: 'Raleway', sans-serif;
	font-weight: 400;
	font-size: 14px;
	margin-top: 132px;
	margin-left: 296px;
	position: absolute;
	color: #565656;
}

#project_menu{
   float: left;
   width: 100%;
   background: #FFFFFF;
   overflow: hidden;
   position: absolute;
   color: #565656;
   font-family: 'Montserrat', sans-serif;
   font-weight: 500;
   font-size: 14px;
   margin-top: 214px;
}

#project_menu ul {
   clear:left;
   float:left;
   list-style:none;
   margin-top: 0px;
   padding:0px;
   position:relative;
   left:50%;
   text-align:center;
}

#project_menu ul li {
   display:block;
   float:left;
   list-style:none;
   margin:0px;
   padding:10px;
   position:relative;
   right:50%;
}

#project_menu ul li a {
   display: inline-block;
   margin:0 0 0 1px;
   padding:3px 10px;
   background: #FFFFFF;
   color: #565656;
   text-decoration:none;
   line-height:1.3em;
}

#project_menu ul li a:hover {
   background: #FFFFFF;
   border-bottom-style: inset;
   border-bottom-color: #f1838c;
   color: #565656;
}

#project_menu ul li a.active,
#project_menu ul li a.active:hover {
   color: #565656;
   background: #FFFFFF;
   border-bottom-style: inset;
   border-bottom-color: #F1838c;
}

#project_menu_line_1 {
	width: 1px;
	height: 18px;
	position: absolute;
	background-color: #000000;
	opacity: 0.2;
	margin-top: 228px;
	margin-left:357px;
}

#project_menu_line_2 {
	width: 1px;
	height: 18px;
	position: absolute;
	background-color: #000000;
	opacity: 0.2;
	margin-top: 228px;
	margin-left:520px;
}

#project_menu_line_3 {
	width: 1px;
	height: 18px;
	position: absolute;
	background-color: #000000;
	opacity: 0.2;
	margin-top: 228px;
	margin-left:715px;
}

#project_all_1 {
	width: 298px;
	height: 221px;
	position: absolute;
	margin-top: 304px;
	margin-left: 79px;
}

#project_all_2 {
	width: 298px;
	height: 221px;
	position: absolute;
	margin-top: 304px;
	margin-left: 404px;
}

#project_all_3 {
	width: 298px;
	height: 221px;
	position: absolute;
	margin-top: 304px;
	margin-left: 727px;
}

#project_all_4 {
	width: 298px;
	height: 221px;
	position: absolute;
	margin-top: 555px;
	margin-left: 79px;
}

#project_all_5 {
	width: 298px;
	height: 221px;
	position: absolute;
	margin-top: 555px;
	margin-left: 404px;
}

#project_all_6 {
	width: 298px;
	height: 221px;
	position: absolute;
	margin-top: 555px;
	margin-left: 727px;
}

#project_all_7 {
	width: 298px;
	height: 221px;
	position: absolute;
	margin-top: 805px;
	margin-left: 79px;
}

#project_all_8 {
	width: 298px;
	height: 221px;
	position: absolute;
	margin-top: 805px;
	margin-left: 404px;
}

#project_all_9 {
	width: 298px;
	height: 221px;
	position: absolute;
	margin-top: 805px;
	margin-left: 727px;
}

#project_contact {
	width: 1366px;
	height: 289px;
	margin: 0px auto;
	padding: 0px;
	background-color: none;
	position: relative;
}

#project_contact_hl {
	font-family: 'Montserrat', sans-serif;
	font-weight: 300;
	font-size: 36px;
	margin-top: 30px;
	margin-left: 207px;
	position: absolute;
	color: #565656;
}

#project_contact_bc {
	font-family: 'Raleway', sans-serif;
	font-weight: 400;
	font-size: 14px;
	color: #565656;
	margin-top: 120px;
	margin-left: 207px;
	position: absolute;
}

#project_contact_button {
	background-color: #11FFEE00;
    border: 1px solid #565656;
	border-radius: 25px;
	width: 150px;
	height: 42px;
    color: #565656;
    text-align: center;
    text-decoration: none;
    display: inline-block;
	font-family: 'Montserrat', sans-serif;
	font-weight: 700;
    font-size: 10px;
    margin-top: 190px;
	margin-left: 207px;
    -webkit-transition-duration: 0.4s;
	-moz-transition-duration: 0.4s;
    transition-duration: 0.4s;
    cursor: pointer;
	position: absolute;
}

#project_contact_button:hover {
    background-color: #565656;
    color: #FFFFFF;
}

#footer_project {
	width: 1366px;
	height: 190px;
	background-color: #eeeeee;
	margin: 0px auto;
	padding: 0px;
	position: absolute;
}

#footer_project_hl {
	font-family: 'Montserrat', sans-serif;
	font-weight: 300;
	font-size: 24px;
	margin-left: 207px;
	margin-top: 20px;
	position: absolute;
	color: #565656;	
}

/*----------------------------------------CSS PROJECT-WEBSITE---------------------------------------------*/
#project_project_content_website {
	width: 1105px;
	height: 864px;
	background-color: #FFFFFF;
	margin-top: -94px;
	margin-left: 131px;
	box-shadow: 0px 0px 20px 0.5px #E7E7E7;
	position: relative;
}

/*----------------------------------------CSS PROJECT-MOBILE---------------------------------------------*/
#project_project_content_mobile {
	width: 1105px;
	height: 635px;
	background-color: #FFFFFF;
	margin-top: -94px;
	margin-left: 131px;
	box-shadow: 0px 0px 20px 0.5px #E7E7E7;
	position: relative;
}


#project_mobile {
	width: 298px;
	height: 221px;
	position: absolute;
	margin-top: 304px;
	margin-left: 79px;
}

/*----------------------------------------CSS PROJECT-OTHERS---------------------------------------------*/
#project_project_content_others {
	width: 1105px;
	height: 873px;
	background-color: #FFFFFF;
	margin-top: -94px;
	margin-left: 131px;
	box-shadow: 0px 0px 20px 0.5px #E7E7E7;
	position: relative;
}

#project_others_1 {
	width: 298px;
	height: 221px;
	position: absolute;
	margin-top: 304px;
	margin-left: 79px;
}

#project_others_2 {
	width: 298px;
	height: 221px;
	position: absolute;
	margin-top: 304px;
	margin-left: 404px;
}

#project_others_3 {
	width: 298px;
	height: 221px;
	position: absolute;
	margin-top: 304px;
	margin-left: 727px;
}

#project_others_4 {
	width: 298px;
	height: 221px;
	position: absolute;
	margin-top: 555px;
	margin-left: 79px;
}

/*----------------------------------------CSS PROJECT-PBSI---------------------------------------------*/
#project_PBSI {
	width: 1105px;
	height: 1020px;
	background-color: #FFFFFF;
	margin-top: -94px;
	margin-left: 131px;
	box-shadow: 0px 0px 20px 0.5px #E7E7E7;
	position: relative;
}

.slider_PBSI {
	width: 1029px;
	height: 465px;
	background-color: yellow;
	margin-left: 38px;
	margin-top: 40px;
	text-align: center;
	overflow: hidden;
	position: absolute;
}
        
.image_PBSI_holder {
	width: 3087px;
	background-color: red;
	height: 465px;
	clear: both;
	position: relative;
	-webkit-transition: left 2s;
	-moz-transition: left 2s;
	-o-transition: left 2s;
	transition: left 2s;
}
        
.slider_PBSI_image {
	float: left;
	margin: 0px;
	padding: 0px;
	position: relative;
}
        
#slider_PBSI_1:target ~ .image_PBSI_holder {
	left: 0px;
}
        
#slider_PBSI_2:target ~ .image_PBSI_holder {
	left: -1029px;
}
        
#slider_PBSI_3:target ~ .image_PBSI_holder {
	left: -2058px;
}
        
.button_PBSI_holder {
	position: relative;
	top: -30px;
}
        
.slider_PBSI_change {
	display: inline-block;
	height: 10px;
	width: 10px;
	border-radius: 10px;
	margin: 12px;
	background-color: #9A9A9A;
}

.slider_PBSI_change:hover {
	display: inline-block;
	height: 10px;
	width: 10px;
	border-radius: 10px;
	margin: 12px;
	background-color: #565656;
}

#PBSI_hl {
	font-family: 'Montserrat', sans-serif;
	font-weight: 300;
	font-size: 36px;
	color: #565656;
	position: absolute;
	margin-top: 538px;
	margin-left: 187px;
}

#PBSI_bc {
	font-family: 'Raleway', sans-serif;
	font-weight: 400;
	font-size: 20px;
	color: #565656;
	position: absolute;
	margin-top: 610px;
	margin-left: 420px;
}

#PBSI_bc_2 {
	font-family: 'Raleway', sans-serif;
	font-weight: 400;
	font-size: 14px;
	color: #565656;
	position: absolute;
	margin-top: 690px;
	margin-left: 225px;
	text-align: center;
	line-height: 180%;
}

#PBSI_client {
	font-family: 'Raleway', sans-serif;
	font-weight: 400;
	font-size: 12px;
	color: #565656;
	position: absolute;
	margin-top: 800px;
	margin-left: 355px;
	text-align: left;
	line-height: 200%;
}

#PBSI_client span {
	font-weight: 600;
	font-size: 14px;
}

#PBSI_year {
	font-family: 'Raleway', sans-serif;
	font-weight: 400;
	font-size: 12px;
	color: #565656;
	position: absolute;
	margin-top: 800px;
	margin-left: 520px;
	text-align: left;
	line-height: 200%;
}

#PBSI_year span {
	font-weight: 600;
	font-size: 14px;
}

#PBSI_services {
	font-family: 'Raleway', sans-serif;
	font-weight: 400;
	font-size: 12px;
	color: #565656;
	position: absolute;
	margin-top: 800px;
	margin-left: 670px;
	text-align: left;
	line-height: 200%;
}

#PBSI_services span {
	font-weight: 600;
	font-size: 14px;
}

#PBSI_project {
	background-color: #11FFEE00;
    border: 1px solid #565656;
	border-radius: 25px;
	width: 150px;
	height: 42px;
    color: #565656;
    text-align: center;
    text-decoration: none;
    display: inline-block;
	font-family: 'Montserrat', sans-serif;
	font-weight: 700;
    font-size: 10px;
    margin-top: 910px;
	margin-left: 464px;
    -webkit-transition-duration: 0.4s;
	-moz-transition-duration: 0.4s;
    transition-duration: 0.4s;
    cursor: pointer;
	position: absolute;
}

#PBSI_project:hover {
    background-color: #565656;
    color: #FFFFFF;
}

#PBSI_contact {
	width: 1366px;
	height: 289px;
	margin: 0px auto;
	padding: 0px;
	background-color: none;
	position: relative;
}

#footer_PBSI {
	width: 1366px;
	height: 190px;
	background-color: #eeeeee;
	margin: 0px auto;
	padding: 0px;
	position: absolute;
}

#footer_PBSI_hl {
	font-family: 'Montserrat', sans-serif;
	font-weight: 300;
	font-size: 24px;
	margin-left: 207px;
	margin-top: 20px;
	position: absolute;
	color: #565656;	
}

/*----------------------------------------CSS PROJECT-TBIKEDASHBOARD---------------------------------------------*/
#TBike_Dash_hl {
	font-family: 'Montserrat', sans-serif;
	font-weight: 300;
	font-size: 36px;
	color: #565656;
	position: absolute;
	margin-top: 538px;
	margin-left: 348px;
}

#TBike_Dash_bc {
	font-family: 'Raleway', sans-serif;
	font-weight: 400;
	font-size: 20px;
	color: #565656;
	position: absolute;
	margin-top: 610px;
	margin-left: 476px;
}

#TBike_Dash_bc_2 {
	font-family: 'Raleway', sans-serif;
	font-weight: 400;
	font-size: 14px;
	color: #565656;
	position: absolute;
	margin-top: 690px;
	margin-left: 377px;
	text-align: center;
	line-height: 180%;
}

#TBike_Dash_client {
	font-family: 'Raleway', sans-serif;
	font-weight: 400;
	font-size: 12px;
	color: #565656;
	position: absolute;
	margin-top: 800px;
	margin-left: 355px;
	text-align: left;
	line-height: 200%;
}

#TBike_Dash_client span {
	font-weight: 600;
	font-size: 14px;
}

#TBike_Dash_year {
	font-family: 'Raleway', sans-serif;
	font-weight: 400;
	font-size: 12px;
	color: #565656;
	position: absolute;
	margin-top: 800px;
	margin-left: 520px;
	text-align: left;
	line-height: 200%;
}

#TBike_Dash_year span {
	font-weight: 600;
	font-size: 14px;
}

#TBike_Dash_services {
	font-family: 'Raleway', sans-serif;
	font-weight: 400;
	font-size: 12px;
	color: #565656;
	position: absolute;
	margin-top: 800px;
	margin-left: 670px;
	text-align: left;
	line-height: 200%;
}

#TBike_Dash_services span {
	font-weight: 600;
	font-size: 14px;
}


/*----------------------------------------CSS PROJECT-SA---------------------------------------------*/
#SA_hl {
	font-family: 'Montserrat', sans-serif;
	font-weight: 300;
	font-size: 36px;
	color: #565656;
	position: absolute;
	margin-top: 538px;
	margin-left: 306px;
}

#SA_bc {
	font-family: 'Raleway', sans-serif;
	font-weight: 400;
	font-size: 20px;
	color: #565656;
	position: absolute;
	margin-top: 610px;
	margin-left: 457px;
}

#SA_bc_2 {
	font-family: 'Raleway', sans-serif;
	font-weight: 400;
	font-size: 14px;
	color: #565656;
	position: absolute;
	margin-top: 690px;
	margin-left: 265px;
	text-align: center;
	line-height: 180%;
}

#SA_client {
	font-family: 'Raleway', sans-serif;
	font-weight: 400;
	font-size: 12px;
	color: #565656;
	position: absolute;
	margin-top: 800px;
	margin-left: 355px;
	text-align: left;
	line-height: 200%;
}

#SA_client span {
	font-weight: 600;
	font-size: 14px;
}

#SA_year {
	font-family: 'Raleway', sans-serif;
	font-weight: 400;
	font-size: 12px;
	color: #565656;
	position: absolute;
	margin-top: 800px;
	margin-left: 520px;
	text-align: left;
	line-height: 200%;
}

#SA_year span {
	font-weight: 600;
	font-size: 14px;
}

#SA_services {
	font-family: 'Raleway', sans-serif;
	font-weight: 400;
	font-size: 12px;
	color: #565656;
	position: absolute;
	margin-top: 800px;
	margin-left: 670px;
	text-align: left;
	line-height: 200%;
}

#SA_services span {
	font-weight: 600;
	font-size: 14px;
}

/*----------------------------------------CSS PROJECT-GIG---------------------------------------------*/
#GIG_hl {
	font-family: 'Montserrat', sans-serif;
	font-weight: 300;
	font-size: 36px;
	color: #565656;
	position: absolute;
	margin-top: 538px;
	margin-left: 521px;
}

#GIG_bc {
	font-family: 'Raleway', sans-serif;
	font-weight: 400;
	font-size: 20px;
	color: #565656;
	position: absolute;
	margin-top: 610px;
	margin-left: 457px;
}

#GIG_bc_2 {
	font-family: 'Raleway', sans-serif;
	font-weight: 400;
	font-size: 14px;
	color: #565656;
	position: absolute;
	margin-top: 690px;
	margin-left: 338px;
	text-align: center;
	line-height: 180%;
}

#GIG_client {
	font-family: 'Raleway', sans-serif;
	font-weight: 400;
	font-size: 12px;
	color: #565656;
	position: absolute;
	margin-top: 800px;
	margin-left: 355px;
	text-align: left;
	line-height: 200%;
}

#GIG_client span {
	font-weight: 600;
	font-size: 14px;
}

#GIG_year {
	font-family: 'Raleway', sans-serif;
	font-weight: 400;
	font-size: 12px;
	color: #565656;
	position: absolute;
	margin-top: 800px;
	margin-left: 520px;
	text-align: left;
	line-height: 200%;
}

#GIG_year span {
	font-weight: 600;
	font-size: 14px;
}

#GIG_services {
	font-family: 'Raleway', sans-serif;
	font-weight: 400;
	font-size: 12px;
	color: #565656;
	position: absolute;
	margin-top: 800px;
	margin-left: 670px;
	text-align: left;
	line-height: 200%;
}

#GIG_services span {
	font-weight: 600;
	font-size: 14px;
}

/*----------------------------------------CSS PROJECT-TBike_mob---------------------------------------------*/
#TBike_mob_hl {
	font-family: 'Montserrat', sans-serif;
	font-weight: 300;
	font-size: 36px;
	color: #565656;
	position: absolute;
	margin-top: 538px;
	margin-left: 497px;
}

#TBike_mob_bc {
	font-family: 'Raleway', sans-serif;
	font-weight: 400;
	font-size: 20px;
	color: #565656;
	position: absolute;
	margin-top: 610px;
	margin-left: 464px;
}

#TBike_mob_bc_2 {
	font-family: 'Raleway', sans-serif;
	font-weight: 400;
	font-size: 14px;
	color: #565656;
	position: absolute;
	margin-top: 690px;
	margin-left: 384px;
	text-align: center;
	line-height: 180%;
}

#TBike_mob_client {
	font-family: 'Raleway', sans-serif;
	font-weight: 400;
	font-size: 12px;
	color: #565656;
	position: absolute;
	margin-top: 800px;
	margin-left: 355px;
	text-align: left;
	line-height: 200%;
}

#TBike_mob_client span {
	font-weight: 600;
	font-size: 14px;
}

#TBike_mob_year {
	font-family: 'Raleway', sans-serif;
	font-weight: 400;
	font-size: 12px;
	color: #565656;
	position: absolute;
	margin-top: 800px;
	margin-left: 520px;
	text-align: left;
	line-height: 200%;
}

#TBike_mob_year span {
	font-weight: 600;
	font-size: 14px;
}

#TBike_mob_services {
	font-family: 'Raleway', sans-serif;
	font-weight: 400;
	font-size: 12px;
	color: #565656;
	position: absolute;
	margin-top: 800px;
	margin-left: 670px;
	text-align: left;
	line-height: 200%;
}

#TBike_mob_services span {
	font-weight: 600;
	font-size: 14px;
}

/*----------------------------------------CSS PROJECT-KumpulKeluarga---------------------------------------------*/
#KumpulKeluarga_hl {
	font-family: 'Montserrat', sans-serif;
	font-weight: 300;
	font-size: 36px;
	color: #565656;
	position: absolute;
	margin-top: 538px;
	margin-left: 342px;
}

#KumpulKeluarga_bc {
	font-family: 'Raleway', sans-serif;
	font-weight: 400;
	font-size: 20px;
	color: #565656;
	position: absolute;
	margin-top: 610px;
	margin-left: 510px;
}

#KumpulKeluarga_bc_2 {
	font-family: 'Raleway', sans-serif;
	font-weight: 400;
	font-size: 14px;
	color: #565656;
	position: absolute;
	margin-top: 690px;
	margin-left: 390px;
	text-align: center;
	line-height: 180%;
}

#KumpulKeluarga_client {
	font-family: 'Raleway', sans-serif;
	font-weight: 400;
	font-size: 12px;
	color: #565656;
	position: absolute;
	margin-top: 800px;
	margin-left: 355px;
	text-align: left;
	line-height: 200%;
}

#KumpulKeluarga_client span {
	font-weight: 600;
	font-size: 14px;
}

#KumpulKeluarga_year {
	font-family: 'Raleway', sans-serif;
	font-weight: 400;
	font-size: 12px;
	color: #565656;
	position: absolute;
	margin-top: 800px;
	margin-left: 520px;
	text-align: left;
	line-height: 200%;
}

#KumpulKeluarga_year span {
	font-weight: 600;
	font-size: 14px;
}

#KumpulKeluarga_services {
	font-family: 'Raleway', sans-serif;
	font-weight: 400;
	font-size: 12px;
	color: #565656;
	position: absolute;
	margin-top: 800px;
	margin-left: 670px;
	text-align: left;
	line-height: 200%;
}

#KumpulKeluarga_services span {
	font-weight: 600;
	font-size: 14px;
}

/*----------------------------------------CSS PROJECT-Photography---------------------------------------------*/
#Photography_hl {
	font-family: 'Montserrat', sans-serif;
	font-weight: 300;
	font-size: 36px;
	color: #565656;
	position: absolute;
	margin-top: 538px;
	margin-left: 363px;
}

#Photography_bc {
	font-family: 'Raleway', sans-serif;
	font-weight: 400;
	font-size: 20px;
	color: #565656;
	position: absolute;
	margin-top: 610px;
	margin-left: 491px;
}

#Photography_bc_2 {
	font-family: 'Raleway', sans-serif;
	font-weight: 400;
	font-size: 14px;
	color: #565656;
	position: absolute;
	margin-top: 690px;
	margin-left: 549px;
	text-align: center;
	line-height: 180%;
}

/*----------------------------------------CSS PROJECT-PaperCutting---------------------------------------------*/
#Paper_hl {
	font-family: 'Montserrat', sans-serif;
	font-weight: 300;
	font-size: 36px;
	color: #565656;
	position: absolute;
	margin-top: 538px;
	margin-left: 431px;
}

#Paper_bc {
	font-family: 'Raleway', sans-serif;
	font-weight: 400;
	font-size: 20px;
	color: #565656;
	position: absolute;
	margin-top: 610px;
	margin-left: 529px;
}

#Paper_bc_2 {
	font-family: 'Raleway', sans-serif;
	font-weight: 400;
	font-size: 14px;
	color: #565656;
	position: absolute;
	margin-top: 690px;
	margin-left: 549px;
	text-align: center;
	line-height: 180%;
}

/*----------------------------------------CSS PROJECT-Perempuan---------------------------------------------*/
#Perempuan_hl {
	font-family: 'Montserrat', sans-serif;
	font-weight: 300;
	font-size: 36px;
	color: #565656;
	position: absolute;
	margin-top: 538px;
	margin-left: 365px;
}

#Perempuan_bc {
	font-family: 'Raleway', sans-serif;
	font-weight: 400;
	font-size: 20px;
	color: #565656;
	position: absolute;
	margin-top: 610px;
	margin-left: 473px;
}

#Perempuan_bc_2 {
	font-family: 'Raleway', sans-serif;
	font-weight: 400;
	font-size: 14px;
	color: #565656;
	position: absolute;
	margin-top: 690px;
	margin-left: 269px;
	text-align: center;
	line-height: 180%;
}


/*----------------------------------------CSS CONTACT---------------------------------------------*/

#contact_hero_banner {
	width: 1366px;
	height: 397px;
	margin: 0px auto;
	padding: 0px;
}

#contact_form {
	width: 1366px;
	height: 878px;
	margin: 0px auto;
	padding: 0px;
	background-color: #FFFFFF;
}

#contact_form_hl {
	font-family: 'Montserrat', sans-serif;
	font-weight: 300;
	font-size: 36px;
	margin-top: 80px;
	margin-left: 315px;
	position: absolute;
	color: #565656;
}

#contact_form_bc {
	font-family: 'Raleway', sans-serif;
	font-weight: 400;
	font-size: 14px;
	margin-top: 160px;
	margin-left: 500px;
	text-align: center;
	color: #565656;
	position: absolute;
	line-height: 150%;
}

.form_group {
	font-family: 'Raleway', sans-serif;
	font-weight: 600;
	font-size: 12px;
	color: #565656;
}

#first_name_hl {
	margin-top: 280px;
	margin-left: 242px;
	position: absolute;
}

#first_name {
	font-family: 'Raleway', sans-serif;
	font-weight: 400;
	font-size: 18px;
    width: 462px;
	height: 89px;
    padding-top: 30px;
	padding-left: 30px;
    margin-left: 211px;
	margin-top: 261px;
    display: inline-block;
    border: 0.5px solid #565656;
    box-sizing: border-box;
	position: absolute;
	background-color:transparent;
}

#last_name_hl {
	margin-top: 280px;
	margin-left: 730px;
	position: absolute;
}

#last_name {
	font-family: 'Raleway', sans-serif;
	font-weight: 400;
	font-size: 18px;
    width: 462px;
	height: 89px;
    padding-top: 30px;
	padding-left: 30px;
    margin-left: 700px;
	margin-top: 261px;
    display: inline-block;
    border: 0.5px solid #565656;
    box-sizing: border-box;
	position: absolute;
	background-color:transparent;
}

#form_email_hl {
	margin-top: 400px;
	margin-left: 242px;
	position: absolute;
}

#form_email {
	font-family: 'Raleway', sans-serif;
	font-weight: 400;
	font-size: 18px;
	width: 462px;
	height: 89px;
	padding-top: 30px;
	padding-left: 30px;
	margin-left: 211px;
	margin-top: 380px;
	display: inline-block;
	border: 0.5px solid #565656;
	box-sizing: border-box;
	position: absolute;
	background-color: transparent;
}

#your_budget_hl {
	margin-top: 400px;
	margin-left: 730px;
	position: absolute;
}

#your_budget {
	font-family: 'Raleway', sans-serif;
	font-weight: 400;
	font-size: 18px;
    width: 462px;
	height: 89px;
    padding-top: 30px;
	padding-left: 25px;
    margin-left: 700px;
	margin-top: 380px;
    display: inline-block;
    border: 0.5px solid #565656;
    box-sizing: border-box;
	position: absolute;
	background-color:transparent;
}

#message_hl {
	margin-top: 520px;
	margin-left: 242px;
	position: absolute;
}

#message {
	font-family: 'Raleway', sans-serif;
	font-weight: 400;
	font-size: 18px;
	width: 951px;
	height: 150px;
	padding-top: 45px;
	padding-left: 30px;
	margin-left: 211px;
	margin-top: 499px;
	display: inline-block;
	border: 0.5px solid #565656;
	box-sizing: border-box;
	position: absolute; 
	background-color: transparent;
}

.send_inquiry {
	background-color: #F1838C;
    border: 1px solid #F1838C;
	border-radius: 25px;
	width: 250px;
	height: 42px;
    color: #FFFFFF;
    text-align: center;
    text-decoration: none;
    display: inline-block;
	font-family: 'Montserrat', sans-serif;
	font-weight: 700;
    font-size: 10px;
    margin-top: 710px;
	margin-left: 558px;
    -webkit-transition-duration: 0.4s;
	-moz-transition-duration: 0.4s;
    transition-duration: 0.4s;
    cursor: pointer;
	position: absolute;
}

.send_inquiry:hover {
    background-color: #565656;
	border: 1px solid #565656;
    color: #FFFFFF;
}

#contact_profile {
	background-image:url(images/03-2_contact-profile.jpg);
	background-repeat: no-repeat;
	width: 1366px;
	height: 393px;
	position: relative;
}

#footer_contact {
	width: 1366px;
	height: 190px;
	background-color: #eeeeee;
	margin: 0px auto;
	padding: 0px;
	position: absolute;
}

#footer_contact_hl {
	font-family: 'Montserrat', sans-serif;
	font-weight: 300;
	font-size: 24px;
	margin-left: 207px;
	margin-top: 20px;
	position: absolute;
	color: #565656;	
}