@import url('https://fonts.googleapis.com/css2?family=Nunito:ital,wght@0,200;0,300;0,600;1,400;1,600&family=Prosto+One&display=swap');

body								{ font-family: 'Nunito', sans-serif; font-weight: 300; max-width: 980px; margin: 0px auto; line-height: 1.5; }

h1,h2,h3,.h1,.h2,.h3				{ font-family: 'Prosto One'; padding: 16px 0px 0px 0px; display: block;}

h1, .h1								{ font-size:36px; }
h2, .h2								{ font-size:20px; font-family: 'Nunito', sans-serif; }
h3, .h3								{ font-size:16px; }

a									{ color:#0288D1; text-decoration: none; }
.p-short							{ width: 70%; }

.h2 span							{ font-size:18px; font-weight: 300; }

.subtitle-block						{ margin: 0px 22px 0; color: #bdbdbd;}
.title-block						{ padding: 0px; font-size: 48px; margin: -30px 0;}
.title-line							{ margin: 10px 0px; padding: 18px 0px 24px; border-bottom: 1px solid #e6e6e6; }

.title-translate					{ margin: 0px;  }
.title-translate:before				{ content: ' \232F '; margin: 0px 5px 0px 0px;}

.hidden								{ overflow: hidden;}

section a:visited					{ color:#bcd6e9; }
nav  a:visited						{ color:#bdbdbd; }
a:hover								{ text-decoration: underline; color:#0288d1; }

.content p a 						{ font-weight: bold; display: inline-block; border-bottom: 2px solid #1873b4; padding: 0px 4px; }
.content p a:hover 					{ text-decoration: none; background: #bcd6e9; transition: 0.2s; color: #333;  }
.content .tbl a 					{ border-bottom: 0px solid #1873b4; padding: 0px; }
.content .tbl a:hover 				{ text-decoration: underline; background: none; }

.content a[href^="http"],  
.content a[href^="#"] 				{ border-bottom: 0px; }

.content a[href^="http"]:hover		{ text-decoration: none; color: #333; }

section a[href^="http"]::after 		{
									  content: " 🡥";
									  vertical-align: super;
									  font-size: 10px;
									}
/*
a[href^="#"]::after { content: "\1F893"; }
*/


iframe								{ border: 0px; }
q									{ border-left: 4px solid #dfdfdf; padding-left: 25px; display: block; }
blockquote:before					{ position: absolute; margin-top: -20px; margin-left: -35px; padding-right: 25px; font-size: 3rem;    content: "\201c"; }
blockquote,q						{ font-size: 1.5rem;  margin: 50px auto; }

#map a,span 						{ }
h2 span								{ font-size: 24px; }
h2 span+span						{ font-size: 18px; }

figure								{ margin: 0px 0px; overflow: hidden;}
figcaption,.capiton					{ font-size: 80%; text-align: center; color: grey; margin-block-start: 1em; margin-block-end: 1em; }
.txt-left							{ text-align: left; }
.txt-width li						{ line-height: 1.8; }

p.l1:first-letter 					{ font-size:190%; font-weight:bold; }

.info								{ padding: 15px 15px 15px 25px; margin: 25px auto; background: #f5f5f5; }
 

.green								{border-left: 4px solid green; }
.alarm								{border-left: 4px solid orange; }
.alter								{border-top: 4px solid yellow;border-bottom: 4px solid yellow; }

.grey								{color: #bdbdbd;}

ul li								{list-style-type: circle; list-style-position: inside;  }	
ul ul li							{padding-left: 25px; list-style-type: disc; }	
ul li span							{color: #bdbdbd;}

iframe								{width:100%; min-height:480px;} 
 
.about								{/** width: 30%; **/}
.content 							{/**width: 70%;**/ width: 80%; margin: 0px auto;}
.design .content 					{width: 100%; margin: 0px auto;}


.img								{overflow:hidden;}

.prename							{line-height: 300%;}
.about								{font-weight: 300; overflow: hidden; width: 30%; position: relative; float: left; margin: 25px 45px 25px -10%;}
.about span							{color: #dfdfdf; }
.content							{/**float: right;**/ }
small b								{font-size: 90%;}

.block								{display: block; min-height: 100px; min-width: 100px; overflow:hidden; }
.right								{float: right;}
.left								{float: left;} 
.out-r								{margin: 20px -50px 20px 20px; max-width: 35%;}
.out-l								{margin: 20px 20px 20px -100px; max-width: 35%;}
.inner								{padding: 20px;}

.w140								{width: 120%; margin-left: -10%;}
.w120								{width: 120%; margin-left: -10%;}
.w100								{width: 100%;}
.w90								{width: 90%; }
.w80								{width: 80%; }
.w60								{width: 60%; }
.w50								{width: 50%; }
.w40								{width: 40%; }
.w30								{width: 30%; }
.w20								{width: 20%; }
.w10								{width: 10%; }

.w120 .w30							{width: 31%; float: left; margin: 0px 1%;}
.w120 .w50							{width: 48%; float: left; margin: 0px 1%;}
.w120 .r0							{float: right; margin: 1% 0% 1% 1%;}
.w120 .l0							{float: left; margin: 1% 0px 1% 1%;}
.w120 .h100							{margin: 1% auto;}
.w120 .h-v							{height: 607px;}
.w120 .h-h							{margin: 1% auto;}

.w100 .w50							{width: 50%; float: left; text-align: center;}

.h50								{height:50%;}

img.w100:focus 						{width: auto; position: absolute; left: 0px;}

/** img.w100:hover {max-width: none;position: absolute; left: 0px; } **/

.w50.total							{text-align: left; }
.w50.opinion						{text-align: left;}

.clm								{float: left;}
.th									{font-weight:600; border-bottom: 1px solid #dfdfdf; margin: 0px 0px 5px 0px; }
.tbl								{margin: 50px auto;}
.tdline								{padding: 10px 15px; border-bottom: 1px solid #dfdfdf;}

.brd-r								{border-right: 1px solid #dfdfdf;} 

a.list								{ color: #333; display: block; margin: 20px 0px; border-left: 4px solid #0288D1; padding: 0px 0px 0px 15px; font-size:14px;}
a.list:visited						{ color: #777; }

ul.list								{border-left: 0px; font-size:16px;}

nav									{overflow: hidden; height: 61px; line-height: 60px; }
ul									{margin: 0px; padding: 0px;}
nav li								{font-weight: 600; list-style-type: none; float: left; width: 20%; text-align: center; border-bottom: 1px solid #dfdfdf; font-family: 'Prosto One'; line-height: 60px;}
.home 								{text-align: left;}

header								{}
header a							{color: #000; }
header nav							{margin: 25px auto; }
header li							{float: left; width: 15%; border-bottom: 0px solid #dfdfdf; /** line-height: 55px; **/ }
header li.crnr 						{text-align: center; width: 10%; font-weight: 400;}
li.crnr a:hover						{text-decoration: none;}
li.home 							{text-align: center; width: 20%;  line-height: 1.5; font-family: 'Nunito', sans-serif; }
li.home span						{font-size: 18pt; color:#a4a4a4; }
li.home a							{text-decoration: none;}

.crcl								{ display: inline-block; }
.crcl:before						{ content: ' '; width: 5px; height: 5px; border-radius: 6px; display: inline-block; margin-bottom: 2px; }
.grn:before							{ background-color: green; }
.grey:before						{ background-color: grey; }
.gold:before						{ background-color: gold; }
.blue:before						{ background-color: blue; }
.purple:before						{ background-color: purple; }

.country ul li						{ list-style-type: disclosure-closed; list-style-position: outside; padding: 5px 0px; cursor: context-menu; }		
.country ul							{ padding-left: 20px; font-size: 14px;}		
.country ul li::marker				{ color: darkgray; font-size: 10px;}
.country ul li:hover::marker		{ color:#0288d1; }

.trip, .center						{text-align: center; }
 
.cat								{margin: 30px; font-weight: 200;}
.anons								{font-size: 12px; border-bottom: 3px double #c6c6c6; border-top: 3px double #c6c6c6; margin: 30px auto; width: fit-content; padding: 5px;}

.sub-menu 							{ display: none; } 
.main-item:focus ~ .sub-menu, 
.main-item:active ~ .sub-menu, 
.sub-menu:hover 					{ display: block; } 

footer								{position: fixed; right: 0px; bottom: 0px; width:8%; float: right; writing-mode: tb; padding: 2%;}





@media screen and (max-device-width:640px), screen and (max-width:640px) {

	.body 							{width: 90%; margin: 0px auto; line-height: 1.8;}
	nav								{width: 90%; }
	nav ul li						{width: 21%; font-size: 12px;}

	.home 							{width: 16%; }
/*	.home  a						{text-transform: lowercase;} */
	.about, .content				{width: 100%; float: none; margin-bottom: 50px;}


	header 	nav ul li				{width: 20%; }
	header nav						{margin: 5px auto; }
	li.home 						{width: 40%; line-height:60px;  font-family: 'Prosto One'; }
	li.home span 					{font-size: 12pt;}



	h1								{line-height: 1.5; font-size: 30px}
	h2								{font-size: 18px}

/*
	h1,h2,h3,q,.info				{margin: 45px 0px;}

	p								{margin: 45px 0px;}
*/
	ul li							{list-style-position: inside;}	
	blockquote,q					{font-style: italic; font-size: 1.2rem; color: #777;}
	blockquote:before				{margin-top: -40px; margin-left: -10px; color: #777;}
	.out-r							{margin: 20px 0px 20px 20px; max-width: 45%;}
	.out-l							{margin: 20px 20px 20px 0px; max-width: 45%;}
	.out-r img,.out-l img,.p-short	{width: 100%;}

	.about							{margin: 45px auto; border: 1px solid #dfdfdf; padding: 25px; width: 85%; background: #fcfcfc;}	
	.city							{padding: 20px; width: 87%;}
	.about span						{color: #333;}
	.about span:first-child:before	{content: "Цифры и факты о стране: (↓ смотреть)"; display: block; white-space: nowrap; }
	.city span:first-child:before	{content: "Город в цифрах и фактах: (↓ смотреть)"; display: block; white-space: nowrap; }
	.about p						{line-height: 1;margin: 0px;}
	.about small					{display: none;}
	.about span:focus ~ small		{display: block;  margin-top: 25px;}

	.w100 .w50,.w120 .w30, .w60		{width: 100%;}
	 
	.w120 .w50						{width: 110%;} 
	.w120,.w140						{width: 110%; margin-left: -5%;} 
	.txt-width						{width: 100%; margin-left: 0%;}
	.w120 .h-v						{display: none;}
	.w40							{width: 100%;}
	.th								{min-height: 60px; }

	.mbl-no							{display: none;}

	footer							{ width: 90%; float: none; /** position: relative; writing-mode: horizontal-tb; **/ border-top: 0px dotted #eaeaea; margin: 0px; color: #cacaca; padding: 20px 0; line-height: 1;}

}