Skip to content
Projects
Groups
Snippets
Help
This project
Loading...
Sign in / Register
Toggle navigation
E
etersoft.com
Project
Project
Details
Activity
Cycle Analytics
Repository
Repository
Files
Commits
Branches
Tags
Contributors
Graph
Compare
Charts
Issues
0
Issues
0
List
Board
Labels
Milestones
Merge Requests
0
Merge Requests
0
CI / CD
CI / CD
Pipelines
Jobs
Schedules
Charts
Registry
Registry
Wiki
Wiki
Snippets
Snippets
Members
Members
Collapse sidebar
Close sidebar
Activity
Graph
Charts
Create a new issue
Jobs
Commits
Issue Boards
Open sidebar
Давид Добряков
etersoft.com
Commits
0acf9669
Commit
0acf9669
authored
Feb 24, 2020
by
Davyd Dobryakov
Browse files
Options
Browse Files
Download
Email Patches
Plain Diff
Build update for testing gitlab ci
parent
2dc8f319
Pipeline
#6219
failed with stage
Changes
1
Pipelines
1
Hide whitespace changes
Inline
Side-by-side
Showing
1 changed file
with
1 addition
and
1 deletion
+1
-1
app.css
dist/app.css
+1
-1
No files found.
dist/app.css
View file @
0acf9669
a
,
abbr
,
acronym
,
address
,
applet
,
article
,
aside
,
audio
,
b
,
big
,
blockquote
,
body
,
canvas
,
caption
,
center
,
cite
,
code
,
dd
,
del
,
details
,
dfn
,
div
,
dl
,
dt
,
em
,
embed
,
fieldset
,
figcaption
,
figure
,
footer
,
form
,
h1
,
h2
,
h3
,
h4
,
h5
,
h6
,
header
,
hgroup
,
html
,
i
,
iframe
,
img
,
ins
,
kbd
,
label
,
legend
,
li
,
mark
,
menu
,
nav
,
object
,
ol
,
output
,
p
,
pre
,
q
,
ruby
,
s
,
samp
,
section
,
small
,
span
,
strike
,
strong
,
sub
,
summary
,
sup
,
table
,
tbody
,
td
,
tfoot
,
th
,
thead
,
time
,
tr
,
tt
,
u
,
ul
,
var
,
video
{
margin
:
0
;
padding
:
0
;
font-size
:
100%
;
vertical-align
:
baseline
}
a
:active
,
a
:hover
{
outline
:
0
}
h1
,
h2
,
h3
,
h4
,
h5
,
h6
{
font-size
:
100%
;
font-weight
:
400
}
html
{
-webkit-box-sizing
:
border-box
;
box-sizing
:
border-box
}
:focus
{
outline
:
0
}
audio
,
img
,
video
{
max-width
:
100%
;
height
:
auto
}
audio
,
canvas
,
iframe
,
img
,
svg
,
video
{
vertical-align
:
middle
}
iframe
{
border
:
0
}
textarea
{
resize
:
none
;
overflow
:
auto
;
vertical-align
:
top
;
box-shadow
:
none
;
-webkit-box-shadow
:
none
;
-moz-box-shadow
:
none
}
button
,
input
,
select
,
textarea
{
outline
:
none
;
border
:
none
;
font-size
:
100%
;
margin
:
0
}
button
,
input
{
line-height
:
normal
}
table
{
border-collapse
:
collapse
;
border-spacing
:
0
}
td
,
th
{
padding
:
0
;
text-align
:
left
}
@font-face
{
font-family
:
FuturaDemiC
;
src
:
url(./FuturaDemiC.eot)
;
src
:
local
(
"Futura Demi Cyrillic"
),
local
(
"FuturaDemiC"
),
url(./FuturaDemiC.eot?#iefix)
format
(
"embedded-opentype"
),
url(./FuturaDemiC.woff)
format
(
"woff"
),
url(./FuturaDemiC.ttf)
format
(
"truetype"
);
font-weight
:
400
;
font-style
:
normal
}
@font-face
{
font-family
:
FuturaMediumC
;
src
:
url(./FuturaMediumC.eot)
;
src
:
local
(
"Futura Medium Cyrillic"
),
local
(
"FuturaMediumC"
),
url(./FuturaMediumC.eot?#iefix)
format
(
"embedded-opentype"
),
url(./FuturaMediumC.woff)
format
(
"woff"
),
url(./FuturaMediumC.ttf)
format
(
"truetype"
);
font-weight
:
500
;
font-style
:
normal
}
@font-face
{
font-family
:
FuturaLightC
;
src
:
url(./FuturaLightC-Italic.eot)
;
src
:
local
(
"Futura Light Italic Cyrillic"
),
local
(
"FuturaLightC-Italic"
),
url(./FuturaLightC-Italic.eot?#iefix)
format
(
"embedded-opentype"
),
url(./FuturaLightC-Italic.woff)
format
(
"woff"
),
url(./FuturaLightC-Italic.ttf)
format
(
"truetype"
);
font-weight
:
300
;
font-style
:
italic
}
@font-face
{
font-family
:
FuturaMediumC
;
src
:
url(./FuturaMediumC-Italic.eot)
;
src
:
local
(
"Futura Medium Italic Cyrillic"
),
local
(
"FuturaMediumC-Italic"
),
url(./FuturaMediumC-Italic.eot?#iefix)
format
(
"embedded-opentype"
),
url(./FuturaMediumC-Italic.woff)
format
(
"woff"
),
url(./FuturaMediumC-Italic.ttf)
format
(
"truetype"
);
font-weight
:
500
;
font-style
:
italic
}
@font-face
{
font-family
:
FuturaLightC
;
src
:
url(./FuturaLightC.eot)
;
src
:
local
(
"Futura Light Cyrillic"
),
local
(
"FuturaLightC"
),
url(./FuturaLightC.eot?#iefix)
format
(
"embedded-opentype"
),
url(./FuturaLightC.woff)
format
(
"woff"
),
url(./FuturaLightC.ttf)
format
(
"truetype"
);
font-weight
:
300
;
font-style
:
normal
}
@font-face
{
font-family
:
FuturaDemiC
;
src
:
url(./FuturaDemiC-Italic.eot)
;
src
:
local
(
"Futura Demi Italic Cyrillic"
),
local
(
"FuturaDemiC-Italic"
),
url(./FuturaDemiC-Italic.eot?#iefix)
format
(
"embedded-opentype"
),
url(./FuturaDemiC-Italic.woff)
format
(
"woff"
),
url(./FuturaDemiC-Italic.ttf)
format
(
"truetype"
);
font-weight
:
400
;
font-style
:
italic
}
@font-face
{
font-family
:
FuturaBookC
;
src
:
url(./FuturaBookC-Italic.eot)
;
src
:
local
(
"Futura Book Italic Cyrillic"
),
local
(
"FuturaBookC-Italic"
),
url(./FuturaBookC-Italic.eot?#iefix)
format
(
"embedded-opentype"
),
url(./FuturaBookC-Italic.woff)
format
(
"woff"
),
url(./FuturaBookC-Italic.ttf)
format
(
"truetype"
);
font-weight
:
400
;
font-style
:
italic
}
@font-face
{
font-family
:
FuturaBookC
;
src
:
url(./FuturaBookC.eot)
;
src
:
local
(
"Futura Book Cyrillic"
),
local
(
"FuturaBookC"
),
url(./FuturaBookC.eot?#iefix)
format
(
"embedded-opentype"
),
url(./FuturaBookC.woff)
format
(
"woff"
),
url(./FuturaBookC.ttf)
format
(
"truetype"
);
font-weight
:
400
;
font-style
:
normal
}
html
{
line-height
:
1.4
;
color
:
#101010
;
height
:
100%
;
scroll-behavior
:
smooth
}
body
,
html
{
font-size
:
18px
}
body
{
margin
:
0
;
padding
:
0
;
font-family
:
FuturaMediumC
;
font-weight
:
400
;
-webkit-font-smoothing
:
antialiased
;
-moz-osx-font-smoothing
:
grayscale
;
background
:
#fff
;
background
:
rgba
(
85
,
91
,
100
,
.1
)}
*,
:after
,
:before
{
-webkit-box-sizing
:
border-box
;
box-sizing
:
border-box
}
h1
,
h2
,
h3
,
h4
,
h5
,
h6
{
margin
:
0
}
a
{
text-decoration
:
none
}
li
,
ul
{
margin
:
0
;
padding
:
0
;
list-style-type
:
none
}
.wrapper
{
margin
:
0
auto
;
min-width
:
100vh
}
.content-wrapper
,
.wrapper
{
display
:
-webkit-box
;
display
:
-ms-flexbox
;
display
:
flex
;
-webkit-box-orient
:
vertical
;
-webkit-box-direction
:
normal
;
-ms-flex-direction
:
column
;
flex-direction
:
column
;
min-height
:
100vh
}
.container
{
width
:
100%
;
-webkit-box-flex
:
0
;
-ms-flex
:
0
0
auto
;
flex
:
0
0
auto
;
position
:
relative
;
margin
:
0
auto
;
max-width
:
1281px
}
h1
{
font-size
:
1.33333rem
}
h1
,
h2
{
font-weight
:
600
}
h2
{
font-size
:
1.22222rem
}
header
{
z-index
:
4
;
position
:
-webkit-sticky
;
position
:
sticky
;
display
:
block
;
background
:
#fff
;
-webkit-transition
:
top
1s
ease-out
.5s
;
-o-transition
:
top
1s
ease-out
.5s
;
transition
:
top
1s
ease-out
.5s
}
.top-0
{
top
:
0
}
nav
{
display
:
-webkit-box
;
display
:
-ms-flexbox
;
display
:
flex
;
-webkit-box-orient
:
horizontal
;
-webkit-box-direction
:
normal
;
-ms-flex-direction
:
row
;
flex-direction
:
row
;
-ms-flex-wrap
:
nowrap
;
flex-wrap
:
nowrap
;
-webkit-box-shadow
:
3px
0
3px
rgba
(
0
,
0
,
0
,
.3
);
box-shadow
:
3px
0
3px
rgba
(
0
,
0
,
0
,
.3
);
padding
:
.5rem
20%
}
nav
a
{
padding
:
0
.5rem
}
ul
.menu-right
{
margin-top
:
auto
;
margin-bottom
:
auto
;
display
:
-webkit-box
;
display
:
-ms-flexbox
;
display
:
flex
;
margin-left
:
auto
;
-webkit-box-ordinal-group
:
3
;
-ms-flex-order
:
2
;
order
:
2
;
-webkit-box-orient
:
horizontal
;
-webkit-box-direction
:
normal
;
-ms-flex-flow
:
row
wrap
;
flex-flow
:
row
wrap
}
ul
.menu-right
>*
{
margin
:
auto
0
auto
.25rem
}
footer
{
background
:
#fff
;
padding
:
1rem
.5rem
;
text-align
:
center
;
border
:
1px
solid
#dcdfe6
}
.logo
img
{
width
:
60px
;
height
:
60px
}
a
{
font-size
:
1rem
;
color
:
#303133
}
a
:hover
{
color
:
#999
}
.menu-button
{
display
:
inline-block
;
padding
:
.5em
;
background-color
:
#fafafa
;
border
:
1px
solid
#ccc
;
cursor
:
pointer
}
.burger-icon
{
position
:
relative
;
margin-top
:
8px
;
margin-bottom
:
8px
;
-webkit-user-select
:
none
;
-moz-user-select
:
none
;
-ms-user-select
:
none
;
user-select
:
none
}
.burger-icon
,
.burger-icon
:after
,
.burger-icon
:before
{
display
:
block
;
width
:
25px
;
height
:
3px
;
background-color
:
#444
;
-webkit-transition-property
:
background-color
,
-webkit-transform
;
-o-transition-property
:
background-color
,
-o-transform
;
transition-property
:
background-color
,
-webkit-transform
;
-o-transition-property
:
background-color
,
transform
;
transition-property
:
background-color
,
transform
;
transition-property
:
background-color
,
transform
,
-webkit-transform
;
-webkit-transition-duration
:
.3s
;
-o-transition-duration
:
.3s
;
transition-duration
:
.3s
}
.burger-icon
:after
,
.burger-icon
:before
{
position
:
absolute
;
content
:
""
}
.burger-icon
:before
{
top
:
-8px
}
.burger-icon
:after
{
top
:
8px
}
.menu-button.is-active
.burger-icon
{
background-color
:
rgba
(
0
,
0
,
0
,
0
)}
.menu-button.is-active
.burger-icon
:before
{
-webkit-transform
:
translateY
(
8px
)
rotate
(
45deg
);
-ms-transform
:
translateY
(
8px
)
rotate
(
45deg
);
transform
:
translateY
(
8px
)
rotate
(
45deg
)}
.menu-button.is-active
.burger-icon
:after
{
-webkit-transform
:
translateY
(
-8px
)
rotate
(
-45deg
);
-ms-transform
:
translateY
(
-8px
)
rotate
(
-45deg
);
transform
:
translateY
(
-8px
)
rotate
(
-45deg
)}
.visually-hidden
{
display
:
none
;
visibility
:
hidden
}
.visually-visible
{
visibility
:
visible
!important
;
display
:
inherit
!important
}
ol
.default-list
{
display
:
block
;
list-style-type
:
decimal
;
margin
:
1em
0
1
em
;
padding-left
:
40px
}
ol
.default-list
>
li
{
display
:
list-item
;
list-style-type
:
inherit
!important
}
select
{
padding
:
.25rem
;
border
:
1px
solid
#dcdfe6
;
border-radius
:
5px
;
background
:
#fff
}
.pt-2
{
padding-top
:
2rem
!important
}
.mt-2
{
margin-top
:
.5rem
!important
}
.mb-3
{
margin-bottom
:
1.5rem
!important
}
.map-iframe
{
width
:
100%
;
height
:
300px
;
margin
:
0
auto
}
section
{
margin
:
0
20%
;
display
:
grid
;
grid-template-columns
:
repeat
(
2
,
1
fr
);
background
:
#fff
;
border-left
:
1px
solid
#dcdfe6
;
border-bottom
:
1px
solid
#dcdfe6
;
border-right
:
1px
solid
#dcdfe6
;
border-top-color
:
#dcdfe6
;
-webkit-box-sizing
:
border-box
;
box-sizing
:
border-box
}
section
.left-column
{
padding
:
1rem
.5rem
}
section
.left-column
,
section
.right-column
{
width
:
100%
;
height
:
100%
}
.flex-column
{
display
:
-webkit-box
;
display
:
-ms-flexbox
;
display
:
flex
;
-webkit-box-orient
:
vertical
;
-webkit-box-direction
:
normal
;
-ms-flex-flow
:
column
wrap
;
flex-flow
:
column
wrap
;
margin
:
0
20%
;
padding
:
1rem
0
}
.flex-column
h2
{
padding
:
0
.5rem
}
.right-column
.banner
{
display
:
-webkit-box
;
display
:
-ms-flexbox
;
display
:
flex
;
-webkit-box-align
:
center
;
-ms-flex-align
:
center
;
align-items
:
center
;
-webkit-box-pack
:
center
;
-ms-flex-pack
:
center
;
justify-content
:
center
;
width
:
100%
;
height
:
100%
}
.description
{
padding
:
.5rem
0
;
text-align
:
justify
}
.btn
{
padding
:
.5rem
1rem
;
border-radius
:
5px
}
.btn-default
{
color
:
#fff
;
background-color
:
#303133
}
.btn-default
:hover
{
color
:
#303133
;
background-color
:
#fff
;
border
:
1px
solid
#303133
}
.btn-primary
{
color
:
#fff
;
background-color
:
#444ce0
}
.btn-primary
:hover
{
color
:
#444ce0
;
background-color
:
#fff
;
border
:
1px
solid
#444ce0
}
.btn-success
{
color
:
#fff
;
background-color
:
#26de81
}
.btn-success
:hover
{
color
:
#26de81
;
background-color
:
#fff
;
border
:
1px
solid
#26de81
}
.btn-danger
{
color
:
#fff
;
background-color
:
#fc5c65
}
.btn-danger
:hover
{
color
:
#fc5c65
;
background-color
:
#fff
;
border
:
1px
solid
#fc5c65
}
.btn-warning
{
color
:
#fff
;
background-color
:
#fed330
}
.btn-warning
:hover
{
color
:
#fed330
;
background-color
:
#fff
;
border
:
1px
solid
#fed330
}
.hello-banner
{
width
:
100%
;
min-height
:
500px
;
max-height
:
500px
;
position
:
relative
;
margin
:
0
auto
}
.hello-banner__text
{
color
:
#fff
;
position
:
relative
;
width
:
100%
;
padding
:
3rem
20%
;
z-index
:
3
;
height
:
100%
}
.hello-banner__text
h1
{
font-size
:
2.66667rem
;
font-weight
:
700
}
.hello-banner__text
p
{
font-size
:
1.33333rem
}
.hello-banner__gradient
{
background
:
#000
;
opacity
:
.8
;
width
:
100%
;
height
:
100%
;
position
:
absolute
;
z-index
:
2
}
.hello-banner__img
{
-webkit-filter
:
blur
(
2px
);
filter
:
blur
(
2px
);
width
:
100%
;
height
:
100%
;
position
:
absolute
;
z-index
:
1
;
background-image
:
url(.//images/banner.jpg)
;
background-size
:
cover
}
.slider
{
position
:
relative
;
overflow
:
hidden
}
.slider__wrapper
{
display
:
-webkit-box
;
display
:
-ms-flexbox
;
display
:
flex
;
-webkit-transition
:
-webkit-transform
.6s
ease
;
transition
:
-webkit-transform
.6s
ease
;
-o-transition
:
transform
.6s
ease
;
transition
:
transform
.6s
ease
;
transition
:
transform
.6s
ease
,
-webkit-transform
.6s
ease
}
.slider__item
{
-webkit-box-flex
:
0
;
-ms-flex
:
0
0
25%
;
flex
:
0
0
25%
;
max-width
:
25%
}
.slider__control
{
position
:
absolute
;
top
:
50%
;
display
:
-webkit-box
;
display
:
-ms-flexbox
;
display
:
flex
;
-webkit-box-align
:
center
;
-ms-flex-align
:
center
;
align-items
:
center
;
-webkit-box-pack
:
center
;
-ms-flex-pack
:
center
;
justify-content
:
center
;
width
:
40px
;
color
:
#fff
;
text-align
:
center
;
opacity
:
.5
;
height
:
50px
;
-webkit-transform
:
translateY
(
-50%
);
-ms-transform
:
translateY
(
-50%
);
transform
:
translateY
(
-50%
);
background
:
rgba
(
0
,
0
,
0
,
.5
);
z-index
:
10
}
.slider__control
:focus
,
.slider__control
:hover
{
color
:
#fff
;
text-decoration
:
none
;
outline
:
0
;
opacity
:
.9
}
.slider__control_left
{
left
:
0
}
.slider__control_right
{
right
:
0
}
.slider__control
:before
{
content
:
""
;
display
:
inline-block
;
width
:
20px
;
height
:
20px
;
background
:
rgba
(
0
,
0
,
0
,
0
)
no-repeat
50%
;
background-size
:
100%
100%
}
.slider__control_left
:before
{
background-image
:
url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23fff' viewBox='0 0 8 8'%3E%3Cpath d='M5.25 0l-4 4 4 4 1.5-1.5-2.5-2.5 2.5-2.5-1.5-1.5z'/%3E%3C/svg%3E")
}
.slider__control_right
:before
{
background-image
:
url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23fff' viewBox='0 0 8 8'%3E%3Cpath d='M2.75 0l-1.5 1.5 2.5 2.5-2.5 2.5 1.5 1.5 4-4-4-4z'/%3E%3C/svg%3E")
}
.slider__item
.card
{
display
:
-webkit-box
;
display
:
-ms-flexbox
;
display
:
flex
;
-webkit-box-orient
:
vertical
;
-webkit-box-direction
:
normal
;
-ms-flex-direction
:
column
;
flex-direction
:
column
;
-webkit-box-pack
:
end
;
-ms-flex-pack
:
end
;
justify-content
:
flex-end
;
padding
:
0
;
width
:
100%
;
height
:
300px
;
text-align
:
center
;
background
:
#fff
;
color
:
#fff
;
border
:
1px
solid
#d7d7d7
;
border-radius
:
5px
;
position
:
relative
;
-webkit-box-sizing
:
border-box
;
box-sizing
:
border-box
}
.slider__item
.card
.card__body
.card__image
,
.slider__item
.card
.card__body
.card__image
img
{
z-index
:
1
;
position
:
absolute
;
top
:
0
;
left
:
0
;
width
:
100%
;
height
:
100%
;
border-radius
:
5px
}
.slider__item
.card
.card__body
.card__overlay
{
background
:
#000
;
opacity
:
.5
;
width
:
100%
;
height
:
100%
;
position
:
absolute
;
top
:
0
;
left
:
0
;
z-index
:
2
;
border-radius
:
5px
}
.slider__item
.card
.card__body
{
padding
:
.5rem
1rem
;
display
:
-webkit-box
;
display
:
-ms-flexbox
;
display
:
flex
;
-webkit-box-orient
:
vertical
;
-webkit-box-direction
:
normal
;
-ms-flex-direction
:
column
;
flex-direction
:
column
}
.slider__item
.card
.card__body
.card__heading
,
.slider__item
.card
.card__body
.card__text
{
z-index
:
3
}
.slider
:focus
,
.slider__control
:focus
,
a
:focus
{
outline
:
3px
solid
#529dec
}
.card
{
display
:
-webkit-box
;
display
:
-ms-flexbox
;
display
:
flex
;
-webkit-box-orient
:
vertical
;
-webkit-box-direction
:
normal
;
-ms-flex-direction
:
column
;
flex-direction
:
column
;
-webkit-box-pack
:
end
;
-ms-flex-pack
:
end
;
justify-content
:
flex-end
;
padding
:
0
;
text-align
:
center
;
background
:
#fff
;
color
:
#fff
;
border
:
1px
solid
#d7d7d7
;
border-radius
:
5px
;
position
:
relative
;
-webkit-box-sizing
:
border-box
;
box-sizing
:
border-box
;
margin
:
.1rem
}
.card
,
.card__image
,
.card__image
img
{
width
:
300px
;
height
:
300px
}
.card__image
,
.card__image
img
{
z-index
:
1
}
.card__image
,
.card__image
img
,
.card__overlay
{
position
:
absolute
;
top
:
0
;
left
:
0
;
-webkit-box-sizing
:
border-box
;
box-sizing
:
border-box
;
border-radius
:
5px
}
.card__overlay
{
background
:
#000
;
opacity
:
.7
;
width
:
300px
;
height
:
300px
;
z-index
:
2
}
.card__body
{
padding
:
.5rem
1rem
;
display
:
-webkit-box
;
display
:
-ms-flexbox
;
display
:
flex
;
-webkit-box-orient
:
vertical
;
-webkit-box-direction
:
normal
;
-ms-flex-direction
:
column
;
flex-direction
:
column
}
.card__heading
,
.card__text
{
z-index
:
3
}
.card__text
{
text-align
:
center
}
.card__heading--animated
,
.card__text--animated
{
z-index
:
3
}
.card__text--animated
{
font-size
:
.77778
rem
;
-webkit-transform
:
translateY
(
10%
);
-ms-transform
:
translateY
(
10%
);
transform
:
translateY
(
10%
);
position
:
absolute
;
visibility
:
hidden
}
.card
:hover
.card__heading--animated
,
.card
:hover
.card__text--animated
{
-webkit-transition
:
.3s
ease
;
-o-transition
:
.3s
ease
;
transition
:
.3s
ease
}
.card
:hover
.card__text--animated
{
-webkit-transform
:
translateY
(
-10%
);
-ms-transform
:
translateY
(
-10%
);
transform
:
translateY
(
-10%
);
position
:
static
;
margin-top
:
.75rem
;
visibility
:
visible
}
.card-deck
{
display
:
grid
;
grid-template-columns
:
repeat
(
3
,
auto
);
margin
:
auto
;
padding
:
1rem
.5rem
}
@media
screen
and
(
max-width
:
1281px
){
html
{
font-size
:
16px
}
.card-deck
{
grid-template-columns
:
repeat
(
2
,
auto
)}
.card-deck
.card
,
.card-deck
.card__image
,
.card-deck
.card__image
img
,
.card-deck
.card__overlay
{
width
:
350px
;
height
:
350px
}}
@media
screen
and
(
max-width
:
769px
){
html
{
font-size
:
15px
}
.container
{
max-width
:
481px
}}
@media
screen
and
(
max-width
:
481px
){
html
{
font-size
:
14px
}
.container
{
max-width
:
321px
}
.slider
,
.slider__item
{
width
:
100%
;
max-width
:
481px
}
.slider__item
{
-webkit-box-flex
:
0
;
-ms-flex
:
0
0
100%
;
flex
:
0
0
100%
}
.card-deck
{
grid-template-columns
:
repeat
(
1
,
auto
);
margin
:
auto
}}
@media
screen
and
(
max-width
:
1025px
){
.container
{
max-width
:
769px
}
.menu-right
>
li
,
menu
#menu
{
display
:
none
;
visibility
:
hidden
}
menu
#menu
{
border-top
:
1px
solid
#dcdfe6
;
border-bottom
:
1px
solid
#dcdfe6
;
-webkit-box-orient
:
vertical
;
-webkit-box-direction
:
normal
;
-ms-flex-flow
:
column
wrap
;
flex-flow
:
column
wrap
;
width
:
100%
;
text-align
:
center
;
z-index
:
4
;
position
:
-webkit-sticky
;
position
:
sticky
;
background
:
#fff
;
top
:
76px
}
menu
#menu
>
a
{
display
:
-webkit-box
;
display
:
-ms-flexbox
;
display
:
flex
;
width
:
100%
;
border
:
inherit
;
height
:
40px
}
menu
#menu
>
a
>
span
{
width
:
inherit
;
text-align
:
center
;
line-height
:
2.22222rem
}
section
{
display
:
-webkit-box
;
display
:
-ms-flexbox
;
display
:
flex
;
-webkit-box-orient
:
vertical
;
-webkit-box-direction
:
normal
;
-ms-flex-flow
:
column
wrap
;
flex-flow
:
column
wrap
;
margin
:
0
}
section
.left-column
{
-webkit-box-ordinal-group
:
2
;
-ms-flex-order
:
1
;
order
:
1
}
.banner
,
.right-column
{
max-height
:
-webkit-min-content
;
max-height
:
-moz-min-content
;
max-height
:
min-content
}
nav
{
padding
:
.5rem
}
section
.card-deck
,
section
.flex-column
{
margin
:
0
}
.hello-banner__text
{
padding
:
3rem
1rem
}
.flex-column
{
margin
:
0
}}
@media
screen
and
(
min-width
:
1025px
){
.menu-button
,
menu
#menu
{
display
:
none
;
visibility
:
hidden
}}
@media
(
min-width
:
1025px
)
and
(
max-width
:
1281px
){
section
,
section
.flex-column
{
margin
:
0
10%
}
nav
{
padding
:
.5rem
10%
}
.hello-banner__text
{
padding
:
3rem
10%
}}
@media
screen
and
(
max-width
:
641px
){
section
.card-deck
{
margin
:
0
}
section
.card-deck
.card-group
{
-webkit-box-orient
:
vertical
;
-webkit-box-direction
:
normal
;
-ms-flex-flow
:
column
wrap
;
flex-flow
:
column
wrap
}
.card-deck
.card
,
.card-deck
.card__image
,
.card-deck
.card__image
img
,
.card-deck
.card__overlay
{
width
:
280px
;
height
:
280px
}}
@media
(
min-width
:
1281px
)
and
(
max-width
:
1537px
){
.hello-banner__text
{
padding
:
3rem
5%
}}
@media
screen
and
(
min-width
:
1537px
){
.hello-banner__text
h1
{
font-size
:
2.61111rem
}
.hello-banner__text
p
{
font-size
:
1.22222rem
}}
@media
(
min-width
:
769px
)
and
(
max-width
:
1025px
){
.hello-banner__text
h1
{
font-size
:
2.33333rem
}
.hello-banner__text
p
{
font-size
:
1.16667rem
}
.slider
{
width
:
100%
;
max-width
:
1025px
}
.slider__item
{
width
:
33.33333%
;
max-width
:
341.66667px
;
-webkit-box-flex
:
0
;
-ms-flex
:
0
0
33.33333%
;
flex
:
0
0
33.33333%
}}
@media
(
min-width
:
481px
)
and
(
max-width
:
641px
){
.hello-banner__text
h1
{
font-size
:
2.22222rem
}
.hello-banner__text
p
{
font-size
:
1.11111rem
}}
@media
(
min-width
:
321px
)
and
(
max-width
:
481px
){
.hello-banner__text
h1
{
font-size
:
1.77778rem
}
.hello-banner__text
p
{
font-size
:
1rem
}}
@media
screen
and
(
max-width
:
321px
){
.hello-banner__text
h1
{
font-size
:
1.44444rem
}
.hello-banner__text
p
{
font-size
:
.77778rem
}}
@media
(
min-width
:
481px
)
and
(
max-width
:
769px
){
.slider
{
width
:
100%
;
max-width
:
769px
}
.slider__item
{
width
:
50%
;
max-width
:
384.5px
;
-webkit-box-flex
:
0
;
-ms-flex
:
0
0
50%
;
flex
:
0
0
50%
}}
a
,
abbr
,
acronym
,
address
,
applet
,
article
,
aside
,
audio
,
b
,
big
,
blockquote
,
body
,
canvas
,
caption
,
center
,
cite
,
code
,
dd
,
del
,
details
,
dfn
,
div
,
dl
,
dt
,
em
,
embed
,
fieldset
,
figcaption
,
figure
,
footer
,
form
,
h1
,
h2
,
h3
,
h4
,
h5
,
h6
,
header
,
hgroup
,
html
,
i
,
iframe
,
img
,
ins
,
kbd
,
label
,
legend
,
li
,
mark
,
menu
,
nav
,
object
,
ol
,
output
,
p
,
pre
,
q
,
ruby
,
s
,
samp
,
section
,
small
,
span
,
strike
,
strong
,
sub
,
summary
,
sup
,
table
,
tbody
,
td
,
tfoot
,
th
,
thead
,
time
,
tr
,
tt
,
u
,
ul
,
var
,
video
{
margin
:
0
;
padding
:
0
;
font-size
:
100%
;
vertical-align
:
baseline
}
a
:active
,
a
:hover
{
outline
:
0
}
h1
,
h2
,
h3
,
h4
,
h5
,
h6
{
font-size
:
100%
;
font-weight
:
400
}
html
{
-webkit-box-sizing
:
border-box
;
box-sizing
:
border-box
}
:focus
{
outline
:
0
}
audio
,
img
,
video
{
max-width
:
100%
;
height
:
auto
}
audio
,
canvas
,
iframe
,
img
,
svg
,
video
{
vertical-align
:
middle
}
iframe
{
border
:
0
}
textarea
{
resize
:
none
;
overflow
:
auto
;
vertical-align
:
top
;
box-shadow
:
none
;
-webkit-box-shadow
:
none
;
-moz-box-shadow
:
none
}
button
,
input
,
select
,
textarea
{
outline
:
none
;
border
:
none
;
font-size
:
100%
;
margin
:
0
}
button
,
input
{
line-height
:
normal
}
table
{
border-collapse
:
collapse
;
border-spacing
:
0
}
td
,
th
{
padding
:
0
;
text-align
:
left
}
@font-face
{
font-family
:
FuturaDemiC
;
src
:
url(./FuturaDemiC.eot)
;
src
:
local
(
"Futura Demi Cyrillic"
),
local
(
"FuturaDemiC"
),
url(./FuturaDemiC.eot?#iefix)
format
(
"embedded-opentype"
),
url(./FuturaDemiC.woff)
format
(
"woff"
),
url(./FuturaDemiC.ttf)
format
(
"truetype"
);
font-weight
:
400
;
font-style
:
normal
}
@font-face
{
font-family
:
FuturaMediumC
;
src
:
url(./FuturaMediumC.eot)
;
src
:
local
(
"Futura Medium Cyrillic"
),
local
(
"FuturaMediumC"
),
url(./FuturaMediumC.eot?#iefix)
format
(
"embedded-opentype"
),
url(./FuturaMediumC.woff)
format
(
"woff"
),
url(./FuturaMediumC.ttf)
format
(
"truetype"
);
font-weight
:
500
;
font-style
:
normal
}
@font-face
{
font-family
:
FuturaLightC
;
src
:
url(./FuturaLightC-Italic.eot)
;
src
:
local
(
"Futura Light Italic Cyrillic"
),
local
(
"FuturaLightC-Italic"
),
url(./FuturaLightC-Italic.eot?#iefix)
format
(
"embedded-opentype"
),
url(./FuturaLightC-Italic.woff)
format
(
"woff"
),
url(./FuturaLightC-Italic.ttf)
format
(
"truetype"
);
font-weight
:
300
;
font-style
:
italic
}
@font-face
{
font-family
:
FuturaMediumC
;
src
:
url(./FuturaMediumC-Italic.eot)
;
src
:
local
(
"Futura Medium Italic Cyrillic"
),
local
(
"FuturaMediumC-Italic"
),
url(./FuturaMediumC-Italic.eot?#iefix)
format
(
"embedded-opentype"
),
url(./FuturaMediumC-Italic.woff)
format
(
"woff"
),
url(./FuturaMediumC-Italic.ttf)
format
(
"truetype"
);
font-weight
:
500
;
font-style
:
italic
}
@font-face
{
font-family
:
FuturaLightC
;
src
:
url(./FuturaLightC.eot)
;
src
:
local
(
"Futura Light Cyrillic"
),
local
(
"FuturaLightC"
),
url(./FuturaLightC.eot?#iefix)
format
(
"embedded-opentype"
),
url(./FuturaLightC.woff)
format
(
"woff"
),
url(./FuturaLightC.ttf)
format
(
"truetype"
);
font-weight
:
300
;
font-style
:
normal
}
@font-face
{
font-family
:
FuturaDemiC
;
src
:
url(./FuturaDemiC-Italic.eot)
;
src
:
local
(
"Futura Demi Italic Cyrillic"
),
local
(
"FuturaDemiC-Italic"
),
url(./FuturaDemiC-Italic.eot?#iefix)
format
(
"embedded-opentype"
),
url(./FuturaDemiC-Italic.woff)
format
(
"woff"
),
url(./FuturaDemiC-Italic.ttf)
format
(
"truetype"
);
font-weight
:
400
;
font-style
:
italic
}
@font-face
{
font-family
:
FuturaBookC
;
src
:
url(./FuturaBookC-Italic.eot)
;
src
:
local
(
"Futura Book Italic Cyrillic"
),
local
(
"FuturaBookC-Italic"
),
url(./FuturaBookC-Italic.eot?#iefix)
format
(
"embedded-opentype"
),
url(./FuturaBookC-Italic.woff)
format
(
"woff"
),
url(./FuturaBookC-Italic.ttf)
format
(
"truetype"
);
font-weight
:
400
;
font-style
:
italic
}
@font-face
{
font-family
:
FuturaBookC
;
src
:
url(./FuturaBookC.eot)
;
src
:
local
(
"Futura Book Cyrillic"
),
local
(
"FuturaBookC"
),
url(./FuturaBookC.eot?#iefix)
format
(
"embedded-opentype"
),
url(./FuturaBookC.woff)
format
(
"woff"
),
url(./FuturaBookC.ttf)
format
(
"truetype"
);
font-weight
:
400
;
font-style
:
normal
}
html
{
line-height
:
1.4
;
color
:
#101010
;
height
:
100%
;
scroll-behavior
:
smooth
}
body
,
html
{
font-size
:
18px
}
body
{
margin
:
0
;
padding
:
0
;
font-family
:
FuturaMediumC
;
font-weight
:
400
;
-webkit-font-smoothing
:
antialiased
;
-moz-osx-font-smoothing
:
grayscale
;
background
:
#fff
;
background
:
rgba
(
85
,
91
,
100
,
.1
)}
*,
:after
,
:before
{
-webkit-box-sizing
:
border-box
;
box-sizing
:
border-box
}
h1
,
h2
,
h3
,
h4
,
h5
,
h6
{
margin
:
0
}
a
{
text-decoration
:
none
}
li
,
ul
{
margin
:
0
;
padding
:
0
;
list-style-type
:
none
}
.wrapper
{
margin
:
0
auto
;
min-width
:
100vh
}
.content-wrapper
,
.wrapper
{
display
:
-webkit-box
;
display
:
-ms-flexbox
;
display
:
flex
;
-webkit-box-orient
:
vertical
;
-webkit-box-direction
:
normal
;
-ms-flex-direction
:
column
;
flex-direction
:
column
;
min-height
:
100vh
}
.container
{
width
:
100%
;
-webkit-box-flex
:
0
;
-ms-flex
:
0
0
auto
;
flex
:
0
0
auto
;
position
:
relative
;
margin
:
0
auto
;
max-width
:
1281px
}
h1
{
font-size
:
1.33333rem
}
h1
,
h2
{
font-weight
:
600
}
h2
{
font-size
:
1.22222rem
}
header
{
z-index
:
4
;
position
:
-webkit-sticky
;
position
:
sticky
;
display
:
block
;
background
:
#fff
;
-webkit-transition
:
top
1s
ease-out
.5s
;
-o-transition
:
top
1s
ease-out
.5s
;
transition
:
top
1s
ease-out
.5s
}
.top-0
{
top
:
0
}
nav
{
display
:
-webkit-box
;
display
:
-ms-flexbox
;
display
:
flex
;
-webkit-box-orient
:
horizontal
;
-webkit-box-direction
:
normal
;
-ms-flex-direction
:
row
;
flex-direction
:
row
;
-ms-flex-wrap
:
nowrap
;
flex-wrap
:
nowrap
;
-webkit-box-shadow
:
3px
0
3px
rgba
(
0
,
0
,
0
,
.3
);
box-shadow
:
3px
0
3px
rgba
(
0
,
0
,
0
,
.3
);
padding
:
.5rem
20%
}
nav
a
{
padding
:
0
.5rem
}
ul
.menu-right
{
margin-top
:
auto
;
margin-bottom
:
auto
;
display
:
-webkit-box
;
display
:
-ms-flexbox
;
display
:
flex
;
margin-left
:
auto
;
-webkit-box-ordinal-group
:
3
;
-ms-flex-order
:
2
;
order
:
2
;
-webkit-box-orient
:
horizontal
;
-webkit-box-direction
:
normal
;
-ms-flex-flow
:
row
wrap
;
flex-flow
:
row
wrap
}
ul
.menu-right
>*
{
margin
:
auto
0
auto
.25rem
}
footer
{
background
:
#fff
;
padding
:
1rem
.5rem
;
text-align
:
center
;
border
:
1px
solid
#dcdfe6
}
.logo
img
{
width
:
60px
;
height
:
60px
}
a
{
font-size
:
1rem
;
color
:
#303133
}
a
:hover
{
color
:
#999
}
.menu-button
{
display
:
inline-block
;
padding
:
.5em
;
background-color
:
#fafafa
;
border
:
1px
solid
#ccc
;
cursor
:
pointer
}
.burger-icon
{
position
:
relative
;
margin-top
:
8px
;
margin-bottom
:
8px
;
-webkit-user-select
:
none
;
-moz-user-select
:
none
;
-ms-user-select
:
none
;
user-select
:
none
}
.burger-icon
,
.burger-icon
:after
,
.burger-icon
:before
{
display
:
block
;
width
:
25px
;
height
:
3px
;
background-color
:
#444
;
-webkit-transition-property
:
background-color
,
-webkit-transform
;
-o-transition-property
:
background-color
,
-o-transform
;
transition-property
:
background-color
,
-webkit-transform
;
-o-transition-property
:
background-color
,
transform
;
transition-property
:
background-color
,
transform
;
transition-property
:
background-color
,
transform
,
-webkit-transform
;
-webkit-transition-duration
:
.3s
;
-o-transition-duration
:
.3s
;
transition-duration
:
.3s
}
.burger-icon
:after
,
.burger-icon
:before
{
position
:
absolute
;
content
:
""
}
.burger-icon
:before
{
top
:
-8px
}
.burger-icon
:after
{
top
:
8px
}
.menu-button.is-active
.burger-icon
{
background-color
:
rgba
(
0
,
0
,
0
,
0
)}
.menu-button.is-active
.burger-icon
:before
{
-webkit-transform
:
translateY
(
8px
)
rotate
(
45deg
);
-ms-transform
:
translateY
(
8px
)
rotate
(
45deg
);
transform
:
translateY
(
8px
)
rotate
(
45deg
)}
.menu-button.is-active
.burger-icon
:after
{
-webkit-transform
:
translateY
(
-8px
)
rotate
(
-45deg
);
-ms-transform
:
translateY
(
-8px
)
rotate
(
-45deg
);
transform
:
translateY
(
-8px
)
rotate
(
-45deg
)}
.visually-hidden
{
display
:
none
;
visibility
:
hidden
}
.visually-visible
{
visibility
:
visible
!important
;
display
:
inherit
!important
}
ol
.default-list
{
display
:
block
;
list-style-type
:
decimal
;
margin
:
1em
0
1
em
;
padding-left
:
40px
}
ol
.default-list
>
li
{
display
:
list-item
;
list-style-type
:
inherit
!important
}
select
{
padding
:
.25rem
;
border
:
1px
solid
#dcdfe6
;
border-radius
:
5px
;
background
:
#fff
}
.pt-2
{
padding-top
:
2rem
!important
}
.mt-2
{
margin-top
:
.5rem
!important
}
.mb-3
{
margin-bottom
:
1.5rem
!important
}
.map-iframe
{
width
:
100%
;
height
:
300px
;
margin
:
0
auto
}
section
{
margin
:
0
20%
;
display
:
grid
;
grid-template-columns
:
repeat
(
2
,
1
fr
);
background
:
#fff
;
border-left
:
1px
solid
#dcdfe6
;
border-bottom
:
1px
solid
#dcdfe6
;
border-right
:
1px
solid
#dcdfe6
;
border-top-color
:
#dcdfe6
;
-webkit-box-sizing
:
border-box
;
box-sizing
:
border-box
}
section
.left-column
{
padding
:
1rem
.5rem
}
section
.left-column
,
section
.right-column
{
width
:
100%
;
height
:
100%
}
.flex-column
{
display
:
-webkit-box
;
display
:
-ms-flexbox
;
display
:
flex
;
-webkit-box-orient
:
vertical
;
-webkit-box-direction
:
normal
;
-ms-flex-flow
:
column
wrap
;
flex-flow
:
column
wrap
;
margin
:
0
20%
;
padding
:
1rem
0
}
.flex-column
h2
{
padding
:
0
.5rem
}
.right-column
.banner
{
display
:
-webkit-box
;
display
:
-ms-flexbox
;
display
:
flex
;
-webkit-box-align
:
center
;
-ms-flex-align
:
center
;
align-items
:
center
;
-webkit-box-pack
:
center
;
-ms-flex-pack
:
center
;
justify-content
:
center
;
width
:
100%
;
height
:
100%
}
.description
{
padding
:
.5rem
0
;
text-align
:
justify
}
.btn
{
padding
:
.5rem
1rem
;
border-radius
:
5px
}
.btn-default
{
color
:
#fff
;
background-color
:
#303133
}
.btn-default
:hover
{
color
:
#303133
;
background-color
:
#fff
;
border
:
1px
solid
#303133
}
.btn-primary
{
color
:
#fff
;
background-color
:
#444ce0
}
.btn-primary
:hover
{
color
:
#444ce0
;
background-color
:
#fff
;
border
:
1px
solid
#444ce0
}
.btn-success
{
color
:
#fff
;
background-color
:
#26de81
}
.btn-success
:hover
{
color
:
#26de81
;
background-color
:
#fff
;
border
:
1px
solid
#26de81
}
.btn-danger
{
color
:
#fff
;
background-color
:
#fc5c65
}
.btn-danger
:hover
{
color
:
#fc5c65
;
background-color
:
#fff
;
border
:
1px
solid
#fc5c65
}
.btn-warning
{
color
:
#fff
;
background-color
:
#fed330
}
.btn-warning
:hover
{
color
:
#fed330
;
background-color
:
#fff
;
border
:
1px
solid
#fed330
}
.hello-banner
{
width
:
100%
;
min-height
:
500px
;
max-height
:
500px
;
position
:
relative
;
margin
:
0
auto
}
.hello-banner__text
{
color
:
#fff
;
position
:
relative
;
width
:
100%
;
padding
:
3rem
20%
;
z-index
:
3
;
height
:
100%
}
.hello-banner__text
h1
{
font-size
:
2.66667rem
;
font-weight
:
700
}
.hello-banner__text
p
{
font-size
:
1.33333rem
}
.hello-banner__gradient
{
background
:
#000
;
opacity
:
.8
;
width
:
100%
;
height
:
100%
;
position
:
absolute
;
z-index
:
2
}
.hello-banner__img
{
-webkit-filter
:
blur
(
2px
);
filter
:
blur
(
2px
);
width
:
100%
;
height
:
100%
;
position
:
absolute
;
z-index
:
1
;
background-image
:
url(.//images/banner.jpg)
;
background-size
:
cover
}
.slider
{
position
:
relative
;
overflow
:
hidden
}
.slider__wrapper
{
display
:
-webkit-box
;
display
:
-ms-flexbox
;
display
:
flex
;
-webkit-transition
:
-webkit-transform
.6s
ease
;
transition
:
-webkit-transform
.6s
ease
;
-o-transition
:
transform
.6s
ease
;
transition
:
transform
.6s
ease
;
transition
:
transform
.6s
ease
,
-webkit-transform
.6s
ease
}
.slider__item
{
-webkit-box-flex
:
0
;
-ms-flex
:
0
0
25%
;
flex
:
0
0
25%
;
max-width
:
25%
}
.slider__control
{
position
:
absolute
;
top
:
50%
;
display
:
-webkit-box
;
display
:
-ms-flexbox
;
display
:
flex
;
-webkit-box-align
:
center
;
-ms-flex-align
:
center
;
align-items
:
center
;
-webkit-box-pack
:
center
;
-ms-flex-pack
:
center
;
justify-content
:
center
;
width
:
40px
;
color
:
#fff
;
text-align
:
center
;
opacity
:
.5
;
height
:
50px
;
-webkit-transform
:
translateY
(
-50%
);
-ms-transform
:
translateY
(
-50%
);
transform
:
translateY
(
-50%
);
background
:
rgba
(
0
,
0
,
0
,
.5
);
z-index
:
10
}
.slider__control
:focus
,
.slider__control
:hover
{
color
:
#fff
;
text-decoration
:
none
;
outline
:
0
;
opacity
:
.9
}
.slider__control_left
{
left
:
0
}
.slider__control_right
{
right
:
0
}
.slider__control
:before
{
content
:
""
;
display
:
inline-block
;
width
:
20px
;
height
:
20px
;
background
:
rgba
(
0
,
0
,
0
,
0
)
no-repeat
50%
;
background-size
:
100%
100%
}
.slider__control_left
:before
{
background-image
:
url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23fff' viewBox='0 0 8 8'%3E%3Cpath d='M5.25 0l-4 4 4 4 1.5-1.5-2.5-2.5 2.5-2.5-1.5-1.5z'/%3E%3C/svg%3E")
}
.slider__control_right
:before
{
background-image
:
url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23fff' viewBox='0 0 8 8'%3E%3Cpath d='M2.75 0l-1.5 1.5 2.5 2.5-2.5 2.5 1.5 1.5 4-4-4-4z'/%3E%3C/svg%3E")
}
.slider__item
.card
{
display
:
-webkit-box
;
display
:
-ms-flexbox
;
display
:
flex
;
-webkit-box-orient
:
vertical
;
-webkit-box-direction
:
normal
;
-ms-flex-direction
:
column
;
flex-direction
:
column
;
-webkit-box-pack
:
end
;
-ms-flex-pack
:
end
;
justify-content
:
flex-end
;
padding
:
0
;
width
:
100%
;
height
:
300px
;
text-align
:
center
;
background
:
#fff
;
color
:
#fff
;
border
:
1px
solid
#d7d7d7
;
border-radius
:
5px
;
position
:
relative
;
-webkit-box-sizing
:
border-box
;
box-sizing
:
border-box
}
.slider__item
.card
.card__body
.card__image
,
.slider__item
.card
.card__body
.card__image
img
{
z-index
:
1
;
position
:
absolute
;
top
:
0
;
left
:
0
;
width
:
100%
;
height
:
100%
;
border-radius
:
5px
}
.slider__item
.card
.card__body
.card__overlay
{
background
:
#000
;
opacity
:
.5
;
width
:
100%
;
height
:
100%
;
position
:
absolute
;
top
:
0
;
left
:
0
;
z-index
:
2
;
border-radius
:
5px
}
.slider__item
.card
.card__body
{
padding
:
.5rem
1rem
;
display
:
-webkit-box
;
display
:
-ms-flexbox
;
display
:
flex
;
-webkit-box-orient
:
vertical
;
-webkit-box-direction
:
normal
;
-ms-flex-direction
:
column
;
flex-direction
:
column
}
.slider__item
.card
.card__body
.card__heading
,
.slider__item
.card
.card__body
.card__text
{
z-index
:
3
}
.slider
:focus
,
.slider__control
:focus
,
a
:focus
{
outline
:
3px
solid
#529dec
}
.card
{
display
:
-webkit-box
;
display
:
-ms-flexbox
;
display
:
flex
;
-webkit-box-orient
:
vertical
;
-webkit-box-direction
:
normal
;
-ms-flex-direction
:
column
;
flex-direction
:
column
;
-webkit-box-pack
:
end
;
-ms-flex-pack
:
end
;
justify-content
:
flex-end
;
padding
:
0
;
text-align
:
center
;
background
:
#fff
;
color
:
#fff
;
border
:
1px
solid
#d7d7d7
;
border-radius
:
5px
;
position
:
relative
;
-webkit-box-sizing
:
border-box
;
box-sizing
:
border-box
;
margin
:
.1rem
}
.card
,
.card__image
,
.card__image
img
{
width
:
300px
;
height
:
300px
}
.card__image
,
.card__image
img
{
z-index
:
1
}
.card__image
,
.card__image
img
,
.card__overlay
{
position
:
absolute
;
top
:
0
;
left
:
0
;
-webkit-box-sizing
:
border-box
;
box-sizing
:
border-box
;
border-radius
:
5px
}
.card__overlay
{
background
:
#000
;
opacity
:
.7
;
width
:
300px
;
height
:
300px
;
z-index
:
2
}
.card__body
{
padding
:
.5rem
1rem
;
display
:
-webkit-box
;
display
:
-ms-flexbox
;
display
:
flex
;
-webkit-box-orient
:
vertical
;
-webkit-box-direction
:
normal
;
-ms-flex-direction
:
column
;
flex-direction
:
column
}
.card__heading
,
.card__text
{
z-index
:
3
}
.card__text
{
text-align
:
center
}
.card__heading--animated
,
.card__text--animated
{
z-index
:
3
}
.card__text--animated
{
font-size
:
1
rem
;
-webkit-transform
:
translateY
(
10%
);
-ms-transform
:
translateY
(
10%
);
transform
:
translateY
(
10%
);
position
:
absolute
;
visibility
:
hidden
}
.card
:hover
.card__heading--animated
,
.card
:hover
.card__text--animated
{
-webkit-transition
:
.3s
ease
;
-o-transition
:
.3s
ease
;
transition
:
.3s
ease
}
.card
:hover
.card__text--animated
{
-webkit-transform
:
translateY
(
-10%
);
-ms-transform
:
translateY
(
-10%
);
transform
:
translateY
(
-10%
);
position
:
static
;
margin-top
:
.75rem
;
visibility
:
visible
}
.card-deck
{
display
:
grid
;
grid-template-columns
:
repeat
(
3
,
auto
);
margin
:
auto
;
padding
:
1rem
.5rem
}
@media
screen
and
(
max-width
:
1281px
){
html
{
font-size
:
16px
}
.card-deck
{
grid-template-columns
:
repeat
(
2
,
auto
)}
.card-deck
.card
,
.card-deck
.card__image
,
.card-deck
.card__image
img
,
.card-deck
.card__overlay
{
width
:
350px
;
height
:
350px
}}
@media
screen
and
(
max-width
:
769px
){
html
{
font-size
:
15px
}
.container
{
max-width
:
481px
}}
@media
screen
and
(
max-width
:
481px
){
html
{
font-size
:
14px
}
.container
{
max-width
:
321px
}
.slider
,
.slider__item
{
width
:
100%
;
max-width
:
481px
}
.slider__item
{
-webkit-box-flex
:
0
;
-ms-flex
:
0
0
100%
;
flex
:
0
0
100%
}
.card-deck
{
grid-template-columns
:
repeat
(
1
,
auto
);
margin
:
auto
}}
@media
screen
and
(
max-width
:
1025px
){
.container
{
max-width
:
769px
}
.menu-right
>
li
,
menu
#menu
{
display
:
none
;
visibility
:
hidden
}
menu
#menu
{
border-top
:
1px
solid
#dcdfe6
;
border-bottom
:
1px
solid
#dcdfe6
;
-webkit-box-orient
:
vertical
;
-webkit-box-direction
:
normal
;
-ms-flex-flow
:
column
wrap
;
flex-flow
:
column
wrap
;
width
:
100%
;
text-align
:
center
;
z-index
:
4
;
position
:
-webkit-sticky
;
position
:
sticky
;
background
:
#fff
;
top
:
76px
}
menu
#menu
>
a
{
display
:
-webkit-box
;
display
:
-ms-flexbox
;
display
:
flex
;
width
:
100%
;
border
:
inherit
;
height
:
40px
}
menu
#menu
>
a
>
span
{
width
:
inherit
;
text-align
:
center
;
line-height
:
2.22222rem
}
section
{
display
:
-webkit-box
;
display
:
-ms-flexbox
;
display
:
flex
;
-webkit-box-orient
:
vertical
;
-webkit-box-direction
:
normal
;
-ms-flex-flow
:
column
wrap
;
flex-flow
:
column
wrap
;
margin
:
0
}
section
.left-column
{
-webkit-box-ordinal-group
:
2
;
-ms-flex-order
:
1
;
order
:
1
}
.banner
,
.right-column
{
max-height
:
-webkit-min-content
;
max-height
:
-moz-min-content
;
max-height
:
min-content
}
nav
{
padding
:
.5rem
}
section
.card-deck
,
section
.flex-column
{
margin
:
0
}
.hello-banner__text
{
padding
:
3rem
1rem
}
.flex-column
{
margin
:
0
}}
@media
screen
and
(
min-width
:
1025px
){
.menu-button
,
menu
#menu
{
display
:
none
;
visibility
:
hidden
}}
@media
(
min-width
:
1025px
)
and
(
max-width
:
1281px
){
section
,
section
.flex-column
{
margin
:
0
10%
}
nav
{
padding
:
.5rem
10%
}
.hello-banner__text
{
padding
:
3rem
10%
}}
@media
screen
and
(
max-width
:
641px
){
section
.card-deck
{
margin
:
0
}
section
.card-deck
.card-group
{
-webkit-box-orient
:
vertical
;
-webkit-box-direction
:
normal
;
-ms-flex-flow
:
column
wrap
;
flex-flow
:
column
wrap
}
.card-deck
.card
,
.card-deck
.card__image
,
.card-deck
.card__image
img
,
.card-deck
.card__overlay
{
width
:
280px
;
height
:
280px
}}
@media
(
min-width
:
1281px
)
and
(
max-width
:
1537px
){
.hello-banner__text
{
padding
:
3rem
5%
}}
@media
screen
and
(
min-width
:
1537px
){
.hello-banner__text
h1
{
font-size
:
2.61111rem
}
.hello-banner__text
p
{
font-size
:
1.22222rem
}}
@media
(
min-width
:
769px
)
and
(
max-width
:
1025px
){
.hello-banner__text
h1
{
font-size
:
2.33333rem
}
.hello-banner__text
p
{
font-size
:
1.16667rem
}
.slider
{
width
:
100%
;
max-width
:
1025px
}
.slider__item
{
width
:
33.33333%
;
max-width
:
341.66667px
;
-webkit-box-flex
:
0
;
-ms-flex
:
0
0
33.33333%
;
flex
:
0
0
33.33333%
}}
@media
(
min-width
:
481px
)
and
(
max-width
:
641px
){
.hello-banner__text
h1
{
font-size
:
2.22222rem
}
.hello-banner__text
p
{
font-size
:
1.11111rem
}}
@media
(
min-width
:
321px
)
and
(
max-width
:
481px
){
.hello-banner__text
h1
{
font-size
:
1.77778rem
}
.hello-banner__text
p
{
font-size
:
1rem
}}
@media
screen
and
(
max-width
:
321px
){
.hello-banner__text
h1
{
font-size
:
1.44444rem
}
.hello-banner__text
p
{
font-size
:
.77778rem
}}
@media
(
min-width
:
481px
)
and
(
max-width
:
769px
){
.slider
{
width
:
100%
;
max-width
:
769px
}
.slider__item
{
width
:
50%
;
max-width
:
384.5px
;
-webkit-box-flex
:
0
;
-ms-flex
:
0
0
50%
;
flex
:
0
0
50%
}}
Write
Preview
Markdown
is supported
0%
Try again
or
attach a new file
Attach a file
Cancel
You are about to add
0
people
to the discussion. Proceed with caution.
Finish editing this message first!
Cancel
Please
register
or
sign in
to comment
