@charset "utf-8";
/* CSS Document */



/* ================================================================ 

This copyright notice must be kept untouched in the stylesheet at 

all times.



The original version of this stylesheet and the associated (x)html

is available at http://www.cssplay.co.uk/menus/cssplay-image-bounce-dropdown.html

Copyright (c) Stu Nicholls. All rights reserved.

This stylesheet and the associated (x)html may be modified in any 

way to fit your requirements.

=================================================================== */

.menu {width:149px; height:149px; padding:0; margin:0; list-style:none; position:relative; background:#aaa; font-family:arial, sans-serif; float:left; margin-right:1px;

background-image: -webkit-linear-gradient(-90deg, rgba(255, 255, 255, 0.4), rgba(255, 255, 255, 0));

background-image: -moz-linear-gradient(-90deg, rgba(255, 255, 255, 0.4), rgba(255, 255, 255, 0));

background-image: -ms-linear-gradient(-90deg, rgba(255, 255, 255, 0.4), rgba(255, 255, 255, 0));

background-image: -o-linear-gradient(-90deg, rgba(255, 255, 255, 0.4), rgba(255, 255, 255, 0));

}

.menu li.image {width:0; height:0; position:absolute; left:75px; bottom:0; z-index:10;

-moz-transition: 0.15s 0.1s;

-ms-transition: 0.15s 0.1s;

-o-transition: 0.15s 0.1s;

-webkit-transition: 0.15s 0.1s;

transition: 0.15s 0.1s;

}

.menu li.image b {display:block; width:100%; height:100%;

-moz-transition: 0.1s 0s;

-ms-transition: 0.1s 0s;

-o-transition: 0.1s 0s;

-webkit-transition: 0.1s 0s;

transition: 0.1s 0s;

}

.menu li.image b img {display:block; width:100%; height:100%;}



.menu li.list {position:absolute; left:0; top:0; width:149px; height:150px; text-align:center; background:#222; z-index:20;

background-image: -webkit-linear-gradient(-90deg, rgba(255, 255, 255, 0.4), rgba(255, 255, 255, 0));

background-image: -moz-linear-gradient(-90deg, rgba(255, 255, 255, 0.4), rgba(255, 255, 255, 0));

background-image: -ms-linear-gradient(-90deg, rgba(255, 255, 255, 0.4), rgba(255, 255, 255, 0));

background-image: -o-linear-gradient(-90deg, rgba(255, 255, 255, 0.4), rgba(255, 255, 255, 0));

-moz-transition: 0.15s 0.15s;

-ms-transition: 0.15s 0.15s;

-o-transition: 0.15s 0.15s;

-webkit-transition: 0.15s 0.15s;

transition: 0.15s 0.15s;

}



.menu li.list b {display:block; margin-top:0; color:#fff; font-weight:normal; font-size:14px; line-height:150px; 

-moz-transition: 0.15s;

-ms-transition: 0.15s;

-o-transition: 0.15s;

-webkit-transition: 0.15s;

transition: 0.15s;

}



.menu li.sub {position:absolute; left:0; top:0; height:150px; z-index:-1;

-moz-transition: 0.15s 0.15s;

-ms-transition: 0.15s 0.15s;

-o-transition: 0.15s 0.15s;

-webkit-transition: 0.15s 0.15s;

transition: 0.15s 0.15s;

}

.menu li.sub ul {padding:0; margin:0; list-style:none; width:149px; height:100%; background:#222;

-moz-transition: 0.15s;

-ms-transition: 0.15s;

-o-transition: 0.15s;

-webkit-transition: 0.15s;

transition: 0.15s;

}

.menu li.sub ul li {width:100%;}

.menu li.sub ul li:first-child {padding-top:0px;}

.menu li.sub ul li a {display:block; padding:2px 10px; color:#fff; text-decoration:none; font-size:14px;

-moz-transition: 0.5s;

-ms-transition: 0.5s;

-o-transition: 0.5s;

-webkit-transition: 0.5s;

transition: 0.5s;

}

.menu li.sub ul li a:hover {background:#5bb861;}

.menu li.sub ul.subRight li a {text-align:right;}



.menu:hover {z-index:100;}

.menu:hover li.image {width:180px; height:270px; left:-15px; bottom:-1px;

-moz-transition: 0.2s 0.5s;

-ms-transition: 0.2s 0.5s;

-o-transition: 0.2s 0.5s;

-webkit-transition: 0.2s 0.5s;

transition: 0.2s 0.5s;

}

.menu:hover li.image b {margin:46px 0 0 15px; width:83%; height:83%;

-moz-transition: 0.15s 0.7s;

-ms-transition: 0.15s 0.7s;

-o-transition: 0.15s 0.7s;

-webkit-transition: 0.15s 0.7s;

transition: 0.15s 0.7s;

}

.menu:hover li.list {top:150px; height:200px;border-top:1px solid #fff; border-right:1px solid #fff; border-left:1px solid #fff; margin-left:-1px;

-moz-transition: 0.5s 0.25s;

-ms-transition: 0.5s 0.25s;

-o-transition: 0.5s 0.25s;

-webkit-transition: 0.5s 0.25s;

transition: 0.5s 0.25s;

}

.menu:hover li.list b {margin-top:-20px; color:#5bb861; font-size:20px; line-height:225px;

-moz-transition: 0.25s 0.75s;

-ms-transition: 0.25s 0.75s;

-o-transition: 0.25s 0.75s;

-webkit-transition: 0.25s 0.75s;

transition: 0.25s 0.75s;

}



.menu:hover li.sub {top:151px; height:200px;

-moz-transition: 0.5s 0.25s;

-ms-transition: 0.5s 0.25s;

-o-transition: 0.5s 0.25s;

-webkit-transition: 0.5s 0.25s;

transition: 0.5s 0.25s;

}

.menu:hover li.sub ul li:first-child {padding-top:40px;}



.menu:hover li.sub ul.subLeft {margin-left:150px;

-moz-transition: 0.25s 0.75s;

-ms-transition: 0.25s 0.75s;

-o-transition: 0.25s 0.75s;

-webkit-transition: 0.25s 0.75s;

transition: 0.25s 0.75s;

}

.menu:hover li.sub ul.subRight {margin-left:-150px;

-moz-transition: 0.25s 0.75s;

-ms-transition: 0.25s 0.75s;

-o-transition: 0.25s 0.75s;

-webkit-transition: 0.25s 0.75s;

transition: 0.25s 0.75s;

}

.clear {clear:left;}





/*   font stylles   */

.style3 {color: #009966}

.style4 {font-size: 15px;
	     font-weight: bold;
	     color: #006666;
}

.style5 {
	color: #006633;
	font-size: 14px;
}
.style6 {color: #000000}
.style8 {
	color: #006633;
	font-weight: bold;
	font-size: 14px;}

.style9 {color: #006666;
         font-weight: bold;
         font-size: 13px;
		 active {color:#006666;}  /* selected link */ 
 
}


.style10 {color: #009966; 
          font-weight: bold;
          font-size: 14px;

 }


.smbodytext {  font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 10px}
.medbodytext {  font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 11px}
.bodytext {  font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 12px}
.lgbodytext {  font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 13px}
.finger {  cursor: hand}

A.text:hover
{
    COLOR: #666666
}
A:active
{
    TEXT-DECORATION: none
}
A:visited
{
    TEXT-DECORATION: none
}
.textmenutable
{
    LINE-HEIGHT: normal;
    TEXT-DECORATION: none
}
.headmenutable
{
    FONT-WEIGHT: bolder;
    COLOR: white;
    LINE-HEIGHT: normal;
    TEXT-DECORATION: none
}
STRONG.red
{
    COLOR: maroon
}
STRONG.white
{
    COLOR: white
}
.off
{
    COLOR: black
}
.on
{
    COLOR: maroon
}
A.red:hover
{
	COLOR: #990000;
	BACKGROUND-COLOR: #CCCCCC;
	font-weight: bold;
	text-decoration: underline;


}
A.blue:hover
{
	COLOR: #000099;
	font-weight: normal;
	text-decoration: underline;


}
A.green:hover
{
    COLOR: #2f5a4f
}
SPAN.silver
{
    COLOR: gray
}
A
{
    COLOR: black;
    TEXT-DECORATION: none
}
STRONG.blue
{
    COLOR: navy;
	
}
STRONG.green
{
    COLOR: darkgreen
}
A.blink:hover
{
	COLOR: #999999;
}
STRONG.color
{
    COLOR: #000080
}
STRONG.error
{
    COLOR: red
}
A.color:hover
{
    COLOR: dimgray
}
A:link
{
    TEXT-DECORATION: none
}

h1 { color: #006666 }

H4.color
{
    COLOR: indigo
}
OPTION.color
{
    COLOR: #000080
}
a:hover {
	COLOR: #17865b;
	text-decoration: underline;
	font-weight: bold;
}


.menuitem {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 11px;
	font-variant: normal;
	border-color: black black #000000;
	border-style: none;
	margin-bottom: 0px;
	margin-top: 0px;
	margin: 0px;
	color: 3399FF;
}

A.menuitem:link
{
	FONT-SIZE: 10px;
	COLOR: #3399FF;
	LINE-HEIGHT: 12pt;
	FONT-FAMILY: Verdana, Arial, helvetica, Sans-Serif;
	TEXT-DECORATION: none
}
A.menuitem:active
{
	FONT-SIZE: 10px;
	COLOR: #3399FF;
	LINE-HEIGHT: 12pt;
	FONT-FAMILY: Verdana, Arial, helvetica, Sans-Serif;
	TEXT-DECORATION: none
}
A.menuitem:visited
{
    
    FONT-SIZE: 10px;
    COLOR: #3399FF;
    LINE-HEIGHT: 12pt;
    FONT-FAMILY: Verdana, Arial, helvetica, Sans-Serif;
    TEXT-DECORATION: none
}
A.menuitem:hover
{
    FONT-WEIGHT: bolder;
    FONT-SIZE: 10px;
    COLOR: #17865b;
    LINE-HEIGHT: 12pt;
    FONT-FAMILY: Verdana, Arial, helvetica, Sans-Serif;
    TEXT-DECORATION: underline
}.leftline {
	border-color: #FFFFFF #FFFFFF #FFFFFF #336699;
	border-style: dotted;
	border-left-width: thin;

}
.bottomline {
	border-bottom-width: thin;
	border-top-style: dotted;
	border-right-style: dotted;
	border-bottom-style: dotted;
	border-left-style: dotted;
	border-top-color: #FFFFFF;
	border-right-color: #FFFFFF;
	border-bottom-color: #675C2F;
	border-left-color: #FFFFFF;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 12px
}

.infobox {
	position: relative;
	top: -5px;
	left: -5px;
	padding: 5px;
	text-align: left;
	border:solid 1px #006600;
	background-color: #FFFFFF;
	

}

ul
{
list-style-image:url('check-point.jpg');
}