body {
  background-color: #ffffff;
  color: #ffffff;
  font-family: Arial, Verdana, sans-serif;
  font-size: 14px;
  }

.contentstart {
  min-height: calc(100vh - 93px);
}

.content {
  min-height: calc(100vh - 20px);
}

td {
   text-align: center;
   }

.left {
    text-align: left;
    padding: 10px 50px;
   }

.right {
    text-align: right;
    padding: 0px 50px 10px 50px;
   }

.justify {
    text-align: justify;
    padding: 10px 50px;
    }

  .center {
   text-align: center;
  }

.tablecont {
   width:750px;
   }

.leftcont {
    text-align: left;
    padding: 30px 40px;
   }

.rightcont {
    text-align: right;
    padding: 30px 40px;
   }

.tdphotos {
   text-align: center;
   padding:0;
   margin: 0;
   }

.tracks {
  display: inline-block;
  text-align: left;
  color: #ffffff;
  font-family: Arial, Verdana, sans-serif;
  font-size: 14px;
  }

.tablemain {
   width: 1236px;
   padding: 0;
   border: 0;
   border-spacing: 20px 0px;
   margin: auto;
   }

  .tablestart {
   width: 100%;
   padding: 0;
   margin: 0;
   border: 0;
   border-spacing: 0;
   }

    .tabletop {
     width: 100%;
     height: 200px;
     padding: 0;
     margin: 0;
     border: 0;
     }

   .tablemenu {
     width: 200px;
     border-spacing: 0px;
     padding: 0;
     margin: 0;
     border: 0;
     }

   .tablephotos {
     text-align: justify;
     border-spacing: 0px;
     padding: 0;
     margin: auto;
     border: 0;
     }

.tablebottom {
   width: 1236px;
   padding: 0;
   border: 0;
   margin: auto;
   }

   .header{
    text-align: center;
    background: white;
    position: fixed;
    width: 100%;
    top: 0%;
    left: 0%;
    z-index: 100;
    }

   .social {
    text-align: right;
    }

   .menu {
    text-align: center;
    position: fixed;
    z-index: 100;
    width: 200px;
    }

   .empty {
    width: 365px;
    }

   .empty2 {
    width: 200px;
    }

   .main {
    width: 750px;
    padding: 0;
    }

     .poster {
      position: absolute;
      top: 50px;
      left: 22px;
      width: 75%;
      }

     .afisha {
      display: inline-block;
      width: 200px;
      height: 359px;
      background-image: url(poster.png);
      background-repeat: no-repeat;
      }

   .space { 
    padding: 25px 16px;
    background: #333333;
    border: 1px solid #3399ff;
    border-radius: 7px;
    }

.black {
   color: #000000;
   font-size: 18px;
   font-weight: bold;
   }

.lyrics {
   color: #ffffff;
   }

.phone {
  color: #339999;
  }

   .imgstart {
      display: inline-block;
      width: 960px;
      height: 500px;
      background-image: url(logo.gif);
      background-repeat: no-repeat;
      padding: 0px;
      }

     .imgnews {
      display: inline-block;
      width: 920px;
      height: 200px;
      background-image: url(top_news.png);
      background-repeat: no-repeat;
      padding: 0px;
      }

     .imgmusic {
      display: inline-block;
      width: 920px;
      height: 200px;
      background-image: url(top_music.png);
      background-repeat: no-repeat;
      padding: 0px;
      }

     .imgvideo {
      display: inline-block;
      width: 920px;
      height: 200px;
      background-image: url(top_videos.png);
      background-repeat: no-repeat;
      padding: 0px;
      }

     .imgphotos {
      display: inline-block;
      width: 920px;
      height: 200px;
      background-image: url(top_photos.png);
      background-repeat: no-repeat;
      padding: 0px;
      }

     .imgtour {
      display: inline-block;
      width: 920px;
      height: 200px;
      background-image: url(top_dates.png);
      background-repeat: no-repeat;
      padding: 0px;
      }

     .imgbio {
      display: inline-block;
      width: 920px;
      height: 200px;
      background-image: url(top_bio.png);
      background-repeat: no-repeat;
      padding: 0px;
      }

     .imgcont {
      display: inline-block;
      width: 920px;
      height: 200px;
      background-image: url(top_contacts.png);
      background-repeat: no-repeat;
      padding: 0px;
      }

a.btn1 {
    display: block;
    background: url(buttonss/btn1.png);
    width: 200px;
    height: 34px;
    margin: 0;
    padding: 0;
    border: 0;
    }

a.btn1:hover {
    background: url(buttonss/btn1o.png);
    }

a.btn1:active {
    background: url(buttonss/btn1a.png);
    }

a.btn2 {
    display: block;
    background: url(buttonss/btn2.png);
    width: 200px;
    height: 34px;
    margin: 0;
    padding: 0;
    border: 0;
    }

 a.btn2:hover {
    background: url(buttonss/btn2o.png);
    }

a.btn2:active {
    background: url(buttonss/btn2a.png);
    }

a.btn3 {
    display: block;
    background: url(buttonss/btn3.png);
    width: 200px;
    height: 34px;
    margin: 0;
    padding: 0;
    border: 0;
    }

 a.btn3:hover {
    background: url(buttonss/btn3o.png);
    }

a.btn3:active {
    background: url(buttonss/btn3a.png);
    }

 a.btn4 {
    display: block;
    background: url(buttonss/btn4.png);
    width: 200px;
    height: 34px;
    margin: 0;
    padding: 0;
    border: 0;
    }

a.btn4:hover {
    background: url(buttonss/btn4o.png);
    }

a.btn4:active {
    background: url(buttonss/btn4a.png);
    }

a.btn5 {
    display: block;
    background: url(buttonss/btn5.png);
    width: 200px;
    height: 34px;
    margin: 0;
    padding: 0;
    border: 0;
    }

a.btn5:hover {
    background: url(buttonss/btn5o.png);
    }

a.btn5:active {
    background: url(buttonss/btn5a.png);
    }

a.btn6 {
    display: block;
    background: url(buttonss/btn6.png);
    width: 200px;
    height: 34px;
    margin: 0;
    padding: 0;
    border: 0;
    }

a.btn6:hover {
    background: url(buttonss/btn6o.png);
    }

a.btn6:active {
    background: url(buttonss/btn6a.png);
    }

a.btn7 {
    display: block;
    background: url(buttonss/btn7.png);
    width: 200px;
    height: 34px;
    margin: 0;
    padding: 0;
    border: 0;
    }

a.btn7:hover {
    background: url(buttonss/btn7o.png);
    }

a.btn7:active {
    background: url(buttonss/btn7a.png);
    }

   .imgup {
      width: 200px;
      height: 24px;
      background-image: url(buttonss/up.png);
      background-repeat: no-repeat;
      padding: 0px;
      margin: 0px;
      border: 0;
      }

   .imgdown {
      width: 200px;
      height: 188px;
      background-image: url(buttonss/down.png);
      background-repeat: no-repeat;
      padding: 0px;
      margin: 0px;
      border: 0;
      }

   .css-fade {
      -moz-opacity: 1;
      -khtml-opacity: 1;
      opacity: 1;
      -ms-filter:"progid:DXImageTransform.Microsoft.Alpha"(Opacity=100);
      filter: progid:DXImageTransform.Microsoft.Alpha(opacity=100);
      filter:alpha(opacity=100);
      transition: opacity .30s ease-in-out;
      -moz-transition: opacity .30s ease-in-out;
      -webkit-transition: opacity .30s ease-in-out;
      }

     .css-fade:hover {
      -moz-opacity: 0.45;
      -khtml-opacity: 0.45;
      opacity: 0.45;
      -ms-filter:"progid:DXImageTransform.Microsoft.Alpha"(Opacity=45);
      filter: progid:DXImageTransform.Microsoft.Alpha(opacity=45);
      filter:alpha(opacity=45);
      }

    a.listen {
    display: inline-block;
    background: url(listen.png);
    background-repeat: no-repeat;
    width: 90px;
    height: 25px;
    margin: 0;
    padding: 0;
    border: 0;
    border-radius: 12px;
    box-shadow: 0 3px 10px rgba(0, 0, 0, 0.6);
    }

    a.listen:hover {
    box-shadow: 0 2px 3px rgba(0, 0, 0, 0.6);
    }

   .footer {
      display: inline-block;
      width: 600px;
      height: 53px;
      background-image: url(footer.png);
      background-repeat: no-repeat;
      text-align: center;
      font-size: small;
      color: #ffffff;
      }


a img {
    border: none;
    }

   .lightbox {
    position: fixed;
    overflow: hidden;
    z-index: 9999;
    width: 0;
    height: 0;
    text-align: center;
    top: 0;
    left: 0;
    background: rgba(0,0,0,0.8);
    }

   .lightbox img {
    max-width: 650px;
    max-height: 500px;
    position: absolute;
    margin: auto;
    left: 0;
    top: 0;
    bottom: 0;
    right: 0;
    opacity: 0;
    border: none;
    -moz-box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.8);
    -webkit-box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.8);
    box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.8);
    -webkit-transition: opacity 500ms ease-in;
    -moz-transition: opacity 500ms ease-in;
    transition: opacity 500ms ease-in;  
    }

   .lightbox:target {
    width: auto;
    height: auto;
    bottom: 0;
    right: 0;
    outline: none;
    }

   .lightbox:target img {
    opacity: 1;
    }

   .izo {
    width: 200px;
    background-color: transparent;
    box-shadow: 0 3px 10px rgba(0, 0, 0, 0.6);
    -webkit-transition: all 0.7s ease;
    -moz-transition: all 1s ease;
    -o-transition: all 0.7s ease;
    -ms-transition: all 0.7s ease;
    padding: 0px;
    }

   .izo img {width: 100%;  padding: 0px 0px;}

   .izo:hover {
    box-shadow: 0 2px 3px rgba(0, 0, 0, 0.6);
    -moz-opacity: 0.45;
    -khtml-opacity: 0.45;
    opacity: 0.45;
    -ms-filter:"progid:DXImageTransform.Microsoft.Alpha"(Opacity=45);
    filter: progid:DXImageTransform.Microsoft.Alpha(opacity=45);
    filter:alpha(opacity=45);
    cursor: pointer;
    }

   .izo:focus {
    pointer-events: none;
    -moz-opacity: 1;
    -khtml-opacity: 1;
    opacity: 1;
    -ms-filter:"progid:DXImageTransform.Microsoft.Alpha"(Opacity=100);
    filter: progid:DXImageTransform.Microsoft.Alpha(opacity=100);
    filter:alpha(opacity=100);
    -webkit-transform: rotate(-3deg) scale(2.4); 
    -moz-transform: rotate(-3deg) scale(2.4);
    -o-transform: rotate(-3deg) scale(2.4);
    -ms-transform: rotate(-3deg) scale(2.4);
    box-shadow: 0 2px 3px rgba(0, 0, 0, 0.6);
    position: relative;
    z-index: 999;
    }

  .izoh {
    background: #ffffcc;
    max-width: 130px;
    box-shadow: 0 3px 10px rgba(0, 0, 0, 0.6);
    -webkit-transform: rotate(5deg);
    -moz-transform: rotate(5deg);
    -o-transform: rotate(5deg);
    -ms-transform: rotate(5deg);
    -webkit-transition: all 0.7s ease;
    -moz-transition: all 1s ease;
    -o-transition: all 0.7s ease;
    -ms-transition: all 0.7s ease;
    text-indent: 0px;
    text-align: center;
    padding: 5px;
    }

   .izoh img {max-width: 130px; padding: 0px;}

   .izoh:hover {
    -webkit-transform: rotate(-1deg); 
    -moz-transform: rotate(1deg); 
    -o-transform: rotate(-1deg); 
    -ms-transform: rotate(1deg);
    box-shadow: 0 2px 3px rgba(0, 0, 0, 0.6);
    -moz-opacity: 0.45;
    -khtml-opacity: 0.45;
    opacity: 0.45;
    -ms-filter:"progid:DXImageTransform.Microsoft.Alpha"(Opacity=45);
    filter: progid:DXImageTransform.Microsoft.Alpha(opacity=45);
    filter:alpha(opacity=45);
    cursor: pointer;
    }

   .izoh:focus {
    pointer-events: none;
    -moz-opacity: 1;
    -khtml-opacity: 1;
    opacity: 1;
    -ms-filter:"progid:DXImageTransform.Microsoft.Alpha"(Opacity=100);
    filter: progid:DXImageTransform.Microsoft.Alpha(opacity=100);
    filter:alpha(opacity=100);
    -webkit-transform: rotate(-3deg) scale(4.4); 
    -moz-transform: rotate(-3deg) scale(4.4);
    -o-transform: rotate(-3deg) scale(4.4);
    -ms-transform: rotate(-3deg) scale(4.4);
    box-shadow: 0 2px 3px rgba(0, 0, 0, 0.6);
    position: relative;
    z-index: 999;
    }

   .izov {
    background: #ffffcc;
    max-width: 90px;
    box-shadow: 0 3px 10px rgba(0, 0, 0, 0.6);
    -webkit-transform: rotate(5deg);
    -moz-transform: rotate(5deg);
    -o-transform: rotate(5deg);
    -ms-transform: rotate(5deg);
    -webkit-transition: all 0.7s ease;
    -moz-transition: all 1s ease;
    -o-transition: all 0.7s ease;
    -ms-transition: all 0.7s ease;
    text-indent: 0px;
    text-align: center;
    padding: 5px;
    }

   .izov img {max-width: 90px; padding: 0px;}

   .izov:hover {
    -webkit-transform: rotate(-1deg); 
    -moz-transform: rotate(1deg); 
    -o-transform: rotate(-1deg); 
    -ms-transform: rotate(1deg);
    box-shadow: 0 2px 3px rgba(0, 0, 0, 0.6);
    -moz-opacity: 0.45;
    -khtml-opacity: 0.45;
    opacity: 0.45;
    -ms-filter:"progid:DXImageTransform.Microsoft.Alpha"(Opacity=45);
    filter: progid:DXImageTransform.Microsoft.Alpha(opacity=45);
    filter:alpha(opacity=45);
    cursor: pointer;
    }

   .izov:focus {
    pointer-events: none;
    -moz-opacity: 1;
    -khtml-opacity: 1;
    opacity: 1;
    -ms-filter:"progid:DXImageTransform.Microsoft.Alpha"(Opacity=100);
    filter: progid:DXImageTransform.Microsoft.Alpha(opacity=100);
    filter:alpha(opacity=100);
    -webkit-transform: rotate(-3deg) scale(3.3); 
    -moz-transform: rotate(-3deg) scale(3.3);
    -o-transform: rotate(-3deg) scale(3.3);
    -ms-transform: rotate(-3deg) scale(3.3);
    box-shadow: 0 2px 3px rgba(0, 0, 0, 0.6);
    position: relative;
    z-index: 999;
    }

   .fot {
   width: 200px;
   background: #ffffff;
   -webkit-transition: all 0.7s ease;
   -moz-transition: all 1s ease;
   -o-transition: all 0.7s ease;
   -ms-transition: all 0.7s ease;
   padding: 0px;
   }

   .fot img {width: 100%; padding: 0px;}

   .fot:hover {
   box-shadow: 0 2px 3px rgba(0, 0, 0, 0.6);
   -moz-opacity: 0.45;
   -khtml-opacity: 0.45;
   opacity: 0.45;
   -ms-filter:"progid:DXImageTransform.Microsoft.Alpha"(Opacity=45);
   filter: progid:DXImageTransform.Microsoft.Alpha(opacity=45);
   filter:alpha(opacity=45);
   cursor: pointer;
   }

   .fot:focus {
   pointer-events: none;
   -moz-opacity: 1;
   -khtml-opacity: 1;
   opacity: 1;
   -ms-filter:"progid:DXImageTransform.Microsoft.Alpha"(Opacity=100);
   filter: progid:DXImageTransform.Microsoft.Alpha(opacity=100);
   filter:alpha(opacity=100);
   -webkit-transform: rotate(-3deg) scale(2.4); 
   -moz-transform: rotate(-3deg) scale(2.4);
   -o-transform: rotate(-3deg) scale(2.4);
   -ms-transform: rotate(-3deg) scale(2.4);
   box-shadow: 0 2px 3px rgba(0, 0, 0, 0.6);
   position: relative;
   z-index: 999;
   }

figure {
  background: #ffffcc;
  border: 0px;
  border-radius: 0px;
  margin: 20px;
  }

button {
   background-color: transparent;
   border: 0px;
   border-radius: 0px;
   width: 200px;
   height: 200px;
   }

iframe {
   border:0;
   }

   .leftimg {
    float:left;
    margin: 7px 7px 7px 0;
    }

   .rightimg  {
    float: right;
    margin: 7px 0 7px 7px;
    }


/* Контейнер для кнопки */
.css-modal-target-container {
  text-align: left;
}
 
/* Контейнер, который затемняет страницу */
.css-modal-target {
    display: none;
}

.css-modal-target:target {
    display:flex;
    align-items:center;
    justify-content:center;    
    z-index: 9999;
    position: fixed;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.7);
}
 
/* Модальное окно */
.css-modal-target .cmt {
        padding: 15px;
        border: 5px solid #3399ff;
        width: 350px;
        height:500px;
    z-index: 9999;
    border-radius: 12px;
    background: #000;
    box-shadow: 0 4px 12px rgba(0,0,0,0.2), 0 16px 20px rgba(0,0,0,0.2);
    text-align: left;
    overflow: auto;
    animation: bg 0.5s ease;
    }
 
/* Кнопка с крестиком закрывающая окно */
.css-modal-close {
    position: relative;
    display: inline block;
}

.css-modal-close:after {
    content: "+";
    transform: rotate(45deg);
    color: #99FFFF;
    text-align: center;
    line-height: 30px;
    font-size: 50px;
    width: 30px;
    height: 30px;
    border: 5px solid #99FFFF;
    border-radius: 30px;
    position: fixed;
    z-index: 10;
    top: 20px;
    right: 20px;
    box-shadow: 0 4px 12px rgba(0,0,0,0.2), 0 16px 20px rgba(0,0,0,0.2);
    background-color: rgba(255, 255, 255, 0);
    animation: move 0.5s ease;
}

.css-modal-close:before {
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    position: fixed;
    content: "";
    cursor: default;
}

.css-modal-close:hover:after {
    background-color: rgba(255, 255, 255, 1);
}

/* Анимации */
@keyframes scale {
    0% {
        transform: scale(0);
    }
    100% {
        transform: scale(1);
    }
}
@keyframes move {
    0% {
        right: -80px;
    }
    100% {
        right: 20px;
    }
}
@keyframes bg {
    0% {
        background: rgba(0, 0, 0, 0);
    }
    100% {
        background: rgba(0, 0, 0, 0.7);
    }
}




      pre         {font-size: 14px; color: #ffffff; font-weight: normal; font-family: Arial, Verdana, sans-serif;}
      a:link    {font-size: 14px; color: #00ffcc; text-decoration: none; font-family: Arial, Verdana, sans-serif;}
      a:visited {font-size: 14px; color: #00ffcc; text-decoration: none; font-family: Arial, Verdana, sans-serif;}
      a:active  {font-size: 14px; color: #0099cc; text-decoration: underline; font-family: Arial, Verdana, sans-serif;}
      a:hover   {font-size: 14px; color: #0099cc; text-decoration: underline; font-family: Arial, Verdana, sans-serif;}

      p       {font-size: 14px; color: #ffffff; font-weight: normal; font-family: Arial, Verdana, sans-serif;}
      b        {font-size: 14px; color: #99FFFF; font-weight: bold; font-family: Arial, Verdana, sans-serif;}
      h1      {font-size: 25px; color: #333333; font-weight: bold; margin: 0; font-family: Arial, Verdana, sans-serif;}
      h2      {font-size: 16px; color: #99FFFF; font-weight: bold; font-family: Arial, Verdana, sans-serif;}
      h3      {font-size: 8px; color: #333333; font-weight: normal; font-style: italic;  line-height: 8px; margin: 0; font-family: Arial, Verdana, sans-serif;}

