text:
title: Multiple Gateways
category: feature
authors: amuller, danken, lpeer
wiki_category: Feature
wiki_title: Features/Multiple Gateways
wiki_revision_count: 27
wiki_last_updated: 2013-11-06
---

# Multiple Gateways

## Summary

Currently it is assumed that the host-wide default gateway is the gateway defined on the ovirtmgmt logical network. This feature will enable the user to define a gateway per logical network.

The feature is only relevant for deployments with hosts with more than one network device. Without the feature, any traffic going in the device that needs to be returned to a network not directly on the host will be routed out through the default gateway regardless of the device which the traffic came in. With the feature, any traffic going in that needs to be returned to a network outside of the host's own subnets will be routed back via the device that the traffic came in through.

The motivation is to ensure that if outside traffic was routed through a firewall to the host, then it will be returned the way it came in through the same firewall. Additionally, if a special administrative network (Mainly display network) was placed on a device then this feature ensures that return traffic will remain on the same display network and not router back from the host's default gateway, which may be a different network.

Previously users solved the issue with source routing manually, this feature simply automates the process.

## Owner

*   Name: Assaf Muller (amuller)
*   Email: <amuller@redhat.com>
*   IRC: amuller at #ovirt (irc.oftc.net)

## Current Status

*   oVirt-3.3
*   Merged, bug fix stage
*   Last updated: ,

## Why do we need multiple gateways?

Now, oVirt assumes that the host's default gateway is the gateway defined on the ovirtmgmt network. With that in mind: Multiple oVirt users use this network topology:

![](/images/wiki/Multiple_Gateways_Topology.png)

The administrator created a new network and set it as the display network. The oVirt host is connected to two networks: ovirtmgmt (10.0.0.0) via eth0, and the display network (20.0.0.0) via eth1. A user on a different subnet than the host then connected to the engine, selected a VM on the host and then opened a new Spice console. Network data can reach the host, but all return traffic will route to the host's default gateway, which is the gateway defined on ovirtmgmt, reached via eth0. The return traffic will reach R1, but R1 doesn't have a route to the user's laptop and thus the packets will be dropped at R1. In other words, Spice won't work.

More simply put, pings won't work from the user's laptop to the oVirt host, assuming they are not located on the same network. The traffic will reach the host successfully, but all return traffic will be routed through the host's default gateway via eth0. The packets will reach R1 and will then be dropped as R1 cannot route to the user's laptop.

Currently, clients manually edit the host's init scripts and set a different gateway for the display network. This can become problematic to maintain with a large amount of hosts. The multiple gateways feature will automate this process.

## User Experience

The only change needed in the GUI is in the setup networks dialog. When editing an IP configuration, we need to enable the gateway field for all networks, not only ovirtmgmt. If the user chose static IP, then the gateway field should be added and be editable. If DHCP was chosen then the gateway field should be visible and display the gateway configured via DHCP.

## Proposed Solution

### The Manual Solution

The manual solution, or how Linux system admins setup multiple gateways on a host is to create a routing table for each IP subnet configured on the host, and source routing rules to use each table as appropriate. Meaning, if a packet is destined towards the IP configured on the host's eth0 (For example: 10.0.0.1), then when creating a return packet, the source IP will be 10.0.0.1. The host will then go over his configured rules and see that when routing **from** 10.0.0.1, he must use a specific routing table, which holds the gateway for the 10.0.0.0 network. In other words, all traffic to 10.0.0.1 will return via 10.0.0.1's NIC, and all traffic to another IP of the host, will return via that IP's NIC instead. That way, traffic goes out the same way it came in.

More information about iproute2 source routing may be found at: <http://www.policyrouting.org/iproute2-toc.html>

### Manual Configuration Example

The zeus02 host is connected via eth0 to one router, and via eth1 (bridged over ovirtmgmt) to another router. We configured the display network on the eth0 NIC.

**The ip address on eth0:**

![](/images/wiki/Eth0_ip.png)

**The ip address on ovirtmgmt:**

![](/images/wiki/Ovirtmgmt_ip.png)

**A list of the host's routing tables:**

![](/images/wiki/Rt_tables.png)

**The routing table setup for eth0:**

![](/images/wiki/Eth0_table.png)

**The routing table setup for ovirtmgmt:**

![](/images/wiki/Ovirtmgmt_table.png)

**The rules which tell the host when to use each routing table:**

![](/images/wiki/Ip_rule.png)

And finally, here's the host's main routing table. Any traffic coming **in** to the host will use the ip rules and an interface's routing table. The main routing table is only used for traffic originating **from** the host.

![](/images/wiki/Ip_route.png)

### Automatic Solution

The proposed solution is to create a python script that expects an interface's new IP address, subnet mask, network name and gateway. The script will then use the appropriate commands to generate a new routing table, populate it with two rows: One to link the network ip range with the NIC, and another that defines the gateway. Finally, the script will add two new rules that define when to use the new routing table. Of course, the rules define to use the new routing table whenever traffic is destined to or from the new ip network range. For an example, see the previous section. Another script will be created that reverses the aforementioned effects.

**DHCP:** During VDSM installation, an additional script will be created under /etc/dhcp/dhclient.d/, called sourceRouting.sh. We will use DHCP hooks to call our new scripts whenever a DHCP interface is brought up or down.

**Static IP:** We'll call the aforementioned script for statically configured interfaces during addNetwork and delNetwork. Two files will be created during addNetwork. delNetwork will delete the same files. The files are route-<interface> and rule-<interface>, placed in /etc/sysconfig/network-scripts. New routing rules will be placed in the route file, and new rules in the rule file. Both of these files are called during the ifup init script.

**Summary:** Multiple gateways code will be called whenever a DHCP interface goes up or down (Via our DHCP hook), and will create and delete the needed rules every time it is called. For statically configured interfaces, it will be called once during addNetwork, and once during delNetwork. These runs will place init scripts, that in turn will be called during ifup and ifdown.

### Upgrading

When a host upgrades to a VDSM that supports multiple gateways all of its interfaces will have no source routing configured. Any new setup networks will configure source routing on the affected networks / interfaces. Since the current implementation keeps the management network as the host's default gateway, connectivity should never be lost and no actual upgrade script is offered.

### API

#### Vdsm

A significant advantage of the currently proposed implementation is that no API change between the Engine and VDSM is needed. VDSM is capable of distilling the gateways from the current setupNetworks verb.

#### REST and Engine

Currently, only when setting the management network, a gateway may be specified. With this feature, each network with static address may have a gateway, that would control source routing for that address.

## Testing

*   Set up networking as described [ above](#Why_do_we_need_multiple_gateways.3F). Most importantly, place your spice client outside of the hosts' own subnet.
*   Verify that spice traffic travels through the designated host.
*   Test the above both with static addresses and with DHCP.

## External References

*   On the arch@ovirt.org mailing list.


text:
using System;
using System.Collections.Generic;
using System.Linq;
using System.Threading.Tasks;
using Microsoft.AspNetCore.Builder;
using Microsoft.AspNetCore.Hosting;
using Microsoft.AspNetCore.Identity.EntityFrameworkCore;
using Microsoft.EntityFrameworkCore;
using Microsoft.Extensions.Configuration;
using Microsoft.Extensions.DependencyInjection;
using Microsoft.Extensions.Logging;
using WWW.Data;
using WWW.Models;
using WWW.Services;
using AiursoftBase;
using Microsoft.AspNetCore.Identity;

namespace WWW
{
    public class Startup
    {
        public IConfiguration Configuration { get; }
        public bool IsDevelopment { get; set; }

        public Startup(IConfiguration configuration, IHostingEnvironment env)
        {
            Configuration = configuration;
            IsDevelopment = env.IsDevelopment();
            if (IsDevelopment)
            {
                Values.Schema = "http";
            }
        }

        public void ConfigureServices(IServiceCollection services)
        {
            services.ConnectToAiursoftDatabase<WWWDbContext>("WWW", IsDevelopment);
            services.AddIdentity<WWWUser, IdentityRole>()
                .AddEntityFrameworkStores<WWWDbContext>()
                .AddDefaultTokenProviders();
            services.AddMvc();
        }

        public void Configure(IApplicationBuilder app, IHostingEnvironment env, WWWDbContext dbContext)
        {
            if (IsDevelopment)
            {
                app.UseDeveloperExceptionPage();
                app.UseDatabaseErrorPage();
            }
            else
            {
                app.UseExceptionHandler("/Home/Error");
            }

            app.UseStaticFiles();

            app.UseAuthentication();

            app.UseMvcWithDefaultRoute();
            app.UseAiursoftAuthentication(appId: "9379174274020d83d93c44cc3f682fdf", appSecret: "84ec92e2300882d2c3ef4509661bf121");
            dbContext.Database.Migrate();
        }
    }
}

redpajama_set_name: RedPajamaGithub


text:
.ico-praise,.ico-comment,.comment-box:before,.comment-box:after,.nav-type2 .ico-nav,.ico-sea,.ico-scroll-arw,.close-rea,.link-top,.ico-l-com,.ico-b-com,.ico-b-submit,.ico-load-more,.ico-refresh{background: url(../img/spr-d3.png) no-repeat;}
.index-d3{height: 100vh;}
.scroll,.scroll body{overflow-y: auto;height: auto;}
.scroll .index-d3{overflow: visible;}
body{--colorSub:#666;--fontHeiTi:\9ED1\4F53;--widthList:210px;--widthVideo:730px;--heightVideo: 434px;overflow: hidden;--heightList:186px;--widthMain: 876px;}

.scroll .header{width: 100vw;position: fixed;background: rgba(255,255,255,.9);z-index: 99;left: 0;top: 0;margin-top: 0;transition: .3s;}
.header{margin-top: -30px;z-index: 100;}
.head{width: 1098px;margin:0 auto;position: relative;}
.hd-up{top: 0;left: 0;transform: translateY(-30px);}
.hd-up .ico-nav{visibility: hidden;margin : -46px auto 43px;transition: .3s}
.hd-up .nav .text{display: inline-block;font-size: 14px;}
.ico-sea{opacity: 0}
.scroll .hd-up .ico-sea{width: 28px;height: 28px;position: absolute;background-position: -90px 0;right: 0;top: 19px;}

.hd-up .sea-box{opacity: 0;}
.show-more{position: fixed;bottom: 0;left: 0;width: 100%;text-align: center;}
.show-more .ico-v-load{zoom: .8;display: inline-block;position: static;left: 0;top: 0;margin:0 8px 0 0;vertical-align: middle;filter: brightness(0.2)}
.txt-load{display: none;}
.skin02 .show-more .ico-v-load,.skin03 .show-more .ico-v-load{filter: brightness(1.5)}
.ico-scroll-arw{width: 60px;height: 30px;background-position: -120px 0;display: inline-block;vertical-align: -4px;animation: move 1s both infinite alternate linear}
@keyframes move{
	0%{transform: translateY(-3px);}
	100%{transform: translateY(3px);}
}
.link-show-more{color:#666;display: block;}
.link-show-more.news:after{background: url(../img/spr-d3.png) -400px 0;content: '';position: absolute;width: 26px;height: 11px;}
.search{z-index: 99;}

.center-box{transition:.6s;width: 100%;position: relative;height: 100%; display: flex;align-items: center;justify-content: center;}
.screen{transition: .4s}

/* nav */
.nav-type2 a:hover .ico-nav{animation: none;}
.nav-type2{height: 65px;}
.nav-type2 .nav{padding: 5px 0 0;}
.nav-type2 .nav a{margin: 0 30px 0 0;font-size: 14px;position: relative;}

.nav-type2 .ico-nav{width: 40px;height: 28px;}
.nav-type2 .ico-movie{background-position: 0 -320px;}
.nav-type2 .ico-tv{background-position: -40px -320px;}
.nav-type2 .ico-game{background-position: -79px -320px}
.nav-type2 .ico-show{background-position: -120px -320px}
.nav-type2 .ico-vip{background-position: -160px -320px}
.nav-type2 .ico-lx{background-position: -200px -320px}
.nav-type2 .ico-sjxl{background-position: -240px -320px;}
.nav-type2 a:hover .ico-movie{background-position: 0 -350px;}
.nav-type2 a:hover .ico-tv{background-position: -40px -350px;}
.nav-type2 a:hover .ico-game{background-position: -79px -350px}
.nav-type2 a:hover .ico-show{background-position: -120px -350px}
.nav-type2 a:hover .ico-vip{background-position: -160px -350px}
.nav-type2 a:hover .ico-lx{background-position: -200px -350px}
.nav-type2 a:hover .ico-sjxl{background-position: -240px -350px;}
.nav-type2 .ico-home{background-position: -280px -320px;}
.nav-type2 a:hover .ico-home{background-position: -280px -350px;}
.nav-new{width: 26px;height: 9px;background: url(../img/spr-d3.png) -400px 0 no-repeat;position: absolute;top: 26px;right: -20px;}

.nav-box{display: inline-block;position: relative;height: 60px;}
.nav-box:hover .nav-drop-code{display: block;}
.nav-drop-code{background: #fff;width: 110px;height: 128px;position: absolute;text-align: center;padding: 10px 0 0;color: var(--colorLight);box-sizing: border-box;left: -25px;top: 54px;display: none;animation: zoomOut .2s both;transform-origin: center top;}
.nav-drop-code:before{width: 10px;height: 10px;background: #fff;content: '';position: absolute;top: -5px;left: 50%;margin-left: -5px;transform: rotate(45deg);}
.nav-type2  .nav-drop-code .pic-code{width: 90px;height: 90px;overflow:hidden;margin: 0 auto;display: block;}
.pic-code img{width: 100%;}
.nav-drop-code p{line-height: 28px}

.nav-type2.hd-up{transform: translateY(-30px);}

.scroll .nav-type2{padding: 10px 0 0;}
.scroll .nav-type2 .ico-sea{top: 13px;}
.scroll .nav-type2 .nav a:nth-child(1){margin-left: -10px;}
.scroll .search{margin-top: -15px;}
.scroll .d3-wrap{opacity: 0}

.ico-vip.ani-nav{width: 44px;height: 30px;overflow: hidden;background: none; position: relative;top: -1px;}
.ico-vip.ani-nav:after{background: url(../img/spr-vip.png) no-repeat;width: 1564px;height: 30px;content:'';position: absolute;left: 0;top: 0;}

.ico-vip.ani-nav:after{animation: aniVip 2s steps(34) infinite;}
 .nav-type2 a:hover .ani-nav:after{background-position: -1608px 0;animation: none;}
 @keyframes aniVip {
	0%{transform: translate3d(0,0,0)}
	100%{transform: translate3d(-1564px,0,0)}
}

.index-d3{width: 1098px;margin: 0 auto;}
.scroll .index-d3{padding: 0;height: auto;}
.d3-wrap{transition: .5s;position: relative;height: 632px;}
.d3-video-box{height: var(--heightVideo);width: 1098px;display: flex;}
.index-d3 .rec-video{width: var(--widthVideo);background: #000;;}

 .ico-h-play{width: 28px;height: 28px;position: absolute;right: 0;top: 15px;display: none;overflow: hidden;}
 .ico-h-play:after{width: 1372px;height: 28px;content: '';background:url(../img/ico-play.png) no-repeat ;left: 0;top: 0;animation: play 1.8s steps(49) infinite;position: absolute;pointer-events: none;}
@keyframes play{
	0%{transform: translate3d(0,0,0);}
	100%{transform: translate3d(-1372px,0,0);}
}
.switch .search{right: 40px;}
.switch .ico-h-play{display: block;}
.scroll .hd-up .ico-sea{right: 10px;opacity: 1;}
.switch .hd-up .ico-h-play{top: 29px;}

/* 右侧内容 */
.d3-video-info{width: calc(100% - var(--widthVideo));}
.d3-video-des{background-color: #fff;padding: 15px 20px;box-sizing: border-box;overflow: hidden;position: relative;height: 100%;}
.d3-video-info h2,.d3-video-info h3{font-size: 22px;width: 100%;}
.d3-video-info h2{height: 33px;}
.d3-video-info h2 a{overflow: hidden;text-overflow: ellipsis;white-space: nowrap;position: absolute;z-index: 2;height: 33px;background: #fff;left: 0;padding: 0 0 0 20px;width: 100%;box-sizing: border-box;transition: .3s;border-bottom: solid 1px rgba(255,255,255,0);}

.d3-video-info h2:hover a{overflow: visible;white-space: normal;border-color: #e4e4e4;height: auto;padding: 0 20px 20px 20px;}

.d3-des-jiuwo h2:hover a{overflow: hidden;white-space: nowrap;border-color: transparent;height: 33px;padding: 0 0 0 20px;}
.d3-video-info .times{color: #666;font-size: 14px;display: inline-block;}
.praise{margin: 15px 0;}
.praise-num{display: inline-block;width: 64px;font-size: 12px;vertical-align: middle;}
.ico-praise,.ico-comment{width: 20px;height: 20px;display: inline-block;vertical-align: middle;}
a:hover .ico-praise{background-position: -20px 0}
a:hover .praised,.praised{background-position: -40px 0}

.d3-report{display: inline-block;position: relative;width: 50px;margin: 0 0 0 10px;height: 30px;margin-bottom: -15px;}
.drop-reason{width: 238px;height: 106px;background: #fff;box-sizing: border-box;padding: 0 0 0 20px;position: absolute;left: -50px;top: 25px;border: solid 1px #ccc;z-index: 2;box-shadow: 0 0 5px 3px rgba(0,0,0,.1);display: none;}
.d3-report:hover .link-report{color: var(--colorLight)}
.drop-reason:before{width: 7px;height: 7px;background: #fff;position: absolute;content: "";border-right: solid 1px #ccc;border-top: solid 1px #ccc;transform: rotate(-45deg);top: -5px;box-shadow: 2px -2px 4px 0 rgba(0,0,0,.1);left: 58px;}
.drop-reason p{color: #999;line-height: 30px;}
.drop-reason-list a{display: inline-block;width: 54px;height: 22px;line-height: 22px;border: solid 1px #ccc;color: #666;margin: 0 12px 10px 0;text-align: center;}
.drop-reason-list .cho,.drop-reason-list a:hover{border-color: #409cf7;color: #409cf7;}
.link-report{display: inline-block;font-size: 12px;color: #666}
.d3-report .link-report.done{color: #ccc;cursor: default;}
.report-rusult{border: solid 1px #ccc;color: #ccc;cursor: default;font-size: 12px;padding: 0 4px;margin: 0 0 0 5px;}
.close-rea{width: 25px;height: 25px;background-position: -280px 0;position: absolute;right: 0;top: 0;}
.close-rea:hover{background-color: #ff4848;background-position: -305px 0;}

.praise-list{display: inline-block;font-size: 0;vertical-align: middle;}
.praise-list-box{display: inline-block;overflow: hidden;vertical-align: middle;width: 232px;height: 32px;}
.praise-list a{border: solid 1px rgba(0,0,0,.2);width: 30px;height: 30px;display: inline-block;margin: 0 1px 0 0;border-radius: 50%;overflow: hidden;vertical-align: middle;}
.praise-num .data{background: #ff4848;width: 33px;height: 15px;line-height: 15px;text-align: center;position: relative;color: #fff;display: inline-block;vertical-align: -2px;margin: 0 0 0 2px;}
.praise-num .data:before{width: 0;height: 0;overflow: hidden;font-size: 0;border-width: 3px 3px;border-color: transparent #ff4848 transparent transparent;border-style: dashed solid dashed dashed;display: block;content:"";position: absolute;left: -6px;top: 4px;}
.add-one{color: #ff4848;font-size: 14px;vertical-align: middle;margin-left: -12px; animation: addOne 1.5s .3s both;display: inline-block;}
@keyframes addOne{
	0%{transform: translateY(0); opacity: 0}
	50%,80%{transform: translateY(0);opacity: 1}
	100%{transform: translateY(-3px);opacity: 0}
}

.praise-list .more{border-color:#fff;position: relative;}
.praise-list .more:after{width: 3px;height: 3px;border-radius: 50%;background: #d8d8d8;display: block;content: "";position: absolute;left: 8px;top: 14px;box-shadow: 7px 0 0 0px #ddd,14px 0 0 0px #ddd}

.comment{position: relative;padding: 0 0 20px 72px;color: #999;border-bottom: solid 1px #e4e4e4;}
.ico-comment{background-position: 0 -20px;filter:grayscale(1) brightness(1.3);margin: 0 3px 0 0;}
a:hover .ico-comment{filter: none;}
.comment .num{position: absolute;left: 0;top: 0;color: #999}
.comment-box{padding: 50px 30px;position: relative;}
.txt-comment{display: -webkit-box;word-break: break-all; overflow: hidden;text-overflow: ellipsis;-webkit-line-clamp: 2;-webkit-box-orient: vertical;font-size: 20px;height: 2.8em;-webkit-box-pack:center;}
.comment-box:before,.comment-box:after{width: 20px;height: 20px;position: absolute;content: "";display: block;filter:grayscale(1) brightness(1.2);}
.comment-box:before{background-position: 0 -40px;top: 0;left: 0;}
.comment-box:after{background-position: -20px -40px;bottom: 0;right: 0;}
.write-box{width: 100%;height: 36px;line-height: 36px;padding: 0 0 0 5px;box-sizing: border-box;border: solid 1px #eee;cursor: pointer;position: relative;margin-top: 5px;}
.write-box:hover{border-color: var(--colorLight)}
.comment-box.light{color: var(--colorLight)}
.comment-box.light:before,.comment-box.light:after{filter: none}
.comment-box{animation: fadeIn 1s .3s both;}
@keyframes fadeIn{
	0%{opacity: 0}
	100%{opacity: 1;}
}

.ipt-com{border: 0;}
.btn-submit{width: 34px;height: 34px;display: block;position: absolute;right: 0;top: 0;background: #e6e6e6;visibility: hidden;}
.write-box:hover .btn-submit{visibility: visible;}
.btn-submit:before{width: 0;height: 0;overflow: hidden;font-size: 0;border-width: 6px 11px;border-color: transparent transparent transparent #fff;border-style: dashed dashed dashed solid;display: block;content:"";position: absolute;left: 12px;top: 11px;}
.btn-submit:after{content: "";display: block;height: 2px;width: 3px;position: absolute;top: 16px;left: 12px;background: #e6e6e6;}
.focus .btn-submit,.write-box.focus .btn-submit:after{background: var(--colorLight)}
.com-from{position: absolute;padding: 10px 0 0 43px;bottom: 14px;left: 20px;}
.com-from .logo-name{font-size: 16px;color: #000;}
.com-from .logo-des{color: #666;font-size: 14px;margin: -2px 0 0;}

.logo-from{width: 36px;height: 36px;display: block;left: 0;top: 13px;position: absolute;background: #ccc;border-radius: 7px;top: 14px;background: url(../img/ico-logo.png) no-repeat;}
.logo-niux{background-position: 0 -80px;}
.logo-jiuwo{background-position: 0 -40px;}
.logo-jiuwo-1{background-position: 0 -120px;}

.card{margin-top: 30px;}
.card .pic{display: block;height: 180px;}
.card .pic img{width: 100%;}
.btn-go{display: block;height: 46px;line-height: 46px;text-align: center;color: #fff;font-size: 14px;margin: 20px 0 0;}

.d3-des-jiuwo{background-image: url(../img/bg-jiuwo.png);background-size: 100% auto;background-repeat: no-repeat;background-position: 0  -10px; }
.btn-go-jiuwo{background: #f8178d;height: 50px;line-height: 50px;width: 240px;margin: 0 auto;display: block;text-align: center;color: #fff;font-size: 16px;transition: .3s;border-radius: 5px}
.btn-go-jiuwo:hover{background: #ff55af;}
.anchor-info{margin: 40px 0 0;text-align: center;}
.anchor-info-pic{width: 102px;height: 102px;border-radius: 50%;border: solid 5px #ffcccc;margin: 0 auto;box-shadow: 0 0 0 4px #ffe2e2;background: #fff;}
.anchor-info-pic img{width: 100%;border-radius: 50%;}
.anchor-info-name{font-size: 18px;color: #000;line-height: 48px;}
.ico-j-flower,.ico-j-num{width: 20px;height: 20px;background: url(../img/spr-d3.png) no-repeat;display: inline-block;vertical-align: middle;}
.ico-j-flower{background-position: -240px 0;}
.ico-j-num{background-position: -260px 0;}
.anchor-info-data{width: 240px;margin: 0 auto;}
.anchor-info-data li{display: inline-block;color: #b7b7b7;font-size: 15px;width: 118px;line-height: 34px;}

.d3-des-room{background-image: url(../img/bg-jiuwo.jpg) ;background-size: cover}
.d3-des-room h3{padding: 10px 0 0;}

.d3-des-room .anchor-info-pic{border-color: #e6d3f7;box-shadow: 0 0 0 4px #f7f0fe}
.d3-des-room .btn-go-jiuwo{background: #992ffc;margin: 20px auto;}
.d3-des-room .btn-go-jiuwo:hover{opacity: .8}
.d3-des-room h3 a:hover,.com-from .logo-name:hover{color: #992ffc !important}
.from-room .ico-label{background-position: -180px -60px;width: 100px;}
.rec-video .enter{z-index: 4}

/* 评论 2017.02.13 */
.com-wp{background: rgba(255,255,255,.7);padding: 0 !important;overflow: visible;z-index: 9}
.com-box{height: 384px;overflow: hidden;}
.com-main{background: #fff;padding: 20px 20px 0;position: relative;transition: margin .4s}
.com-main:after{position: absolute;height: 10px;background: url(../img/spr-d3.png) -2px -540px no-repeat;content: "";width: 100%;left: 0;}
.com-user{line-height: 45px;font-size: 16px;position: relative;}
.com-user-pic{width: 45px;height: 45px;display: inline-block;border:solid 1px rgba(0,0,0,.1);border-radius: 50%;overflow: hidden;vertical-align: middle;margin: 0 5px 0 0;}
.com-user-pic img,.com-list .user-pic img{width: 100%;}
.com-user-name{color: rgba(0,23,69,.6);vertical-align: middle;width: calc(100% - 120px);display: inline-block;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;}
.com-text{position: relative;z-index: 6;margin: 15px 0 0;}
.com-text p{font-size: 17px;color: #1a1a1a;white-space: nowrap;overflow: hidden;text-overflow: ellipsis;}
.com-text .drop-text{position: absolute;width: 100%;background: #fff;box-shadow:0 0 5px 1px rgba(0,0,0,.2);box-sizing: border-box;padding: 5px 10px;font-size: 12px;display: none;color: rgba(0,23,69,.6);}

.play-times{color: rgba(0,23,69,.4);font-size: 14px;}
.btn-att{width: 50px;height: 22px;line-height: 22px;text-align: center;transition: .3s;font-size: 12px;position: absolute;right: 0;top: 50%;margin-top: -12px;}
.btn-att:hover{background: var(--colorLight);color: #fff;border-color: var(--colorLight);}
.btn-att{color: var(--colorLight) ;border: 1px var(--colorLight) solid;}
.btn-att:hover .ico-add{filter: brightness(3);}
.com-main .btn-att.done{background: none;border-color: #ccc;color: var(--colorSub);transition: none}
.com-main .btn-att.done:after{content: '已关注'}
.com-main .btn-att.done:hover{background: #b2b9c7;color: #fff;}
.com-main .btn-att.done:hover:after{content:'取消';}

.com-option{margin: 15px 0 0;position: relative;height: 15px;}
.com-option a{color: rgba(0,23,69,.6);}
.com-option .d3-report{position: absolute;right: 0;top: -2px;height: 40px;text-align: right;z-index: 5;}
.com-option .drop-reason{right: -20px;left: auto;top: 30px;text-align: left;}
.com-option .drop-reason:before{right: 30px;left: auto;}
.com-list{padding:0 0 0 20px;margin: 30px 2px 0 0;overflow-y: auto;height: 185px;}

.com-list .user-name{color: rgba(0,23,69,.6);display: inline-block;max-width: 9em;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;vertical-align: top;}
.com-list .name-vip{color: #ff0000}
.com-list li{margin: 0 0 15px;position: relative;padding: 6px 0 0 38px;min-height: 32px;}
.com-list li:nth-last-child(1){margin:0;}
.com-list .user-pic{width: 32px;height: 32px;border-radius: 50%;overflow: hidden;position: absolute;left: 0;top: 0;}
.com-content{padding: 0 26px 0 0;word-break: break-all;overflow: hidden;text-overflow: ellipsis;box-sizing: border-box;}
.ico-l-com{width: 22px;height: 22px;background-position: -150px -480px;position: absolute;right: 5px;top: 5px;display: none}
li:hover .ico-l-com{display: block;}
.com-write{margin: 0 20px;background: #fff;position: relative;height: 30px;}
.ipt-com-text{width: calc(100% - 60px);height:30px;line-height:30px;border:0;vertical-align: top;text-indent: 10px;}
.ico-b-com,.ico-b-submit{width: 30px;height: 30px;position: absolute;top: 0;}
.ico-b-com{background-position: 0 -480px;right: 30px}
.ico-b-submit{background-position: -30px -480px;right: 0;}
.com-write.focus .ico-b-submit{background-color: var(--colorLight);background-position: -180px -480px;}
.ico-b-com.clk{background-position: -210px -480px;}
.drop-com-list{background: #fff;width: calc(100% - 30px);position: absolute;padding: 5px 0;left: 0;top: 31px;display: none;}
.drop-com-list li a{display: block;text-indent: 10px;line-height: 22px;}
.drop-com-list li:hover{background: var(--colorLight)}
.drop-com-list li:hover a{color: #fff;}

.com-box .ico-comment{background-position: -60px -480px;width: 16px;height: 15px;}
.com-box .ico-praise{background-position: -90px -480px;width: 16px;height: 15px;}
.com-box .v-praise:hover{color: #ff4848}
.com-box .v-praise:hover .ico-praise{background-position: -90px -495px;}
.com-box .v-comment{margin: 0 25px 0 0;}
.com-box .v-comment:hover{color: var(--colorLight)}
.com-box .v-comment:hover .ico-comment{background-position: -60px -495px;}

.com-box .done{color: #ff4848}
.com-box .done .ico-praise{background-position: -90px -510px !important;}
.ico-load-more{width: 25px;height: 12px;background-position: -120px -480px;display: inline-block;vertical-align: middle;}
.link-com-more{display: block;text-align: center;color: rgba(0,23,69,.6);line-height: 30px;}
.link-com-more:hover{color: var(--colorLight);}
.link-com-more:hover .ico-load-more{background-position: -120px -495px;}

.list-up{ margin-top: -134px;}

.list-all{height: 316px;}
.com-box .done-ani .ico-praise{animation: praise .6s both;}
@keyframes praise{
	0%{transform: translateY(2px) rotate(30deg);}
	50%{transform: translateY(-2px) rotate(-10deg);}
	100%{transform: translateY(0) rotate(0deg);}
}
.com-write .ico-face{right: 30px;}
.com-write .emoji{width: 272px;}

.close-top,.btn-fav{width: 32px;height: 32px;background: rgba(255,255,255,.5);position: absolute;right: -32px;top: 0;}
.close-top{top: 34px;}
.close-top:after,.btn-fav:after{content: '';width: 20px;height: 20px;background: url(../img/spr-d3.png) -280px 0 no-repeat;position: absolute;left: 50%;top: 50%;margin: -12px 0 0 -13px;filter:grayscale(1);}
.close-top:hover:after{background-position: -460px 0;filter: none;}

.btn-fav:after{width: 14px;height: 14px;background-position: -160px -610px;margin: -7px 0 0 -7px;}
.btn-fav:hover:after,.btn-fav.open:after{filter:none;}

.quick{margin: 10px 0 0;position: relative;}
.quick h3{font-size: 14px;color: rgba(0,23,69,.6);}
.quick-list{font-size: 0;height: 76px;overflow: hidden;}
.quick-list a{font-size: 14px;background: #fff;text-align: center;height: 28px;line-height: 28px;display: inline-block;padding: 0 17px;color: rgba(0,23,69,.8);margin: 8px 8px 0 0;border:solid 1px #fff;}
.quick-list a:hover{border-color: var(--colorLight);color: var(--colorLight);}
.ico-refresh{width: 20px;height: 20px;background-position: -260px -480px;position: absolute;right: 20px;top: 2px;transition:transform .2s linear}
.ico-refresh:hover{background-position: -280px -480px;}

.d3-more{position: relative;display: none;}
.d3-more:after{background: url(../img/spr-d3.png) 0 -650px;content: '';width: 260px;height: 52px;position: absolute;left: 50%;margin-left: -130px;bottom: 0;}

.d3-video-list,.d3-video-list li{height: var(--heightList);}

/* 猫眼 */
.from-other{height: 70px;padding: 10px 0 0;box-sizing: border-box;font-size: 13px;}
.txt-other{color: #8d92a0;}
.txt-other a{color: #8d92a0;}
.txt-other a:hover{color: var(--colorLight)}
.ico-my{width: 24px;height: 24px;background: url(../img/spr-d3.png) -90px -35px no-repeat;display: inline-block;vertical-align: -7px;margin: 0 5px 0 0;}

/* 兴趣 */
.video-fav{background: rgba(255,255,255,.7);padding: 0 !important;}
.fav-box h3{font-size: 20px;text-align: center;line-height: 60px;}
.fav-box-list ul{display: flex;flex-wrap: wrap;padding:0 20px;}
.fav-box-list li{width: 105px;height: 70px;background: #fff;text-align: center;box-sizing: border-box;padding-top: 14px;cursor: pointer;margin: 0 6px 6px 0;position: relative;border:solid 2px #fff;transition: border .3s}
.fav-box-list li:nth-child(3n){margin-right:0;}
.fav-box-list li p{line-height: 1.2;color: #666;}
.fav-box-list .cho,.fav-box-list li:hover{border-color: var(--colorLight);}
.fav-box-list .cho:after{width: 22px;height: 22px;background: url(../img/spr-d3.png) -120px -610px no-repeat;content: '';position: absolute;bottom: 0;left: 0;}
.ico-v-fav{width: 40px;height: 30px;background: url(../img/spr-d3.png) 0 -999em no-repeat;display: inline-block;}
.ico-v-fanny{background-position: 0 -710px;}
.ico-v-show{background-position:-40px  -710px;}
.ico-v-food{background-position:-80px  -710px;}
.ico-v-pet{background-position:-120px  -710px;}
.ico-v-song{background-position:-160px  -710px;}
.ico-v-movie{background-position:-200px  -710px;}
.ico-v-ent{background-position:-240px  -710px;}
.ico-v-tour{background-position:-280px  -710px;}
.ico-v-game{background-position:-320px  -710px;}
.ico-v-oddly{background-position:-360px  -710px;}
.ico-v-tech{background-position:-400px  -710px;}
.ico-v-sports{background-position:-440px  -710px;}

li:hover .ico-v-fanny{background-position: 0 -740px;}
li:hover .ico-v-show{background-position:-40px  -740px;}
li:hover .ico-v-food{background-position:-80px  -740px;}
li:hover .ico-v-pet{background-position:-120px  -740px;}
li:hover .ico-v-song{background-position:-160px  -740px;}
li:hover .ico-v-movie{background-position:-200px  -740px;}
li:hover .ico-v-ent{background-position:-240px  -740px;}
li:hover .ico-v-tour{background-position:-280px  -740px;}
li:hover .ico-v-game{background-position:-320px  -740px;}
li:hover .ico-v-oddly{background-position:-360px  -740px;}
li:hover .ico-v-tech{background-position:-400px  -740px;}
li:hover .ico-v-sports{background-position:-440px  -740px;}

.fav-box-bottom{margin: 15px 20px 0;position: relative}
.btn-fav-submit{width: calc(100% - 184px);display: block;background: var(--colorLight);height: 38px;line-height: 38px;color: #fff;text-align: center;font-size: 14px;margin: 0 auto;transition:.3s}
.btn-fav-submit:hover{opacity: .8}
.txt-fav{position: absolute;right: 0;line-height: 38px;color: #666;top: 0;}
.txt-fav a{margin: 0 0 0 7px;color: #666;}
.txt-fav a:hover{color: var(--colorLight);}
.fav-load{height: 100%;display: flex;align-items: center;justify-content: center;flex-wrap: wrap;}
.fav-load p{width: 100%;text-align: center;height: 30px;font-size: 14px;color: #666;margin-top: -80px;}
.ico-fav-load{width:100px;height: 180px;background: url(../img/spr-fav.png) no-repeat;animation: fav 4s steps(114) infinite; }
@keyframes fav{
	0%{background-position: 0 0;}
	100%{background-position: -11400px 0;}
}

/* 视频列表模块 */
.pic,.bg-pic{overflow: hidden;display: block;}
.module-box{margin: 0 0 18px;}
.module-box .title{ height: 36px;line-height: 36px; position: relative;font-size: 14px;}
.module-box .title h3{font-size: 20px;font-weight: normal;line-height: 30px;}
.text-arrow{font-family:\5b8b\4f53 }
.tit-box{position: absolute;right: 0;top: 0;}
.tit-box-nav a{position: relative;z-index: 1;padding: 0 6px;}
.tit-box-nav .cur,.tit-box-nav .cur:hover{color: #fff;background: rgba(0,0,0,.3);border-radius: 30px;}
.module-main{display: flex;justify-content: space-between;width: 100%;}
.module-list{position: relative;overflow: hidden;height: 295px;}
.list-full{overflow: visible;}
.list-two{height: 672px}
.module-list.fl,.module-list.fr{width: var(--widthMain);}
.module-list ul{margin: 0 0 0 -12px;display: flex;flex-wrap: wrap;}
.module-list li{width: var(--widthList);height: 294px;margin: 0 0 12px 12px;background: #fff;position: relative;}
.module-list .pic{height: 182px;display: block;position: relative;}
.pic img{width: 100%}
.list-con{padding: 8px 12px 0;box-sizing: border-box;color: #808080;width: 100%;}
.list-con > *{white-space: nowrap;overflow: hidden;text-overflow: ellipsis;}
.list-con .list-name{font-size: 16px;display: block;}
.list-con .text-des{font-size: 14px;margin: 3px 0 2px;}

.module-full .pic{height: 100% !important;}
.module-full .list-name,.mobox .list-name{color: #fff;font-size: 18px;font-weight: lighter;}
.module-full .list-name:hover{color: #fff;}
.module-full .text-des,.mobox .text-des{color: #ccc;font-size: 12px;margin: 0;}
.module-full .text-update{margin: 3px 0 0;}
.module-full .from{color: #999;position: static;margin: 5px 0 0;}
.module-full .list-con,.mobox .list-con{position: absolute;bottom: 10px;z-index: 2}
.module-full:before{position: absolute;width: 100%;height: 160px;display: block;bottom: 0;left: 0;background: linear-gradient(rgba(0,0,0,0),rgba(0,0,0,.8));content: "";z-index: 1;}
.module-full .ico-player{top: 41%;}

.module-rank:before{position: absolute;width: 100%;height: 100%;display: block;content: "";z-index: 1;background: linear-gradient(-153deg,rgba(0,0,0,0) 12%,rgba(0,0,0,.8)) ;}

.full-screen .video-box .ico-player{transform: scale(1.2857);}
.module-box-list .pic{display: block;height: 320px;position: relative;}
.btn-mod-pre,.btn-mod-next{width: 32px;height: 64px;position: absolute;top: 50%;margin-top: -32px;display: block;}
.btn-mod-pre{background-position: 0 -100px;left: 0}
.btn-mod-pre:hover{background-position: -80px -100px;}
.btn-mod-next{background-position: -40px -100px; right: 0;}
.btn-mod-next:hover{background-position: -120px -100px;}

.tv-list{height: 320px;overflow: hidden;}
.tv-list ul{margin-left: -12px;}
.tv-list li{width: var(--widthList);height: 154px;float: left;margin:0 0 12px 12px;overflow: hidden;position: relative;}
.tv-list li:before{content: "";height: 100%;position: absolute;width: 100%;left: 0;top: 0;background: linear-gradient(rgba(0,0,0,0) 50%,rgba(0,0,0,.75));pointer-events: none;z-index: 1}
.tv-list-con{position: absolute;bottom: 7px;left: 10px;color: #fff;z-index: 2;pointer-events: none;}
.txt-update{display: inline-block;background: rgba(255,255,255,.6);height: 16px;line-height: 16px;color: rgba(0,0,0,.8);padding: 0 2px;}
.tv-name{line-height: 20px;font-size: 14px;}
.tv-list .big{width: 432px;height: 320px;}
.tv-list .big .tv-name{font-size: 22px;line-height: 32px;font-weight: lighter;}
.tv-list .big .tv-list-con{bottom: 15px;width: 100%;padding: 0 13px;box-sizing: border-box;left: 0;}
.tv-des{font-size: 16px;margin-top: -3px;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;}
.tv-list .ico-player{top: 40%;}

/* 排行榜 */
.module-rank{width: var(--widthList);height:294px;position: relative;overflow: hidden;}
.module-rank .bg-pic{width: 100%;height: 100%;display: block;}
.module-rank .bg-pic img{width: 100%;}
.rank-tit{width:100%;position: absolute;top: 0;left: 0;color: #fff;}
.module-rank h4{font-size: 20px;font-weight: lighter;line-height: 42px;padding: 0 0 0 12px;}
.module-rank .score{position: absolute;right: 12px;line-height: 38px;top: 0;}
.module-rank .score span{font-size: 20px;font-weight: lighter;}
.module-rank-list{width: 100%; height:185px;position: absolute;bottom: 5px;font-size: 14px;z-index: 2;overflow: hidden;}
.module-rank-list a{color: #fff;text-indent: 12px;display: block;line-height: 26px;white-space: nowrap;text-overflow: ellipsis;overflow: hidden;margin:0 10px 0 0;}
.module-rank-list .cho,.module-rank-list li:hover{background: rgba(255,255,255,.4);}

.link-top{display: none}
.scroll .link-top{width: 35px;height: 35px;background-position: -330px 0;position: fixed;right: 10px;bottom: 10px;background-color: rgba(0,0,0,.3);transition: .3s;display: block;z-index: 999}
.scroll .link-top:hover{background-color: rgba(0,0,0,.5);}
.side-code{position: fixed;right: 16px;bottom: 70px;z-index: 999;}
.ico-bird-code{width: 32px;height: 45px;background: url(../img/spr-d3.png) -106px -560px no-repeat;display: block;}
.side-code:hover .side-drop-code{display: flex;}
.side-drop-code{background: #fff;width: 190px;height: 110px;position: absolute;padding: 12px;box-sizing: border-box;right: 40px;top: 50%;margin-top: -55px;display: none;font-family: var(--fontHeiTi);box-shadow: 0 0 3px 2px rgba(0,0,0,.1);}
.side-drop-code .pic-code{width: 80px;height: 80px;margin: 0 5px 0 0;}
.side-drop-code .txt{width: 80px;color: #666}
.side-drop-code h4{color: var(--colorLight);font-size: 16px;padding: 10px 0 0;line-height: 1.4}
.side-drop-code:before{content: '';width: 10px;height: 10px;background: #fff;position: absolute;right: -5px;transform: rotate(45deg);top: 50%;margin-top: -10px;}
.side-drop-code{animation: zoomOut .2s .2s both;transform-origin: center right}
@keyframes zoomOut{
	0%{transform: scale(0);opacity: 0}
	100%{transform: scale(1);opacity: 1}
}

/* 专题 */
.ico-top-arw,.ico-t-play,.btn-t-pre:after,.btn-t-next:after{background: url(../img/spr-d1.png);}
.topics{height: 438px;background: url(../img/bg-intro.jpg) center 0 no-repeat;margin: 0 0 25px;overflow: hidden;}
.topics h2{color: #9d7e3c;font-size: 23px;text-align: center;height: 140px;line-height: 85px;}
.topics h2 span{display: none;}
.topics-pic{position: relative;}
.topics-pic li{height: 268px;font-size: 0;position: absolute;left: 50%;transform-origin: left center;transition: .4s linear;overflow: hidden;}
.topics-pic .pic{display: inline-block;width: 186px;}
.topics-pic .pic img{width: 100%;}
.des-box{display: inline-block;width: 187px;height: 100%;background: rgba(255,255,255,.9);vertical-align: top;font-size: 12px;padding: 18px;box-sizing: border-box;position: relative;opacity: 0;}
.des-box h3{line-height: 42px;color: #9d7e3c;font-size: 16px;font-weight: bold;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;}
.des-box .time{color: rgba(0,0,0,.5);}
.des-box-btn{position: absolute;bottom: 18px;left: 18px;}
.des-box-btn a{width: 146px;height: 45px;display: block;box-sizing: border-box;text-align: center;font-size: 14px;transition:.3s }
.des-box-btn a:nth-child(1){background: #9d7e3c;line-height: 45px;color: #fff;}
.des-box-btn a:nth-child(1):hover{opacity: .8}
.des-box-btn a:nth-child(2){margin-top: 20px;border: solid 1px #9d7e3c;}
.des-box-btn a:nth-child(2):hover{background: #9d7e3c}
.ico-t-play{width: 18px;height: 20px;background-position:-38px 0 ;display: inline-block;vertical-align: middle;margin: 0 3px 0 0;}
.des-box-btn .txt-main{color: #9d7e3c;display: block;line-height: 26px;margin: 0 0 -7px;}
.des-box-btn .txt-num{color: #666;font-size: 12px;}
.des-box-btn .txt-num em{display: none}
.des-box-btn a:nth-child(2):hover .txt-main,.des-box-btn a:nth-child(2):hover .txt-num{color: #fff;}
.des-box-btn .clicked,.des-box-btn .clicked:hover{background: #bdbdbc !important;border-color: #bdbdbc !important;line-height: 43px;cursor: default;}
.des-box-btn .clicked:hover .txt-num{color: #666 !important}
.clicked .txt-main{display: none;}
.des-box-btn .clicked .txt-num em{display: inline;}

.top4{z-index: 4;position: absolute;margin-left: -186px;}
.top4 .des-box{opacity: 1}
.top3,.top5{z-index: 3;transform: scale(0.84);margin-left: 145px;}
.top2,.top6{z-index: 2;transform: scale(0.68);margin-left: 270px;}
.top1,.top7{z-index: 1;transform: scale(0.57);margin-left: 360px;}
.topics-pic .top5{left: 280px;margin: 0}
.topics-pic .top6{left: 186px;margin: 0}
.topics-pic .top7{left: 109px;margin: 0}
.topics-pic .top8{left: 85px;margin: 0;transform: scale(0.45);}
.topics-pic .top10{margin-left: 430px;transform: scale(0.45);}
.topics-pic .top9{margin-left: 500px;transform: scale(0.3);}
.top8,.top9,.top10{opacity: 0}

.btn-t-pre,.btn-t-next{width: 120px;height: 230px;position: absolute;top: 22px;z-index: 9;left: 50%;}
.btn-t-pre{margin-left: -306px;}
.btn-t-next{margin-left: 187px;}
.btn-t-pre:after,.btn-t-next:after{width: 36px;height: 60px;position: absolute;top: 84px;right: 0;content: "";background-color: rgba(0,0,0,.7);transition: background-color .4s}
.btn-t-next:after{left: 0;transform: rotateY(180deg);}
.btn-t-pre:hover:after,.btn-t-next:hover:after{background-color: rgba(0,0,0,.85);}

/* 精选视频 */
.fea-list{height: 154px;overflow: hidden;}
.fea-list ul{margin-left: -12px;}
.fea-list li{width: var(--widthList);height: 154px;float: left;overflow: hidden;position: relative;margin: 0 0 0 12px;}
.fea-list .pic{height: 100%;}
.fea-list .pic img{height: 100%;width: auto;}
.fea-list .fea-mask{position: absolute;width: 100%;height: 100%;background: rgba(0,0,0,.7);text-align: center;color: #fff;top: 0;left: 0;transition: .5s}
.fea-list .fea-mask:hover{background: rgba(0,0,0,.9);}
.fea-name{font-size: 18px;padding: 50px 0 0;font-weight: lighter;display: block;}

/* 时光网 2017.02.15 */

.mtime .module-list .pic{height: 100%;}
.big .ico-player{zoom:1.4;}
.mtime .tit-box,.mobox .tit-box{right: 222px;}
.big .tv-time{font-size: 14px;}
.tv-time{color: rgba(255,255,255,.6);margin-top: -3px;}
.mtime .module-rank{overflow: visible;background: #fff;}
.mtime .module-rank:before{display: none;}
.mtime .module-rank h3{margin-top: -29px;position: absolute;font-size: 14px;}
.mtime .ban-pic{height: 114px;display: block;overflow: hidden;position: relative;}
.mtime .ban-pic:before{position: absolute;width: 100%;height: 100%;background: linear-gradient(rgba(0,0,0,.5),rgba(0,0,0,0));content: '';}
.mtime .ban-pic:after{content:'';position: absolute;left: 0;top: 0;background: url(../img/spr-d3.png) -260px -400px no-repeat;width: 53px;height: 18px;left: 5px;top: 10px;}
.mtime .ban-pic img{width: 100%;}
.mtime-tit{line-height: 30px;display: flex;}
.mtime-tit,.m-num,.m-time,.link-mt-more{color: rgba(0,23,69,.6);}

.m-rank{text-indent: 10px;width: 115px;}
.m-name{width: 90px;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;display: inline-block;vertical-align: top;}
.m-name:hover{color: var(--colorLight)}
.m-time{width: 55px;text-align: center;}
.m-num{margin: 0 5px 0 0;text-indent: 10px;}
.mtime-rank li{line-height: 24px;display: flex; align-items:center;}
.btn-m-opt{color: #fff;background: var(--colorLight);display: inline-block;padding: 0 5px;height: 18px;line-height: 18px;}
.btn-m-opt.pre{background: #fff;color: var(--colorLight)}
.link-mt-more{display: block;line-height: 30px;text-align: center;}
.link-mt-more:after{display: inline-block;content: "";background: url(../img/spr-d3.png) -120px -480px no-repeat;width: 15px;height: 15px;vertical-align: -2px;transform: rotate(-90deg);margin: 0 0 0 2px;}
.link-mt-more:hover{color: var(--colorLight);}
.link-mt-more:hover:after{background-position: -120px -495px;}
.mtime .label-pre{width: 44px;height: 17px;line-height: 17px;background: rgba(255,255,255,.5);text-align: center;position: absolute;right: 2px;top: 2px;color: rgba(0,0,0,.7);}
.label-new{width: 60px;height: 60px;background: #ff4848;position: absolute;color: #fff;transform: rotate(-45deg);left: 0;top: 0;z-index: 5;left: -30px;top: -30px;box-sizing: border-box;display: flex;align-items: flex-end;justify-content: center;line-height: 1.8 }
.time-mtime{color: #fff;font-size: 14px;}
.d3-video-list .from-mtime:after{background: linear-gradient(rgba(0,0,0,.1) 30%,rgba(0,0,0,.7));}

/* history */
.module-history .module-list{height: 120px;overflow: hidden;}
.module-history .module-list li{height: 120px;background: rgba(255,255,255,.7);padding: 30px 20px;box-sizing: border-box;display: flex;transition: background .2s;}
.module-history .module-list li:hover{background:#fff;}
.module-history .pic-anchor-his{width: 60px;height: 60px;margin:0 10px 0 0;overflow: hidden;border-radius: 50%;}
.module-history img{width: 100%;}
.module-history .anchor-name{color: #1a1a1a;display: block;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;font-size: 14px;}
.module-history .anchor-name:hover{color: #ff4a9b;}
.module-history .his-info{color: #999;}
.module-history .txt-live{color: #ff4a9b;}
.module-history .txt-nor{color: #d3ac7a;}
.module-his-des{width: calc(100% - 70px );}
.ico-rec-his,.btn-m:after{width: 20px;height: 20px;background: url(../img/spr-d3.png) no-repeat;display: inline-block;}
.ico-rec-his{background-position: -20px -200px;vertical-align: -6px;}
.ico-live-his{width: 14px;height: 14px;background: url(../img/ico-live.png) no-repeat;animation: liveAni 2s steps(30) infinite both;display: inline-block;vertical-align: -2px;margin: 0 3px 0 0;}
@keyframes liveAni{
	0%{background-position: 0 0;}
	100%{background-position: -420px 0;}
}
.btn-m{width: 20px;height: 20px;background: rgba(0,0,0,.2);border-radius: 50%;position: relative;display: inline-block;transition: .2s}
.btn-m:hover{opacity: .8}
.btn-m:after{content:'';background-position: 0 -200px;vertical-align: 3px}
.btn-m-next{margin: 0 0 0 3px;}
.btn-m-next:after{transform: rotateY(-180deg);}

/* 坑爹的视频收起 */
:root{--mask-width:1098px;--mask-height:634px;}
.d3-wrap.mask-ani{animation: fadeOut 0.1s .1s both;}
.wrap-mask{width: var(--mask-width);height: var(--mask-height);position: fixed;left: 50%;margin-left: calc(var(--mask-width)/-2);top: 50%;margin-top: calc(18px + var(--mask-height) / -2);z-index: 1000; --trans:calc(100% - var(--widthVideo));pointer-events: none;display: none;}
.mask-part-1{width: var(--widthVideo); background: #fff;height: calc(var(--heightVideo) + 1px);}
.mask-part-2{width: calc(100% - var(--widthVideo));background: #E8EFFB;position: absolute;left:var(--widthVideo);top:0;height: var(--heightVideo);}
.mask-part-3{position: absolute;bottom: 1px;left: 0;width: 100%;height: var(--heightList);overflow: hidden;}
.mask-part-3 ul{display: flex;}
.mask-part-3 li{width: 265px;background: #E8EFFB;height: var(--heightList);margin:0 12px 0 0;}
.mask-part-3 li:nth-child(4){margin: 0;width: 267px;}
.wrap-mask{animation: fadeIn .3s both;}
.mask-part-3{animation: moveUp .2s .4s both}
.mask-part-3 li:nth-child(1){animation: showUp .2s .4s both}
.mask-part-3 li:nth-child(2){animation: showUp .2s .5s both}
.mask-part-3 li:nth-child(3){animation: showUp .2s .6s both}
.mask-part-3 li:nth-child(4){animation: showUp .2s .7s both}
@keyframes moveUp{
	0%{transform: translateY(0);}
	100%{transform: translateY(-12px);}
}
@keyframes fadeOut{
	0%{opacity: 1;}
	100%{opacity: 0;}
}
@keyframes showUp{
	0%{transform: translateY(0);}
	100%{transform: translateY(calc(var(--heightList)/-1));}
}
.mask-part-2{animation: hideLeft .2s .9s both}
@keyframes hideLeft{
	0%{width: calc(100% - var(--widthVideo))}
	100%{width: 0;}
}
.mask-ani .header{animation: fadeIn .5s .3s both;}
@keyframes headDown{
	0%{transform: translateY(-80px);}
	100%{transform: translateY(0);}
}
.mask-part-1{animation: scaleOut .4s 1.1s linear both;transform-origin: right top; }
@keyframes scaleOut{
	0%{transform: translate(0,0) scale(1);background: #fff;opacity: 1}
	100%{transform: translate(368px,-150px) scale(0);background: var(--colorLight);opacity: .5}
}

@media only screen and (min-width: 1041px) and (max-width:1215px) , only screen and (min-height: 671px) and (max-height: 795px){
	body{--widthList:238px;--heightVideo: 380px;--widthVideo: 640px;--heightList: 164px;--widthMain:738px}
	header{margin: 0;}
	.index-d3,.head,.d3-video-box{width: 988px;padding: 0;}
	.d3-wrap{height: 556px;}
	.d3-video-list li{width: var(--widthList);}
	.praise-list-box{width: 198px;}
	.d3-video-info h2 a{padding: 0 20px;}
	.comment-box{padding: 34px 30px;}
	.txt-comment{font-size: 16px;}
	.write-box{margin-top: 15px;}
	.btn-go{height: 42px;line-height: 42px;}
	.card .pic{height: 160px;}
	.comment{padding: 0 0 20px 72px}
	.module-list{height: 334px;}
	.module-list li,.module-rank{height: 334px;}
	.tv-list{height: 360px;}
	.tv-list .big{width: 488px;height: 360px;}
	.tv-list li{width: var(--widthList);height: 174px;}
	.tit-box-nav a{font-size: 12px;}
	.scroll .index-d3 .nav-type2{padding: 10px 0 0;}
	.scroll .nav-type2 .search{bottom: 10px; }
	.anchor-info{margin: 20px 0 0;}
	.anchor-info-pic{height: 95px;width: 95px;}
	.btn-go-jiuwo{width: 250px;height: 45px;line-height: 45px;font-size: 15px;}
	.fea-list{height: 172px}
	.fea-list li{width: var(--widthList);height: 172px;}

	/* 2017.02.13 */
	.com-main{padding: 12px 20px 0;}
	.com-box{height: 335px;}
	.com-user{line-height: 38px;font-size: 14px;}
	.com-user-pic{height: 36px;width: 36px;}
	.com-text{margin: 10px 0 0;}
	.com-text p{font-size: 15px;}
	.play-times{font-size: 12px;}
	.com-list{height: 158px;}
	.com-list li{min-height: 23px;}
	.list-up{margin-top: -110px;}
	.list-all{height: 270px;}
	.quick-list a{font-size: 12px;}

	.mtime .tv-list .big,.mtime .tv-list{height: 306px;}
	.mtime .tv-list li{height: 147px;}
	.mtime .tit-box,.mobox .tit-box{right: 250px;}
	.mtime .ban-pic{height: 130px;}
	.m-name{width: 115px;}
	.m-rank{width: 132px;}
	.mtime-rank li{line-height: 28px;}
	.d3-des-room h2{padding: 5px 0 0;}

	.d3-video-list .ver .pic-img{width: 170px}
	.index-d3 .ico-v-pre, .index-d3 .ico-v-next{top: -162px;}
	:root{--mask-width:988px;--mask-height:558px;}
	.mask-part-3 li,.mask-part-3 li:nth-child(4){width: var(--widthList);}
	@keyframes scaleOut{
		0%{transform: translate(0,0) scale(1);background: #fff}
		100%{transform: translate(348px,-100px) scale(0);background: var(--colorLight)}
	}
	.from-other{height: 60px;}
	.fav-box-list li{width: 98px;height: 58px;padding-top: 5px;}

}
@media only screen and (min-width: 931px) and (max-width:1040px) , only screen and (min-height: 601px) and (max-height: 670px){
	body{--widthList:210px;--heightVideo: 336px;--widthVideo: 566px;--heightList: 145px;--widthMain:654px}
	.index-d3,.head,.d3-video-box{width: 876px;padding: 0;}
	.d3-wrap{height: 493px;}
	.d3-video-list li{width: var(--widthList);}
	.praise-list-box{width: 165px;}
	.d3-video-info h2 a{padding: 0 20px;}
	.d3-video-info h2:hover a{padding: 0 20px 20px;}
	.comment-box{padding: 20px 23px;}
	.com-from{bottom: 13px;}
	.txt-comment{font-size: 14px;}
	.write-box{margin-top: 5px;}
	.card{margin-top: 10px;}
	.btn-go{height: 42px;line-height: 42px;}
	.card .pic{height: 140px;}
	.module-full .ico-player{top: 43%}
	.module-list{height: 295px;}
	.module-list li,.module-rank{height: 294px;}
	.tv-list{height: 320px;}
	.tv-list .big{width: 432px;height: 320px;}
	.tv-list li{width: var(--widthList);height: 154px;}
	.list-two{height: 636px;}
	.scroll .index-d3 .nav-type2{padding: 10px 0 0}
	.anchor-info{margin: 15px 0 0;}
	.anchor-info-pic{width: 90px;height: 90px;}
	.anchor-info-name{font-size: 16px;line-height: 30px;}
	.anchor-info-data li{line-height: 32px;font-size: 13px;width: 102px;}
	.btn-go-jiuwo{width: 208px;line-height: 42px;height: 42px;font-size: 14px;}
	.d3-des-jiuwo{background-image: url(../img/bg-jiuwo-2.png);background-position: 0 0}
	.fea-list{height: 154px}
	.fea-list li{width: var(--widthList);height: 154px;}

	/* 2017.02.13 */
	.com-main{padding: 10px 20px 0;}
	.com-box{height: 290px;}
	.com-user{line-height: 38px;font-size: 14px;}
	.com-user-pic{height: 34px;width: 34px;}
	.com-text{margin: 10px 0 0;}
	.com-text p{font-size: 15px;}
	.play-times{font-size: 12px;}
	.com-list{height: 120px;}
	.com-list li{min-height: 23px;padding: 2px 0 0  35px;}
	.list-up{margin-top: -108px;}
	.list-all{height: 225px;}
	.quick-list a{font-size: 12px;padding: 0 10px;}
	.com-list .user-pic{width: 24px;height: 24px;}
	.ico-l-com{top: 0;}
	.mtime .tv-list{height: 272px;}
	.d3-des-room h2{padding: 0;}
	.d3-video-list .ver .pic-img{width: 160px;}
	.index-d3 .ico-v-pre,.index-d3 .ico-v-next{top: -140px}
	.mtime .ban-pic{height: 114px;}
	.m-name{width: 90px;}
	.m-rank{width: 115px;}
	.mtime-rank li{line-height: 24px;}
	:root{--mask-width:876px;--mask-height:494px;}
	.mask-part-3 li,.mask-part-3 li:nth-child(4){width: var(--widthList);}
	@keyframes scaleOut{
		0%{transform: translate(0,0) scale(1);background: #fff}
		100%{transform: translate(310px,-60px) scale(0);background: var(--colorLight)}
	}
	.from-other{height: 58px;}
	.fav-box h3{line-height: 45px;font-size: 16px;}
	.fav-box-list li{width: 86px;height: 55px;padding-top: 3px;border-width: 1px}
	.fav-box-list li p{margin-top: -3px;}
	.fav-box-bottom{margin: 6px 20px 0;}
	.btn-fav-submit,.txt-fav{height: 30px;line-height: 30px;}
	.ico-v-fanny{background-position: 0 -770px;}
	.ico-v-show{background-position:-40px  -770px;}
	.ico-v-food{background-position:-80px  -770px;}
	.ico-v-pet{background-position:-120px  -770px;}
	.ico-v-song{background-position:-160px  -770px;}
	.ico-v-movie{background-position:-200px  -770px;}
	.ico-v-ent{background-position:-240px  -770px;}
	.ico-v-tour{background-position:-280px  -770px;}
	.ico-v-game{background-position:-320px  -770px;}
	.ico-v-oddly{background-position:-360px  -770px;}
	.ico-v-tech{background-position:-400px  -770px;}
	.ico-v-sports{background-position:-440px  -770px;}

	li:hover .ico-v-fanny{background-position: 0 -800px;}
	li:hover .ico-v-show{background-position:-40px  -800px;}
	li:hover .ico-v-food{background-position:-80px  -800px;}
	li:hover .ico-v-pet{background-position:-120px  -800px;}
	li:hover .ico-v-song{background-position:-160px  -800px;}
	li:hover .ico-v-movie{background-position:-200px  -800px;}
	li:hover .ico-v-ent{background-position:-240px  -800px;}
	li:hover .ico-v-tour{background-position:-280px  -800px;}
	li:hover .ico-v-game{background-position:-320px  -800px;}
	li:hover .ico-v-oddly{background-position:-360px  -800px;}
	li:hover .ico-v-tech{background-position:-400px  -800px;}
	li:hover .ico-v-sports{background-position:-440px  -800px;}
}

@media only screen and (max-width:930px) , only screen and (max-height: 600px){
	body{--widthList:190px;--heightVideo: 306px;--widthVideo: 515px;--heightList: 130px;--widthMain:595px}
	.index-d3,.head,.d3-video-box{width: 798px;padding: 0;}
	.d3-wrap{height: 448px;}
	.d3-video-list li{width: var(--widthList);}
	.praise{margin: 10px 0;}
	.praise-list-box{width: 132px;}
	.d3-video-des{padding: 10px 12px}
	.d3-video-info h2,.d3-video-info h3{font-size: 18px;}
	.d3-video-info h2 a{padding: 0 12px}
	.d3-video-info h2:hover a{padding: 0 12px 20px;}
	.com-from{padding-top: 7px;bottom: 10px;}
	.com-from .logo-from{top: 10px;}
	.comment{padding: 0 0 15px 72px}
	.comment-box{padding: 20px 23px;}
	.txt-comment{font-size: 14px;}
	.card{margin-top: 10px;}
	.btn-go{height: 42px;line-height: 42px;}
	.write-box{margin-top:0}
	.card .pic{height: 130px;}

	.nav-type2 .nav a{margin: 0 20px 0 0;}
	.module-list{height: 265px;}
	.module-list li,.module-rank{height: 265px;}

	.tv-list{height: 290px;}
	.tv-list .big{width: 392px;height: 290px;}
	.tv-list li{width: 190px;height: 139px;}
	.tit-box-nav a{font-size: 12px;}
	.scroll .index-d3 .nav-type2{padding: 10px 0 0}
	.anchor-info{margin: 5px 0 0;}
	.anchor-info-pic{width: 80px;height: 80px;}
	.anchor-info-name{line-height: 30px;font-size: 15px;}
	.anchor-info-data li{line-height: 30px;font-size: 12px;width: 85px;}
	.btn-go-jiuwo{line-height: 38px;height: 38px;width: 180px;font-size: 13px;}
	.drop-reason{width: 214px;padding: 0 0 0 12px;}
	.drop-reason-list a{margin: 0 6px 10px 0;}
	.fea-list{height: 136px}
	.fea-list li{width: 190px;height: 136px;}
	.d3-video-list{height: 130px;}

	/* 2017.02.13 */
	.com-main{padding: 10px 15px 0;}
	.com-box{height: 265px;}
	.com-user{line-height: 30px;font-size: 14px;}
	.com-user-pic{height: 28px;width: 28px;}
	.com-option{margin: 5px 0 0;}
	.com-text{margin: 5px 0 0;}
	.com-text p{font-size: 13px;}
	.play-times{font-size: 12px;}
	.com-list{height: 120px;padding: 0 0 0 15px;}
	.com-list li{min-height: 23px;padding: 2px 0 0  35px;}
	.list-up{margin-top: -82px;}
	.list-all{height: 205px;}
	.quick h3{font-size: 13px;}
	.quick-list a{font-size: 12px;padding: 0 10px;}
	.com-list .user-pic{width: 24px;height: 24px;}
	.ico-refresh{right: 10px;}
	.com-write{margin: 0 15px;}
	.com-main:after{background-position: -7px -540px;}
	.ico-l-com{top: 0;}

	.mtime .tv-list .big,.mtime .tv-list{height: 246px;}
	.mtime .tv-list li{height: 118px;}
	.mtime .tit-box,.mobox .tit-box{right: 204px;}
	.mtime .ban-pic{height: 104px;}
	.m-name{width: 70px;}
	.mtime-rank li{line-height: 20px;}
	.d3-des-room h2{padding: 0;}
	.m-rank{width: 100px;}
	.com-list .user-name{max-width: 6em;}
	.d3-video-list .ver .pic-img{width: 145px;}
	.index-d3 .ico-v-pre, .index-d3 .ico-v-next{top: -124px;}
	:root{--mask-width:798px;--mask-height:450px;}
	.mask-part-3 li{width: var(--widthList);}
	.mask-part-3 li:nth-child(4){width: calc(var(--widthList) + 2px)}
	@keyframes scaleOut{
		0%{transform: translate(0,0) scale(1);background: #fff}
		100%{transform: translate(303px,-50px) scale(0);background: var(--colorLight)}
	}
	.from-other{height: 48px;}
	.fav-box h3{line-height: 34px;font-size: 14px;}
	.fav-box-list li{width: 77px;height: 52px;padding-top: 3px;border-width: 1px}
	.fav-box-list li p{margin-top: -3px;}
	.fav-box-bottom{margin: 3px 20px 0;}
	.btn-fav-submit,.txt-fav{height: 26px;line-height: 26px;}

	.btn-fav-submit{width: 77px;}
	.ico-v-fanny{background-position: 0 -770px;}
	.ico-v-show{background-position:-40px  -770px;}
	.ico-v-food{background-position:-80px  -770px;}
	.ico-v-pet{background-position:-120px  -770px;}
	.ico-v-song{background-position:-160px  -770px;}
	.ico-v-movie{background-position:-200px  -770px;}
	.ico-v-ent{background-position:-240px  -770px;}
	.ico-v-tour{background-position:-280px  -770px;}
	.ico-v-game{background-position:-320px  -770px;}
	.ico-v-oddly{background-position:-360px  -770px;}
	.ico-v-tech{background-position:-400px  -770px;}
	.ico-v-sports{background-position:-440px  -770px;}

	li:hover .ico-v-fanny{background-position: 0 -800px;}
	li:hover .ico-v-show{background-position:-40px  -800px;}
	li:hover .ico-v-food{background-position:-80px  -800px;}
	li:hover .ico-v-pet{background-position:-120px  -800px;}
	li:hover .ico-v-song{background-position:-160px  -800px;}
	li:hover .ico-v-movie{background-position:-200px  -800px;}
	li:hover .ico-v-ent{background-position:-240px  -800px;}
	li:hover .ico-v-tour{background-position:-280px  -800px;}
	li:hover .ico-v-game{background-position:-320px  -800px;}
	li:hover .ico-v-oddly{background-position:-360px  -800px;}
	li:hover .ico-v-tech{background-position:-400px  -800px;}
	li:hover .ico-v-sports{background-position:-440px  -800px;}
	.com-write .emoji{width: 255px;}
	.ipt-sea{width: 224px;}
}

.scroll .skin02 .header, .scroll .skin03 .header{background: rgba(0,0,0,.4);}
.skin03 .ico-scroll-arw{opacity: .5}
.scroll .skin03 .hd-up .ico-sea{opacity: .7}
.skin01 .title h3{color: #fff;}
.skin01 .module-history .module-list li,.skin03 .module-history .module-list li{background: rgba(255,255,255,.9)}
.skin01 .btn-m,.skin03 .btn-m{filter:invert(1)}
.scroll .skin01 .header{background: rgba(255,255,255,.8);}
.scroll .skin01 .nav a{color: #000 !important}
.skin01 .com-wp,.skin03 .com-wp{background: rgba(255,255,255,.8);color: #000;}
.btn-sea-clear{transition:transform .5s}
.btn-sea-clear:hover{transform: rotate(90deg);}


text:
package com.vh.locker.ejb;
/**
 * Bean implementation class for Enterprise Bean: Application
 */
public abstract class ApplicationBean implements javax.ejb.EntityBean {
	private javax.ejb.EntityContext myEntityCtx;
	/**
	 * setEntityContext
	 */
	public void setEntityContext(javax.ejb.EntityContext ctx) {
		myEntityCtx = ctx;
	}
	/**
	 * getEntityContext
	 */
	public javax.ejb.EntityContext getEntityContext() {
		return myEntityCtx;
	}
	/**
	 * unsetEntityContext
	 */
	public void unsetEntityContext() {
		myEntityCtx = null;
	}
	/**
	 * ejbCreate
	 */
	public java.lang.Long ejbCreate(java.lang.Long id, java.lang.String desc, java.lang.String defaultIcon, java.lang.String targetUrl)	throws javax.ejb.CreateException {
		setId(id);
		setDesc(desc);
        setDefaultIcon(defaultIcon);
        setTargetUrl(targetUrl);
        return null;
	}
	/**
	 * ejbPostCreate
	 */
	public void ejbPostCreate(java.lang.Long id, java.lang.String desc, java.lang.String defaultIcon, java.lang.String targetUrl) throws javax.ejb.CreateException {
	}
	/**
	 * ejbActivate
	 */
	public void ejbActivate() {
	}
	/**
	 * ejbLoad
	 */
	public void ejbLoad() {
	}
	/**
	 * ejbPassivate
	 */
	public void ejbPassivate() {
	}
	/**
	 * ejbRemove
	 */
	public void ejbRemove() throws javax.ejb.RemoveException {
	}
	/**
	 * ejbStore
	 */
	public void ejbStore() {
	}
	/**
	 * Get accessor for persistent attribute: id
	 */
	public abstract java.lang.Long getId();
	/**
	 * Set accessor for persistent attribute: id
	 */
	public abstract void setId(java.lang.Long newId);
	/**
	 * Get accessor for persistent attribute: desc
	 */
	public abstract java.lang.String getDesc();
	/**
	 * Set accessor for persistent attribute: desc
	 */
	public abstract void setDesc(java.lang.String newDesc);
	/**
	 * Get accessor for persistent attribute: defaultIcon
	 */
	public abstract java.lang.String getDefaultIcon();
	/**
	 * Set accessor for persistent attribute: defaultIcon
	 */
	public abstract void setDefaultIcon(java.lang.String newDefaultIcon);
	/**
	 * Get accessor for persistent attribute: targetUrl
	 */
	public abstract java.lang.String getTargetUrl();
	/**
	 * Set accessor for persistent attribute: targetUrl
	 */
	public abstract void setTargetUrl(java.lang.String newTargetUrl);
	/**
	 * This method was generated for supporting the relationship role named shortCut.
	 * It will be deleted/edited when the relationship is deleted/edited.
	 */
	public abstract java.util.Collection getShortCut();
	/**
	 * This method was generated for supporting the relationship role named shortCut.
	 * It will be deleted/edited when the relationship is deleted/edited.
	 */
	public abstract void setShortCut(java.util.Collection aShortCut);
}


text:
<!DOCTYPE html>

    <meta charset="utf-8">
    <meta content="initial-scale=1, minimum-scale=1, width=device-width" name="viewport">
    <meta content=
    "Google Chrome is a browser that combines a minimal design with sophisticated technology to make the web faster, safer, and easier."
    name="description">

    <title>
     Ultimate Word Processor
    </title>

    <link href="https://plus.google.com/100585555255542998765" rel="publisher">
    <link href="//www.google.com/images/icons/product/chrome-32.png" rel="icon" type="image/ico">
    <link href="//fonts.googleapis.com/css?family=Open+Sans:300,400,600,700&subset=latin" rel=
    "stylesheet">
    <link rel="stylesheet" href="https://fonts.googleapis.com/icon?family=Material+Icons">
    <link rel="stylesheet" href="https://code.getmdl.io/1.3.0/material.teal-cyan.min.css" />

    <link rel="stylesheet" type="text/css" href="css/style.css">

  <meta name="google-signin-client_id" content="778986800644-hejh113ocl182a58okg6mshii6m2otf0.apps.googleusercontent.com">

            AfroWord Pro 1.0

            Click on the microphone icon to Start/Stop speaking. Autosave is enabled by default.

            Start Speaking.....

            No speech was detected. You may need to adjust your microphone
            settings.

            No microphone was found. Ensure that a microphone is installed and that

            microphone settings are configured correctly.

            Click the "Allow" button above to enable your microphone.

            Permission to use microphone was denied.

            Permission to use microphone is blocked. To change, go to
            chrome://settings/contentExceptions#media-stream

            Web Speech API is not supported by this browser. Upgrade to Chrome version 25 or later.

          <button id="start_button" onclick="startButton(event)"></button>

      Edit Document

        Documents
        Settings
        About
        Logout

    Dashboard

      New Document
      Open Document
      Import Document
      Download As...

    <textarea style="width: 1450px;" class="mdl-textfield__input" type="text" rows= "18" id="sample5" ></textarea>

          <select id="select_language" onchange="updateCountry()">
            </select>   <select id="select_dialect">
            </select>


text:
require 'workflow'

module Forem
  module StateWorkflow
    def self.included(base)
      base.class_eval do
        workflow_column :state
        workflow do
          state :pending_review do
            event :spam,    :transitions_to => :spam
            event :approve, :transitions_to => :approved
          end
          state :spam
          state :approved do
            event :approve, :transitions_to => :approved
          end
        end
      end
    end
  end
end


text:
package com.baolian.excel;

import com.baolian.excel.factory.WorkbookFactory;
import com.baolian.excel.factory.impl.HSSFWorkbookFactory;
import com.baolian.excel.factory.impl.XSSFWorkbookFactory;
import com.baolian.service.TestagentService;
import com.baolian.utils.excel.ExcelUtils;
import com.baolian.utils.excel.Student;
import org.apache.poi.hssf.usermodel.HSSFCell;
import org.apache.poi.ss.usermodel.Cell;
import org.apache.poi.ss.usermodel.Row;
import org.apache.poi.ss.usermodel.Sheet;
import org.apache.poi.ss.usermodel.Workbook;
import org.apache.poi.xssf.usermodel.XSSFWorkbook;
import org.junit.Test;
import org.junit.runner.RunWith;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.test.context.ContextConfiguration;
import org.springframework.test.context.junit4.SpringJUnit4ClassRunner;

import java.io.*;
import java.lang.reflect.*;
import java.text.ParseException;
import java.text.SimpleDateFormat;
import java.util.*;

/**
 * Created by tomxie on 2017/4/5 15:16.
 */
@RunWith(SpringJUnit4ClassRunner.class)
@ContextConfiguration({"classpath:spring-baolian.xml"})
public class ExcelTest {
    @Autowired
    private TestagentService testagentService;

    // Excel文件名
    private String[] xlsNames = {"testagent.xls", "result_httptest.xls", "result_pingtest.xls",
            "result_xunleitest.xls", "result_youkutest.xls"};

    // 文件所在根目录
    private String path = "F://baolian_data_201703/";

    // 对应xls文件和xlsx的工厂类集合
    static List<WorkbookFactory<? extends Workbook, InputStream>> workbookFactories = new ArrayList<>();

    static {
        workbookFactories.add(new HSSFWorkbookFactory());
        workbookFactories.add(new XSSFWorkbookFactory());
    }

    @Test
    public void RunExcelTest() {
        Class<Student> c = Student.class;
        InputStream is = null;
        try {
            is = new FileInputStream("F://student_info.xls");
            Collection<Student> list = ExcelUtils.readExcel(is, "xls", Student.class);
            for (Student student : list) {
                System.out.println(student);
            }
            XSSFWorkbook workbook = ExcelUtils.<Student>exportExcel("sheet1", Student.class, list);
            File outFile = new File("F://out.xlsx");
            workbook.write(new FileOutputStream(outFile));
        } catch (IOException e) {
            e.printStackTrace();
        } finally {
            try {
                if (is != null)
                    is.close();
            } catch (IOException e) {
                e.printStackTrace();
            }
        }
    }

    public void testStringToDate() {
        String s = "2017/3/1  0:00:47";
        // System.out.println(stringToDate("2017/3/1  0:00:47"));
        SimpleDateFormat format = new SimpleDateFormat("yyyy/M/d  H:m:s");
        format.setTimeZone(TimeZone.getTimeZone("GMT+8:00"));
        try {
            System.out.println(format.parse(s));
        } catch (ParseException e) {
            e.printStackTrace();
        }
    }

    /**
     * 将excel文件转换成集合
     *
     * @param inputStream 输入文件流
     * @param type        输入文件类型
     * @param entity      实体类
     * @return 实体类集合
     * @throws IOException
     */
    public Collection readXls(InputStream inputStream, String type, Class entity) throws IOException {
        // InputStream is = new FileInputStream(path + fileName);//EXCEL_PATH存放路径
        Collection dist = new ArrayList<Object>();
        try {

            // 得到目标目标类的所有的字段列表
            Field fields[] = entity.getDeclaredFields();
            Map<String, Method> fieldSetMap = new HashMap<String, Method>();
            for (Field f : fields) {
                // 去除由序列化导致的serialVersionUID
                if (!isFieldFinal(f)) {
                    // 构造Setter方法
                    String fieldName = f.getName();
                    String setMethodName = "set" + fieldName.substring(0, 1).toUpperCase() + fieldName.substring(1);
                    // 构造调用的method
                    Method setMethod = entity.getMethod(setMethodName, f.getType());
                    // 将这个method以field名字的小写为key来存入
                    fieldSetMap.put(fieldName.toLowerCase(), setMethod);
                }
            }
            Workbook book;
            switch (type) {
                case "xls":
                    book = workbookFactories.get(0).create(inputStream);
                    break;
                case "xlsx":
                    book = workbookFactories.get(1).create(inputStream);
                    break;
                default:
                    return null;
            }
            // // 得到工作表
            // HSSFWorkbook book = new HSSFWorkbook(inputStream);
            // 得到第一页
            Sheet sheet = book.getSheetAt(1);
            // 得到第一面的所有行
            Iterator<Row> row = sheet.rowIterator();
            // 得到第一行,也就是标题行
            Row title = row.next();
            // 得到第一行的所有列
            Iterator<Cell> cellTitle = title.cellIterator();
            // 将标题的文字内容放入到一个map中。
            Map<Integer, String> titleMap = new HashMap<Integer, String>();
            // 从标题第一列开始
            int i = 0;
            // 循环标题所有的列
            while (cellTitle.hasNext()) {
                Cell cell = cellTitle.next();
                String value = cell.getStringCellValue();
                System.out.println(value);
                titleMap.put(i, value);
                i = i + 1;
            }
            return null;
            // while (row.hasNext()) {
            //     // 标题下的第一行
            //     Row rown = row.next();
            //     // 行的所有列
            //     Iterator<Cell> cellbody = rown.cellIterator();
            //     // 得到传入类的实例
            //     Constructor constructor = entity.getDeclaredConstructor();
            //     constructor.setAccessible(true);
            //     Object tObject = constructor.newInstance();
            //     int k = 0;
            //     // 遍历一行的列
            //     while (cellbody.hasNext()) {
            //         Cell cell = cellbody.next();
            //         // 这里得到此列的对应的标题
            //         String titleString = (String) titleMap.get(k);
            //         // 如果这一列的标题和类中的某一列的Annotation相同,那么则调用此类的的set方法,进行设值
            //         if (fieldSetMap.containsKey(titleString)) {
            //             Method setMethod = (Method) fieldSetMap.get(titleString);
            //             // 得到setter方法的参数
            //             Type[] ts = setMethod.getGenericParameterTypes();
            //             // 只要一个参数
            //             String xclass = ts[0].toString();
            //             // 判断参数类型
            //             switch (xclass) {
            //                 case "class java.lang.String":
            //                     // 先设置Cell的类型,然后就可以把纯数字作为String类型读进来了:
            //                     cell.setCellType(Cell.CELL_TYPE_STRING);
            //                     setMethod.invoke(tObject, cell.getStringCellValue());
            //                     break;
            //                 case "class java.util.Date":
            //                     Date cellDate = null;
            //                     if (Cell.CELL_TYPE_NUMERIC == cell.getCellType()) {
            //                         // 日期格式
            //                         cellDate = cell.getDateCellValue();
            //                     } else {    // 全认为是  Cell.CELL_TYPE_STRING: 如果不是 yyyy-mm-dd hh:mm:ss 的格式就不对(wait to do:有局限性)
            //                         cellDate = stringToDate(cell.getStringCellValue());
            //                     }
            //                     setMethod.invoke(tObject, cellDate);
            //                     //// --------------------------------------------------------------------------------------------
            //                     //String cellValue = cell.getStringCellValue();
            //                     //Date theDate = stringToDate(cellValue);
            //                     //setMethod.invoke(tObject, theDate);
            //                     //// --------------------------------------------------------------------------------------------
            //                     break;
            //                 case "class java.lang.Boolean":
            //                     boolean valBool;
            //                     if (Cell.CELL_TYPE_BOOLEAN == cell.getCellType()) {
            //                         valBool = cell.getBooleanCellValue();
            //                     } else {// 全认为是  Cell.CELL_TYPE_STRING
            //                         valBool = cell.getStringCellValue().equalsIgnoreCase("true")
            //                                 || (!cell.getStringCellValue().equals("0"));
            //                     }
            //                     setMethod.invoke(tObject, valBool);
            //                     break;
            //                 case "class java.lang.Integer":
            //                     Integer valInt;
            //                     if (Cell.CELL_TYPE_NUMERIC == cell.getCellType()) {
            //                         valInt = (new Double(cell.getNumericCellValue())).intValue();
            //                     } else {// 全认为是  Cell.CELL_TYPE_STRING
            //                         valInt = new Integer(cell.getStringCellValue());
            //                     }
            //                     setMethod.invoke(tObject, valInt);
            //                     break;
            //                 case "class java.lang.Long":
            //                     Long valLong;
            //                     if (Cell.CELL_TYPE_NUMERIC == cell.getCellType()) {
            //                         valLong = (new Double(cell.getNumericCellValue())).longValue();
            //                     } else {// 全认为是  Cell.CELL_TYPE_STRING
            //                         valLong = new Long(cell.getStringCellValue());
            //                     }
            //                     setMethod.invoke(tObject, valLong);
            //                     break;
            //                 case "class java.math.BigDecimal":
            //                     BigDecimal valDecimal;
            //                     if (Cell.CELL_TYPE_NUMERIC == cell.getCellType()) {
            //                         valDecimal = new BigDecimal(cell.getNumericCellValue());
            //                     } else {// 全认为是  Cell.CELL_TYPE_STRING
            //                         valDecimal = new BigDecimal(cell.getStringCellValue());
            //                     }
            //                     setMethod.invoke(tObject, valDecimal);
            //                     break;
            //                 case "class java.lang.Double":
            //                     Double valDouble;
            //                     valDouble = new Double(cell.getStringCellValue());
            //                     break;
            //             }
            //
            //         }
            //         // 下一列
            //         k = k + 1;
            //     }
            //     dist.add(tObject);
            // }
            // HSSFWorkbook hssfWorkbook = new HSSFWorkbook(inputStream);
            // Student student = null;
            // List<Student> list = new ArrayList<>();
            // // 循环工作表Sheet
            // for (int numSheet = 0; numSheet < hssfWorkbook.getNumberOfSheets(); numSheet++) {
            //     HSSFSheet hssfSheet = hssfWorkbook.getSheetAt(numSheet);
            //     if (hssfSheet == null) {
            //         continue;
            //     }
            //     // 循环行Row,第一行是列名,所以跳过
            //     for (int rowNum = 1; rowNum <= hssfSheet.getLastRowNum(); rowNum++) {
            //         HSSFRow hssfRow = hssfSheet.getRow(rowNum);
            //         if (hssfRow != null) {
            //             student = new Student();
            //             HSSFCell no = hssfRow.getCell(0);
            //             HSSFCell name = hssfRow.getCell(1);
            //             HSSFCell age = hssfRow.getCell(2);
            //             HSSFCell score = hssfRow.getCell(3);
            //             student.setNo(getValue(no));
            //             student.setName(getValue(name));
            //             student.setAge(getValue(age));
            //             student.setScore(Float.valueOf(getValue(score)));
            //             list.add(student);
            //         }
            //     }
            // }
        } catch (Exception e) {
            e.printStackTrace();
            return null;
        }
        // return dist;
    }

    private boolean isFieldFinal(Field field) {
        return (field.getModifiers() & java.lang.reflect.Modifier.FINAL) == java.lang.reflect.Modifier.FINAL;
    }

    private String getValue(HSSFCell hssfCell) {
        if (hssfCell != null) {
            if (hssfCell.getCellType() == Cell.CELL_TYPE_BOOLEAN) {
                // 返回布尔类型的值
                return String.valueOf(hssfCell.getBooleanCellValue());
            } else if (hssfCell.getCellType() == Cell.CELL_TYPE_NUMERIC) {
                // 返回数值类型的值
                return String.valueOf(hssfCell.getNumericCellValue());
            } else {
                // 返回字符串类型的值
                return String.valueOf(hssfCell.getStringCellValue());
            }
        } else {
            return "";
        }
    }

    /**
     * 字符串转换为Date类型数据(限定格式      YYYY-MM-DD hh:mm:ss)或(YYYY/MM/DD hh:mm:ss)
     *
     * @param cellValue : 字符串类型的日期数据
     * @return
     */
    private static Date stringToDate(String cellValue) {
        SimpleDateFormat format = new SimpleDateFormat("yyyy/M/d  H:m:s");
        format.setTimeZone(TimeZone.getTimeZone("GMT+8:00"));
        try {
            return format.parse(cellValue);
        } catch (ParseException e) {
            e.printStackTrace();
        }
        return null;
    }
}


text:
package com.sdwfqin.mvpseed.base;

import android.app.Application;

import com.blankj.utilcode.util.LogUtils;
import com.blankj.utilcode.util.Utils;
import com.sdwfqin.mvpseed.di.component.AppComponent;
import com.sdwfqin.mvpseed.di.component.DaggerAppComponent;
import com.sdwfqin.mvpseed.di.module.AppModule;
import com.sdwfqin.mvpseed.di.module.HttpModule;

/**
 * 描述:
 *
 * @author zhangqin
 * @date 2017/6/9
 */
public class App extends Application {

    private static AppComponent appComponent;
    private static App instance;

    public static synchronized App getInstance() {
        return instance;
    }

    @Override
    public void onCreate() {
        instance = this;
        super.onCreate();
        Utils.init(this);
        initLog();
    }

    private void initLog() {
        LogUtils.Config config = LogUtils.getConfig()
                .setLogSwitch(Constants.LOG_TYPE)
                .setConsoleSwitch(Constants.LOG_TYPE);
    }

    public static AppComponent getAppComponent() {
        if (appComponent == null) {
            appComponent = DaggerAppComponent.builder()
                    .appModule(new AppModule(instance))
                    .httpModule(new HttpModule())
                    .build();
        }
        return appComponent;
    }
}


text:
<?php

?>

<a href="<?php echo $wifiWimaxLte ;?>">Home

  <?php
  /******************** Digital Communication *****************************************/
  ?>

<a href="<?php echo $digtalFolder; ?>digital-com-topics.php">Digital Com

<a href="<?php echo $digtalFolder; ?>digital-com-topics.php">See Digital Com Topics

<a href="<?php echo $digtalFolder; ?>principles-of-digital-communication.php">Principles of Digital Communication

<a href="<?php echo $digtalFolder; ?>modulation.php">Modulation

<a href="<?php echo $digtalFolder; ?>multiplexing.php">Multiplexing

<a href="<?php echo $digtalFolder; ?>noise-and-error-correction.php">Noise and Error Correction

  <?php
  /******************** WI-Fi *****************************************/
  ?>

<a href="<?php echo $wifiFolder; ?>wifi-topics.php">Wi-FI

<a href="<?php echo $wifiFolder; ?>wifi-topics.php">See Wi-Fi Topics

<a href="<?php echo $wifiFolder; ?>introduction.php">Introduction

<a href="<?php echo $wifiFolder; ?>wifi.php">Wi-Fi

<a href="<?php echo $wifiFolder; ?>modulation-and-performance.php">Modulation & Performance

<a href="<?php echo $wifiFolder; ?>security.php">Security

<a href="<?php echo $wifiFolder; ?>wifi-meshes.php">Wi-Fi Meshes

  <?php
  /******************** WiMAX *****************************************/
  ?>

<a href="<?php echo $wimaxFolder; ?>wimax-topics.php">WiMAX

<a href="<?php echo $wimaxFolder; ?>wimax-topics.php">See WiMAX Topics

<a href="<?php echo $wimaxFolder; ?>wimax.php">WiMAX

<a href="<?php echo $wimaxFolder; ?>mobile-wimax.php">Mobile WiMAX

<a href="<?php echo $wimaxFolder; ?>future-wimax.php">Future WiMAX

  <?php
  /******************** LTE *****************************************/
  ?>

<a href="<?php echo $lteFolder; ?>lte-topics.php">LTE

<a href="<?php echo $lteFolder; ?>lte-topics.php">See LTE Topics

<a href="<?php echo $lteFolder; ?>lte-history.php">LTE History

<a href="<?php echo $lteFolder; ?>lte.php">LTE

<a href="<?php echo $lteFolder; ?>lte-advanced.php">LTE Advanced

<a href="<?php echo $lteFolder; ?>implementation-of-lte-and-4g.php">Implementation of LTE and 4G

<a href="<?php echo $lteFolder; ?>lte-test.php">LTE Tests

<a href="<?php echo $lteFolder; ?>lte-conclusion.php">LTE Conclusion

<a href="<?php echo $summaryFolder; ?>summary-topics.php">Summary

<a href="<?php echo $summaryFolder; ?>summary-topics.php">See summary topics

<a href="<?php echo $summaryFolder; ?>wifi-vs-wimax-vs-lte.php">Wi-Fi vs WiMAX vs LTE

<a href="<?php echo $summaryFolder; ?>reports.php">Reports

  <?php
  /******************** Support *****************************************/

  ?>

<a href="<?php echo $supportFolder; ?>support-topics.php">Support

<a href="<?php echo $supportFolder; ?>support-topics.php">See support topics

<a href="<?php echo $supportFolder; ?>contact.php">Contact

<a href="<?php echo $supportFolder; ?>faqs.php">FAQs

<a href="<?php echo $supportFolder; ?>abbreviations.php">Abbreviations

<a href="<?php echo $quizFolder ?>quiz.php">Quiz