经验分享程序开发文档资料数据资源其它资源

FSVS垂直滚屏效果代码

版权：原创 更新时间：1年以上
[该文章底部包含文件资源,可根据自己情况,决定是否下载资源使用,时间>金钱,如有需要,立即查看资源]

以下是 FSVS垂直滚屏效果代码 的示例演示效果:

当前平台(PC电脑)
  • 平台:
整屏预览

部分效果截图:

FSVS垂直滚屏效果代码

HTML代码(index.html):

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" class="fsvs demo">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<meta name="keywords" content="JS代码,其他代码,JS广告代码,JS特效代码" />
<meta name="description" content="此代码内容为FSVS垂直滚屏效果代码，属于站长常用代码" />
<title>FSVS垂直滚屏效果代码</title>
<link rel="stylesheet" href="css/lrtk.css">
<script src="js/jquery.min.js"></script>
<script src="js/jquery-migrate-1.2.1.min.js"></script>
<script src="js/jquery.swipe-events.js"></script>
<script src="js/fsvs.js"></script>
<script src="js/main.js"></script>
</head>
<body class="fsvs">
<!-- 代码 开始 -->
<div id="fsvs-body">
<div class="slide">
	<h2>标题1</h2>
	<div>
		<img src="images/1.jpg" />
	</div>
</div>
<div class="slide">
	<h2>标题2</h2>
	<div>
		<img src="images/2.jpg"/>
	</div>
</div>
<div class="slide">
	<h2>标题3</h2>
		<img src="images/3.jpg"/>
</div>
<div class="slide">
</div>
<!-- 代码 结束 -->
</body>
</html>

JS代码(main.js):

jQuery(document).ready( function($){
	if( $.fn.fsvs ){
	var slider = $.fn.fsvs({
	speed:1000,nthClasses:4,mouseDragEvents:false}
);
}
if( $.fn.flare ){
	var flares = $('.flare').flare();
	for( var flare in flares ){
	//flares[flare].reset();
}
}
var sectionHeight = $('#fsvs-body > .slide:eq(0)').height();
	$('#fsvs-body > .slide').each( function(){
	var section = $(this),item = $('.item',section ),demo = $('.demo',section ),itemHeight = item.outerHeight(),demoHeight = demo.outerHeight();
	item.css({
	marginTop:( ( sectionHeight - itemHeight ) / 2 ) + 'px'}
);
	demo.css({
	marginTop:( ( sectionHeight - demoHeight ) / 2 ) + 'px'}
);
}
);
	$(window).load(function(){
}
);
}
);

CSS代码(lrtk.css):

/* ����ͼ�� �Ѽ����� www.lanrentuku.com */
article,aside,details,figcaption,figure,footer,header,hgroup,nav,section,main,summary{display:block}
audio,canvas,video{display:inline-block;*display:inline;*zoom:1}
audio:not([controls]){display:none}
[hidden]{display:none}
html{font-size:100%;-webkit-text-size-adjust:100%;-ms-text-size-adjust:100%}
html,button,input,select,textarea{font-family:sans-serif}
body{margin:0}
a:focus{outline:thin dotted}
a:hover,a:active{outline:0}
h1{font-size:2em;margin:0.67em 0}
h2{font-size:1.5em;margin:0.83em 0}
h3{font-size:1.17em;margin:1em 0}
h4{font-size:1em;margin:1.33em 0}
h5{font-size:0.83em;margin:1.67em 0}
h6{font-size:0.75em;margin:2.33em 0}
abbr[title]{border-bottom:1px dotted}
b,strong{font-weight:bold}
blockquote{margin:1em 40px}
dfn{font-style:italic}
mark{background:#ff0;color:#000}
p,pre{margin:1em 0}
pre,code,kbd,samp{font-family:monospace,serif;_font-family:'courier new',monospace;font-size:1em}
pre{white-space:pre;white-space:pre-wrap;word-wrap:break-word}
q{quotes:none}
q:before,q:after{content:'';content:none}
small{font-size:75%}
sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}
sup{top:-0.5em}
sub{bottom:-0.25em}
dl,menu,ol,ul{margin:0}
dd{margin:0 0 0 40px}
menu,ol,ul{padding:0 0 0 0}
nav ul,nav ol{list-style:none;list-style-image:none}
img{border:0;-ms-interpolation-mode:bicubic}
svg:not(:root){overflow:hidden}
figure{margin:0}
form{margin:0}
fieldset{border:1px solid #c0c0c0;margin:0 2px;padding:0.35em 0.625em 0.75em}
legend{border:0;padding:0;white-space:normal;*margin-left:-7px}
button,input,select,textarea{font-size:100%;margin:0;vertical-align:baseline;*vertical-align:middle}
button,input{line-height:normal}
button,input[type="button"],input[type="reset"],input[type="submit"]{cursor:pointer;-webkit-appearance:button;*overflow:visible}
button[disabled],input[disabled]{cursor:default}
input[type="checkbox"],input[type="radio"]{box-sizing:border-box;padding:0;*height:13px;*width:13px}
input[type="search"]{-webkit-appearance:textfield;-moz-box-sizing:content-box;-webkit-box-sizing:content-box;box-sizing:content-box}
input[type="search"]::-webkit-search-decoration,input[type="search"]::-webkit-search-cancel-button{-webkit-appearance:none}
button::-moz-focus-inner,input::-moz-focus-inner{border:0;padding:0}
textarea{overflow:auto;vertical-align:top}
table{border-collapse:collapse;border-spacing:0}
*,*:before,*:after{-moz-box-sizing:border-box;-webkit-box-sizing:border-box;box-sizing:border-box}
h1,h2,h3,h4,h5,h6,p,blockquote,pre,dl,dd,ol,ul,form,fieldset,legend,table,th,td,caption,hr{margin:0;padding:0}
abbr[title],dfn[title]{cursor:help}
u,ins{text-decoration:none}
ins{border-bottom:1px solid}
img{font-style:italic}
.cf:after{content:" ";display:table;clear:both}
h1,h2,h3,h4,h5,h6,hgroup,ul,ol,dl,blockquote,p,address,table,fieldset,figure,pre,.form-fields>li{margin-bottom:24px;margin-bottom:1.5rem}
.double-margin{margin-bottom:48px;margin-bottom:3rem}
hr{margin-bottom:22px;margin-bottom:1.375rem}
html{font:1em/1.5 "Open Sans",sans-serif;overflow-y:scroll;min-height:100%}
body{background:#fff;color:#555;-webkit-font-smoothing:antialiased}
h1,h2,h3,h4,h5,h6{color:#555;font-family:"Open Sans",sans-serif;font-weight:300}
h1,.h1{font-size:36px;font-size:2.25rem;line-height:1.33333}
h2,.h2{font-size:30px;font-size:1.875rem;line-height:1.6}
h3,.h3{font-size:24px;font-size:1.5rem;line-height:1}
h4,.h4{font-size:20px;font-size:1.25rem;line-height:1.2}
h5,.h5{font-size:16px;font-size:1rem;line-height:1.5}
h6,.h6{font-size:14px;font-size:0.875rem;line-height:1.71429}
h1 a,h2 a,h3 a,h4 a,h5 a,h6 a{font-weight:inherit}
.giga{font-size:96px;font-size:6rem;line-height:1}
.mega{font-size:72px;font-size:4.5rem;line-height:1}
.kilo{font-size:48px;font-size:3rem;line-height:1}
.smaller{font-size:12px;font-size:0.75rem;line-height:2}
.tiny{font-size:10px;font-size:0.625rem;line-height:2.4}
.lead{font-size:18px;font-size:1.125rem;line-height:1.33333}
.smaller{font-size:12px;font-size:0.75rem;line-height:2}
.tiny{font-size:10px;font-size:0.625rem;line-height:2.4}
a,a:visited{color:#cd3737;text-decoration:none;-webkit-transition:color 0.2s;-moz-transition:color 0.2s;-o-transition:color 0.2s;transition:color 0.2s;-webkit-transition:background 0.2s;-moz-transition:background 0.2s;-o-transition:background 0.2s;transition:background 0.2s}
a:hover,a:focus{color:#a72a2a}
li>ul,li>ol{margin:0}
blockquote{text-indent:-0.41em}
blockquote p:last-of-type{margin-bottom:0}
.source{display:block;text-indent:0}
.source:before{content:"\2014"}
img{max-width:100%;height:auto}
img[width],img[height]{max-width:none}
.img-right{float:right;margin-bottom:24px;margin-left:24px}
.img-left{float:left;margin-right:24px;margin-bottom:24px}
.img-center{display:block;margin-right:auto;margin-bottom:24px;margin-left:auto}
.img-short{height:120px}
.img-medium{height:240px}
.img-tall{height:360px}
figure>img{display:block}
pre{overflow:auto}
pre mark{background:none;border-bottom:1px solid;color:inherit}
.code-comment{opacity:0.75;filter:alpha(opacity=75)}
.line-numbers{font-family:monospace,serif;list-style:decimal-leading-zero inside;white-space:nowrap;overflow:auto;margin-left:0}
.line-numbers code{white-space:pre}
fieldset{padding:24px;border:1px solid #e2e2e2}
input[type="text"],input[type="email"],input[type="tel"],input[type="date"],input[type="number"],input[type="password"],input[type="time"],input[type="url"],input[type="search"],.text-input,textarea{width:100%;font-size:12px;font-size:0.75rem;line-height:2;border:1px solid #e2e2e2;border-radius:4px;padding:5px 10px;box-shadow:0 1px 4px 0 #ddd inset}
input[type="text"]:focus,input[type="email"]:focus,input[type="tel"]:focus,input[type="date"]:focus,input[type="number"]:focus,input[type="password"]:focus,input[type="time"]:focus,input[type="url"]:focus,input[type="search"]:focus,.text-input:focus,textarea:focus{outline:none;border:1px solid #cd3737;box-shadow:0 0 3px 0 #aaa}
input[type="search"]{-webkit-appearance:textfield;-moz-box-sizing:border-box;-webkit-box-sizing:border-box;box-sizing:border-box}
.form-fields{list-style:none;margin:0}
.form-fields>li:last-child{margin-bottom:0}
label,.label{display:block}
.additional{display:block;font-weight:normal}
.check-list{list-style:none;margin:0}
.check-label,.check-list label,.check-list .label{display:inline-block}
.spoken-form label{display:inline-block;font:inherit}
.extra-help{display:inline-block;visibility:hidden}
.text-input:active+.extra-help,.text-input:focus+.extra-help{visibility:visible}
table{width:100%}
th,td{padding:6px;text-align:left}
@media screen and (min-width:480px){th,td{padding:12px}
}
[colspan]{text-align:center}
[colspan="1"]{text-align:left}
[rowspan]{vertical-align:middle}
[rowspan="1"]{vertical-align:top}
.numerical{text-align:right}
.t5{width:5%}
.t10{width:10%}
.t12{width:12.5%}
.t15{width:15%}
.t20{width:20%}
.t25{width:25%}
.t30{width:30%}
.t33{width:33.333%}
.t35{width:35%}
.t37{width:37.5%}
.t40{width:40%}
.t45{width:45%}
.t50{width:50%}
.t55{width:55%}
.t60{width:60%}
.t62{width:62.5%}
.t65{width:65%}
.t66{width:66.666%}
.t70{width:70%}
.t75{width:75%}
.t80{width:80%}
.t85{width:85%}
.t87{width:87.5%}
.t90{width:90%}
.t95{width:95%}
.table-bordered th,.table-bordered td{border:1px solid #cd3737}
.table-bordered th:empty,.table-bordered td:empty{border:none}
.table-bordered thead tr:last-child th{border-bottom-width:2px}
.table-bordered tbody tr th:last-of-type{border-right-width:2px}
.table-striped tbody tr:nth-of-type(odd){background-color:#fafafa}
.table-data{font:12px/1.5 sans-serif}
.container{*zoom:1;width:1040px;padding-left:0;padding-right:0;margin-left:auto;margin-right:auto}
.container:after{content:"";display:table;clear:both}
.float-right{float:right !important}
.float-left{float:left !important}
.float-none{float:none !important}
.text-left{text-align:left !important}
.text-center{text-align:center !important}
.text-right{text-align:right !important}
.weight-light{font-weight:300 !important}
.weight-normal{font-weight:400 !important}
.weight-semibold{font-weight:600 !important}
.push{margin:24px !important}
.push-top{margin-top:24px !important}
.push-right{margin-right:24px !important}
.push-bottom{margin-bottom:24px !important}
.push-left{margin-left:24px !important}
.push-ends{margin-top:24px !important;margin-bottom:24px !important}
.push-sides{margin-right:24px !important;margin-left:24px !important}
.push-half{margin:12px !important}
.push-half-top{margin-top:12px !important}
.push-half-right{margin-right:12px !important}
.push-half-bottom{margin-bottom:12px !important}
.push-half-left{margin-left:12px !important}
.push-half-ends{margin-top:12px !important;margin-bottom:12px !important}
.push-half-sides{margin-right:12px !important;margin-left:12px !important}
.flush{margin:0 !important}
.flush-top{margin-top:0 !important}
.flush-right{margin-right:0 !important}
.flush-bottom{margin-bottom:0 !important}
.flush-left{margin-left:0 !important}
.flush-ends{margin-top:0 !important;margin-bottom:0 !important}
.flush-sides{margin-right:0 !important;margin-left:0 !important}
.soft{padding:24px !important}
.soft-top{padding-top:24px !important}
.soft-right{padding-right:24px !important}
.soft-bottom{padding-bottom:24px !important}
.soft-left{padding-left:24px !important}
.soft-ends{padding-top:24px !important;padding-bottom:24px !important}
.soft-sides{padding-right:24px !important;padding-left:24px !important}
.soft-half{padding:12px !important}
.soft-half-top{padding-top:12px !important}
.soft-half-right{padding-right:12px !important}
.soft-half-bottom{padding-bottom:12px !important}
.soft-half-left{padding-left:12px !important}
.soft-half-ends{padding-top:12px !important;padding-bottom:12px !important}
.soft-half-sides{padding-right:12px !important;padding-left:12px !important}
.hard{padding:0 !important}
.hard-top{padding-top:0 !important}
.hard-right{padding-right:0 !important}
.hard-bottom{padding-bottom:0 !important}
.hard-left{padding-left:0 !important}
.hard-ends{padding-top:0 !important;padding-bottom:0 !important}
.hard-sides{padding-right:0 !important;padding-left:0 !important}
.informative{cursor:help !important}
.muted{opacity:0.5 !important;filter:alpha(opacity=50) !important}
.proceed{text-align:right !important}
.go:after{content:"\00A0" "\00BB" !important}
.caps{text-transform:uppercase !important}
.unstyled{margin:0;padding:0;list-style-type:none}
.container{*zoom:1;width:1040px;padding-left:0;padding-right:0;margin-left:auto;margin-right:auto}
.container:after{content:"";display:table;clear:both}
.sep{margin:0 8px}
.btn{display:inline-block;vertical-align:middle;white-space:nowrap;font-family:inherit;font-size:100%;cursor:pointer;border:none;margin:0;padding-top:0;padding-bottom:0;line-height:3;padding-right:1em;padding-left:1em;border-radius:4px;border:1px solid #e2e2e2}
.btn,.btn:hover{text-decoration:none}
.btn:active,.btn:focus{outline:none}
.btn-small{line-height:2}
.btn-large{line-height:4;padding-left:1.5em;padding-right:1.5em}
.btn-extra-large{line-height:5;padding-left:2em;padding-right:2em}
.btn-full-width{width:100%;padding-left:0;padding-right:0;text-align:center}
.btn-default,.btn-default:visited{background:none;border:1px solid #e2e2e2;color:#333}
.btn-default:hover,.btn-default:focus,.btn-default:visited:hover,.btn-default:visited:focus{color:#333;border:1px solid #e9e9e9}
.btn-brand,.btn-brand:visited{background:#cd3737;border:none;color:#fff}
.btn-brand:hover,.btn-brand:focus,.btn-brand:visited:hover,.btn-brand:visited:focus{background:#a72a2a;border:none}
.btn-sub-brand,.btn-sub-brand:visited{background:#cd3737;border:none;color:#fff}
.btn-sub-brand:hover,.btn-sub-brand:focus,.btn-sub-brand:visited:hover,.btn-sub-brand:visited:focus{background:#a72a2a;border:none}
.btn-blue,.btn-blue:visited{background:#3498db;border:none;color:#fff}
.btn-blue:hover,.btn-blue:focus,.btn-blue:visited:hover,.btn-blue:visited:focus{background:#2980b9;border:none}
.btn-green,.btn-green:visited{background:#26a65b;border:none;color:#fff}
.btn-green:hover,.btn-green:focus,.btn-green:visited:hover,.btn-green:visited:focus{background:#16a085;border:none}
.btn-emerald,.btn-emerald:visited{background:#2ecc71;border:none;color:#fff}
.btn-emerald:hover,.btn-emerald:focus,.btn-emerald:visited:hover,.btn-emerald:visited:focus{background:#27ae60;border:none}
.btn-red,.btn-red:visited{background:#e74c3c;border:none;color:#fff}
.btn-red:hover,.btn-red:focus,.btn-red:visited:hover,.btn-red:visited:focus{background:#c0392b;border:none}
.btn-yellow,.btn-yellow:visited{background:#f1c40f;border:none;color:#fff}
.btn-yellow:hover,.btn-yellow:focus,.btn-yellow:visited:hover,.btn-yellow:visited:focus{background:#f39c12;border:none}
.btn-orange,.btn-orange:visited{background:#eb7347;border:none;color:#fff}
.btn-orange:hover,.btn-orange:focus,.btn-orange:visited:hover,.btn-orange:visited:focus{background:#d35400;border:none}
.btn-purple,.btn-purple:visited{background:#9b59b6;border:none;color:#fff}
.btn-purple:hover,.btn-purple:focus,.btn-purple:visited:hover,.btn-purple:visited:focus{background:#8e44ad;border:none}
.btn-navy,.btn-navy:visited{background:#34495e;border:none;color:#fff}
.btn-navy:hover,.btn-navy:focus,.btn-navy:visited:hover,.btn-navy:visited:focus{background:#2c3e50;border:none}
.btn-disabled,.btn-disabled:visited{background:#e2e2e2;border:none;color:#e9e9e9}
.btn-disabled:hover,.btn-disabled:focus,.btn-disabled:active,.btn-disabled:visited:hover,.btn-disabled:visited:focus,.btn-disabled:visited:active{background:#e2e2e2;border:none;cursor:text}
.btn-pill{border-radius:200px}
.btn-sharp{border-radius:0}
.nav{margin:0;padding:0;list-style:none}
.nav>li,.nav>li>a{display:inline-block;*display:inline;zoom:1}
.nav-vertical>li{display:list-item}
.nav-vertical>li>a{display:block}
.nav-centered{text-align:center}
.nav-fit{display:table;width:100%;text-align:center}
.nav-fit>li{display:table-cell}
.nav-fit>li>a{display:block}
.img-rounded,.img-bordered,.img-thumb{border-radius:4px}
.img-circle{border-radius:100%}
.img-bordered,.img-thumb{padding:4px;border:1px solid #e2e2e2}
.img-thumb:hover{border:1px solid #cd3737}
.message.error li{background:#e74c3c;color:white;padding:20px}
.message.success li{background:#26a65b;color:white;padding:20px}
.message li a,.message li a:visited{color:white;text-decoration:underline}
.breadcrumb>li+li:before{content:"\00BB" "\00A0";padding-left:4px}
.breadcrumb-path>li+li:before{content:"\002F" "\00A0";padding-left:4px;color:#e9e9e9}
.breadcrumb>li+li[data-breadcrumb]:before{content:attr(data-breadcrumb) "\00A0";padding-left:4px;color:#e9e9e9}
.breadcrumb-root{font-weight:bold}
.pagination{text-align:center;letter-spacing:-0.31em;word-spacing:-0.43em}
.pagination>li{padding:12px;letter-spacing:normal;word-spacing:normal}
.pagination>li>a{padding:12px;margin:-12px}
.pagination-first a:before{content:"\00AB" "\00A0"}
.pagination-last a:after{content:"\00A0" "\00BB"}
hr{color:#e2e2e2;border:none;border-bottom-width:1px;border-bottom-style:solid;margin-bottom:23px;margin-bottom:1.4375rem}
.rule-dotted{border-bottom-style:dotted}
.rule-dashed{border-bottom-style:dashed}
.rule-ornament{position:relative}
.rule-ornament:after{content:"\00A7";position:absolute;top:0;right:0;left:0;line-height:0;text-align:center}
.rule-ornament[data-ornament]:after{content:attr(data-ornament)}
.tabs2>ul{margin:0;padding:0}
.tabs2>ul:nth-child(1){border-bottom:1px solid #e9e9e9}
.tabs2>ul:nth-child(1) li{display:inline;float:left;padding:15px 20px;border:1px solid white;cursor:pointer;-webkit-touch-callout:none;-webkit-user-select:none;-khtml-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}
.tabs2>ul:nth-child(1) li.active{border-color:#e9e9e9;border-bottom:1px solid white;position:relative;z-index:2;bottom:-1px}
.tabs2>ul:nth-child(2){border:1px solid #e9e9e9;border-top:none}
.tabs2>ul:nth-child(2)>li{padding:20px}
.tabs>ul.head{text-align:center;margin:0 0 20px 0}
.tabs>ul.head li{font-size:16px;font-size:1rem;line-height:1.5;display:inline-block;padding:5px;cursor:pointer;text-transform:uppercase}
.tabs>ul.head li.active{color:#cd3737}
.tabs>ul.head li span{display:inline-block;margin-left:5px;color:#313131}
@-webkit-keyframes pulse{0%{opacity:1}
100%{opacity:0;transform:scale(2,2)}
}
@-moz-keyframes pulse{0%{opacity:1}
100%{opacity:0;transform:scale(2,2)}
}
@-o-keyframes pulse{0%{opacity:1}
100%{opacity:0;transform:scale(2,2)}
}
@keyframes pulse{0%{opacity:1}
100%{opacity:0;transform:scale(1.5,1.5)}
}
.flare-wrapper{position:relative}
.flare-wrapper .flare{-webkit-border-radius:3px;-moz-border-radius:3px;-ms-border-radius:3px;-o-border-radius:3px;border-radius:3px;display:none;position:absolute;width:300px;padding:15px;background:black;color:white;z-index:999}
.flare-wrapper .flare>.before{z-index:999;position:absolute;content:" ";width:0;height:0;border-style:solid}
.flare-wrapper .flare>.before:before{z-index:9991;position:absolute;content:" ";width:0;height:0;border-style:solid}
.flare-wrapper .flare[data-position="top-right"]{margin:0 0 0 20px;left:100%;top:-7px}
.flare-wrapper .flare[data-position="top-right"]>.before{left:-10px;top:10px;border-width:8px 10px 8px 0;border-color:transparent #000103 transparent transparent}
.flare-wrapper .flare[data-position="top-left"]{margin:0 20px 0 0;right:100%;top:-7px}
.flare-wrapper .flare[data-position="top-left"]>.before{right:-10px;top:10px;border-width:8px 0 8px 10px;border-color:transparent transparent transparent #000103}
.flare-wrapper .flare[data-position="top-center"]{margin:0 0 10px -150px;left:50%;bottom:100%}
.flare-wrapper .flare[data-position="top-center"]>.before{margin:0 0 0 -8px;left:50%;top:100%;border-width:10px 8px 0 8px;border-color:#000103 transparent transparent transparent}
.flare-wrapper .flare[data-position="bottom-center"]{margin:10px 0 0 -150px;left:50%;top:100%;background:#eee;border:3px solid black;color:#404040}
.flare-wrapper .flare[data-position="bottom-center"]>.before{margin:0 0 0 -8px;left:50%;bottom:100%;border-width:0 8px 10px 8px;border-color:transparent transparent #000103 transparent}
.flare-wrapper .flare[data-position="bottom-center"]>.before:before{top:4px;left:3px;margin:0 0 0 -8px;border-width:0 5px 7px 5px;border-color:transparent transparent #eee transparent}
.flare-wrapper .pointer{width:33px;height:33px;position:absolute;cursor:pointer;z-index:99}
.flare-wrapper .pointer.top-right{top:0;right:-45px}
.flare-wrapper .pointer.top-left{top:0;left:-45px}
.flare-wrapper .pointer.top-center{top:0;left:50%;margin-left:-16px}
.flare-wrapper .pointer.bottom-center{top:100%;left:50%;margin-left:-16px}
.flare-wrapper .pointer span{-webkit-border-radius:100%;-moz-border-radius:100%;-ms-border-radius:100%;-o-border-radius:100%;border-radius:100%;display:block;-webkit-animation:pulse 2s infinite;-moz-animation:pulse 2s infinite;-o-animation:pulse 2s infinite;animation:pulse 2s infinite;background:white}
.flare-wrapper .pointer>span{height:20px;width:20px;border:1px solid black;text-align:center}
.flare-wrapper .pointer>span:hover{border-color:red}
.flare-wrapper .pointer>span:hover span{border-color:orange}
.flare-wrapper .pointer>span>span{height:6px;width:6px;border:1px solid grey;margin:6px auto}
ul.flare-buttons{overflow:hidden;margin:20px 0 0 0}
ul.flare-buttons li{list-style:none;display:inline;float:left}
ul.flare-buttons li a,ul.flare-buttons li a:visited{display:block;padding:10px 15px;text-transform:uppercase;font-size:13px}
ul.flare-buttons li.okay a{-webkit-border-radius:3px 0px 0px 3px;-moz-border-radius:3px 0px 0px 3px;-ms-border-radius:3px 0px 0px 3px;-o-border-radius:3px 0px 0px 3px;border-radius:3px 0px 0px 3px;background:green;color:white}
ul.flare-buttons li.close a{-webkit-border-radius:0px 3px 3px 0px;-moz-border-radius:0px 3px 3px 0px;-ms-border-radius:0px 3px 3px 0px;-o-border-radius:0px 3px 3px 0px;border-radius:0px 3px 3px 0px;background:red;color:white}
body.demo-flare{font-family:arial,sans-serif}
body.demo-flare #top-nav{float:right;margin:5px 20px}
body.demo-flare #top-nav>li{display:inline;float:left;height:27px}
body.demo-flare #top-nav>li>a,body.demo-flare #top-nav>li>a:visited{display:block;padding:10px;font-size:13px;line-height:27px;vertical-align:middle;color:#404040}
body.demo-flare #top-nav>li>a>i,body.demo-flare #top-nav>li>a:visited>i{font-size:22px;margin:3px 0 0 0}
html.fsvs{height:100%;width:100%;position:fixed;top:0;left:0;overflow:hidden}
html.fsvs #fsvs-body{-webkit-backface-visibility:hidden;-webkit-perspective:1000;position:absolute;top:0;left:0;z-index:1;height:100%;width:100%}
html.fsvs #fsvs-body>*{height:100%;width:100%;overflow:hidden;-webkit-backface-visibility:hidden;-webkit-perspective:1000}
html.fsvs #fsvs-pagination{margin:0;padding:8px 4px;position:fixed;height:auto;right:-100px;top:50%;z-index:999;width:32px}
html.fsvs #fsvs-pagination li{list-style:none;width:25px;height:25px;line-height:25px;text-align:center;margin:0 0 2px 0;cursor:pointer}
html.fsvs #fsvs-pagination li>span{-webkit-border-radius:100%;-moz-border-radius:100%;-ms-border-radius:100%;-o-border-radius:100%;border-radius:100%;width:22px;height:22px;line-height:22px;border:1px solid white;display:block}
html.fsvs #fsvs-pagination li>span>span{-webkit-border-radius:100%;-moz-border-radius:100%;-ms-border-radius:100%;-o-border-radius:100%;border-radius:100%;width:12px;height:12px;line-height:12px;border:1px solid white;display:block;margin:4px}
html.fsvs #fsvs-pagination li.active>span{border:1px dashed white}
html.fsvs #fsvs-pagination li.active>span>span{background:white}
html.fsvs #fsvs-pagination li:last-child{margin:0}
html.fsvs.demo #fsvs-body>.slide{padding:40px;text-align:center}
html.fsvs.demo #fsvs-body>.slide h2{color:white;text-transform:uppercase;font-weight:bold;font-size:38px;font-size:2.375rem;line-height:1.26316}
html.fsvs.demo #fsvs-body>.slide p{font-size:22px;font-size:1.375rem;line-height:1.09091;color:white}
html.fsvs.demo #fsvs-body>.slide.nth-class-1{background:#eb7347}
html.fsvs.demo #fsvs-body>.slide.nth-class-2{background:#26a65b}
html.fsvs.demo #fsvs-body>.slide.nth-class-3{background:#d24d57}
html.fsvs.demo #fsvs-body>.slide pre{-webkit-border-radius:5px;-moz-border-radius:5px;-ms-border-radius:5px;-o-border-radius:5px;border-radius:5px;display:inline-block;padding:20px 60px;margin:40px 0}
@media only screen and (max-width:500px){html.fsvs #fsvs-body>.slide h2{font-size:18px;font-size:1.125rem;line-height:1.33333}
html.fsvs #fsvs-body>.slide p{font-size:18px;font-size:1.125rem;line-height:1.33333}
html.fsvs #fsvs-body>.slide p a{white-space:nowrap;overflow:hidden;-ms-text-overflow:ellipsis;-o-text-overflow:ellipsis;text-overflow:ellipsis;display:block}
html.fsvs #fsvs-body>.slide pre{max-width:100%;overflow:auto}
html.fsvs #fsvs-body>.slide pre code{float:left}
html.fsvs #fsvs-body #fsvs-pagination{right:3px !important}
}
body{font-family:'Open Sans',sans-serif}
#git{position:fixed;right:0;top:0;width:130px;height:130px;z-index:99999}
#git a,#git a:visited{font-size:38px;font-size:2.375rem;line-height:1.26316;color:grey;display:block;position:absolute;top:8px;right:10px;z-index:3}
#git:after{position:absolute;right:0;top:0;z-index:2;content:" ";width:0;height:0;border-style:solid;border-width:0 100px 100px 0;border-color:transparent #000000 transparent transparent}
header{position:fixed;left:0;top:0;z-index:999;width:100px !important;background:black;padding:20px;height:100%}
header a,header a:visited{-webkit-transition:all 0.5s;-moz-transition:all 0.5s;-o-transition:all 0.5s;transition:all 0.5s}
header h1{-webkit-transition:all 0.5s;-moz-transition:all 0.5s;-o-transition:all 0.5s;transition:all 0.5s;text-transform:uppercase;font-size:21px}
header ul{padding:20px}
header ul li{list-style:none;margin:0 0 5px 0;font-size:22px}
body.active-nth-slide-1 header h1,body.active-nth-slide-1 header a,body.active-nth-slide-1 header a:visited{color:#eb7347}
body.active-nth-slide-1 #fsvs-pagination li.active>span>span{background:#e65019}
body.active-nth-slide-2 header h1,body.active-nth-slide-2 header a,body.active-nth-slide-2 header a:visited{color:#26a65b}
body.active-nth-slide-2 #fsvs-pagination li.active>span>span{background:#1c7d44}
body.active-nth-slide-3 header h1,body.active-nth-slide-3 header a,body.active-nth-slide-3 header a:visited{color:#d24d57}
body.active-nth-slide-3 #fsvs-pagination li.active>span>span{background:#bc303a}
body.active-nth-slide-4 header h1,body.active-nth-slide-4 header a,body.active-nth-slide-4 header a:visited{color:#2c3e50}
body.active-nth-slide-4 #fsvs-pagination li.active>span>span{background:#1a242f}
.slide{padding:0px 40px 0px 100px}
.slide h2{font-size:22px;text-transform:uppercase}
.slide *,.slide a,.slide a:visited{color:white}
.slide .wrapper{position:relative;z-index:3}
.slide .wrapper>.left,.slide .wrapper>.right{width:50%;display:inline;float:left;padding:0 40px}
.slide .image-wrapper{position:absolute;z-index:2;width:100%;height:100%;background:url(/assets/images/bg.jpg) no-repeat center center;-webkit-background-size:cover;-moz-background-size:cover;-o-background-size:cover;background-size:cover}
.slide .colour-wrapper{filter:progid:DXImageTransform.Microsoft.Alpha(Opacity=80);opacity:0.8;position:absolute;z-index:2;width:100%;height:100%}
.slide .item{padding:30px}
.slide .item .description{margin:0 0 10px 0}
.slide .item p:last-child{margin:0}
.slide .demo{padding:30px;background:black;text-align:center}
.slide .demo p:last-child{margin:0}
.slide .link{white-space:nowrap;overflow:hidden;-ms-text-overflow:ellipsis;-o-text-overflow:ellipsis;text-overflow:ellipsis}
.slide .project-link a,.slide .project-link a:visited{-webkit-transition:all 1s;-moz-transition:all 1s;-o-transition:all 1s;transition:all 1s;white-space:nowrap;overflow:hidden;-ms-text-overflow:ellipsis;-o-text-overflow:ellipsis;text-overflow:ellipsis;display:inline-block;padding:10px 20px;text-align:center;text-decoration:none}
.slide .project-link a:hover,.slide .project-link a:visited:hover{background:black !important;color:white !important}
.slide.nth-class-1{background:#eb7347}
.slide.nth-class-1 .colour-wrapper,.slide.nth-class-1 .item{background:#eb7347}
.slide.nth-class-1 .colour-wrapper .project-link a,.slide.nth-class-1 .item .project-link a{background:#e65019}
.slide.nth-class-2{background:#26a65b}
.slide.nth-class-2 .colour-wrapper,.slide.nth-class-2 .item{background:#26a65b}
.slide.nth-class-2 .colour-wrapper .project-link a,.slide.nth-class-2 .item .project-link a{background:#1c7d44}
.slide.nth-class-3{background:#d24d57}
.slide.nth-class-3 .colour-wrapper,.slide.nth-class-3 .item{background:#d24d57}
.slide.nth-class-3 .colour-wrapper .project-link a,.slide.nth-class-3 .item .project-link a{background:#bc303a}
.slide.nth-class-4{background:#2c3e50}
.slide.nth-class-4 .colour-wrapper,.slide.nth-class-4 .item{background:#2c3e50}
.slide.nth-class-4 .colour-wrapper .project-link a,.slide.nth-class-4 .item .project-link a{background:#1a242f}
@media only screen and (max-width:769px){html body #git{margin:15px 20px 0 0}
html body #git:after{display:none}
html body header{width:100% !important;height:100px !important}
html body header h1{font-size:14px;font-size:0.875rem;line-height:1.71429;line-height:20px}
html body header h1,html body header ul{display:inline;float:left}
html body header ul{padding:15px 20px 15px 15px;float:right;margin:0 20px 0 0}
html body header ul li{display:inline;float:left;margin:0 20px 0 0}
html body .slide{padding:0px}
html body .slide>.wrapper>.left,html body .slide>.wrapper>.right{width:100%;padding:0 80px}
html body .slide>.wrapper>.left .demo,html body .slide>.wrapper>.right .demo{margin:120px 0 0 0 !important}
html body .slide>.wrapper>.left .item,html body .slide>.wrapper>.right .item{margin:20px 0 0 0 !important}
}
@media only screen and (max-width:360px){html body #git{margin:5px}
html body header{height:80px !important;padding:13px 15px}
html body header h1{font-size:14px}
html body header ul{padding:10px}
html body>#fsvs-body .slide .wrapper>.left{padding:20px 20px 20px 20px}
html body>#fsvs-body .slide .wrapper>.left .demo{margin:80px 0 0 0 !important}
html body>#fsvs-body .slide .wrapper>.left .demo p{font-size:14px;font-size:0.875rem;line-height:1.71429}
html body>#fsvs-body .slide .wrapper>.right{padding:0 20px}
html body>#fsvs-body .slide .wrapper>.right .item{margin:0 !important}
html body>#fsvs-body .slide .wrapper>.right .item .description p{font-size:14px;font-size:0.875rem;line-height:1.71429}
html body #fsvs-pagination{display:none}
}
.single-page{padding:40px;overflow:hidden}
.single-page>.left{width:31.79724%;float:left;margin-right:2.30415%;display:inline}
.single-page>.right{width:65.89862%;float:right;margin-right:0;*margin-left:-20px;display:inline;padding:0 100px 60px 0}
.single-page>.right>ul{padding:0 0 0 20px}
.single-page>.right pre{display:block;margin:0 0 40px 0}
.single-page>.right pre code{display:block;float:left}
.single-page>.right ul.nav-main{margin-bottom:40px}
.single-page>.right #disqus_thread{margin:100px 0 0 0}
.single-page .image{margin:20px 0 40px 0}
.menu{-webkit-border-radius:4px;-moz-border-radius:4px;-ms-border-radius:4px;-o-border-radius:4px;border-radius:4px;border:1px dashed #26a65b;padding:20px;background:#fadcd1;margin:0}
.menu li{position:relative;margin:0 0 2px 0;list-style:none;overflow:hidden;display:block;color:white}
.menu li.ghost span{filter:progid:DXImageTransform.Microsoft.Alpha(Opacity=80);opacity:0.8;background:#e74c3c}
.menu li>span{-webkit-transition:all 0.2s;-moz-transition:all 0.2s;-o-transition:all 0.2s;transition:all 0.2s;background:#eb7347;padding:7px 15px;float:left;cursor:move}
.menu li>span:hover{background:#e65019}
#get-data{margin:20px 0;padding:10px 20px;background:#eb7347;color:white;display:inline-block}
#sd>div{background:black;color:white;padding:20px;margin:20px 0}
.development-warning{font-size:18px;font-size:1.125rem;line-height:1.33333;padding:20px;background:#d24d57;margin:0 0 40px 0;overflow:hidden;color:white}
.development-warning i{font-size:38px;font-size:2.375rem;line-height:1.26316;display:inline;float:left;margin:0 20px 0px 0}
.development-warning p{margin:0 20px 0 0}
@media only screen and (max-width:769px){body .single-page{padding:140px 20px 20px 20px}
body .single-page>.left{display:none}
body .single-page>.right{width:auto;display:block;float:none;padding:0}
body .single-page>.right h1{font-size:22px;font-weight:bold}
}
@media only screen and (max-width:360px){body .single-page{padding:100px 20px 20px 20px}
body .single-page>.left{display:none}
body .single-page>.right{width:auto;display:block;float:none;padding:0}
body .single-page>.right h1{font-size:22px;font-weight:bold}
}
code[class*="language-"],pre[class*="language-"]{color:black;text-shadow:0 1px white;font-family:Consolas,Monaco,'Andale Mono',monospace;direction:ltr;text-align:left;white-space:pre;word-spacing:normal;word-break:normal;-moz-tab-size:4;-o-tab-size:4;tab-size:4;-webkit-hyphens:none;-moz-hyphens:none;-ms-hyphens:none;hyphens:none}
pre[class*="language-"]::-moz-selection,pre[class*="language-"]::-moz-selection,code[class*="language-"]::-moz-selection,code[class*="language-"]::-moz-selection{text-shadow:none;background:#b3d4fc}
pre[class*="language-"]::selection,pre[class*="language-"]::selection,code[class*="language-"]::selection,code[class*="language-"]::selection{text-shadow:none;background:#b3d4fc}
@media print{code[class*="language-"],pre[class*="language-"]{text-shadow:none}
}
pre[class*="language-"]{padding:1em;margin:.5em 0;overflow:auto}
:not(pre)>code[class*="language-"],pre[class*="language-"]{background:#f5f2f0}
:not(pre)>code[class*="language-"]{padding:.1em;border-radius:.3em}
.token.comment,.token.prolog,.token.doctype,.token.cdata{color:slategray}
.token.punctuation{color:#999}
.namespace{opacity:.7}
.token.property,.token.tag,.token.boolean,.token.number,.token.constant,.token.symbol{color:#905}
.token.selector,.token.attr-name,.token.string,.token.builtin{color:#690}
.token.operator,.token.entity,.token.url,.language-css .token.string,.style .token.string,.token.variable{color:#a67f59;background:rgba(255,255,255,0.5)}
.token.atrule,.token.attr-value,.token.keyword{color:#07a}
.token.function{color:#DD4A68}
.token.regex,.token.important{color:#e90}
.token.important{font-weight:bold}
.token.entity{cursor:help}
.magic-accordion ul.actions{margin:0 0 20px 0;overflow:hidden;padding:0}
.magic-accordion ul.actions li{display:inline;float:left;list-style:none;margin:0 1px 0 0}
.magic-accordion ul.actions li a,.magic-accordion ul.actions li a:visited{display:inline-block;background:#e74c3c;color:white;padding:10px 20px;font-weight:bold}
.magic-accordion ul.actions li a:hover,.magic-accordion ul.actions li a:visited:hover{text-decoration:none}
.magic-accordion .magic-accordion .head{display:block;padding:10px 20px;font-size:16px;cursor:pointer;background:#26a65b;color:white;font-weight:bold;margin:0;border-bottom:1px dotted white}
.magic-accordion .magic-accordion .head.active{background:#e74c3c;border-bottom:1px solid #e74c3c}
.magic-accordion .magic-accordion .body{padding:20px;border-left:1px dotted #e74c3c;border-right:1px dotted #e74c3c;border-bottom:1px dotted #e74c3c}
.magic-accordion ul{margin:0 0 20px 20px}

CSS代码(style.css):

article,aside,details,figcaption,figure,footer,header,hgroup,nav,section,main,summary{display:block}
audio,canvas,video{display:inline-block;*display:inline;*zoom:1}
audio:not([controls]){display:none}
[hidden]{display:none}
html{font-size:100%;-webkit-text-size-adjust:100%;-ms-text-size-adjust:100%}
html,button,input,select,textarea{font-family:sans-serif}
body{margin:0}
a:focus{outline:thin dotted}
a:hover,a:active{outline:0}
h1{font-size:2em;margin:0.67em 0}
h2{font-size:1.5em;margin:0.83em 0}
h3{font-size:1.17em;margin:1em 0}
h4{font-size:1em;margin:1.33em 0}
h5{font-size:0.83em;margin:1.67em 0}
h6{font-size:0.75em;margin:2.33em 0}
abbr[title]{border-bottom:1px dotted}
b,strong{font-weight:bold}
blockquote{margin:1em 40px}
dfn{font-style:italic}
mark{background:#ff0;color:#000}
p,pre{margin:1em 0}
pre,code,kbd,samp{font-family:monospace,serif;_font-family:'courier new',monospace;font-size:1em}
pre{white-space:pre;white-space:pre-wrap;word-wrap:break-word}
q{quotes:none}
q:before,q:after{content:'';content:none}
small{font-size:75%}
sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}
sup{top:-0.5em}
sub{bottom:-0.25em}
dl,menu,ol,ul{margin:0}
dd{margin:0 0 0 40px}
menu,ol,ul{padding:0 0 0 0}
nav ul,nav ol{list-style:none;list-style-image:none}
img{border:0;-ms-interpolation-mode:bicubic}
svg:not(:root){overflow:hidden}
figure{margin:0}
form{margin:0}
fieldset{border:1px solid #c0c0c0;margin:0 2px;padding:0.35em 0.625em 0.75em}
legend{border:0;padding:0;white-space:normal;*margin-left:-7px}
button,input,select,textarea{font-size:100%;margin:0;vertical-align:baseline;*vertical-align:middle}
button,input{line-height:normal}
button,input[type="button"],input[type="reset"],input[type="submit"]{cursor:pointer;-webkit-appearance:button;*overflow:visible}
button[disabled],input[disabled]{cursor:default}
input[type="checkbox"],input[type="radio"]{box-sizing:border-box;padding:0;*height:13px;*width:13px}
input[type="search"]{-webkit-appearance:textfield;-moz-box-sizing:content-box;-webkit-box-sizing:content-box;box-sizing:content-box}
input[type="search"]::-webkit-search-decoration,input[type="search"]::-webkit-search-cancel-button{-webkit-appearance:none}
button::-moz-focus-inner,input::-moz-focus-inner{border:0;padding:0}
textarea{overflow:auto;vertical-align:top}
table{border-collapse:collapse;border-spacing:0}
*,*:before,*:after{-moz-box-sizing:border-box;-webkit-box-sizing:border-box;box-sizing:border-box}
h1,h2,h3,h4,h5,h6,p,blockquote,pre,dl,dd,ol,ul,form,fieldset,legend,table,th,td,caption,hr{margin:0;padding:0}
abbr[title],dfn[title]{cursor:help}
u,ins{text-decoration:none}
ins{border-bottom:1px solid}
img{font-style:italic}
.cf:after{content:" ";display:table;clear:both}
h1,h2,h3,h4,h5,h6,hgroup,ul,ol,dl,blockquote,p,address,table,fieldset,figure,pre,.form-fields>li{margin-bottom:24px;margin-bottom:1.5rem}
.double-margin{margin-bottom:48px;margin-bottom:3rem}
hr{margin-bottom:22px;margin-bottom:1.375rem}
html{font:1em/1.5 "Open Sans",sans-serif;overflow-y:scroll;min-height:100%}
body{background:#fff;color:#555;-webkit-font-smoothing:antialiased}
h1,h2,h3,h4,h5,h6{color:#555;font-family:"Open Sans",sans-serif;font-weight:300}
h1,.h1{font-size:36px;font-size:2.25rem;line-height:1.33333}
h2,.h2{font-size:30px;font-size:1.875rem;line-height:1.6}
h3,.h3{font-size:24px;font-size:1.5rem;line-height:1}
h4,.h4{font-size:20px;font-size:1.25rem;line-height:1.2}
h5,.h5{font-size:16px;font-size:1rem;line-height:1.5}
h6,.h6{font-size:14px;font-size:0.875rem;line-height:1.71429}
h1 a,h2 a,h3 a,h4 a,h5 a,h6 a{font-weight:inherit}
.giga{font-size:96px;font-size:6rem;line-height:1}
.mega{font-size:72px;font-size:4.5rem;line-height:1}
.kilo{font-size:48px;font-size:3rem;line-height:1}
.smaller{font-size:12px;font-size:0.75rem;line-height:2}
.tiny{font-size:10px;font-size:0.625rem;line-height:2.4}
.lead{font-size:18px;font-size:1.125rem;line-height:1.33333}
.smaller{font-size:12px;font-size:0.75rem;line-height:2}
.tiny{font-size:10px;font-size:0.625rem;line-height:2.4}
a,a:visited{color:#cd3737;text-decoration:none;-webkit-transition:color 0.2s;-moz-transition:color 0.2s;-o-transition:color 0.2s;transition:color 0.2s;-webkit-transition:background 0.2s;-moz-transition:background 0.2s;-o-transition:background 0.2s;transition:background 0.2s}
a:hover,a:focus{color:#a72a2a}
li>ul,li>ol{margin:0}
blockquote{text-indent:-0.41em}
blockquote p:last-of-type{margin-bottom:0}
.source{display:block;text-indent:0}
.source:before{content:"\2014"}
img{max-width:100%;height:auto}
img[width],img[height]{max-width:none}
.img-right{float:right;margin-bottom:24px;margin-left:24px}
.img-left{float:left;margin-right:24px;margin-bottom:24px}
.img-center{display:block;margin-right:auto;margin-bottom:24px;margin-left:auto}
.img-short{height:120px}
.img-medium{height:240px}
.img-tall{height:360px}
figure>img{display:block}
pre{overflow:auto}
pre mark{background:none;border-bottom:1px solid;color:inherit}
.code-comment{opacity:0.75;filter:alpha(opacity=75)}
.line-numbers{font-family:monospace,serif;list-style:decimal-leading-zero inside;white-space:nowrap;overflow:auto;margin-left:0}
.line-numbers code{white-space:pre}
fieldset{padding:24px;border:1px solid #e2e2e2}
input[type="text"],input[type="email"],input[type="tel"],input[type="date"],input[type="number"],input[type="password"],input[type="time"],input[type="url"],input[type="search"],.text-input,textarea{width:100%;font-size:12px;font-size:0.75rem;line-height:2;border:1px solid #e2e2e2;border-radius:4px;padding:5px 10px;box-shadow:0 1px 4px 0 #ddd inset}
input[type="text"]:focus,input[type="email"]:focus,input[type="tel"]:focus,input[type="date"]:focus,input[type="number"]:focus,input[type="password"]:focus,input[type="time"]:focus,input[type="url"]:focus,input[type="search"]:focus,.text-input:focus,textarea:focus{outline:none;border:1px solid #cd3737;box-shadow:0 0 3px 0 #aaa}
input[type="search"]{-webkit-appearance:textfield;-moz-box-sizing:border-box;-webkit-box-sizing:border-box;box-sizing:border-box}
.form-fields{list-style:none;margin:0}
.form-fields>li:last-child{margin-bottom:0}
label,.label{display:block}
.additional{display:block;font-weight:normal}
.check-list{list-style:none;margin:0}
.check-label,.check-list label,.check-list .label{display:inline-block}
.spoken-form label{display:inline-block;font:inherit}
.extra-help{display:inline-block;visibility:hidden}
.text-input:active+.extra-help,.text-input:focus+.extra-help{visibility:visible}
table{width:100%}
th,td{padding:6px;text-align:left}
@media screen and (min-width:480px){th,td{padding:12px}
}
[colspan]{text-align:center}
[colspan="1"]{text-align:left}
[rowspan]{vertical-align:middle}
[rowspan="1"]{vertical-align:top}
.numerical{text-align:right}
.t5{width:5%}
.t10{width:10%}
.t12{width:12.5%}
.t15{width:15%}
.t20{width:20%}
.t25{width:25%}
.t30{width:30%}
.t33{width:33.333%}
.t35{width:35%}
.t37{width:37.5%}
.t40{width:40%}
.t45{width:45%}
.t50{width:50%}
.t55{width:55%}
.t60{width:60%}
.t62{width:62.5%}
.t65{width:65%}
.t66{width:66.666%}
.t70{width:70%}
.t75{width:75%}
.t80{width:80%}
.t85{width:85%}
.t87{width:87.5%}
.t90{width:90%}
.t95{width:95%}
.table-bordered th,.table-bordered td{border:1px solid #cd3737}
.table-bordered th:empty,.table-bordered td:empty{border:none}
.table-bordered thead tr:last-child th{border-bottom-width:2px}
.table-bordered tbody tr th:last-of-type{border-right-width:2px}
.table-striped tbody tr:nth-of-type(odd){background-color:#fafafa}
.table-data{font:12px/1.5 sans-serif}
.container{*zoom:1;width:1040px;padding-left:0;padding-right:0;margin-left:auto;margin-right:auto}
.container:after{content:"";display:table;clear:both}
.float-right{float:right !important}
.float-left{float:left !important}
.float-none{float:none !important}
.text-left{text-align:left !important}
.text-center{text-align:center !important}
.text-right{text-align:right !important}
.weight-light{font-weight:300 !important}
.weight-normal{font-weight:400 !important}
.weight-semibold{font-weight:600 !important}
.push{margin:24px !important}
.push-top{margin-top:24px !important}
.push-right{margin-right:24px !important}
.push-bottom{margin-bottom:24px !important}
.push-left{margin-left:24px !important}
.push-ends{margin-top:24px !important;margin-bottom:24px !important}
.push-sides{margin-right:24px !important;margin-left:24px !important}
.push-half{margin:12px !important}
.push-half-top{margin-top:12px !important}
.push-half-right{margin-right:12px !important}
.push-half-bottom{margin-bottom:12px !important}
.push-half-left{margin-left:12px !important}
.push-half-ends{margin-top:12px !important;margin-bottom:12px !important}
.push-half-sides{margin-right:12px !important;margin-left:12px !important}
.flush{margin:0 !important}
.flush-top{margin-top:0 !important}
.flush-right{margin-right:0 !important}
.flush-bottom{margin-bottom:0 !important}
.flush-left{margin-left:0 !important}
.flush-ends{margin-top:0 !important;margin-bottom:0 !important}
.flush-sides{margin-right:0 !important;margin-left:0 !important}
.soft{padding:24px !important}
.soft-top{padding-top:24px !important}
.soft-right{padding-right:24px !important}
.soft-bottom{padding-bottom:24px !important}
.soft-left{padding-left:24px !important}
.soft-ends{padding-top:24px !important;padding-bottom:24px !important}
.soft-sides{padding-right:24px !important;padding-left:24px !important}
.soft-half{padding:12px !important}
.soft-half-top{padding-top:12px !important}
.soft-half-right{padding-right:12px !important}
.soft-half-bottom{padding-bottom:12px !important}
.soft-half-left{padding-left:12px !important}
.soft-half-ends{padding-top:12px !important;padding-bottom:12px !important}
.soft-half-sides{padding-right:12px !important;padding-left:12px !important}
.hard{padding:0 !important}
.hard-top{padding-top:0 !important}
.hard-right{padding-right:0 !important}
.hard-bottom{padding-bottom:0 !important}
.hard-left{padding-left:0 !important}
.hard-ends{padding-top:0 !important;padding-bottom:0 !important}
.hard-sides{padding-right:0 !important;padding-left:0 !important}
.informative{cursor:help !important}
.muted{opacity:0.5 !important;filter:alpha(opacity=50) !important}
.proceed{text-align:right !important}
.go:after{content:"\00A0" "\00BB" !important}
.caps{text-transform:uppercase !important}
.unstyled{margin:0;padding:0;list-style-type:none}
.container{*zoom:1;width:1040px;padding-left:0;padding-right:0;margin-left:auto;margin-right:auto}
.container:after{content:"";display:table;clear:both}
.sep{margin:0 8px}
.btn{display:inline-block;vertical-align:middle;white-space:nowrap;font-family:inherit;font-size:100%;cursor:pointer;border:none;margin:0;padding-top:0;padding-bottom:0;line-height:3;padding-right:1em;padding-left:1em;border-radius:4px;border:1px solid #e2e2e2}
.btn,.btn:hover{text-decoration:none}
.btn:active,.btn:focus{outline:none}
.btn-small{line-height:2}
.btn-large{line-height:4;padding-left:1.5em;padding-right:1.5em}
.btn-extra-large{line-height:5;padding-left:2em;padding-right:2em}
.btn-full-width{width:100%;padding-left:0;padding-right:0;text-align:center}
.btn-default,.btn-default:visited{background:none;border:1px solid #e2e2e2;color:#333}
.btn-default:hover,.btn-default:focus,.btn-default:visited:hover,.btn-default:visited:focus{color:#333;border:1px solid #e9e9e9}
.btn-brand,.btn-brand:visited{background:#cd3737;border:none;color:#fff}
.btn-brand:hover,.btn-brand:focus,.btn-brand:visited:hover,.btn-brand:visited:focus{background:#a72a2a;border:none}
.btn-sub-brand,.btn-sub-brand:visited{background:#cd3737;border:none;color:#fff}
.btn-sub-brand:hover,.btn-sub-brand:focus,.btn-sub-brand:visited:hover,.btn-sub-brand:visited:focus{background:#a72a2a;border:none}
.btn-blue,.btn-blue:visited{background:#3498db;border:none;color:#fff}
.btn-blue:hover,.btn-blue:focus,.btn-blue:visited:hover,.btn-blue:visited:focus{background:#2980b9;border:none}
.btn-green,.btn-green:visited{background:#26a65b;border:none;color:#fff}
.btn-green:hover,.btn-green:focus,.btn-green:visited:hover,.btn-green:visited:focus{background:#16a085;border:none}
.btn-emerald,.btn-emerald:visited{background:#2ecc71;border:none;color:#fff}
.btn-emerald:hover,.btn-emerald:focus,.btn-emerald:visited:hover,.btn-emerald:visited:focus{background:#27ae60;border:none}
.btn-red,.btn-red:visited{background:#e74c3c;border:none;color:#fff}
.btn-red:hover,.btn-red:focus,.btn-red:visited:hover,.btn-red:visited:focus{background:#c0392b;border:none}
.btn-yellow,.btn-yellow:visited{background:#f1c40f;border:none;color:#fff}
.btn-yellow:hover,.btn-yellow:focus,.btn-yellow:visited:hover,.btn-yellow:visited:focus{background:#f39c12;border:none}
.btn-orange,.btn-orange:visited{background:#eb7347;border:none;color:#fff}
.btn-orange:hover,.btn-orange:focus,.btn-orange:visited:hover,.btn-orange:visited:focus{background:#d35400;border:none}
.btn-purple,.btn-purple:visited{background:#9b59b6;border:none;color:#fff}
.btn-purple:hover,.btn-purple:focus,.btn-purple:visited:hover,.btn-purple:visited:focus{background:#8e44ad;border:none}
.btn-navy,.btn-navy:visited{background:#34495e;border:none;color:#fff}
.btn-navy:hover,.btn-navy:focus,.btn-navy:visited:hover,.btn-navy:visited:focus{background:#2c3e50;border:none}
.btn-disabled,.btn-disabled:visited{background:#e2e2e2;border:none;color:#e9e9e9}
.btn-disabled:hover,.btn-disabled:focus,.btn-disabled:active,.btn-disabled:visited:hover,.btn-disabled:visited:focus,.btn-disabled:visited:active{background:#e2e2e2;border:none;cursor:text}
.btn-pill{border-radius:200px}
.btn-sharp{border-radius:0}
.nav{margin:0;padding:0;list-style:none}
.nav>li,.nav>li>a{display:inline-block;*display:inline;zoom:1}
.nav-vertical>li{display:list-item}
.nav-vertical>li>a{display:block}
.nav-centered{text-align:center}
.nav-fit{display:table;width:100%;text-align:center}
.nav-fit>li{display:table-cell}
.nav-fit>li>a{display:block}
.img-rounded,.img-bordered,.img-thumb{border-radius:4px}
.img-circle{border-radius:100%}
.img-bordered,.img-thumb{padding:4px;border:1px solid #e2e2e2}
.img-thumb:hover{border:1px solid #cd3737}
.message.error li{background:#e74c3c;color:white;padding:20px}
.message.success li{background:#26a65b;color:white;padding:20px}
.message li a,.message li a:visited{color:white;text-decoration:underline}
.breadcrumb>li+li:before{content:"\00BB" "\00A0";padding-left:4px}
.breadcrumb-path>li+li:before{content:"\002F" "\00A0";padding-left:4px;color:#e9e9e9}
.breadcrumb>li+li[data-breadcrumb]:before{content:attr(data-breadcrumb) "\00A0";padding-left:4px;color:#e9e9e9}
.breadcrumb-root{font-weight:bold}
.pagination{text-align:center;letter-spacing:-0.31em;word-spacing:-0.43em}
.pagination>li{padding:12px;letter-spacing:normal;word-spacing:normal}
.pagination>li>a{padding:12px;margin:-12px}
.pagination-first a:before{content:"\00AB" "\00A0"}
.pagination-last a:after{content:"\00A0" "\00BB"}
hr{color:#e2e2e2;border:none;border-bottom-width:1px;border-bottom-style:solid;margin-bottom:23px;margin-bottom:1.4375rem}
.rule-dotted{border-bottom-style:dotted}
.rule-dashed{border-bottom-style:dashed}
.rule-ornament{position:relative}
.rule-ornament:after{content:"\00A7";position:absolute;top:0;right:0;left:0;line-height:0;text-align:center}
.rule-ornament[data-ornament]:after{content:attr(data-ornament)}
.tabs2>ul{margin:0;padding:0}
.tabs2>ul:nth-child(1){border-bottom:1px solid #e9e9e9}
.tabs2>ul:nth-child(1) li{display:inline;float:left;padding:15px 20px;border:1px solid white;cursor:pointer;-webkit-touch-callout:none;-webkit-user-select:none;-khtml-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}
.tabs2>ul:nth-child(1) li.active{border-color:#e9e9e9;border-bottom:1px solid white;position:relative;z-index:2;bottom:-1px}
.tabs2>ul:nth-child(2){border:1px solid #e9e9e9;border-top:none}
.tabs2>ul:nth-child(2)>li{padding:20px}
.tabs>ul.head{text-align:center;margin:0 0 20px 0}
.tabs>ul.head li{font-size:16px;font-size:1rem;line-height:1.5;display:inline-block;padding:5px;cursor:pointer;text-transform:uppercase}
.tabs>ul.head li.active{color:#cd3737}
.tabs>ul.head li span{display:inline-block;margin-left:5px;color:#313131}
@-webkit-keyframes pulse{0%{opacity:1}
100%{opacity:0;transform:scale(2,2)}
}
@-moz-keyframes pulse{0%{opacity:1}
100%{opacity:0;transform:scale(2,2)}
}
@-o-keyframes pulse{0%{opacity:1}
100%{opacity:0;transform:scale(2,2)}
}
@keyframes pulse{0%{opacity:1}
100%{opacity:0;transform:scale(1.5,1.5)}
}
.flare-wrapper{position:relative}
.flare-wrapper .flare{-webkit-border-radius:3px;-moz-border-radius:3px;-ms-border-radius:3px;-o-border-radius:3px;border-radius:3px;display:none;position:absolute;width:300px;padding:15px;background:black;color:white;z-index:999}
.flare-wrapper .flare>.before{z-index:999;position:absolute;content:" ";width:0;height:0;border-style:solid}
.flare-wrapper .flare>.before:before{z-index:9991;position:absolute;content:" ";width:0;height:0;border-style:solid}
.flare-wrapper .flare[data-position="top-right"]{margin:0 0 0 20px;left:100%;top:-7px}
.flare-wrapper .flare[data-position="top-right"]>.before{left:-10px;top:10px;border-width:8px 10px 8px 0;border-color:transparent #000103 transparent transparent}
.flare-wrapper .flare[data-position="top-left"]{margin:0 20px 0 0;right:100%;top:-7px}
.flare-wrapper .flare[data-position="top-left"]>.before{right:-10px;top:10px;border-width:8px 0 8px 10px;border-color:transparent transparent transparent #000103}
.flare-wrapper .flare[data-position="top-center"]{margin:0 0 10px -150px;left:50%;bottom:100%}
.flare-wrapper .flare[data-position="top-center"]>.before{margin:0 0 0 -8px;left:50%;top:100%;border-width:10px 8px 0 8px;border-color:#000103 transparent transparent transparent}
.flare-wrapper .flare[data-position="bottom-center"]{margin:10px 0 0 -150px;left:50%;top:100%;background:#eee;border:3px solid black;color:#404040}
.flare-wrapper .flare[data-position="bottom-center"]>.before{margin:0 0 0 -8px;left:50%;bottom:100%;border-width:0 8px 10px 8px;border-color:transparent transparent #000103 transparent}
.flare-wrapper .flare[data-position="bottom-center"]>.before:before{top:4px;left:3px;margin:0 0 0 -8px;border-width:0 5px 7px 5px;border-color:transparent transparent #eee transparent}
.flare-wrapper .pointer{width:33px;height:33px;position:absolute;cursor:pointer;z-index:99}
.flare-wrapper .pointer.top-right{top:0;right:-45px}
.flare-wrapper .pointer.top-left{top:0;left:-45px}
.flare-wrapper .pointer.top-center{top:0;left:50%;margin-left:-16px}
.flare-wrapper .pointer.bottom-center{top:100%;left:50%;margin-left:-16px}
.flare-wrapper .pointer span{-webkit-border-radius:100%;-moz-border-radius:100%;-ms-border-radius:100%;-o-border-radius:100%;border-radius:100%;display:block;-webkit-animation:pulse 2s infinite;-moz-animation:pulse 2s infinite;-o-animation:pulse 2s infinite;animation:pulse 2s infinite;background:white}
.flare-wrapper .pointer>span{height:20px;width:20px;border:1px solid black;text-align:center}
.flare-wrapper .pointer>span:hover{border-color:red}
.flare-wrapper .pointer>span:hover span{border-color:orange}
.flare-wrapper .pointer>span>span{height:6px;width:6px;border:1px solid grey;margin:6px auto}
ul.flare-buttons{overflow:hidden;margin:20px 0 0 0}
ul.flare-buttons li{list-style:none;display:inline;float:left}
ul.flare-buttons li a,ul.flare-buttons li a:visited{display:block;padding:10px 15px;text-transform:uppercase;font-size:13px}
ul.flare-buttons li.okay a{-webkit-border-radius:3px 0px 0px 3px;-moz-border-radius:3px 0px 0px 3px;-ms-border-radius:3px 0px 0px 3px;-o-border-radius:3px 0px 0px 3px;border-radius:3px 0px 0px 3px;background:green;color:white}
ul.flare-buttons li.close a{-webkit-border-radius:0px 3px 3px 0px;-moz-border-radius:0px 3px 3px 0px;-ms-border-radius:0px 3px 3px 0px;-o-border-radius:0px 3px 3px 0px;border-radius:0px 3px 3px 0px;background:red;color:white}
body.demo-flare{font-family:arial,sans-serif}
body.demo-flare #top-nav{float:right;margin:5px 20px}
body.demo-flare #top-nav>li{display:inline;float:left;height:27px}
body.demo-flare #top-nav>li>a,body.demo-flare #top-nav>li>a:visited{display:block;padding:10px;font-size:13px;line-height:27px;vertical-align:middle;color:#404040}
body.demo-flare #top-nav>li>a>i,body.demo-flare #top-nav>li>a:visited>i{font-size:22px;margin:3px 0 0 0}
html.fsvs{height:100%;width:100%;position:fixed;top:0;left:0;overflow:hidden}
html.fsvs #fsvs-body{-webkit-backface-visibility:hidden;-webkit-perspective:1000;position:absolute;top:0;left:0;z-index:1;height:100%;width:100%}
html.fsvs #fsvs-body>*{height:100%;width:100%;overflow:hidden;-webkit-backface-visibility:hidden;-webkit-perspective:1000}
html.fsvs #fsvs-pagination{margin:0;padding:8px 4px;position:fixed;height:auto;right:-100px;top:50%;z-index:999;width:32px}
html.fsvs #fsvs-pagination li{list-style:none;width:25px;height:25px;line-height:25px;text-align:center;margin:0 0 2px 0;cursor:pointer}
html.fsvs #fsvs-pagination li>span{-webkit-border-radius:100%;-moz-border-radius:100%;-ms-border-radius:100%;-o-border-radius:100%;border-radius:100%;width:22px;height:22px;line-height:22px;border:1px solid white;display:block}
html.fsvs #fsvs-pagination li>span>span{-webkit-border-radius:100%;-moz-border-radius:100%;-ms-border-radius:100%;-o-border-radius:100%;border-radius:100%;width:12px;height:12px;line-height:12px;border:1px solid white;display:block;margin:4px}
html.fsvs #fsvs-pagination li.active>span{border:1px dashed white}
html.fsvs #fsvs-pagination li.active>span>span{background:white}
html.fsvs #fsvs-pagination li:last-child{margin:0}
html.fsvs.demo #fsvs-body>.slide{padding:40px;text-align:center}
html.fsvs.demo #fsvs-body>.slide h2{color:white;text-transform:uppercase;font-weight:bold;font-size:38px;font-size:2.375rem;line-height:1.26316}
html.fsvs.demo #fsvs-body>.slide p{font-size:22px;font-size:1.375rem;line-height:1.09091;color:white}
html.fsvs.demo #fsvs-body>.slide.nth-class-1{background:#eb7347}
html.fsvs.demo #fsvs-body>.slide.nth-class-2{background:#26a65b}
html.fsvs.demo #fsvs-body>.slide.nth-class-3{background:#d24d57}
html.fsvs.demo #fsvs-body>.slide pre{-webkit-border-radius:5px;-moz-border-radius:5px;-ms-border-radius:5px;-o-border-radius:5px;border-radius:5px;display:inline-block;padding:20px 60px;margin:40px 0}
@media only screen and (max-width:500px){html.fsvs #fsvs-body>.slide h2{font-size:18px;font-size:1.125rem;line-height:1.33333}
html.fsvs #fsvs-body>.slide p{font-size:18px;font-size:1.125rem;line-height:1.33333}
html.fsvs #fsvs-body>.slide p a{white-space:nowrap;overflow:hidden;-ms-text-overflow:ellipsis;-o-text-overflow:ellipsis;text-overflow:ellipsis;display:block}
html.fsvs #fsvs-body>.slide pre{max-width:100%;overflow:auto}
html.fsvs #fsvs-body>.slide pre code{float:left}
html.fsvs #fsvs-body #fsvs-pagination{right:3px !important}
}
body{font-family:'Open Sans',sans-serif}
#git{position:fixed;right:0;top:0;width:130px;height:130px;z-index:99999}
#git a,#git a:visited{font-size:38px;font-size:2.375rem;line-height:1.26316;color:grey;display:block;position:absolute;top:8px;right:10px;z-index:3}
#git:after{position:absolute;right:0;top:0;z-index:2;content:" ";width:0;height:0;border-style:solid;border-width:0 100px 100px 0;border-color:transparent #000000 transparent transparent}
header{position:fixed;left:0;top:0;z-index:999;width:100px !important;background:black;padding:20px;height:100%}
header a,header a:visited{-webkit-transition:all 0.5s;-moz-transition:all 0.5s;-o-transition:all 0.5s;transition:all 0.5s}
header h1{-webkit-transition:all 0.5s;-moz-transition:all 0.5s;-o-transition:all 0.5s;transition:all 0.5s;text-transform:uppercase;font-size:21px}
header ul{padding:20px}
header ul li{list-style:none;margin:0 0 5px 0;font-size:22px}
body.active-nth-slide-1 header h1,body.active-nth-slide-1 header a,body.active-nth-slide-1 header a:visited{color:#eb7347}
body.active-nth-slide-1 #fsvs-pagination li.active>span>span{background:#e65019}
body.active-nth-slide-2 header h1,body.active-nth-slide-2 header a,body.active-nth-slide-2 header a:visited{color:#26a65b}
body.active-nth-slide-2 #fsvs-pagination li.active>span>span{background:#1c7d44}
body.active-nth-slide-3 header h1,body.active-nth-slide-3 header a,body.active-nth-slide-3 header a:visited{color:#d24d57}
body.active-nth-slide-3 #fsvs-pagination li.active>span>span{background:#bc303a}
body.active-nth-slide-4 header h1,body.active-nth-slide-4 header a,body.active-nth-slide-4 header a:visited{color:#2c3e50}
body.active-nth-slide-4 #fsvs-pagination li.active>span>span{background:#1a242f}
.slide{padding:0px 40px 0px 100px}
.slide h2{font-size:22px;text-transform:uppercase}
.slide *,.slide a,.slide a:visited{color:white}
.slide .wrapper{position:relative;z-index:3}
.slide .wrapper>.left,.slide .wrapper>.right{width:50%;display:inline;float:left;padding:0 40px}
.slide .image-wrapper{position:absolute;z-index:2;width:100%;height:100%;background:url(/assets/images/bg.jpg) no-repeat center center;-webkit-background-size:cover;-moz-background-size:cover;-o-background-size:cover;background-size:cover}
.slide .colour-wrapper{filter:progid:DXImageTransform.Microsoft.Alpha(Opacity=80);opacity:0.8;position:absolute;z-index:2;width:100%;height:100%}
.slide .item{padding:30px}
.slide .item .description{margin:0 0 10px 0}
.slide .item p:last-child{margin:0}
.slide .demo{padding:30px;background:black;text-align:center}
.slide .demo p:last-child{margin:0}
.slide .link{white-space:nowrap;overflow:hidden;-ms-text-overflow:ellipsis;-o-text-overflow:ellipsis;text-overflow:ellipsis}
.slide .project-link a,.slide .project-link a:visited{-webkit-transition:all 1s;-moz-transition:all 1s;-o-transition:all 1s;transition:all 1s;white-space:nowrap;overflow:hidden;-ms-text-overflow:ellipsis;-o-text-overflow:ellipsis;text-overflow:ellipsis;display:inline-block;padding:10px 20px;text-align:center;text-decoration:none}
.slide .project-link a:hover,.slide .project-link a:visited:hover{background:black !important;color:white !important}
.slide.nth-class-1{background:#eb7347}
.slide.nth-class-1 .colour-wrapper,.slide.nth-class-1 .item{background:#eb7347}
.slide.nth-class-1 .colour-wrapper .project-link a,.slide.nth-class-1 .item .project-link a{background:#e65019}
.slide.nth-class-2{background:#26a65b}
.slide.nth-class-2 .colour-wrapper,.slide.nth-class-2 .item{background:#26a65b}
.slide.nth-class-2 .colour-wrapper .project-link a,.slide.nth-class-2 .item .project-link a{background:#1c7d44}
.slide.nth-class-3{background:#d24d57}
.slide.nth-class-3 .colour-wrapper,.slide.nth-class-3 .item{background:#d24d57}
.slide.nth-class-3 .colour-wrapper .project-link a,.slide.nth-class-3 .item .project-link a{background:#bc303a}
.slide.nth-class-4{background:#2c3e50}
.slide.nth-class-4 .colour-wrapper,.slide.nth-class-4 .item{background:#2c3e50}
.slide.nth-class-4 .colour-wrapper .project-link a,.slide.nth-class-4 .item .project-link a{background:#1a242f}
@media only screen and (max-width:769px){html body #git{margin:15px 20px 0 0}
html body #git:after{display:none}
html body header{width:100% !important;height:100px !important}
html body header h1{font-size:14px;font-size:0.875rem;line-height:1.71429;line-height:20px}
html body header h1,html body header ul{display:inline;float:left}
html body header ul{padding:15px 20px 15px 15px;float:right;margin:0 20px 0 0}
html body header ul li{display:inline;float:left;margin:0 20px 0 0}
html body .slide{padding:0px}
html body .slide>.wrapper>.left,html body .slide>.wrapper>.right{width:100%;padding:0 80px}
html body .slide>.wrapper>.left .demo,html body .slide>.wrapper>.right .demo{margin:120px 0 0 0 !important}
html body .slide>.wrapper>.left .item,html body .slide>.wrapper>.right .item{margin:20px 0 0 0 !important}
}
@media only screen and (max-width:360px){html body #git{margin:5px}
html body header{height:80px !important;padding:13px 15px}
html body header h1{font-size:14px}
html body header ul{padding:10px}
html body>#fsvs-body .slide .wrapper>.left{padding:20px 20px 20px 20px}
html body>#fsvs-body .slide .wrapper>.left .demo{margin:80px 0 0 0 !important}
html body>#fsvs-body .slide .wrapper>.left .demo p{font-size:14px;font-size:0.875rem;line-height:1.71429}
html body>#fsvs-body .slide .wrapper>.right{padding:0 20px}
html body>#fsvs-body .slide .wrapper>.right .item{margin:0 !important}
html body>#fsvs-body .slide .wrapper>.right .item .description p{font-size:14px;font-size:0.875rem;line-height:1.71429}
html body #fsvs-pagination{display:none}
}
.single-page{padding:40px;overflow:hidden}
.single-page>.left{width:31.79724%;float:left;margin-right:2.30415%;display:inline}
.single-page>.right{width:65.89862%;float:right;margin-right:0;*margin-left:-20px;display:inline;padding:0 100px 60px 0}
.single-page>.right>ul{padding:0 0 0 20px}
.single-page>.right pre{display:block;margin:0 0 40px 0}
.single-page>.right pre code{display:block;float:left}
.single-page>.right ul.nav-main{margin-bottom:40px}
.single-page>.right #disqus_thread{margin:100px 0 0 0}
.single-page .image{margin:20px 0 40px 0}
.menu{-webkit-border-radius:4px;-moz-border-radius:4px;-ms-border-radius:4px;-o-border-radius:4px;border-radius:4px;border:1px dashed #26a65b;padding:20px;background:#fadcd1;margin:0}
.menu li{position:relative;margin:0 0 2px 0;list-style:none;overflow:hidden;display:block;color:white}
.menu li.ghost span{filter:progid:DXImageTransform.Microsoft.Alpha(Opacity=80);opacity:0.8;background:#e74c3c}
.menu li>span{-webkit-transition:all 0.2s;-moz-transition:all 0.2s;-o-transition:all 0.2s;transition:all 0.2s;background:#eb7347;padding:7px 15px;float:left;cursor:move}
.menu li>span:hover{background:#e65019}
#get-data{margin:20px 0;padding:10px 20px;background:#eb7347;color:white;display:inline-block}
#sd>div{background:black;color:white;padding:20px;margin:20px 0}
.development-warning{font-size:18px;font-size:1.125rem;line-height:1.33333;padding:20px;background:#d24d57;margin:0 0 40px 0;overflow:hidden;color:white}
.development-warning i{font-size:38px;font-size:2.375rem;line-height:1.26316;display:inline;float:left;margin:0 20px 0px 0}
.development-warning p{margin:0 20px 0 0}
@media only screen and (max-width:769px){body .single-page{padding:140px 20px 20px 20px}
body .single-page>.left{display:none}
body .single-page>.right{width:auto;display:block;float:none;padding:0}
body .single-page>.right h1{font-size:22px;font-weight:bold}
}
@media only screen and (max-width:360px){body .single-page{padding:100px 20px 20px 20px}
body .single-page>.left{display:none}
body .single-page>.right{width:auto;display:block;float:none;padding:0}
body .single-page>.right h1{font-size:22px;font-weight:bold}
}
code[class*="language-"],pre[class*="language-"]{color:black;text-shadow:0 1px white;font-family:Consolas,Monaco,'Andale Mono',monospace;direction:ltr;text-align:left;white-space:pre;word-spacing:normal;word-break:normal;-moz-tab-size:4;-o-tab-size:4;tab-size:4;-webkit-hyphens:none;-moz-hyphens:none;-ms-hyphens:none;hyphens:none}
pre[class*="language-"]::-moz-selection,pre[class*="language-"]::-moz-selection,code[class*="language-"]::-moz-selection,code[class*="language-"]::-moz-selection{text-shadow:none;background:#b3d4fc}
pre[class*="language-"]::selection,pre[class*="language-"]::selection,code[class*="language-"]::selection,code[class*="language-"]::selection{text-shadow:none;background:#b3d4fc}
@media print{code[class*="language-"],pre[class*="language-"]{text-shadow:none}
}
pre[class*="language-"]{padding:1em;margin:.5em 0;overflow:auto}
:not(pre)>code[class*="language-"],pre[class*="language-"]{background:#f5f2f0}
:not(pre)>code[class*="language-"]{padding:.1em;border-radius:.3em}
.token.comment,.token.prolog,.token.doctype,.token.cdata{color:slategray}
.token.punctuation{color:#999}
.namespace{opacity:.7}
.token.property,.token.tag,.token.boolean,.token.number,.token.constant,.token.symbol{color:#905}
.token.selector,.token.attr-name,.token.string,.token.builtin{color:#690}
.token.operator,.token.entity,.token.url,.language-css .token.string,.style .token.string,.token.variable{color:#a67f59;background:rgba(255,255,255,0.5)}
.token.atrule,.token.attr-value,.token.keyword{color:#07a}
.token.function{color:#DD4A68}
.token.regex,.token.important{color:#e90}
.token.important{font-weight:bold}
.token.entity{cursor:help}
.magic-accordion ul.actions{margin:0 0 20px 0;overflow:hidden;padding:0}
.magic-accordion ul.actions li{display:inline;float:left;list-style:none;margin:0 1px 0 0}
.magic-accordion ul.actions li a,.magic-accordion ul.actions li a:visited{display:inline-block;background:#e74c3c;color:white;padding:10px 20px;font-weight:bold}
.magic-accordion ul.actions li a:hover,.magic-accordion ul.actions li a:visited:hover{text-decoration:none}
.magic-accordion .magic-accordion .head{display:block;padding:10px 20px;font-size:16px;cursor:pointer;background:#26a65b;color:white;font-weight:bold;margin:0;border-bottom:1px dotted white}
.magic-accordion .magic-accordion .head.active{background:#e74c3c;border-bottom:1px solid #e74c3c}
.magic-accordion .magic-accordion .body{padding:20px;border-left:1px dotted #e74c3c;border-right:1px dotted #e74c3c;border-bottom:1px dotted #e74c3c}
.magic-accordion ul{margin:0 0 20px 20px}
附件:下载该文件资源,减少时间成本(增值服务)
File Source
.rar
1.01 MB
立即下载(CNY 2.9￥)
打赏 收藏
分享
分享到QQ 分享到微博 微信扫一扫
留言
该资源可下载
File Source
.rar
1.01 MB
立即下载
岳薇叶
了解
打赏作者 鼓励作者
Html JS 其它特效4
最新结算
jquery虚拟键盘中文打字效果js代码
类型: .rar 金额: CNY 2.31￥ 状态: 待结算 详细>
jquery虚拟键盘中文打字效果js代码
类型: .rar 金额: CNY 0.29￥ 状态: 待结算 详细>
HTML5实现CSS滤镜图片切换特效代码
类型: .rar 金额: CNY 2.31￥ 状态: 待结算 详细>
jQuery头像裁剪插件cropbox js代码
类型: .rar 金额: CNY 0.29￥ 状态: 待结算 详细>
jQuery头像裁剪插件cropbox js代码
类型: .rar 金额: CNY 2.31￥ 状态: 待结算 详细>
CSS3制作3D图片立方体旋转特效
类型: .rar 金额: CNY 2.31￥ 状态: 待结算 详细>
CSS3制作3D图片立方体旋转特效
类型: .rar 金额: CNY 0.29￥ 状态: 待结算 详细>
CSS3制作3D图片立方体旋转特效
类型: .rar 金额: CNY 2.31￥ 状态: 待结算 详细>
CSS3制作3D图片立方体旋转特效
类型: .rar 金额: CNY 0.29￥ 状态: 待结算 详细>
jQuery+css3实现信封效果
类型: .rar 金额: CNY 0.29￥ 状态: 待结算 详细>
我们力求给您提供有用的文章,再此基础上,会附加营收资源,不做任何广告,让平台可以更好发展 若您发现您的权利被侵害，或使用了您的版权，请发邮件联系 sunlifel@foxmail.com ggbig觉得 : 不提供源码的文章不是好文章
合作伙伴
帮助中心
联系我们
  • QQ：21499807
  • 邮箱：sunlifel@foxmail.com
  • QQ扫一扫加QQ
    QQ扫一扫
Copyright 2023-2024 ggbig.com·皖ICP备2023004211号-1
打赏文章