﻿@import url('//fonts.googleapis.com/css?family=Rubik:300,300i&subset=cyrillic,hebrew');
@import url('//cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css');

* {box-sizing:border-box; margin:0 auto; padding:0; border:0 none; outline:0; font-family:'Rubik', Arial, sans-serif; font-weight:300;}
html {font-size:18px;}
body {text-align:center; color:#333;}
h1 {font-size:2.4rem; font-weight:300;}
h2 {font-size:2.1rem;}
h3 {font-size:1.9rem;}
h4 {font-size:1.6rem;}
h5 {font-size:1.3rem;}
h6 {font-size:1rem;}
a, .filter u {color:#300; text-decoration:none; position:relative;}
a:hover, .filter u:hover, .filter u.active {color:#d00; background-color:#eee;}
a:before, .filter u:before {content:''; position:absolute; width:100%; height:1px; bottom:0; left:0; background-color:#000; visibility:hidden; -webkit-transform:scaleX(0); transform:scaleX(0); -webkit-transition:all 0.3s ease-in-out 0s; transition:all 0.3s ease-in-out 0s;}
a:hover:before, .filter u:hover:before, .filter u.active:before {visibility:visible; -webkit-transform:scaleX(1); transform:scaleX(1);}
input, textarea, select {font-size:0.9rem; padding:0.6rem; font-family:inherit;}

.l {text-align:left;}
.r {text-align:right;}
.c {text-align:center;}
.j {text-align:justify;}
.fl {float:left;}
.fr {float:right;}
.clr {clear:both;}
.ltr {direction:ltr;}
.rtl {direction:rtl;}
.vmid {vertical-align:middle;}
.show {animation:show 3s;}
.full {width:100%;}
.f0 {font-size:0;}
.f1 {font-size:1rem;}
.btn {background-color:#333; color:#fff; padding:0.3rem 0.6rem; cursor:pointer; border:1px solid #000;}
.btn:hover {background-color:#666;}
.half {max-width:49%;}
.grayscale {-webkit-filter:grayscale(90%); filter:grayscale(90%);}
.nobr, .nowrap {display:inline-block; white-space:nowrap;}
.m0 {margin:0;}
.m15-0 {margin:15px 0;}
.p0 {padding:0;}
.p15 {padding:15px;}
.p15-0 {padding:15px 0;}
.p0-15 {padding:0 15px;}
.hide {display:none !important;}

header, .wrapper {display:block; clear:both; width:100%; max-width:900px; position:relative;}
header h1 {background:url('img/logo.svg') no-repeat center center; background-size:contain; height:75px;}
header h1 a {display:block; width:320px; height:66px; color:transparent;}
header h1 a:hover {color:transparent; background:none;}
header h1 span {position:relative; top:-20px; display:inline-block; text-transform:lowercase; color:#000; width:auto; font-size:1rem; overflow:hidden; border-right:1px solid #000; white-space:nowrap; animation:typing 1.5s steps(12, start), blink-caret 1.5s step-start infinite;}
header.nonav h1 span {top:0;}
header nav {padding:2.1rem 0;}
header.nonav {min-height:108px;}
header nav a {display:inline-block; padding:0.3rem;}
header nav button {background-color:#fff; font-size:1.5rem; width:100%; display:none;}
main {display:block; clear:both; min-height:600px; background:linear-gradient(#ccc, #fff); width:100%; overflow:hidden;}
main a {color:#900;}
footer {display:block; clear:both; background-color:#ccc;}
footer form, footer section {width:100%; max-width:320px; padding:1rem;}
footer section {max-width:370px;}
footer form input, footer form textarea, form input, form textarea {text-align:center; padding:0.6rem; font-size:1rem;}
footer form p {padding:0.6rem 0 0.3rem;}
footer form .full {border:1px solid #aaa;}
footer form .full:focus {border:1px inset #aaa;}
main section {width:100%; max-width:900px; padding:1rem; clear:both;}
main section:after {content:' '; display:block; clear:both;}
main section dt {color:#900; clear:both; padding:1.8rem 0;}
main section dt u {display:inline-block; font-size:1.3rem;}
main section dd {clear:none;}
main section dd.empty {font-size:0; line-height:0;}
main section ul {list-style-position:inside;}
main section u.rtl, main section ul.rtl {width:49%; float:right; direction:rtl; text-align:right;}
main section u.ltr, main section ul.ltr {width:49%; float:left; direction:ltr; text-align:left;}
main section ul li, main section dd p, .media ul li {padding:0.6rem 0;}
aside {background-color:#e8e8e8; padding:1rem;}
aside figure {background-repeat:no-repeat; background-position:center top; background-size:contain; background-image:url('/img/pf/00.jpg'); -webkit-transition:background-image 3s ease-in-out; transition:background-image 3s ease-in-out;}
aside figure img {width:100%;}
aside figure figcaption {position:relative; top:-1rem; min-height:120px;}
aside figure figcaption a:hover {background:none;}
aside figure figcaption h2 {white-space:nowrap; width:320px; max-width:100%; overflow:hidden; text-overflow:ellipsis;}
label, .small {font-size:0.75rem;}
th {background-color:#000; color:#fff; padding:0.3rem; cursor:pointer;}
blockquote {display:table; width:100%;}

#about h3 {padding:0 0 0.6rem;}
#about article {line-height:180%; padding:1rem 0;}
.wrapper {overflow-x:hidden; overflow-y:visible;}
.parallax {height:210px; min-height:30vh; clear:both; position:relative;}
.parallax .wrapper {padding:75px 1rem 30px; position:relative; z-index:10;}
.parallax1 {background:#222 url('/img/css.gif') repeat-y 50% 50% fixed; background-size:300px; position:relative;}
.parallax1:before {content:' '; background:inherit; background-size:300px; position:absolute; top:0; left:0; bottom:0; width:100%; filter:hue-rotate(180deg) grayscale(60%) brightness(60%); z-index:0; transition:all 1.5s ease;}
.parallax1:hover:before {filter:hue-rotate(180deg) grayscale(30%) brightness(90%);}
.parallax2 {background:#222 url('/img/analytics.jpg') repeat-y 50% 50% fixed; background-size:cover; position:relative;}
.parallax2:before {content:' '; background:rgba(0,0,0,0.6); position:absolute; top:0; left:0; bottom:0; width:100%; z-index:0; transition:all 1.5s ease;}
.cta {padding:0.3rem 0.9rem; cursor:pointer; font-size:1.8rem; background-color:#900; color:#fff; border-radius:6px; transition:all 3s ease; white-space:nowrap;}
.cta i, header .lang {display:none;}
.cta:hover {background-color:#d00;}
.cta:hover i {display:inline;}
.bullets i {cursor:pointer;}
.bullets i.active {color:#d00;}
.media ul {list-style-position:inside; text-align:left; padding:0.6rem 0;}
.media .icons a {display:inline-block; font-size:1.8rem; padding:0.3rem; background-color:#eee; border-radius:50%; width:60px; height:60px; line-height:50px; margin:12px;}
.media .icons a:before {content:none;}
.iframe {background-color:#fff;}
.iframe figcaption {display:inline-block; padding:12px 0; max-width:180px;}
.iframe span {display:inline-block; border-radius:3px; color:#008cc9; padding:0 6px; border:1px solid #008cc9; font-size:12px; margin:3px 0 0;}
.iframe .f0 {padding:21px 0 0; display:block;}
.iframe a.f0:hover {background:none;}
.iframe a.f0:before {content:none;}
.crc {border-radius:50%;}
.copyright {font-size:0.75rem; padding:1rem;}
.copyright:before, main:before, blockquote:before {content:' '; position:relative; top:-1rem; display:block; width:100%; height:0px; border-top:1px solid #bbb; border-bottom:1px solid #ddd;}
main:before {top:0;}
.popup {position:fixed; width:320px; top:50%; left:50%; margin-top:-110px; margin-left:-160px; background-color:#fff; border-radius:6px; padding:1.5rem 0.9rem; display:none; border:1px solid #ccc;}
.popup .full {padding:0.3rem 0.6rem; border:1px solid #ccc; text-align:center; margin-bottom:1rem;}
.popup .fa-remove {position:absolute; top:3px; right:3px; cursor:pointer;}
.has-popup {overflow:hidden;}
.has-popup header, .has-popup main, .has-popup aside, .has-popup footer {pointer-events:none; filter:blur(9px); -webkit-filter:blur(9px); -moz-filter:blur(9px); -o-filter:blur(9px); -ms-filter:blur(9px); filter: url("data:image/svg+xml;utf9,<svg%20version='1.1'%20xmlns='http://www.w3.org/2000/svg'><filter%20id='blur'><feGaussianBlur%20stdDeviation='3'%20/></filter></svg>#blur"); filter:progid:DXImageTransform.Microsoft.Blur(PixelRadius='9'); filter:blur(9px); position:relative;}
.has-popup.edge {background:#ccc;}
.has-popup.ie header, .has-popup.ie main, .has-popup.ie aside, .has-popup.ie footer,
.has-popup.edge header, .has-popup.edge main, .has-popup.edge aside, .has-popup.edge footer {visibility:hidden;}
.has-popup .popup {display:block;}
.options {position:fixed; bottom:3rem; right:1.5rem;}
.options img {width:30px; cursor:pointer; display:none;}
.options a:hover {background:none;}
.options i {font-size:2.1rem; cursor:pointer; color:#d00;}

.pfo {display:flex; flex-wrap:wrap; justify-content:center; font-size:0; padding:6vmin;}
.pfo li {display:inline-block; width:300px; cursor:pointer; margin:0; padding:15px;}
.pfo figure {position:relative; width:100%; height:270px; border:1px solid #ccc; overflow:hidden; background-color:#fff;}
.pfo figure > img {width:100%; position:absolute; top:0; left:0; z-index:0;}
.pfo img {width:100%;}
.pfo figcaption {display:table; width:100%; background-color:rgba(255,255,255,0.9); position:absolute; top:0; bottom:0; left:0; width:100%; height:270px; z-index:6; font-size:0.9rem; padding:15px; opacity:0; transition:all 0.6s;}
.pfo li:hover figcaption {opacity:1; text-align:justify;}
.pfo h5 {font-weight:bold; color:#900; font-size:1.11rem; padding:6px 0; text-align:left;}
.pfo .rtl h5 {text-align:right;}
.pfo time {display:inline-block; font-size:1.11rem; font-weight:bold; float:right; padding:6px 0;}
.pfo .rtl time {float:left;}
.pfo figcaption p {clear:both; padding:6px 0;}
.pfo u {color:#900;}

.filter p {padding:30px 15px 0;}
.filter u {display:inline-block; cursor:pointer; position:relative; white-space:nowrap; padding:3px;}

@keyframes show {
from {color:#fff;}
to {color:#000;}
}

@keyframes typing {
from {width:0;}
to {width:120px;}
}

@keyframes blink-caret {
from, to {border-color:transparent;}
50% {border-color:#000;}
}

@media screen and (-webkit-min-device-pixel-ratio:0) {
.has-popup.safari {background:#ccc;}
.has-popup.safari header, .has-popup.safari main, .has-popup.safari aside, .has-popup.safari footer {visibility:hidden;}
}

@media (max-width:900px){
.m-full, .m-full.half, .half {width:100%; max-width:900px; float:none; clear:both;}
header {min-height:90px;}
header nav {position:absolute; top:0; width:150px !important; max-width:50% !important; padding:0.6rem; background-color:#fff; z-index:15;}
header nav.ltr {left:0; text-align:left;}
header nav.rtl {right:0; text-align:right;}
header nav a {display:none; background-color:#fff; font-size:1.2rem; border-top:1px solid #ccc; white-space:nowrap;}
header nav button {display:block; padding:0.6rem 0 0.3rem;}
header nav.open {border:1px solid #ccc;}
header nav.open a {display:block;}
header .lang.ltr {display:inline-block; position:absolute; top:1.2rem; right:1rem; z-index:9;}
header .lang.rtl {display:inline-block; position:absolute; top:1.2rem; left:1rem; z-index:9;}
header .lang img {width:30px;}
main section u.rtl, main section ul.rtl {width:100%; float:none; clear:both;}
main section u.ltr, main section ul.ltr {width:100%; float:none; clear:both;}
.lang_en .rtl, .lang_he .ltr {display:none !important;}
.lang_he .ltr, .lang_en .rtl {display:none !important;}
.options {right:auto; left:0.3rem;}
.options img {display:inline-block;}
.lang_en .options {left:auto; right:0.3rem;}
#pf_url {font-size:1.2rem; color:#d00;}
}

@media (max-width:630px){
header {padding-top:60px; min-height:150px;}
.cta {float:none;}
}

@media (max-width:370px){
header h1 a, footer section {width:100%; max-width:370px;}
.media p a {margin:0.6rem;}
.iframe {width:100%; position:relative; overflow:hidden; height:160px; background:none;}
.iframe .IN-widget {position:absolute; top:0; left:50%; margin-left:-182px;}
}