/**
 * youbarcelona.com
 *
 * color base 1: 990000
 * color base 2: #B42F6A
 */


/*
 * Reset styles
 * Based on http://developer.yahoo.net/yui/license.txt
 */
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,input,button,textarea,p {
    margin: 0;
    padding: 0;
    text-align: left;
}
fieldset,img {
    border: 0;
}
address,caption,cite,code,em,strong,optgroup {
    font-style: inherit;
    font-weight: inherit;
}
li {
    list-style: none;
}
h1,h2,h3,h4,h5,h6 {
    font-size: 100%;
    font-weight: normal;
}
legend {
    color: #000;
}
input,button,textarea,select,optgroup,option {
    font-family: inherit;
    font-size: inherit;
    font-style: inherit;
    font-weight: inherit;
}
input,button,textarea,select {
    *font-size: 100%;
}
em {
    font-style: italic;
}
strong {
    font-weight: bold;
}
p {
    line-height: 18px;
    margin-bottom: 10px;
}

.rounded-3 {
    border-radius: 3px;
    -ms-border-radius: 3px;
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
    -khtml-border-radius: 3px;
}
.rounded-custom {
    border-radius: 10px;
    -ms-border-radius: 10px;
    -moz-border-radius: 10px;
    -webkit-border-radius: 10px;
    -khtml-border-radius: 10px;
}

.transparent {
    /* Required for IE 5, 6, 7 */
    /* ...or something to trigger hasLayout, like zoom: 1; */
    width: 100%;

    /* Theoretically for IE 8 & 9 (more valid) */
    /* ...but not required as filter works too */
    /* should come BEFORE filter */
    -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=90)";

    /* This works in IE 8 & 9 too */
    /* ... but also 5, 6, 7 */
    filter: alpha(opacity=90);

    /* Older than Firefox 0.9 */
    -moz-opacity:0.9;

    /* Safari 1.x (pre WebKit!) */
    -khtml-opacity: 0.9;

    /* Modern!
    /* Firefox 0.9+, Safari 2?, Chrome any?
    /* Opera 9+, IE 9+ */
    opacity: 0.9;
}

/**
 * Global tags
 */
html {
    height: 100%; /* fix height to 100% for IE */
    max-height: 100%; /* fix height for other browsers */
    background: url("/images/bg-body-small.jpg") repeat fixed center top #000;
    color: #ddd;
}
body {
    height: 100%; /* fix height to 100% for IE */
    max-height: 100%; /* fix height for other browsers */
    font: normal 14px/14px Arial, Verdana, Helvetica, Sans-Serif;
    line-height: 16px;
}
.wrapper {
    width: 950px;
    height: auto;
    margin: 0 auto;
    clear: both;
}
.clearfix {
    display: block;
    clear: both;
}

.clear {
    clear: both;
}

/**
 * HTML tags
**/
a {
    /* color: #990000; */
    color: #fff;
    text-decoration: underline;
}
a:hover {
    text-decoration: underline;
}

a.wine {
    color: #B42F6A;
}
a.wine:hover {
    text-decoration: underline;
}

a.email {
    background: url("/images/icons/icon_email.png") no-repeat scroll 0 -4px;
    padding-left: 20px;
}

/**
 * http://css3button.net/27689
**/
a.button, input.button {
    display:inline-block;
    text-align: center;
    text-decoration: none;
    line-height: 14px;
    font-size: 12px;
    margin: 5px;

    font-family: Arial, Helvetica, sans-serif;
    color: #ffffff;
    padding: 8px 13px;
    background: -moz-linear-gradient(
        top,
        #8f2255 0%,
        #0f0107 50%,
        #0f0107 50%,
        #7a1d47);
    background: -webkit-gradient(
        linear, left top, left bottom,
        from(#8f2255),
        color-stop(0.50, #0f0107),
        color-stop(0.50, #0f0107),
        to(#7a1d47));
    border-radius: 8px;
    -moz-border-radius: 8px;
    -webkit-border-radius: 8px;
    border: 1px solid #4a0a28;
    -moz-box-shadow:
        0px 1px 3px rgba(000,000,000,0.5),
        inset 0px 0px 2px rgba(150,150,150,1);
    -webkit-box-shadow:
        0px 1px 3px rgba(000,000,000,0.5),
        inset 0px 0px 2px rgba(150,150,150,1);
    text-shadow:
        0px -1px 0px rgba(0,0,0,0.2),
        0px 1px 0px rgba(255,255,255,0.4);
}
a.button:hover {
    color: #fff;
    cursor: pointer;
    -moz-box-shadow:
        0px 3px 3px rgba(000,000,000,0.5),
        inset 0px 0px 10px rgba(255,255,255,1);
    -webkit-box-shadow:
        0px 3px 3px rgba(000,000,000,0.5),
        inset 0px 0px 10px rgba(255,255,255,1);
}

.joinbutton {
 margin-left: 25px;
 margin-right: 25px;
 font-size: 18px;
}

a.button_alt {
    display:inline-block;
    font-size: 13px;
    line-height: 15px;
    font-weight: bold;

    padding: 5px 15px;
    text-align: center;

    border: 2px solid #e7c5dd;

    border-radius: 8px;
    -ms-border-radius: 8px;
    -moz-border-radius: 8px;
    -webkit-border-radius: 8px;
    -khtml-border-radius: 8px;

    /*background: -webkit-gradient(linear, left top, left bottom, from(#fff),(#ddd) );*/
    /* fallback (Opera) */
    background: #531039;
    /* Mozilla: */
    /* background: -moz-linear-gradient(top, #000, #b42f6a); */
    /* Chrome, Safari:*/
    /* background: -webkit-gradient(linear, left top, left bottom, from(#fff), to(#ddd)); */
    /* MSIE */
    /* filter: progid:DXImageTransform.Microsoft.Gradient(
                StartColorStr='#fff', EndColorStr='#ddd', GradientType=0);
    */
}

span.left-space {
    margin-left: 20px;
}


a.button_alt:hover {
    -webkit-box-shadow: 0 0 8px #b42f6a;
    -moz-box-shadow: 0 0 8px #b42f6a;
    box-shadow: 0 0 8px #b42f6a;
}


h1 {
    font-size:18px;
    line-height:20px;
    padding:10px;
    color: #B42F6A;
}

h1 a {
    color: #B42F6A;
}

h2 {
    font-size: 16px;
    line-height: 18px;
    padding: 10px 0;
    color: #B42F6A;
}

h2 a {
    color: #B42F6A;
}

span.separator {
    padding: 10px;
}
img.fromdb {
    border:2px solid #ccc;
}
img.small {
    border-width:2px;
}
img.floating, img.floating-0 {
    float: left;
    margin: 0 20px 20px 0;
}
img.floating-1 {
    display: block;
    margin: 0 auto;
    margin-bottom: 20px;
}
img.floating-2 {
    float: right;
    margin: 0 0 20px 20px;
}


p.spaced {
    margin: 10px 0;
    font-size: 13px;
}
p.under-construction, p.notification, div.notification {
    margin: 60px 0 20px 0;
    text-align: center;
    font-size: 14px;
    font-weight: bold;
}
div.notification {
    margin: 20px 0;
    font-weight: normal;
}

div.notification li {
    font-size: 13px;
    margin-left: 15px;
    padding: 5px 0;
    list-style-type: circle;
    list-style-position: inside;
}

p.notification, div.notification {
    background: #EEE;
    color: #333;
    padding: 20px;
    border:1px solid #ccc;
}

span.underline {
    text-decoration: underline;
}



/*
 * Header
 */
#header {
    position:relative;
}

/*
#header img {
    position:absolute;
    display: inline;
}
#header img.hide {
    display:none;
}
#header img.show {
    display: inline;
}
*/

#header-home {
    height: 75px;
    margin: 10px 0 10px 0;
}

#header-home .title {
    float:left;
    width:690px;
}

#header-home .title h1 {
    padding-top: 5px;
}

#header-home .date {
    padding-left: 10px;
    margin-top: 5px;
    font-size: 14px;
    font-weight: bold;
}

#header-home .info {
    float:left;
    width:255px;
    border:2px solid #666;
}


#social {
    padding-top:10px;
    height:25px;
    overflow:hidden;
}

#social .socialheader {
   float: left;
   width: 100px;
   margin-left:100px;
   background: url(/images/top_icons.png) no-repeat -200px 0;
}

#social span {
   display:none;
}

#social .socialheader a {
   float: left;
   display: block;
   height: 20px;
   margin-right: 5px;
}

#social .socialheader a.facebook_share   { width: 21px; }
#social .socialheader a.twitter_share    { width: 21px; }
#social .socialheader a.googleplus_share { width: 21px; }

#social .languages {
   position:absolute;
   top:10px;
   left: 650px;
   background: url(/images/top_icons.png) no-repeat -300px 0;
}

#social .languages a {
   float: left;
   display: block;
   height: 20px;
   width: 27px;
   margin-right: 5px;
}

#social .languages a.selected {
   background: rgba(0,0,0, 0.7);
}


#social .fb-login-button, #social .fb-logout-button {
    float: right;
}
#social .fb-logout-button {
    width: 89px;
}


/*
 * Main menu
 */
ul#menu {
    margin-top: 5px;
    border: 1px solid #000;
    height: 32px;
    /* background: url(/images/menu_base.gif) repeat-x 0 0; */
    background: url(/images/menu/base-hover_01.gif) repeat-x 0 0;
    z-index:1000;
    font-size: 12px;
}
ul#menu li {
    float: left;
    display: inline;

    height: 34px;
    padding: 0 1px;

    font-weight: bold;

    position: relative;
}
ul#menu li a {
    float: left;

    padding: 6px 7px;
    height: 20px;
    line-height: 20px;

    color: #FFF;
    text-decoration: none;
}
ul#menu li a:hover, ul#menu li a.active {
    /* background: url(/images/menu_over.gif) repeat-x 0 0; */
    background: url(/images/menu/base_01.gif) repeat-x 0 0;
}


ul#menu ul.sub {
    display: none;
    position:absolute;
    top:32px;
    background: #333;
    border:2px solid #000;
    border-top:0;
    width: 300px;
    z-index: 2000;
}
ul#menu li.sub {
    float:left;
    width:130px;
    height:auto;
    padding: 2px 10px;
    z-index: 2000;
}
ul#menu li.sub a {
    padding:5px;
    height: 100%;
    width: 120px;
    line-height: 12px;
}
ul#menu ul.slim {
    width: 300px;
}



/*
 * Navigation bar
 */
ul#navigation-bar {
    padding: 5px 0;
}
ul#navigation-bar li {
    float:left;
    padding: 0 0 0 10px;
    list-style: disc inside none;
    line-height: 18px;
}


/*
 * Menu labels
 */
ul#label-menu {
    height: 52px;
    background: url(/images/home/events-menu-base-02.gif) repeat-x 0 0;
    margin-top: 10px;
}
ul#label-menu li {
    float: left;
    display: inline;

    height: 32px;

    font-size: 14px;
    font-weight: bold;
    text-align: center;
}
ul#label-menu li a {
    float: left;

    padding: 14px 10px;
    height: 20px;
    width: 132px;
    line-height: 20px;

    border:2px solid #000;
    border-right:0px;

    color: #FFF;
    text-decoration: none;
}
ul#label-menu li a.last {
    border-right:2px solid #000;
}
ul#label-menu li a:hover {
    background:#350926;
}
ul#label-menu li a.active {
    background:#000;
}

/*
 * Main content/styles
 */
#content {
    padding: 0 0 20px 0;
    z-index: 100;
}
#content .main, #content .home {
    float: left;


    /* width: 618px; /* Leaving 30px at right */
    /* border:1px solid #222;*/
    width:620px;

    background: #000;
    min-height: 200px;

    border-radius: 10px;
    -ms-border-radius: 10px;
    -moz-border-radius: 10px;
    -webkit-border-radius: 10px;
    -khtml-border-radius: 10px;
}

#content .others {
    width:590px;
    padding:15px;
    overflow: hidden;
}

#content .notification {
    font-size: 14px;
}
#content .notification p {
    margin: 10px 0;
}


#side {
    float: right;
    width: 300px;
}


#content .side {
    /*
     * 310px
     */
    float: right;
    padding: 5px;

    /*
    width: 298px;
    border:1px solid #222;
    */
    width: 300px;
    background: #000;


    border-radius: 10px;
    -ms-border-radius: 10px;
    -moz-border-radius: 10px;
    -webkit-border-radius: 10px;
    -khtml-border-radius: 10px;
}
#content .margin-bottom {
    margin-bottom: 20px;
}





#content .side ul.link-list {
    padding:5px;
}
#content .side ul.link-list li {
    /*float:left;*/
    padding:5px;
    /*width:130px; */
}

#content .side p span.hard {
    font-size:14px;
    color:#efefef;
    font-weight: bold;
}




#content h2.newsletter {
    background: url(/images/home/header-newsletter.jpg) no-repeat center 10px transparent;
    height: 146px;
    width: 298px;
    text-indent: -9999px;
    padding-bottom: 0;

    border-radius: 10px;
    -ms-border-radius: 10px;
    -moz-border-radius: 10px;
    -webkit-border-radius: 10px;
    -khtml-border-radius: 10px;
}


form {
    padding: 10px;
    padding-top: 0;
}

form div.row {
    margin: 10px 0;
}

form input {
    display: block;
    padding: 4px;
    font-size: 13px;
    border: 1px solid #ccc;
    width:200px;
}

form input:active, form input:focus {
    background-color: #FFFFBB;
}

input#submit {
    cursor: pointer;
    width: auto;
}

form input#submit:focus, form input#submit:active, form input#submit:hover {
    background-color: #ccc;
    border-color: #B42F6A;
    /*color: green;*/
}

form#aweber {
    margin-left: 40px;
}

/**
 * Pagination
**/

#paginator {
    clear: both;
    margin: 20px;
    text-align: center;
    font-size: 14px;
}
#paginator span {
    padding: 5px;
    font-weight: bold;
}
#paginator span.selected {
    font-weight: normal;
}


/**
 * Aweber form
**/
#bday-label {
    line-height: 14px;
}
form div.row.lfloat {
    float:left;
    margin: 0 0 10px 0;
}
#bday, #bmonth, #byear {
    margin-top: 2px;
    margin-left: 5px;
}
#submit {
    clear: both;
    margin-top: 10px;
}


/*
 * Footer
 */
#footer, #footer-links, .footer-events, #footer-mobile {
    border:1px solid #222;
    background: #000;
    min-height: 50px;
    text-align: center;
}
#footer.wrapper, #footer-links.wrapper {
    width:948px;
    margin-bottom:20px;
}
#footer ul {
    float: left;
    width: 550px;
    margin: 15px 0 0 200px;
}
#footer li {
    padding: 2px 0;
    float:left;
    margin-left: 10px;
}
#footer li a, #footer-links li a {
    color: #B42F6A;
}


/*
 * Footer width links
 */
#footer-links ul {
    float: left;
    width: 290px;
    margin: 10px 0;
}
#footer-links li {
    padding: 2px 0;
    margin-left: 10px;
}


#footer-links ul.first {
    width: 270px;
    margin-left: 50px;
}

ul#footer-social  {
    width: 100%;
    float: none;
    text-align:center;
}
ul#footer-social li {
    display: inline-block;
    margin-left: 20px;
}

ul#footer-social a {
    color: #ccc;
    text-decoration: none;
}
ul#footer-social a:hover {
    text-decoration: underline;
}

/* Footer events */
#footer-events{
margin-bottom: 20px;
}

#footer-events h2{
margin: 0 10px 30px 10px;
}

#footer-events a{
text-decoration: none;
}

#footer-events .event {
   float: left;
   width: 450px;
   padding: 0 5px 5px 5px;
   margin: 0 5px 5px 5px;
}

#footer-events .event h2 {
   margin:0;
}

#footer-events .event img {
   float: left;
   margin-right: 10px;
}
ul#event-list li span.data {
   display:block;
   float: left;
   margin:5px 0;
}

/*Misc*/

.display-none {
   display: none;
}

#day_nav ul li {
float: left;

}