.alert {
position: relative; padding: 1.2em 2em; font-size: 14px; line-height: 1.4; margin-bottom: 2em; border: 3px solid #FDF854;
}
.alert.success {
border-color: #8EE1A8;
}
.alert.error {
border-color: #FF6140;
} html a.social-link {
display: inline-block; padding: 0; margin-bottom: -3px; margin: 0 .4em .3em 0; text-align: center; font-size: 13px; font-family: "fontello"; width: 40px; line-height: 38px; color: inherit; border: 1px solid rgba(28, 38, 43, 0.10); border-radius: 50%;
}
a.social-link:hover {
color: #fff;
}
.social-link.facebook:before {
content: '\e825'
}
.social-link.twitter:before {
content: '\e826'
}
.social-link.flickr:before {
content: '\e835'
}
.social-link.rss:before {
content: '\e82f'
}
.social-link.dribbble:before {
content: '\e82c'
}
.social-link.lastfm:before {
content: '\e82e'
}
.social-link.linkedin:before {
content: '\e827'
}
.social-link.vimeo:before {
content: '\e830'
}
.social-link.forrst:before {
content: '\e831'
}
.social-link.skype:before {
content: '\e832'
}
.social-link.tumblr:before {
content: '\e836'
}
.social-link.behance:before {
content: '\e82b'
}
.social-link.blogger:before {
content: '\e837'
}
.social-link.delicious:before {
content: '\e838'
}
.social-link.digg:before {
content: '\e839'
}
.social-link.github:before {
content: '\e82a'
}
.social-link.wordpress:before {
content: '\e83b'
}
.social-link.google-plus:before {
content: '\e801'
}
.social-link.youtube:before {
content: "\e834"
}
.social-link.pinterest:before {
content: "\e829"
}
.social-link.instagram:before {
content: "\e82d"
}
.social-link.stack-overflow:before {
content: "\e83c"
}
.social-link.foursquare:before {
content: "\e83d"
}
.social-link.xing:before {
content: "\e83e"
}
.social-link.weibo:before {
content: "\e83f"
}
.social-link.soundcloud:before {
content: "\e840"
}
.social-link.fivehundredpx:before {
content: "\e841"
}
.social-link.slideshare:before {
content: "\e842"
}
.social-link.vine:before {
content: "\e863"
}
.social-link.vkontakte:before {
content: "\e846"
}
.social-link.spotify:before {
content: "\e803"
}
.social-link.facebook:hover {
background-color: #3c5fac;
}
.social-link.twitter:hover {
background-color: #5ec3df;
}
.social-link.flickr:hover {
background-color: #FF0084;
}
.social-link.rss:hover {
background-color: #ff9900;
}
.social-link.dribbble:hover {
background-color: #EA4C89;
}
.social-link.lastfm:hover {
background-color: #D51007;
}
.social-link.linkedin:hover {
background-color: #2089b5;
}
.social-link.vimeo:hover {
background-color: #0dadd6;
}
.social-link.google-plus:hover {
background-color: #c63d2d;
}
.social-link.forrst:hover {
background-color: #5b9a68;
}
.social-link.skype:hover {
background-color: #00aff0;
}
.social-link.picassa:hover {
background-color: #ffd34e;
}
.social-link.youtube:hover {
background-color: #c8312b;
}
.social-link.pinterest:hover {
background-color: #cb2027;
}
.social-link.tumblr:hover {
background-color: #2C4762;
}
.social-link.behance:hover {
background-color: #3878F6;
}
.social-link.blogger:hover {
background-color: #fc9947;
}
.social-link.delicious:hover {
background-color: #3274d1;
}
.social-link.digg:hover {
background-color: #205891;
}
.social-link.github:hover {
background-color: #222;
}
.social-link.wordpress:hover {
background-color: #0083b3;
}
.social-link.instagram:hover {
background-color: #3f729b;
}
.social-link.stack-overflow:hover {
background-color: #F90;
}
.social-link.foursquare:hover {
background-color: #009FE0;
}
.social-link.xing:hover {
background-color: #006567;
}
.social-link.weibo:hover {
background-color: #E64141;
}
.social-link.soundcloud:hover {
background-color: #FA3219;
}
.social-link.fivehundredpx:hover {
background-color: #222;
}
.social-link.slideshare:hover {
background-color: #ED9D2C;
}
.social-link.vine:hover {
background-color: #00BF8F;
}
.social-link.vkontakte:hover {
background-color: #6383A8;
}
.social-link.spotify:hover {
background-color: #2ebd59;
} .tabs {
font-size: 1em; margin-bottom: 2em;
}
.tabs .tab-titles {
padding: 0; margin: 0 0 -1px 0;
}
.tabs .tab-titles li {
display: inline-block
}
.tabs .tab-titles li a {
display: inline-block; padding: 1em 2em; font-weight: bold; font-size: 13px; letter-spacing: 0; border: 0; cursor: pointer;
}
.tabs .tab-titles li a.active {
border-bottom: 6px solid #555;
}
.tabs .tab-content {
margin-top: -1px; font-size: 14px; border: 1px solid #EAEEEF;
}
.tabs .tab-content > div {
padding: 1.8em; display: none;
} .toggle-group {
margin-bottom: 2em;
}
.toggle h4 {
position: relative; font-size: 13px; font-weight: 600; border-left: 0; padding: .9em 1em .6em 1.8em; margin: 0; cursor: pointer; border-bottom: 1px solid #F4F3EF;
}
.toggle h4.active {
border-bottom: 0;
}
.toggle h4:before {
content: "\e823"; opacity: .6; position: absolute; top: 1em; left: 0; font-size: 14px; line-height: 1;
}
.toggle h4.active:before {
content: '\e89a'; 
}
.toggle .toggle-content {
display: none; padding: 1.2em 0 2em 1.8em; font-size: 14px; border-bottom: 1px solid #eee;
} input[type=submit],
input[type=button],
button,
a.button {
display: inline-block; position: relative; padding: 1.1em 2em; margin-bottom: .25em; font-size: 11px; font-weight: bold; text-transform: uppercase; line-height: 1.2; letter-spacing: .08em; outline: 0; border: 2px solid #345; color: #345; text-shadow: none; background: none; border-radius: 0;
}
input[type=submit]:hover,
input[type=button]:hover,
button:hover,
a.button:hover {
color: #fff; background-color: #8ACB82; border-color: transparent;
}
input[type=submit]:active,
input[type=button]:active,
button:active,
a.button:active {
opacity: .8;
} input[type=submit].big,
input[type=button].big,
button.big,
a.button.big {
font-size: 12px; padding: 1.5em 2.6em;
} input[type=submit].small,
input[type=button].small,
button.small,
a.button.small {
padding: .6em 1.4em; font-size: 11px;
} input[type=submit] i,
input[type=button] i,
button i,
a.button i {
display: inline; line-height: 1; font-size: 16px; font-weight: bold; margin-right: .4em; margin-left: -0.35em; margin-bottom: -1em; vertical-align: middle;
}
input[type=submit].big i,
input[type=button].big i,
button.big i,
a.button.big i {
top: .7em; left: 1.2em; font-size: 18px;
} .event {
position: relative; padding: 0 1em 2em 3.2em;
}
.event:before { 
content : ""; position: absolute; top: 10px; bottom: -10px; left: 12px; width: 4px; background: #F9F9F9;
}
.event:after { 
content : ""; position: absolute; top: 6px; left: 7px; width: 14px; height: 14px; border-radius: 50%; background: #f1f1f1;
}
.event:nth-of-type(2):after {
background-color: #8ACB82;
}
.event h2 {
font-size: 1em; font-weight: 400; letter-spacing: 1px;
}
.event h2 + p i,
.event h2 + p img {
display: block; text-align: center; font-size: 32px; font-weight: bold; position: absolute; top: -14px; left: -10px; width: 52px; line-height: 52px; margin: 0;  z-index: 120; color: #345; background: #fff;
}
.event h2 + p i:before {
margin:0; 
}	
.event h2 + p img {
padding: 10px; border-radius: 4px;
}
.event h3 {
display: inline-block; position: relative; padding: 3px 8px; font-size: 10px; line-height: 1.3; font-weight: bold; letter-spacing: 0.03em; margin: 0 0 1.5em 0; text-transform: uppercase; color: #4ECE99; border: 1px solid #4ECE99;
}
.event:last-of-type {
padding-bottom: 0; margin-bottom: 3em;
}
.event:last-of-type:before {
bottom: 4px;
}
.event h4 {
font-size: 13px; font-weight: 700; text-transform: uppercase; margin: 0 0 .2em 0; padding: 0;
}
.event h5 {
margin: 0; padding: 0 0 .3em 0; font-size: 10px; font-weight: 400; letter-spacing: 1px; text-transform: uppercase; color: rgba(28, 38, 43, 0.35);
}
.event p {
margin: .6em 0 .2em 0; font-size: 13px; letter-spacing: .3px;
}
.event p:last-child {
margin-bottom: 0;
} .skill-unit {
padding-bottom: 1.1em;
}
.skill-unit h4 {
margin: 0 0 4px 4px; font-weight: 400; font-size: 11px; position: relative; z-index: 100; padding-left: 0px; display: inline-block; vertical-align: super; letter-spacing: 0.03em;
}
.skill-unit i {
font-size: 22px;
}
.skill-unit .bar {
position: relative; width: 100%; height: 4px; background: #eee;
}
.skill-unit .bar .progress {
position: absolute; top: 0; left: 0; width: 0; height: 100%; background: #4ECE99; border-radius: 16px; -webkit-transition: width 1s ease-out; transition: width 1s ease-out;
}
.skill-unit .bar .progress span {
position: absolute; top: -18px; left: 100%; margin-left: -28px; font-size: 10px; font-weight: bold; text-align: center; width: 28px; line-height: 22px; color: #fff; padding: 0 6px; background: #345;
} .testo {
position: relative; padding: 1.4em 1.8em; margin: 4em 0; border: 1px solid #f1f1f1;
}
.testo img {
display: block; margin: -60px auto 16px auto; width: auto; max-height: 62px; border-radius: 8px;
}
.testo h4 {
position: relative; text-align: center; margin: 0; font-size: 12px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em;
}
.testo h5 {
margin-top: 0; font-size: 11px; font-weight: 400; text-align: center; color: rgba(28, 38, 43, 0.35); text-transform: uppercase; letter-spacing: 0.04em;
}
.testo p {
position: relative; margin: 1em 0 0.2em 0; font-size: 13px; text-align: center; letter-spacing: 0.03px;
} .service {
padding: 0.2em 0;
}
.service i,
.service img { 
display: inline-block; float: left; width: 50px; margin: 0; line-height: 50px; font-size: 40px; text-align: center;
}
.service i:before { 
margin: 0 .2em; display: inline-block; 
}
.service p {
margin-top: .2em; margin-left: 68px; font-size: 14px; line-height: 1.45; color: rgba(28, 38, 43, 0.5);
}
.service h4 {
margin-top: 0; margin-left: 68px; margin-bottom: .3em; font-size: 12px; font-weight: 400; letter-spacing: .08em; text-transform: uppercase;
} .process { 
position: relative; text-align: center; width: 80px; height: 80px; padding: 10px; margin: 0 auto 1.6em; border-radius: 50%; color: #345; background: #fff;
}
.process:after { 
content: ""; position:absolute; top: 50%; left: 100%; width: 120%; height: 0; border-bottom: 1px dashed #DADADA;
}
.process i { 
font-size: 42px; line-height: 1;
}
.process img { 
max-width: 60%; margin: 0;
}
.process h4 { 
margin: 10px 0 0; font-size: 11px; font-weight: 300; letter-spacing: .08em;
}
.row [class^="col-"]:nth-child(3n) .process:after { 
display: none; 
}
.row > div:first-child .process {
background: #F7F9E5;
}
.row > div:first-child .process i,
.row > div:last-child .process i {
font-size: 72px; margin-top: -26px;
}
.row > div:last-child .process {
background: #A5FFC1;
} .fun-fact { 
padding-right: 1em; margin-bottom: 1.4em; text-align: center;
}
.fun-fact i { 
display: inline-block; margin-bottom: 18px; line-height: 1; font-size: 56px;
}
.fun-fact i:before { 
margin: 0 .2em; display: inline-block; 
}
.fun-fact img { 
max-width: 54px; margin: 0; margin-bottom: 14px;
}
.fun-fact h4 { 
max-width: 140px; margin: 0 auto; font-size: 13px; line-height: 1.4; font-weight: 300; letter-spacing: .02em; text-transform: uppercase; 
} .client { 
margin: 1em 0; min-height: 60px;  text-align: center;
}
.client img { 
margin: 0 auto; width: auto; max-height: 46px; display:block; 
} .section-title { 
margin: 2em 0 2em; position: relative; z-index: 10; 
}
.page-title + .section-title,
.section-title:first-child { 
margin-top: 0; 
}
.section-title h2, 
.cat-links, 
.filters li a,
.mini-text h3,
.mini-text h4 { 
margin: 0; font-size: 11px; text-transform: uppercase; position: relative; display: inline-block; font-weight: normal; letter-spacing: 0.2em; text-align: center; color: #345;
}
.section-title h2:after, 
.section-title h2:before {
content: " "; display: block; position: absolute;
}
.section-title h2 i, 
.cat-links a, 
.filters li a:hover, 
.filters .current > a,
.mini-text h3,
.mini-text h4 {
display: inline-block; position: relative; padding: 0; font-style: normal; box-shadow: inset 0 -6px 0px #FDF854; color: #345;
}
.section-title h2 i:after, 
h2 i:before {
content: " "; display: block; position: absolute; width: 0; height: 0; bottom: -.5em; left: -.05em; 
} .map {
position: relative; overflow: hidden;
}
.map iframe {
width: 100%; border-width: 0; outline: none;
}
.map-canvas {
height: 360px; margin: 0px; padding: 0px; line-height: 1.6;
}
.map-canvas img { 
max-width: none; 
}
.map .gmnoprint,
.map .gm-style-cc {
display: none;
} .contact-form {
margin: 1.6em auto 3em auto; max-width: 600px; overflow: auto;
}
.contact-form p {
margin: 0 0 1.8em 0;
}		
.contact-form input:not([type=submit]):not([type=button]):not([type=file]):not([type=radio]):not([type=checkbox]),
.contact-form textarea {
width: 100%; max-width: none; display: block; font-size: 14px;
}
.contact-form textarea {
height: 100px;
}
.contact-form .antispam { 
display: none; 
} .mini-text {
max-width: 460px; margin: 2em auto 3em; padding: 0 2em; text-align: center;
}
.mini-text h3 { 
font-size: 1.2em; margin-bottom: 18px;
}
.mini-text h4 { 
font-size: 1em; margin-bottom: 6px;
}
.mini-text p { 
line-height: 1.7;
} @media screen and (min-width: 768px) { .row [class^="col-"]:nth-child(n) .process:after { 
display: inline-block; 
}
.row [class^="col-"]:last-child .process:after { 
display: none; 
} .contact-form p {
width: 50%; float: left;
}
.contact-form p:nth-of-type(1) {
padding-right: 32px;
}
.contact-form p:nth-of-type(n+3){
width: 100%;
} .event {
padding: 0 1em 3em 4em;
}
.event h3 {
margin-left: -1.6em;
}
.event [class^="icon-"], .event [class*=" icon-"], .event .fa {
font-size: 25px; top: -16px; left: -20px; width: 66px; line-height: 66px; margin: 0;  z-index: 120;
}
}