body {
    color: #666;
    background: #fff url("../img/white-bg2.jpg") no-repeat center center;
    background-size: cover;
}

@font-face{
    font-family: 'neighbourhoodregular';
    src: url('neighbourhood-webfont.woff2') format('woff2'),
         url('neighbourhood-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

input[type="checkbox"] {
    display: none;
}

.social-networks {
  position: fixed;
  top: 45px;
  right: 55px;
  color: #666;
}

.label {
  font-weight: normal;
  padding: 6px 6px;
  margin: 2px 5px;
}

.label.facebook {
  background: #4267b2;
}


.lets-start {
    position: absolute;
    top: -60px;
    left: -210px;
    display: block;
    width: 290px;
    height: 200px;
    color: #6c3648;
    font-size: 36px;
    background: url("../img/lets-start.png") no-repeat right bottom;
}

.lets-start h1 {
    padding: 0;
    margin: 0;
    font-size: 23px;
}

.lets-start p {
    font-size: 16px;
}

.logo {
    position: absolute;
    top: 158px;
    right: -7px;
    z-index: 2;
    color: #6c3648;
    font-size: 170px;
    line-height: 1;
    visibility: hidden;
    font-family: 'neighbourhoodregular';
    letter-spacing: 20px;
}

.logo-holder {
    position: relative;
    width: 600px;
    height: 609px;
    margin: 150px auto 100px auto;
}

.logo-circle-corner {
    position: absolute;
    display: block;
    width: 20px;
    height: 20px;
    background: #d4d4d4;
    border-radius: 20px;
    cursor: pointer;
    visibility: hidden;
}

.logo-circle-corner:after {
    color: #666;
}

.logo-circle-corner.id1 {
    top: 103px;
    left: 95px;
    width: 30px;
    height: 30px;
    visibility: visible;
}

.logo-circle-corner.id1:after {
    position: absolute;
    top: 20px;
    left: 30px;
    content: "creativity";
}

.logo-circle-corner.id2 {
    top: 150px;
    left: 320px;
}

.logo-circle-corner.id2:after {
    position: absolute;
    top: 72px;
    left: -48px;
    color: #6c3648;
    content: "advertising";
    font-size: 24px;
    font-weight: normal;
    transform: rotate(-90deg);
}

.logo-circle-corner.id3 {
    top: 400px;
    left: 0;
}

.logo-circle-corner.id3:after {
    position: absolute;
    top: 10px;
    left: 20px;
    content: "branding";
}

.logo-circle-corner.id4 {
    top: 250px;
    left: 100%;
}

.logo-circle-corner.id4:after {
    position: absolute;
    top: 10px;
    left: 20px;
    content: "graphic design";
    white-space: nowrap;
}


.logo-circle-corner.id5 {
    top: 420px;
    left: 300px;
}

.logo-circle-corner.id5:after {
    position: absolute;
    top: 10px;
    left: 20px;
    content: "production";
}


.logo-circle-corner.id6 {
    top: 600px;
    left: 200px;
}

.logo-circle-corner.id7 {
    top: 0;
    left: 400px;
}

.logo-circle-corner.id7:after {
    position: absolute;
    top: 10px;
    left: 20px;
    display: block;
    content: "brand consulting";
    white-space: nowrap;
}

.logo-circle-corner.id8 {
    top: 420px;
    left: 580px;
}

.logo-circle-corner.id9 {
    top: 560px;
    left: 478px;
}

.logo-circle-corner.id9:after {
    position: absolute;
    top: 10px;
    left: 20px;
    display: block;
    content: "offset printing";
    white-space: nowrap;
}

.logo-circle-corner.id10 {
    top: 510px;
    left: 203px;
}

.line {
    position: absolute;
    height: 2px;
    background: #d4d4d4;
    visibility: hidden;
}

.visible {
    visibility: visible!important;
}

.dline {
    position: absolute;
    height: 1px;
    background-image: repeating-linear-gradient(to right, #a1a1a1 0%, #a1a1a1 50%, transparent 50%, transparent 100%), repeating-linear-gradient(to right, #a1a1a1 0%, #a1a1a1 50%, transparent 50%, transparent 100%), repeating-linear-gradient(to bottom, #a1a1a1 0%, #a1a1a1 50%, transparent 50%, transparent 100%), repeating-linear-gradient(to bottom, #a1a1a1 0%, #a1a1a1 50%, transparent 50%, transparent 100%);
    background-repeat: repeat-x, repeat-x, repeat-y, repeat-y;
    background-position: left top, left bottom, left top, right top;
    background-size: 10px 1px, 10px 1px, 1px 10px, 1px 10px;
    visibility: hidden;
}

.line1 {
    top: 62px;
    left: 105px;
    width: 310px;
    transform: rotate(-19.5deg);
}

.line2 {
    top: 140px;
    left: 354px;
    width: 320px;
    transform: rotate(51deg);
}

.line3 {
    top: 260px;
    left: -100px;
    width: 320px;
    transform: rotate(-251deg);
}

.line4 {
    top: 510px;
    left: -35px;
    width: 290px;
    transform: rotate(-135deg);
}

.line5 {
    top: 138px;
    left: 110px;
    width: 215px;
    transform: rotate(11deg);
}

.line6 {
    top: 293px;
    left: 269px;
    width: 381px;
    transform: rotate(46deg);
}

.line7 {
    top: 342px;
    left: 82px;
    width: 376px;
    transform: rotate(-72deg);
}

.line8 {
    top: 563px;
    left: 169px;
    width: 85px;
    transform: rotate(90deg);
}

.line9 {
    top: 590px;
    left: 208px;
    width: 285px;
    transform: rotate(-9deg);
}

.line10 {
    top: 476px;
    left: 206px;
    width: 390px;
    transform: rotate(-13.3deg);
}

.line11 {
    top: 345px;
    left: 514px;
    width: 174px;
    transform: rotate(96deg);
}

.line12 {
    top: 499px;
    left: 456px;
    width: 170px;
    transform: rotate(126.7deg);
}

.line13 {
    top: 463px;
    left: -13px;
    width: 241px;
    transform: rotate(29deg);
}

.line14 {
    top: 81px;
    left: 281px;
    width: 180px;
    transform: rotate(-62deg);
}

.dline1 {
    top: 220px;
    left: 385px;
    width: 227px;
    transform: rotate(20deg);
}

.dline2 {
    top: 95px;
    left: 315px;
    width: 172px;
    transform: rotate(-84deg);
}

.dline3 {
    top: 81px;
    left: 281px;
    width: 180px;
    transform: rotate(-62deg);
}

.dline4 {
    top: 307px;
    left: 219px;
    width: 265px;
    transform: rotate(-72deg);
}

.dline5 {
    top: 415px;
    left: 385px;
    width: 329px;
    transform: rotate(-68.5deg);
}

.dline6 {
    top: 499px;
    left: 285px;
    width: 225px;
    transform: rotate(217deg);
}

.dline7 {
    top: 522px;
    left: 159px;
    width: 205px;
    transform: rotate(-61deg);
}

.dline8 {
    top: 220px;
    left: 121px;
    width: 275px;
    transform: rotate(-16deg);
}

.dline9 {
    top: 335px;
    left: -28px;
    width: 192px;
    transform: rotate(-52.1deg);
}

.dline10 {
    top: 192px;
    left: 53px;
    width: 133px;
    transform: rotate(83deg);
}

.dline11 {
    top: 344px;
    left: 96px;
    width: 244px;
    transform: rotate(223.5deg);
}

.logo-circle-corner.temporary_point {
    top: 250px;
    left: 117px;
    background: red;
}

.red {
    background: #6c3648;
}

.mr-15 {
    margin-right: 15px;
}

.buttons-position {
    text-align: center;
}

.btn-primary {
    background: #6c3648;
    border: 1px solid #6c3648;
}

.btn-diblock {
    display: inline-block;
}

.btn-xl {
    padding: 15px 50px;
    font-size: 16px;
}