/* Color */

.imperial_blue
{
	color: #2B6377;
}

.sand_yellow
{
	color: #EAD5C1;
}

.sky_blue
{
	color: #D1DFE5;
}

.light_gray
{
	color: rgb(204,204,204);
}

	/*
(*) (*)
	*/

#mainwrap
{
	margin: 0 auto;
	background: #ccc;
}

.roller
{

}

.titlebox
{
	width: 100%;
	margin: 0 auto;
	padding: 1.5vh 0 1.5vh 0;
}
h3
{
	font: bold 2rem/normal "PT Sans";
	color: #2B6377;
	text-align: center;
	margin: 0 auto;
	float: none;
}
p, ul, li
{
	font-family: "Literata";
margin: 0 0 0.5vh 0;
font-size: 1.2rem;
line-height: 1.5rem;
}

p:last, li:last
{
	margin-bottom: 60px;
}
p
{
flex-wrap: wrap;
}

h4
{
	font: bold 1.3rem "Literata";
	color: #2B6377;
	margin: 0 0 1.5vh 0;
}

h5
{
	font: bold 1.2rem  "PT Sans";
	color: #D1DFE5;
	margin: 0 0 10px 0;
}

@media all and (max-width: 2000px)	
{
header
	{
	width: 100%;
	height: 55vh;
	position: relative;
	display: flex;
	flex-direction: row;
	background: rgba(43,99,119,1);
	z-index:1;
	overflow: hidden;
	flex-wrap: wrap;
	}

header:before{
    z-index:-1;
    position:absolute;
    left:-165px;
    top:-330px;
    content: url('img/2021-06-17-6857.jpg');
    opacity:0.2;
}	
	.hamburger
	{
		display: none;
	}

}

#about
{
	background: #EAD5C1;
	/*background: #fff5e2;*/
	min-height:  60vh;
	display: flex;
	flex-direction: column;
}

.commonbox
{
	display: flex;
	max-width: 80vw;
	margin: 0 auto;
	flex-direction: column;
			flex-wrap: nowrap;
			padding: 0 0 20px 0;
}
@media all and (max-width: 1000px) and (orientation: portrait)
{
	.commonbox
	{
		flex-direction: row;
		flex-wrap: wrap;
		max-width: 95%;
	}

}
.connectbutton
{
	margin: 0 auto;
	margin-bottom: 20px;
	margin-top: 20px;
	width: 20vh;
	background-color: #2B6377;
	padding: 20px;
	border-radius: 5px;
	text-align: center;
	color: #EAD5C1;
	font: bold 1.5rem "PT Sans";
}





@media all and (max-width: 1000px)
{
	header
	{
		flex-direction: column;
	}
	#headLeft
	{
		display: none;
	}

	#headRight
	{
		text-align: center;
	}
	.hamburger
	{
		display: block;
	}

}


#headLeft, #headRight
{
	margin-top: 80px;
min-width: 49vw;
/*min-height: 30vh;*/
}
#headBottom
{
	display: none;
	flex-grow: 2;
	text-align: center;
	background: #D1DFE528;
	font-size: 1.3rem;
	max-height: 20vh;
}

.zapis
{
	font: bold 2rem "PT Sans" ;
	color: #EAD5C1;
	margin: 2vh 0 0 0;
}
.phone
{
		margin: 1vh 0 0 0;
}
.phone a
{
		font: bold 1.5rem "PT Sans" ;
	color: #D1DFE5;
	font-size: 2.5rem;
}

.phone a:hover
{
color: white;
}

.headtext
{
	font: normal 1rem "Literata";
 color: #EAD5C1;
 line-height: normal;
 margin: 0;

}


{
	color:red;
}

.headspisok
{
		font: normal 0.8rem "Literata";
 color: #EAD5C1;
	line-height: 1rem;
	margin: 10px 0 0 0;
}

#mainmenu
{
	text-align: right;
	margin:  0 40px 0 0;
}
#headLeft
{

}
#headLeft ul li
{
	font-family: "PT Sans";
	font-weight: normal;
	font-size: 1.35rem;
	color: #EAD5C1;
	margin:  0 0 39px 0;
}
#headLeft ul li a
{
	color: #EAD5C1;
	 transition: all 0.5s ease-in-out;

}

#headLeft ul li a:hover
{
	color: white;
	 transition: all 0.5s ease-in-out;
}
#headLeft ul li a:hover:before
{
	content: '● ';
}

#headRight
{

}
#headRight h1 a
{
	font-family: "PT Sans";
	color: #D1DFE5;
	font-size: 1.5rem;
	font-weight: 700;
	margin: 0 0 0 0;
}
#headRight h2
{
	font-family: "PT Sans";
	color: #EAD5C1;
	font-size: 2rem;
	font-weight: 700;
	margin: 10px 0 10px 0;
}

#aboutbox
{
	display: flex;
	flex-direction: row;

	margin: 0 auto;
}
#photobox
{
	background: url('img/portrait-01.jpg');
	background-repeat: no-repeat;
	background-position: center center;
	background-size: fill;
	min-width: 280px;
	min-height: 420px;
	margin: 0 20px 20px 0;
}

@media all and (max-width: 1000px) and (orientation:portrait)
{
	#photobox
	{
	min-width: 100%;
	background-position: center center;
	}
}

footer
{
	width: 100%;
	min-height: 30vh;
	background: #2B6377;
}
#footerbox
{
	flex-direction: row;
	padding: 30px 0 0 0;
}
#footerbox .spec ul li a
{
	font: normal 1.5rem "PT Sans";
	color: #EAD5C1;
}
.footertitle
{
font: normal 1.5rem "PT Sans";
color: #D1DFE5;
}
.footername
{
font: bold 2.5rem "PT Sans" ;
color: #EAD5C1;
}
.footerphone a
{
font: bold 2.5rem "PT Sans";
color: #D1DFE5;
}
@media all and (max-width: 1000px) and (orientation: portrait)
{
.footername
{
font: bold 1.5rem "PT Sans" ;
color: #EAD5C1;
}
.footerphone a
{
font: bold 1.5rem "PT Sans";
color: #D1DFE5;
}
#footerbox .spec ul li a
{
	font: normal 1rem "PT Sans";
	color: #EAD5C1;
}


}

#specs
{
	display: flex;
	flex-direction: column;
	background: #D1DFE5;
}

#prices
{
	background: #EAD5C1 ;
}

#specbox
{
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;

}

#uslugi
{
	background: #EAD5C1;
}


#process
{
	background: #EAD5C1 ;
}

#contacts
{
	background: #D1DFE5;
}

#page
{
	background: #EAD5C1;	
}

@media all and (max-width: 1000px) and (orientation:portrait)

{
#specbox
{
	display: flex;
	flex-direction: column;
	flex-wrap: nowrap;
	width: 90%;

}

}


.spec
{

width: 50%;

}
@media all and (max-width: 1000px) and (orientation:portrait)
{
	.spec
{

width: 100%;

}

}

.imgbox
{
	width: 90%;
	height: 30vh;
	background-size: cover;
		margin: 5vh 0 0 0;
}
.linkbox
{
	width: 90%;
	height: 7vh;
	margin: 0 0 0 0;
	background: #2B6377;
	display: flex;
	align-items: center;
	justify-content: center;
		color: #EAD5C1;
	font: bold 1.2rem "PT Sans";
}
.linkbox a
{
	color: #EAD5C1;
	font: bold 2rem "PT Sans";
}

@media all and (max-width: 1000px)
{
	.imgbox, .linkbox
	{
		width:100%;
	}
.linkbox a
{
	color: #EAD5C1;
	font: bold 1.3rem "PT Sans";
}

}




	#toggle {
  display: none;}

  /**
  Hamburger
**/
.hamburger {
  position: absolute;
  top: 5em;
  right: 5%;
  margin-left: -2em;
  margin-top: -45px;
  width: 2em;
  height: 45px;
  z-index: 5;
}

.hamburger div {
  position: relative;
  width: 3em;
  height: 7px;
  border-radius: 3px;
  background-color: #EAD5C1;
  margin-top: 8px;
  transition: all 0.3s ease-in-out;
}

/**
Nav Styles
**/
.nav {
  position: fixed;
  width: 100%;
  height: 100%;
  background-color: #2B6377;
  top: -100%; left: 0; right: 0; bottom: 0;
  overflow: hidden;
  transition: all 0.3s ease-in-out;
  transform: scale(0);
}
.nav-wrapper {
  position: relative;
  overflow: hidden;
  overflow-y: auto;
  height: 100%;
}
nav {
  text-align: left;
  margin-left: 25%;
}
nav a {
  position: relative;
font-family: "PT Sans";
	font-weight: bold;
	color: #EAD5C1;
  font-size: 2em;
  display: inline-block;
  margin-top: 1.25em;
  transition: color 0.2s ease-in-out;
  letter-spacing: 1px;
}
nav a:before {
  content: '';
  height: 0;
  position: absolute;
  width: 0.25em;
  background-color: white;
  left: -0.5em;
  transition: all 0.2s ease-in-out;
}
nav a:hover {
  color: white;
}
nav a:hover:before {
  height: 100%;
}

/**
Animations
**/
#toggle:checked + .hamburger .top-bun {
  transform: rotate(-45deg);
  margin-top: 25px;
}
#toggle:checked + .hamburger .bottom-bun {
  opacity: 0;
  transform: rotate(45deg);
}
#toggle:checked + .hamburger .meat {
  transform: rotate(45deg);
  margin-top: -7px;
}

#toggle:checked + .hamburger + .nav {
  top: 0;
  transform: scale(1);
}


.inputmain
{
	clear: both;
	font: normal 13pt "PT Sans";
	background: rgba(255,255,255,0);
	border: 0px;
	border-bottom: 1px dotted #2B6377;
	line-height: 1.5em;
	max-width: 600px;
	width: 80%;
	padding: 10px;
}

.inputsubmit
{
	clear: both;
	font: normal 13pt "PT Sans";
	background: #2B6377;
	color: white;
	border: 0px;
	border-radius: 10px;
	line-height: 2em;
	width: 60px;
	height: 60px;
	margin: 10px;
}
.wa_submit
{
	background: url('ui/wa-logo.svg');
	background-repeat: no-repeat;
	background-position: cover;
}

.tg_submit
{
	background: url('ui/tg-logo.svg');
	background-repeat: no-repeat;
	background-position: cover;	
}

#queryform
{
	width: 100%;
}



@media all and (max-width: 1000px)
{


.inputmain
{
	width: 100%;
}
}