/**
 *
 * slippry v1.3.1 - Responsive content slider for jQuery
 * http://slippry.com
 *
 * Authors: Lukas Jakob Hafner - @saftsaak
 *          Thomas Hurd - @SeenNotHurd
 Christian Okpada - (the thumbnail effect)
 *
 * Copyright 2015, booncon oy - http://booncon.com
 *
 *
 * Released under the MIT license - http://opensource.org/licenses/MIT
 */
/* kenBurns animations, very basic */
@-webkit-keyframes left-right{
0%{
-moz-transform:translateY(-20%) translateX(-10%);-ms-transform:translateY(-20%) translateX(-10%);-webkit-transform:translateY(-20%) translateX(-10%);transform:translateY(-20%) translateX(-10%)}
100%{
-moz-transform:translateY(0%) translateX(10%);-ms-transform:translateY(0%) translateX(10%);-webkit-transform:translateY(0%) translateX(10%);transform:translateY(0%) translateX(10%)}
}
@-moz-keyframes left-right{
0%{
-moz-transform:translateY(-20%) translateX(-10%);-ms-transform:translateY(-20%) translateX(-10%);-webkit-transform:translateY(-20%) translateX(-10%);transform:translateY(-20%) translateX(-10%)}
100%{
-moz-transform:translateY(0%) translateX(10%);-ms-transform:translateY(0%) translateX(10%);-webkit-transform:translateY(0%) translateX(10%);transform:translateY(0%) translateX(10%)}
}
@-ms-keyframes left-right{
0%{
-moz-transform:translateY(-20%) translateX(-10%);-ms-transform:translateY(-20%) translateX(-10%);-webkit-transform:translateY(-20%) translateX(-10%);transform:translateY(-20%) translateX(-10%)}
100%{
-moz-transform:translateY(0%) translateX(10%);-ms-transform:translateY(0%) translateX(10%);-webkit-transform:translateY(0%) translateX(10%);transform:translateY(0%) translateX(10%)}
}
@keyframes left-right{
0%{
-moz-transform:translateY(-20%) translateX(-10%);-ms-transform:translateY(-20%) translateX(-10%);-webkit-transform:translateY(-20%) translateX(-10%);transform:translateY(-20%) translateX(-10%)}
100%{
-moz-transform:translateY(0%) translateX(10%);-ms-transform:translateY(0%) translateX(10%);-webkit-transform:translateY(0%) translateX(10%);transform:translateY(0%) translateX(10%)}
}
@-webkit-keyframes right-left{
0%{
-moz-transform:translateY(0%) translateX(10%);-ms-transform:translateY(0%) translateX(10%);-webkit-transform:translateY(0%) translateX(10%);transform:translateY(0%) translateX(10%)}
100%{
-moz-transform:translateY(-20%) translateX(-10%);-ms-transform:translateY(-20%) translateX(-10%);-webkit-transform:translateY(-20%) translateX(-10%);transform:translateY(-20%) translateX(-10%)}
}
@-moz-keyframes right-left{
0%{
-moz-transform:translateY(0%) translateX(10%);-ms-transform:translateY(0%) translateX(10%);-webkit-transform:translateY(0%) translateX(10%);transform:translateY(0%) translateX(10%)}
100%{
-moz-transform:translateY(-20%) translateX(-10%);-ms-transform:translateY(-20%) translateX(-10%);-webkit-transform:translateY(-20%) translateX(-10%);transform:translateY(-20%) translateX(-10%)}
}
@-ms-keyframes right-left{
0%{
-moz-transform:translateY(0%) translateX(10%);-ms-transform:translateY(0%) translateX(10%);-webkit-transform:translateY(0%) translateX(10%);transform:translateY(0%) translateX(10%)}
100%{
-moz-transform:translateY(-20%) translateX(-10%);-ms-transform:translateY(-20%) translateX(-10%);-webkit-transform:translateY(-20%) translateX(-10%);transform:translateY(-20%) translateX(-10%)}
}
@keyframes right-left{
0%{
-moz-transform:translateY(0%) translateX(10%);-ms-transform:translateY(0%) translateX(10%);-webkit-transform:translateY(0%) translateX(10%);transform:translateY(0%) translateX(10%)}
100%{
-moz-transform:translateY(-20%) translateX(-10%);-ms-transform:translateY(-20%) translateX(-10%);-webkit-transform:translateY(-20%) translateX(-10%);transform:translateY(-20%) translateX(-10%)}
}
.sy-box.sy-loading{
background:url("/images/sy-loader.gif") 50% 50% no-repeat;-moz-background-size:32px;-o-background-size:32px;-webkit-background-size:32px;background-size:32px;min-height:40px}
.sy-box.sy-loading .sy-slides-wrap,.sy-box.sy-loading .sy-pager{
visibility:hidden}
.sy-slides-wrap{
position:relative;height:100%;width:100%}
.sy-slides-wrap:hover .sy-controls{
display:block}
.sy-slides-crop{
height:100%;width:100%;position:absolute;overflow:hidden}
.sy-list{
width:100%;height:100%;list-style:none;margin:0;padding:0;position:absolute}
.sy-list.horizontal{
-moz-transition:left ease;-o-transition:left ease;-webkit-transition:left ease;transition:left ease}
.sy-list.vertical{
-moz-transition:top ease;-o-transition:top ease;-webkit-transition:top ease;transition:top ease}
.sy-slide{
position:absolute;width:100%;z-index:2}
.sy-slide.kenburns{
width:140%;left:-20%}
.sy-slide.kenburns.useCSS{
-moz-transition-property:opacity;-o-transition-property:opacity;-webkit-transition-property:opacity;transition-property:opacity}
.sy-slide.kenburns.useCSS.sy-ken:nth-child(1n){
-webkit-animation-name:left-right;-webkit-animation-fill-mode:forwards;-moz-animation-name:left-right;-moz-animation-fill-mode:forwards;-o-animation-name:left-right;-o-animation-fill-mode:forwards;animation-name:left-right;animation-fill-mode:forwards}
.sy-slide.kenburns.useCSS.sy-ken:nth-child(2n){
-webkit-animation-name:right-left;-webkit-animation-fill-mode:forwards;-moz-animation-name:right-left;-moz-animation-fill-mode:forwards;-o-animation-name:right-left;-o-animation-fill-mode:forwards;animation-name:right-left;animation-fill-mode:forwards}
.sy-slide.sy-active{
z-index:3}
.sy-slide>img{
margin:0;padding:0;display:block;width:100%;border:0}
.sy-slide>a{
margin:0;padding:0;display:block;width:100%}
.sy-slide>a>img{
margin:0;padding:0;display:block;width:100%;border:0}
.sy-controls{
display:none;list-style:none;height:100%;width:100%;position:absolute;padding:0;margin:0}
.sy-controls li{
position:absolute;width:10%;min-width:4.2em;height:100%;z-index:33}
.sy-controls li.sy-prev{
left:0;top:0}
.sy-controls li.sy-prev a:after{
background-position:-5% 0}
.sy-controls li.sy-next{
right:0;top:0}
.sy-controls li.sy-next a:after{
background-position:105% 0}
.sy-controls li a{
position:relative;width:100%;height:100%;display:block;text-indent:-9999px}
.sy-controls li a:link,.sy-controls li a:visited{
opacity:0.4}
.sy-controls li a:hover,.sy-controls li a:focus{
opacity:0.8;outline:none}
.sy-controls li a:after{
content:"";background-image:url("/images/arrows.svg");background-repeat:no-repeat;-moz-background-size:cover;-o-background-size:cover;-webkit-background-size:cover;background-size:cover;text-align:center;text-indent:0;line-height:2.8em;color:#111;font-weight:800;position:absolute;background-color:#fff;width:2.8em;height:2.8em;left:50%;top:50%;margin-top:-1.4em;margin-left:-1.4em;-moz-border-radius:50%;-webkit-border-radius:50%;border-radius:50%}
@media only screen and (max-device-width: 600px){
.sy-controls{
display:block}
.sy-controls li{
min-width:2.1em}
.sy-controls li a:after{
width:1.4em;height:1.4em;margin-top:-0.7em;margin-left:-0.7em}
}
.sy-caption-wrap{
position:absolute;bottom:2em;z-index:12;left:50%}
.sy-caption-wrap .sy-caption{
position:relative;left:-50%;background-color:rgba(0,0,0,0.54);color:#fff;padding:0.4em 1em;-moz-border-radius:1.2em;-webkit-border-radius:1.2em;border-radius:1.2em}
.sy-caption-wrap .sy-caption a:link,.sy-caption-wrap .sy-caption a:visited{
color:#e24b70;font-weight:600;text-decoration:none}
.sy-caption-wrap .sy-caption a:hover,.sy-caption-wrap .sy-caption a:focus{
text-decoration:underline}
@media only screen and (max-device-width: 600px), screen and (max-width: 600px){
.sy-caption-wrap{
left:0;bottom:0.4em}
.sy-caption-wrap .sy-caption{
left:0;padding:0.2em 0.4em;font-size:0.92em;-moz-border-radius:0;-webkit-border-radius:0;border-radius:0}
}
.sy-pager{
overflow:hidden;*zoom:1;display:block;width:100%;margin:1em 0 0;padding:0;list-style:none;text-align:center}
.sy-pager li{
display:inline-block;width:1.2em;height:1.2em;margin:0 1em 0 0;-moz-border-radius:50%;-webkit-border-radius:50%;border-radius:50%}
.sy-pager li.sy-active a{
background-color:#e24b70}
.sy-pager li a{
width:100%;height:100%;display:block;background-color:#ccc;text-indent:-9999px;-moz-background-size:2em;-o-background-size:2em;-webkit-background-size:2em;background-size:2em;-moz-border-radius:50%;-webkit-border-radius:50%;border-radius:50%}
.sy-pager li a:link,.sy-pager li a:visited{
opacity:1.0}
.sy-pager li a:hover,.sy-pager li a:focus{
opacity:0.6}
.sy-filler{
width:100%}
.sy-filler.ready{
-moz-transition:padding 600ms ease;-o-transition:padding 600ms ease;-webkit-transition:padding 600ms ease;transition:padding 600ms ease}
.highlight table td{
padding:5px}
.highlight table pre{
margin:0}
.highlight .cm{
color:#999988;font-style:italic}
.highlight .cp{
color:#999999;font-weight:bold}
.highlight .c1{
color:#999988;font-style:italic}
.highlight .cs{
color:#999999;font-weight:bold;font-style:italic}
.highlight .c,.highlight .cd{
color:#999988;font-style:italic}
.highlight .err{
color:#a61717;background-color:#e3d2d2}
.highlight .gd{
color:#000000;background-color:#ffdddd}
.highlight .ge{
color:#000000;font-style:italic}
.highlight .gr{
color:#aa0000}
.highlight .gh{
color:#999999}
.highlight .gi{
color:#000000;background-color:#ddffdd}
.highlight .go{
color:#888888}
.highlight .gp{
color:#555555}
.highlight .gs{
font-weight:bold}
.highlight .gu{
color:#aaaaaa}
.highlight .gt{
color:#aa0000}
.highlight .kc{
color:#000000;font-weight:bold}
.highlight .kd{
color:#000000;font-weight:bold}
.highlight .kn{
color:#000000;font-weight:bold}
.highlight .kp{
color:#000000;font-weight:bold}
.highlight .kr{
color:#000000;font-weight:bold}
.highlight .kt{
color:#445588;font-weight:bold}
.highlight .k,.highlight .kv{
color:#000000;font-weight:bold}
.highlight .mf{
color:#009999}
.highlight .mh{
color:#009999}
.highlight .il{
color:#009999}
.highlight .mi{
color:#009999}
.highlight .mo{
color:#009999}
.highlight .m,.highlight .mb,.highlight .mx{
color:#009999}
.highlight .sb{
color:#d14}
.highlight .sc{
color:#d14}
.highlight .sd{
color:#d14}
.highlight .s2{
color:#d14}
.highlight .se{
color:#d14}
.highlight .sh{
color:#d14}
.highlight .si{
color:#d14}
.highlight .sx{
color:#d14}
.highlight .sr{
color:#009926}
.highlight .s1{
color:#d14}
.highlight .ss{
color:#990073}
.highlight .s{
color:#d14}
.highlight .na{
color:#008080}
.highlight .bp{
color:#999999}
.highlight .nb{
color:#0086B3}
.highlight .nc{
color:#445588;font-weight:bold}
.highlight .no{
color:#008080}
.highlight .nd{
color:#3c5d5d;font-weight:bold}
.highlight .ni{
color:#800080}
.highlight .ne{
color:#990000;font-weight:bold}
.highlight .nf{
color:#990000;font-weight:bold}
.highlight .nl{
color:#990000;font-weight:bold}
.highlight .nn{
color:#555555}
.highlight .nt{
color:#000080}
.highlight .vc{
color:#008080}
.highlight .vg{
color:#008080}
.highlight .vi{
color:#008080}
.highlight .nv{
color:#008080}
.highlight .ow{
color:#000000;font-weight:bold}
.highlight .o{
color:#000000;font-weight:bold}
.highlight .w{
color:#bbbbbb}
.highlight{
background-color:#f8f8f8}
.highlight{
background-color:#f0f0f0;border:1px solid #dcdcdc;padding:0.4em;font-family:'source-code-pro', monospace;font-size:0.84em;overflow-x:auto}
*{
-moz-box-sizing:border-box;-webkit-box-sizing:border-box;box-sizing:border-box}
html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,figcaption,figure,footer,header,hgroup,menu,nav,section,summary,time,mark,audio,video{
margin:0;padding:0;border:0;outline:0;font-size:100%;font:inherit;vertical-align:baseline}
article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{
display:block}
body{
line-height:1.48;-webkit-font-smoothing:antialiased}
ul{
list-style:none}
blockquote,q{
quotes:none}
blockquote:before,blockquote:after,q:before,q:after{
content:'';content:none}
ins{
text-decoration:none}
del{
text-decoration:line-through}
table{
border-collapse:collapse;border-spacing:0}
body{
font-size:16px;font-family:"Cabin", "Helvetica Neue", Helvetica, Arial, sans-serif;background-color:#f5f5f5;margin:0 auto;color:#777}
div{
vertical-align:top}
p{
display:block;margin:1em 0}
h1,h2,h3,h4,h5,h6{
line-height:1.5;font-weight:300;margin:0.5em 0;font-family:source-sans-pro, Verdana, sans-serif;color:#202123}
h1 a,h2 a,h3 a,h4 a,h5 a,h6 a{
color:#202123}
h1 a:hover,h2 a:hover,h3 a:hover,h4 a:hover,h5 a:hover,h6 a:hover{
color:#444}
h1{
font-size:2em}
h2{
font-size:1.66em}
h3{
font-size:1.33em}
h4{
font-size:1.1em}
h5{
font-size:0.87em}
h6{
font-size:0.63em}
@-webkit-keyframes jumpings{
0%{
top:2.4%}
100%{
top:30%}
}
@-moz-keyframes jumpings{
0%{
top:2.4%}
100%{
top:30%}
}
@-o-keyframes jumpings{
0%{
top:2.4%}
100%{
top:30%}
}
@keyframes jumpings{
0%{
top:2.4%}
100%{
top:30%}
}
.restricted-width{
margin-left:auto;margin-right:auto;padding:0 2%}
@media only screen and (min-width: 1180px){
.restricted-width{
max-width:1180px}
}
a.button-link{
display:inline-block;color:#fff;background-color:#31ACE2;padding:0.25em 0.5em;text-decoration:none;text-transform:uppercase;text-align:center;font-weight:700;font-size:0.8em;letter-spacing:0.1em;vertical-align:text-bottom}
a.button-link.download{
position:relative;background:none;color:#31ACE2;padding-right:1.54em}
@media only screen and (max-width: 600px){
a.button-link.download{
display:none}
}
a.button-link.download:after{
position:absolute;content:'⬇';top:15.4%;right:4%}
a.button-link.download:hover{
background:none;color:#31ACE2}
a.button-link.download:hover:after{
-webkit-animation:jumpings 0.8s linear infinite;-moz-animation:jumpings 0.8s linear infinite;-o-animation:jumpings 0.8s linear infinite;animation:jumpings 0.8s linear infinite}
a.button-link:hover{
background-color:#1c91c4;color:#fff}
section{
margin:0 0 1em}
@media only screen and (max-width: 600px){
section{
margin-bottom:0}
}
a{
color:#202123}
a:hover{
color:#444}
#header{
overflow:hidden;*zoom:1}
#header a{
text-decoration:none}
#header a.logo-link:hover{
color:#444}
#header #site-name{
font-size:2em;padding:0.75em 0;float:left}
#header nav{
list-style:none;float:right;margin:1.5em 0;text-align:right;list-style:none;float:right;margin:3.2em 0;text-align:right}
#header nav li{
display:inline-block;margin-left:0.25em}
@media only screen and (min-width: 601px){
#header nav{
float:right;display:inline-block;margin:3em 0;padding-right:126px}
#header nav li{
display:inline-block}
}
@media only screen and (min-width: 1280px){
#header nav{
padding-right:0}
}
@media only screen and (max-width: 600px){
#header .github-link{
display:none}
}
#header .github-link img{
position:absolute;top:0;right:0;border:0;z-index:12}
.sy-caption .red{
color:#ff0048}
h2.slider-title{
margin-top:0}
.half{
display:inline-block;width:100%}
@media only screen and (min-width: 600px){
.half{
width:49.8%}
.half:nth-child(1){
padding-right:1em}
.half:nth-child(2){
padding-left:1em}
}
.third{
display:inline-block;width:100%}
@media only screen and (min-width: 600px){
.third{
width:33%}
.third:nth-child(1){
padding-right:1em}
.third:nth-child(2){
padding:0 0.5em}
.third:nth-child(3){
padding-left:1em}
}
.twothird{
display:inline-block;width:100%}
@media only screen and (min-width: 769px){
.twothird{
width:66%}
.twothird:nth-child(1){
padding-right:1em}
.twothird:nth-child(2){
padding:0 0.5em}
.twothird:nth-child(3){
padding-left:1em}
}
a.github-download{
font-size:2em;font-weight:700;margin:0.25em auto;display:block;width:12em}
@media only screen and (max-width: 600px){
a.github-download{
width:100%;font-size:1.6em}
}
.big-number{
font-size:6em;font-weight:700;float:left;margin-right:0.25em;display:block;height:100%;line-height:0.8;clear:left;display:none}
.get-started{
overflow:hidden;*zoom:1;margin:1em 0}
.get-started h3{
margin-top:0}
code{
font-family:monospace;padding:0.1em 0.2em;background-color:#d9dee3;color:#3B454F}
#footer{
background-color:#fff;padding-top:2em;padding-bottom:2em;color:#3B454F}
#footer .footer-content{
overflow:hidden;*zoom:1;text-align:center}
#footer .footer-content .githubs{
float:left}
#footer .footer-content .right{
float:right}
#footer .footer-content .block-link{
display:inline-block;text-decoration:none;font-weight:200}
#footer .footer-content .pixels-logo{
height:1.6em;vertical-align:middle}
#footer .footer-content .twitter-share-button{
width:92px !important}
@media only screen and (max-width: 550px){
#footer .footer-content .right,#footer .footer-content .githubs{
float:none;width:100%;text-align:center;margin-bottom:1em}
}
.front-page .slide_box{
max-height:500px}
@media only screen and (min-width: 550px){
#settings-jump{
float:right}
}
#settings-jump li{
height:2em;border-top:1px solid #fff}
#settings-jump li.default{
height:1.6em;border-top:0}
#settings-jump li #select-setting{
position:relative;text-transform:uppercase}
#settings-jump li #select-setting:after{
content:' ';display:inline-block;height:0;width:0;border-left:0.4em solid transparent;border-right:0.4em solid transparent;position:absolute;right:0;margin-right:0.5em;margin-top:0.5em}
#settings-jump li.section-head{
padding:0.25em 0.5em}
#settings-jump li a{
text-decoration:none;display:block;height:2em;background-color:#31ACE2;padding:0.25em 0.5em;color:#fff;text-align:left}
#settings-jump li a:hover{
background-color:#1c91c4}
#settings-jump.closed{
height:2em;overflow:hidden}
#settings-jump.closed #select-setting:after{
border-top:0.5em solid white}
#settings-jump.open{
height:auto;background-color:#fff}
#settings-jump.open #select-setting:after{
border-bottom:0.5em solid white}
section.settings h4{
margin-top:1.5em}
section.settings h3{
margin-top:2em;border-bottom:1px solid #bcc5cd}
.example-tiles .tile{
display:inline-block;padding:0.8em 1em;background-color:#31ACE2;color:#fff;text-decoration:none;font-size:1.5em;font-family:source-sans-pro, Verdana, sans-serif;width:100%;margin:1% 0;text-align:center}
.example-tiles .tile.large{
padding:1.6em 1em;-moz-background-size:cover;-o-background-size:cover;-webkit-background-size:cover;background-size:cover;background-position:50% 50%;text-shadow:0 0 0.1em rgba(0,0,0,0.4);opacity:0.8}
.example-tiles .tile.large:hover{
opacity:1}
@media only screen and (min-width: 411px){
.example-tiles .tile{
width:49%}
.example-tiles .tile:nth-child(2n+1){
margin:1% 1% 1% 0}
.example-tiles .tile:nth-child(2n+2){
margin:1% 0 1% 1%}
}
@media only screen and (min-width: 631px){
.example-tiles .tile{
width:32%}
.example-tiles .tile:nth-child(3n+1){
margin:1% 1% 1% 0}
.example-tiles .tile:nth-child(3n+2){
margin:1%}
.example-tiles .tile:nth-child(3n+3){
margin:1% 0 1% 1%}
}
.example-tiles .tile:hover{
background-color:#1c91c4;color:#fff}
.example-tiles .tile.active{
background-color:#1880ae}
.portfolio .sy-controls{
display:block}
.portfolio .sy-pager{
margin:1.5em 0}
.portfolio .external-captions{
background-color:#fff;padding:1em}
.news-slider .text-content{
position:absolute;left:0;background-color:rgba(255,255,255,0.9);padding:1em;width:40%;font-size:0.75em;height:100%}
.news-slider .text-content h2{
margin:0}
.news-slider .text-content p{
display:none}
.news-slider .text-content a.button-link{
padding:0.25em 0.5em;position:absolute;bottom:1em;right:1em}
.news-slider .text-content .read-more{
float:right;position:absolute;bottom:1em;right:1em}
@media only screen and (min-width: 481px){
.news-slider .text-content{
font-size:1em}
}
@media only screen and (min-width: 769px){
.news-slider .text-content{
width:35%}
.news-slider .text-content p{
display:block}
}
@media only screen and (min-width: 960px){
.news-slider .text-content{
width:30%}
}
.news-slider .image-content{
line-height:0}
.news-slider .image-content img{
max-width:100%}
.news-slider .news-pager{
text-align:right;display:block;margin:0.2em 0 0;padding:0;list-style:none}
.news-slider .news-pager li{
display:inline-block;padding:0.6em;margin:0 0 0 1em}
.news-slider .news-pager li.sy-active a{
color:#31ACE2}
.news-slider .news-pager li a{
font-weight:500;text-decoration:none;display:block;color:#222}
.shop .sy-box{
overflow:hidden}
@media only screen and (min-width: 401px){
.shop .sy-box .sy-slides-wrap{
min-width:400px;max-width:590px;width:50%;margin-left:auto;margin-right:auto}
}
.shop .sy-box .sy-slides-crop{
overflow:visible}
@media only screen and (max-width: 500px){
.shop .sy-box .sy-controls{
display:block}
.shop .sy-box .sy-controls li{
min-width:2.4em}
.shop .sy-box .sy-controls li a:after{
line-height:1.4em;height:1.4em;width:1.4em;margin-top:-0.7em;margin-left:-0.7em}
}
@media only screen and (min-width: 501px){
.shop .sy-box .sy-controls li{
width:100%}
.shop .sy-box .sy-controls li.sy-prev{
left:-100%}
.shop .sy-box .sy-controls li.sy-next{
right:-100%}
.shop .sy-box .sy-controls li a:after{
background:none}
}
.shop .sy-box .sy-slide{
opacity:0.6;-moz-transition:opacity 1s;-o-transition:opacity 1s;-webkit-transition:opacity 1s;transition:opacity 1s}
.shop .sy-box .sy-slide .product-info{
position:absolute;top:0;left:0;height:100%;padding:1em}
@media only screen and (max-width: 500px){
.shop .sy-box .sy-slide .product-info{
padding:1em 2.4em}
}
.shop .sy-box .sy-slide .product-info p{
margin-bottom:1em}
.shop .sy-box .sy-slide .product-info p,.shop .sy-box .sy-slide .product-info .button-link{
opacity:0}
.shop .sy-box .sy-slide .product-info .button-link{
position:absolute;bottom:1em}
.shop .sy-box .sy-slide .product-info .buy-now{
right:1em}
@media only screen and (max-width: 500px){
.shop .sy-box .sy-slide .product-info .buy-now{
right:2.4em}
}
.shop .sy-box .sy-slide .product-info .more-info{
left:1em}
@media only screen and (max-width: 500px){
.shop .sy-box .sy-slide .product-info .more-info{
left:2.4em}
}
.shop .sy-box .sy-slide .image-content{
line-height:0}
.shop .sy-box .sy-slide .image-content .product-image{
max-width:100%}
.shop .sy-box .sy-slide.sy-active{
opacity:1}
.shop .sy-box .sy-slide.sy-active .buy-now{
opacity:1}
.shop .sy-box .sy-slide.sy-active:hover .product-image{
opacity:0.2}
.shop .sy-box .sy-slide.sy-active:hover .product-info p,.shop .sy-box .sy-slide.sy-active:hover .product-info .button-link{
opacity:1}
.shop .sy-box .sy-slide .product-info p,.shop .sy-box .sy-slide .product-info .button-link,.shop .sy-box .sy-slide .product-image,.shop .sy-box .sy-slide.sy-active,.shop .sy-box .sy-slide.sy-active .buy-now,.shop .sy-box .sy-slide.sy-active:hover .product-image,.shop .sy-box .sy-slide.sy-active:hover .product-info p,.shop .sy-box .sy-slide.sy-active:hover .product-info .button-link,.shop .sy-box .sy-slide.sy-active.transition{
-moz-transition:opacity 1s;-o-transition:opacity 1s;-webkit-transition:opacity 1s;transition:opacity 1s}
.shop .product-name,.shop .shop-slider .sy-slides-wrap{
width:100%;margin-left:auto;margin-right:auto}
@media only screen and (min-width: 401px){
.shop .product-name,.shop .shop-slider .sy-slides-wrap{
min-width:400px;max-width:590px;width:50%}
}
.thumb-box{
padding:1.4em 0 1em;margin-left:-1%;width:102%}
.thumb-box .thumbs{
overflow:hidden;*zoom:1}
.thumb-box .thumbs li{
float:left;width:25%;text-align:center;padding:0 1%}
.thumb-box .thumbs li img{
width:100%;opacity:.8;-moz-transition:opacity 0.32s;-o-transition:opacity 0.32s;-webkit-transition:opacity 0.32s;transition:opacity 0.32s;border-bottom:4px solid transparent}
.thumb-box .thumbs li img.active{
border-color:#31ACE2;opacity:1}
.thumb-box .thumbs li:hover img{
opacity:1;-moz-transition:opacity 0.2s;-o-transition:opacity 0.2s;-webkit-transition:opacity 0.2s;transition:opacity 0.2s}
.newsletter{
border:2px solid #e24b70;padding:10px 15px}
.newsletter h3{
margin:0}
#mc-embedded-subscribe{
float:right}
#mc_embed_signup form{
padding:8px 0 0 !important}
#mc_embed_signup input.email,#mc_embed_signup #mc-embedded-subscribe{
margin-bottom:0 !important;height:48px;font-size:18px;min-width:auto}
.clear{
overflow:hidden;*zoom:1}
.carbonwrap{
border:2px solid #ccc;padding-bottom:18px}
@media only screen and (max-width: 768px){
.carbonwrap{
display:none}
}
#carbonads{
margin:18px 10px}
.carbon-poweredby{
margin-top:5px !important;font-size:12px;text-decoration:none}
@media only screen and (min-width: 840px){
.carbon-poweredby{
margin-left:15px !important}
}
.carbon-poweredby:before{
content:' ';overflow:hidden;*zoom:1}
.carbon-img{
float:left}
.carbon-text{
font-size:13px;display:block !important;margin-bottom:2px !important;text-decoration:none;text-transform:none}
@media only screen and (min-width: 840px){
.carbon-text{
padding-top:0 !important;float:none !important;width:auto !important;height:auto !important;margin-left:145px !important}
}
