/* People Leads 2026 - services page. Values are comp px x var(--u) (see css.css):
base = Mobile-03/04 (1024 canvas),@media (min-width:1024px) = Desktop "שירותים שלנו" (1920 canvas).
The comp draws the open and the collapsed accordion card differently;
both are kept. */
/* ===== services accordion ===== */
.srv { padding-top:calc(52.1 * var(--u))
}
.srv__head { text-align:center
}
.srv__head .h2 { margin-top:calc(18 * var(--u))
}
.srv__list { display:flex;
flex-direction:column;
gap:calc(30 * var(--u));
margin:calc(58.4 * var(--u)) calc(39.3 * var(--u)) 0
}
.srv-item { overflow:hidden;
border-radius:calc(25 * var(--u));
background:#fff;
box-shadow:0 0 calc(3.74 * var(--u)) rgb(0 0 0 / .3);
interpolate-size:allow-keywords;
transition:background-color .3s,box-shadow .3s
}
.srv-item[open] { border-radius:calc(24 * var(--u)) calc(24 * var(--u)) 0 0;
background:#013;
box-shadow:none
}
.srv-item:not([open]):hover { box-shadow:0 0 calc(16 * var(--u)) rgb(0 0 0 / .22)
}
/* open/close glides where the browser can animate to height:auto;
elsewhere it just toggles */
.srv-item::details-content { block-size:0;
overflow:clip;
transition:block-size .45s cubic-bezier(.2,.7,.2,1),content-visibility .45s allow-discrete
}
.srv-item[open]::details-content { block-size:auto
}
.srv-item__head { display:flex;
flex-direction:column;
align-items:flex-start;
padding:calc(35.45 * var(--u)) calc(46.9 * var(--u)) calc(38.5 * var(--u)) calc(38 * var(--u));
list-style:none;
cursor:pointer
}
.srv-item__head::-webkit-details-marker { display:none
}
.srv-item__head:focus-visible { outline:3px solid var(--orange);
outline-offset:-6px;
border-radius:calc(25 * var(--u))
}
/* the chevron:decoration on the summary,so the whole head stays one button */
.srv-item__head::after { content:"";
flex:none;
width:calc(63.5 * var(--u));
height:calc(63.5 * var(--u));
margin-top:calc(72 * var(--u));
background:url(../../../design/default/css/../files/icons/chev-orange.svg) 50% 50% / contain no-repeat;
transition:transform .3s
}
.srv-item__head:hover::after { transform:translateX(calc(-6 * var(--u)))
}
.srv-item__icon { flex:none;
width:calc(var(--wm) * var(--u));
height:calc(95 * var(--u));
object-fit:contain
}
.srv-item__title { margin-top:calc(23.1 * var(--u));
color:var(--navy);
font-size:calc(50 * var(--u));
font-weight:700;
line-height:1.2;
transition:color .3s
}
/* comp grey #999 is 2.8:1 on white;
#767676 is the lightest grey that passes AA */
.srv-item__text { margin-top:calc(19.4 * var(--u));
color:#767676;
font-size:max(15px,calc(46 * var(--u)));
line-height:1.2
}
.srv-item[open] .srv-item__head { padding:calc(80.2 * var(--u)) calc(41.1 * var(--u)) 0 calc(41 * var(--u))
}
.srv-item[open] .srv-item__head::after { margin-top:calc(32.3 * var(--u))
}
.srv-item[open] .srv-item__icon { filter:brightness(0) invert(1)
}
.srv-item[open] .srv-item__title { margin-top:calc(41.2 * var(--u));
color:#fff;
font-size:calc(51 * var(--u))
}
.srv-item[open] .srv-item__text { margin-top:calc(15 * var(--u));
color:#fff
}
.srv-item__media { position:relative;
margin:calc(62.2 * var(--u)) calc(29.54 * var(--u)) 0;
padding:calc(16.45 * var(--u)) calc(15.95 * var(--u)) 0;
border-radius:calc(26 * var(--u)) calc(26 * var(--u)) 0 0;
background:#fff
}
.srv-item__media img { display:block;
width:100%;
height:calc(349.9 * var(--u));
border-radius:calc(17 * var(--u)) calc(17 * var(--u)) 0 0;
object-fit:cover
}
.srv-item__more { position:absolute;
left:calc(31.85 * var(--u));
top:calc(233.95 * var(--u));
width:calc(335 * var(--u));
height:calc(95.8 * var(--u));
font-size:max(14px,calc(38.05 * var(--u)))
}
/* ===== facts ===== */
.facts { margin:calc(116.1 * var(--u)) calc(39.3 * var(--u)) 0;
color:var(--navy)
}
.facts__head { display:flex;
flex-direction:column;
align-items:flex-start
}
.facts__badge { display:inline-flex;
align-items:center;
gap:calc(18.2 * var(--u));
height:calc(76.5 * var(--u));
margin-inline-start:calc(3.7 * var(--u));
padding-inline:calc(51 * var(--u)) calc(30.6 * var(--u));
border-radius:999px;
background:#fff;
box-shadow:0 0 calc(13.5 * var(--u)) rgb(0 0 0 / .3);
font-size:max(13px,calc(41.17 * var(--u)));
line-height:1
}
.facts__badge::after { content:"";
flex:none;
width:calc(24.76 * var(--u));
height:calc(24.76 * var(--u));
border-radius:50%;
background:var(--orange)
}
.facts__title { margin-top:calc(56.9 * var(--u));
font-size:calc(50 * var(--u));
line-height:1.226
}
/* mobile:the first three stats share a box ruled top,bottom and on the left */
.facts__stats { margin-top:calc(42.6 * var(--u))
}
.fact { display:flex;
flex-direction:column;
align-items:flex-start
}
.fact:nth-child(-n+3) { padding-top:calc(66.1 * var(--u));
border-inline-end:calc(1.5 * var(--u)) solid #e6e6e6
}
.fact:nth-child(1) { padding-top:calc(62.6 * var(--u));
border-top:calc(1.5 * var(--u)) solid #e6e6e6
}
.fact:nth-child(3) { padding-bottom:calc(53.6 * var(--u));
border-bottom:calc(1.5 * var(--u)) solid #e6e6e6
}
.fact--wide { margin-top:calc(45.4 * var(--u))
}
.fact__num { direction:ltr;
unicode-bidi:isolate;
color:var(--orange);
font-size:calc(140.59 * var(--u));
font-weight:700;
line-height:1
}
.fact__num small { font-size:.704em
}
.fact__label { margin-top:calc(4.6 * var(--u));
font-size:max(15px,calc(46 * var(--u)));
line-height:1.2
}
.facts__info { display:grid;
grid-template-columns:464.4fr 478fr;
margin:calc(99.7 * var(--u)) calc(1.5 * var(--u)) 0;
padding:calc(39.9 * var(--u)) 0 calc(45.2 * var(--u));
background:#013;
color:#fff;
font-size:max(14px,calc(46 * var(--u)));
line-height:1.2;
text-align:center
}
.facts__info > div + div { border-inline-start:calc(1.69 * var(--u)) solid #e6e6e6
}
.facts__info dt { font-weight:700
}
.facts__info dd { margin:0
}
/* ===== how we work (timeline) ===== */
.steps { padding-top:calc(76.6 * var(--u))
}
.steps__list { padding-inline:calc(39 * var(--u)) calc(38.8 * var(--u))
}
.step { position:relative;
display:flex;
flex-direction:column-reverse
}
.step + .step { margin-top:calc(306.2 * var(--u))
}
/* mobile connector between steps:line,dot,line (the dot svg scales with the comp's stroke) */
.step:not(:last-child)::after { content:"";
position:absolute;
top:calc(100% + 22.1 * var(--u));
right:calc(422.2 * var(--u));
width:calc(59.6 * var(--u));
height:calc(304.1 * var(--u));
background:url(../../../design/default/css/../files/icons/step-dot.svg) 50% 50% / calc(59.6 * var(--u)) no-repeat,linear-gradient(#013,#013) 50% 0 / calc(1.75 * var(--u)) calc(118 * var(--u)) no-repeat,linear-gradient(#013,#013) 50% 100% / calc(1.75 * var(--u)) calc(118 * var(--u)) no-repeat
}
.step__title { display:flex;
align-items:baseline;
gap:calc(18 * var(--u));
color:#013;
font-size:calc(60 * var(--u));
line-height:1.2
}
.step__num { position:relative;
color:#dfe4ea;
font-size:calc(121.93 * var(--u));
line-height:1
}
.step__num::after { content:"";
position:absolute;
right:calc(20.6 * var(--u));
top:calc(137.1 * var(--u));
width:calc(99.45 * var(--u));
height:calc(5.26 * var(--u));
border-radius:9px;
background:var(--orange)
}
.step__text { margin:calc(58 * var(--u)) calc(28.2 * var(--u)) 0 calc(177.2 * var(--u));
color:var(--navy);
font-size:max(15px,calc(46 * var(--u)));
line-height:1.2
}
.step__img { display:block;
margin-top:calc(43.4 * var(--u))
}
.step__img img { display:block;
width:100%;
height:calc(461.6 * var(--u));
border-radius:calc(25 * var(--u));
object-fit:cover
}
/* ===== contact details card ===== */
.reach { padding:calc(139.2 * var(--u)) 0 calc(76.6 * var(--u))
}
.reach__card { display:flex;
flex-direction:column;
width:auto;
margin-inline:calc(42.6 * var(--u));
border-radius:calc(24.79 * var(--u));
background:#fff;
box-shadow:0 0 calc(19.26 * var(--u)) rgb(0 0 0 / .3);
color:#013;
text-align:center
}
.reach__item { position:relative;
padding:calc(131.7 * var(--u)) 0 calc(103.3 * var(--u))
}
.reach__item:first-child { padding-top:calc(116.2 * var(--u))
}
.reach__item:last-child { padding-bottom:calc(104.8 * var(--u))
}
.reach__item + .reach__item::before { content:"";
position:absolute;
top:0;
left:50%;
width:calc(370 * var(--u));
height:calc(4.5 * var(--u));
transform:translateX(-50%);
background:#e6e6e6
}
.reach__title { display:flex;
justify-content:center;
align-items:center;
gap:calc(18 * var(--u));
font-size:calc(54 * var(--u));
line-height:1.2;
--lh:64.8
}
/* the icon must not push the line box:the comp spaces these blocks by the title text alone */
.reach__title::before { content:"";
flex:none;
width:calc(var(--iw) * var(--u));
height:calc(var(--ih) * var(--u));
margin-block:calc((var(--lh) - var(--ih)) / 2 * var(--u));
background:var(--icon) 50% 50% / contain no-repeat
}
.reach__item--pin { --iw:78.6;
--ih:101.3;
--icon:url(../../../design/default/css/../files/icons/contact-pin.svg)
}
.reach__item--support { --iw:104.6;
--ih:101.4;
--icon:url(../../../design/default/css/../files/icons/contact-headset.svg)
}
.reach__item--hours { --iw:86.4;
--ih:86.4;
--icon:url(../../../design/default/css/../files/icons/contact-clock.svg)
}
.reach__item p { margin-top:calc(83.2 * var(--u));
font-size:max(15px,calc(54 * var(--u)));
line-height:1.7
}
.reach__item a:hover { color:var(--orange)
}
@media (min-width:1024px) {
/* accordion */
.srv { padding-top:calc(55.3 * var(--u));
padding-bottom:calc(78.9 * var(--u));
background:url(../../../design/default/css/../files/img/srv-dots.webp) 50% calc(-135.5 * var(--u)) / calc(2457.6 * var(--u)) auto no-repeat
}
.srv__head .h2 { margin-top:calc(20.8 * var(--u))
}
.srv__list { gap:calc(15.3 * var(--u));
margin:calc(33.7 * var(--u)) calc(252.45 * var(--u)) 0 calc(230.7 * var(--u))
}
.srv-item { border-radius:calc(15.07 * var(--u));
box-shadow:0 0 calc(6 * var(--u)) rgb(0 0 0 / .3)
}
.srv-item[open] { border-radius:calc(15.77 * var(--u))
}
.srv-item__head { flex-direction:row;
align-items:center;
height:calc(106.9 * var(--u));
padding:0 calc(38.4 * var(--u)) 0 calc(45.4 * var(--u))
}
.srv-item__head:focus-visible { border-radius:calc(15 * var(--u))
}
.srv-item__head::after { order:9;
width:calc(42.4 * var(--u));
height:calc(42.4 * var(--u));
margin:0
}
.srv-item__icon { width:calc(var(--w) * var(--u));
height:calc(63.2 * var(--u));
margin-inline:calc((61 - var(--w)) / 2 * var(--u))
}
.srv-item__title { margin:0 calc(58 * var(--u)) 0 0;
font-size:calc(34 * var(--u))
}
.srv-item__text { width:calc(440 * var(--u));
margin:0 auto 0 calc(22.5 * var(--u));
font-size:max(15px,calc(24 * var(--u)));
line-height:1.1167
}
.srv-item[open] .srv-item__head { height:calc(119.6 * var(--u));
padding:0 calc(38.4 * var(--u)) 0 calc(45.4 * var(--u))
}
.srv-item[open] .srv-item__head::after { margin:0
}
.srv-item[open] .srv-item__title { margin:0 calc(58 * var(--u)) 0 0;
font-size:calc(34 * var(--u))
}
.srv-item[open] .srv-item__text { width:calc(545 * var(--u));
margin:0 auto 0 calc(47.5 * var(--u));
line-height:1.2833
}
.srv-item__media { margin:calc(6 * var(--u)) calc(192.2 * var(--u)) 0 calc(198.2 * var(--u));
padding:calc(9.1 * var(--u)) calc(8.2 * var(--u)) 0;
border-radius:calc(15.3 * var(--u)) calc(15.3 * var(--u)) 0 0
}
.srv-item__media img { height:calc(235.6 * var(--u));
border-radius:calc(10 * var(--u)) calc(10 * var(--u)) 0 0
}
.srv-item__more { left:calc(61.15 * var(--u));
top:calc(160.96 * var(--u));
width:calc(193.72 * var(--u));
height:calc(55.39 * var(--u));
font-size:max(14px,calc(22 * var(--u)))
}
/* facts:a 4-column grid,the +1,500 stat and the navy box share the left column */
.facts { display:grid;
grid-template-columns:calc(269.3 * var(--u)) calc(318.8 * var(--u)) calc(298.6 * var(--u)) calc(557.1 * var(--u));
grid-template-rows:calc(164.4 * var(--u)) calc(182.4 * var(--u));
margin:calc(68.4 * var(--u)) calc(226.4 * var(--u)) 0 calc(249.8 * var(--u))
}
.facts__head { grid-area:1 / 1 / 2 / 4;
padding:calc(9.2 * var(--u)) calc(17 * var(--u)) 0 0;
border-inline-end:1px solid #e6e6e6
}
.facts__badge { gap:calc(7 * var(--u));
height:calc(34 * var(--u));
margin:0;
padding-inline:calc(21.5 * var(--u)) calc(13.6 * var(--u));
box-shadow:0 0 calc(6 * var(--u)) rgb(0 0 0 / .3);
font-size:max(12px,calc(18.3 * var(--u)))
}
.facts__badge::after { width:calc(11 * var(--u));
height:calc(11 * var(--u))
}
.facts__title { margin-top:calc(10.5 * var(--u));
font-size:calc(34 * var(--u));
line-height:1.2588
}
.facts__stats { display:contents
}
.fact:nth-child(n) { grid-row:2;
padding:calc(20.6 * var(--u)) calc(70.4 * var(--u)) 0 0;
border:0;
border-top:1px solid #e6e6e6
}
.fact:nth-child(1) { padding-inline-start:calc(27.6 * var(--u))
}
.fact:nth-child(2) { border-inline:1px solid #e6e6e6
}
.fact--wide:nth-child(n) { grid-area:1 / 4;
margin:0;
padding:0 calc(82.9 * var(--u)) 0 0;
border:0
}
.fact__num { font-size:calc(69.59 * var(--u))
}
.fact__label { margin-top:calc(6.9 * var(--u));
font-size:max(14px,calc(24 * var(--u)));
line-height:1.1167
}
.facts__info { grid-area:2 / 4;
grid-template-columns:calc(274.6 * var(--u)) 1fr;
margin:calc(1.5 * var(--u)) 0 0;
padding:calc(27.1 * var(--u)) 0 0;
font-size:max(14px,calc(24 * var(--u)));
line-height:1.1167
}
.facts__info > div { padding:calc(8.3 * var(--u)) 0 calc(11.2 * var(--u))
}
.facts__info > div + div { border-inline-start-width:1px
}
/* timeline:image and text swap sides each step around a centre rule */
.steps { padding-top:calc(84.9 * var(--u))
}
.steps__list { position:relative;
padding-inline:calc(461.7 * var(--u)) calc(438.7 * var(--u))
}
.steps__list::before { content:"";
position:absolute;
top:calc(46.1 * var(--u));
bottom:calc(14.9 * var(--u));
right:calc(976 * var(--u));
width:1px;
background:#013
}
.step { display:grid;
grid-template-columns:calc(450 * var(--u)) calc(119.6 * var(--u)) calc(450 * var(--u));
align-items:start
}
.step + .step { margin-top:calc(20 * var(--u))
}
.step:not(:last-child)::after,.step::after { content:"";
position:absolute;
top:calc(106.4 * var(--u));
right:calc(497.8 * var(--u));
width:calc(34.02 * var(--u));
height:calc(34.02 * var(--u));
background:url(../../../design/default/css/../files/icons/step-dot.svg) 0 0 / 100% 100% no-repeat
}
.step__img { grid-area:1 / 1;
margin:0
}
.step__img img { height:calc(246.9 * var(--u));
border-radius:calc(14 * var(--u))
}
.step__body { grid-area:1 / 3;
padding:calc(15.3 * var(--u)) calc(2.7 * var(--u)) 0 0
}
.step__title { gap:calc(10 * var(--u));
font-size:calc(40 * var(--u))
}
.step__num { font-size:calc(69.59 * var(--u))
}
.step__num::after { right:calc(2.3 * var(--u));
top:calc(78.24 * var(--u));
width:calc(56.8 * var(--u));
height:calc(3 * var(--u))
}
.step__text { max-width:calc(430 * var(--u));
margin:calc(34.6 * var(--u)) calc(7 * var(--u)) 0 0;
font-size:max(15px,calc(23 * var(--u)));
line-height:1.339
}
.step:nth-child(even) .step__img { grid-column:3
}
.step:nth-child(even) .step__body { grid-column:1;
padding:calc(15.3 * var(--u)) 0 0 0;
text-align:left
}
.step:nth-child(even) .step__title { flex-direction:row-reverse
}
.step:nth-child(even) .step__num { margin-left:calc(-4.3 * var(--u))
}
.step:nth-child(even) .step__num::after { right:auto;
left:calc(5.4 * var(--u))
}
.step:nth-child(even) .step__text { margin:calc(34.6 * var(--u)) auto 0 0
}
/* contact details:three columns;
the outer two centre their content off-cell,as drawn */
.reach { padding:calc(93.9 * var(--u)) 0 calc(84.8 * var(--u))
}
.reach__card { flex-direction:row;
margin-inline:calc(134.9 * var(--u));
padding-block:calc(59.3 * var(--u)) calc(60.4 * var(--u));
border-radius:calc(15.43 * var(--u));
box-shadow:0 0 calc(10.16 * var(--u)) rgb(0 0 0 / .3)
}
.reach__item:nth-child(n) { flex:none;
padding:0
}
.reach__item:nth-child(1) { width:calc(566.7 * var(--u));
padding-inline-start:calc(81.5 * var(--u))
}
.reach__item:nth-child(2) { width:calc(495 * var(--u))
}
.reach__item:nth-child(3) { width:calc(588.5 * var(--u));
padding-inline-end:calc(170.7 * var(--u))
}
.reach__item + .reach__item::before { top:calc(-6.6 * var(--u));
right:-1px;
left:auto;
width:2px;
height:calc(164.4 * var(--u));
transform:none
}
.reach__title { gap:calc(12 * var(--u));
font-size:calc(24 * var(--u));
--lh:28.8
}
.reach__item--pin { --iw:34.9;
--ih:45
}
.reach__item--support { --iw:46.5;
--ih:45.1
}
.reach__item--hours { --iw:38.4;
--ih:38.4
}
.reach__item p { margin-top:calc(37 * var(--u));
font-size:max(15px,calc(24 * var(--u)));
line-height:1.7
}
}
/* Hero side bands where the viewport outgrows the canvas (tablet 600px column,>1920 desktop):
each half follows its own photo edge so the white header sits on dark ground and no seam shows.
Generated from the hero images' outer columns;
regenerate if they change (from build/):
python3 -I ../tools/edgebands.py files/img/srv-hero-mobile.webp -3.1 1053.7 1703     (tablet)
python3 -I ../tools/edgebands.py files/img/srv-hero-desktop.webp -20.6 1933.7 972    (>1920) */
@media (min-width:640px) and (max-width:1023px) { .page-hero { background:linear-gradient(#0f223a calc(0.0 * var(--u)),#0f223a calc(89.4 * var(--u)),#0d213a calc(183.0 * var(--u)),#061b3a calc(275.5 * var(--u)),#011738 calc(369.0 * var(--u)),#011637 calc(461.6 * var(--u)),#011535 calc(555.1 * var(--u)),#061a38 calc(647.6 * var(--u)),#173656 calc(741.2 * var(--u)),#355f82 calc(833.7 * var(--u)),#4d7699 calc(927.2 * var(--u)),#5a81a2 calc(1020.8 * var(--u)),#52789a calc(1113.3 * var(--u)),#3c6688 calc(1206.9 * var(--u)),#264d6c calc(1299.4 * var(--u)),#3b4c5e calc(1392.9 * var(--u)),#5d6b7f calc(1485.4 * var(--u)),#364964 calc(1579.0 * var(--u)),#384a65 calc(1586.2 * var(--u)),#fff calc(1586.2 * var(--u))) 0 0 / 50% 100% no-repeat,linear-gradient(#0c2039 calc(0.0 * var(--u)),#091d39 calc(89.4 * var(--u)),#061b3a calc(183.0 * var(--u)),#041a3b calc(275.5 * var(--u)),#021738 calc(369.0 * var(--u)),#011435 calc(461.6 * var(--u)),#0a1936 calc(555.1 * var(--u)),#0a1833 calc(647.6 * var(--u)),#05132e calc(741.2 * var(--u)),#010f29 calc(833.7 * var(--u)),#010d27 calc(927.2 * var(--u)),#000e27 calc(1020.8 * var(--u)),#000e27 calc(1113.3 * var(--u)),#010d26 calc(1206.9 * var(--u)),#000e27 calc(1299.4 * var(--u)),#04132d calc(1392.9 * var(--u)),#031635 calc(1485.4 * var(--u)),#021639 calc(1579.0 * var(--u)),#0b1e40 calc(1638.6 * var(--u)),#fff calc(1638.6 * var(--u))) 100% 0 / 50% 100% no-repeat,#fff
} }
@media (min-width:1921px) { .page-hero { background:linear-gradient(#0f2136 calc(0.0 * var(--u)),#10243b calc(31.7 * var(--u)),#10263c calc(85.1 * var(--u)),#1f3b53 calc(137.5 * var(--u)),#30516a calc(190.9 * var(--u)),#3f617a calc(243.2 * var(--u)),#4e7089 calc(296.6 * var(--u)),#57778f calc(348.9 * var(--u)),#5a7993 calc(402.3 * var(--u)),#4a6c87 calc(454.6 * var(--u)),#426681 calc(508.1 * var(--u)),#395e78 calc(561.5 * var(--u)),#365b75 calc(613.8 * var(--u)),#112c43 calc(667.2 * var(--u)),#132435 calc(719.5 * var(--u)),#757f8c calc(772.9 * var(--u)),#556173 calc(825.3 * var(--u)),#404f63 calc(878.7 * var(--u)),#465568 calc(905.9 * var(--u)),#fff calc(905.9 * var(--u))) 0 0 / 50% 100% no-repeat,linear-gradient(#02122d calc(0.0 * var(--u)),#02122d calc(31.7 * var(--u)),#01112b calc(85.1 * var(--u)),#01112a calc(137.5 * var(--u)),#010f29 calc(190.9 * var(--u)),#01102a calc(243.2 * var(--u)),#02102b calc(296.6 * var(--u)),#01112a calc(348.9 * var(--u)),#02122b calc(402.3 * var(--u)),#02122d calc(454.6 * var(--u)),#01112b calc(508.1 * var(--u)),#0f1d35 calc(561.5 * var(--u)),#101f37 calc(613.8 * var(--u)),#081831 calc(667.2 * var(--u)),#02122c calc(719.5 * var(--u)),#0c1b33 calc(772.9 * var(--u)),#0f1e36 calc(825.3 * var(--u)),#122037 calc(878.7 * var(--u)),#18273c calc(905.9 * var(--u)),#fff calc(905.9 * var(--u))) 100% 0 / 50% 100% no-repeat,#fff
} }