Front/src/theme/css/sky.less
@import (reference) "base.less";


html, body, #container, #container-content {
  .full;
}

div,span,h1,h2,h3,h4,h5,h6,a,p,button {
  font-family: @fonts ! important;
}

h1,h2,h3,h4,h5,h6,p,a {
  word-break: break-all;
}

button, a {
  cursor: pointer;
}

a {
  .no-margin;
  .text(@deco: none, @color: black, @style: normal);
}

p {
  .no-margin;
}

.icon-font {
  .icon-font-family;
}

.duration-main {
  .autoprefix-transition(all @duration-time ease-out);
}

.full {
  .size(@w: 100%, @h: 100%);
  .no-padding;
  .no-margin;
}

.full-width {
  .size(@w: 100%);
}

.text-center {
  .text(@align: center);
}

.tag-sp {
  span {
    .padding(@all: 2px 10px 2px 8px);
    .border(@rad: 3px 0 0 3px);
    .text(@color: white);
    .background(@color: @default-color);
  }

  a {
    .padding(@l: 6px, @r: 6px, @t: 1px, @b: 1px);
    .background(@color: #fafafa);
    .border(@t: 1px solid #dadada, @b: 1px solid #d2d2d2, @r: 1px solid #c5c5c5, @l: 1px solid #dadada);
    .box(@shadow: 0 1px 2px rgba(0, 0, 0, 0.05));

    &:hover {
      .background(@color: #fff);
    }
  }
}

#return-top{
  display: block;
  position: fixed;
  .position(@b: 10px);
  z-index: 10;

  a {
    .size(36px, 36px);
    .text(@size: 36px);
    .font-icon(before, return);
  }
}

#music-player {
  opacity: 0;
}

#music-player .hr{
  border: 1px solid #000;
}

#player1 {
  .autoprefix-transition(@t: ~'opacity @{duration-time} ease-out, background-color @{duration-time} ease-out');
}

@media (min-width: 960px) {
  body {
    font-size: @font-size;
  }

  #return-top {
    .position(@r: @menu-width + 10px);
  }

  #music-player .hr {
    display: none;
  }

  #player1{
    opacity: 0.6;
    position: fixed;
    .position(@t: 20px, @l: 10px);
    .size(@w: 23%);
    .max-size(@w: 270px);

    &:hover {
      opacity: 0.8;
    }
  }
}

@media (max-width: 960px) {
  body {
    font-size: @font-size-phone;
  }

  #return-top {
    .position(@r: 14px);
  }

  #music-player .hr {
    display: block;
  }

  #player1{
    opacity: 1;
    position: relative;
    .padding(@all: 5px 10%);
    .size(@w: 80%);
  }
}

@font-face {
  font-family: 'icomoon';
  src: url(../font/icomoon.woff?c8cymx) format('woff');
  font-weight: normal;
  font-style: normal;
}
