body {margin:0px; padding:0px; min-width:330px; background-color:#fff; font-family: Verdana, Geneva, sans-serif;}

/*top bar with link back to rwc*/
#divHeader{background-color:#c3002f; overflow: auto;}

.headerImage {
    width: 100%;
    height: 350px;
    background-image: url("../images/reunion_class_giving_Head.jpg");
    background-size: cover;
    background-repeat: no-repeat;
    background-position: 50% 50%;
}

.labelHeaders {
    background-color: #c3002f;
    color: #fff;
    font-weight: bold;
    text-align: center;
    font-size: 20px;
    padding: 10px 0px 10px 0px;
    margin-bottom: 5px;
}
.spnClassPart {
    font-size: 56px;
    color: #c3002f;
    text-align: center;    
    font-weight: bold;
}

#divBackToRWC{width:950px; margin: 10px auto 5px auto;
              background-image:url(/30days/images/back_arrow.jpg); background-repeat:no-repeat; background-position: left center;}
#divBackToRWC a{text-decoration:none; color:#fff; font-weight: bold; font-variant: small-caps; font-size: 14px;}

/*main body container*/
#divBodyContainer{overflow:hidden; width:950px; margin: 0px auto 0px auto;}

/*left aside*/
aside{float: left; width: 300px; display: block; margin: 30px 0px 0px 0px; padding: 0px 5px 10px 5px;}
#divTicker{	-webkit-border-radius: 10px; -moz-border-radius: 10px; border-radius: 10px; border: 1px solid #c3002f;
	        width: 285px; padding: 5px; overflow:hidden;}
.tickerHeader{border-top:solid 10px #c3002f; width: 275px; height:48px; margin: 0px auto 0px auto;
	          -webkit-border-top-left-radius: 10px;	-webkit-border-top-right-radius: 10px; 
	          -moz-border-radius-topleft: 10px;	-moz-border-radius-topright: 10px;
	          border-top-left-radius: 10px;	border-top-right-radius: 10px;}
.tickerNumber{/*float:right;*/ font-size:20px; /*color: #c3002f;*/}
.yearLabel{background:#c3002f; color:#fff; font-size:20px; }
.numberDonated{/*float: left; margin-left: 20px;*/ font-size: 20px;}


#divClassParticipation{background-color: #c3002f; color:#fff;font-size:20px; font-weight:bold; text-align:center; padding:10px 0px 10px 0px; margin-bottom:5px;}
#divClassInfo {margin-right:0; margin-left:0;}

.reunionParticipation{margin-bottom:10px;}



#divBadges{text-align:center; margin-top:20px;}

#divSocialMedia{ margin-top:20px;}
#divSocialMedia img{padding-right:10px; border:0px solid #fff;}

.fb-like-box{margin-top:20px;}

/*right side content*/
section{float:left; width:640px; margin-top:30px;}
section#secMain {float:none; width:100%; margin-top:0; clear:both;}
#imgHeader{padding: 5px; border: 1px solid #CACAC2; margin-left:8px;}
#divMobileHeader{display:none;}
#divRightContent{padding: 10px; width: 620px; font-size: 14px; line-height: 21px; color: #333;}

.tblDonations{margin-left:60px;}
.tblDonations tr{ vertical-align:top;}
.donationsLabel{width:113px; text-align:right;}

.required{background-color:#fffacd;}

/*footer*/
footer{background-color:#c3002f; color:#fff; font-size:12px; padding:20px 10px 20px 10px; margin:10px 0px 0px 0px; text-align:center;}
footer a{color:#fff; text-decoration:none;}
footer a:hover{text-decoration:underline;}

.hideDonateButton {display:none;}

/**********************
***Responsive Design***
**********************/

/*tablets - portrait orientation*/
@media only screen and (min-width:750px) and (max-width:959px), only screen and (min-device-width:750px) and (max-device-width:959px) 
{
    #divBackToRWC{width:750px;}
    #divBodyContainer{width:750px;}
    
    section{width:440px;}
    #imgHeader{width:420px;}
    #divRightContent{width:400px;}
    #divRightContent textarea{width:320px;}
    
    .tblDonations{margin-left:0px;}
}

/*Mobile - landscape*/
@media only screen and (min-device-width:470px) and (max-device-width:749px), only screen and (min-width:470px) and (max-width:749px)
{
    #divBackToRWC{width:470px;}
    .headerImage {
        width: 100%;
        height: 100px;
        background-image: url("/ReunionClassGiving/images/reunion_class_giving_Head.jpg");
        background-size: cover;
        background-repeat: no-repeat;
        background-position: 0% 50%;
    }
    
    /*left aside*/
    aside{width:470px; margin:0px; padding:0px; text-align:center;}
    #divTicker{margin:0px auto 0px auto;}
        
    .socialMediaFeed{display:none;}
    
    /*main body container*/
    #divBodyContainer{width:470px;}
    
    /*right content*/
    section{width:470px; margin:10px 0px 0px 0px; padding:0px;}
    #imgHeader{display:none;}
    #divMobileHeader{display:block;}
    
    #divRightContent{width:450px; margin:0px; font-size:16px;}
    #divRightContent textarea{width:320px;}

    .tblDonations{margin-left:0px;}
}

/*Mobile - portrait*/
@media only screen and (max-device-width:469px), only screen and (max-width:469px)
{
    #divBackToRWC{width:330px;}
    .headerImage {
        width: 100%;
        height: 100px;
        background-image: url("/ReunionClassGiving/images/reunion_class_giving_Head.jpg");
        background-size: cover;
        background-repeat: no-repeat;
        background-position: 0% 50%;
    }
    
    /*left aside*/
    aside{width:330px; margin:0px; padding:0px; text-align:center;}
    #divTicker{margin:0px auto 0px auto;}
        
    .socialMediaFeed{display:none;}
    
    /*main body container*/
    #divBodyContainer{width:330px;}
    
    /*right content*/
    section{width:330px; margin:10px 0px 0px 0px; padding:0px;}
    #imgHeader{ display:none;}
    #divMobileHeader{display:block; }
    
    #divRightContent{width:310px; margin:0px; font-size:18px; }
    #divRightContent textarea{width:190px;}

    .tblDonations{margin-left:0px;}
}