@media screen and (min-width: 120px) and (max-width: 639px) /* Samsung Galaxy Note has device-width = 400 in portrait.  Most other phones are less.  For example, iPhone device-width = 320 */
{
    /*layout*/
    body
    {
        font-size: 13pt;
        -webkit-text-size-adjust: none;
    }
    img
    {
        width: 100%;
    }
    .header-links
    {
        width: 95%;
    }
    .main
    {
        width: 96%;
        max-width: 955px;
        margin: auto;
        padding: 2%;
    }
    .bg-1
    {
        height: 95px;
    }
    .bg-2
    {
    }
    .col
    {
        width: 100%;
    }
    h3
    {
        font-size: 12pt;
        margin: 0px 0px 5px 0px;
    }
    .content-padding-1
    {
        padding: 5px 5px 0px 5px; /* top right bottom left */
    }
    .time-stule-1
    {
        background-size: 30px 30px;
    }
    .time
    {
        height: 35px;
        margin-right: 8px;
        width: 35px;
    }
    .text-1, .text-3, .text-5
    {
        font-size: 14px;
        line-height: 2em;
        margin-top: -5px;
        padding-left: 0px;
    }
    .text-2, .text-4, .text-6
    {
        font-size: 12px;
        line-height: 2em;
        margin-top: -15px;
    }
    .main h2
    {
        background-size: 40%;
        margin: 18px 0 0 10px; /* top right bottom left */
        font-size: 12pt;
        height: 90px;
    }
    .main h2 span
    {
        margin: 30px 0 0;
    }
    #divSliderGalleria
    {
        width: 100%;
        height: 40%;
    }
    .footer
    {
        width: auto;
    }
    .footer-link
    {
        font-size: 7.5pt;
        line-height: 12px;
    }
    .footer-link select
    {
        clear: right;
        font-size: 8pt;
        width: 60px;
    }
    .footer-link a
    {
        float: left;
        margin-right: 10px;
    }
    .topmenus
    {
        width: 94%;
        margin: 0 0 0 10px;
    }
    .topmenus .more
    {
        display: block;
    }
    .menu.responsive
    {
        display: block;
        float: left;
        width: 83%;
    }
    .menu
    {
        height: 20px;
        display: none;
    }
    .menu li
    {
        padding: 0px 7px 0px 0px;
    }
    .menu li.item
    {
        padding-left: 0px;
    }
    .menu li a
    {
        font-size: 11pt;
        letter-spacing: -1px;
        margin-top: -2px;
    }
    .scrollup
    {
        width: 30px;
        height: 30px;
        background-size: 30px 30px;
    }
    /*calendar*/
    .previous-month
    {
        background-size: 15px 15px;
        margin: -10px 0 0 0px;
        padding: 5px 0 0 15px;
        font-size: 9pt;
        height: 20px;
    }
    .next-month
    {
        background-size: 15px 15px;
        margin: -10px 0px 0px 0px;
        padding: 5px 10px 0px 10px;
        font-size: 9pt;
        height: 20px;
    }
    .letter.aligncenter
    {
        clear: both;
        margin: 5px 0px 0px 0px;
        padding: 0px;
        white-space: nowrap;
    }
    .event
    {
        padding: 5px 0px 5px 5px; /* top right bottom left */
    }
    .event .eventdate
    {
        font-size: 11pt;
    }
    .event .description
    {
        width: auto;
    }
    .event .description .venueaddress
    {
        display: none;
    }
    .follow .action
    {
        float: none;
    }

  .event-details .picture {
    width: 100px;
  }

  .event-details .picture img
  {
    width: 100px;
  }


    /* This is used for the name of the Artist, Venue, etc on the detail pages*/
    .entity-name {
      font-size: 12pt;
      margin: 0px 0px 5px 0px;
    }

    /*artist*/
    .artist-details .biography img.profile
    {
        width: 100px;
    }
    .artist, .interview, .venue, .artist-details .biography, .box, .favoritedisk, .cd, .label, .video, .event .description, .news, .loginbox .login-normal
    {
        width: 92%;
    }
    .GridViewStyle
    {
        /* font-size:6pt; */
    }
}

@media screen and (min-width: 640px) and (max-width: 767px)
{
    body
    {
        font-size: 14pt;
        -webkit-text-size-adjust: none;
    }
    .main h2
    {
        font-size: 20px;
        margin: 10px 0px 0px 12%;
        background-size: 45%;
        height: 100px;
    }
    .menu
    {
        height: 30px;
    }
    .menu li
    {
        padding: 5px 12px 5px 0px; /* top right bottom left */
    }
    .menu li.item
    {
        padding-left: 0px;
    }
    .menu li a
    {
        font-size: 14pt;
        letter-spacing: -1px;
        margin-top: -2px;
    }
    .artist, .interview, .venue, .artist-details .biography, .box, .favoritedisk, .cd, .label, .video, .event .description, .news, .loginbox .login-normal
    {
        width: 96%;
    }
}
@media screen and (min-width: 768px) and (max-width: 959px) /* iPad device-width = 768 */
{
    body
    {
        font-size: 15pt;
        -webkit-text-size-adjust: none;
    }
    .main h2
    {
        font-size: 22px;
        margin: 10px 0px 0px 16%;
        background-size: 45%;
        height: 100px;
    }
    .menu
    {
        height: 32px;
    }
    .menu li
    {
        padding: 5px 20px 5px 0px; /* top right bottom left */
    }
    .menu li.item
    {
        padding-left: 0px;
    }
    .menu li a
    {
        font-size: 16pt;
        letter-spacing: -1px;
        margin-top: -2px;
    }
    .artist, .interview, .venue, .artist-details .biography, .box, .favoritedisk, .cd, .label, .video, .event .description, .news, .loginbox .login-normal
    {
        width: 96%;
    }
}