@import url('https://fonts.googleapis.com/css?family=Suez+One|Roboto+Slab');
/*@charset"utf-8";*/
/*1046 пропадає заголовок crome, 930 - mozila*/
/*680 menu - 200 */
*{
	margin:0;
	padding:0;
	outline:none;/*забороняємо підсвітку об'єктів*/
}
body, html{
	width:100%;
	height:100%;
}


a{
	color:white;
	text-decoration:none;
}

a:hover{
	color:silver;
}
a, a:hover{
	-moz-transition:all.6s ease;
	-webkit-transition:all.6s ease;
	transition:all.6s ease;
}
.clear{clear:both;}/*розділення блоків сайта*/
img{
	max-width:100%;
	height:auto;
	width:auto\9;/*ie8*/
	/*плавний перехід картинки*/
	-moz-transition:all.3s ease-out;
	-webkit-transition:all.3s ease-out;
	transition:all.3s ease-out;
}
hr{
	display:block;
	height:1px;
	border:0px;
	border-top:1px solid #ccc;
	margin:1em 0;
	padding:0;
}
header{
	width:99.4%;
	height:100px;
	/* float:left; */
	position:relative;
	padding:0.3%;
	background-color:#8491c2;
	border-bottom:5px solid #59595a;
}
#logo img{
	width:90px;
	height:75px;
	margin-top: 15px;
}
	#sphead{font-size: 1.8em;
			float: right;
			font-family: 'Suez One', serif;
			/* border: 2px solid black; */
			margin-top: 30px;
			margin-right: 25px;}
	header>#logo>a>img{
		margin-left:5%;
	}
	#logo{
		float:left;
		width:40%;
	}
	#navigation{
		text-align: center;
		float: left;
		width: 30%;
		height: 100px;
		/* background:red; */
	}
	#navigation > p{
		float:right;
	}
	#navigation:hover{
		cursor:pointer;
	}
div > #showMenu{
		margin-left:120px;
	}
.hideMenu{
	background-color:rgb(16 160 160);
}

#about{
		text-align:right;
		float:left;
		width:27%;
	}


#about{
	text-align:center;
	font-family:'Roboto',sans-serif;
	font-size:1.4em;
	padding-top:35px;
}

#footer{
	width:98%;
	float:left;
	padding:1%;
	background-color:#343434;
	border-top:5px solid #59595a;
	font-family:'Roboto Slab',sans-serif;
}

#rights{
	float:left;
	margin-right:5%;
	margin-top:20px;
	font-size:1.2em;
}
#social{
	float:right;
	width:10%;
	margin-right:5%;
	margin-top:20px;
	/* border:2px solid blue; */
}
#social>a{
/* 	border-radius:50%;
	-moz-border-radius:50%;
	-webkit-border-radius:10%;
	 background-color:rgba(217, 91, 72, 1);  */
	margin-left:2%;
	width:30px;
	height:30px;
	float:right;
	color:white;
}
#social>a:hover{
	border-radius:50%;
	-moz-border-radius:50%;
	-webkit-border-radius:10%;
	background-color:rgba(217, 91, 72, 1);  
}
#social>a:first-child{
	margin-left:15px;
} 
#footerContact{
	float:left;
	/* margin-right:5%; */
	margin-left:200px;
	margin-top:20px;
	font-size:1.2em;
}
#content{
	width:96%;
	float:left;
	/*margin:5px;*/
	padding:2%;
	background-color:#f3f5f5;
	border-bottom:5px solid #59595a;
}
#content p{
	text-align:justify;
}
ul{
	list-style-position: inside;
}
ol{
	list-style-position: inside;
}
#myUl{
	margin-left:15px;
}
@media(max-width:980px){
	#clear{
		clear:both;
	}
}
@media(max-width:1046px){
	#sphead{
		display:none;
	}
}
@media(max-width:750px){
	#about{
		display:none;
	}
	div > #showMenu{
		margin-left:20px;
	} 
	div > #hideMenu{
		min-width: 200px;
	}

}
/*-------------------------------------------------------------*/
.stImg{
	float:left;
	margin: 10px;
	/*background: rgba(220, 239, 239, 1); */
}
.vs{
	text-indent:20px;
	margin: 0; 
	text-align:justify;
	}
#nF{
	clear:left;
}
.sp{
	/*background-color:white;*/
}
/*--------------------------Table-------------------------------------*/
		.container{
			display:grid;
			/*grid-template-columns:1fr 1fr;*/
			grid-template-columns:repeat(auto-fit, minmax(300px,1fr));
			}
		.div_left{
		    background-color: rgb(0, 234, 107);
	        padding: 1px;
			width:100%;
			height:auto;
		}
		.div_right{
	        background-color: rgb(226, 200, 148);
	        padding: 1px;
			width:100%;
			height:auto;
		}
		table{
			box-sizing:border-box;
		}
		td > p{
			margin:5px;
		}

/*----------слайдер img----------------*/

#photoContainer img
	 {
		width : 84px;
		height : 84px;
		margin : 10px;
		cursor : pointer;
	 }
.mainPhoto
     {
		width: 900px;
		height: 700px;
	 }
/*------------menu-------------*/
.first, .second, .fird {
    display: block;
    opacity: 1;
    height: 5px;
    width: 50px;
    margin: 0 0 13px 0 ;
	padding-left:0px;
    padding-top: 0;
    background: white;
    overflow: hidden;
    -webkit-transition: all 0.2s linear;
    -moz-transition: all 0.2s linear;
    -o-transition: all 0.2s linear;
    transition: all 0.2s linear;
}
.first:hover{
	background-color:silver;
}
.second:hover{
	background-color:silver;
}
.fird:hover{
	background-color:silver;
}
#showMenu{
	width:100px;
	height:70px;
	/*background-color:yellow;*/
	margin-left:180px;
	margin-top:25px;
	padding-top:5px;
}
#poz{
	margin-left:25px;
}
#contact{
    height:290px;
}