/*********************************
 METRONIC ROUNDED STYLE COMPONENTS 
*********************************/
/* Cubic Bezier Transition */
/***
General reset
***/
/* Set default body */
body {
  color: #333333;
  font-family: "Open Sans", sans-serif;
  padding: 0px !important;
  margin: 0px !important;
  direction: "ltr";
  font-size: 14px; }

/*
 Internet Explorer 10 doesn't differentiate device width from viewport width, and thus doesn't 
 properly apply the media queries in Bootstrap's CSS. To address this, 
 you can optionally include the following CSS and JavaScript to work around this problem until Microsoft issues a fix.
*/
@-webkit-viewport {
  width: device-width; }

@-moz-viewport {
  width: device-width; }

@-ms-viewport {
  width: device-width; }

@-o-viewport {
  width: device-width; }

@viewport {
  width: device-width; }

/*
 Internet Explorer 10 doesn't differentiate device width from viewport width, 
 and thus doesn't properly apply the media queries in Bootstrap's CSS. To address this, following CSS code applied 
*/
@-ms-viewport {
  width: auto !important; }

.form-group.form-md-line-input {
  position: relative;
  margin: 0 0 35px 0;
  padding-top: 20px; }
    .form-group.form-md-line-input .form-control.edited:not([readonly]):not(:focus) ~ .help-block {
      opacity: 0 ;
      filter: alpha(opacity=0) ; }

.md-checkbox {
  position: relative;
  /* handling click events */
  /* when checkbox is checked */ }
  .md-checkbox input[type=checkbox] {
    visibility: hidden;
    position: absolute; }
  .md-checkbox label {
    cursor: pointer;
    padding-left: 30px; }
  .md-checkbox label > span {
    display: block;
    position: absolute;
    left: 0;
    -webkit-transition-duration: 0.3s;
    -moz-transition-duration: 0.3s;
    transition-duration: 0.3s; }
  .md-checkbox label > .box {
    top: 0px;
    border: 2px solid #666;
    height: 20px;
    width: 20px;
    z-index: 5;
    -webkit-transition-delay: 0.2s;
    -moz-transition-delay: 0.2s;
    transition-delay: 0.2s; }
  .md-checkbox label > .check {
    top: -4px;
    left: 6px;
    width: 10px;
    height: 20px;
    border: 2px solid #36c6d3;
    border-top: none;
    border-left: none;
    opacity: 0;
    z-index: 5;
    -webkit-transform: rotate(180deg);
    -moz-transform: rotate(180deg);
    transform: rotate(180deg);
    -webkit-transition-delay: 0.3s;
    -moz-transition-delay: 0.3s;
    transition-delay: 0.3s; }
  .md-checkbox input[type=checkbox]:checked ~ label > .box {
    opacity: 0;
    -webkit-transform: scale(0) rotate(-180deg);
    -moz-transform: scale(0) rotate(-180deg);
    transform: scale(0) rotate(-180deg); }
  .md-checkbox input[type=checkbox]:checked ~ label > .check {
    opacity: 1;
    -webkit-transform: scale(1) rotate(45deg);
    -moz-transform: scale(1) rotate(45deg);
    transform: scale(1) rotate(45deg); }
  .md-checkbox input[type=checkbox]:disabled ~ label {
    cursor: not-allowed;
    opacity: 0.7 ;
    filter: alpha(opacity=70) ; }
  .md-checkbox input[type=checkbox]:disabled ~ label > .box {
    cursor: not-allowed;
    opacity: 0.7 ;
    filter: alpha(opacity=70) ; }
  .md-checkbox input[type=checkbox]:disabled:checked ~ label > .check {
    cursor: not-allowed;
    opacity: 0.7 ;
    filter: alpha(opacity=70) ; }

.has-error.md-checkbox label {
  color: #e73d4a; }

.has-error.md-checkbox label > .box {
  border-color: #e73d4a; }

.has-error.md-checkbox label > .check {
  border-color: #e73d4a; }

.has-info.md-checkbox label {
  color: #327ad5; }

.has-info.md-checkbox label > .box {
  border-color: #327ad5; }

.has-info.md-checkbox label > .check {
  border-color: #327ad5; }

.md-checkbox-inline {
  margin: 5px 0 5px 0; }
  .md-checkbox-inline .md-checkbox {
    display: inline-block;
    margin-right: 20px; }
    .md-checkbox-inline .md-checkbox:last-child {
      margin-right: 0; }

/* bubble animation */

.md-radio {
  position: relative;
  /* handling click events */
  /* when radio is checked */ }
  .md-radio input[type=radio] {
    visibility: hidden;
    position: absolute; }
  .md-radio label {
    cursor: pointer;
    padding-left: 30px; }
  .md-radio label > span {
    display: block;
    position: absolute;
    left: 0;
    -webkit-transition-duration: 0.3s;
    -moz-transition-duration: 0.3s;
    transition-duration: 0.3s; }
  .md-radio label > span.inc {
    background: #fff;
    left: -20px;
    top: -20px;
    height: 60px;
    width: 60px;
    opacity: 0;
    border-radius: 50% !important;
    -moz-border-radius: 50% !important;
    -webkit-border-radius: 50% !important; }
  .md-radio label > .box {
    top: 0px;
    border: 2px solid #666;
    height: 20px;
    width: 20px;
    border-radius: 50% !important;
    -moz-border-radius: 50% !important;
    -webkit-border-radius: 50% !important;
    z-index: 5; }
  .md-radio label > .check {
    top: 5px;
    left: 5px;
    width: 10px;
    height: 10px;
    background: #36c6d3;
    opacity: 0;
    z-index: 6;
    border-radius: 50% !important;
    -moz-border-radius: 50% !important;
    -webkit-border-radius: 50% !important;
    -webkit-transform: scale(0);
    -moz-transform: scale(0);
    transform: scale(0); }
  .md-radio label > span.inc {
    -webkit-animation: growCircleRadio 0.3s ease;
    -moz-animation: growCircleRadio 0.3s ease;
    animation: growCircleRadio 0.3s ease; }
  .md-radio input[type=radio]:checked ~ label > .check {
    opacity: 1;
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    transform: scale(1); }
  .md-radio input[type=radio]:disabled ~ label {
    cursor: not-allowed;
    opacity: 0.7 ;
    filter: alpha(opacity=70) ; }
  .md-radio input[type=radio]:disabled ~ label > .box {
    cursor: not-allowed;
    opacity: 0.7 ;
    filter: alpha(opacity=70) ; }
  .md-radio input[type=radio]:disabled:checked ~ label > .check {
    cursor: not-allowed;
    opacity: 0.7 ;
    filter: alpha(opacity=70) ; }

.has-error.md-radio label {
  color: #e73d4a; }

.has-error.md-radio label > .box {
  border-color: #e73d4a; }

.has-error.md-radio label > .check {
  background: #e73d4a; }

.has-info.md-radio label {
  color: #327ad5; }

.has-info.md-radio label > .box {
  border-color: #327ad5; }

.has-info.md-radio label > .check {
  background: #327ad5; }

.md-radio-inline {
  margin: 5px 0 5px 0; }
  .md-radio-inline .md-radio {
    display: inline-block;
    margin-right: 20px; }
    .md-radio-inline .md-radio:last-child {
      margin-right: 0; }

/* bubble animation */
@-webkit-keyframes growCircleRadio {
  0%, 100% {
    -webkit-transform: scale(0);
    opacity: 1; }
  70% {
    background: #eee;
    -webkit-transform: scale(1.25); } }

@-moz-keyframes growCircleRadio {
  0%, 100% {
    -moz-transform: scale(0);
    opacity: 1; }
  70% {
    background: #eee;
    -moz-transform: scale(1.25); } }

@keyframes growCircleRadio {
  0%, 100% {
    transform: scale(0);
    opacity: 1; }
  70% {
    background: #eee;
    transform: scale(1.25); } }

/***
General typography
***/
/* Links */
a:hover {
  cursor: pointer; }

/* Primary Link */

p {
  margin: 20px 0; }

label {
  font-weight: normal; }

/* Headings */
h3,
h4 {
  font-family: "Open Sans", sans-serif;
  font-weight: 300; }

h3 {
  font-size: 24px; }

h4 {
  font-size: 18px; }

/* Headings helper text */
h3 small,
h4 small {
  color: #444444; }

/* Block headings */

/* Links */
a {
  text-shadow: none;
  color: #337ab7; }
  a:hover {
    color: #23527c; }
  a:focus, a:hover, a:active {
    outline: 0; }

/* Horizontal break */

/* Unstyled List */

/* Code */

/* Disabled Navigation Link */



/* General utilities */

.bold {
  font-weight: 700 !important; }

.uppercase {
  text-transform: uppercase !important; }

/* Margin and padding utilities */

/* IE8 & IE9 mode utilities */

/***
Responsive Utils
***/

@media (max-width: 480px) {
  .hidden-480 {
    display: none; } }

/***
Demo Utils
***/

/***
Users
***/

/***
Custom vertical inline menu
***/

/***
Separated List
***/

/***
Number & Chart Stats
***/

/***
General User Record Listing
***/

/***
File dropzone
***/

/***
Fontawesome Icons
***/
[class^="icon-"],
[class*=" fa-"]:not(.fa-stack) {
  display: inline-block;
  *margin-right: .3em;
  line-height: 14px;
  -webkit-font-smoothing: antialiased; }

/* Make font awesome icons fixed width */
li [class^="icon-"],
li [class*=" fa-"] {
  display: inline-block;
  width: 1.25em;
  text-align: center; }

li [class^="icon-"] {
  top: 1px;
  position: relative; }

/* Icon states */

/***
Font Awesome 4.x Demo
***/

/***
Simple Line Icons Demo
***/

/*** 
Glyphicons Demo
***/

/***
Customized Bootstrap Alerts
***/

/***
Custom Bootstrap Badges
***/

/* Badge variants */

/* Fix badge position for navs */

/***
Dropdown Menu Badges
***/

/***
Custom buttons based on bootstrap SASS
***/
.btn {
  outline: none !important;
  box-shadow: none !important; }
  .btn:hover {
    transition: all 0.3s; }

.btn:not(.btn-sm):not(.btn-lg) {
  line-height: 1.44; }

/***
Custom color buttons 
***/

.btn.blue:not(.btn-outline) {
  color: #FFFFFF;
  background-color: #3598dc;
  border-color: #3598dc; }
  .btn.blue:not(.btn-outline):focus {
    color: #FFFFFF;
    background-color: #217ebd;
    border-color: #15527c; }
  .btn.blue:not(.btn-outline):hover {
    color: #FFFFFF;
    background-color: #217ebd;
    border-color: #1f78b5; }
  .btn.blue:not(.btn-outline):active {
    color: #FFFFFF;
    background-color: #217ebd;
    border-color: #1f78b5; }
    .btn.blue:not(.btn-outline):active:hover, .btn.blue:not(.btn-outline):active:focus {
      color: #FFFFFF;
      background-color: #1c699f;
      border-color: #15527c; }
  .btn.blue:not(.btn-outline):active {
    background-image: none; }

.btn.green:not(.btn-outline) {
  color: #FFFFFF;
  background-color: #32c5d2;
  border-color: #32c5d2; }
  .btn.green:not(.btn-outline):focus {
    color: #FFFFFF;
    background-color: #26a1ab;
    border-color: #18666d; }
  .btn.green:not(.btn-outline):hover {
    color: #FFFFFF;
    background-color: #26a1ab;
    border-color: #2499a3; }
  .btn.green:not(.btn-outline):active {
    color: #FFFFFF;
    background-color: #26a1ab;
    border-color: #2499a3; }
    .btn.green:not(.btn-outline):active:hover, .btn.green:not(.btn-outline):active:focus {
      color: #FFFFFF;
      background-color: #1f858e;
      border-color: #18666d; }
  .btn.green:not(.btn-outline):active {
    background-image: none; }

/* Circle Buttons */
.btn-circle {
  border-radius: 25px !important;
  overflow: hidden; }

.btn-icon-only {
  height: 34px;
  width: 34px;
  text-align: center;
  padding-left: 0;
  padding-right: 0; }
  .btn-icon-only > [class^="icon-"],
  .btn-icon-only > i {
    text-align: center;
    margin-top: 2px; }

/***
Image Carousel
***/

/***
Charts and statistics
***/

/***
Statistic lists
***/

/***
Chart tooltips
***/

/***
Mini chart containers
***/

/***
Chats
***/

/***
Customized Bootstrap Close Icon 
***/

/***
Customized Bootstrap Dropdowns
***/
/***
Dropdowns
***/

/***
Dropdown Menu
***/
/*rtl:ignore*/
.dropdown-menu {
  box-shadow: 5px 5px rgba(102, 102, 102, 0.1); }

.dropdown-menu {
  left: 0/*rtl:auto*/;
  min-width: 175px;
  position: absolute;
  z-index: 1000;
  display: none;
  float: left;
  list-style: none;
  text-shadow: none;
  padding: 0px;
  background-color: #ffffff;
  margin: 10px  0px 0px 0px;
  border: 1px solid #eee;
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  -ms-border-radius: 4px;
  -o-border-radius: 4px;
  border-radius: 4px; }
  .dropdown-menu li.header {
    padding: 8px 14px 2px 14px; }
  .dropdown-menu > li > a {
    padding: 8px 16px;
    color: #6f6f6f;
    text-decoration: none;
    display: block;
    clear: both;
    font-weight: 300;
    line-height: 18px;
    white-space: nowrap; }
  .dropdown-menu > li:hover > a {
    text-decoration: none;
    background-image: none;
    background-color: #f6f6f6;
    color: #555;
    filter: none; }
  .dropdown-menu > li:last-child:hover > a {
    border-radius: 0px 0px 4px 4px; }

.dropdown > .dropdown-menu {
  margin-top: 10px; }
  .dropdown > .dropdown-menu:before {
    position: absolute;
    top: -8px;
    left: 9px;
    right: auto;
    display: inline-block !important;
    border-right: 8px solid transparent;
    border-bottom: 8px solid #e0e0e0;
    border-left: 8px solid transparent;
    content: ''; }
  .dropdown > .dropdown-menu:after {
    position: absolute;
    top: -7px;
    left: 10px;
    right: auto;
    display: inline-block !important;
    border-right: 7px solid transparent;
    border-bottom: 7px solid #fff;
    border-left: 7px solid transparent;
    content: ''; }

.dropdown-toggle:after {
  display: none; }

/* Dropdown submenu support for Bootsrap 3 */

@media (max-width: 767px) {
  /* 767px */ }

/***
Dropdown Checkboxes
***/

/*--------------------------------------------------
    [Dropdown Menu v2]
----------------------------------------------------*/

/***
System feeds
***/

/***
Form Layouts
****/
/* Static info */

/* Help blocks */
.help-block {
  margin-top: 5px;
  margin-bottom: 5px; }

/* Control Label */
.control-label {
  margin-top: 1px;
  font-weight: normal; }

.form {
  padding: 0 !important; }

.form .form-body {
  padding: 20px; }
  .portlet.light
  .form .form-body {
    padding-left: 0;
    padding-right: 0; }

.form .form-actions {
  padding: 20px 20px;	
  margin: 0;
  background-color: #f5f5f5;
  border-top: 1px solid #e7ecf1;
  *zoom: 1; }
  .portlet.light
  .form .form-actions {
    background: none;
    padding-left: 0;
    padding-right: 0; }
  .portlet
  .form .form-actions {
    -webkit-border-radius: 0 0 4px 4px;
    -moz-border-radius: 0 0 4px 4px;
    -ms-border-radius: 0 0 4px 4px;
    -o-border-radius: 0 0 4px 4px;
    border-radius: 0 0 4px 4px; }
  .form .form-actions:before, .form .form-actions:after {
    content: " ";
    display: table; }
  .form .form-actions:after {
    clear: both; }
  .form .form-actions.right {
    padding-left: 0;
    padding-right: 20px;
    text-align: right; }
    .portlet.light
    .form .form-actions.right {
      padding-right: 0; }
  @media (max-width: 767px) {
    .form .form-actions {
      /* 767px */ } }

/* Checkboxes */

/* Radio buttons */

/* Radio buttons in horizontal forms */

/* Rows seperated form layout */

/* Form bordered */

/* Horizontal bordered form */

/* Horizontal form small input issue */

/***
Form Repeater
****/

/***
Forms
***/
.form-control {
  outline: none !important;
  box-shadow: none !important; }

/***
Custom color buttons 
***/

/* Form uneditable input */

/* Form input sizing */

@media (max-width: 768px) {
  /* 768px */ }

@media (max-width: 768px) {
  /* 768px */ }

/* Circle Inputs */

/***
Custom icon buttons
***/

/***
Input icons
***/

/***
Customized Bootstrap Labels
***/
.label {
  text-shadow: none !important;
  font-size: 14px;
  font-weight: 300;
  padding: 3px 6px 3px 6px;
  color: #fff;
  font-family: "Open Sans", sans-serif; }

/* Labels variants */

.label-success {
  background-color: #36c6d3; }

.label-warning {
  background-color: #F1C40F; }

.label-danger {
  background-color: #ed6b75; }

/***
Iconic labels
***/

/***
Text states
***/

.text-success {
  color: #36c6d3; }

/***
Customized List Group
***/
/* Contextual variants */

/***
UI Loading
***/

/***
Metro icons
***/

/* large icons */

/* default icons */

/* white icon */

/*  Misc */

/***
Customized Bootstrap Modal 
***/

/* Full width modal */

/***
Notes
***/
.note {
  margin: 0 0 20px 0;
  padding: 15px 30px 15px 15px;
  border-left: 5px solid #eee;
  -webkit-border-radius: 0 4px 4px 0;
  -moz-border-radius: 0 4px 4px 0;
  -ms-border-radius: 0 4px 4px 0;
  -o-border-radius: 0 4px 4px 0;
  border-radius: 0 4px 4px 0; }
  .note.note-info {
    background-color: #f5f8fd;
    border-color: #8bb4e7;
    color: #010407; }

/***
Customized Bootstrap Pagination
***/

/***
Customized Bootstrap Panels
***/

/***
Accordions
***/

/***
Customized Bootstrap Popover
***/
/*rtl:ignore*/

/***
Portlets
***/
/* Full Screen portlet mode */

/* Basic portlet */
.portlet {
  margin-top: 0px;
  margin-bottom: 25px;
  padding: 0px;
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  -ms-border-radius: 4px;
  -o-border-radius: 4px;
  border-radius: 4px; }
  .portlet > .portlet-title {
    border-bottom: 1px solid #eee;
    padding: 0;
    margin-bottom: 10px;
    min-height: 41px;
    -webkit-border-radius: 4px 4px 0 0;
    -moz-border-radius: 4px 4px 0 0;
    -ms-border-radius: 4px 4px 0 0;
    -o-border-radius: 4px 4px 0 0;
    border-radius: 4px 4px 0 0; }
    .portlet > .portlet-title:before, .portlet > .portlet-title:after {
      content: " ";
      display: table; }
    .portlet > .portlet-title:after {
      clear: both; }
    .portlet > .portlet-title > .caption {
      float: right;
      display: inline-block;
      font-size: 18px;
      line-height: 18px;
      padding: 10px 0; }
      .portlet > .portlet-title > .caption > i {
        float: left;
        margin-top: 4px;
        display: inline-block;
        font-size: 13px;
        margin-right: 5px;
        color: #666; }
      .portlet > .portlet-title > .caption > .caption-helper {
        padding: 0;
        margin: 0;
        line-height: 13px;
        color: #9eacb4;
        font-size: 13px;
        font-weight: 400; }
    .portlet > .portlet-title > .actions {
      float: left;
      display: inline-block;
      padding: 6px 0; }
      .portlet > .portlet-title > .actions > .btn {
        padding: 4px 10px;
        font-size: 13px;
        line-height: 1.5; }
        .portlet > .portlet-title > .actions > .btn.btn-default {
          padding: 3px 9px; }
        .portlet > .portlet-title > .actions > .btn > i {
          font-size: 13px; }
      .portlet > .portlet-title > .actions .btn-icon-only {
        padding: 5px 7px 3px 7px; }
        .portlet > .portlet-title > .actions .btn-icon-only.btn-default {
          padding: 4px 6px 2px 6px; }
          .portlet > .portlet-title > .actions .btn-icon-only.btn-default > i {
            font-size: 14px; }
          .portlet > .portlet-title > .actions .btn-icon-only.btn-default.fullscreen {
            font-family: FontAwesome;
            color: #a0a0a0;
            padding-top: 3px; }
            .portlet > .portlet-title > .actions .btn-icon-only.btn-default.fullscreen:before {
              content: "\f065"; }
    .portlet > .portlet-title > .tools {
      float: right;
      display: inline-block;
      padding: 12px 0 8px 0; }
  .portlet > .portlet-body {
    clear: both;
    -webkit-border-radius: 0 0 4px 4px;
    -moz-border-radius: 0 0 4px 4px;
    -ms-border-radius: 0 0 4px 4px;
    -o-border-radius: 0 0 4px 4px;
    border-radius: 0 0 4px 4px; }

/* Portlet background colors */
/* Side bordered portlet */
.portlet.bordered {
  border-left: 2px solid #e6e9ec !important; }
  .portlet.bordered > .portlet-title {
    border-bottom: 0; }

/* Solid colored portlet */

/* Solid bordered portlet */

/* Box portlet */
.portlet.box {
  padding: 0px !important; }

/* Light Portlet */
.portlet.light {
  padding: 12px 20px 15px 20px;
  background-color: #fff; }
  .portlet.light.bordered {
    border: 1px solid #e7ecf1 !important; }
    .portlet.light.bordered > .portlet-title {
      border-bottom: 1px solid #eef1f5; }
  .portlet.light > .portlet-title {
    padding: 0;
    min-height: 48px; }
    .portlet.light > .portlet-title > .caption {
      color: #666;
      padding: 10px 0; }
      .portlet.light > .portlet-title > .caption > .caption-subject {
        font-size: 16px; }
      .portlet.light > .portlet-title > .caption > i {
        color: #777;
        font-size: 15px;
        font-weight: 300;
        margin-top: 3px; }
    .portlet.light > .portlet-title > .actions {
      padding: 6px 0 14px 0; }
      .portlet.light > .portlet-title > .actions .btn-default {
        color: #666; }
      .portlet.light > .portlet-title > .actions .btn-icon-only {
        height: 27px;
        width: 27px; }
    .portlet.light > .portlet-title > .tools {
      padding: 10px 0 13px 0;
      margin-top: 2px; }
  .portlet.light .portlet-body {
    padding-top: 8px; }
  .portlet.light.portlet-fit {
    padding: 0; }
    .portlet.light.portlet-fit > .portlet-title {
      padding: 15px 20px 10px 20px; }
    .portlet.light.portlet-fit > .portlet-body {
      padding: 10px 20px 20px 20px; }

/* Reverse aligned tabs */

/* jQuery UI Draggable Portlets */

@media (max-width: 991px) {
  /* 991px */ }

/***
Custom colored portlets 
***/
.portlet > .portlet-body.white {
  background-color: #ffffff; }

/***
Customized Progress Bars
***/
.progress {
  border: 0;
  background-image: none;
  filter: none;
  box-shadow: none;
  -webkit-box-shadow: none;
  -moz-box-shadow: none;
  box-shadow: none; }

/* Custom colors */

/***
Dashboard Stats
***/

/***
Dashboard Stats 2
***/

/***
Text Stats
***/

@media (max-width: 767px) {
  /* 767px */ }

/***
Social Icons
***/

/***
Inline Social Icons
***/

/***
Scrollable Tables
***/

/***
Customized Bootstrap Tables
***/
.table td,
.table th {
  font-size: 14px; }

/***
Responsive Flip Scroll Tables
***/

@media only screen and (max-width: 768px) {
  /* 768px */
  /* sort out borders */ }

/***
Custom tables
***/

.table .btn {
  margin-top: 0px;
  margin-left: 0px;
  margin-right: 5px; }

.table thead tr th {
  font-size: 14px;
  font-weight: 600; }

@media (max-width: 767px) {
  /* 767px */ }

/***
Light Table
***/

.table-hover > tbody > tr:hover,
.table-hover > tbody > tr:hover > td {
  background: #f3f4f6 !important; }

/***
Customized Bootstrap Tabs 
***/
/* Tabs and pills */

/* Left and right tabs */

/* Left tabs */

/* Right tabs */

/* Below tabs */

/***
Custom tabs
***/
/* In BS3.0.0 tabbable class was removed. We had to added it back */

/***
Tiles(new in v1.1.1)
***/
.tiles {
  margin-right: -10px; }
  .tiles:before, .tiles:after {
    display: table;
    content: " "; }
  .tiles:after {
    clear: both; }
  .tiles .tile {
    display: block;
    letter-spacing: 0.02em;
    float: left;
    height: 110px;
    width: 110px !important;
    cursor: pointer;
    text-decoration: none;
    color: #ffffff;
    position: relative;
    font-weight: 300;
    font-size: 12px;
    letter-spacing: 0.02em;
    line-height: 20px;
    overflow: hidden;
    border: 4px solid transparent;
	border-radius:4px;
    margin: 0 10px 10px 0; }
    .tiles .tile:after, .tiles .tile:before {
      content: "";
      float: left; }
    .tiles .tile:hover {
      border-color: #aaa !important; }
    .tiles .tile:active {
      border-color: #ccc !important; }
    .tiles .tile .tile-body {
      height: 100%;
      vertical-align: top;
      padding: 10px 10px;
      overflow: hidden;
      position: relative;
      font-weight: 400;
      font-size: 12px;
      color: #000000;
      color: #ffffff;
      margin-bottom: 10px; }
      .tiles .tile .tile-body > i {
        margin-top: 17px;
        display: block;
        font-size: 56px;
        line-height: 56px;
        text-align: center; }
    .tiles .tile .tile-object {
      position: absolute;
      bottom: 0;
      left: 0;
      right: 0;
      min-height: 30px;
      background-color: transparent;
      *zoom: 1; }
      .tiles .tile .tile-object:before, .tiles .tile .tile-object:after {
        display: table;
        content: ""; }
      .tiles .tile .tile-object:after {
        clear: both; }
      .tiles .tile .tile-object > .name {
        position: absolute;
        bottom: 0;
        left: 0;
        margin-bottom: 5px;
        margin-left: 10px;
        margin-right: 15px;
        font-weight: 400;
        font-size: 13px;
        color: #ffffff; }
      .tiles .tile .tile-object > .number {
        position: absolute;
        bottom: 0;
        right: 0;
        margin-bottom: 0;
        color: #ffffff;
        text-align: center;
        font-weight: 600;
        font-size: 14px;
        letter-spacing: 0.01em;
        line-height: 14px;
        margin-bottom: 8px;
        margin-right: 10px; }

/***
Custimized Bootstrap Wells
***/

/*--------------------------------------------------
	[Widgets]
----------------------------------------------------*/
/*** Widget Background Colors ***/

/*** Widget Title Colors ***/

/*** Widget Carousel ***/

/*** Widget Gradient ***/

/*** Widget Gradient ***/

/*** Widget Tab ***/

/*** Widget News ***/

/*** Widget Thumb ***/

/*** Widget Socials ***/

/*** Widget Comments ***/

/*** Widget Media ***/

/*** Widget Blog ***/

/*** Widget Progress ***/

/*** Widget Gradient ***/

/* Widget Map for max-width 480px */
@media (max-width: 480px) {
  /* 480px */ }

/*** Widget Subscribe ***/

/* Widget Subscribe for media queries */
@media (max-width: 767px) {
  /* 767px */ }

@media (min-width: 768px) {
  /* 768px */ }

@media (min-width: 767px) and (max-width: 991px) {
  /* 767px & 991px */ }

/*--------------------------------------------------
    [Material Design]
----------------------------------------------------*/

/***
AngularJS Basic Animations
***/

@media (max-width: 991px) {
  /* 991px */ }

/***
Timeline 
***/

/***
Timeline 2
***/

@media (max-width: 991px) {
  /* 991px */ }

/***
Horizontal Timeline 
***/
/* PLUGIN CSS */

/* METRONIC EXTENDED CSS */

/***
Tasks Widget 
***/

@media (max-width: 767px) {
  /* 767px */ }

@media (max-width: 991px) {
  /* 991px */ }

/***
Custom color buttons 
***/

.bg-blue {
  background: #3598dc !important; }

.font-blue {
  color: #3598dc !important; }

.bg-green {
  background: #32c5d2 !important; }

.bg-red {
  background: #e7505a !important; }

/***
Color library demo
***/

@media (max-width: 767px) {
  /* 767px */ }