@font-face {
    font-family: bree;
    src: url('../Bree_Serif/BreeSerif-Regular.ttf');
}

body
{
	margin:0px;
	padding:0px;
	background-image: url('../img/clothDark.jpg');
}
#defaultPage{
	display: table;
    width: 100%;
}
.mail
{
	float: right;
	padding: 17px;
    padding-top: 12px;
    background-color: black;
    color: wheat;
    cursor: pointer;
	font-family: 'bree';
    font-size: 16px;
    border-bottom-left-radius: 1vw;
	border-top-right-radius: 0.72vw;
}
.mail:hover
{
   /* background-color: #1d1d1d;*/
    color:  rgb(255, 211, 129);
    cursor: pointer;
}
#emailvalue
{
	border: 2px solid wheat;
	border-radius: 50px;
	padding: 20px;
	margin-right: auto;
	margin-left: auto;
	display: inline-flex;
	cursor: pointer;
}
.top
{
	height: 150px;
    width: 100%;
    border-bottom: 4px solid black;
}
.logo
{
    float: left;
    height: 120px;
    width: 120px;
    margin: 10px;
    border: 2px solid wheat;/*#f5ab6e;*/
    background-size: cover;
    background-image: url('../img/profile1.png');
    background-repeat: no-repeat;
    border-radius: 10px;
}
.heading{
	font-size: 40px;
    margin-top: 26px;
    height: 100px;
    width: 65%;
	text-shadow: -2px 3px 0px wheat;
    text-align: center;
    display: inline-block;
    font-family: bree;
	cursor: pointer;
	color: black;
}
.inner{
	margin: 12px;
	border: 2px dashed black;
	border-radius: 1vw;
	height: fit-content;
	padding: 1.2vw;
	padding-bottom: 2.4vw;
}

.innerGreen{

    background-color: rgba(179, 245, 182, 0.316);
}

.innerViolet{

    background-color:  rgba(209, 179, 245, 0.21);
}

.innerWheat{
	background-color: #ffa6002e;
}

.rightUp
{
	margin-right: 24px;
    margin-top: 24px;
}
.leftUp{
	margin-left: 24px;
    margin-top: 24px;
}
.leftSide{
	margin-left: 24px;
}
.rightSide{
	margin-right: 24px;
}
.midUp{
    margin-top: 24px;
}

.linkSpace 
{
	margin-top: 15px;
}
.linkHead
{
	font-family: 'bree';
    font-size: 18px;
	border-bottom: 2px solid black;
}

.linkHead:hover
{

}


.linkGreen
{
    color: rgb(179, 245, 182);
}

.linkViolet
{
    color: rgb(209, 179, 245);
}

.linkWheat
{
    color: wheat;
}

.link
{
	font-family: 'bree';
    font-size: 14px;
	padding: 3px 14px 6px 14px;
    text-align: center;
    background-color: black;
    border-radius: 20px;
    margin: auto;
    margin-bottom: 1vw;
    min-width: 30vw;
    text-decoration: none;
}

.link:hover
{
	cursor: pointer;
	color: rgb(255, 211, 129);
	/*background-image: url('../img/clothDark.jpg');*/
}

.mid
{
	height:600px;
	width:100%;
	overflow: hidden;
}
.cont
{
	height: fit-content;
    display: flex;

}
.square
{
	width:33.33%;
	height:100%;
	display:inline-block;
}
.one
{
	float:left;
}
.two
{
	margin-right:auto;
	margin-left: auto;
}
.three
{
	float:right
}

.fullBox {
	max-width: 800px;
	width: 100vw;
	border: 2px solid black;
	box-shadow: 0px 5px 16px black;
	border-radius: 1vw;
	min-height: 300px;
	background-image: url('../img/cloth.jpg');
	margin-left: auto;
	margin-right: auto;
	margin-top: 20px;
	margin-bottom: 40px;
}

#contactPage{
	height: 100%;
	background-color: black;
	border-top: 4px solid black;
	color: wheat;
}
.hide{
	width: 50px;
    height: 52px;
    padding: 26px;
    cursor: pointer;
}
.contactForm{
	width: 80%;
	margin: auto;
	padding: 50px 10px 10px;
	text-align: center;
	font-size: 20px;
	font-family: bree;
}

@media screen and (max-width:1024px)
{
	.mid
	{
		height:auto;
		width:100%;
		overflow: hidden;
	}
	.hide{
		width: 90px;
		height: 90px;
		padding: 46px;
		cursor: pointer;
	}
	.mail
	{
		float: right;
		font-family: 'bree';
		padding: 2.25vw;
		background-color: black;
		position:relative;
		right: -3px;
		top: -3px;
		color: wheat;
		cursor: pointer;
		font-size: 4.4vw;
		border-bottom-left-radius: 4vw;
	}
	.contactForm{
		width: 80%;
		margin: auto;
		padding: 50px 10px 10px;
		text-align: center;
		font-size: 5vw;
		font-family: bree;
	}
	.top
	{
		height: 24vw;
		width: 100%;
		border-bottom: 8px solid black;
	}
	.fullBox {
		max-width: 100vw;
		width: 100vw;
		height: auto;
		border: 5px solid black;
		box-shadow: 0px 5px 16px black;
		border-radius: 0px;
		min-height: 300px;
		background-size: 72vw;
		background-image: url('../img/cloth.jpg');
		margin-left: auto;
		margin-right: auto;
		margin-top: 0px;
		padding-bottom: 50px;
	}
	.logo
	{
		float: left;
		height: 20vw;
		width: 20vw;
		margin: 10px;
		border: 3px solid wheat;/*#f5ab6e;*/
		background-size: contain;
		background-image: url('../img/profile.jpg');
		background-repeat: no-repeat;
		border-radius: 10px;
	}
	.heading{
		font-size: 7.4vw;
		margin-top: 10px;
		height: 100px;
		width: 45%;
		text-shadow: -2px 3px 0px wheat;
		text-align: center;
		display: inline-block;
		font-family: bree;
	}
	.square
	{
		width:100%;
		height:auto;
		display:inline-block;
	}

	.linkGreen
	{
		color: rgb(179, 245, 182);
	}

	.linkViolet
	{
		color: rgb(209, 179, 245);
	}

	.linkWheat
	{
		color: wheat;
	}

	.innerGreen{

		background-color: rgba(179, 245, 182, 0.316);
	}
	
	.innerViolet{
	
		background-color:  rgba(209, 179, 245, 0.21);
	}
	
	.innerWheat{
		background-color: #ffa6002e;
	}

	.inner{
		margin: 36px;
		margin-bottom:0;
		border: 5px dashed black;
		border-radius: 4vw;
		height: max-content;
		padding: 6vw;
	}

	.rightUp
	{
		margin-right: auto;
		margin-top: 0px;
	}
	.leftUp{
		margin-left: auto;
		margin-top: 0px;
	}
	.leftSide{
		margin-left: auto;
	}
	.rightSide{
		margin-right: auto;
	}
	.midUp{
		margin-top: 0px;
	}
	.linkHead
	{
		font-family: 'bree';
		font-size: 48px;
		border-bottom: 8px solid black;
	}
	
	.linkHead:hover
	{
	
	}
	
	.link
	{
		font-family: 'bree';
		font-size: 40px;
		padding: 12px 52px 20px 52px;
		text-align: center;
		background-color: black;
		border-radius: 50px;
		margin: 1vw;
		margin-bottom: 1vw;
		min-width: 30vw;
		text-decoration: none;
	}
	
	.link:hover
	{
		cursor: pointer;
		color: rgb(255, 211, 129);
		/*background-image: url('../img/clothDark.jpg');*/
	}

	.linkSpace 
	{
		margin-top: 48px;
	}

	.cont{
		height: fit-content;
		display: block;
	}
}

/*#f5ab6e*/