/*
The styles in this stylesheet only apply to resolutions 768px and up

CALCULATING DIMENSIONS:
----------------------
The layout is fluid. The sote wrapper (.col-full) has a fixed pixel max-width.
All subsequent dimensions are calculated based on that fixed pixel width, using the formula: target / context = result
Credit - http://www.alistapart.com/articles/fluidgrids/

-----
INDEX
-----

1. Global dropdown styles
2. Top Navigation
3. Main navigation dropdown menus
4. General layout related tweaks
*/
.fl {
  float: right;
}
.fr {
  float: left;
}
.col-left {
  float: right;
}
.col-right {
  float: left;
}
#comments .reply {
  right: auto;
  left: 1em;
}
#comments .avatar {
  float: right;
  margin: 0 0 15px 10px;
}
/* Tablet Portrait size and sizes above 768 (devices and browsers) */
@media only screen and (min-width: 768px) {
  /* 1. GLOBAL DROPDOWN STYLES (these are purely for the dropdown layout and you should only edit the width of the dropdowns) */
  ul.nav {
    margin-left: 1em;
  }
  ul.nav li {
    float: right;
  }
  ul.nav ul {
    right: 0;
  }
  /* 3. MAIN NAVIGATION DROPDOWN MENUS (Add main navigation presentational styles here) */
  #navigation {
    right: auto;
  }
  #navigation ul.cart.nav > li > ul {
    right: auto;
    left: 0;
  }
  #navigation .cart-contents {
    margin-left: .5em;
  }
  #navigation .cart-contents:before {
    margin-left: .5em;
  }
  #navigation ul ul {
    margin-right: 0;
  }
  #navigation ul.nav ul {
    right: -1px;
  }
  #navigation ul.nav ul ul {
    right: 100%;
  }
  #top .nav li.parent > a {
    padding-left: 2em;
  }
  #top .nav li.parent > a:after {
    left: .8751em;
  }
  #top .nav li ul li.parent a:after {
    left: .8751em;
  }
  #navigation .nav li ul li.parent a {
    padding-left: 0;
  }
  #navigation .nav li ul li.parent a:after {
    left: 0;
  }
  #navigation .nav li.parent > a {
    padding-left: 2em;
  }
  #navigation .nav li ul li.parent a {
    padding-left: 0;
  }
  #navigation .nav li ul li.parent a::before {
    content: "";
    display: block;
    position: absolute;
    border: 0.35em solid rgba(0, 0, 0, 0.1);
    border-color: transparent rgba(0, 0, 0, 0.1) transparent transparent;
    left: 0.8751em;
    top: 42%;
  }
  #navigation .nav li ul li.parent a::after {
    border-color: rgba(0, 0, 0, 0);
    border: none;
  }
  /* Cart dropdown */
  #navigation ul.cart > li > ul > li > div {
    left: 0;
  }
  #navigation ul.cart .total {
    text-align: left;
  }
  /* Search dropdown */
  #navigation ul.nav-search {
    float: left;
    clear: none;
  }
  body #navigation ul.nav-search > li > ul > li > div {
    left: 0;
    right: auto;
  }
  #navigation ul.nav-search li:hover ul > li > div {
    display: block;
  }
  #navigation ul.nav-search .widget_woo_search .searchform button.submit {
    left: 11px;
  }
  /* 4. GENERAL LAYOUT RELATED TWEAKS */
  /* Header */
  #logo {
    float: right;
  }
  .header-widget {
    float: left;
  }
  /* Columns & Containers */
  .col-left {
    float: right;
  }
  .col-right {
    float: left;
  }
  .magazine .block {
    float: right;
  }
  .magazine .block.last {
    float: left;
  }
  /* Sliders */
  #loopedSlider .content {
    right: 0px;
  }
  #loopedSlider .content h2 {
    float: right;
  }
  #loopedSlider .content p {
    float: right;
  }
  /* 	Widgets */
  #main .widget_woothemes_features .columns-1 .feature {
    text-align: right;
  }
  #main .widget_woothemes_features .columns-1 .feature img {
    float: right;
  }
  #main .widget_woothemes_features .columns-2 .feature {
    text-align: right;
  }
  #main .widget_woothemes_features .columns-2 .feature img {
    float: right;
  }
  #main .widget_woothemes_features .feature {
    float: right;
    margin-left: 5%;
  }
  #main .widget_woothemes_features .feature.last {
    margin-left: 0;
  }
  /* Footer */
  #footer-widgets .block {
    margin-left: 3.8%;
    float: right;
  }
  /* 210 / 940 */
  #footer-widgets.col-1 .block {
    margin-left: 0;
  }
  #footer-widgets.col-2 .footer-widget-2,
  #footer-widgets.col-3 .footer-widget-3,
  #footer-widgets.col-4 .footer-widget-4 {
    margin-left: 0;
  }
  /* Column Floating */
  .two-col-left #main-sidebar-container #main,
  .two-col-right #main-sidebar-container #sidebar,
  .three-col-left #main-sidebar-container,
  .three-col-left #main-sidebar-container #main,
  .three-col-middle #main-sidebar-container #main,
  .three-col-middle #sidebar-alt,
  .three-col-right #main-sidebar-container #sidebar,
  .three-col-right #sidebar-alt {
    float: right;
  }
  .two-col-left #main-sidebar-container #sidebar,
  .two-col-right #main-sidebar-container #main,
  .three-col-left #main-sidebar-container #sidebar,
  .three-col-left #sidebar-alt,
  .three-col-middle #main-sidebar-container,
  .three-col-middle #main-sidebar-container #sidebar,
  .three-col-right #main-sidebar-container,
  .three-col-right #main-sidebar-container #main {
    float: left;
  }
  /* Contact Page */
  .page-template-template-contact-php .location-twitter .col-left {
    float: right;
  }
  .page-template-template-contact-php .location-twitter .contact-social {
    float: right;
  }
  /* Subcribe & Connect */
  #main #connect .col-left {
    float: right;
  }
  #connect .col-right {
    float: left;
  }
  #connect .related-posts {
    border-right: 1px solid #e6e6e6;
    padding-right: 15px;
  }
  /* Boxed Layout */
  .boxed-layout #header,
  .boxed-layout #content,
  .boxed-layout #footer-widgets,
  .boxed-layout #footer {
    padding-right: 2.5em;
    padding-left: 2.5em;
  }
}
