/*	
	*	---------------------------------------------------------------------
	*	CBES CSS for responsive layout (tablets and mobile devices)
	*	--------------------------------------------------------------------- 
	*/

@media only screen and (min-width: 979px) {
  #primary-main-menu {
    display: block !important;
  }
}

@media only screen and (min-device-width : 320px) and (max-device-width : 1024px) {
  html {
    -webkit-text-size-adjust: none;
  }
}

/*
	* -------------------------------------------------------------------------------------------
	* FOR ALL DEVICES
	* -------------------------------------------------------------------------------------------
	*/

@media only screen and (max-width: 979px) {
  /* General */

  body {
    overflow-x: hidden;
  }

  input {
    max-width: 90%;
  }

  textarea {
    max-width: 90%;
  }

  embed,
  object,
  iframe {
    height: auto;
    max-width: 100%;
  }

  img {
    height: auto;
  }

  input[type='submit'] {
    background-image: -moz-linear-gradient(top,  rgba(255,255,255,0.23) 0%, rgba(255,255,255,0) 100%);
    background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(255,255,255,0.23)), color-stop(100%,rgba(255,255,255,0)));
    background-image: -webkit-linear-gradient(top,  rgba(255,255,255,0.23) 0%,rgba(255,255,255,0) 100%);
    background-image: -o-linear-gradient(top,  rgba(255,255,255,0.23) 0%,rgba(255,255,255,0) 100%);
    background-image: -ms-linear-gradient(top,  rgba(255,255,255,0.23) 0%,rgba(255,255,255,0) 100%);
    background-image: linear-gradient(to bottom,  rgba(255,255,255,0.23) 0%,rgba(255,255,255,0) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#3bffffff', endColorstr='#00ffffff',GradientType=0 );
  }

  .column-1-2 {
    width: 40%;
    margin: 0 5% 0 5% !important;
  }

  .column-last {
    margin: 0 5% 0 5% !important;
  }

  /* Header */

  #header-search-wrapper,
  #primary-main-menu  li.header-search-toggle {
    display: none !important;
  }

  /* Content */

  #wrapper #content_full,
  #wrapper #content_right,
  #wrapper #content_left {
    width: 100%;
  }

  .entry-content img {
    max-width: 100%;
    height: auto;
  }

  .alignnone,
  .alignleft {
    margin: 5px 15px 5px 0px;
  }

  .alignright {
    margin: 5px 0px 5px 15px;
  }

  .gallery .gallery-item {
    padding-right: 20px;
  }

  .gallery dt {
    background-image: none;
  }

  ul.pf-one-column li img {
    margin: 0 0 15px;
  }

  ul.pf-one-column li .pf-description {
    float: none;
    width: 100%;
  }

  .pf-one-column figcaption {
    width: 426px;
  }

  .nivo-size-wrap {
    max-width: 100%;
  }

  .su-gmap {
    height: 300px;
  }

  .nivo-directionNav {
    display: none;
  }

  .gallery br {
    display: none;
  }

  #layout-wrapper .background-block {
    margin: 0px -20px;
  }

  /* Footer */

  #copyright {
    float: none;
    text-align: center;
    width: 100%;
    padding-bottom: 0px;
  }

  /* Mobile menu style */

  .toggleMenu {
    font-family: Arial, Helvetica, sans-serif;
    height: 45px;
    background: #333 url('../../images/mobile-menu-bg.png') repeat-x left bottom;
    display: block;
    padding: 0 20px;
    font-size: 11px;
    color: #f1f1f1 !important;
    text-transform: uppercase;
    line-height: 45px;
    font-weight: bold;
    box-shadow: 0px 2px 3px rgba(0, 0, 0, 0.196);
    -moz-box-shadow: 0px 2px 3px rgba(0, 0, 0, 0.196);
    -webkit-box-shadow: 0px 2px 3px rgba(0, 0, 0, 0.196);
  }

  .toggleMenu span {
    margin-top: 14px;
    display: block;
    border-bottom: 10px double #f1f1f1;
    border-top: 3px solid #f1f1f1;
    height: 4px;
    width: 20px;
    float: right;
  }

  .toggleMenu.menu-active span {
    border-color: #919191;
  }

  #menu-wrapper {
    width: 100%;
  }

  #layout-wrapper.boxed #menu-wrapper,
  #layout-wrapper.boxed-attached #menu-wrapper {
    width: auto;
    margin: 0 -20px;
  }

  #primary-main-menu {
    margin: 0;
    display: none;
    position: static;
  }

  #primary-main-menu li,
  #primary-main-menu > li.current-menu-item,
  #primary-main-menu > li.current-menu-ancestor {
    padding: 0 !important;
  }

  #primary-main-menu > li {
    float: none;
  }

  #primary-main-menu li a,
  #primary-main-menu li ul li a,
  #primary-main-menu li ul li:last-child > a,
  #primary-main-menu > li.current-menu-item > a,
  #primary-main-menu > li.current-menu-ancestor > a,
  #primary-main-menu > li:hover > a {
    margin: 0;
    padding: 14px 20px;
    font-size: 13px !important;
    color: #f1f1f1 !important;
    background-color: rgba(50, 50, 50, 0.953);
    border-bottom: 1px solid rgba(0, 0, 0, 0.2);
    border-top: 1px solid rgba(255, 255, 255, 0.1);
    line-height: 1;
    text-transform: uppercase;
    opacity: 1;
  }

  #primary-main-menu li ul {
    margin: 0;
    box-shadow: none;
    -moz-box-shadow: none;
    -webkit-box-shadow: none;
  }

  #primary-main-menu li:last-child > a {
    padding-right: 20px;
  }

  #primary-main-menu li ul li a:hover {
    padding: 14px 20px;
  }

  /* Sub-levels */

  #primary-main-menu li:hover > ul {
    visibility: hidden;
  }

  #primary-main-menu li ul {
    border-top: none !important;
  }

  #primary-main-menu li ul li a {
    width: auto;
  }

  #primary-main-menu li ul li a {
    padding-left: 40px !important;
  }

  #primary-main-menu li ul li ul li a {
    padding-left: 60px !important;
  }

  #primary-main-menu li ul li ul li ul li a {
    padding-left: 80px !important;
  }

  #primary-main-menu li ul li ul li {
    display: none;
  }

  #primary-main-menu li.hover ul li.hover ul li {
    display: block;
  }

  #primary-main-menu > li.hover > ul,
  #primary-main-menu li li.hover > ul {
    position: static !important;
    display: block !important;
    visibility: visible !important;
  }

  /* Sub-level indicator */

  #primary-main-menu li ul > li > .parent:after,
  #primary-main-menu > li > .parent:after,
  #primary-main-menu li li .parent:after {
    content: "\e3b1" !important;
    font-family: moon;
    float: right;
    font-size: 11px;
    width: auto !important;
    height: auto !important;
    border: none !important;
    position: static !important;
    left: auto !important;
    bottom: auto !important;
    margin: 0 !important;
  }

  #primary-main-menu > li.hover > .parent:after,
  #primary-main-menu li li.hover > .parent:after {
    content: "\e3b2" !important;
  }

  /* Current menu item style */

  #primary-main-menu > li.current-menu-item,
  #primary-main-menu > li.current-menu-ancestor,
  #primary-main-menu > li.current-menu-item:after,
  #primary-main-menu > li.current-menu-ancestor:after {
    margin: 0;
    border: none;
  }

  .big-testimonial-wrapper .big-testimonial-content {
    clear: both;
    margin-left: 0px;
    height: auto;
  }

  .big-testimonial-wrapper .big-testimonial-image {
    margin: 0px 0px 10px 280px;
  }

  .pf-one-column figcaption {
    bottom: 80px !important;
  }

  .pf-one-column li h3 {
    text-align: left;
  }

  .pf-one-column span {
    float: left;
  }

  .pf-two-columns figcaption {
    bottom: 0px !important;
    padding: 15px;
  }

  .pf-four-columns figcaption {
    bottom: 0px !important;
    padding: 15px;
  }
}

/*
	* -------------------------------------------------------------------------------------------
	* TABLET PORTRAIT 
	* -------------------------------------------------------------------------------------------
	*/

@media only screen and (min-width: 768px) and (max-width: 979px) {
  /* General */

  /*.size-wrap {width: auto !important;}*/

  .background-block-container {
    width: 840px !important;
  }

  #layout-wrapper.boxed,
  #layout-wrapper.boxed-attached {
    width: 900px;
  }

  #top-bar {
    width: 700px;
  }

  #wrapper #content_right,
  #wrapper #content_left {
    width: 470px;
  }

  #sidebar_right .widget-area {
    width: 200px;
  }

  #sidebar_left .widget-area {
    width: 200px;
  }

  /* Header */

  #title-wrapper {
    -webkit-background-size: auto;
    -moz-background-size: auto;
    -o-background-size: auto;
    background-size: auto;
  }

  /* Content */

  ul.pf-two-columns li {
    width: 340px;
    height: 214px;
  }



  ul.pf-one-column li {
    min-height: none;
  }

  ul.pf-one-column li img {
    width: 100%;
    margin-bottom: 0px;
    margin-right: 20px;
  }

  ul.filterable-grid.pf-one-column li .mask {
    width: 426px;
    height: 213px;
  }

  ul.filterable-grid.pf-one-column li a.pf-zoom {
    margin-top: 80px;
  }

  ul.filterable-grid.pf-two-columns li a.pf-zoom {
    margin-top: 53px;
  }

  ul.filterable-grid.pf-three-columns li a.pf-zoom {
    margin-top: 70px;
  }

  .latest-works ul li a.pf-zoom {
    margin-top: 110px;
  }

  .latest-works ul li {
    width: 415px;
    height: auto;
  }

  .latest-works ul li:nth-child(2) {
    margin: 0 0 20px 0;
  }

  .commentlist .children,
  .commentlist .children .children {
    padding-left: 20px;
  }

  #wp-calendar tbody td {
    padding: 4px 6px;
  }

  #wp-calendar tfoot #next {
    padding-left: 40px;
  }

  #wp-calendar tfoot #prev {
    padding-right: 40px;
  }

  input.s {
    width: 156px;
  }

  #fancybox-wrap,
  #fancybox-frame,
  #fancybox-content {
    max-width: 660px;
  }

  .testimonial-wrapper {
    max-width: 93.9%;
  }

  /* Footer */

  #footer-wrapper #footer-widget-area .widget-area {
    width: 280px;
  }

  #footer-wrapper #footer-widget-area .widget-area {
    margin-right: 20px;
  }

  #footer-wrapper #footer-widget-area .widget-area:last-child,
  #footer-wrapper #footer-widget-area .widget-area:nth-child(2) {
    margin-right: 0px;
  }

  /* Mobile menu style */

  .toggleMenu {
    width: 80px;
    position: absolute;
    right: 0px;
    bottom: 13px;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
  }

  #layout-wrapper.boxed .toggleMenu,
  #layout-wrapper.boxed-attached .toggleMenu {
    right: 20px;
  }

  #menu-wrapper {
    margin: 0;
    border: none;
    z-index: 999;
    position: absolute;
    bottom: 0px;
  }

  #layout-wrapper.boxed #menu-wrapper,
  #layout-wrapper.boxed-attached #menu-wrapper {
    width: 900px;
    margin: 0 -20px;
  }

  #primary-main-menu {
    position: absolute;
    top: 1px;
    width: 100%;
  }

  /* Mobile drop-down menu style */

  .mobile-select-menu {
    display: block;
    width: 250px;
    padding: 0 0 0 10px;
    position: absolute;
    right: 0px;
    bottom: 15px;
  }
}

/*
	* -------------------------------------------------------------------------------------------
	* MOBILE BOTH VIEWS
	* -------------------------------------------------------------------------------------------
	*/

@media only screen and (max-width: 767px) {
  /* General */

  embed,
  object,
  iframe {
    height: auto;
  }

  #sidebar_right,
  #sidebar_right .widget-area {
    width: 100%;
    margin-top: 40px;
  }

  #sidebar_left,
  #sidebar_left .widget-area {
    width: 100%;
    margin-top: 40px;
  }

  /* Header */

  #header-wrapper {
    border-bottom: none;
  }

  #header-wrapper,
  #header-wrapper #header-widget-area {
    position: relative;
  }

  #header {
    padding-top: 85px;
    padding-bottom: 35px;
    height: auto !important;
  }

  #header #logo {
    display: block;
    position: static;
    text-align: center;
    width: 100%;
    margin: 0px;
    bottom: 0;
  }

  #header #logo h1 {
    position: static;
  }

  .page-title {
    text-align: center;
  }

  .page-title h1 {
    padding-top: 20px;
    padding-bottom: 20px;
    float: none;
    display: inline-block;
  }

  .csb-breadcrumbs {
    float: none;
    padding: 5px 0px 21px 1px;
  }

  #layout-wrapper.full-width #header {
    position: static;
  }

  #title-wrapper {
    -webkit-background-size: auto;
    -moz-background-size: auto;
    -o-background-size: auto;
    background-size: auto;
  }

  /* Header Sidebar */

  #header-wrapper #header-widget-area {
    margin-top: 15px;
    text-align: center;
  }

  #header-wrapper #header-widget-area .widget-title {
    display: none;
  }

  #header-wrapper #header-widget-area ul.xoxo {
    float: none;
    margin-top: 0px !important;
    display: inline-block;
  }

  #header-wrapper #header-widget-area ul li {
    padding: 0px;
    margin: 0 0 10px;
  }

  #header-widget-area .widget-container {
    margin: 0px;
  }

  /* Content */

  #orbit-wrapper {
    margin-top: 40px;
  }

  .csb-breadcrumbs,
  .fp_carousel li .fp_title {
    display: none;
  }

  .column {
    float: none !important;
    margin: 0 0 40px 0 !important;
    width: 100% !important;
  }

  .su-tabs .su-tabs-nav {
    display: none !important;
  }

  .su-tabs .su-tabs-panes {
    border: 1px solid #e5e5e5 !important;
    padding-left: 0px !important;
  }

  .su-tabs .pane-title {
    display: block !important;
  }

  .su-tabs .su-tabs-pane {
    border: none !important;
    border-top: 1px solid #e5e5e5 !important;
    padding: 20px;
  }

  .fp_carousel li .fp_mask {
    display: none;
  }

  .error404_content .error404-icon {
    padding-top: 0px;
    font-size: 180px;
  }

  .client-wrapper {
    text-align: center;
  }

  .pull-right,
  .pull-left {
    float: none;
    display: block;
    text-align: center;
  }

  #respond input,
  #respond textarea {
    width: 100%;
  }

  .su-callout .callout-content {
    float: none;
  }

  .su-callout .callout-button {
    float: none;
    margin-top: 20px;
  }

  .latest-blog-entry-thumb .nivoSlider {
    width: 100%;
  }

  .blog-layout-medium {
    float: none;
    width: auto;
    padding: 0;
    margin-bottom: 18px;
  }

  #top-bar {
    padding: 15px 0px;
  }

  #top-bar  ul {
    text-align: center;
  }

  #top-bar #topright-widget-area ul {
    margin-top: 5px;
    float: none;
  }

  #top-bar ul li {
    display: inline-block;
    float: none;
  }

  /* Footer */

  #footer-wrapper #footer-widget-area .widget-area {
    width: 100%;
    margin-right: 0px;
    float: none;
  }

  /* Mobile menu style */

  #menu-wrapper {
    height: 45px;
    position: absolute;
    top: 0px;
    left: 0;
    right: 0;
    margin: 0;
    border: none;
    z-index: 999;
  }

  .big-testimonial-wrapper .big-testimonial-content {
    clear: both;
    margin-left: 0px;
    height: auto;
  }

  .big-testimonial-wrapper .big-testimonial-image {
    margin: 0px 0px 10px 150px;
  }

  ul.pf-one-column li {
    width: 100%;
  }

  .pf-one-column figcaption {
    width: 100%;
    bottom: 242px !important;
  }

  .pf-two-columns figcaption {
    top: 178px !important;
    padding: 15px;
  }

  .pf-two-columns figcaption .view-large {
    bottom: 55px !important;
    right: 15px !important;
  }

  .pf-two-columns figcaption a {
    bottom: 55px !important;
    right: 55px;
  }

  .pf-four-columns figcaption {
    top: 270px !important;
    padding: 15px;
  }

  .pf-four-columns figcaption .view-large {
    bottom: 15px !important;
    right: 15px !important;
  }

  .pf-four-columns figcaption a {
    bottom: 15px !important;
    right: 55px;
  }
}

/*
	* -------------------------------------------------------------------------------------------
	* MOBILE LANDSCAPE
	* -------------------------------------------------------------------------------------------
	*/

@media only screen and (min-width: 480px) and (max-width: 767px) {
  /* General */

  /*.size-wrap {width: 440px !important;}*/

  .background-block-container {
    width: 420px !important;
  }

  #layout-wrapper.boxed,
  #layout-wrapper.boxed-attached {
    width: 480px;
    margin: 0 auto;
  }

  #top-bar {
    width: 440px;
  }

  /* Header */

  #header #logo  img {
    max-width: 420px;
    height: auto;
  }

  /* Content */

  ul.pf-two-columns li {
    width: 440px;
    height: 277px;
  }

  ul.pf-three-columns li,
  ul.pf-four-columns li {
    width: 440px;
    height: auto;
  }

  ul.filterable-grid.pf-one-column li .mask {
    width: 440px;
    height: 220px;
  }

  ul.filterable-grid.pf-one-column li a.pf-zoom {
    margin-top: 82px;
  }

  ul.filterable-grid.pf-two-columns li a.pf-zoom {
    margin-top: 83px;
  }

  ul.filterable-grid.pf-four-columns li a.pf-zoom,
  ul.filterable-grid.pf-three-columns li a.pf-zoom {
    margin-top: 105px;
  }

  ul.filterable-grid.pf-four-columns li .pf-title {
    padding: 12px 15px;
    bottom: 30px;
  }

  .commentlist .children,
  .commentlist .children .children {
    padding-left: 20px;
  }

  #fancybox-wrap,
  #fancybox-frame,
  #fancybox-content {
    max-width: 400px;
  }

  .latest-works ul li:hover .pf-title,
  ul.filterable-grid li:hover .pf-title {
    -webkit-transform: translateX(-400px);
    -moz-transform: translateX(-400px);
    -o-transform: translateX(-400px);
    -ms-transform: translateX(-400px);
    transform: translateX(-400px);
  }

  /* Mobile drop-down menu style */

  .mobile-select-menu {
    width: 400px;
    margin: 30px 20px 0px;
    display: block;
  }

  .latest-works ul li {
    width: 415px;
    height: auto;
  }

  /* Back to top display:none */

  #back-top {
    display: none !important;
  }

  /* Social Media Heading */

  #layout-wrapper.boxed .social-media-section h2,
  #layout-wrapper.boxed-attached .social-media-section h2 {
    font-size: 14px;
  }

  /* testimonial-wrapper */

  #layout-wrapper.boxed .testimonial-wrapper,
  #layout-wrapper.boxed-attached .testimonial-wrapper {
    width: 87%;
  }

  /* footer-widget-area */

  #layout-wrapper.boxed #footer-widget-area,
  #layout-wrapper.boxed-attached #footer-widget-area {
    margin: 0px auto 0 20px;
  }
}

/*
	* -------------------------------------------------------------------------------------------
	* MOBILE PORTRAIT 
	* -------------------------------------------------------------------------------------------
	*/

@media only screen and (max-width: 479px) {
  /* General */

  /*.size-wrap {width:280px !important;}*/

  .background-block-container {
    width: 260px !important;
  }

  #layout-wrapper.boxed,
  #layout-wrapper.boxed-attached {
    width: 320px;
    margin: 0 auto;
  }

  #top-bar {
    width: 280px;
  }

  /* Header */

  #header #logo  img {
    max-width: 260px;
    height: auto;
  }

  /* Content */

  ul.pf-two-columns li {
    width: 280px;
    height: 177px;
  }

  ul.pf-three-columns li,
  ul.pf-four-columns li {
    width: 280px;
    height: auto;
  }

  ul.filterable-grid.pf-one-column li .mask {
    width: 280px;
    height: 140px;
  }

  ul.filterable-grid.pf-one-column li a.pf-zoom {
    margin-top: 42px;
  }

  ul.filterable-grid.pf-two-columns li a.pf-zoom {
    margin-top: 33px;
  }

  ul.filterable-grid.pf-four-columns li a.pf-zoom,
  ul.filterable-grid.pf-three-columns li a.pf-zoom,
  .latest-works ul li a.pf-zoom {
    margin-top: 47px;
  }

  .commentlist .children {
    padding-left: 20px;
  }

  .commentlist .children .children {
    padding-left: 10px;
  }

  div.slider-nav,
  .orbit-bullets {
    display: none;
  }

  .error404 .searchform .s {
    width: 85%;
  }

  .su-button {
    height: auto;
  }

  #fancybox-wrap,
  #fancybox-frame,
  #fancybox-content {
    max-width: 240px;
  }

  th {
    padding: 5px 0px;
  }

  td {
    padding: 5px 0px;
  }

  .post-meta span {
    padding: 0px;
    line-height: 2.0em;
  }

  .post-meta .post-comments {
    float: none;
  }

  .post-tags {
    padding: 0px;
    line-height: 2.0em;
  }

  .big-testimonial-wrapper .big-testimonial-content {
    clear: both;
    margin-left: 0px;
  }

  .big-testimonial-wrapper .big-testimonial-image {
    margin-left: 77px;
    margin-bottom: 10px;
  }

  .big-testimonial-wrapper .big-testimonial-image:before {
    border-style: solid;
    border-width: 20px 20px 0 20px;
    border-color: #e7e7e7 transparent transparent transparent;
    border-color: #e7e7e7 rgba(255,255,255,0)  rgba(255,255,255,0)  rgba(255,255,255,0);
    top: auto;
    right: auto;
    bottom: -21px;
    left: 50%;
    margin-left: -20px;
  }

  /* Footer */

  #copyright {
    font-size: 9px;
  }

  /* Mobile drop-down menu style */

  .mobile-select-menu {
    width: 240px;
    margin: 30px 20px 0px;
    display: block;
  }

  .latest-works ul li {
    height: auto;
  }

  .pf-one-column figcaption {
    bottom: 310px !important;
    padding: 15px;
    height: 50px;
  }

  .pf-one-column figcaption span {
    display: none;
  }

  .pf-one-column figcaption a {
    bottom: 95px !important;
    right: 180px;
  }

  .pf-one-column figcaption .view-large {
    bottom: 95px !important;
    right: 15px !important;
  }

  .pf-two-columns figcaption {
    top: 126px !important;
    padding: 15px;
    height: 50px;
  }

  .pf-two-columns figcaption span {
    display: none;
  }

  .pf-two-columns figcaption a {
    bottom: 135px !important;
    right: 180px;
  }

  .pf-two-columns figcaption .view-large {
    bottom: 135px !important;
    right: 15px !important;
  }

  .pf-four-columns figcaption {
    top: 153px !important;
    padding: 15px;
  }

  .pf-four-columns figcaption a {
    bottom: 160px !important;
    right: 180px;
  }

  .pf-four-columns figcaption .view-large {
    bottom: 160px !important;
    right: 15px !important;
  }

  ul.social-media {
    margin-top: -23px !important;
  }

  .social-media-section h2 {
    display: none;
  }

  ul.social-media li {
    margin: 0 0 0 6px;
  }

  ul.social-media li:hover {
    margin: 0 0 0 6px;
  }

  /* Back to top display:none */

  #back-top {
    display: none !important;
  }

  /* social-media */

  #layout-wrapper.boxed ul.social-media li,
  #layout-wrapper.boxed-attached ul.social-media li {
    font-size: 16px;
  }

  #layout-wrapper.boxed .testimonial-wrapper,
  #layout-wrapper.boxed-attached .testimonial-wrapper {
    width: 81%;
  }

  #layout-wrapper.boxed .service-content,
  #layout-wrapper.boxed-attached .service-content {
    width: 80%;
  }

  /* Footer Area */

  #footer-widget-area {
    width: 90% !important;
    margin: 0 20px !important;
  }
}