﻿/**
 * CSS for mayfest.com site
 *
 * main font-color: #1e384f
 * mayfest blue: #0058a8
 * mayfest green: #006738
 * mayfest yellow: #ffd400
 */

/***** MASS RESET *****
 ----------------------*/

/* Neutralize styling:
   Elements we want to clean out entirely: */
html, body, form, fieldset, div { margin: 0; padding: 0; }

/* Neutralize styling:
   Elements with a vertical margin: */
h1, h2, h3, h4, h5, h6, p, pre,
blockquote, ul, ol, dl, address 
{
    margin: 1em 0;
    padding: 0;
}

/* Apply left margin:
   Only to the few elements that need it: */
li, dd, blockquote { margin-left: 26px; }

/* Miscellaneous conveniences: */
form label {  }
fieldset { border: solid 1px #a4a4a4; }
fieldset legend { margin-left: 5px; font-weight: bold; color: #4a4a4a; }

/* Form field text-scaling */
input, select, texarea { font-size: 100%; }

/***** End Mass Reset *****
---------------------------*/

/***** PREFERRED STYLING *****
 -----------------------------
el/class { position/float list-type margin/padding/border width/height background/color font/text }
------------------------------
*/

/***** BEGIN STYLES ******
 -----------------------------------*/
body { background: #e5e5e5; color: #1e384f; font-family: Trebuchet MS, Arial, Sans-Serif; font-size: 11pt; }


/***** GLOBAL STYLES *****
 -------------------------*/
#page-wrapper { margin: 0 auto; padding-top: 20px; border: solid 1px #404040; border-top: 0; width: 1000px; background: white url(/images/layout/main-bg.jpg) repeat-x top; }
.rounded-corners-3px { -moz-border-radius: 3px; -webkit-border-radius: 3px; }
.rounded-corners-5px { -moz-border-radius: 5px; -webkit-border-radius: 5px; }
.clear-fix { clear: both; visibility: hidden; height: 1%; }
.clear-both { clear: both; }
#page-wrapper p { margin: 5px 0 10px 0; }
.img-border { padding: 1px; background: white; border: solid 1px #919191; }
.img-cycle { min-height: 267px; }
.img-cycle-small-left { float: left; margin: 0 20px 10px 0 !important; min-height: 117px; width: 175px; }
.img-cycle-small-left img { margin-top: 0; }
.no-mrgn-top { margin-top: 0 !important; }
.no-mrgn-bottom { margin-bottom: 0 !important; }
#admin-content { padding: 0 20px; }


/***** HEADERS *****
 -------------------*/
h2 { margin-top: 0; border-bottom: dotted 1px; }
h3 { margin: 25px 0 0 0; }


/***** LINKS *****
 -----------------*/
a, .ui-tabs-panel a { color: #337cbd; }
a:hover { color: #004db6; }
.ui-tabs-panel a { color: #337cbd !important; }
.ui-tabs-panel a:hover { color: #004db6 !important; }
.btn:hover { color: White !important; }
a img { border: 0; }


/***** BUTTONS *****
 -------------------*/
.fg-button, .fg-button-small-pad, .fg-button-small-icon { 
   outline: 0; 
   margin: 0 4px 0 0; 
   padding: .4em 1em; 
   text-decoration: none !important; 
   cursor: pointer; 
   position: relative; 
   text-align: center; 
   zoom: 1; 
}
.fg-button-small-pad {
   padding: .2em .2em; 
}
.fg-button-small-icon {  
    height: 26px;   
    padding: .2em;
}


/***** FORMS - BLOCK *****
 -----------------*/
.form-block label, .form-block input[type=text], .form-block input[type=password], .form-block textarea, .form-block select { display: block; }
.form-block label { font-size: 0.9em !important; }
.form-block input[type=text], .form-block input[type=password], .form-block textarea, .form-block select { margin-bottom: 10px; padding: 4px; font-size: 1.0em; }
.form-block input[type=text], .form-block input[type=password], .form-block textarea { width: 200px; }
.form-block label.inline, .form-block input.inline { display: inline !important; margin: 0; }


/***** FORMS *****
 -----------------*/
.form label, .form input[type=text], .form span, .form select { display: inline; }
.form label { width: 200px; font-size: 1.2em; text-align: right; }
.form span, .form input[type=text], .form select { margin-bottom: 10px; font-size: 1.1em; }
.form input[type=text], .form select { padding: 4px; }
.form input[type=text] { width: 200px; font-size: 1.1em; }
.form .submit-status { margin: 10px 0; font-size: 0.8em; }
#payment-form input[type=text] { width: 250px; }
.td-lbl { padding-top: 4px; padding-right: 2px; width: 200px; text-align: right; }
.td-lbl-no-pad { padding-right: 2px; width: 200px; text-align: right; }


/***** VALIDATOR CLASSES ******
 ------------------------------*/
.error { border: solid 1px red; background: #ffdddd; color: Red; }
.status-error { color: Red; }


/***** left-box *****
 --------------------*/
.left-box { 
    margin: 0 0 20px 0; 
    padding: 15px 14px;
    border: solid 1px #0e0e0e; 
    width: 250px; 
    background: #e8d4c5 url(/images/layout/left-box/content-bg.jpg) repeat-x top; 
    font-size: 0.8em; 
    -moz-border-radius: 5px; 
    -webkit-border-radius: 5px; 
}
.left-box h2 { 
    margin: 0 0 10px 0; 
    padding: 3px 8px; 
    background: #5692c6 url(/images/layout/left-box/header-bg.jpg) repeat-x top; 
    border: solid 1px #0e0e0e;
    color: White; 
    font-size: 1.3em;
    text-shadow: #000000 2px 2px 2px; 
    letter-spacing: 1px; 
    -moz-border-radius: 5px; 
    -webkit-border-radius: 5px; 
}
.left-box img { padding: 1px; border: solid 1px black; max-width: 246px; background: white; }
#events-cycle-wrapper { position: relative; }
#events-cycle-wrapper img { position: absolute; }
#date-box { padding: 0 !important; width: 278px !important; background: white; -moz-border-radius: 0; -webkit-border-radius: 0; /*padding: 5px 14px; background: white; font-size: 10pt; text-align: center;*/  }
#date-box img { padding: 0 !important; border: 0 !important; max-width: 278px !important; }
#date-box h4 { margin: 0; font-size: 1.3em; font-weight: 500; text-shadow: #838383 1px 1px 1px;  } 
#date-box p { margin: 10px 0 !important; font-size: 0.9em; }
#events-cycle { height: 168px; }
#tickets img { float: left; margin-right: 15px; padding: 0; border: 0; background: none; }
#mayfest-twitter { padding: 0; width: 278px; height: 275px; background: #2d96ed !important; }


/***** TABS *****
 ----------------*/
.tabs .tab-header { padding: 3px 8px; background: black; color: White; font-size: 0.8em; font-weight: bold; }
.tabs .tabs-nav { height: 23px; padding: 0; border: solid 1px black; border-bottom-color: #a49ea0; z-index: 10; }
.tabs .tabs-nav ul { margin: 0; padding: 0; list-style-type: none; }
.tabs .tabs-nav li { 
    float: left; 
    display: block; 
    margin: 0 1px 0 0; 
    padding: 1px 10px; 
    /*border: solid 1px black; */
    width: 139px; 
    background: #e7e5e3 url(/images/tabs/tab-bg.jpg) repeat-x top; 
    text-align: center; 
    cursor: pointer; 
    z-index: 20; 
}
.tabs .tab-selected, .tab-hover { background: white !important; }
.tabs .tab-selected { padding-bottom: 1px !important; border-bottom: 0 !important; }
.tabs .tabs-nav a { color: Black; font-size: 0.8em; font-weight: bold; text-decoration: none; }
.tabs .tab-content { position: relative; padding: 10px 25px; border: solid 1px black; border-top: 0; font-size: 0.8em; }
.tabs .tab-content li { cursor: default; }


/***** CAROUSEL *****
 -------------------*/
.carousel { float: left; }
.carousel li { float: left; display: block; margin: 0 10px 5px 10px; padding: 10px 0; width: 175px; background: white; }
.carousel li.no-focus { opacity: .70; filter: Alpha(Opacity=70); }
.carousel li h4 {
    margin: 0 0 10px 0; 
    padding: 3px 8px; 
    background: #5692c6 url(/images/layout/left-box/header-bg.jpg) repeat-x top; 
    border: solid 1px #0e0e0e;
    color: White; 
    text-shadow: #000000 2px 2px 2px; 
    letter-spacing: 1px; 
    -moz-border-radius: 5px; 
    -webkit-border-radius: 5px; 
}
.prev1, .prev2, .prev3, .prev4, .next1, .next2, .next3, .next4 { 
    position: absolute;
    top: 37%;
    display: block;
    text-decoration: none;
    text-decoration: none;
    cursor: pointer; 
}
.prev1, .prev2, .prev3, .prev4 { left: -10px; }
.next1, .next2, .next3, .next4 { right: -10px; }


/***** ROTATOR *****
 -------------------*/
.rotator-ul { position: relative; margin: 25px 0 80px 0; height: 300px; padding: 0; list-style-type: none; }
.rotator-ul li { position: absolute; margin: 0; padding: 0; }
.rotator-ul li div { padding: 10px; border: solid 1px #999; background: #e8f7ff; text-align: center; -moz-border-radius: 5px; -webkit-border-radius: 5px; }
.rotator-ul img { display: block; margin: 0 auto 5px auto; padding: 1px; width: 225px; border: solid 1px #666; background: white;  }
.rotator-ul img.small { width: 150px; }
.rotator-ul a { text-decoration: none; }

#mayfest-promo-content { padding: 10px 30px; border: solid 2px #bebebe; background: #e2f9ff; font-size: 0.9em; -moz-border-radius: 5px; -webkit-border-radius: 5px; }
#mayfest-promo-content h3 { margin: 0; }
#mayfest-promo-content h4 { margin: 5px 0 0 0; }


/***** NAV *****
 ---------------*/
#nav { margin: -20px 0 10px 0; padding-top: 20px; padding-left: 20px; height: 35px; border-bottom: solid 1px #999; background: #f8f598; }
#nav ul { list-style-type: none; margin: 0; padding: 0; overflow: hidden; }
#nav li { float: left;  margin: 0; padding: 0; }
#nav a { 
    float: left; 
    display: block;
    margin: 0 10px 10px 10px;
    padding: 0;
    color: #008400; /*#a52c22;*/  
    font-size: 0.85em;
    font-weight: bold; 
    text-decoration: none; 
    text-transform: uppercase; 
    letter-spacing: 0.85px; 
}
#nav a:hover { border-bottom: solid 3px #008400; }
#nav #nav-tickets:hover { border-bottom: 0; }


/***** HEADER *****
 ------------------*/
#header { margin: 0 20px; padding: 10px 0; }
#header table { width: 960px; }
#header h2 { margin: 0; color: #0058a8; font-style: italic; text-transform: capitalize; }
#header h3 { margin: 10px 0 0 0; }


/***** DEFAULT MASTER *****
 --------------------------*/
#tbl-2-col-master { width: 1000px; }
#tbl-2-col-master td { vertical-align: top; }
#col-left-2-col-master { padding: 0 0 0 5px; width: 302px; }
#col-right-2-col-master { padding: 0 40px 20px 50px; width: 613px; }
#col-right-2-col-master p { margin: 20px 0; text-align: left !important; }
#left-col-wrapper { 
    margin: 0 0 20px 0; 
    padding: 10px; 
    width: 280px; 
    border: solid 1px #0e0e0e; 
    background: #ffbf00; /*url(/images/layout/left-col-bg.jpg) repeat-x top;  */
}


/***** FOOTER *****
 ------------------*/
#footer { margin: 10px 10px 0 10px; padding: 20px 10px; border-top: dotted 1px; font-size: 10pt; }


/***** Donors *****
 ------------------*/
#donors ul { list-style-type: none; }
#donors ul li { margin-top: 15px; }