/*
  Template Name: Template-057
  Template URI: http://websitebox.org/
  Description: A RealitySoft Template
  Author: RealitySoft
  Author URI: http://websitebox.org/
  Version: 1.0
  Date: Tuesday May 16, 2012
*/

/*  TOC 
01. GENERAL TYPOGRAPHY 
02. STRUCTURE
	- Header
    * Logo
    * Navigation
	- Content
  - Extras
03. PROGRESSIVE ENHANCEMENTS
  - Transitions
04. MEDIA QUERIES (Responsive web design)
*/

/*
===============================================================================================================
01. GENERAL TYPOGRAPHY
=============================================================================================================== */
article,aside,details,figcaption,figure, footer,header,hgroup,menu,nav,section { display:block; }
img {border: 0;}
body { font-size: 100%; margin: 0; padding: 0; }
body{line-height:20px;}
a,a:hover,a:active,a:focus{text-decoration:none; outline:0 none;-moz-outline-style:none;}
.wsbx_clearfix:after, .wsbx_page_content:after { content: "."; display: block; clear: both; visibility: hidden;
line-height: 0; height: 0;} 
.wsbx_clearfix, .wsbx_page_content { display: inline-block; }
html[xmlns] .wsbx_clearfix, html[xmlns] .wsbx_page_content { display: block;} 
* html .wsbx_clearfix, * html .wsbx_page_content { height: 1%; overflow: visible; }

.wsbx_logo, #toTop { behavior: url(http://data.websitebox.com/data/applications/01/headers/0101257/css/js/PIE.htc); zoom: 1; position: relative; }

/*
===============================================================================================================
02. STRUCTURE
=============================================================================================================== */
.wsbx_page_wrap, .wsbx_menu_wrap,
.wsbx_bottom_header_wrap, .wsbx_page_footer { position:relative; width: 96%; max-width: 1038px; margin: 0 auto; display: block; }
.wsbx_top_wrap { height: 60px; position: absolute; top: 80px; right: 0; width: 100%; z-index: 99; }

/* Header
-------------------------------------------------------------- */
.wsbx_header_wrap { position: absolute; top: 4.0%; width: 100%; z-index: 9999; }
.wsbx_header_wrap .wsbx_logo { position: absolute; z-index: 99; top: 0; left: 0; z-index: 999; background: #fff; width: 184px; height: 180px; -webkit-border-radius: 100px; -moz-border-radius: 100px; border-radius: 100px; }
.wsbx_logo a { position: absolute; top: 70px; left: 10px; }


/* Featured Slider Content */
.wsbx_featuredwrap { position: relative; }
.wsbx_featuredwrap li {position: relative; float: left; }
.wsbx_featuredwrap li .wsbx_slider_content .wsbx_image_frame { width: 55.84007707129094%; } 
.wsbx_featuredwrap li .wsbx_slider_content .wsbx_slider_caption { width: 39.0%; position: absolute;  }
.wsbx_slider_content .wsbx_slider_caption h1 { font-size: 2.2em; line-height: 1; margin: 0 0 6px; padding: 0; font-weight: normal;  }
.wsbx_slider_content .wsbx_slider_caption p { font-size: 1.010em; padding-right: 10px;}
.wsbx_slider_content .wsbx_slider_caption .wsbx_button_link { padding: 10px 20px; font-size: .95em; }
.wsbx_video_framed { position: relative; padding-bottom: 38.0%; height: 0; overflow: hidden; width: 55.84007707129094%; }
.wsbx_video_framed iframe { position: absolute; top: 0; left: 0; height: 100%; width: 100%; }

/* Partial Staged Left */
.wsbx_featuredwrap li .wsbx_slider_content.wsbx_partial_staged_left .wsbx_image_frame { float: left; height: auto; }
.wsbx_featuredwrap li .wsbx_slider_content.wsbx_partial_staged_left .wsbx_slider_caption { top: 40%; right: 2%; } 
   
/* Partial Staged Right */
.wsbx_featuredwrap li .wsbx_slider_content.wsbx_partial_staged_right .wsbx_image_frame { float: right; height: auto; }
.wsbx_featuredwrap li .wsbx_slider_content.wsbx_partial_staged_right .wsbx_slider_caption { top: 52.0%; left: 2%; } 

/* Overlay Slide Effect */
.wsbx_featuredwrap li .wsbx_slider_content.wsbx_overlay_effect { position: absolute; width: 100%; height: 140px; bottom: 0; left: 0;  color: #fff;  background: url(http://data.websitebox.com/data/applications/01/headers/gadgets/ava/images/_rgba/black80.png); }
.wsbx_featuredwrap li .wsbx_slider_content.wsbx_overlay_effect h1 { margin: 0; padding: 1% 4% .40% 2%; font-size: 2.480em; }
.wsbx_featuredwrap li .wsbx_slider_content.wsbx_overlay_effect p { margin: 0; padding: 0 3% .40% 2%; }
.wsbx_featuredwrap li .wsbx_read_more { dislay: block; position: relative; clear: both; padding-left: 2%; }
.wsbx_featuredwrap li .wsbx_slider_content.wsbx_overlay_effect .wsbx_slider_caption { width: auto; padding: 0; }

/* Vimeo Video Staged Left */
.wsbx_featuredwrap li .wsbx_slider_content.wsbx_video_left .wsbx_video_framed { float: left; margin-left: 0; } 
.wsbx_featuredwrap li .wsbx_slider_content.wsbx_video_left .wsbx_slider_caption { top: 40%; right: 2%; } 

/* Youtube Video Staged Left */
.wsbx_featuredwrap li .wsbx_slider_content.wsbx_video_right .wsbx_video_framed { float: right; margin-right: 0; } 
.wsbx_featuredwrap li .wsbx_slider_content.wsbx_video_right .wsbx_slider_caption { top: 52%; left: 2%; } 

/* Flex Slider */
.flex-container a:active,
.wsbx_flexslider a:active {outline: none;}
.slides, .flex-control-nav, .flex-direction-nav {margin: 0; padding: 0; list-style: none;} 

/* FlexSlider Necessary Styles
*********************************/ 
.wsbx_flexslider { padding: 0;}
.wsbx_flexslider .slides > li { display: none; } /* Hide the slides before the JS is loaded. Avoids image jumping */
.wsbx_flexslider .slides img { max-width: 100%; display: block; }
.flex-pauseplay span { text-transform: capitalize; }

/* Clearfix for the .slides element */
.slides:after {content: "."; display: block; clear: both; visibility: hidden; line-height: 0; height: 0;} 
html[xmlns] .slides {display: block;} 
* html .slides {height: 1%;}

/* Direction Nav */
.flex-direction-nav { position: absolute; height:  60px; width: 100%; left: 0; bottom: 0; }
.flex-direction-nav li { padding: 0; float: none; }
.flex-direction-nav li a { width: 40px; height: 60px; margin: 0; display: block; position: absolute; cursor: pointer; text-indent: -9999px; z-index: 0; background: url(../images/slide-dir-nav.png) 0 0 no-repeat; }
.flex-direction-nav li .next { right: -0; background-position: -36px 50%; }
.flex-direction-nav li .prev { left: -0; background-position: 0 50%; }
.flex-direction-nav li .disabled {opacity: .3; filter:alpha(opacity=30); cursor: default;}


/* Content
-------------------------------------------------------------- */
.wsbx_page_content { padding: 15px 0 18px; display: block;  }

 /* Navigation: */
#wsbx_primary_menu { float: right; height: 60px; position: relative; right: 0; z-index:  999; }
#wsbx_primary_menu ul { margin: 0; padding: 0; list-style-type: none; }
#wsbx_primary_menu ul li {display: inline; float: left; position: relative; }
#wsbx_primary_menu ul li a { display: block; text-align: center; text-decoration: none; font-size: 1.10em; padding: 20px 16px 19px; font-weight: bold; }
#wsbx_primary_menu ul li ul { position: absolute; left: 0; display: none; visibility: hidden; }
#wsbx_primary_menu ul li ul li ul { top: 0; }
#wsbx_primary_menu ul li ul li { display: list-item; float: none; }
#wsbx_primary_menu ul li ul li a { display: block; width: 160px; margin: 0; text-align: left; padding: 10px 10px; position: relative; font-size: 1em; font-weight: normal; }
#wsbx_primary_menu ul ul li a.wsbx_last_sub_item { border-bottom: 0!important; }
#wsbx_primary_menu .wsbx_mobileMenu { display: none; padding: 6px; font-size: 1em; border-width: 1px; border-style:solid; width: 100%; } /* Hide our select drop menu */
.downarrowclass { position: absolute; margin: 0; right: 8px; top: 28px; width: 9px; height: 5px; }
.rightarrowclass { position: absolute; top: 15px; right: 8px; width: 5px; height: 9px; }


/* Extras
-------------------------------------------------------------- */
#toTop { width: 50px; padding: 10px 0 15px; text-align: center; background: #fff; color: #222222; position: fixed; bottom: 1.5625%; right: 1.5625%; cursor: pointer; display: none; z-index: 999; text-transform: uppercase; font-size: 1.3em; -webkit-box-shadow: #222222 0 0 .48em; -moz-box-shadow: #222222 0 0 .48em; box-shadow: #222222 0 0 .48em; -webkit-border-radius: 38px; -moz-border-radius: 38px; border-radius: 38px; } /* Back to top */

/*
===============================================================================================================
03. PROGRESSIVE ENHANCEMENTS
=============================================================================================================== */
body { transition:all .2s linear; 
  -o-transition:all .2s linear;  
  -moz-transition:all .2s linear;  
  -webkit-transition:all .2s linear;}

/*
===============================================================================================================
04. MEDIA QUERIES (Responsive web design)
=============================================================================================================== */
@media screen and (max-width: 1039px) {
  body { -webkit-text-size-adjust: none;}
  img, embed, iframe, video { max-width: 100%; height: auto; width: auto\9; /* ie8 */ }
}

@media screen and (max-width: 815px) {
  .wsbx_slider_content .wsbx_slider_caption h1 { font-size: 1.70em; margin-bottom: 3px; }
  .wsbx_slider_content .wsbx_slider_caption .wsbx_button_link  { padding: 7px 15px; }
  .wsbx_slider_content .wsbx_slider_caption p:nth-child(2),
  .wsbx_slider_content .wsbx_slider_caption p:nth-child(3) { margin: 0 0 3px;  }
  .wsbx_slider_content .wsbx_slider_caption p { font-size: .96em; }
  .wsbx_top_wrap { position: relative; top: 200px; }
  .wsbx_header_wrap .wsbx_logo { left: 38%; top: 0; }
  #wsbx_primary_menu { float: left; }
  .wsbx_featuredwrap { padding: 210px 0 0; }
  .wsbx_featuredwrap li .wsbx_slider_content.wsbx_partial_staged_left .wsbx_slider_caption,
  .wsbx_featuredwrap li .wsbx_slider_content.wsbx_partial_staged_right .wsbx_slider_caption,
  .wsbx_featuredwrap li .wsbx_slider_content.wsbx_video_left .wsbx_slider_caption,
  .wsbx_featuredwrap li .wsbx_slider_content.wsbx_video_right .wsbx_slider_caption  { top: 5%; } 
}

@media screen and ( max-width: 720px ) {
  .wsbx_featuredwrap { display: none!important; }
  .wsbx_top_wrap { top: 210px; }
  .wsbx_header_wrap .wsbx_logo,
  .wsbx_header_wrap  { position: relative; }
  .wsbx_header_wrap { top: -40px; }
  .wsbx_menu_wrap { width: 75%; }
  #wsbx_primary_menu { float: none; padding: 11px 0 0; width: 100%; }
  .wsbx_page_content { padding: 7.50% 0 2%; }
}

@media screen and ( max-width: 615px ) {
  .wsbx_header_wrap .wsbx_logo { left: 35%; }
}

@media screen and ( max-width: 495px ) {
  .wsbx_header_wrap .wsbx_logo { left: 30%; width: 164px; height: 160px; }
  .wsbx_logo a  { top: 60px; left: 5px; }
  .wsbx_top_wrap { top: 188px; }
}

@media screen and ( max-width: 335px ) {
    .wsbx_header_wrap .wsbx_logo { left: 28%; width: 134px; height: 130px; }
    .wsbx_logo a  { top: 46px; left: 5px; }
    .wsbx_page_content { padding: 12.0% 0 2%; }
    .wsbx_menu_wrap { width: 96%; }
    #wsbx_primary_menu { height: 40px; }
    .wsbx_top_wrap { top: 160px; }
}

@media screen and ( max-width: 267px ) {
    .wsbx_header_wrap .wsbx_logo { left: 22%; }
    .wsbx_page_content { padding: 14.0% 0 2%; }
}