.nojava {display:block; position: fixed; bottom: 0; left: 0; width: 100%; margin: 0 auto; z-index: 1000; text-align: center; font: 14px/14px Verdana,Arial,sans-serif; color: white; background-color: crimson; padding: 15px 0px;}
*, *:before, *:after { -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box;}
a:link {text-decoration:none; color:whitesmoke;} a:visited {text-decoration:none; color: royalblue;} a:hover {text-decoration:none; color: blue; } a:active {text-decoration:underline; color: red;} 
.nu {text-decoration:none;} .nu:hover {text-decoration:none;}

p {background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAAC0lEQVQIW2NkAAIAAAoAAggA9GkAAAAASUVORK5CYII=);}

div.door { cursor: pointer; color: white;} div.door:hover {color:#F0AD00;}
div.tabs {cursor:pointer; background-color: rgba(175, 100, 100, 0.8); color: white; height: 45px; border-radius: 15px 15px 0px 0px; font: bold 15px/45px Verdana, Sans-sherif; text-align: center;}
div.selected { background-color: rgba(175, 6, 6, 0.8); color: white; height: 45px; border-radius: 15px 15px 0px 0px; font: bold 15px/45px Verdana, Sans-sherif; text-align: center;}
div.consilier { margin: 5% auto; margin-top: 0px; margin-left: 0px; border:2px solid rgba(236, 196, 196, 1); background-color:#F8F8F8;
	background-size: cover; background-repeat: no-repeat; background-image: url(../pics/CasaTOPAZ-AnsambluLateralDreapta.jpg); height: 300px; width: 300px; -moz-border-radius: 10px; -webkit-border-radius: 10px; -khtml-border-radius: 10px; border-radius: 10px; box-shadow: inset 0px 0px 10px rgba(255, 255, 255, 0.9); border-radius: 50% 50%;}

div.mainpic { position:relative; margin: 5% auto; margin-top: 0px; margin-bottom: 20px; height: 500px; background-image: url(../pics/CasaTOPAZ-VedereFrontalaDuplex.jpg);
	-moz-background-size:100% 100%; -webkit-background-size:100% 100%; background-size:100% 100%; -moz-border-radius: 4px; -webkit-border-radius: 4px; -khtml-border-radius: 4px; border-radius: 4px;
	box-shadow: inset 0px 0px 20px 20px rgba(255, 255, 255, 0.9);} /* div.mainpic:hover span {display:none;visibility:hidden;} */
div.minipic { margin: 5% auto; margin-top: 0px; border:6px solid rgba(236, 196, 196, 1); background-color:#F8F8F8; height: 200px;
	-moz-background-size:100% 100%; -webkit-background-size:100% 100%; background-size:100% 100%; -moz-border-radius: 80px; -webkit-border-radius: 80px; -khtml-border-radius: 80px; border-radius: 90px; box-shadow: inset 0px 0px 10px rgba(255, 255, 255, 0.9);
	-webkit-transform: rotate(0deg); -moz-transform: rotate(0deg); overflow: show;}
div.minipic:hover { -webkit-transform: scale(1.6); -moz-transform: scale(1.6); -o-transform: scale(1.6); transform: scale(1.6); overflow: hidden;}

div.vanduta {position: absolute; border: 2px dashed #fff; top: -5px; font-size: 20px; color: white; background-color: darkslateblue; left: -30px; width: 50%; text-align: center; /* border: 1px dotted darkblue;*/ box-shadow: 3px 3px 3px #999; letter-spacing: 2px; padding: 4px; border-radius: 4px; -moz-transform:rotate(-5deg); -webkit-transform:rotate(-5deg); -o-transform:rotate(-5deg); -ms-transform:rotate(-5deg); transform: rotate(-5deg);}
div.rezervata {position: absolute; border: 2px dashed #fff; top: -5px; font-size: 20px; color: white; background-color: darkslateblue; right: -30px; width: 50%; text-align: center; /* border: 1px dotted darkblue;*/ box-shadow: 3px 3px 3px #999; letter-spacing: 2px; padding: 4px; border-radius: 4px; -moz-transform:rotate(5deg); -webkit-transform:rotate(5deg); -o-transform:rotate(5deg); -ms-transform:rotate(5deg); transform: rotate(5deg);}

div.schita { margin: 5% auto; margin-top: 0px; border:10px solid rgb(175, 6, 6); border:10px solid rgba(175, 6, 6, 0.8);  background-color:#F8F8F8; width: 100%; height: 500px;
	-moz-background-size:100% 100%; -webkit-background-size:100% 100%; background-size:100% 100%; -moz-border-radius: 8px; -webkit-border-radius: 8px; -khtml-border-radius: 8px; border-radius: 9px;
	box-shadow: inset 0px 0px 10px rgba(255, 255, 255, 0.9); overflow: hidden; background: url(../pics/CasaTOPAZ-Schita.jpg) no-repeat center center; background-size: contain; background-color:white;}
div.schita:hover { -webkit-transform: scale(1.2); -moz-transform: scale(1.2); -o-transform: scale(1.2); transform: scale(1.2);overflow: hidden;}
div.news {cursor:pointer; position: fixed; bottom: 50%; font: 14px Verdana,Arial,sans-serif; left: -165px; background-color: darkblue; color: white; padding: 8px 20px 55px 20px; opacity: .8;
    -webkit-transform: rotate(90deg); -moz-transform: rotate(90deg);-o-transform: rotate(90deg);-ms-transform: rotate(90deg);
    -webkit-border-radius: 10px 10px 0px 0px; -moz-border-radius: 10px 10px 0px 0px; border-radius: 10px 10px 0px 0px;} 

hr { width: 40%; margin-top: 50px; margin-bottom: 100px; clear:both; border-color:white;}

span.memo { display:block; font: 16px/30px Verdana, cursive, sans-serif; color: rgb(22, 31, 138); color: rgba(22, 31, 138, 0.8); width: 100%; background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAAC0lEQVQIW2NkAAIAAAoAAggA9GkAAAAASUVORK5CYII=);}
span.pret { font: 18px/30px Verdana, cursive, sans-serif; color: white; } span.tel { font: 36px/60px Verdana, cursive, sans-serif; color: white; }     span.tel:hover {color: blue;}
span.primalinie { left:-12px; border-radius:3px; position: absolute; top: 365px; float: left; clear:left; font: 45px/60px Century Ghotic, Sans-Serif; letter-spacing: +1px; color: white; background-color: rgba(175, 6, 6, 0.8); text-shadow: 2px 3px 6px #111;}
span.adoualinie { left:-12px; border-radius:3px; float: left; clear:left; position: absolute; top: 430px; font: 36px/50px Tahoma, Sans-Serif; letter-spacing: +1px; color: rgba(2, 9, 29, 1); background-color: rgba(228, 194, 105, 0.8); text-shadow: 2px 3px 6px #111; color: #fff; background-color: darkslateblue;}
span.doors { cursor: pointer; color: white;}
span.special {text-decoration:none; color: white;}  
span.sectiune { margin-top:100px; color: white; font: 30px/100px Comic Sans MS, cursive, sans-serif; }
span.tag {float:left;color: white;border: 2px solid #fff;padding:5px 10px; margin-right: 15px; font: 16px/40px Verdana, Arial, cursive;}
span.offer {display:block; font: 18px/30px Verdana, cursive, sans-serif; color: white; width: 100%; background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAAC0lEQVQIW2NkAAIAAAoAAggA9GkAAAAASUVORK5CYII=);} 


table.specificatii { width:100%; font: 16px/50px Verdana, cursive, sans-serif; color: rgb(54, 43, 180); rgba(54, 43, 180, 0.8); border-collapse: collapse; border-spacing: 10px;}
table.specificatii tr, table.specificatii td { border-bottom: 1px solid rgba(223, 213, 213, 0.7); padding: 10px;}

img.smallpic { width:100%; height:auto; padding:8px; border:1px solid rgba(2, 26, 64, 0.14); background-color:#F8F8F8; border-radius: 80px;}
img.d:hover { -webkit-transform: scale(1.53); -moz-transform: scale(1.53); -o-transform: scale(1.53); transform: scale(1.53); overflow: hidden;}

img.street {-webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; border:10px solid white; -webkit-transform: rotate(10deg); -moz-transform: rotate(10deg); transform: rotate(10deg); float: right;margin-top: 35px;} img.street:hover {-webkit-transform: rotate(360deg); -moz-transform: rotate(360deg); transform: rotate(360deg); -webkit-transition: all 500ms linear; -moz-transition: all 500ms linear; -o-transition: all 500ms linear; transition: all 500ms linear; box-shadow: 2px 2px 10px #808080 !important;}
img.barcode {-webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; border:10px solid white; -webkit-transform: rotate(-10deg); -moz-transform: rotate(-10deg); transform: rotate(-10deg); float: left; margin-top: 10px; margin-right: 25px;} img.barcode:hover {-webkit-transform: rotate(360deg); -moz-transform: rotate(360deg); transform: rotate(360deg); -webkit-transition: all 500ms linear; -moz-transition: all 500ms linear; -o-transition: all 500ms linear; transition: all 500ms linear; box-shadow: 2px 2px 10px #808080 !important;}

h1 { background-color: #565656; color: transparent; text-shadow: 0px 2px 3px rgba(255,255,255,0.5); -webkit-background-clip: text; -moz-background-clip: text; background-clip: text;}

ul { display: block; padding-top: 15px;}
ul.polaroids li { display: inline; }
ul.polaroids div { background: #fff; display: inline; float: left; margin: 0 0 27px 30px; width: auto; padding: 10px 10px 15px; text-align: center; font-family: 'Century Ghotic',Arial, sans-serif; text-decoration: none; color: #333; font-size: 18px; -webkit-box-shadow: 0 3px 6px rgba(0,0,0,.25); -moz-box-shadow: 0 3px 6px rgba(0,0,0,.25); -webkit-transform: rotate(-2deg); -webkit-transition: -webkit-transform .15s linear; -moz-transform: rotate(-2deg); -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; box-shadow: 2px 2px 10px #808080 !important;}
ul.polaroids li { padding-left: 0;}
ul.polaroids img { display: block; width: 260px; margin-bottom: 12px; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px;}
ul.polaroids div:after { content: attr(title); }
ul.polaroids li:nth-child(even) div { -webkit-transform: rotate(2deg);  -moz-transform: rotate(2deg); }
ul.polaroids li:nth-child(3n) div { -webkit-transform: none; position: relative; top: -5px;  -moz-transform: none; }
ul.polaroids li:nth-child(5n) div { -webkit-transform: rotate(5deg); position: relative; right: 5px;  -moz-transform: rotate(5deg); }
ul.polaroids li:nth-child(8n) div { position: relative; right: 5px; top: 8px; }
ul.polaroids li:nth-child(11n) div { position: relative; left: -5px; top: 3px; }
ul.polaroids li.messy div { margin-top: -400px; position: relative; left: 160px;}
ul.polaroids li div:hover { -webkit-transform: scale(2); -moz-transform: scale(2); -webkit-box-shadow: 0 3px 6px rgba(0,0,0,.5); -moz-box-shadow: 0 3px 6px rgba(0,0,0,.5); position: relative; z-index: 5; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px;}

/* @media screen and (max-width: 767px) { .polaroids li:nth-child(n+5) {display: none;} ul.polaroids li a { margin-left: 0;}} */

@-webkit-keyframes colorchange {
	0%   { background-color: #00F; /* from: blue */ }
	25%  { background-color: #F00; /* red        */ }
	50%  { background-color: #0F0; /* green      */ }
	75%  { background-color: #F0F; /* purple     */ }
	100% { background-color: #00F; /* to: blue   */ }
}

@keyframes colorchange {
	0%   { background-color: #00F; /* from: blue */ }
	25%  { background-color: #F00; /* red        */ }
	50%  { background-color: #0F0; /* green      */ }
	75%  { background-color: #F0F; /* purple     */ }
	100% { background-color: #00F; /* to: blue   */ }
}

@-webkit-keyframes sizechange { 0%   { -webkit-transform: scale(1); } 100% { -webkit-transform: scale(1.5); } }
@keyframes sizechange { 0%   { transform: scale(1); } 100% { transform: scale(1.5); } }

#banner { display: none;
	-webkit-animation-name: colorchange, sizechange; -webkit-animation-duration: 5s, 2s; -webkit-animation-timing-function: linear, ease; -webkit-animation-delay: 0s, 5s; -webkit-animation-iteration-count: 3; -webkit-animation-direction: alternate;
	animation-name: colorchange, sizechange; animation-duration: 5s, 2s; animation-timing-function: linear, ease; animation-delay: 0s, 5s; animation-iteration-count: 3; animation-direction: alternate; }

.meniu { width: 98% !important; left: 1%; top: 4px; font: 16px/36px Century Ghotic, Sans-Serif; letter-spacing: 1px; text-align: center; background-color: rgba(175, 6, 6, 0.8); color: white;position: fixed; z-index: 999; margin: 0 auto; border-radius: 10px;}

.nice {	box-shadow: 3px 3px 3px rgba(0,0,0,0.25); -moz-box-shadow: 3px 3px 3px rgba(0,0,0,0.25); -webkit-box-shadow: 3px 3px 3px rgba(0,0,0,0.25);
  -moz-border-radius: 5px; -webkit-border-radius: 5px; -khtml-border-radius: 5px; border-radius: 5px;}

.dir-map {margin-left: 1%; margin-top: 1%; width: 98%; height: 99%; overflow:hidden; border-radius: 10px; background: url(../pics/Drumul-Billa-Topaz.jpg) center center no-repeat; background-size: 100% 100%;} 

.eticheta { color: black; font: bold 12px/25px Century Ghotic, Sans-Serif; font-weight:1200; letter-spacing: +3px; 
  position:absolute; top:89px; left:0px; width:90px; text-align:center; padding:0.5px 1px; background-color:#F0AD00;
  -webkit-transform:rotate(0deg); -moz-transform:rotate(0deg); -o-transform:rotate(0deg); -ms-transform:rotate(0deg);
  opacity:0.95; -ms-filter:'progid:DXImageTransform.Microsoft.Alpha(Opacity=95)'; filter: alpha(opacity=95);
  box-shadow: 3px 3px 3px rgba(0,0,0,0.25); -moz-box-shadow: 3px 3px 3px rgba(0,0,0,0.25); -webkit-box-shadow: 3px 3px 3px rgba(0,0,0,0.25);
  -moz-border-radius: 5px; -webkit-border-radius: 5px; -khtml-border-radius: 5px; border-radius: 5px;}

.anunt { color: black; font: bold 12px/25px Century Ghotic, Sans-Serif; font-weight:1200; letter-spacing: +1px; position:absolute;
  top:165px; left:0px; width:200px; text-align:center; padding:0.5px 1px; background-color:#F0AD00;
  -webkit-transform:rotate(0deg); -moz-transform:rotate(0deg); -o-transform:rotate(0deg); -ms-transform:rotate(0deg);
  opacity:0.95; -ms-filter:'progid:DXImageTransform.Microsoft.Alpha(Opacity=95)'; filter: alpha(opacity=95);
  box-shadow: 3px 3px 3px rgba(0,0,0,0.25); -moz-box-shadow: 3px 3px 3px rgba(0,0,0,0.25); -webkit-box-shadow: 3px 3px 3px rgba(0,0,0,0.25);
  -moz-border-radius: 5px; -webkit-border-radius: 5px; -khtml-border-radius: 5px; border-radius: 5px;}

.wiki {color:rgb(22, 31, 138);height: 30px; width: 155px; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; font: 16px/30px 'Century Ghotic',Arial,sans-sherif; background-color: whitesmoke;margin-top: 20px; border-radius: 4px; padding: 0px 10px;} .wiki:hover {width:auto; overflow: visible; white-space: normal; width: auto; transition: width .5s; -webkit-transition: width .5s;}
.hide {display:none; visibility:hidden;} .show {display: table-cell;visibility:visible;}

@media only screen and (min-device-width: 320px) and (orientation: portrait) { .show {display:none; visibility:hidden;} .hide {display: initial;visibility:visible;} .meniu {letter-spacing: 1px;} }

      .ma-social { margin-top:100px; clear: both; overflow: hidden; padding: 5% 3% 1% 3%;}
      .ma {zoom: 80%; border: 0px solid darkslateblue; border-radius: 50% 50%;} .ma:hover {border-color: white; -ms-transform: translate(0px,-5px); -webkit-transform: translate(0px,-5px); transform: translate(0px,-5px); }
      .share {text-decoration:none; padding: 20px; margin: 0px 10px;} .share:hover {text-decoration:none;} 
      .like {border:none; overflow:hidden; width:90px; height:42px; display:inline; padding:8px;}

.submit {cursor:pointer; color: white; background-color:rgb(54, 43, 180); background-color:rgba(54, 43, 180, 0.8); font: 25px/40px Verdana, Sans-serif; padding: 10px; border-radius:7px; box-shadow: 2px 2px 10px #808080 !important;} .submit:hover, .vizionare:hover {color:#F0AD00; background-color:#000080;}
.vizionare {color: white; background-color:rgb(54, 43, 180); background-color:rgba(54, 43, 180, 0.8); font: 25px/50px Verdana, Sans-serif; padding: 10px;}
table.vizionari {width:100%; padding:5px; font: 16px/40px Verdana, Sans-serif; color: rgb(54, 43, 180); color: rgba(54, 43, 180, 0.8);}

.links{ width: 96%; position: relative; margin: 0 auto; bottom: 2%; table-layout: fixed; text-align:left; padding:5px; font: 14px/20px 'Century Ghotic',Arial, sans-serif; }
.list {float:left; padding: 0px 10px; width: 100%; text-align: center; margin-bottom: 50px;} li {padding: 5px;}

div.list ul {list-style-type: none;} div.list li {padding: 2px 30px 2px 0px; float: left;}

#nume, #email, #telefon, #ziua {width: 95%; height: 32px; padding:5px; border-radius: 4px;} #mesaj {display: block; width: 100%; height: 300px; padding:5px; border-radius: 4px; font-family: cursive}

.oferta {margin-right: 2px; border: 1px dashed white; padding: 5px 2px 15px 2px; font: 14px/20px Verdana, Arial, sans-serif; text-align: center; color: navy;}
.promo {color: white; background-color: navy; padding: 10px 30px; border-radius: 50% 50%;}

  #xt_div { width:300px;  float:left; position: relative; border-radius: 6px;}
  #xt_tabel {width: 100%; border: 2px solid #ccc; background-color: navy; margin: 0px auto; position: relative; top: 0px; left: 0px; table-layout: fixed; box-shadow: inset 0px 0px 10px #fff;border-radius: 6px; padding: 0px 3%;}
  #xt_mesaj { width: 100%; color: #fff; text-align:center; font: 20px/60px bold Verdana,Arial,sans-sherif; display:none;}
  #xt_ramas td { height: 36px; vertical-align: bottom; padding: 0px; font: 28px/30px bold Verdana,Arial,sans-sherif; color: #FFFFFF; text-align:center; text-shadow: 0px 0px 10px #fff;}
  #xt_note td { line-height: 18px; vertical-align: top; border-style: none; padding: 0px 0px 5px 0px; width: 100%; font-family: Arial; font-size: 10px; font-weight: bold; color: #FFFFFF; text-align: center;}

  .ftel {font: 36px/60px Verdana,cursive,sans-serif;color: white;} .htel {font-size: 16px; display:inline; cursor: pointer; color: white;} .htel:hover{color:blue;} .atel {text-decoration: none; font: 36px/60px Verdana,cursive,sans-serif; color: white;} .atel:hover {color:blue;}
  #tic, #tic+.ftel+.htel+.atel, .n0, .n1, .n2, .n3, .n4, .n5, .n6, .n7, .n8, .n9 {display:none;}
  #tic:checked+.ftel, #tic:checked+.ftel+.htel {display:none;}
  #tic:checked+.ftel+.htel+.atel, #tic:checked+.ftel+.htel+.atel>.n0, #tic:checked+.ftel+.htel+.atel>.n2, #tic:checked+.ftel+.htel+.atel>.n5, #tic:checked+.ftel+.htel+.atel>.n7 { display:inline;}