body {
	font: normal 100% Arial, sans-serif;
	margin: 0;
	text: black;
	background: #ffffff;}
    #page{
	width:100%;
	margin:0;}
    A:link{
	color:#3366CC;
	text-decoration:none}
    A:visited{
	color:#6A60B0;
	text-decoration:none;
	font-weight: bold}
     A:hover{
	text-decoration:underline}
     P{
	text-align:justify;
	margin:0}
     h1{
	padding-top:1%;
	font-size:1.3em;
	color:navy;
	text-align:center}
     h2{
	font-size:1.3em;
	color:navy;
	text-align:center;
	padding-top:10px}
     h3{
	margin:1em 0 0.7em 0;
	font-size:1.05em;
	color:navy;
	text-align:left;
	text-indent:2.5em}
     b{
	color:#333}
     img {
	max-width:100%}
     td {
	font: normal 93.75% Arial, sans-serif;
	text-align:center}
/*----------------------------------------------head-------------------*/
     #head {
	max-width:1200px;
	margin: 0 auto; 
	color: #333399;}
     #head_1 {
	float:left;
	margin-left:2%;}
     #logo1 {
	display:none}
     #head_2 {
	float:left;
	width:50%;
	margin-top:5px;}
     #centr_vertebrologii {
	text-align:center;
	font:bold 1.6em  Arial, sans-serif}
     #lechenie_pozv{
	text-align:center;
	font:1.2em  Arial, sans-serif}
     #head_3 {
	float:left;
	margin-top:20px;
	margin-left:7px;}
     #tel{
	font:bold italic 1.3em  Arial, sans-serif;}
     #adress{
	float:right;
	margin-right:3%;
	text-align:right;
	font:1.1em  Arial, sans-serif;}
/*------------------------------------image-main---------------------------*/
   .image{
	position:relative;
	width:100%;
	max-width:1400px;
	height:200px;
	margin:0 auto;
	background:#000}
   .image img {
   	width:100%;
   	height:200px;
   	object-fit:cover;
	opacity:0.7}
   .image div{
	position:absolute;
   	width:100%;
   	height:200px;
	top:0;
	left:0}
   .image div>h1{
	font-size:1.8em;
	color:#fff;
	margin-top:60px}
    .image div>p{
	text-align:center;
	color:#fff}
/*----------------------------------------------content-----------------------*/
    h2.glavnaja{
	font-size:2.5em;
	font-weight:bold;
	color:navy;
	text-align:center;
	line-height:48px;
	margin-top:30px}
     .content{
	width:100%;
	float:left}
     .content p{
	margin:10px auto;
	padding:0 10px;
	max-width:1000px;
	line-height:140%}
     .content iframe{
	margin:10px}
     .content strong{
	color:#333}
     .content ul{
	display:block;
	list-style-type:square;
	list-style-image: url(https://vertebrolog.kiev.ua/images/point.png);
	margin:10px auto 5px;
	width:85%;
	line-height:140%}
     .content li{
	margin-top:5px}
     .content ol{
	margin:10px auto 5px;
	width:85%;
	line-height:140%;
	list-style-type:decimal}
     .article{
	max-width:1000px;
	margin:0 auto;}
    .stelki{
	width:80%;
	margin:0 auto}
    .stelki img{
	display:block;
	float:left;
	padding:20px}
    .paragraph li{
	margin:10px 0}
     div.paragraph {
	padding:0 10%}
    .paragraph p{
	text-indent:-25px}

/*------------------------------------article-menu---------------------------*/
    .article-menu{
	width:70%;
	margin:0 auto}
    .article-menu a{
	display:block;
	float:left;
	padding:9px 14px;
	margin:7px 7px 17px 7px;
	background:#e1e1fd;
	text-decoration:none;}
    .article-menu a:hover{
	background:#ccf}
     a.active-button{
	background:#ccf;
	cursor:pointer}

/*---------------------------------------------------kak-prokhodit-lecheniye--------------------------*/
    .flex-block-lecheniye{
	width:520px;
	display: flex;
	flex-wrap: wrap;
	justify-content:space-around;
	align-items:flex-start}
    .flex-block-lecheniye div{
	width:200px;
	float:left}
    .flex-block-lecheniye p:first-child{
	width:100%;
	font-size:3.2em;
	font-weight:bold;
	color:green}
    .flex-block-lecheniye div > p.flex-block-text1{
	font-size:1.5em;
	line-height:24px}

/*------------------------------------banner-strip---------------------------*/
     .banner-strip{
	width:100%;
	background:#ccf;}
     .banner-strip div{
	width:80%;
	margin:0 auto;
	padding-top:0.8%;
	color:navy;
	font-size:1.1em;
	font-weight:bold;
	text-align:center;}
     .banner-strip p{	
	display:inline-block;
	margin-top:0;
	margin-bottom:0;
	margin-left:65%;
	color:navy;
	font-weight:bold;}
/*----------------------------------flex-block---------------------------------*/
    .flex{
	width:100%;
	max-width:1000px;
	margin:-5px auto 5px; 
	display: flex;
 	flex-wrap: wrap;
 	justify-content: space-around;
 	align-items: flex-start;}
    .flex-block{
	padding:0px 1.2%;
	margin-bottom:20px}
    .flex-block img{
	margin:0 auto;
	display:block;}
   .flex-block-3 img{
	width:100%;
	max-width:240px;}
    .flex-block p{
	width:100%;
	max-width:270px;
	text-align:center;
	padding:0}
    p.flex-block-text1{
	color:navy;
	font-weight:bold}
    p.flex-block-text2{
	text-align:justify}
    .flex-block a{
	display:block;
	max-width:240px;
	text-decoration:none;
	color:#000}
    .flex-block a>div{
	overflow:hidden}
    .flex-block a>div>img{
	transition:0.5s}
    .flex-block a:hover>div>img{
	transform:scale(1.2)}
    .flex-block a:hover>p.flex-block-text1{
	color:red}
    .flex-block span{
	color:navy}
    .flex-block a:hover>span{
	text-decoration:underline}
    .vrachi{
	padding:20px 1%}
    .vrachi img{
	width:200px}
    .protsedury img{
	width:270px}
    .flex-gryzha {
	width:38%}
/*----------------------------------fixed-block---------------------------------*/
   .fixed-block{
	width:100%;
	padding:80px 0 80px;
	  -webkit-background-size: cover;
	  -moz-background-size: cover;
	  -o-background-size: cover;}
   .fixed-block p {
	color:white;
	text-align:left;
	font-size:2.4em;
	font-weight:bold;
	line-height:1;	
	text-shadow: 1px 0px 7px black, 0px 1px 7px black}
   .fixed-block p:first-child {
	margin:0 auto;
	padding-bottom:150px;
	text-align:center;
	font-size:2.9em;
	font-weight:bold;
	color:navy;
	text-shadow: 3px 0px 5px white, 0px 3px 5px white, -3px 0px 5px white, 0px -3px 5px white;}
    .fixed-block-video{
	width:100%;
	max-width:1000px;
	margin:0 auto; 
	display:flex;
 	flex-wrap:wrap;
 	justify-content:space-around;
 	align-items:center}
/*------------------------------------------------price--------------------------*/
   .price{
	width:100%;
	margin:0 auto}
     .title{
	width:100%;
	background:#ccf;
	margin-top:20px;
	float:left}
     .title p{
	margin:0;
	padding-top:0.8%;
	padding-bottom:0.8%;
	color:navy;
	font: bold italic 14pt/12pt sans-serif;
	text-align:center}
     p.cost{
	display:inline-block;
	float:right;
	margin:-24pt 19% 0 0;
	font-size:10pt}
     .services{
	width:65%;
	margin:0 auto}
     p.service-name{
	float:left;
	width:80%;
	margin:7px 0 0 0}
     p.service-cost{
	float:right;
	width:20%;
	margin:7px 0 0 0;
	text-align:center}
	
@media screen and (max-width: 768px) {
      body{
	font-size:110%;
	line-height:}
     #head_1 {
	width:12%}
      #logo {
	display:none}
      #logo1 {
	display:block;
	margin-top:9px}
      #head_2 {
	width:70%;
	margin:0px auto}
      #head_3{
	width:86%;
	margin:0 auto}
      #tel{
	float:left;
	text-align:center;
	margin-left:30%;}
      #adress{
	margin:0;
	text-align:center;
	width:100%;
	font:italic 1.1em  Arial, sans-serif}
    .content iframe{
	width:96%}
    .content ul, .content ol{
	width:96%}
    .stelki{
	width:100%}
     div.paragraph {
	padding:0 3% 0 8%}
/*----------------------------flex-block------------------*/
    .flex-block-3{
	margin:0 10px 20px}
   .flex-block-3 img{
	max-width:400px;
    	object-fit:cover;}
    .flex-block p, .flex-block a{
	max-width:100%}
    .vrachi img{
	width:180px}
    .protsedury img{
	width:100%;
	max-width:500px}
    .flex-gryzha {
	width:90%}
/*----------------------------fixed-block------------------*/
   .fixed-block{
	padding:40px 0 30px;}
   .fixed-block p {
	font-size:2.0em;
	text-shadow: 1px 0px 7px black, 0px 1px 7px black}
   .fixed-block p:first-child {
	padding-bottom:150px;
	font-size:2.5em;}
/*-----------------------kak-prokhodit-lecheniye-----------*/
   .flex-block-lecheniye div{
	width:95%}
/*--------------------------banner-strip--------------------*/
     .banner-strip div{	
	width:98%;}
/*----------------------------price--------------------------*/
     .title{
	height:40px}
     p.cost{
	margin:-16pt 3% 0 0}
     .services{
	width:95%}
}