Issues:
1#maincameralist{
2 height:400px;
3 width:400px;
4 max-width:100%;
5 background: hsla(0,0%,100%,.7);
6 position:absolute;
7 overflow-y:scroll;
8 display:none;
9}
10#maincameralist .el{
11 display:block;
12 float:left;
13 width:50%;
14 text-align:center;
15 margin-top:10px;
16 position:relative;
17
18}
19#maincameralist .el:nth-child(2n-1){
20 clear:both;
21}
22#maincameralist .nextpage{
23 display:block;
24 float:left;
25 width:150px;
26 text-align:center;
27 background: #6192ca;
28 border: 1px solid #4f81bc;
29 color:#fff;
30 border-radius:10px;
31 margin-top:10px;
32 margin-bottom:10px;
33 margin-left:-75px;
34}
35#maincameralist .el img{
36 width:90%;
37}
38#maincameralist .el img.preload{
39 width:auto;
40}
41#maincameralist .el span{
42 position:absolute;
43 bottom:10px;
44 left:10px;
45 width:90%;
46 text-align:center;
47 color:#fff;
48 font-weight:bold;
49}
50#gmap{
51 height:400px;
52 width:100%;
53 position:absolute;
54}
55#mapblock{
56 height:400px;
57 width:100%;
58 position:relative;
59}
60.ccc{
61 float:left;
62 width:50%;
63 height:1px;
64 clear:both;
65}
66.arealist{
67
68}
69.arealist div.el{
70 width:45%;
71 display:inline-block;
72 vertical-align:top;
73 margin-bottom:10px;
74}
75@media (max-width: 600px) {
76 .arealist div.el{
77 width:99%;
78 }
79}
80.citylist{
81
82}
83.citylist div.el{
84 width:24%;
85 display:inline-block;
86 vertical-align:top;
87 margin-bottom:10px;
88}
89@media (max-width: 600px) {
90 .citylist div.el{
91 width:45%;
92 }
93}
94.citylistmore{display:none;}
95.citylistshowmore{font-weight:bold;clear:both;}
96.citylistshowless{font-weight:bold;clear:both;display:none;}
97.camera_list{
98
99}
100.camera_list a{
101 text-align:center;
102}
103.camera_list span.img{
104 display:inline-block;
105 text-align:left;
106 height:100px;
107}
108.camera_list span.img img{
109 height:90%;
110 width:90%;
111}
112.camera_list span.img img.preload{
113 height:auto;
114 width:auto;
115}
116.camera_list span.name{
117 display:inline-block;
118 text-align:left;
119 padding:10px;
120}
121.camera_list div{
122 text-align:center;
123 width:24%;
124 display:inline-block;
125 vertical-align:top;
126 margin-bottom:10px;
127}
128@media (max-width: 600px) {
129 .camera_list div{
130 width:45%;
131 }
132}
133.rightblockcameraslist{
134
135}
136.rightblockcameraslist div{
137 vertical-align:top;
138}
139.rightblockcameraslist a{
140 display:inline-block;
141 width:100%;
142 position:relative;
143}
144.rightblockcameraslist img{
145 width:90%;
146}
147.rightblockcameraslist img.preload{
148 width:auto;
149}
150.rightblockcameraslist span.img{
151 display:inline-block;
152 width:45%;
153 vertical-align:top;
154 text-align:center;
155}
156.rightblockcameraslist span.name{
157 display:inline-block;
158 width:45%;
159 vertical-align:top;
160}
161#insideCam{
162 height: 450px;
163}
164.tags{
165 text-align: right;
166
display: inline-flex;
167 margin-top: 20px;
168 margin-bottom: 20px;
169}
170.tag{
171 border: 1px solid gray;
172 border-radius: 15px;
173 margin-left: 15px;
174 padding-left: 10px;
175 padding-right: 10px;
176}
177.labels{
178 /*text-align: right;*/
179
display: inline-flex;
180 flex-wrap: wrap;
181 justify-content: space-between;
182 margin-top: 20px;
183 margin-bottom: 20px;
184}
185.label{
186 border: 1px solid #2980b9;
187 border-radius: 15px;
188 margin-left: 15px;
189 margin-top: 10px;
190 margin-bottom: 10px;
191 padding-left: 10px;
192 padding-right: 10px;
193}
194.label.active{
195 background-color: #2980b9;
196 border-color: #2980b9;
197 color: white;
198 font-weight: bold;
199}
200.breadcrumbs{
201 box-shadow:none;
202}
203.breadcrumbs li{
204 display:inline-block;
205}
206.breadcrumbs li:after {
207 content: ">";
208 margin:0 5px;
209}
210.breadcrumbs li:last-child:after {
211 content: "";
212 margin:0 10px;
213}
214.camera_menu a{
215 display:inline-block;
216 height:30px;
217 padding-left:30px;
218 background-repeat:no-repeat;
219}
220/* Style The Dropdown Button */
221.dropbtn {
222 background-color: #4CAF50;
223 color: white;
224 padding: 11px;
225 font-size: 16px;
226 border: none;
227 cursor: pointer;
228}
229/* The container <div> - needed to position the dropdown content */
230.dropdown {
231 position: relative;
232 display: inline-block;
233 z-index: 610;
234}
235/* Dropdown Content (Hidden by Default) */
236.dropdown-content {
237 display: none;
238 position: absolute;
239 background-color: #f9f9f9;
240 min-width: 342px;
241 max-width: 100vw;
242 box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
243 z-index: 1;
244}
245/* Links inside the dropdown */
246.dropdown-content a {
247 color: black;
248 padding: 12px 16px;
249 text-decoration: none;
250 display: block;
251}
252/* Change color of dropdown links on hover */
253.dropdown-content a:hover {background-color: #f1f1f1}
254/* Show the dropdown menu on hover */
255.dropdown:hover .dropdown-content {
256 /*display: block;*/
257
display: flex;
258 flex-wrap: wrap;
259 justify-content: space-between;
260}
261/* Change the background color of the dropdown button when the dropdown content is shown */
262.dropdown:hover .dropbtn {
263 background-color: #3e8e41;
264}
265.cities_list{
266
display: flex;
267 flex-wrap: wrap;
268 justify-content: space-between;
269}
270.cities_list a{
271 padding: 12px;
272}
273.similar_cam_row{
274 background-color: #DDDDDD;
275 padding: 10px 20px;
276}
277.similar_cams{
278
display: flex;
279 flex-wrap: wrap;
280 justify-content: space-between;
281}
282.similar_cam{
283
display: flex;
284 flex-direction: column;
285 width: 30%;
286 padding-bottom: 16px;
287 font-size: 16px;
288}
289.popular_cam a{
290 color: black;
291}
292.popular_cams{
293
display: flex;
294 flex-wrap: wrap;
295 justify-content: space-between;
296}
297.popular_cam{
298
display: flex;
299 flex-direction: column;
300 width: 45%;
301 padding-bottom: 16px;
302 font-size: 16px;
303}
304#map_pop{
305 display: block;
306 position: relative;
307 /*z-index: 1000;*/
308 background-color: #E9F1F1;
309 /*width: 25%;*/
310 /*height: 100%;*/
311 /*right: 0;*/
312 /*left: 75%;*/
313 top: -20px;
314 padding: 10px;
315 bottom: 0;
316}
317.nearest_cams{
318
display: flex;
319 flex-wrap: wrap;
320 flex-direction: row;
321 justify-content: flex-start;
322}
323.nearest_cam a{
324 /*width: 30%;*/
325}
326.nearest_cam .name{
327 padding-left: 5px;
328}
329.nearest_cam{
330
display: flex;
331 flex-direction: column;
332 width: 30%;
333 padding-bottom: 16px;
334 padding-left: 3%;
335}
336@media screen and (max-width: 600px) {
337 .nearest_cams{
338 justify-content: space-between;
339 }
340 .nearest_cam{
341 width: 40%;
342 }
343}
344/*tabs*/
345.tabs {
346 font-size: 0;
347}
348.tabs>input[type="radio"] {
349 display: none;
350}
351.tabs>div {
352 /* скрыть контент по умолчанию */
353 display: none;
354 border: 1px solid #e0e0e0;
355 padding: 10px 15px;
356 font-size: 16px;
357}
358/* отобразить контент, связанный с вабранной радиокнопкой (input type="radio") */
359#tab-btn-1:checked~#content-1,
360#tab-btn-2:checked~#content-2,
361#tab-btn-3:checked~#content-3 {
362 display: block;
363}
364.tabs>label {
365 display: inline-block;
366 text-align: center;
367 vertical-align: middle;
368 user-select: none;
369 background-color: #f5f5f5;
370 border: 1px solid #e0e0e0;
371 margin: -1px;
372 padding: 0;
373 font-size: 16px;
374 line-height: 1.5;
375 transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out;
376 cursor: pointer;
377 position: relative;
378 top: 1px;
379 width: 50%;
380}
381.tabs>label:not(:first-of-type) {
382 border-left: none;
383}
384.tabs>input[type="radio"]:checked+label {
385 background-color: #fff;
386 border-bottom: 1px solid #fff;
387}