﻿/**
 * jQuery TwiLoadingMask plugin
 * @Author：feitianxinhong http://xuzhihong1987.blog.163.com/  
 * @Version：1.1.0
 * @CreateDate：2015-03-27
 * @Example: Visit http://blog.163.com/twi_fly  
 * @Copyright ©2010-2015 Tyingsoft 踏影软件开发工作室 之 Twilight/Twifly开源系列. 转载请保留本行注明.   
 * @License：Twi Framework of Tyingsoft is licensed under the MIT license.  
 * @Description：基于jquery+Bootstrap的窗体控件
 * @Require:  
 *
 * ------------------------------------------------------------------
 * 编号    版本号      作者              修改日期         修改内容
 * ------------------------------------------------------------------
 *  1      1.0.0      feitianxinhong    2013-08-20      创建文件
 *  2      1.0.1      feitianxinhong    2014-05-18      大字体版
 *  3      1.1.0      feitianxinhong    2015-03-27      增加响应，去掉了图片，兼容Twi.Skin概念主题样式
 * ------------------------------------------------------------------
 */
.twiLoadingMask {
}
.twiLoadingMask .twiLoadingMaskBg
{
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    background-color: #8e44ad;
    filter: alpha(opacity=10);
    -moz-opacity: 0.1;
    -khtml-opacity: 0.1;
    opacity: 0.1;
    z-index:99999;
}
.twiLoadingMask .twiLoadingMaskCnt
{
    position:absolute;
    margin:0 auto;
    border: solid 2px #8E44AD;
    width:300px;
    height:50px; 
    font-family:'Microsoft YaHei';
    top:50%;
    left:50%;
    margin-top:-25px;
    margin-left:-150px;
    z-index:100000;
}


.twiLoadingMask .twiLoadingMaskTop {
    height:50px;
    width:100%;
    /*background-color: #9B59B6;
    filter: alpha(opacity=40);
    -moz-opacity: 0.4;
    -khtml-opacity: 0.4;
    opacity: 0.4;*/    
}
.twiLoadingMask .twiLoadingMaskMid {
    background-color: #8e44ad;
    height: 2px;
    width: 100%;
    margin-top:-12px;
}
.twiLoadingMask .twiLoadingMaskBtm {
    background-color: #8e44ad;
    background-image: linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
    background-size: 30px 30px;
    height: 10px;
    width: 0;
}

.twiLoadingMask .twiLoadingMaskMsg {
   font-size:1.6em;
   line-height: 36px;
   color:#666;
   padding-left:10px;
   position:relative;
   top:-50px;
}



@media (max-width: 500px) {
    .twiLoadingMask .twiLoadingMaskCnt
    {
        width:180px;
        margin-left:-90px;
    }
    .twiLoadingMask .twiLoadingMaskMsg {
       font-size:1.2em;
    }
}
@media (min-width: 500px) and (max-width: 767px) {
    .twiLoadingMask .twiLoadingMaskCnt
    {
        width:240px;
        margin-left:-120px;
    }
    .twiLoadingMask .twiLoadingMaskMsg {
       font-size:1.4em;
    }
}

@media (min-width: 768px) and (max-width: 991px) {
    .twiLoadingMask .twiLoadingMaskCnt
    {
        width:260px;
        margin-left:-130px;
    }
    .twiLoadingMask .twiLoadingMaskMsg {
       font-size:1.5em;
    }
}


