/*
 * CSS For DotNetNuke Skin by bestdnnskins.com
 * Copyright 2013 By BESTDNNSKINS.COM
 */
/*-------- Global CSS Reset --------*/
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, caption, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary,time, mark, audio, video {border:0;}
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {display: block;}a img{border:0;}
img, object, embed { max-width: 100%;}
img { height: auto;}

/*-------- Design style --------*/
.floatl{ float:left;}
.floatr{ float:right;}
.pc_display { display:block;}
.mobile_display { display:none;}
.pre_defined_color { background: url(../images/bg_pattern/bg_grid_15.png) #0095c8;}
#skin_wrap { width:100%; position:relative;z-index:1; background:#ECECEC;}
.skin_width { width:100%;max-width:960px;min-width:767px;margin:0 auto; position:relative;}

#skin_header { padding:5px 0; box-shadow: 0 5px 5px -5px rgba(0,0,0,.3) inset; -webkit-box-shadow: 0 5px 5px -5px rgba(0,0,0,.3) inset; -moz-box-shadow: 0 5px 5px -5px rgba(0,0,0,.3) inset; min-height:0; position:relative;}
.header_top { padding:10px 5px 0 5px; position:relative; min-height:80px;}
.logo_style { float:left; padding:5px 10px 5px 50px;}
.headerpane_style { float:left; padding:10px; }
.right_icons { float:right; position:relative;}
.right_icons_position { padding-top:10px;}
#skin_nav { background:#EEEEEE; background: -webkit-gradient(linear, left top, left bottom, from(#FCFCFC), to(#E3E3E3) ); background: -moz-linear-gradient(top,#FCFCFC, #E3E3E3); border-radius:8px; -webkit-border-radius:8px; -moz-border-radius:8px; box-shadow: 0 10px 10px -10px rgba(0,0,0,.8); -webkit-box-shadow: 0 10px 10px -10px rgba(0,0,0,.8); -moz-box-shadow: 0 10px 10px -10px rgba(0,0,0,.8); margin:10px 0; min-height:50px; position:relative; z-index:905;}
.banner_style { margin-top:10px; min-height:0;}
.skin_center_line { background:#292929; border-top:1px solid #555555; height:10px;}
.skin_content { padding:110px 0 10px 0; min-height:500px;}
.NB_skin_content { padding:10px 0; min-height:500px;}
.skin_bottom_line { background:#292929; border-bottom:1px solid #555555; height:10px;}
#skin_footer { color:#FFFFFF;}
#skin_footer .contact_form input, #skin_footer .contact_form textarea { color:#FFFFFF;}
.footerpane_style { border-bottom:1px solid rgba(0,0,0,0.2); }
.footer_bottom { border-top:none;}
.bottom_link { text-align:center; padding:15px 10px 5px 10px; color:#FFFFFF;}
.copyright_style { text-align:center; padding:5px 0 10px 0; color:#FFFFFF;}

/*--------- StandardMenu style ----------*/
#standardMenu { position:relative; margin:0 auto;}
#standardMenu ul { list-style:none; margin:0; padding:0;}
#standardMenu li{ position:relative; display:block; float:left; list-style-type:none; margin-right:1px; z-index:903;}

#standardMenu .rootMenu li a{ background:url(../images/menu_line.png) no-repeat right center; display:block; position:relative; float:none; z-index:10; cursor:pointer; text-decoration:none;}
#standardMenu .rootMenu li.last a { background:none;}
#standardMenu .rootMenu li.selected a, #standardMenu .rootMenu li.rmHover a, #standardMenu .rootMenu li.breadcrumb a, #standardMenu .rootMenu li:hover a, #standardMenu .rootMenu li a:hover { text-decoration:none;}

#standardMenu .rootMenu li a span { display:block; padding:0 22px; height:50px; line-height:50px; color:#444444; white-space:nowrap; font-size:13px; font-weight:bold; text-shadow:1px 1px 1px #CCCCCC; text-transform:uppercase;}
#standardMenu .rootMenu > li.selected > a span, #standardMenu .rootMenu > li.breadcrumb > a span { color:#0095c8; -moz-transition:color 0.2s ease; -webkit-transition:color 0.2s ease; transition:color 0.2s ease;}
#standardMenu .rootMenu li:hover a span, #standardMenu .rootMenu li a:hover span { color:#000000; -moz-transition:color 0.2s ease; -webkit-transition:color 0.2s ease; transition:color 0.2s ease;}

/*-- submenu --*/
#standardMenu .subMenu { display:none; position:absolute; top:51px; z-index:1210;}
#standardMenu .rootMenu li.rmHover .subMenu { display:block;}
#standardMenu .subMenu ul{ margin:0; padding:0; position:relative; width:180px; border:1px solid #DDDDDD;box-shadow: 2px 2px 10px 2px rgba(0,0,0,.08); -webkit-box-shadow: 2px 2px 10px 2px rgba(0,0,0,.08); -moz-box-shadow: 2px 2px 10px 2px rgba(0,0,0,.08); z-index:1200;}
#standardMenu .subMenu li{ float:none; clear:both; width:100%; padding:0; *margin-bottom:-3px; position:relative;}
#standardMenu .subMenu li.item a{ background:#FFFFFF; background:rgba(255,255,255,0.9); border-bottom:1px solid #CECECE; }
#standardMenu .subMenu li.last > a{ border-bottom: none;}
#standardMenu .subMenu li.item a span{ display:block; background:none; font-size:12px; color:#555555; font-weight:normal; white-space:normal; height:auto; line-height:1.5em; padding:12px 10px 12px 12px; text-shadow:none; text-transform:none; margin:0;}
#standardMenu .subMenu li.selected > a span, #standardMenu .subMenu li.breadcrumb > a span { color:#0095c8;}
#standardMenu .subMenu li.item a:hover span { color:#000000; cursor:pointer;}
#standardMenu .subMenu .subarrow{ background:url(../images/menu-arrow01.gif) no-repeat; position:absolute; right:0; top:18px; width:15px; height:7px;}

#standardMenu ul li ul li ul{ width:180px; margin:0;}
#standardMenu ul li ul li ul.level1{ display: none; position:absolute; left:180px; top:-1px;}
#standardMenu ul li ul li ul li ul{ display:none;}
#standardMenu ul li ul li ul li:hover ul.level2 { display: block; position:absolute; left:180px; top:-1px;}
#standardMenu ul li ul li ul li ul li ul{ display:none;}
#standardMenu ul li ul li ul li ul li:hover ul.level3 { display: block; position:absolute; left:180px; top:-1px;}

#standardMenu img.mmIcon {max-height:24px; margin-right: 7px; vertical-align: middle;}
#standardMenu img.rootIcon {max-height:30px; margin-right: 6px; vertical-align: middle;}

/*--------- MegaMenu style ----------*/
#megaMenu { position:relative; margin:0 auto;}
#megaMenu ul { list-style:none; margin:0; padding:0;}
#megaMenu li{ position:relative; display:block; float:left; list-style-type:none; margin-right:1px; z-index:903;}

#megaMenu .root li a{ background:url(../images/menu_line.png) no-repeat right center; display:block; position:relative; float:none; z-index:10; cursor:pointer; text-decoration:none;}
#megaMenu .root li.last a { background:none;}
#megaMenu .root li.selected a, #megaMenu .root li.rmHover a, #megaMenu .root li.breadcrumb a, #megaMenu .root li:hover a, #megaMenu .root li a:hover { text-decoration:none;}

#megaMenu .root li a span { display:block; padding:0 22px; height:50px; line-height:50px; color:#444444; white-space:nowrap; font-size:13px; font-weight:bold; text-shadow:1px 1px 1px #CCCCCC; text-transform:uppercase;}
#megaMenu .root > li.selected > a span, #megaMenu .root > li.breadcrumb > a span { color:#0095c8; -moz-transition:color 0.2s ease; -webkit-transition:color 0.2s ease; transition:color 0.2s ease;}
#megaMenu .root li:hover a span, #megaMenu .root li a:hover span { color:#000000; -moz-transition:color 0.2s ease; -webkit-transition:color 0.2s ease; transition:color 0.2s ease;}

/*-- submenu --*/
#megaMenu .category { display:none; position:absolute; top:51px; z-index:1210; width:342px; padding:0; padding:5px 10px 12px 10px; background:#FFFFFF; background:rgba(255,255,255,0.9); background:rgba(255,255,255,0.9); border:none; border-radius:4px; webkit-border-radius:4px; -moz-border-radius:4px; box-shadow: 0 0 3px 0 rgba(0,0,0,.4); -webkit-box-shadow: 0 0 3px 0 rgba(0,0,0,.4); -moz-box-shadow: 0 0 3px 0 rgba(0,0,0,.4);}
#megaMenu ul li:hover ul{ visibility: visible;}
#megaMenu .root li.rmHover .category { display:block;}
#megaMenu .category ul{ margin:0; padding:0; position:relative; z-index:1200;}
#megaMenu .category li{ width:170px; padding:0;}
#megaMenu .category li.item a{ border:none; padding:0 10px; background:url(../images/mega_sub_bottom.png) no-repeat left bottom; white-space:normal;}
#megaMenu .category li.item a span{ display:block; background:none; font-size:12px; color:#555555; font-weight:normal; height:auto; white-space:normal; height:auto; line-height:1.5em; padding:12px 0 5px 0;  text-shadow:none; text-transform:none;}
#megaMenu .category li.item a:hover span { background:none; color:#000000; cursor:pointer;}
#megaMenu .category li.selected > a span { color:#0095c8;}

#megaMenu ul li ul li ul{ position: relative; padding:0; width:auto; border:none; background:none;}
#megaMenu .leaf li{ clear:both;float:none; width:150px; padding:0 10px;}
#megaMenu .leaf li.item a{ text-transform: none; font-size:12px; padding:0 0 0 6px; line-height:1em; background:url(../images/right.gif) left 12px no-repeat; border-bottom:none;}
#megaMenu .leaf li.item a span{ display:block; background:none; font-size:12px; color:#555555; font-weight:normal; height:auto; line-height:1.5em; padding:6px 0 6px 0; text-transform:none;}
#megaMenu .leaf li.selected > a span{ color:#0095c8; cursor:pointer;}
#megaMenu .leaf li li{ clear:both;float:none; width:130px;}

#megaMenu ul li ul li ul li a{ color:#555555; text-transform: none; font-size:12px; padding:8px 0 8px 5px; line-height:1em; background:url(../images/right.gif) left 12px no-repeat; border-bottom:none;}
#megaMenu ul li ul li ul li a:hover{ background:url(../images/right.gif) left 12px no-repeat; text-decoration:underline;}

#megaMenu img.mmIcon {max-height:24px; margin-right: 7px; vertical-align: middle;}
#megaMenu img.rootIcon {max-height:30px; margin-right: 6px; vertical-align: middle;}

/*--------- Pane Style ----------*/
.DNNEmptyPane{ display:none!important;}
.dnnpane [class*="grid"] { padding:5px 0px 5px 0px;}
.bannerpane { margin-top:20px;  padding:0;}
.bannerpane p{ margin:0; }
.headerpane { padding:0; margin:0; color:#fff;}
.content_grid12 {}
.one_grid8 {}
.one_grid4 {}
.two_grid6a {}
.two_grid6b {}
.three_grid4a {}
.three_grid4b {}
.three_grid4c {}
.four_grid12 {}
.five_grid3a {}
.five_grid3b {}
.five_grid3c {}
.five_grid3d {}
.six_grid4 {}
.six_grid8 {}
.seven_grid12 {}
.eight_grid3a {}
.eight_grid3b {}
.eight_grid3c {}
.eight_grid3d {}
.footer_grid3a { margin:20px 0 10px 0;}
.footer_grid3b { margin:20px 0 10px 0;}
.footer_grid3c { margin:20px 0 10px 0;}
.footer_grid3d { margin:20px 0 10px 0;}

.i_content_grid12 {}
.i_one_grid3 {}
.i_one_grid9 {}
.i_two_grid4a {}
.i_two_grid4b {}
.i_two_grid4c {}
.i_three_grid9 {}
.i_three_grid3 {}
.i_four_grid12 {}

/*--------- Grid Style ----------*/
.row-fluid span.SubHead center { font-weight:normal;  font-size:13px;}


/*--------- Language Style ----------*/
.language_style { float: right; position: relative; overflow:hidden;}
.language_style  .language-button { background:rgba(0, 0, 0, 0.2);  border-bottom:1px solid rgba(0, 0, 0, 0.2); -webkit-border-radius: 20px; -moz-border-radius: 20px; border-radius: 20px; -webkit-box-shadow: 0 0 4px rgba(255, 255, 255, 0.8); -moz-box-shadow: 0 0 4px rgba(255, 255, 255, 0.8); box-shadow: 0 0 4px rgba(255, 255, 255, 0.8); cursor: pointer; display: block; float: left; height: 40px; width:40px; margin: 5px 2px;}
.language_style  .language-button:hover { background:rgba(0, 0, 0, 0.4);  -webkit-transition: all 0.2s ease-in 0s; -moz-transition: all 0.2s ease-in 0s; -o-transition: all 0.2s ease-in 0s; transition: all 0.2s ease-in 0s;}
.language_style  .language-button span { background:url(../images/icon_lang.png) no-repeat scroll 10px 11px transparent; display: block; height: 32px; opacity: 1; width: 32px;}
#Language { position:relative; height:20px; margin:10px 5px 0 0;}
#Language .language-object{ float:right;display:block; margin:0;}
#Language .language-object .Language {margin:0 1px;}
#Language .language-object span img{height:18px; width:25px;opacity:0.7; margin:0; border:2px solid transparent;}
#Language .language-object span:hover img{opacity:1;}
#Language .language-object .Language.selected img{ opacity:1; border-color:#fff; border-color:rgba(255,255,255,.4); -webkit-border-radius: 2px;border-radius: 2px;}

/*--------- Search Style ----------*/
.search_style { float: right; margin-right: 10px; position: relative;}
.search_style .search-button { background:rgba(0, 0, 0, 0.2);  border-bottom:1px solid rgba(0, 0, 0, 0.2); -webkit-border-radius: 20px; -moz-border-radius: 20px; border-radius: 20px; -webkit-box-shadow: 0 0 4px rgba(255, 255, 255, 0.8); -moz-box-shadow: 0 0 4px rgba(255, 255, 255, 0.8); box-shadow: 0 0 4px rgba(255, 255, 255, 0.8); cursor: pointer; display: block; height: 40px; width:40px; margin: 5px 0;}
.search_style .search-button:hover { background:rgba(0, 0, 0, 0.4); -webkit-transition: all 0.2s ease-in 0s; -moz-transition: all 0.2s ease-in 0s; -o-transition: all 0.2s ease-in 0s; transition: all 0.2s ease-in 0s;}
.search_style .search-button span { background:url(../images/icon_search.png) no-repeat scroll 11px 12px transparent; display: block; height: 30px; opacity: 1; width: 32px;}
#Search { display: none; position:relative; height:30px; margin:10px 5px 5px 0;}
.searchSite { text-indent:-99999px;}
.search_position {position:absolute; right:0; }
#Search input[type="text"] { background:rgba(0, 0, 0, 0.1); background: -webkit-gradient(linear, left top, left bottom, from(rgba(0, 0, 0, 0.05)), to(rgba(0, 0, 0, 0.15)) ); background: -moz-linear-gradient(top,rgba(0, 0, 0, 0.05), rgba(0, 0, 0, 0.15)); border:none;  -webkit-border-radius: 6px; -moz-border-radius: 6px; border-radius: 6px; -webkit-box-shadow: 0 0 6px rgba(255, 255, 255, 0.8); -moz-box-shadow: 0 0 6px rgba(255, 255, 255, 0.8); box-shadow: 0 0 6px rgba(255, 255, 255, 0.8); font-size:12px; color: #FFFFFF; width: 140px; padding: 8px 30px 8px 8px;}
#Search a{ background:url(../images/icon_search.png) no-repeat 14px 8px; display: block; position:absolute; right:0; top:0;height:28px; width:40px; padding:0;border:none; box-shadow:none; -webkit-box-shadow:none; overflow:hidden;text-indent:-99999px; z-index:1;cursor:pointer; opacity: 0.6;}
#Search a:hover { opacity:1;}
ul.searchSkinObjectPreview  { z-index: 9999!important;}

/*--------- Login Style ----------*/
.login_style { float:right; margin-right: 10px; position: relative;}
.login_style .login-button, .login_style .logout-button { background:rgba(0, 0, 0, 0.2);  border-bottom:1px solid rgba(0, 0, 0, 0.2); -webkit-border-radius: 20px; -moz-border-radius: 20px; border-radius: 20px; -webkit-box-shadow: 0 0 4px rgba(255, 255, 255, 0.8); -moz-box-shadow: 0 0 4px rgba(255, 255, 255, 0.8); box-shadow: 0 0 4px rgba(255, 255, 255, 0.8); cursor: pointer; display: block; height: 40px; width:40px; margin: 5px 0;}
.login_style .login-button:hover, .login_style .logout-button:hover { background:rgba(0, 0, 0, 0.4);  -webkit-transition: all 0.2s ease-in 0s; -moz-transition: all 0.2s ease-in 0s; -o-transition: all 0.2s ease-in 0s; transition: all 0.2s ease-in 0s;}
.login_style .login-button span { background:url(../images/icon_login.png) no-repeat scroll 10px 11px transparent; display: block; height: 30px; opacity: 1; width: 32px; overflow:hidden;}
.login_style .logout-button span { background:url(../images/icon_logout.png) no-repeat scroll 10px 11px transparent; display: block; height: 30px; opacity: 1; width: 32px;}
.user_login{ display:none;}
.login_style .login-button span a {height: 48px; width:32px; padding:30px 50px;}

/*--------- User Style ----------*/
.user_style { float:right; margin-right:10px; position:relative;}
.user_style .user-button { background:rgba(0, 0, 0, 0.2);  border-bottom:1px solid rgba(0, 0, 0, 0.2); -webkit-border-radius: 20px; -moz-border-radius: 20px; border-radius: 20px; -webkit-box-shadow: 0 0 4px rgba(255, 255, 255, 0.8); -moz-box-shadow: 0 0 4px rgba(255, 255, 255, 0.8); box-shadow: 0 0 4px rgba(255, 255, 255, 0.8); cursor: pointer; display: block; height: 40px; width:40px; margin: 5px 0;}
.user_style .user-button:hover { background:rgba(0, 0, 0, 0.4);  -webkit-transition: all 0.2s ease-in 0s; -moz-transition: all 0.2s ease-in 0s; -o-transition: all 0.2s ease-in 0s; transition: all 0.2s ease-in 0s;}
.user_style .user-button span { background:url(../images/icon_user.png) no-repeat scroll 10px 11px transparent; display: block; height: 30px; opacity: 1; width: 32px;}
.user_register { display:none;}

/*--------- User Profile Style ----------*/
.mobile_profile_style { display:none;}
#Mobile_Profile { display:none;}
.user_profile{ background:url(../images/profile_bg.png) repeat-x; border-radius:6px; -webkit-border-radius:6px; -moz-border-radius:6px; box-shadow: 0 0 5px 0 rgba(0,0,0,.1); -webkit-box-shadow: 0 0 5px 0 rgba(0,0,0,.1); -moz-box-shadow: 0 0 5px 0 rgba(0,0,0,.1); cursor: pointer; display: block; position:relative; height: 33px;}
.user_profile ul { margin:0; padding:0;}
.user_profile .registerGroup, .user_profile .registerGroup *{ display:block;} 
.user_profile .registerGroup{ float:left; padding:0; margin:0;} 

/* Register Group Styles */ 
.user_profile .registerGroup { padding-left:2px;}
.user_profile .registerGroup li{ float:left; height:33px; border-right:1px solid rgba(255,255,255,.15);}
.user_profile .registerGroup .buttonGroup{ margin-right:0;}
.user_profile .registerGroup a{ position:relative; display:block; padding:0 9px; min-width:15px; font-weight:normal; font-size:12px; vertical-align:middle; color:#FFFFFF; height:33px; vertical-align:middle; line-height:33px;}
.user_profile .registerGroup a:hover{ color:#CCCCCC; text-decoration:none;}
.user_profile .registerGroup a:active{ color:#FFFFFF; padding:0 9px;}
.user_profile .registerGroup a strong{ position:absolute; left:0; top:0; width:100%; height:100%; display:block; font-size:11px; font-weight:bold; vertical-align:baseline; overflow:hidden; text-indent:-9999px;}
.registerGroup .userMessages,.registerGroup .userNotifications { background:none;}
.registerGroup .userNotifications{ border-left:1px solid rgba(0,0,0,.15);}
.registerGroup .userMessages strong,.registerGroup .userNotifications strong{ background:url(../images/userLoginSprite.png) no-repeat 1px -28px;}
.registerGroup .userMessages strong:hover{background-position:1px 1px;}
.registerGroup .userNotifications strong{ background-position:-27px -28px;}
.registerGroup .userNotifications strong:hover{ background-position:-27px 1px;}
.registerGroup .userMessages strong:active{background-position:1px -28px;}
.registerGroup .userNotifications strong:active{ background-position:-27px -28px;}	
.user_profile .registerGroup a span{ position:absolute; right:5px; top:-7px; display:inline-block; padding:2px 4px; line-height:15px; min-width:7px; text-align:center; margin-right:3px;background: rgb(31,152,241); /* Old browsers */font-size:9px;color:#fff;text-shadow: 0px 1px 0px #333333;
/*CSS3*/	
background: -moz-linear-gradient(top, rgba(31,152,241,1) 0%, rgba(2,111,196,1) 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(31,152,241,1)), color-stop(100%,rgba(2,111,196,1))); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top, rgba(31,152,241,1) 0%,rgba(2,111,196,1) 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top, rgba(31,152,241,1) 0%,rgba(2,111,196,1) 100%); /* Opera 11.10+ */
background: linear-gradient(top, rgba(31,152,241,1) 0%,rgba(2,111,196,1) 100%); /* W3C */			
-webkit-border-radius:3px;-moz-border-radius:3px;border-radius:3px; -webkit-box-shadow: 0px 1px 0px 0px #222222;-moz-box-shadow: 0px 1px 0px 0px #222222;box-shadow: 0px 1px 0px 0px #222222; }
.user_profile .registerGroup li.userDisplayName { border-left:1px solid rgba(0,0,0,.15);}
.user_profile .registerGroup li.userProfileImg{ border-right:none; border-left:1px solid rgba(0,0,0,.15); padding-right:10px;}	
.user_profile .registerGroup .userProfileImg a{ padding:4px 0 0 5px; background:none; min-width:20px;}
.user_profile .registerGroup a img{ border:none;height:26px; width:26px;background:none;}

/*--------- Tipsy Style ----------*/
.tipsy { display:block; float: left; padding:5px 2px; font-size: 12px; background-repeat: no-repeat; background-image: url(../images/tipsy.gif);}
.tipsy-inner { padding: 5px 8px 4px 8px; background:#000000; color: #FFFFFF; max-width: 200px; text-align: center; -moz-border-radius:3px; -webkit-border-radius:3px; border-radius:3px;}
.tipsy-up { background-position: top center;}
.tipsy-down { background-position: bottom center;}
.tipsy-right { background-position: right center;}
.tipsy-left { background-position: left center;}

/*--------- Color Picker Style ----------*/
#custom_wrapper {position: fixed;top: 170px;left:-155px;width: 150px;padding: 18px 0 18px 0;background: #fff;z-index: 99999;font-size: 12px;border: 1px solid #E1E1E1;border-bottom: 1px solid rgba(150, 150, 150, 0.2);-webkit-box-shadow: 3px 3px 0px 0px rgba(0, 0, 0, 0.1);-moz-box-shadow: 3px 3px 0px 0px rgba(0, 0, 0, 0.1);box-shadow: 3px 3px 0px 0px rgba(0, 0, 0, 0.1);}
#custom_wrapper div, #custom_wrapper span, #custom_wrapper p, #custom_wrapper li, #custom_wrapper td {color: #555!important;}
#custom_wrapper #bg_color {width: 100%;height: 25px;cursor: pointer;border: 1px solid #555;}
#custom-button {display:block;position: fixed;top: 200px;left:0;cursor:pointer;z-index: 999;}
#custom_wrapper .custom_inner{width: 80%;margin:auto;}
.colorpicker_preview{width: 100%;height: 30px;margin: 5px 0 0 0;}
#custom_wrapper .use-form-styles select{width: 110px;}
.color-box, .pattern-box, .bg-box { width:24px;height:24px;display:block;float:left; margin:5px 2px 0 2px;border: 1px solid #cacaca;}
.pattern-box { background:#0095c8;}
#colorpicker { width: 36px;height: 36px;background: url(../images/colorpicker/select2.png);}
#colorpicker div { width: 28px;height: 28px;background: url(../images/colorpicker/select2.png) center;}
#custom_wrapper #custom-reset{ height:30px; padding:5px 25px; margin:0 18px; background:url(../images/gradient.png) #111;-moz-border-radius:3px; -webkit-border-radius:3px; border-radius:3px; color:#fff; text-decoration:none;} 
#custom_wrapper #bg_pattern { height:155px; margin-top:10px;}

/*--------- 3D Transform Style ----------*/
.transform_style { width: 222px; margin:0 auto;}
.transform_style ul { position:relative; list-style:none; margin:0; padding:0 0 10px 0;}
.transform_style ul li { list-style:none; margin:0; padding:0; height: 134px; width: auto; -webkit-perspective: 900px; -moz-perspective: 900px; perspective: 900px; text-align:center;}
.transform_style .transform_bg { -webkit-transform-style: preserve-3d; -moz-transform-style: preserve-3d; transform-style: preserve-3d; height: 100%; width: 100%;}
.transform_style .transform_content .front { background-position: center center; position:absolute; width:100%; height:100%; -webkit-transform-origin: 50% 0 0; -moz-transform-origin: 50% 0 0; transform-origin: 50% 0 0; -webkit-transition: all 0.4s linear 0s; -moz-transition: all 0.4s linear 0s; transition: all 0.4s linear 0s;opacity: 1;}
.transform_style .transform_content .back { background-position: center center; background:#0095c8; position:absolute; display: block; width:100%; height:100%; opacity: 0; -webkit-transform-origin: 50% 0 0; -moz-transform-origin: 50% 0 0; transform-origin: 50% 0 0; -webkit-transition: all 0.4s linear 0s; -moz-transition: all 0.4s linear 0s; transition: all 0.4s linear 0s;-webkit-transform: translate3d(0px, 0px, -100px) rotate3d(1, 0, 0, 90deg); -moz-transform: translate3d(0px, 0px, -100px) rotate3d(1, 0, 0, 90deg); ransform: translate3d(0px, 0px, -100px) rotate3d(1, 0, 0, 90deg);}
.transform_style .featuredWork:hover .front { opacity: 0; -webkit-transform: translate3d(0px, 150px, 0px) rotate3d(1, 0, 0, -90deg); -moz-transform: translate3d(0px, 150px, 0px) rotate3d(1, 0, 0, -90deg); transform: translate3d(0px, 150px, 0px) rotate3d(1, 0, 0, -90deg);} 
.transform_style .featuredWork:hover .back { opacity: 1;-webkit-transform: rotate3d(1, 0, 0, 0deg); -moz-transform: rotate3d(1, 0, 0, 0deg); transform: rotate3d(1, 0, 0, 0deg);}
.transform_style .transform_content .back h3, .transform_style .transform_content .back p { text-align:center; color:#FFFFFF;}
.transform_style .transform_content .back p { padding:0 10px 10px 10px;}

/*--------- Scroll Top Style ----------*/
#top-link { background:url(../images/scroll_top.png) no-repeat scroll center top rgba(0, 0, 0, 0.2); border: 0 none; border-radius: 3px; -webkit-border-radius: 3px; -moz-border-border-radius: 3px; bottom: 12px; right: 50px; display:block; height:40px; padding:0; width:55px; position: fixed; text-decoration: none; z-index: 903;}
#top-link:hover { background:url(../images/scroll_top.png) no-repeat scroll center bottom rgba(0, 0, 0, 0.25);  -webkit-transition: all 0.2s ease-in 0s; -moz-transition: all 0.2s ease-in 0s; -o-transition: all 0.2s ease-in 0s; transition: all 0.2s ease-in 0s;}