#sliderContainer { width: 940px; height: 300px; position: relative; border-top: 5px solid #999; border-bottom: 5px solid #999; margin: 0 auto; }

.slideContent {  background:url("/sm_full.aspx?guid=11073") repeat scroll 0 0 transparent; position: absolute; bottom:0px; right:0px; padding: 10px; width: 920px; }

.slide h3 {  font: 26px/1em 'Rokkitt', serif; color: #FFF;  margin: 0 0 5px 0; }

.slide p { font-size: 14px; color: #FFF; margin: 0; }

.jFlowSlideContainer { overflow: hidden; }

.jFlowSlideContainer a { color: #F90; text-decoration: none; font-style: italic; }

.jFlowSlideContainer a:hover { text-decoration: none; }

.jFlowSlideContainer a:focus { position: relative; top: 1px; }

.jFlowNext { background:url("/sm_full.aspx?guid=11103") no-repeat scroll 0 -35px transparent; height:130px; position:absolute; top:75px; right: -50px; width:50px; cursor:pointer; }

.jFlowPrev { background:url("/sm_full.aspx?guid=11103") no-repeat scroll -84px -35px transparent; height:130px; position:absolute; top:75px; left: -50px; width:50px; cursor:pointer; }

.jFlowPrev:hover { background-position: -84px -235px; }

.jFlowNext:hover { background-position: 0px -235px; }


/* controller pagination */

#myController {position: absolute; top: 5px; right: 5px; }

.jFlowControl { background:url("/sm_full.aspx?guid=11083") no-repeat scroll 0px 0px transparent;  float: left; width: 15px; height: 15px;}

.jFlowControl:hover { background-position: -32px 0px; cursor: pointer; }

.jFlowSelected, .jFlowSelected:hover {background-position: -15px 0px;   }


.wrap {
width:990px;
margin:0 auto;
padding:0px 0px 50px 0px;
}


.slider{
width:900px;
overflow:hidden;
margin:0;
position:relative;
border: 1px solid gray;
}

.parents{
position:relative;
left:710px;    
height:100px;
width:190px;
background: #444444;
background: -moz-linear-gradient(top,  #444444 0%, #6f6f6f 100%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#444444), color-stop(100%,#6f6f6f));
background: -webkit-linear-gradient(bottom,  #cecece 0%,white 100%);
background: -o-linear-gradient(top,  #444444 0%,#6f6f6f 100%);
background: -ms-linear-gradient(top,  #444444 0%,#6f6f6f 100%);
background: linear-gradient(top,  #444444 0%,#6f6f6f 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#444444', endColorstr='#6f6f6f',GradientType=0 );
border-right:1px solid #222;
box-sizing:border-box;
line-height:100px;
text-align:center;
color:#222;
font-size:16px;
-webkit-transition-property:text-shadow, box-shadow;
-webkit-transition-duration:0.3s;
-moz-transition-property:text-shadow;
-moz-transition-duration:0.5s;
-o-transition-property:text-shadow;
-o-transition-duration:0.5s;
transition-property:text-shadow;
transition-duration:0.5s;
border-top: 1px solid gray;
border-right: 1px solid gray;
}

.parents:hover{
background: #white;
box-shadow:inset 0px 0px 10px 3px #222;
-text-shadow:0px 1px 1px #888;
}

.parents:focus{
background: #white;
box-shadow:inset 0px 0px 35px 3px #222;
text-shadow:0px 1px 1px #888;
}

.child{
position:absolute;
right:190px;
top:0px;
width:710px;
height:300px;
background:white;
text-shadow:none;
z-index:1;
cursor:default;
border-right: 1px solid gray;
}


.two-slide{
opacity:0;
top:-100px;
}

.three-slide{
opacity:0;
top:-200px;
}

.one-slide, .two-slide, .three-slide{
-webkit-transition-property:opacity, z-index;
-webkit-transition-duration:1s;
-moz-transition-property:opacity, z-index;
-moz-transition-duration:1s;
-o-transition-property:opacity, z-index;
-o-transition-duration:1s;
transition-property:opacity, z-index;
transition-duration:1s;
background: -webkit-linear-gradient(top,  #cecece 0%,white 100%);
-border: 1px solid gray;
}

.parent-hidden:hover~.one-slide{
opacity:0;
}

.parent-hidden:focus~.one-slide{
opacity:0;
}

.one:hover~.one-slide{
opacity:1;
z-index:4;
}

.two:hover .two-slide{
opacity:1;
z-index:99;
}

.three:hover .three-slide{
opacity:1;
z-index:50;
}

.child-content{
position:absolute;
-bottom:0px;
top:0px;
left:0px;
padding:5px;
width:700px;
min-height:50px;
-background:rgba(0,0,0,0.5);
color:black;
font-size:12px;
text-align:left;
line-height:normal;
cursor:default;
}

.one-link:focus~.one-slide{
opacity:1;
z-index:4;
}

.two-link:focus .two-slide{
opacity:1;
z-index:99;
}

.three-link:focus .three-slide{
opacity:1;
z-index:50;
}

























html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video { margin: 0; padding: 0; border: 0; font-size: 100%; font: inherit; }

/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display: block; }

body { line-height: 1; }

ol, ul { list-style: disc; }

blockquote, q { quotes: none; }

blockquote:before, blockquote:after, q:before, q:after { content: ''; content: none; }

table { border-spacing: 0; border:3px solid black; }

body { margin: 0; padding: 0 50px 50px 50px; font-family: Arial, Helvetica, sans-serif; } /*!!!11093 background: url("/sm_full.aspx?guid=20383") repeat top left transparent;*/

a { color:#838c1c; text-decoration: none; }

#container { background: #FFF; width: 940px; margin: 0 auto; -moz-box-shadow: 0 0 10px 5px #c3c3c3; -webkit-box-shadow:0 0 10px 5px #c3c3c3; box-shadow:0 0 10px 5px #c3c3c3;}

/* header */

#header {  overflow: hidden; background: url('/sm_full.aspx?guid=13253') no-repeat top left; width: 940px; height:161px;text-align:center;}

#logoWrap { background:url('../images/demo-page/jflow-logo.png') no-repeat top left transparent; margin: 5px auto 10px; width: 345px; height: 100px; position: relative; }

#header h1 { font: 72px 'Rokkitt', serif; color:white; text-shadow: 1px 1px 2px #9f9f9f; margin: 0px; margin-top: 5px;}
#header h2 { font: 36px 'Rokkitt', serif; color:white; text-shadow: 1px 1px 2px #9f9f9f; margin: 0px; }

#logoWrap h1 span { font-size: 18px; line-height: 30px; text-transform: uppercase; text-shadow: 0px 0px 0px;}

.socialItem { float: left; }

#adWrap { float: right; margin: 25px 30px 15px; background: #DDD; }

#downloadWrap { float: right; text-align: center; margin: 0 30px 0 0; }

#downloadWrap a { background: url('../images/download-sprite.png') no-repeat right top transparent; padding: 0 40px 0 0; font-style: italic; font-size: 14px; float: left; line-height: 30px; }

#downloadWrap a:hover { background-position: right -31px; color:#5d6410; }

/* content */

#content { padding: 20px 20px 20px; overflow: hidden; }

#content p { font-size: 14px; color:#646464; line-height: 18px; margin: 0 0 10px; }

#content li { font-size: 14px; color:#646464; line-height: 18px; margin: 0 0 10px; }

#content h2, #content h3, #content h4 { font-size: 16px; font-weight: bold;padding: 15px 0; }

#main { float: left; width: 600px; }

#sidebar { float: right; width: 250px; }

/* intro */

#content .intro-heading { font:30px/42px 'Rokkitt', serif; color:#4f4e4e; border-bottom: 1px solid #d6d6d6; margin: 0 0 15px; padding: 0; }

#content .intro-p { font-size: 18px; line-height: 22px; font-style: italic;  }

/* sidebar */

.sidebar-widget { margin: 10px 0 20px; }

#sidebar .widgettitle { font:24px/30px 'Rokkitt', serif; color:#4f4e4e; margin: 0 0 15px; padding: 0; }

.ad-widget { padding: 20px 0 0; }

/* checklist */

.check-list { margin: 0; }

.check-list li { background: url('../images/demo-page/checkmark.png') no-repeat 0px 0px transparent; padding: 0 0 12px 20px; font-size: 14px; line-height: 20px; font-style: italic; }

#w3c { padding-bottom: 0px; }

#w3c span { position: relative; top: -15px; }

#w3c a { padding: 0 0 0 5px; position: relative; top: -5px; }

/* options table */

.option-name { font-weight: bold;   }

.option-type { font-style: italic; }

table td { padding:10px; line-height:18px; border:2px solid black;}

tr:nth-child(odd)		{ background-color:#eee; }

tr:nth-child(even)		{ background-color:#fff; }

/* code */

pre { background: #EEE; margin:0 0 15px; padding: 10px; overflow: auto; font-size: 12px; }


/*site*/
h2 {font-size: 18px;}
i {font-style: italic;}
em {font-style: italic;}
b {font-weight: bold;}

div.bottombanners {margin-top:25px;}
div.bottombanners a img {-webkit-filter: grayscale(100%); magin-bottom: 0px;}
div.bottombanners a:hover img {-webkit-filter: grayscale(0%);-webkit-transition-duration: 0.5s;-o-transition-duration: 0.5s;-moz-transition-duration: 0.5s;transition-duration: 0.5s;}
.bottombanners img{height: 38px}
#btd{background:#494949; url(/sm_full.aspx?guid=1003) top repeat-x;text-align: center;font-size:  14px; padding: 0px;color: #CFF2FD;line-height: 18px; width: 940px;}
#btd a {color: #CFF2FD;}
#menu { background: -webkit-gradient(linear, center top, center bottom, from(#fff), to(#ccc));
    background-image: linear-gradient(#fff, #ccc);display: block; width: 940px; -margin:10px; padding:0px 0px; -border-bottom: 5px solid #999; border-top: 5px solid #999;}
#menu a { -border: 1px dotted black;border-radius: 10px; padding: 5px 10px; color: #646464;font-weight: bold;}
#menu a:active { -border: 1px dotted black;border-radius: 10px; padding: 5px 10px; color: gray;font-weight: bold;}
#menu a:hover {-border: 1px solid black;border-radius: 10px; text-shadow: 1px 1px 2px grey, 0 0 1em gray;  color: #F2072A; background-color: #E0DFDC; -webkit-transition-duration: 0.5s;-o-transition-duration: 0.5s;-moz-transition-duration: 0.5s;transition-duration: 0.5s;}

.static li{border: 0px solid black; border-radius: 10px; color: #646464;font-weight: bold;  background: linear-gradient(to top, #cccccc, #6b6b6b); padding: 5 px;}

#menulocal {text-align:center; background: -webkit-gradient(linear, center top, center bottom, from(#fff), to(#ccc));
    background-image: linear-gradient(#fff, #ccc); display: block; width: 940px; -margin:10px; padding: 10px 0px;  border-bottom: 5px solid #999;}
#menulocal h1 {font-size: 16px; font-weight: bold;padding: 15px 0;}
#menulocal a { -border: 1px dotted black;border-radius: 10px; padding: 5px 10px; color: #646464;font-weight: bold;}
#menulocal a:hover {-border: 1px solid black;border-radius: 10px; text-shadow: 1px 1px 1px black, 0 0 1em gray; color: red; /background-color: gray;}
#bc { background: -webkit-gradient(linear, center top, center bottom, from(#fff), to(#ccc));
    background-image: linear-gradient(#fff, #ccc); display: block; width: 940px; -margin:10px; padding: 10px 0px; border-bottom: 5px solid #999;border-top: 5px solid #999;}
#bc h1 {font-size: 16px; font-weight: bold;padding: 15px 0;}
#bc a { -border: 1px dotted black;border-radius: 10px; padding: 5px 10px; color: green;font-weight: bold; font-size: 12px; color: #646464;}
#bc a:hover {-border: 1px solid black;border-radius: 10px; text-shadow: 1px 1px 1px black, 0 0 1em gray; color: red; /background-color: gray;}

.frame_left {display:inline}
.frame_left a img {opacity: 0.75;}
.frame_left a:hover img {opacity: 1; -webkit-transition-duration: 0.7s;-o-transition-duration: 0.7s;-moz-transition-duration: 0.7s;transition-duration: 0.7s;}

#header a:hover{color:gray; text-decoration:underline; text-color:red;}

-o-transition: transform 0.5s linear;
	-ms-transition: transform 0.5s linear;
	-moz-transition: transform 0.5s linear;
	-webkit-transition: transform 0.5s linear;
	transition: transform 0.5 linear;}
td{vertical-align: middle;}

.nlnk a:hover{color:red; -webkit-transition-duration: 0.5s;-o-transition-duration: 0.5s;-moz-transition-duration: 0.5s;transition-duration: 0.5s;}
.listItem a:hover{color:red; -webkit-transition-duration: 0.5s;-o-transition-duration: 0.5s;-moz-transition-duration: 0.5s;transition-duration: 0.5s;}
#newsfeed td{vertical-align:top;}
.level2 CTRL_21561_DynamicMenuStyle dynamic{background-color: #f2f2f2;}

#menu li>a{
background-color: #F5F5F5;
text-align: center; 
margin: 2px 5px;
border: 0px solid black;
}

#newsfeed td {
  vertical-align: top;
}


div.albums a img{
	-o-transition: transform 0.5s linear;
	-ms-transition: transform 0.5s linear;
	-moz-transition: transform 0.5s linear;
	-webkit-transition: transform 0.5s linear;
	transition: transform 0.5 linear;
}

div.albums a:hover img{
	-o-transform: skew(-10deg, 10deg);
	-ms-transform: skew(-10deg, 10deg);
	-moz-transform: skew(-10deg, 10deg);
	-webkit-transform: skew(-10deg, 10deg);
	transform: skew(-10deg, 10deg);
}

h1 { font-size: 1.4em;
}