@charset "utf-8";
/* CSS Document */
body{
background-color:#fff; 
};
 
#main_container{   
}

#search-middle {    
 height:80vh;   
 /* min-width:550px; */
 
	margin-top:5px; margin-bottom:5px;  }


#middle-left{float:left; padding:7px 0px; 
    width: calc(100% - 570px); height:100%; margin-bottom:5px;

}
#mapcanvas{ background-color:aliceblue;width:100%;height:100%;}

#middle-right{ float:right;width:540px;height:100%;padding-top:5px; margin-top:6px;
	overflow-x:hidden;
	margin-right:10px; 
  border: solid 1px #c6c6c6;  
 
}



/* -------------   */

#forcl{position:relative;}
#cl{font-size:14px;padding:0px 5px 2px 4px;position:absolute; left:6px;top:8px;width:9px;height:15px; border:solid 1px  #D3D3D3;}

/*   */
#searchline1{  }
#searchline2 {width:170px; padding-left:30px;padding-top:10px;border-left:solid 1px #E9E8E8;border-right:solid 1px #E9E8E8;  color:#5477b9; 
            
}
 
 .searchline2_adapt { display: block; width:162px; float:none; }

#searchline3{ width:150px; 
	
	padding-top:7px;height:50px;margin-top:12px;
	padding-left:30px;
 
 
 /* background-image:url(../picts/addrecord.png);
 background-size: auto 42px;
 background-repeat: no-repeat; */

}
a#div_plus_circle{
	display:block;
    margin-right:10px;position:relative;
}

a#div_plus_circle::before {
	position:absolute; top:-4px;
	content: '+';
	display: flex;
	justify-content: center;
	align-items: center;
	width: 30px;
	height: 30px;
	border-radius: 50%;
	border: 1px solid #50af48;
	font-size: 28px;
	color: #50af48;
	cursor:pointer;
}


a#text_after_circle
{ color:#50af48;
	margin-left:40px; 
	}

/* -------------   */
#swzem{width:180px; height:40px; margin-left:50px; padding-top:20px;  }
#swapt{width:120px; height:40px; margin-left:20px; padding-top:20px;  }
#swdacha{width:80px; height:40px; margin-left:20px;padding-top:20px; }
#swzhytl{width:180px; height:40px; margin-left:20px;padding-top:20px; }
#swprom{width:180px; height:40px; margin-left:10px; padding-top:20px;}
.swtxt{position:absolute;left:70px;top:6px;}
/*--------------------------------------------------------------------------------STYLED CHECKBOX --------------*/

.chboxblue{ position: absolute;z-index: -1; opacity: 0;}
.chboxblue+label{
    position: relative;
    vertical-align: middle;
    padding: 0 0 0 30px;
    cursor: pointer;
	
}
.chboxblue+label::before{
    content: '';
    position: absolute;
  
    left: 0;
    width: 20px;
    height: 20px;
    border: 2px solid #ccc;
    border-radius: 8px;
	 
}  
.chboxblue:checked + label:after {
    position: absolute;   content: '';
    top: 2px;
    left: 3.6px;
    border: 1px solid white;
    background:#042C98;
    height: 14px;
    width: 14px;
	  border-radius: 6px;
}
.chboxblue+ label:hover:after {
 
 
    background:#033FB7;
   
}

/*         --------------------///////////////////////////////------------------///-  ROUNDED  CHECKBOX_SLIDER    */
.switch input {display:none;}
  .switch{position: relative;display: inline-block;width: 60px;height: 34px;
}
/*.switch{position: relative;display: inline-block;width: 60px;height: 34px;  */

.slider {position: absolute;cursor: pointer;top: 0;left: 0;right: 0;bottom: 0;background-color: #ccc;-webkit-transition: .4s;transition: .4s;}
.slider:before {
  position: absolute;content: "";height: 26px;width: 26px;left: 4px;bottom: 4px;background-color: white;-webkit-transition: .4s;transition: .4s;}
input:checked + .slider {background-color: #2196F3;}
input:focus + .slider {box-shadow: 0 0 1px #2196F3;}
input:checked + .slider:before {-webkit-transform: translateX(26px);-ms-transform: translateX(26px);transform: translateX(26px);}
/* Rounded sliders */
.slider.round {border-radius: 34px;}
.slider.round:before {border-radius: 50%;}


/*****************************-----------------------------------------------------------------------------------------*****/
.unit{width:500;height:230px;padding:5px; margin-bottom:20px;border:solid 1px #E2F1F4;font-size:16px;
	position:relative;}/*relative is needed for absolut position of wspace - hide the end of sentence */
.unit-left{width:220;height:220px;float:left;padding:5px;overflow:hidden; } /*overflow прячет часть картинки что б не искажать   */
.unit-left img {width:286px;  height:220px;}
.unit-right{width:244px; padding-right:20px; float:right; }

.unitname1{height:25px;font-size:14px;color:#8E8E8E;white-space:nowrap;overflow:hidden;}/*  white space is needed for correct overflow */
.datastamp{position:absolute;width:100px;height:30px;top:210;left:400;font-size:14px;}
.idstamp{position:absolute;width:100px;height:30px;top:14;left:15;font-size:13px; color:#056797;}
.orderstamp{position:absolute;width:47px;padding:2px 8px; top:14;left:167;font-size:13px; color:#fff;background-color:#253F6E;}



.unitname2{background-color:red;height:24px;color:#000;font-size:18px; margin-bottom:6px;}
 
.unitprice{height:34px;background-color:green;margin-bottom:6px; margin-top:12px; }
.unitpriceleft{float:left;font-size:20px; font-weight:bold;  }
 

.unitdescr1{height:38px;background-color:yellow;color:#000;font-size:14px;margin-bottom:10px;  }
.unitdescr2{height:34px; color:#A8A8A8;font-size:14px;margin-bottom:8px;padding:5px;border-top:solid 1px #E2F1F4;border-bottom:solid 1px #E2F1F4;
         overflow:hidden; }
.wspace{width:80px;height:20px;background:linear-gradient(to left, #fff, transparent);position:absolute;top:180; left:410;}

.unitlink{color:#F48202;font-size:16px; }
.unitlink a{color:#F48202;}


#pagelist{
	height:50px; background-color:yellow;font-size:16px;
}
.pageslink{color:red;margin-right:20px;}
.pageslink a:hover{text-decoration:underline;color:red;}
.pagesnolink{ color:#48485C;margin-right:20px;font-weight:bold;}

/*  autocomlete and search block   */


#search::placeholder {
  color: #696969;
}
#searchblock{
    width:40%;position:relative;
 
}
.lookuponsearch{
	height:30px;
	border:solid 2px #1989DA;
	border-radius: 6px;
	box-shadow: 0 0 10px rgba(17, 23, 117, 0.6);/*гориз смещ, верт смещ, размытие, 
	ратяжение  */
	padding:5px 10px 5px 58px;
	font-size:14px;
	outline:none;  
}

#search{
	position:absolute;top:20px;left:25%;z-index:1500;
    width:100%;
}
#search_button_sm
{ height:30px;position:absolute; 
	top:20px;left:25%;
    z-index:2001;
	width:48px;
	border-radius:6px 0px 0px 6px;
	padding:4px 10px;
background:url(../picts/lupa1.png) no-repeat; 
 background-size:20px;
 background-position: center;
 background-color:#0095ff;
font-size:0px;
}
#search_button_sm:hover
{background-color:#1989DA;
cursor: pointer;
}
#match-list{
    width:100%;position:absolute;top:50px;left:25%;z-index:2000;
    max-height:500px;overflow-y: auto;
    margin:0px;padding:0px;
    
   
}
#match-list h4{
    margin:0px;padding:0px;font-size:14px;
}
.dropdown{
 white-space: nowrap;

width:96%;
padding:5px 0px 5px 10px;
background-color:#fff;border:solid 1px rgb(200, 200, 200);

} 
span.lat{font-size:0px;}
span.lon{font-size:0px;}
/* -----------------------------------------------------------------------------*/
/*--------------------------   MARKERS  -----------------------------------------*/

.price-marker{
	    background:#426ab4;
    color: white;
    padding: 2px 4px;
    border-radius: 4px;
    font-size: 12px;
	  display: inline-block;   /* ширина по тексту */
    white-space: nowrap; 
}


/*  -----------------------------------------------------------------------------    */
/*  -------------------------  MAIN PAGE, Right SIDE with  listing  -------------    */


	.searchResult{
		border:solid 1px black;
		width:100%; height:200px;
	}
	.resultImage{background-color:red; width:180px;height:180px;float:left;}
	.resultText{background-color:yellow; 
		padding:8px;
		width:250px; min-height:170px;float:right}
	.searchPrice{font-size:18px;font-weight:bold;margin-top:6px;}
	.searchDescription{margin-top:6px; max-height:37px;overflow: hidden;}
	

	#multipage{width:100%;height:40px; margin-top:30px;
	margin-left:20px;margin-top:20px;margin-bottom:30px;}
	/* .pages{height:30px;width:26px;float:left;font-size:20px;padding:10px 4px 10px 18px;}  */
	.pages{height:20px;width:20px;float:left;font-size:20px;padding:3px 2px 10px 10px;margin-left:6px;} 
	/* .current{font-weight:bold;border:solid 1px #033FB7;  border-radius: 33px;} */



/*----------------------------   ADAPTIVE   ------------------ */
/*----------------------------   ADAPTIVE   ------------------ */
/*----------------------------   ADAPTIVE   ------------------ */
/*----------------------------   ADAPTIVE   ------------------ */

/*----------------------------   ADAPTIVE   ------------------ */
/*----------------------------   ADAPTIVE   ------------------ */
/*----------------------------   ADAPTIVE   ------------------ */
/*----------------------------   ADAPTIVE   ------------------ */
/*----------------------------   ADAPTIVE    for LEFT AND RIGHT  BOX  ------------------ */

 
  @media (max-width: 1260px) {
	/*  почне застосовуватися якщо ширина екрану менше або дорівнює 1200 */

	#middle-right{ float:right; width:430px;  	}
	#middle-left{float:left; padding:7px 0px; width: calc(100% - 470px); height:100%; margin-bottom:5px;}
    #searchline2{  position:absolute; top:48px; width:100%; display: flex; justify-content:center;padding-left: 0px;
	                         }
   .searchline2_adapt {   float:none;}
     

  }

  @media (max-width: 1240px) {
	/*  почне застосовуватися якщо ширина екрану менше або дорівнює 1230  */
	#top2{ height:60px;  }
	#searchline{ width:100%;font-size:16px;color:#B0B0B0; height:40px; align-items: center; }

  

#swzem{width:160px; height:40px; margin-left:50px; padding-top:20px;  }
#swapt{width:100px; height:40px; margin-left:20px; padding-top:20px;  }
#swdacha{width:70px; height:40px; margin-left:20px;padding-top:20px; }
#swzhytl{width:160px; height:40px; margin-left:20px;padding-top:20px; }
#swprom{width:170px; height:40px; margin-left:10px; padding-top:20px;}
 
#searchline3{ width:150px; 	padding-left:100px;  }

}
 



@media (max-width: 1090px) {

		/* тут кружок перенесеться вниз  */

		/* #middle-left{  width:100%; } */
 
	#search-top {height:160px;  }
	#top2{ height:120px;   }
	#searchline2 {  height:40px; }

	#search-middle {height:74vh;  }/* ця зміна запопібагє появі другої полоси верт прокрутки  */

	 #searchline3{ padding-left:50px;  }

	#middle-left{ }
	#search-middle{  }
}
@media (max-width: 1000px) {
		#search-top {height:210px;   }

	#searchline2 { float:none;width:200px; position:absolute; top:70px; left:30px; display: flex; padding-left:30px;
  flex-direction: column; height:100px;  padding-top:10px;height:40px;
border-left:none;  
}

	#searchline3{ position:absolute;top:90px; left:35%;  padding-left:17px; width:160px; }
}
@media (max-width: 950px) {
	#search-top {height:210px; }
	 
	#top2{ height:120px;  }
	#searchline2 {  height:40px;   padding-top:10px;height:40px; }
 
}

  @media (max-width: 900px) {
	/*  почне застосовуватися якщо ширина екрану менше або дорівнює 900 */

	#middle-right{ 
		width:340px;
        border: solid 1px green; 
	}
	#middle-left{  padding:7px 0px; 
		width: calc(100% - 370px); height:100%; margin-bottom:5px;
	
	}
		 

  }

@media (max-width: 850px) {
		/* тут частина першої стрічки перенесеться вниз  */

		#top2{   }
	    #search-top { height:280px;}
	 	#searchline{ width:100%; height:430px;  }
 
	/* #swzem{border:solid 1px yellow; } */
	/* #swapt{width:100px; height:40px; margin-left:20px; padding-top:20px; position:absolute;top:110px; left:30px;  } */

	#searchline1 {width:210px; position:absolute; top:5px;  display: flex; 
  flex-direction: column; }
	 #searchline1 div{ margin-left:20px; height:30px; padding-top:10px; }
	#searchline2 { float:none;width:190px; position:absolute; top:15px; left:280px; display: flex; padding-left:30px;
  flex-direction: column; height:100px;  padding-top:10px;height:40px; 
 

}
	 .searchline2_adapt { display: block; width:auto; float:none; }

	#searchline3{   
		position:absolute;top:120px; left:280px;  padding-left:17px; width:160px;  }

	
	#search-middle {height:66vh;  } /* ця зміна запопібагє появі другої полоси верт прокрутки  */

	.chboxblue+label::before{ width: 16px; height: 16px;border-radius: 6px; } 
	.chboxblue:checked + label:after { top: 1.8px; left: 3px;  height: 12px; width: 12px;  border-radius: 6px; }


}

@media (max-width: 675px) {
	/* .login{border:solid 1px red; width:420px;} */
	.top-dark{width:auto;}
		#search-top{min-width:0px;width:auto;}
		#top1{width:auto;}
		#top2{width:auto;}
 
}

  @media (max-width: 650px) {
	
	/*  почне застосовуватися якщо ширина екрану менше або дорівнює 650 */

	#middle-right{display:none;
	}
	#middle-left{  padding:7px 0px; width: 100%; height:100%; margin-bottom:5px;}
		#searchline2 {  position:absolute; top:15px; left:240px;  }

#searchline3{   
		position:absolute;top:120px; left:250px;  padding-left:17px; width:160px;  }

  }

  @media (max-width: 675px) {
		#searchline2 { position:absolute; top:15px; left:210px;  }
		#searchline3{   
		position:absolute;top:120px; left:210px;   }
  }


@media (max-width: 420px){



	#search-top { 
	    /* display:none; */
		 height:280px;
	     min-width: auto;      
         width: 100%;
		 
	}
		 
.a-loginwithimage{  display: block; position:relative;top:-30px; left:250px;width:30px;
	background-image:url(../picts/smallhuman.png);background-repeat:no-repeat;background-position: 1px -1px;}
.reg-login{ display: block;  position:relative;top:-20px; left:255px;width:30px }
.v-line{  display:none;}
.login{float:none;width:auto; }
	#top1{ 
		 
		
	}

 

  #searchline {position:relative;  height:250px; }
  	#searchline2 {  position:absolute; top:15px; left:160px; display: flex; padding-left:30px;
  flex-direction: column;  }
  	#searchline3{  
		position:absolute;top:86px; left:170px;  padding-left:17px; width:160px;  }
  /* width:180px; height:40px; margin-left:50px; padding-top:20px; */
		  /* #swzem{ width:auto; margin-left:0px; position:absolute;top:10px;left:20px; }
		  #swdacha{width:auto; margin-left:0px; position:absolute;top:10px;left:240px;  }

        #swzhytl{ width:auto; margin-left:0px; position:absolute;top:70px;left:20px; }
		  #swapt{ width:auto; margin-left:0px; position:absolute;top:70px;left:240px; }
	
		
		  #swprom{ width:auto; margin-left:0px; position:absolute;top:130px;left:20px; }

		  #searchline2{ width:auto; margin-left:0px; position:absolute;top:190px;left:20px; }
           #searchline3{width:auto; margin-left:0px; position:absolute;top:186px;left:180px; } */
  

	
	
		   #modalwindow { position:fixed;top:25%;left:8%; }
   #modalregwindow { position:fixed;top:25%;left:4%; }

	
.donelogin{display:block;text-align:left;height:50px;width:100px;position:absolute; top:10px;left:200px;
		background-repeat:no-repeat;background-position: 5px -1px;   
		white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;}

  /* .cabinet{display:block;text-align:left;height:50px;width:100px;position:absolute; top:40px;left:200px;border:solid 1px red;} */
.go-out{display:block;text-align:left;height:50px;width:100px;position:absolute; top:35px;left:200px;
	padding-left:30px; }

 

/* .donelogin{margin-left:10px;margin-right:10px;
	padding-left:24px;
 
} */
	
}