* {
	box-sizing: border-box;
	padding: 0;
	margin: 0;
}

body {
	font-size: 20px;
	font-family: Rubik;
    font-style: normal;
    font-weight: 400;

	display: grid;
	grid-template-columns: 80px 1fr 80px;
	gap: 20px;

	background-color: #F6F6F6;
}

/*header section*/
.header {
	background-color: rgba(65, 65, 65, 1);
	grid-column: 1 / 4;

	height: 62px;

	display: flex;
	align-items: center;
	justify-content: space-between;

	color: rgba(255, 255, 255, 0.9);
  text-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);
  text-decoration: none;

  position: sticky;
  top: 0;


}

.link-right {
	display: flex;
	align-items: center;
	gap: 83px;

	margin-right: 80px;
}

.title{	
	color: rgba(255, 255, 255, 0.9);
	font-weight: 500;

	margin-left: 80px;
}

.head {
	cursor: pointer;

	color: rgba(255, 255, 255, 0.9);
  text-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);
  text-decoration: none;
}

.head:hover {
	color: white;
}

button {
	cursor: pointer;

	font-size: 20px;
  	text-align: center;
  	font-family: Rubik;
  	font-weight: 400;
  	color: white;

/*  	box-shadow: 0 4px 4px rgba(0, 0, 0, 25%);*/

  	border: 0px;
}

button:active {
  outline-color: rgba(58, 108, 217, 0.5);
  outline-style: solid;
  outline-width: 5.5px;
}

.btnBlue {
	background-image: linear-gradient(rgba(75, 145, 247, 1),rgba(54, 125, 246, 1));
}

.secondary {
	width: 98px;
  	height: 32px;

	border-radius: 6px;
}

/*content section*/
.content, .contentAbout {
	color:black;
	font-size: 32px;
	font-weight: 500;

	display: grid;
	grid-template-columns: 1fr 1fr;


	gap: 56px;

	grid-column: 2 / 3;
	grid-row: 2 / 3;

	padding-top: 75px;
}

.subtitle {
	margin-left: 20px;
	display: flex;
	flex-direction: column;
}

.big {
	line-height: 1.6;
	letter-spacing: 3.5px;

	margin-bottom: 20px;
}

.highlight {
	color: #236BF6;
}

.small {
	line-height: 1.6;
	letter-spacing: 3.5px;
	font-weight: 300;
	font-size: 30px;

	display: flex;
	align-items: center;
	margin-top: 10px;
}

.btnGrey {
	width: 132px;
  height: 40px;

	border-style: solid;
	background-color: white;
	border-radius: 9px;

	box-shadow: 0 3px 2px rgba(0, 0, 0, 25%);


  font-weight: 500;

	color: rgba(61, 61, 61, 1);
}

.content2, .contentAbout2 {
	padding-top: 100px;

	color:black;
	font-weight: 500;

	grid-column: 2 / 3;
	grid-row: 3 / 4;

	gap: 71px;

	display: grid;

	grid-template-columns: 1fr 1fr;
	
	
}

.feature {
	display: grid;
	max-width: 599px;
	max-height: 495px;
	grid-template-columns: 1fr 1fr;
	gap: 70px;

}

.subtitle2 {
/*	max-width: 526px;*/
/*	max-height: 495px;*/

	display: flex;
	flex-direction: column;
	justify-content: flex-start;

	gap: 25px;
}

.item {
	padding-top: 13px;
	padding-left: 5px;
	padding-right: 5px;
	max-width: 270px;
	max-height: 208px;

	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: flex-start;
	gap: 20px;

	background-color: white;
	border-radius: 20px;
	box-shadow: 0 5px 15px 2px rgba(0, 0, 0, 15%);

	text-align: center;
}

/*footer section*/
.footer {
	grid-column: 2 / 3;
	grid-row: 4 / 5;

	padding-top: 75px;

	display: grid;

	grid-template-columns: 1fr;
	gap: 135px;

}

.footerTitle {
	grid-column: 1 / 2;
	grid-row: 1 / 2;
}

.contact-navi {
	grid-column: 1 / 2;
	grid-row: 2 / 3;

	display: grid;

	grid-template-columns: 1fr 1fr;

}

.information {
	grid-column: 1 / 2;

	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 22px;

	margin-top: 50px;
}

.info {
	font-size: 20px;
	color: black;
	font-weight: 500;

	margin-right: 190px;

	justify-self: end;
}

.address {
	grid-column: 1 / 2;
	grid-row: 1 / 2;

}

.addressInfo {
	grid-column: 2 / 3;
	grid-row:  1 / 2;
}

.hp {
	grid-column: 1 / 2;
	grid-row: 2 / 3;
}

.hpInfo {
	grid-column: 2 / 3;
	grid-row:  2 / 3;
}

.email {
	grid-column: 1 / 2;
	grid-row: 3 / 4;
}

.emailInfo {
	grid-column: 2 / 3;
	grid-row:  3 / 4;
}

.navigation {
	grid-column: 2 / 3;
	grid-row: 1 / 2;

	display: grid;
	grid-template-columns: 1fr;
	gap: 22px;

	justify-items: center;

}

.link {
	color: #236BF6;
	font-weight: 400;

	cursor: pointer;

	text-decoration: none;
}

.copyright {
	grid-column: 1 / 2;
	grid-row:  3 / 4;

	display: flex;
	justify-content: center;
	align-items: center;

	margin-bottom: 20px;
}

/*about page*/

.contentAbout {
 grid-template-columns: 1fr;

 align-items: center;
 justify-content: center;

 gap: 75px;

 text-align: center;

 margin-top: -40px;
}

.titleAbout, .captionAbout, .wordAbout, .aboutCaption {
	font-size: 37px;
	line-height: 140%;
	letter-spacing: 3px;
}

.captionAbout {
	font-weight: 300;
	font-size: 30px;
}

.greyBtn {
  height: 47px;

	border-style: solid;
	background-color: white;

	box-shadow: 0 0px 0px rgba(0, 0, 0, 0%);


  font-weight: 500;

	color: rgba(61, 61, 61, 1);

	border-style: solid;
	border-width: 1.5px;
	background-color: white;
	border-color: rgba(0, 0, 0, 15%);

	border-radius: 12px;
}

.word {
	display: flex;

	flex-direction: column;

	gap: 30px;

	width: 650px;

	padding: 15px 30px;

	justify-self: center;

	border-left: 6px solid rgba(35, 107, 246, 1);

/*	border-radius: 100%;*/
}

.wordAbout {
	font-weight: 400;
	font-size: 25px;
}

.contentAbout2 {
	grid-template-columns: repeat(2, 1fr);

	gap: 30px;

	margin-bottom: 10px;
}

.imgProfile {
	width: 50px;
	height: 50px;

	border-radius: 50%;

	justify-self: end;

	align-self: center;
}

.aboutMe {

	grid-row: 1 / 3;
	display: grid;
	grid-template-columns: repeat(2, 1fr);

	row-gap: 20px;
}

.aboutCaption {
	font-size: 15px;

	font-weight: 300;

	grid-column: 1 / 3;
}

.tab {
    display: inline-block;
    margin-left: 50px;
}

.divContentAbout {
	padding: 20px;

	background-color: white;

	border-radius: 20px;

	box-shadow: 0 5px 15px 2px rgba(0, 0, 0, 15%);

}

.aboutRP {
	grid-row: 1/3;

	grid-column: 2/3;

	height: 500px;

	overflow-y: auto;

	display: grid;

	grid-template-columns: 1fr;

	row-gap: 20px;
}

.featureAbout {
	display: grid;
	grid-template-columns: repeat(4, 1fr);

/*	column-gap: 20px;*/

	grid-row: 2/3;

	grid-column: 2/3;

	height: 200px;

	overflow-x: auto;
  overflow-y: hidden;

}

.featureItem {
	width: 260px;

	height: 100%;

	display: grid;
	grid-template-columns: 1fr;
	grid-template-rows: repeat(2, auto);
	align-items: center;
	justify-content: center;

	gap: 10px;

	padding: 0px 20px;

	background-color: white;

	text-align: center;
}