:root { --white:#fff; --black: #000; --main:#98e794; --second: #f5fff4 }
* {font-family: "Rubik", tahoma;font-size: 16px; letter-spacing: -0.75px;}
html {margin: 73px 0 0 0 !important; width: 100% !important;margin-bottom: 100px !important;background: url(/imgs/back.jpg) repeat 0% 0% / 100%;}
html * {max-width: 732px;direction: rtl;    accent-color: var(--main);}
body { color:var(--black); margin: 0 auto; padding: 0 10px; width: calc(100% - 20px)}
*:not(body):not(html):not(header):not(script):not(style):not(meta):not(.imgsgrid img):not(.LinkList a):not(.ad) {
  border-radius: 10px;
}



.imgsgrid { display: grid ; grid-template-columns: repeat(2, calc(100% / 2)); max-width: 604px; margin: 5px auto; }
.imgsgrid img { cursor: pointer; border: 1px solid var(--main); margin: 0px !important; padding: 0px !important; width: calc(100% - 2px) !important; object-fit: cover;max-height: 250px;aspect-ratio: 300 / 250; }
.imgsgrid .ad.inimgs {width: 300px !important; height: 250px !important; margin: 0 !important;}

#login {text-align: center;margin-top: 20px !important;}
#login *{font-size: 18px;}
#login input{border: 2px solid var(--main);margin:0 !important}
#login button { border: 0; background: var(--main);margin:0 !important }

img#full {margin: 2.5px !important; padding: 2.5px !important; width: calc(100% - 10px) !important; }
img.thumbs {width: 100px;aspect-ratio: 1.5; object-fit: cover;}
.listing { display: grid ; grid-template-columns: auto 100px; border-top: 4px solid var(--main); padding: 5px; margin: 10px 0; background: var(--second); }
.listing span { font-size: 15px; color: var(--black); display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 1; overflow: hidden;margin: 3px !important; padding: 2px !important; }
.listing .ago { font-size: 13px; color: #838383;margin-top: -3px !important; }
.listing .ago b { font-size: 13px; color: #6aa167; }
.listing .p { font-size: 13px; color: #838383; }
.listing  .t { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 1; overflow: hidden; }

span { display: block; margin: 10px !important; padding: 10px !important; }

.button { cursor: pointer; border: 1px solid var(--main); color: #172E7E !important; display: block; width: 100%; text-align: center; font-size: 25px; margin-top: 10px;    overflow: visible;}
#date {text-align: center;font-size: 15px;margin: 0 !important;}
#aside.on {position: fixed !important; top: 60px; right: 0px !important; margin: 0 !important; width: calc(100% - 0px) !important; overflow: auto; height: calc(100% - 60px) !important;background: #fff; }
#aside.on .ad { display: none !important; }
#aside ul  { margin: 30px auto !important; place-self: center;max-width: 190px; }
#aside ul li::marker { color: var(--main); font-size: 28px; font-weight: bolder; }
#aside ul li { margin-top: 5px; }
#asideopen { display: block; position: fixed; top: -2px; font-size: 30px; color: var(--main); background: none; width: 50px !important; border: 0; right: 0px !important;z-index: 20; }
#aside  ul#menu a { display: block; background: var(--second); padding: 8px;text-align:center;border-radius: 10px 0px;    border: 1px solid var(--main); }
#aside  ul#menu a:hover {color:#000;background: var(--main);border-color: #fff;}
#aside ul#menu { list-style: none; padding: 0 !important; max-width: 290px !important; width: 100%; }
#details, #details * { list-style: none; padding: 0 !important; margin: 0 !important; width: 100% !important; }
#details li { display: block; border-bottom: 5px solid var(--main); margin-bottom: 12px !important; }


/*#main * {line-height: 25px;}*/
#main.page h2 { margin-top: 30px; background: var(--main);font-size: 20px; }
#main h1 { font-size: 20px; text-align: center;margin-bottom: 0; }
#main span.ago_listing { text-align: center; display: block; margin: 0 !important; padding: 0 !important; margin-top: -5px !important; }
#main.page * { text-align: center; display: block; }

#similar { border: 1px solid var(--main); margin: 30px auto; background: var(--second);}
#similar h2 { font-size: 18px; text-align: center; margin: 0; background: var(--main); padding: 10px; border-radius: 10px 10px 0px 0px; }
#similar h2 i { font-size: 15px; text-align: center;margin-bottom: 0;display: block; }

#images { display: none; }
#customFileBtn {font-size: 28px !important; padding: 5px !important; background: var(--main); color: #fff; border: none; cursor: pointer; transition: 0.3s;opacity: 1; max-width: 299px;} 
#customFileBtn i { display: block; padding: 0 !important; font-size: 15px; opacity: 0.8;margin: 0 !important;}
#customFileBtn:after { content: ""; display: block; width: 43px; height: 57px; margin-bottom: -50px; background: url(/imgs/pointer.png) no-repeat center center; background-size: 120%; opacity: 0.3; position: relative; top: -6px; left: -37px; }
#submitBtn { padding: 10px 20px; border-radius: 8px; background: gray; color: #fff;  border: none; cursor: not-allowed; transition: 0.3s; }
#submitBtn.enabled { background: var(--main); cursor: pointer; }


a { text-decoration: none;  overflow: hidden; color: #172E7E; }
a:hover {text-decoration:underline;color:var(--main)}
footer {text-align: center;}



header{height:73px; background: var(--black) url(/imgs/header.jpg) repeat 0% 0% / 100%;position: fixed;top: 0;left: 0;z-index:10;    width: 100%;text-align: center;}
header .LinkList {    max-width: 728px !important;    margin: 0 auto;background: #00000060;}
header .LinkList li { padding: 0 !important; margin: 0px !important; width:100% !important;     list-style: none;}
header .LinkList ul { display: grid !important ; grid-template-columns: 50% 50%; padding:0 !important;margin: 0 !important;width: 100% !important;}
header .LinkList ul a { text-align: center; color: var(--white);padding: 6px;display: block;}
header .LinkList #add { background: var(--main); color: var(--black);  }
header,header * {z-index:10;max-width: none !important;}
header #lg_a { display: block; text-align: center; direction: ltr;height: 42px;    place-content: center; }
header a#lg_a h1 {  color: var(--white); display: inline; }
header a span {  color: #2f2f2f; }
header a#lg_a h2 { display: inline; color: var(--main); }
header h1,header h2{border:none !important;font-size: 40px;text-align: center;}
header img#lg { height: 26px;margin-top: 3px; }

footer { text-align: center; font-size: 16px; margin: 20px auto !important; direction: ltr; }


hr { background: var(--main);margin: 2px 0 !important; padding: 2px 0 !important; width: 100% !important;}
img#arthome { padding: 0 !important; margin: 0 !important; width: calc(100% + 0px) !important; aspect-ratio: 2.1573; margin-left: -10px !important; }
form#adForm *,form#adForm {text-align: center;}
form#adForm input, form#adForm textarea, form#adForm button, form#adForm select , form#adForm option { border: 1px solid var(--main); border-bottom: 5px solid var(--main);font-size: 18px; }
form#adForm button { background: var(--main); width: calc(100% - 20px) !important; margin-top: 10px !important;     color: #000;}
.step {  display: none;padding: 0 !important; margin: 0 !important; width: 100% !important;}
.step.active {  display: block;}
.step label {  display: block;}
.step button {  background: var(--main);  color: var(--black);  cursor: pointer;  opacity: 0.4;  transition: opacity 0.3s;}
.step button.enabled {  opacity: 1;}
.step .summary {  background: #f1f1f1;}
form * { padding: 10px !important; margin: 10px !important; width: calc(100% - 20px) !important; font-size: 25px; }
form h2 { text-align: center; margin: 0 !important; padding: 0 !important;width: 100% !important; }
form input { width: calc(100% - 45px) !important; }
div#previewGrid, div#previewGrid * { margin: 0 !important; padding: 0 !important; width: 100% !important; }
div#previewGrid img { aspect-ratio: 1; object-fit: cover; }
form input#phone { direction: ltr; text-align: right; }
form #msg { font-size: 16px; margin: 0 !important; padding: 0 !important; text-align: center; }
form#adForm { margin: 100px auto;  }



.ad { padding: 0 !important; margin: 10px auto !important; border: 1px solid var(--main); align-content: center; text-align: center; background: var(--second); font-size: 24px; }

#ad_pc_l3, #ad_pc_r3,  
#ad_pc_l2, #ad_pc_r2,  
#ad_pc_l, #ad_pc_r,
.ad {display: block;opacity: 1;transition: opacity 1s, top 1s;}

#ad_pc_l, #ad_pc_r, 
#ad_pc_l2, #ad_pc_r2, 
#ad_pc_l3, #ad_pc_r3 
{ padding: 0 !important; margin: 10px auto !important; border: 1px solid var(--main); align-content: center; text-align: center; background: var(--second); font-size: 24px;}

div#ad_pc_r { width: 160px; height: 600px; position: fixed; top: 70px; margin-right: -175px !important; }
div#ad_pc_l { width: 160px; height: 600px; position: fixed; top: 70px; margin-right: 745px !important; }

div#ad_pc_r2 { display:none;width: 160px; height: 600px; position: absolute;margin-right: -175px !important; }
div#ad_pc_l2 { display:none;width: 160px; height: 600px; position: absolute;margin-right: 745px !important; }

div#ad_pc_r3 { display:none;width: 160px; height: 600px; position: absolute;margin-right: -175px !important; }
div#ad_pc_l3 { display:none;width: 160px; height: 600px; position: absolute;margin-right: 745px !important; }


#ad_pc_l, #ad_pc_r,
#ad_pc_l2, #ad_pc_r2,
#ad_pc_l3, #ad_pc_r3 {
  transition: top 0.5s;
}

    
@media screen and (max-width: 1105px) {
  #ad_pc_l, #ad_pc_r,.imgsgrid .ad.inimgs { display: none;}
  aside {background: var(--white);}
}

@media screen and (min-width: 1106px) {
  header {background: var(--black) url(/imgs/header.jpg) repeat 0% 4% / 33.33%;}
  #asideopen { display: none;}
  aside.on {    overflow: hidden;width:auto !important;position:unset !important;height: auto !important;background: #fff;}
  header {height: 73px;}
}


img#loadergif { position: fixed; width: 280px; height: 280px; top: calc(calc(100% / 2) - 214px); left: calc(calc(100% / 2) - 140px);display: none; }
body.loading * {opacity: 0.5;}
body.loading img#loadergif {opacity: 1 !important;}

#pagination {display: grid;grid-template-columns: 50% 50%;padding: 0 !important;}

#pagination a { display: block; text-align: center; background: var(--main); font-size: 20px; padding: 8px; margin: 8px;}
#pagination a:hover {color:#000}

.disclaim {font-size: 14px;text-align: center;margin: 30px auto; max-width: 400px;place-self: center;opacity: 0.7;}


ul#social { background: linear-gradient(33deg, var(--main), transparent); padding: 10px !important; margin: 50px auto !important; list-style: none; text-align: center; border-radius: 50%; }
ul#social a { display: block;  max-width: 200px; margin: 10px auto !important; padding: 5px !important;border-radius: 10px; }








p#msg_sent { background: var(--second); text-align: center; border: 1px solid var(--main); max-width: 263px; margin: 100px auto; padding: 10px; font-size: 20px; color: #000000; border-bottom: 5px solid var(--main); }




.delete-btn {position: relative;top: -40px;right: 10px;font-size: 18px;cursor: pointer;text-align: center;opacity: 1 !important;}
.delete-btn:hover {font-size: 22px;}