nucliweb
5/15/2014 - 6:29 PM

Generated by SassMeister.com.

Generated by SassMeister.com.

.border-radius {
  -webkit-border-raius: 5px;
  -moz-border-raius: 5px;
  -ms-border-raius: 5px;
  -o-border-raius: 5px;
  border-raius: 5px;
}

.icon-error, .icon-info {
  transition: background-color ease .2s;
  margin: 0 .5em;
}

.icon-error {
  color: red;
}

.icon-info {
  color: blue;
}

.content {
  width: 960px;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .content {
    width: 720px;
  }
}
@media only screen and (max-width: 767px) {
  .content {
    width: 90%;
  }
}

#sidebar {
  float: left;
  width: 300px;
}
@media only screen and (max-width: 479px) {
  #sidebar {
    float: none;
  }
}
@media only screen and (min-width: 480px) and (max-width: 767px) {
  #sidebar {
    float: none;
  }
}
@media only screen and (min-width: 768px) and (max-width: 959px) {
  #sidebar {
    width: 240px;
  }
}

/**
 * cross multiplication percentages
 */
/**
 * Turn numbers with units into unitless numbers
 */
// ----
// Sass (v3.3.7)
// Compass (v1.0.0.alpha.18)
// ----

// Mixin @each vendor
@mixin vendor($prop, $args) {
  @each $vendor in webkit, moz, ms, o {
    -#{$vendor}-#{$prop}: $args;
  }
  #{$prop}: $args;
}

.border-radius {
  @include vendor(border-raius,5px);
}

//////////////////////////////////////////

%icon {
  transition: background-color ease .2s;
  margin: 0 .5em;
}

.icon-error {
  @extend %icon;
  color: red;
}

.icon-info {
  @extend %icon;
  color: blue;
}

//////////////////////////////////////////

@mixin media($type) {
  @if $type == tablet {
    @media only screen and (min-width:768px) and (max-width:991px) {
      @content;
    }
  }
  @else if $type == mobile {
    @media only screen and (max-width:767px) {
      @content;
    }
  }
}


.content {
  width: 960px;
  @include media(tablet) {
    width: 720px;
  }
  @include media(mobile) {
    width: 90%;
  }
}


//////////////////////////////////////////

@mixin respond-to($media) {
  @if $media == handhelds {
    @media only screen and (max-width: 479px) { @content; }
  }
  @else if $media == wide-handhelds {
    @media only screen and (min-width: 480px) and (max-width: 767px) { @content; }
  }
  @else if $media == tablets {
    @media only screen and (min-width: 768px) and (max-width: 959px) { @content; }
  }
}
 
#sidebar {
  float: left;
  width: 300px;
  @include respond-to(handhelds) { float: none; }
  @include respond-to(wide-handhelds) { float: none; }
  @include respond-to(tablets) { width: 240px; }
}

//////////////////////////////////////////

/**
 * cross multiplication percentages
 */
@function cross-multiplication( $value1, $value2 ) {
  @return ($value1 * $value2) / 100;
}



/**
 * Turn numbers with units into unitless numbers
 */
@function clear-units($value){
  @return ($value / ($value * 0 + 1));
}