*{
	margin:0;
	padding:0;
	font-family: 'Roboto', sans-serif, Ariel, Helvetica;
}

body {
	width:100%;
/* 	background:linear-gradient(180deg, #f296a6, #8b5dc4); */
	background-size:100%;
/*	background-color:#f8f2f5; */	
    background-color:#fff;	
	}	

/*====== Nav Styles ======*/
.nav-wrapper {
    /* height: 100px; */
    display: flex;
    justify-content: space-between;
    align-items: center;
    /* min-height: 8vh; */
    padding: 15px 0;
    max-width: 1135px;
    margin: 0 auto;
	
	
}
header{
	
	position:-webkit-sticky; 
	position:sticky;
	top:0;
	background: linear-gradient(-90deg, #fff, #fff);
    /*background: linear-gradient(-90deg, #f296a6, #8b5dc4);*/
    /* background:#fff);*/
	border-bottom: 1px solid #c6c7c7;
    z-index: 2;
}


.right-side {
	display:flex;
	padding-top:20px;
}

/* .left-side {
	padding:20px 0px 0px 100px;
}
.right-side {
	padding:60px 100px 0px 0px;
} */
.nav-wrapper > .right-side > div {
	margin-left:30px;
	font-size:0.8em;
	font-weight:400;
	text-transform:uppercase;
}
.nav-link-wrapper {
	height:30px;
	border-bottom:2px solid transparent;
	transition:border-bottom 0.3s;
}
.nav-link-wrapper a {
	color:#000;
/* 	font-weight:700; 	*/
 	letter-spacing:1px; 
	text-decoration:none;
	transition: color 0.3s;
}
.nav-link-wrapper a:hover{
	color: #000;
}
.nav-link-wrapper:hover{	
	border-bottom: 2px solid #000;
}
.nav-link-wrapper, a:active{
	color:#000;
}
/*====== Navigation End ======*/

/*====== Portfolio Styles ======*/
.portfolio-items-title {
	color:##262525;
	font-size:2.0rem;
	font-weight:700;
	letter-spacing: -0.05rem;
	text-transform:uppercase;
/* 	margin:30px 0px 20px 15px; */
	padding:70px 0px 30px 15px;
}

.portfolio-items-wrapper {
	display: grid;
	grid-gap: 20px;
	justify-content: center;
/*  background-color:#f8f2f5;*/
    background-color:#fff;	
	grid-template-columns: 365px 365px 365px;
	margin:0px 0px 50px 0px;
/* margin:100px 200px 0px 200px; */
/* 	grid-template-columns:1fr 1fr 1fr; */
}

.portfolio-item-wrapper{
/* padding:10px; */
	position:relative;
/* 	border:1px solid #fff; */
}
/* ========================== */
/* =====Quarentine Start===== */
/* ========================== */
/* ========================== */

.portfolio-items-title-brief{
	color:#262525;
	font-size:2.0rem;
	font-weight:700;
	letter-spacing: -0.05rem;	
	text-transform:uppercase;
/* 	margin:30px 0px 20px 15px; */
/* 	padding:70px 0px 30px 15px; */
	padding: 70px 0px 30px 15px;
}

.portfolio-brief-back a{
	color:#858283;
/* 	width:50px;
	clear:right-side; */
	font-size:0.80rem;
	font-weight:400;
    line-height: 1.2;
	letter-spacing:3px;
	text-transform:uppercase;
	text-decoration:none;
}
.portfolio-brief-back a:hover {
	color:#000;
	background-color:#f296a6;	
}

.portfolio-img-wrapper-brief img {
	padding: 5px 0px 5px 15px;
}

/* Multiple projects images (here width 100% to images )*/
.portfolio-img-wrapper-brief-multiprojects img {
	padding: 5px 0px 5px 15px;
	width:80%;
}

/* .portfolio-item-wrapper-brief h3 {
	color:#333333;
	font-size:2.5rem;
	font-weight: 700;*/
/* 	letter-spacing: -0.05rem; */
/*	text-transform:uppercase;
	padding:0px 0px 0px 15px;
	margin: 10px 0px 0px 0px;
} */

.portfolio-brief-title-description-wrapper  h3 {
	color:#262525;
	font-size:2.0rem;
	font-weight: 700;
 	letter-spacing: -0.03rem; 
	text-transform:uppercase;
	padding:0px 0px 0px 15px;
	margin: 10px 0px 0px 0px;
}

.portfolio-brief-title-description-wrapper p {
	width:1135px;
	height:100%;
	color:#3b393a;
	letter-spacing: -0.01rem;
	font-size:1.02rem;
	font-weight: 300;
	line-height:1.6;
/* 	overflow:visible; */
	text-transform:lowercase;
	padding:0px 0px 0px 0px;
	margin: 10px 0px 0px 0px;
}

.portfolio-brief-title-description-wrapper p span {
	color: #615f60;
	font-size: 1.1rem;
	font-weight: 700;
	letter-spacing: -0.01rem;	
/* 	text-transform: lowercase; */
	padding: 0px 0px 0px 0px;
}

/* ========================== */
/* =====Quarentine End======= */
/* ========================== */
/* ========================== */
.portfolio-img-background{
/* width:100%;	 */
	height: 250px;
/* margin:0px 0px 0px 0px; */
	background: cover;
	background-position: center;
	background-repeat: no-repeat;
}

/*====== Navigation Flex Test Start ======*/
/*====== Navigation Flex Test Start ======*/
.portfolio-item-wrapper-brief {
	display:grid;
	grid-gap: 50px; 
	grid-template-columns:1420px;
/*	position:relative;
 	justify-content: center;
	background-color:#f8f2f5;	
	grid-template-columns: 365px 365px; */
/*	display:flex;
 	justify-content:space-between; 
	align-items:center;
	padding:0px;
	width:100%;
	height:100%;
 	margin:0 auto; */
} 

.portfolio-item-wrapper-brief > div {

	justify-content:center;
	align-items:center;
/* 		position:absolute;
		grid-template-columns:1fr; */
	/* justify-content:space-between; */
/* 	align-items:vertical-align; */
/* 	padding:10px; 
	width:100%;
	height:100%;*/
} 
/*====== Navigation Flex Test End ======*/
/*====== Navigation Flex Test End ======*/

/*====== Home Starts ======*/
 .home-me {
	width:100%;
    max-width: 1170px;
	display: block;
    overflow: hidden;
	margin:0px auto;
} 


.helloo img {
	width:20%;
	height:auto;
	margin-top:7%;
	margin-left:0%;
/* 	background-size:auto 100%; */
}

.home-me {
	/* color:#fff; */
	margin-left:25%;
}

.home-me span {
	font-size:1.0em;
}

.home-me h1 {
	font-size:2.5em;
	padding-top:5px;
	color:#333;
}
.home-me h2 {
	font-size:1.5rem;

}
.home-me p {
    line-height: 24px;
 	font-size:16px; 
	padding-top:10px;
}

.active{
   border-bottom: 2px solid #000;
    color: #000;
}
.active a{
    color: #000;
}
/*====== Home End ======*/

.img-text-wrapper {
	position:absolute;
	top:0px;
	display:flex;
	color:#fff;
	flex-direction:column;
	justify-content:center;
	align-items:center;
	height:100%;
	text-align:center;
	padding-left:50px;
	padding-right:50px;
}

.img-text-wrapper:hover{
	transition: color 0.3s;
	background: rgba(51,31,48,.8);
/* 	background: rgba(139,93,196, .9); */
/*  background:rgba(0, 0, 0, 0.62) */
}

.logo-wrapper img {
	width:100%;
/* 	height:50%; */
/* 	margin-bottom:20px; */
}
.logo-wrapper {
	color: #fff;
	font-size: 1.5rem;
	font-weight: 700;
/* 	margin-bottom:20px; */
}

.img-text-wrapper .subtitle span{
	font-size: 2.0rem;
	font-weight: 700;	
	cursor:pointer;
	transition:0.3s;
/* 	font-weight:600; */
	color:transparent;
}

.img-text-wrapper:hover .subtitle span{
	font-size: 2.0rem;
	font-weight: 700;	
/* 	font-weight:600;*/ 
	color:#fff;
}

.img-text-wrapper .subtitle {
	cursor:pointer;
	transition:0.3s;
 	font-weight:300; 
	line-height:1.5rem;
	color:transparent;
	padding:20px 0px 0px 0px;
}

.img-text-wrapper:hover .subtitle {
 	font-weight:300; 
	line-height:1.5rem;	
	color:#fff;
	padding:20px 0px 0px 0px;	
}

.img-darken {
	transition:0.3s;
	filter:brightness(10%);
}

.subtitle {
/* 	font-weight:600; */
	color: lightseagreen;
}	

.content-wrapper{
	padding: 0px;
	margin: 0px;
}

.content-wrapper-brief{
	padding: 0px;
	margin: 0px;
}

.container {
	width:100%;
    max-width: 1170px;
/*     max-width: 1400px; */
	display: block;
   /*  overflow: hidden;*/
	margin:0px auto;
	padding:0px 0px 70px 0px;
}

.active{
    border-bottom: 2px solid #000;
    color: #000;
}

.active a{
    color: #000;
}

/*======About Me Container======-->*/

	/*======About Me Start=======*/
	.aboutme-content-wrapper-brief{
		padding: 0px;
		margin: 0px;
	}

	.aboutme-portfolio-items-title-brief{
		color:#262525;
		font-size:2.0rem;
		font-weight:700;
		letter-spacing: -0.05rem;	
		text-transform:uppercase;
		padding: 70px 0px 30px 15px;
	}
	  
	 .aboutme-portfolio-item-wrapper-brief {
		display:grid;
		grid-gap: 50px; 
		grid-template-columns:1420px;
	} 

	.aboutme-portfolio-item-wrapper-brief > div {

		justify-content:center;
		align-items:center;
	}
	/*======About Me End======*/
.about-items-title {
	color:#333333;
	font-size:1.5rem;
	font-weight:500;
	text-transform:uppercase;
	margin:90px 0px 0px 150px;
	/* padding:100px 0px 0px 150px; */
}

.about-home-me {
	color:#333;
	margin-top:1%;
	margin-left:1%;
	margin-bottom:1%;
/* 	padding-bottom:100px; */
}

.about-home-me h1, span, p {
	color:#333;
 	font-weight:300; 
}

.about-home-me h1 {
	color:#333;
	font-size:1.8rem;
 	font-weight:600; 
}

.about-home-me p, span {
	color:#333;
	font-size:1.0rem;
 	font-weight:300; 
}
.about-home-me p {
	width: 1135px;
    height: 19%;
    color: #333;
    letter-spacing: -0.01rem;
    font-size: 1.02rem;
    font-weight: 300;
    line-height: 1.6;
    /* overflow: visible; 
    text-transform: lowercase;*/
}	
/*======About Me Container end======-->*/

/*======Contact Container Start=======>*/
	/*======Contact Start=======*/
	.contact-content-wrapper-brief{
		padding: 0px;
		margin: 0px;
	}

	.contact-portfolio-items-title-brief{
		color:#333;
		font-size:2.0rem;
		font-weight:700;
		letter-spacing: -0.05rem;	
		text-transform:uppercase;
		padding: 70px 0px 30px 15px;
	}
	  
	 .aboutme-portfolio-item-wrapper-brief {
		display:grid;
		grid-gap: 50px; 
		grid-template-columns:1420px;
	} 

	.aboutme-portfolio-item-wrapper-brief > div {

		justify-content:center;
		align-items:center;
	}
	/*======Contact End======*/
#cont_container_main {
	width:100%; background:#f8f9f9;
}
.cont_container {
	margin:0 auto;
	width:900px;
	height:55vh;
	min-height:512px;
}
.cont_left {
	width:350px;
	height:512px;
	float:left;
}

.cont_left h1,h2,h3,h4,span,p {
	color:#666;
/* 	font-weight:normal;
	font-family:Arial, Helvetica, sans-serif; */
}
.cont_left h1 {
	font-size:38px;
/* 	font-family:Tahoma,Arial; */
}
.cont_left span {
	color:#262525;
	font-size:1.2rem; 
	font-weight:600;
}
.cont_left h2 {
	color:#333333;
	font-size:1.5rem;
	letter-spacing:-.02rem;
	font-weight:700;
	text-transform:uppercase;
	padding:80px 0 0 0;
} 
/* .cont_left h3 {
	color:#252626;
	font-size:1.2rem; 
	font-weight:300;
	padding:10px 0 0 0;
} */
/* .cont_left h4 {
	color:#252626;
	font-size:1.2rem; 
	font-weight:300;
	padding:30px 0 0 0;
} */
.cont_left p {
/* 	font-size:0.8rem; 
	font-weight:300;
	width:350px; 
	line-height:1.6; 
	margin:15px 0 0 0; */
	width: 350px;
	margin:15px 0 0 0;	
    color: #3b393a;
    letter-spacing: -0.01rem;
    font-size: 1.02rem;
    font-weight: 300;
    line-height: 1.6;
}
/* .cont_left a { 
	font-size:0.9rem; 
	font-weight:300;
	padding:0 0 30px 0;
} */
/*
.snetwork {
	list-style:none; 
}
 ul li a { 
	color:#252626;
} */

/*FORM*/  
.cont_form { 
	width:550px;  
	float:right;}
div.box { 
	width:550px;  
	padding:15px 25px 0px 25px;/* border:1px solid #262626;*/
} 
/*div.box h1 { 
	color:#666; 
	font-size:18px; 
	text-transform:uppercase; 
	padding:0 0 15px 118px*/
div.box label { 
	width:100%; 
	display: block; 
	background:#1C1C1C; 
}   
div.box label span { 
	display: block; 
	color:#666; 
	font-size:12px; 
	float:left; 
	width:100px; 
	text-align:right; 
	padding:15px 20px 0 0; 
}	
div.box .input_text { 
	padding:15px 10px; 
	color:#666; 
	width:350px; 
	background:#fff; 
	border:1px double #c6c7c7; 
	margin-bottom:15px; 
}	 
div.box .message{ 
	padding:10px 10px; 
	color:#666; 
	width:350px; 
	background:#fff; 
	border:1px double #c6c7c7; 
	overflow:hidden; 
	height:150px; 
}	  
div.box .button { 
	margin:0 0 10px 0; 
	color:#000;
	text-transform:uppercase; 
	padding:15px 7px; 
 	background:#f296a6;  
	border:0px; 
	position:relative; 
	top:10px; 
	left:392px; 
	width:100px;
/* 	background:linear-gradient(-90deg, #f296a6, #8b5dc4); */
}
/*======Contact Container End=======>*/

/*====== Footer Starts ======*/
.footer-wrapper {
	display:flex;
	width:100%;
	height:200px;
	margin-top:35px;
	justify-content:space-between;
	border-top:1px solid #d4d1d2;
/*  background: linear-gradient(-90deg, #f296a6, #8b5dc4); */
}

.footer-wrapper > .footer-leftside {
	color:#858283;
	font-size:0.8em;
	padding:20px 0px 0px 30px;
}

.footer-wrapper > .footer-rightside {
	color:#858283;
	font-size:0.8em;
	text-decoration:none;
	padding:20px 30px 0px 0px;
}

.footer-wrapper > .footer-rightside a{
	color:#858283;
	text-decoration:none;
}

.footer-rightside a:hover {
	color:#f296a6;
	text-decoration:none;
}


