@charset "UTF-8";   

    @font-face {
     font-family: BarCode;
     src: url("/jakarta.faces.resource/css/BarCode.ttf.jsf?ln=default"), /* TTF file for CSS3 browsers */
          url("/jakarta.faces.resource/css/BarCode.eot.jsf?ln=default"); /* EOT file for IE  */
    }
    
    @font-face {
        font-family: 'Roboto';
        font-style: normal;
        font-weight: 300;
        src: url(""),
             url(""),
             url(""),
             url("");
        }
    
      /* roboto-700 - latin */
      @font-face {
        font-family: 'Roboto';
        font-style: normal;
        font-weight: 700;
        src: url(""),
             url(""),
             url(""),
             url("");
      }

    .blurry { 
        font-family:BarCode !important;

    }
        
    .noAccess { 
        font-weight: bold;
        color: red; 
    }
    
    .SplashContainer { 
          background-color: rgba(255,255,255,0.5);
          color: black;
          border-style:solid;
          border-width:1px;   
    }
    
    /* custom colors */
    .pumaBlueBack{
        background:#F7F7F7; /* Flat gray */		
    } 
    
    .pumaWhiteBack {
        background:#ffffff; /* White */
    } 
    
     .pumaGrayBackground{		
	background:#F7F7F7; /* Flat gray */
     } 
	
     /* Deprecated - TBD delete*/
    .pumaBackground{		
	background:#F7F7F7; /* Flat gray */
     } 
			
    /* Paddings */
    .PaddingLeftPercent2{ padding-left: 2%;}
    .PaddingTopPercent2{ padding-top: 2%}
    .PaddingRightPercent2{ padding-right: 2%}
    .PaddingBottomPercent2{ padding-bottom: 2%;}
    .PaddingLeftPercent3{ padding-left: 3%;}
    .PaddingTopPercent3{ padding-top: 3%}
    .PaddingRightPercent3{ padding-right: 3%}
    .PaddingBottomPercent3{ padding-bottom: 3%;}
    .PaddingLeftPercent4{ padding-left: 4%;}
    .PaddingTopPercent4{ padding-top: 4%}
    .PaddingRightPercent4{ padding-right: 4%}
    .PaddingBottomPercent4{ padding-bottom: 4%;}
    
    .PaddingLeft20 {padding-left:20px;}
    .PaddingRight20 {padding-right:20px;}
    .PaddingTop20 {padding-top:20px;}
    .PaddingBottom20 {padding-bottom:20px;}
    .Padding20 {padding:20px;}
    
    .PaddingLeft10 {padding-left:10px;}
    .PaddingRight10 {padding-right:10px;}
    .PaddingTop10 {padding-top:10px;}
    .PaddingBottom10 {padding-bottom:10px;}
    
    .PaddingTop24 {padding-top:24px;}
    
    /* =BANNER-TOP ------------------ */

    div#banner-top {
       position: fixed;
       z-index: 999999;
       top: 0;
       left: 0;
       width: 100%;
       margin-left:auto;
       margin-right:auto;
       text-align: center;
       font-family: Tahoma, Geneva, sans-serif;
       font-size: 16px;
	/* color: #000000; */
		border-bottom: 1px solid #333;
     /*   font-weight: bold;*/
	 
   }
   
    /* =BANNER-BOTTOM ------------------ */

    div#banner-bottom {
           position: fixed;
           z-index: 999999;
           bottom: 0;
           left: 0;
           width: 100%;
            margin-left:auto;
            margin-right:auto;
            text-align: center;
            font-family: Tahoma, Geneva, sans-serif;
            font-size: 16px;
            border-top: 1px solid #333;
    }

    /* =SPECIFIC BANNER TYPE ------------------*/
    .green-banner {
        background-color: #339933;
        color: #000000;
    }

    .red-banner {
        background-color: #990000;
        color: #E0E0E0;
    }

    .orange-banner {
        background-color: #F87217;
        color: #000000;
    }

    .yellow-banner {
        background-color: #FFFF33;
        color: #000000;
    }  

    .black-banner {
        background-color: #000000;
        color: #E0E0E0;
    }

    .gray-banner {
        background-color: #989898 ;
        color: #000000;
    }

    .blue-banner {
        background-color: #003399;
        color: #FFFFFF;
    }
    
    .warning { color: #d9d91d;}
    .error { color:red; }
    .error-message {color:red; font-size:14px;}
    
    .elevated { color: red;}
    
    .cleared { color: green; }
    
    .unreviewed { color:blue; }
    
    .suppressed { color: red; }
    
    .dataTable td {
        border-bottom:1px solid #f4f4f4;
    }
    
    span.dataTable { 
        border-bottom:1px solid #f4f4f4;
    }
    
    div.dataTable { 
        border-bottom:1px solid #f4f4f4;
    }
    
    .tdPercent10 td { 
        width:10%;
    }
    
    .tdPercent15 td { 
       width:15%;
    }
    
    .tdPercent20 td { 
        width:20%;
    }
    
    .tdPercent25 td { 
         width:25%;
    }
    
    .tdPercent30 td { 
         width:30%;
    }
    
    .tdPercent33 td { 
         width:33%;
    }
       
    .tdPercent40 td { 
         width:40%;
    }
    
    .tdPercent45 td { 
         width:45%;
    }
    
    .tdPercent50 td { 
        width:50%;
    }
    
    .tdPercent75 td { 
        width:75%;
    }
    
    .tdPercent90 td { 
        width:90%;
    }
    
    .tdTopAlign td { 
        vertical-align:top;
    }
    
    .trTopAlign tr { 
        vertical-align:top;
    }
    
    table.dataTable { width:100%; }
    
    .EmptyBox1{ display:block; width:100%; height:1px; overflow:hidden;}
    
    .FixedLayout {table-layout: fixed;}
    
    .Wid0 { width:0%; }
    .Wid95 { width:95%; }
    .Wid98 { width:98%; }
    .Wid97 { width:97%; }
    .Wid88 { width:88%; }
    .Wid85 { width:85%; }
    .Wid37_5 { width:37.5% }
    .Wid35 { width:35%; }
    .Wid62_5 { width:62.5%; }
    .Wid5 {width: 5%;}
    .Wid2 { width:2%; }
    .Wid5TexAlCenter{ width:5%; text-align:center !important;}
    .Wid5TexAlLeft{ width:5%; text-align:left !important;}
    .Wid10TexAlRight{ width:10%; text-align:right !important;}
    .Wid12{ width:12%;}
    .Wid15{ width:15%;}
    .Wid25TexAlRight{ width:25%; text-align:right !important;}
    .Wid30TexAlRight{ width:30%; text-align:right !important;}
    .Wid30TexAlLeft{ width:30%; text-align:left !important;}
    .Wid10TexAlCenter{ width:10%; text-align:center !important;}
    .Wid50TexAlCenter{ width:50%; text-align:center !important;}
    .Wid30TexAlCenter {width:30%; text-align: center;}
    .FrightImp{ float:right !important;}
    
    .Wid20px {width:20px;}
    .Wid32px {width:32px;}    
    .Wid50px {width:50px;}
    .Wid60px {width:60px;}
    .Wid75px {width:75px;}
    .Wid90px {width:90px;}
    .Wid100px {width:100px;}
    .Wid125px {width:125px;}
    .Wid130px {width:130px;}
    .Wid150px {width:150px;}
    .Wid165px {width:165px;}
    .Wid175px {width:175px;}
    .Wid185px {width:185px;}
    .Wid200px {width:200px;}
    .Wid210px {width:210px;}
    .Wid260px {width:260px;}
    .Wid265px {width:265px;}
    .Wid310px {width:310px;}
    .Wid400px {width:400px;}
    .Hei250px {height:250px;}
    .Hei300px {height:300px;}
    .Hei400px {height:400px;}
    .Hei450px {height:450px;}
    .Hei500px {height:500px;}
    
    .LeftMar175px {margin-left:175px;}
    .LeftMar150px {margin-left:150px;}
    .LeftMar125px {margin-left:125px;}
    .LeftMar100px {margin-left:100px;}
    .LeftMar75px {margin-left:75px;}
    .LeftMar50px {margin-left:50px;}
    .LeftMar20px {margin-left:20px;}
    .LeftMar10px {margin-left:10px;}
    .RightMar20px {margin-right:20px;}
    .RightMar10px {margin-right:10px;}
    .MarLeft10 { margin-left:10px;}
    .MarLeft7  {margin-left:7px;}
    .MarLeft5 {margin-left:5px;}
    .MarRight10 { margin-right:10px;}
    .MarBot20 { margin-bottom:20px;}
    .MarBot30 { margin-bottom:30px;}
    .MarTop5 { margin-top:5px;}
    .MarBot5 { margin-bottom:5px;}
    .MarRight5 {margin-right:5px;}
          
    .center {
        margin-left: auto;
        margin-right: auto;
        text-align:center; 
    }
    
    .DummyCol {}
    
    .img-top-left { float:left; margin:10px 15px 15px 5px; vertical-align:top }
    .img-center {display:block; margin-left:auto; margin-right:auto }
    .TableLayoutAuto {table-layout:auto;}
    .NoBorder {border:none;}
    .VertAlTop {vertical-align:top;}
    .VertAlMiddle {vertical-align:middle;}
    .BreakWord {word-wrap:break-word;}
    .NoListStyle {list-style:none;}
    .DispInline {display:inline;}
    .selectOneRadioLeft label { 
        text-align:left;
    }
    
    .nav { font-size: 1.5em;  
           margin-top: 0.83em; 
           margin-bottom: 0.83em;  
           margin-left: 0; 
           margin-right: 0; 
           font-weight:bold; 
           float:right; 
           width:100%;
    }
    .nav ul { padding:0; margin:0; list-style:none; border:0;}
    .nav ul li { float:left; margin:0; padding:0 30px 0 30px;  }
    .nav ul li a { float:left; margin:0; color:#27AAE1; text-decoration:none; outline:none; }
    .nav ul li a:hover{ text-decoration:underline; }
    .nav ul li a.active { text-decoration:underline; }   
    
    .BordRightVis{ border-right:solid 1px; box-sizing:border-box; -webkit-box-sizing:border-box; -moz-box-sizing:border-box;}
    .BordLeftVis{ border-left:solid 1px; box-sizing:border-box; -webkit-box-sizing:border-box; -moz-box-sizing:border-box;}
    .BordTopVis{ border-top:solid 1px; box-sizing:border-box; -webkit-box-sizing:border-box; -moz-box-sizing:border-box;}
    .BordBottomVis{ border-top:solid 1px; box-sizing:border-box; -webkit-box-sizing:border-box; -moz-box-sizing:border-box;}
    .BordAllVis{ border:solid 1px; box-sizing:border-box; -webkit-box-sizing:border-box; -moz-box-sizing:border-box;}
    
    .h3 { 
        display: block;
        font-size: 1.17em;
        margin-top: 1em;
        margin-bottom: 1em;
        margin-left: 0;
        margin-right: 0;
        font-weight: bold;
    }

    .preformatted {
        white-space: pre-wrap;
    }

    /* Support for expandable text */
    
     .rest{
            display:none;
    }

    .expand{
        background:orange;
        color:navy;
        font-size:13px;
        padding:3px;
        cursor:pointer;
    }

    .collapse{
        background:orange;
        color:navy;
        font-size:13px;
        padding:3px;
        cursor:pointer;
        display:none;
    }
    
    /* Eliminating use of h1/h2/h3/h4 elements */
    .header1 { 
        font-size:22px;
        display:block;
    }
    
    .header2 {
        font-size:20px;
        display: block;
    }
    
    .header3 { 
        font-size:14px;
        display:block;
        margin-top:10px;
    }
    
     .header4 { 
        font-size:13px;
        display:block;
        margin-top:10px;
    }
    
    .demoNotice { 
        font-size:18px; 
        font-weight:bold; 
        color:red;
    }
    
    /* Tighten up padding for ui-g layouts */
    .low-pad-ui-g.ui-g-1, .low-pad-ui-g.ui-g-2, .low-pad-ui-g.ui-g-3, .low-pad-ui-g.ui-g-4, .low-pad-ui-g.ui-g-5, .low-pad-ui-g.ui-g-6, .low-pad-ui-g.ui-g-7, .low-pad-ui-g.ui-g-8, .low-pad-ui-g.ui-g-9, .low-pad-ui-g.ui-g-10, .low-pad-ui-g.ui-g-11, .low-pad-ui-g.ui-g-12 { 
        padding:0.1em;
    }
   
    
    /* Elements orginally taken from legacy Sentinel layout.  Have 
       been used across Paradise and Avalon layout upgrades and are now 
       (for better or worse) part of the core set of Watchtower styles. 
    */
    
    /* font colors */
    .gray{color:#5A5A5A;}
    .softgray{color:#909090;}
    .yellow{color:#FFD100;}
    .white{ color:#ffffff;}
    .red{color:#e90c45;}
    .orange{color:#F15A29;}
    .softblue{color:#C1E1F4;}
    .hardblue{color:#27AAE1;}
    .leaden{color:#72828B;}
    .navy {color:navy;}
    
    /*html { text-rendering: optimizeLegibility !important; -webkit-font-smoothing: antialiased !important;}*/

body{height:100%; width:100%;}


/* CORE LAYOUT STANDARD STYLES ********************************************************************************************************** */

a, div, span, input, textarea, li, strong, button{ outline:none; text-decoration:none;
/* this removes gray outline from ios safari a tags */ -webkit-tap-highlight-color: rgba(0,0,0,0);
/* this removes action panels from ios safari a tags */ -webkit-tap-highlight-color: rgba(0,0,0,0); -webkit-touch-callout: none;}
img{ border:none; border:0px;}

/* Text Decoration */
.Underline{ text-decoration:underline;}

/* Making Unselectable Contents */
.Unselectable {
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

/* for on iphone safari inputs shadow problem */
input[type="text"], input[type="password"], textarea{ -webkit-appearance: none; -moz-appearance: none; appearance: none;}

/*.NoDisplay{display:none;}
.OnDisplay{display:block;}*/

/* Display */
.DispBlock{ display:block;}
.DispTable{ display:table; vertical-align:middle;}
.DispTableCell{ display:table-cell; vertical-align:middle;}
.DispNone{ display:none;}
.DispInlBlock{display:inline-block;}
.DispIn {display:inline;}

.NoDisplay{display:none;}

/* Position */
.PosFixed{position:fixed;}
.PosAbsolute{position:absolute;}
.PosRelative{ position:relative;}
.PosStatic{position:static;}

/* Floating */
.Fleft{ float:left;}
.Fright{ float:right;}
.Fnone{ float:none !important;}

/* Overflows */
.OvHidden{ overflow:hidden;}
.OvScroll{ overflow:scroll;}
.OvAuto{ overflow:auto;}
.OvVisible{ overflow:visible;}
.OvXScroll{ overflow-x:scroll;}
.OvYScroll{ overflow-y:scroll;}
.OvXHidden{ overflow-x:hidden;}
.OvYHidden{ overflow-y:hidden;}

/* Empty Boxes */
.EmptyBox5{ display:block; width:100%; height:5px; overflow:hidden;}
.EmptyBox10{ display:block; width:100%; height:10px; overflow:hidden;}
.EmptyBox19_5 {display:block; width:100%; height:19.5px; overflow:hidden;}
.EmptyBox20{ display:block; width:100%; height:20px; overflow:hidden;}
.EmptyBox21 {display:block; width:100%; height:21px; overflow:hidden;}
.EmptyBox30{ display:block; width:100%; height:30px; overflow:hidden;}
.EmptyBox33_5{ display:block; width:100%; height:33.5px; overflow:hidden;}
.EmptyBox40{ display:block; width:100%; height:40px; overflow:hidden;}
.EmptyBox50{ display:block; width:100%; height:50px; overflow:hidden;}
.EmptyBox60{ display:block; width:100%; height:60px; overflow:hidden;}
.EmptyBox70{ display:block; width:100%; height:70px; overflow:hidden;}
.EmptyBox80{ display:block; width:100%; height:80px; overflow:hidden;}
.EmptyBox90{ display:block; width:100%; height:90px; overflow:hidden;}
.EmptyBox100{ display:block; width:100%; height:100px; overflow:hidden;}
.EmptyBox110{ display:block; width:100%; height:100px; overflow:hidden;}
.EmptyBox120{ display:block; width:100%; height:100px; overflow:hidden;}
.EmptyBox130{ display:block; width:100%; height:100px; overflow:hidden;}
.EmptyBox140{ display:block; width:100%; height:100px; overflow:hidden;}
.EmptyBox150{ display: block; width: 100%; height:150px; overflow:hidden;}
.EmptyBox200{ display: block; width: 100%; height:200px; overflow:hidden;}


/* Opacity */
.Opac100{ opacity:1; -webkit-opacity:1; -moz-opacity:1;}
.Opac95{ opacity:0.95; -webkit-opacity:0.95; -moz-opacity:0.95;}
.Opac90{ opacity:0.9; -webkit-opacity:0.9; -moz-opacity:0.9;}
.Opac80{ opacity:0.8; -webkit-opacity:0.8; -moz-opacity:0.8;}
.Opac70{ opacity:0.7; -webkit-opacity:0.7; -moz-opacity:0.7;}
.Opac60{ opacity:0.6; -webkit-opacity:0.6; -moz-opacity:0.6;}
.Opac50{ opacity:0.5; -webkit-opacity:0.5; -moz-opacity:0.5;}
.Opac40{ opacity:0.4; -webkit-opacity:0.4; -moz-opacity:0.4;}
.Opac30{ opacity:0.3; -webkit-opacity:0.3; -moz-opacity:0.3;}
.Opac20{ opacity:0.2; -webkit-opacity:0.2; -moz-opacity:0.2;}
.Opac10{ opacity:0.1; -webkit-opacity:0.1; -moz-opacity:0.1;}
.OpacZero{ opacity:0; -webkit-opacity:0; -moz-opacity:0;}

/* Border Radius */
.BordRad3{ border-radius:3px; -webkit-border-radius:3px; -moz-border-radius:3px;}
.BordRad4{ border-radius:4px; -webkit-border-radius:4px; -moz-border-radius:4px;}
.BordRad5{ border-radius:5px; -webkit-border-radius:5px; -moz-border-radius:5px;}
.BordRad10{ border-radius:10px; -webkit-border-radius:10px; -moz-border-radius:10px;}
.BordRad15{ border-radius:15px; -webkit-border-radius:15px; -moz-border-radius:15px;}
.BordRadHalf{ border-radius:50%; -webkit-border-radius:50%; -moz-border-radius:50%;}

.BordRight{ border-right:solid 1px transparent; box-sizing:border-box; -webkit-box-sizing:border-box; -moz-box-sizing:border-box;}
.BordLeft{ border-left:solid 1px transparent; box-sizing:border-box; -webkit-box-sizing:border-box; -moz-box-sizing:border-box;}
.BordTop{ border-top:solid 1px transparent; box-sizing:border-box; -webkit-box-sizing:border-box; -moz-box-sizing:border-box;}
.BordBottom{ border-top:solid 1px transparent; box-sizing:border-box; -webkit-box-sizing:border-box; -moz-box-sizing:border-box;}
.BordAll{ border:solid 1px transparent; box-sizing:border-box; -webkit-box-sizing:border-box; -moz-box-sizing:border-box;}

/* Width */
.Wid100{ width:100%;}
.Wid90{ width:90%;}
.Wid80{ width:80%;}
.Wid70{ width:70%;}
.Wid60{ width:60%;}
.Wid55{ width:55%;}
.Wid50{ width:50%;}
.Wid45{ width:45%;}
.Wid40{ width:40%;}
.Wid30{ width:30%;}

/* Width Special Values */
.Wid33{ width:33.3%;}
.Wid25{ width:25%;}
.Wid20{ width:20%;}
.Wid10{ width:10%;}

.MaxWid500{max-width:500px;}
.MaxWid900{max-width:900px;}

/* Height */
.Hei100{ height:100%;}
.Hei90{ height:90%;}
.Hei80{ height:80%;}
.Hei70{ height:70%;}
.Hei60{ height:60%;}
.Hei40{ height:40%;}
.Hei50{ height:50%;}
.Hei30{ height:30%;}
.Hei20{ height:20%;}
.Hei10{ height:10%;}

/* Margins */
.MarTopPerc5{ margin-top:5%;}
.MarTopPerc10{ margin-top:10%;}
.MarTopPerc20{ margin-top:20%;}
.MarTopPerc30{ margin-top:30%;}
.MarTopPerc40{ margin-top:40%;}
.MarTopPerc50{ margin-top:50%;}

.MarAuto{ margin-left:auto; margin-right:auto;}

.MarTop5{ margin-top:5px;}
.MarTop10{ margin-top:10px;}
.MarTop20{ margin-top:20px;}
.MarTop30{ margin-top:30px;}
.MarTop40{ margin-top:40px;}
.MarTop50{ margin-top:50px;}

.MarTopQuarter{ margin-top:25%;}
.MarTopHalf{ margin-top:50%;}

.MarBot10{ margin-bottom:10px;}
.MarRight10{ margin-right:10px;}
.MarRight20{ margin-right:20px;}

.MarBot2 {margin-bottom:2px;}

/* Paddings */
.PaddingTopPercent10{ padding-top: 10%;}

/* Containers */
.Container100{ width:100%;  float:left;}
.Container96{ width:96%;  float:left;}
.Container90{ width:90%;  float:left;}
.Container85{ width:85%;  float:left;}
.Container80{ width:80%;  float:left;}
.Container75{ width:75%;  float:left;}
.Container70{ width:70%;  float:left;}
.Container66{ width:66.66%;  float:left;}
.Container65{ width:65%;  float:left;}
.Container60{ width:60%;  float:left;}
.Container50{ width:50%;  float:left;}
.Container40{ width:40%;  float:left;}
.Container33{ width:33.33%;  float:left;}
.Container30{ width:30%;  float:left;}
.Container25{ width:25%;  float:left;}
.Container20{ width:20%;  float:left;}
.Container10{ width:10%;  float:left;}
.Container5{ width:5%;  float:left;}

.ContainerIndent{display:block;}

/* Text Aligns */
.TexAlCenter{ text-align:center;}
.TexAlLeft{ text-align:left;}
.TexAlRight{ text-align:right !important;}

/* Padding With Transparent Border*/
.PadWithBorder1{ border:solid 1px transparent;}
.PadWithBorder2{ border:solid 2px transparent;}
.PadWithBorder3{ border:solid 3px transparent;}
.PadWithBorder4{ border:solid 4px transparent;}
.PadWithBorder5{ border:solid 5px transparent;}
.PadWithBorder10{ border:solid 10px transparent;}

/* Box Sizing */
.BoxSizeContent{ box-sizing:content-box; -webkit-box-sizing:content-box; -moz-box-sizing:content-box;}
.BoxSizeBorder{ box-sizing:border-box; -webkit-box-sizing:border-box; -moz-box-sizing:border-box;}

/* Font Sizes */
.Fs9{font-size:9px !important;} 
.Fs10{font-size:10px !important;} 
.Fs11{font-size:11px !important;} 
.Fs12{font-size:12px !important;} 
.Fs13{font-size:13px !important;} 
.Fs14{font-size:14px !important;} 
.Fs15{font-size:15px !important;} 
.Fs16{font-size:16px !important;} 
.Fs17{font-size:17px !important;} 
.Fs18{font-size:18px !important;} 
.Fs19{font-size:19px !important;} 
.Fs20{font-size:20px !important;} 
.Fs21{font-size:21px !important;} 
.Fs22{font-size:22px !important;} 
.Fs23{font-size:23px !important;} 
.Fs24{font-size:24px !important;} 
.Fs25{font-size:25px !important;} 
.Fs26{font-size:26px !important;} 
.Fs27{font-size:27px !important;} 
.Fs28{font-size:28px !important;} 
.Fs29{font-size:29px !important;} 
.Fs30{font-size:30px !important;}
.Fs40{font-size:40px !important;}
.Fs50{font-size:50px !important;}
.Fs60{font-size:60px !important;}
.Fs100{font-size:100px !important;}
.Fs130{font-size:130px !important;}

/* Font Type */
.FontBold{ font-weight:bold;}
.FontLight{ font-weight:lighter;}
.FontNormal{ font-weight:normal;}

/* Animated - Note: These are used in the hybrid Sentinel-Paradise top menu bar.
                    Will likely be deprecated after all-Avalon top menu bar replacement. 
*/
.Animated05{-webkit-transition: all 0.5s ease; -moz-transition: all 0.5s ease; -ms-transition: all 0.5s ease; -o-transition: all 0.5s ease; transition: all 0.5s ease;}
.Animated1{-webkit-transition: all 1s ease; -moz-transition: all 1s ease; -ms-transition: all 1s ease; -o-transition: all 1s ease; transition: all 1s ease;}

.changecolor:hover{background-color:yellowgreen; padding: 20px;}

.notransition {
  -webkit-transition: none !important;
  -moz-transition: none !important;
  -o-transition: none !important;
  -ms-transition: none !important;
  transition: none !important;
}