Skip to content
Projects
Groups
Snippets
Help
Loading...
Help
Submit feedback
Contribute to GitLab
Sign in
Toggle navigation
vision-hugo
Project
Project
Details
Activity
Releases
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
Wiki
Wiki
Snippets
Snippets
Members
Members
Collapse sidebar
Close sidebar
Activity
Graph
Charts
Create a new issue
Jobs
Commits
Issue Boards
Open sidebar
diesys
vision-hugo
Commits
7c014338
Commit
7c014338
authored
Aug 25, 2017
by
diesys
🎈
Browse files
Options
Browse Files
Download
Email Patches
Plain Diff
working change language button
parent
aa0b6b3f
Changes
3
Hide whitespace changes
Inline
Side-by-side
Showing
3 changed files
with
20 additions
and
34 deletions
+20
-34
modals_senzaparole.html
layouts/partials/modals_senzaparole.html
+3
-22
vision.css
static/css/vision.css
+16
-11
vision.min.css
static/css/vision.min.css
+1
-1
No files found.
layouts/partials/modals_senzaparole.html
View file @
7c014338
...
...
@@ -15,29 +15,10 @@
<h2>
{{ .title | markdownify }}
</h2>
<!-- <p class="item-intro text-muted">{{ .subtitle | markdownify }}</p> -->
<script>
function
changeLang
()
{
desc_it
=
document
.
getElementById
(
"desc_it"
);
desc_en
=
document
.
getElementById
(
"desc_en"
);
lan_sel
=
document
.
getElementById
(
"lang_select"
);
<div
id=
"lang_select"
onclick=
"toggleLang()"
></div>
if
(
desc_it
.
style
.
display
==
"none"
)
{
desc_it
.
style
.
display
=
"block"
;
desc_en
.
style
.
display
=
"none"
;
lan_sel
.
style
.
backgroundImage
=
'url(../img/flagit.png)'
;
}
else
{
desc_it
.
style
.
display
=
"none"
;
desc_en
.
style
.
display
=
"block"
;
lan_sel
.
style
.
backgroundImage
=
'url(../img/flaguk.png)'
;
}
}
</script>
<div
id=
"lang_select"
onclick=
"changeLang()"
></div>
<p
class=
"desc"
id=
"desc_en"
>
{{ .description }}
</p>
<p
class=
"desc"
id=
"desc_it"
>
{{ .descriptionIT }}
</p>
<p
class=
"desc_en"
id=
"desc_en"
>
{{ .description }}
</p>
<p
class=
"desc_it"
id=
"desc_it"
>
{{ .descriptionIT }}
</p>
{{ $url := printf "img/senzaparole/%s" .img }}
<div
class=
"modal-img-frame"
>
<img
class=
"img-responsive img-centered"
src=
"{{ $url | absURL }}"
alt=
""
>
...
...
static/css/vision.css
View file @
7c014338
...
...
@@ -568,32 +568,37 @@ section h3.section-subheading {
.portfolio-modal
.modal-content
h2
{
animation
:
appearSoftFromTop
.6s
;
}
.
senzaparole
#
desc_it
{
.desc_it
{
display
:
block
;
}
.
senzaparole
#
desc_en
{
.desc_en
{
display
:
none
;
}
.senzaparole
#lang_select
{
#lang_select
{
height
:
24px
;
width
:
24px
;
background-image
:
url("../img/flag
it
.png")
;
background-image
:
url("../img/flag
uk
.png")
;
background-size
:
cover
;
background-color
:
transparent
;
content
:
''
;
text-decoration
:
none
;
border-radius
:
15px
;
position
:
absolute
;
right
:
2px
;
top
:
16px
;
position
:
fixed
;
right
:
0
;
margin
:
22px
;
top
:
46px
;
border
:
none
;
box-shadow
:
0
2px
10px
-3px
rgba
(
0
,
0
,
0
,
0.6
);
transition
:
all
.3s
;
cursor
:
pointer
;
display
:
none
;
/*display: none;*/
}
.senzaparole
#lang_select
:hover
{
#lang_select
:hover
{
box-shadow
:
0
2px
8px
-1px
rgba
(
0
,
0
,
0
,
0.3
);
transform
:
translateY
(
2px
);
}
.senzaparole
#lang_select
:active
{
#lang_select
:active
{
transform
:
translateY
(
5px
);
}
.portfolio-modal
.modal-content
img
{
...
...
static/css/vision.min.css
View file @
7c014338
a
,
a
:hover
,
a
:active
,
a
:focus
{
color
:
#00a66f
;
transition
:
all
.8s
.1s
;
text-shadow
:
0
0
2px
rgba
(
76
,
237
,
184
,
.8
)}
a
:hover
,
a
:active
,
a
:focus
{
transition
:
all
.4s
;
text-shadow
:
0
0
10px
#4cedb8
}
.fa
{
text-shadow
:
0
0
4px
rgba
(
0
,
0
,
0
,
.35
)}
::selection
{
background-color
:
#4cedb8
;
color
:
#111
}
@media
(
min-width
:
768px
){
section
{
padding
:
100px
0
}}
section
.bg-darkest-gray
{
background-image
:
url(../img/noise_dark.png)
}
.glow
{
position
:
absolute
;
height
:
1px
;
width
:
1px
;
border-radius
:
30px
;
background
:
transparent
}
@keyframes
glow
{
0
%,
100
%
{
box-shadow
:
0
1px
0
0
#4cedb8
}
10
%
{
box-shadow
:
0
1px
30px
8px
#4cedb8
}}
@keyframes
slideFromTop
{
0
%
{
transform
:
translateY
(
-200%
)}
100
%
{
transform
:
translateY
(
0
)}}
@keyframes
appearFromTop
{
0
%
{
transform
:
translateY
(
-400%
);
opacity
:
0
}
100
%
{
transform
:
translateY
(
0
);
opacity
:
1
}}
@keyframes
appearSoftFromTop
{
0
%
{
transform
:
translateY
(
-10%
);
opacity
:
0
}
100
%
{
transform
:
translateY
(
0
);
opacity
:
1
}}
@keyframes
appearFromLeft
{
0
%
{
transform
:
translateX
(
-400%
);
opacity
:
0
}
100
%
{
transform
:
translateX
(
0
);
opacity
:
1
}}
@keyframes
appearFromRight
{
0
%
{
transform
:
translateX
(
400%
);
opacity
:
0
}
100
%
{
transform
:
translateX
(
0
);
opacity
:
1
}}
@keyframes
appearFromBottom
{
0
%
{
transform
:
translateY
(
400%
);
opacity
:
0
}
100
%
{
transform
:
translateY
(
0
);
opacity
:
1
}}
@keyframes
slideFromRight
{
0
%
{
transform
:
translateX
(
150%
)}
100
%
{
transform
:
translateX
(
0
)}}
@keyframes
grow
{
0
%
{
transform
:
scale
(
.4
)}
100
%
{
transform
:
scale
(
1
)}}
.navbar-default
{
background
:
linear-gradient
(
rgba
(
0
,
0
,
0
,
1
),
rgba
(
0
,
0
,
0
,
.5
),
rgba
(
0
,
0
,
0
,
0
));
transition
:
all
.2s
;
border
:
0
;
animation
:
slideFromTop
.6s
;
top
:
-1px
}
.navbar-default
.nav
li
a
{
transition
:
all
.8s
.1s
}
.navbar-default
.nav
li
a
:hover
,
.navbar-default
.nav
li
a
:focus
{
transition
:
all
.4s
;
color
:
#a8ffe2
}
.navbar-brand
>
img
{
transition
:
all
1s
.1s
;
border-radius
:
100%
}
.navbar-brand
>
img
:hover
,
.navbar-brand
>
img
:focus
{
transition
:
all
.3s
;
box-shadow
:
0
0
10px
#4cedb8
}
.navbar-default
.navbar-nav
>
.active
>
a
,
.navbar-default
.navbar-nav
>
.active
>
a
:hover
,
.navbar-default
.navbar-nav
>
.active
>
a
:active
,
.navbar-default
.navbar-nav
>
.active
>
a
:hover
,
.navbar-default
.navbar-nav
>
.active
>
a
:focus
{
color
:
#fff
;
transition
:
all
.4s
;
text-shadow
:
0
0
10px
#4cedb8
;
background-color
:
transparent
}
@media
(
min-width
:
768px
){
.navbar-default.navbar-shrink
{
padding
:
0
0
10px
0
;
box-shadow
:
0
1px
30px
rgba
(
0
,
0
,
0
,
0.5
);
background-color
:
transparent
;
background
:
linear-gradient
(
rgba
(
0
,
0
,
0
,
1
),
rgba
(
0
,
0
,
0
,
.7
))}}
@media
screen
and
(
max-width
:
767px
){
.navbar-default
{
background
:
linear-gradient
(
rgba
(
0
,
0
,
0
,
1
),
rgba
(
0
,
0
,
0
,
.8
));
padding-bottom
:
10px
;
box-shadow
:
0
1px
30px
rgba
(
0
,
0
,
0
,
0.5
);
border-top
:
0
}
.navbar-fixed-bottom
,
.navbar-fixed-top
{
right
:
-1px
;
left
:
-1px
;
top
:
-1px
}
.navbar-toggle
{
margin-top
:
10px
;
margin-bottom
:
6px
}}
.navbar-default
.navbar-toggle
{
border
:
0
;
background-color
:
transparent
;
transition
:
all
.5s
.1s
}
.navbar-default
.navbar-toggle
:hover
,
.navbar-default
.navbar-toggle
:active
,
.navbar-default
.navbar-toggle
:focus
{
background-color
:
rgba
(
250
,
250
,
250
,
0.1
);
transition
:
all
.3s
}
.navbar-default
.navbar-collapse
{
border
:
0
;
padding-left
:
15px
}
.navbar-default
.nav
li
a
{
padding-left
:
20px
}
.navbar-default
.nav
li
{
text-align
:
center
}
.container-fluid
>
.navbar-collapse
,
.container-fluid
>
.navbar-header
,
.container
>
.navbar-collapse
,
.container
>
.navbar-header
{
margin-top
:
10px
;
padding-left
:
15px
;
border
:
0
}
header
{
box-shadow
:
0
-15px
40px
-16px
#000
inset
;
background-color
:
#000
;
transition
:
all
.5s
}
header
.intro-text
{
padding-top
:
27%
;
padding-bottom
:
50px
}
header
.intro-text
.intro-heading
{
font-size
:
70px
;
text-shadow
:
0
0
40px
rgba
(
0
,
0
,
0
,
.65
);
animation
:
appearFromLeft
1.2s
cubic-bezier
(
0
,
.46
,
.45
,
1.15
);
margin-bottom
:
15px
}
header
.intro-text
.intro-lead-in
{
text-shadow
:
0
1px
8px
rgba
(
0
,
0
,
0
,
.74
);
animation
:
appearFromRight
1.2s
cubic-bezier
(
0
,
.46
,
.45
,
1.15
);
font-size
:
22px
;
position
:
relative
;
margin-bottom
:
0
;
color
:
rgba
(
255
,
255
,
255
,
.9
);
transition
:
all
.3s
}
@media
screen
and
(
max-width
:
767px
){
header
.intro-text
{
padding-top
:
50%
;
padding-bottom
:
50px
}}
.btn
{
box-shadow
:
0
2px
10px
-4px
rgba
(
0
,
0
,
0
,
0.45
);
transition
:
all
.3s
;
color
:
#222
;
text-shadow
:
0
1px
2px
rgba
(
255
,
255
,
255
,
.7
);
background-color
:
#4cedb8
;
border-radius
:
4px
;
border
:
0
}
.btn
.fa
{
text-shadow
:
0
1px
2px
rgba
(
255
,
255
,
255
,
.7
)}
.btn
:hover
,
.btn
:active
,
.btn
:focus
{
color
:
#333
;
background-color
:
#73ffd1
;
box-shadow
:
0
2px
14px
-4px
rgba
(
0
,
0
,
0
,
0.5
)}
.btn
:active
{
transform-origin
:
50%
50%
;
transform
:
scale
(
.9
)}
.btn-xl
,
.btn-xl
:focus
{
box-shadow
:
0
2px
15px
rgba
(
0
,
0
,
0
,
0.45
);
padding
:
12px
24px
;
font-size
:
16px
;
animation
:
appearFromBottom
.8s
cubic-bezier
(
.07
,
.4
,
.67
,
1.09
);
margin-top
:
13%
}
.btn-xl
:hover
,
.btn-xl
:active
{
box-shadow
:
0
2px
5px
rgba
(
0
,
0
,
0
,
0.4
)}
section
h3
.section-subheading
{
text-align
:
justify
;
line-height
:
1.5em
;
padding
:
0
15px
;
margin
:
20px
30px
80px
30px
}
.timeline
>
li
.timeline-image
{
background-color
:
#bbb
;
color
:
#fff
;
border
:
0
}
.img-circle
{
border
:
1px
solid
rgba
(
0
,
0
,
0
,
0.4
);
box-shadow
:
0
2px
8px
-2px
rgba
(
0
,
0
,
0
,
0.5
)}
.timeline
>
li
.timeline-image
h4
{
margin-top
:
50%
;
transform
:
translateY
(
-50%
);
font-size
:
18pt
}
.timeline
:before
{
background-color
:
#fff
;
border-right
:
1px
solid
#ccc
}
#portfolio
.portfolio-item
,
#SenzaParole
.portfolio-item
{
right
:
0
;
margin
:
15px
;
box-shadow
:
0
3px
30px
-5px
rgba
(
0
,
0
,
0
,
1
);
padding
:
0
;
margin-left
:
15px
;
margin-right
:
15px
;
max-width
:
calc
(
50%
-
30px
);
transition
:
all
.3s
;
animation
:
grow
.4s
}
#portfolio
.portfolio-item
.portfolio-link
,
#SenzaParole
.portfolio-item
.portfolio-link
{
display
:
block
;
position
:
relative
;
margin
:
0
auto
;
max-width
:
400px
;
background
:
url('../img/texture.png')
;
background-color
:
#ccc
}
#portfolio
.portfolio-item
.portfolio-link
.portfolio-hover
,
#SenzaParole
.portfolio-item
.portfolio-link
.portfolio-hover
{
position
:
absolute
;
width
:
100%
;
height
:
100%
;
opacity
:
0
;
background-color
:
rgba
(
76
,
237
,
184
,
.6
);
-webkit-transition
:
all
ease
.5s
;
-moz-transition
:
all
ease
.5s
;
transition
:
all
ease
.5s
}
#portfolio
.portfolio-item
.portfolio-link
.portfolio-hover
:hover
,
#SenzaParole
.portfolio-item
.portfolio-link
.portfolio-hover
:hover
{
opacity
:
1
}
#portfolio
.portfolio-item
.portfolio-link
.portfolio-hover
.portfolio-hover-content
,
#SenzaParole
.portfolio-item
.portfolio-link
.portfolio-hover
.portfolio-hover-content
{
position
:
absolute
;
top
:
50%
;
width
:
100%
;
height
:
20px
;
margin-top
:
-12px
;
text-align
:
center
;
font-size
:
20px
;
color
:
#fff
}
#portfolio
.portfolio-item
.portfolio-link
.portfolio-hover
.portfolio-hover-content
i
,
#SenzaParole
.portfolio-item
.portfolio-link
.portfolio-hover
.portfolio-hover-content
i
{
margin-top
:
-12px
}
#portfolio
.portfolio-item
.portfolio-link
.portfolio-hover
.portfolio-hover-content
h
,
#SenzaParole
.portfolio-item
.portfolio-link
.portfolio-hover
.portfolio-hover-content
h3
,
#portfolio
.portfolio-item
.portfolio-link
.portfolio-hover
.portfolio-hover-content
h4
,
#SenzaParole
.portfolio-item
.portfolio-link
.portfolio-hover
.portfolio-hover-content
h4
{
margin
:
0
}
#portfolio
.portfolio-item
.portfolio-caption
,
#SenzaParole
.portfolio-item
.portfolio-caption
{
margin
:
0
auto
;
padding
:
25px
;
max-width
:
400px
;
text-align
:
center
;
background-color
:
#fff
;
border
:
1px
solid
rgba
(
0
,
0
,
0
,
.15
);
border-top
:
0
;
border-bottom
:
1px
solid
rgba
(
0
,
0
,
0
,
.2
)}
#portfolio
.portfolio-item
.portfolio-caption
h4
,
#SenzaParole
.portfolio-item
.portfolio-caption
h4
{
margin
:
0
;
text-transform
:
none
}
#portfolio
.portfolio-item
.portfolio-caption
p
,
#SenzaParole
.portfolio-item
.portfolio-caption
p
{
margin
:
0
;
font-family
:
"Droid Serif"
,
"Helvetica Neue"
,
Helvetica
,
Arial
,
sans-serif
;
font-size
:
16px
;
font-style
:
italic
}
#portfolio
*,
#SenzaParole
*
{
z-index
:
2
}
.senzaparole
p
,
.senzaparole
h2
{
font-family
:
"Droid Serif"
,
"Helvetica Neue"
,
Helvetica
,
Arial
,
sans-serif
;
text-transform
:
none
}
.senzaparole
h2
{
text-align
:
left
;
padding-left
:
10px
}
.senzaparole
p
{
text-align
:
justify
}
@media
(
min-width
:
992px
){
#portfolio
.col-md-4
,
#SenzaParole
.col-md-4
{
width
:
calc
(
33%
-
30px
)}}
@media
(
max-width
:
768px
){
#portfolio
.portfolio-item
,
#SenzaParole
.portfolio-item
{
left
:
50%
;
transform
:
translateX
(
-50%
);
margin-left
:
0
;
margin-right
:
0
;
margin-bottom
:
40px
;
max-width
:
80%
;
box-shadow
:
none
}
#portfolio
.portfolio-item
.portfolio-caption
,
#SenzaParole
.portfolio-item
.portfolio-caption
{
box-shadow
:
0
8px
25px
-6px
#000
}}
#portfolio_title
h2
,
#portfolio_title
h3
{
color
:
#fff
;
text-shadow
:
0
2px
4px
#101010
}
#close_btn
{
animation
:
slideFromRight
.4s
;
position
:
fixed
;
right
:
14px
;
top
:
13px
;
border-radius
:
100px
;
font-size
:
20px
;
background-color
:
rgba
(
0
,
0
,
0
,
.5
);
box-shadow
:
none
;
box-shadow
:
0
1px
15px
-2px
rgba
(
0
,
0
,
0
,
.5
);
transition
:
all
.5s
.1s
}
#close_btn
.fa-remove
:before
,
#close_btn
.fa-close
:before
,
.fa-times
:before
{
text-shadow
:
none
;
color
:
rgba
(
255
,
255
,
255
,
.9
)}
#close_btn
:hover
{
background-color
:
rgba
(
0
,
0
,
0
,
.5
);
color
:
#111
;
box-shadow
:
none
;
transition
:
all
.3s
}
.modal-body
{
top
:
-20px
;
margin
:
0
35px
25px
35px
}
.portfolio-modal
.modal-content
{
padding
:
40px
40px
;
background-color
:
#e9e9e9
;
background-image
:
url('../img/texture.png')
}
.img-centered
{
max-width
:
100%
}
.portfolio-modal
.modal-content
p
{
line-height
:
1.6em
;
animation
:
appearSoftFromTop
.6s
}
.portfolio-modal
.modal-content
h2
{
animation
:
appearSoftFromTop
.6s
}
.senzaparole
#desc_en
{
display
:
none
}
.senzaparole
#lang_select
{
height
:
24px
;
width
:
24px
;
background-image
:
url("../img/flagit.png")
;
background-size
:
cover
;
border-radius
:
15px
;
position
:
absolute
;
right
:
2px
;
top
:
16px
;
box-shadow
:
0
2px
10px
-3px
rgba
(
0
,
0
,
0
,
0.6
);
transition
:
all
.3s
;
cursor
:
pointer
;
display
:
none
}
.senzaparole
#lang_select
:hover
{
box-shadow
:
0
2px
8px
-1px
rgba
(
0
,
0
,
0
,
0.3
);
transform
:
translateY
(
2px
)}
.senzaparole
#lang_select
:active
{
transform
:
translateY
(
5px
)}
.portfolio-modal
.modal-content
img
{
box-shadow
:
0
2px
10px
-2px
rgba
(
0
,
0
,
0
,
0.35
);
margin
:
0
;
margin-left
:
0
;
margin-top
:
0
;
margin-right
:
0
;
margin-bottom
:
0
}
.portfolio-modal
.modal-content
.modal-img-frame
{
box-shadow
:
0
8px
35px
-8px
rgba
(
0
,
0
,
0
,
0.4
);
padding
:
50px
;
margin
:
40px
10px
;
background-color
:
#fff
;
transition
:
all
.4s
}
@media
(
max-width
:
767px
){
.modal-body
{
top
:
-20px
;
padding
:
0
;
margin
:
0
}
.portfolio-modal
.modal-content
{
padding
:
40px
5px
}
.portfolio-modal
.modal-content
img
{
margin
:
0
;
margin-left
:
0
;
margin-right
:
0
;
margin-top
:
0
;
margin-bottom
:
0
;
box-shadow
:
0
2px
10px
-3px
rgba
(
0
,
0
,
0
,
0.3
)}
.portfolio-modal
.modal-content
.modal-img-frame
{
padding
:
20px
}
.portfolio-modal
.modal-content
h2
{
margin
:
15px
;
margin-top
:
30px
;
padding-left
:
20px
}
.portfolio-modal
.modal-content
p
{
margin
:
10px
24px
;
line-height
:
1.5em
}}
ul
.social-buttons
li
a
{
box-shadow
:
0
2px
8px
-2px
rgba
(
0
,
0
,
0
,
0.5
)}
ul
.social-buttons
li
a
:hover
,
ul
.social-buttons
li
a
:focus
,
ul
.social-buttons
li
a
:active
{
background-color
:
#00a66f
}
footer
div
#credits
{
position
:
relative
;
bottom
:
0
;
min-width
:
50%
;
left
:
50%
;
transform
:
translateX
(
-50%
)}
footer
div
#credits
ul
li
{
display
:
inline-block
}
\ No newline at end of file
a
,
a
:hover
,
a
:active
,
a
:focus
{
color
:
#00a66f
;
transition
:
all
.8s
.1s
;
text-shadow
:
0
0
2px
rgba
(
76
,
237
,
184
,
.8
)}
a
:hover
,
a
:active
,
a
:focus
{
transition
:
all
.4s
;
text-shadow
:
0
0
10px
#4cedb8
}
.fa
{
text-shadow
:
0
0
4px
rgba
(
0
,
0
,
0
,
.35
)}
::selection
{
background-color
:
#4cedb8
;
color
:
#111
}
@media
(
min-width
:
768px
){
section
{
padding
:
100px
0
}}
section
.bg-darkest-gray
{
background-image
:
url(../img/noise_dark.png)
}
.glow
{
position
:
absolute
;
height
:
1px
;
width
:
1px
;
border-radius
:
30px
;
background
:
transparent
}
@keyframes
glow
{
0
%,
100
%
{
box-shadow
:
0
1px
0
0
#4cedb8
}
10
%
{
box-shadow
:
0
1px
30px
8px
#4cedb8
}}
@keyframes
slideFromTop
{
0
%
{
transform
:
translateY
(
-200%
)}
100
%
{
transform
:
translateY
(
0
)}}
@keyframes
appearFromTop
{
0
%
{
transform
:
translateY
(
-400%
);
opacity
:
0
}
100
%
{
transform
:
translateY
(
0
);
opacity
:
1
}}
@keyframes
appearSoftFromTop
{
0
%
{
transform
:
translateY
(
-10%
);
opacity
:
0
}
100
%
{
transform
:
translateY
(
0
);
opacity
:
1
}}
@keyframes
appearFromLeft
{
0
%
{
transform
:
translateX
(
-400%
);
opacity
:
0
}
100
%
{
transform
:
translateX
(
0
);
opacity
:
1
}}
@keyframes
appearFromRight
{
0
%
{
transform
:
translateX
(
400%
);
opacity
:
0
}
100
%
{
transform
:
translateX
(
0
);
opacity
:
1
}}
@keyframes
appearFromBottom
{
0
%
{
transform
:
translateY
(
400%
);
opacity
:
0
}
100
%
{
transform
:
translateY
(
0
);
opacity
:
1
}}
@keyframes
slideFromRight
{
0
%
{
transform
:
translateX
(
150%
)}
100
%
{
transform
:
translateX
(
0
)}}
@keyframes
grow
{
0
%
{
transform
:
scale
(
.4
)}
100
%
{
transform
:
scale
(
1
)}}
.navbar-default
{
background
:
linear-gradient
(
rgba
(
0
,
0
,
0
,
1
),
rgba
(
0
,
0
,
0
,
.5
),
rgba
(
0
,
0
,
0
,
0
));
transition
:
all
.2s
;
border
:
0
;
animation
:
slideFromTop
.6s
;
top
:
-1px
}
.navbar-default
.nav
li
a
{
transition
:
all
.8s
.1s
}
.navbar-default
.nav
li
a
:hover
,
.navbar-default
.nav
li
a
:focus
{
transition
:
all
.4s
;
color
:
#a8ffe2
}
.navbar-brand
>
img
{
transition
:
all
1s
.1s
;
border-radius
:
100%
}
.navbar-brand
>
img
:hover
,
.navbar-brand
>
img
:focus
{
transition
:
all
.3s
;
box-shadow
:
0
0
10px
#4cedb8
}
.navbar-default
.navbar-nav
>
.active
>
a
,
.navbar-default
.navbar-nav
>
.active
>
a
:hover
,
.navbar-default
.navbar-nav
>
.active
>
a
:active
,
.navbar-default
.navbar-nav
>
.active
>
a
:hover
,
.navbar-default
.navbar-nav
>
.active
>
a
:focus
{
color
:
#fff
;
transition
:
all
.4s
;
text-shadow
:
0
0
10px
#4cedb8
;
background-color
:
transparent
}
@media
(
min-width
:
768px
){
.navbar-default.navbar-shrink
{
padding
:
0
0
10px
0
;
box-shadow
:
0
1px
30px
rgba
(
0
,
0
,
0
,
0.5
);
background-color
:
transparent
;
background
:
linear-gradient
(
rgba
(
0
,
0
,
0
,
1
),
rgba
(
0
,
0
,
0
,
.7
))}}
@media
screen
and
(
max-width
:
767px
){
.navbar-default
{
background
:
linear-gradient
(
rgba
(
0
,
0
,
0
,
1
),
rgba
(
0
,
0
,
0
,
.8
));
padding-bottom
:
10px
;
box-shadow
:
0
1px
30px
rgba
(
0
,
0
,
0
,
0.5
);
border-top
:
0
}
.navbar-fixed-bottom
,
.navbar-fixed-top
{
right
:
-1px
;
left
:
-1px
;
top
:
-1px
}
.navbar-toggle
{
margin-top
:
10px
;
margin-bottom
:
6px
}}
.navbar-default
.navbar-toggle
{
border
:
0
;
background-color
:
transparent
;
transition
:
all
.5s
.1s
}
.navbar-default
.navbar-toggle
:hover
,
.navbar-default
.navbar-toggle
:active
,
.navbar-default
.navbar-toggle
:focus
{
background-color
:
rgba
(
250
,
250
,
250
,
0.1
);
transition
:
all
.3s
}
.navbar-default
.navbar-collapse
{
border
:
0
;
padding-left
:
15px
}
.navbar-default
.nav
li
a
{
padding-left
:
20px
}
.navbar-default
.nav
li
{
text-align
:
center
}
.container-fluid
>
.navbar-collapse
,
.container-fluid
>
.navbar-header
,
.container
>
.navbar-collapse
,
.container
>
.navbar-header
{
margin-top
:
10px
;
padding-left
:
15px
;
border
:
0
}
header
{
box-shadow
:
0
-15px
40px
-16px
#000
inset
;
background-color
:
#000
;
transition
:
all
.5s
}
header
.intro-text
{
padding-top
:
27%
;
padding-bottom
:
50px
}
header
.intro-text
.intro-heading
{
font-size
:
70px
;
text-shadow
:
0
0
40px
rgba
(
0
,
0
,
0
,
.65
);
animation
:
appearFromLeft
1.2s
cubic-bezier
(
0
,
.46
,
.45
,
1.15
);
margin-bottom
:
15px
}
header
.intro-text
.intro-lead-in
{
text-shadow
:
0
1px
8px
rgba
(
0
,
0
,
0
,
.74
);
animation
:
appearFromRight
1.2s
cubic-bezier
(
0
,
.46
,
.45
,
1.15
);
font-size
:
22px
;
position
:
relative
;
margin-bottom
:
0
;
color
:
rgba
(
255
,
255
,
255
,
.9
);
transition
:
all
.3s
}
@media
screen
and
(
max-width
:
767px
){
header
.intro-text
{
padding-top
:
50%
;
padding-bottom
:
50px
}}
.btn
{
box-shadow
:
0
2px
10px
-4px
rgba
(
0
,
0
,
0
,
0.45
);
transition
:
all
.3s
;
color
:
#222
;
text-shadow
:
0
1px
2px
rgba
(
255
,
255
,
255
,
.7
);
background-color
:
#4cedb8
;
border-radius
:
4px
;
border
:
0
}
.btn
.fa
{
text-shadow
:
0
1px
2px
rgba
(
255
,
255
,
255
,
.7
)}
.btn
:hover
,
.btn
:active
,
.btn
:focus
{
color
:
#333
;
background-color
:
#73ffd1
;
box-shadow
:
0
2px
14px
-4px
rgba
(
0
,
0
,
0
,
0.5
)}
.btn
:active
{
transform-origin
:
50%
50%
;
transform
:
scale
(
.9
)}
.btn-xl
,
.btn-xl
:focus
{
box-shadow
:
0
2px
15px
rgba
(
0
,
0
,
0
,
0.45
);
padding
:
12px
24px
;
font-size
:
16px
;
animation
:
appearFromBottom
.8s
cubic-bezier
(
.07
,
.4
,
.67
,
1.09
);
margin-top
:
13%
}
.btn-xl
:hover
,
.btn-xl
:active
{
box-shadow
:
0
2px
5px
rgba
(
0
,
0
,
0
,
0.4
)}
section
h3
.section-subheading
{
text-align
:
justify
;
line-height
:
1.5em
;
padding
:
0
15px
;
margin
:
20px
30px
80px
30px
}
.timeline
>
li
.timeline-image
{
background-color
:
#bbb
;
color
:
#fff
;
border
:
0
}
.img-circle
{
border
:
1px
solid
rgba
(
0
,
0
,
0
,
0.4
);
box-shadow
:
0
2px
8px
-2px
rgba
(
0
,
0
,
0
,
0.5
)}
.timeline
>
li
.timeline-image
h4
{
margin-top
:
50%
;
transform
:
translateY
(
-50%
);
font-size
:
18pt
}
.timeline
:before
{
background-color
:
#fff
;
border-right
:
1px
solid
#ccc
}
#portfolio
.portfolio-item
,
#SenzaParole
.portfolio-item
{
right
:
0
;
margin
:
15px
;
box-shadow
:
0
3px
30px
-5px
rgba
(
0
,
0
,
0
,
1
);
padding
:
0
;
margin-left
:
15px
;
margin-right
:
15px
;
max-width
:
calc
(
50%
-
30px
);
transition
:
all
.3s
;
animation
:
grow
.4s
}
#portfolio
.portfolio-item
.portfolio-link
,
#SenzaParole
.portfolio-item
.portfolio-link
{
display
:
block
;
position
:
relative
;
margin
:
0
auto
;
max-width
:
400px
;
background
:
url('../img/texture.png')
;
background-color
:
#ccc
}
#portfolio
.portfolio-item
.portfolio-link
.portfolio-hover
,
#SenzaParole
.portfolio-item
.portfolio-link
.portfolio-hover
{
position
:
absolute
;
width
:
100%
;
height
:
100%
;
opacity
:
0
;
background-color
:
rgba
(
76
,
237
,
184
,
.6
);
-webkit-transition
:
all
ease
.5s
;
-moz-transition
:
all
ease
.5s
;
transition
:
all
ease
.5s
}
#portfolio
.portfolio-item
.portfolio-link
.portfolio-hover
:hover
,
#SenzaParole
.portfolio-item
.portfolio-link
.portfolio-hover
:hover
{
opacity
:
1
}
#portfolio
.portfolio-item
.portfolio-link
.portfolio-hover
.portfolio-hover-content
,
#SenzaParole
.portfolio-item
.portfolio-link
.portfolio-hover
.portfolio-hover-content
{
position
:
absolute
;
top
:
50%
;
width
:
100%
;
height
:
20px
;
margin-top
:
-12px
;
text-align
:
center
;
font-size
:
20px
;
color
:
#fff
}
#portfolio
.portfolio-item
.portfolio-link
.portfolio-hover
.portfolio-hover-content
i
,
#SenzaParole
.portfolio-item
.portfolio-link
.portfolio-hover
.portfolio-hover-content
i
{
margin-top
:
-12px
}
#portfolio
.portfolio-item
.portfolio-link
.portfolio-hover
.portfolio-hover-content
h
,
#SenzaParole
.portfolio-item
.portfolio-link
.portfolio-hover
.portfolio-hover-content
h3
,
#portfolio
.portfolio-item
.portfolio-link
.portfolio-hover
.portfolio-hover-content
h4
,
#SenzaParole
.portfolio-item
.portfolio-link
.portfolio-hover
.portfolio-hover-content
h4
{
margin
:
0
}
#portfolio
.portfolio-item
.portfolio-caption
,
#SenzaParole
.portfolio-item
.portfolio-caption
{
margin
:
0
auto
;
padding
:
25px
;
max-width
:
400px
;
text-align
:
center
;
background-color
:
#fff
;
border
:
1px
solid
rgba
(
0
,
0
,
0
,
.15
);
border-top
:
0
;
border-bottom
:
1px
solid
rgba
(
0
,
0
,
0
,
.2
)}
#portfolio
.portfolio-item
.portfolio-caption
h4
,
#SenzaParole
.portfolio-item
.portfolio-caption
h4
{
margin
:
0
;
text-transform
:
none
}
#portfolio
.portfolio-item
.portfolio-caption
p
,
#SenzaParole
.portfolio-item
.portfolio-caption
p
{
margin
:
0
;
font-family
:
"Droid Serif"
,
"Helvetica Neue"
,
Helvetica
,
Arial
,
sans-serif
;
font-size
:
16px
;
font-style
:
italic
}
#portfolio
*,
#SenzaParole
*
{
z-index
:
2
}
.senzaparole
p
,
.senzaparole
h2
{
font-family
:
"Droid Serif"
,
"Helvetica Neue"
,
Helvetica
,
Arial
,
sans-serif
;
text-transform
:
none
}
.senzaparole
h2
{
text-align
:
left
;
padding-left
:
10px
}
.senzaparole
p
{
text-align
:
justify
}
@media
(
min-width
:
992px
){
#portfolio
.col-md-4
,
#SenzaParole
.col-md-4
{
width
:
calc
(
33%
-
30px
)}}
@media
(
max-width
:
768px
){
#portfolio
.portfolio-item
,
#SenzaParole
.portfolio-item
{
left
:
50%
;
transform
:
translateX
(
-50%
);
margin-left
:
0
;
margin-right
:
0
;
margin-bottom
:
40px
;
max-width
:
80%
;
box-shadow
:
none
}
#portfolio
.portfolio-item
.portfolio-caption
,
#SenzaParole
.portfolio-item
.portfolio-caption
{
box-shadow
:
0
8px
25px
-6px
#000
}}
#portfolio_title
h2
,
#portfolio_title
h3
{
color
:
#fff
;
text-shadow
:
0
2px
4px
#101010
}
#close_btn
{
animation
:
slideFromRight
.4s
;
position
:
fixed
;
right
:
14px
;
top
:
13px
;
border-radius
:
100px
;
font-size
:
20px
;
background-color
:
rgba
(
0
,
0
,
0
,
.5
);
box-shadow
:
none
;
box-shadow
:
0
1px
15px
-2px
rgba
(
0
,
0
,
0
,
.5
);
transition
:
all
.5s
.1s
}
#close_btn
.fa-remove
:before
,
#close_btn
.fa-close
:before
,
.fa-times
:before
{
text-shadow
:
none
;
color
:
rgba
(
255
,
255
,
255
,
.9
)}
#close_btn
:hover
{
background-color
:
rgba
(
0
,
0
,
0
,
.5
);
color
:
#111
;
box-shadow
:
none
;
transition
:
all
.3s
}
.modal-body
{
top
:
-20px
;
margin
:
0
35px
25px
35px
}
.portfolio-modal
.modal-content
{
padding
:
40px
40px
;
background-color
:
#e9e9e9
;
background-image
:
url('../img/texture.png')
}
.img-centered
{
max-width
:
100%
}
.portfolio-modal
.modal-content
p
{
line-height
:
1.6em
;
animation
:
appearSoftFromTop
.6s
}
.portfolio-modal
.modal-content
h2
{
animation
:
appearSoftFromTop
.6s
}
.desc_it
{
display
:
block
}
.desc_en
{
display
:
none
}
#lang_select
{
height
:
24px
;
width
:
24px
;
background-image
:
url("../img/flaguk.png")
;
background-size
:
cover
;
background-color
:
transparent
;
content
:
''
;
text-decoration
:
none
;
border-radius
:
15px
;
position
:
fixed
;
right
:
0
;
margin
:
22px
;
top
:
46px
;
border
:
0
;
box-shadow
:
0
2px
10px
-3px
rgba
(
0
,
0
,
0
,
0.6
);
transition
:
all
.3s
;
cursor
:
pointer
}
#lang_select
:hover
{
box-shadow
:
0
2px
8px
-1px
rgba
(
0
,
0
,
0
,
0.3
);
transform
:
translateY
(
2px
)}
#lang_select
:active
{
transform
:
translateY
(
5px
)}
.portfolio-modal
.modal-content
img
{
box-shadow
:
0
2px
10px
-2px
rgba
(
0
,
0
,
0
,
0.35
);
margin
:
0
;
margin-left
:
0
;
margin-top
:
0
;
margin-right
:
0
;
margin-bottom
:
0
}
.portfolio-modal
.modal-content
.modal-img-frame
{
box-shadow
:
0
8px
35px
-8px
rgba
(
0
,
0
,
0
,
0.4
);
padding
:
50px
;
margin
:
40px
10px
;
background-color
:
#fff
;
transition
:
all
.4s
}
@media
(
max-width
:
767px
){
.modal-body
{
top
:
-20px
;
padding
:
0
;
margin
:
0
}
.portfolio-modal
.modal-content
{
padding
:
40px
5px
}
.portfolio-modal
.modal-content
img
{
margin
:
0
;
margin-left
:
0
;
margin-right
:
0
;
margin-top
:
0
;
margin-bottom
:
0
;
box-shadow
:
0
2px
10px
-3px
rgba
(
0
,
0
,
0
,
0.3
)}
.portfolio-modal
.modal-content
.modal-img-frame
{
padding
:
20px
}
.portfolio-modal
.modal-content
h2
{
margin
:
15px
;
margin-top
:
30px
;
padding-left
:
20px
}
.portfolio-modal
.modal-content
p
{
margin
:
10px
24px
;
line-height
:
1.5em
}}
ul
.social-buttons
li
a
{
box-shadow
:
0
2px
8px
-2px
rgba
(
0
,
0
,
0
,
0.5
)}
ul
.social-buttons
li
a
:hover
,
ul
.social-buttons
li
a
:focus
,
ul
.social-buttons
li
a
:active
{
background-color
:
#00a66f
}
footer
div
#credits
{
position
:
relative
;
bottom
:
0
;
min-width
:
50%
;
left
:
50%
;
transform
:
translateX
(
-50%
)}
footer
div
#credits
ul
li
{
display
:
inline-block
}
\ No newline at end of file
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
