body {
margin : 0;
padding : 0;
border-color : #cc0000;
font-size: 12px;
font-family:Tahoma, Geneva, sans-serif;
color : #FFFFFF;
background-position: top;
 background-image: url("images/background-image/charity_bg.png");
background-repeat:repeat;
background-attachment:fixed;

}


.li-colon  span 
{
  display: inline-block;
  width: 50%;
  position: relative;
  padding-right: 6px; /* Ensures colon does not overlay the text */

}

.li-colon   span: :after {

content: ":";
  position: absolute;
  right: 6px;

}

.home-page
{

}

p {
	font-size: 12px;
	font-family: Tahoma, Geneva, sans-serif;
	font-weight: normal;
	padding-bottom: 5px;
}


.green_font{
font : bold 15px Arial,geneva,helvetica;
color : #c7d810;
}


#green_heading{
font : bold 13px Arial,geneva,helvetica;
color : #c7d810;
}
#contact_heading{
	font-family:Arial, Helvetica, sans-serif;
	font-weight:bold;
	font-size:14px;
	color : #c7d810;
    padding:10px;
}

.grey_line{
size: 1 px;
color: #525252;
}

#pics { text-align:center;}

.menu{
	font: bold 13px Arial,geneva,helvetica;
	margin: 0;
	width: 100%;
	text-align: center; /*set value to "right" for example to align menu to the right of page*/
	padding-top: 5px;
	padding-right: 0;
	padding-bottom: 5px;
	padding-left: 0;
	margin-left:10px;
	
}

.menu li{
	list-style: none;
	display: inline;
	}

.menu li a{
    text-decoration: none;
	color: #FFFFFF;
	padding-top: 3px;
	padding-right: 0.3em;
	padding-bottom: 6px;
	padding-left: 0.3em;
	
}

.menu li a:hover{
	color: #c7d810 !important;
	}

a:link { color: #CCC !important;}
a:visited { color:#CCC;}
a:active {text-decoration: none}
a:hover {text-decoration: none; color:#333 !important;}

nav div ul li a {
    color:#000;
}
nav div ul li a:active {
    color:#000;
    text-decoration:underline;
}

#mainfont {
width : 711px;
top : 0px;
margin : 0px 25% 0 165px;
padding : 3px;
font : 10pt Arial,geneva,helvetica;
color : #FFFFFF;
}

#logo {
position : absolute;
left : 0;
width : 150px;
margin-left : 10px;
margin-top : 20px;
color : #000000;
padding : 3px;
}

h1 {
font : bold 14pt Arial, Helvetica, geneva;
}
h2 {
font : bold 12pt Arial, Helvetica, geneva;
}
#leftnavigation {
position : absolute;
left : 0;
width : 150px;
margin-left : 10px;
margin-top : 20px;
color : #000000;
padding : 3px;
}
#rightnavigation {
position : absolute;
left : 80%;
top : 20px;
width : 140px;
padding-left : 10px;
z-index : 3;
color : #000000;
padding : 3px;
}
#content {
width : 711px;
top : 0px;
margin : 0px 25% 0 165px;
padding : 3px;
color : #000000;
}
#content h1, #content h2 {
color : #cc0000;
}

#emblem {
float: right;
}

#logo {
width: 711px;
}

#sidebar {
float: left;
}

td .white{
	border-top-width: 0px;
	border-right-width: 0px;
	border-bottom-width: 1px;
	border-left-width: 0px;
	border-top-style: none;
	border-right-style: none;
	border-bottom-style: solid;
	border-left-style: none;
	border-top-color: #FFF;
	border-right-color: #FFF;
	border-bottom-color: #FFF;
	border-left-color: #FFF;
}
td .rightbottom{
	border-top-width: 0px;
	border-right-width: 1px;
	border-bottom-width: 1px;
	border-left-width: 0px;
	border-top-style: none;
	border-right-style: solid;
	border-bottom-style: solid;
	border-left-style: none;
	border-top-color: #FFF;
	border-right-color: #FFF;
	border-bottom-color: #FFF;
	border-left-color: #FFF;
}
td .right {
	border-top-width: 0px;
	border-right-width: 1px;
	border-bottom-width: 0px;
	border-left-width: 0px;
	border-top-style: none;
	border-right-style: solid;
	border-bottom-style: none;
	border-left-style: none;
	border-top-color: #FFF;
	border-right-color: #FFF;
	border-bottom-color: #FFF;
	border-left-color: #FFF;
}
td .bottom {
	border-top-width: 0px;
	border-right-width: 0px;
	border-bottom-width: 1px;
	border-left-width: 0px;
	border-top-style: none;
	border-right-style: none;
	border-bottom-style: solid;
	border-left-style: none;
	border-top-color: #FFF;
	border-right-color: #FFF;
	border-bottom-color: #FFF;
	border-left-color: #FFF;
}
.logo {
    padding-left: 80px;
}

.bee {
    margin: 0 auto;
    padding-top: 109px;
}










@media screen and (min-width: 800px) {
    #whole-page {
         width:100%; max-width:800px; margin:0 auto;background-color:#000;

    }
    .contentwindow {
        padding:5px;width:98%;
    }
    #header {
        width:100%;text-align: center;background-color:#000;
    }
    #toplogos1, #toplogos2, #toplogos3 {
        float:left; vertical-align: baseline; height:170px;
    }
    #toplogos1 {
        width:400px;
    }
    #toplogos2{
        width: 296px;
    }
    #toplogos3 {
        width:100px;
    }

    #toplogos1 img {
        width:362px;
    }
    #toplogos2 img{
        width: 166px;
    }
    #toplogos3 img{
        width:80px;
        padding-top:50%;
    }
    #homebullets {
        margin-left:15px;
    }
    #slogan {
        width:100%;text-align: right;
    }
    #footer { text-align:center; width:100%; clear:both;
    }
    #teamandtext {
        text-align: center; width: 100%; float: left;
    }
    #teamandtext a img{
        width: 100%;
    }
    .conversiontable, .conversiontable2 {
        width:90%; float:left;
    }
    .conversiontable2 {
        border: 1px solid #FFFFFF;
    }
    .whiteborder {
        border: 1px solid #ffffff; width:24%; float:left; padding:2px; line-height:15px; height:36px; text-align: center;
    }
    .borderleft {
        border-right:1px solid #000000;border-top:1px solid #000000;border-bottom:1px solid #000000;border-left: 1px solid #ffffff; width:24%; float:left; padding:2px; line-height:15px;
    }
    .borderright {
        border-right: 1px solid #ffffff; border-left:1px solid #000000;border-top:1px solid #000000;border-bottom:1px solid #000000;width:24%; float:left; padding:2px; line-height:15px;
    }
    .borderbottom {
        border-top: 1px solid #ffffff; border-left:1px solid #000000;border-right:1px solid #000000;border-bottom:1px solid #000000;width:24%; float:left; padding:2px; line-height:15px;
    }
    #mainmenudesktop { display:block!important;}
    #mobibutton { display:none; !important; }
    
#my-menu { display:none !important;  }
}




@media screen and (max-width: 799px) {
    #whole-page {
         width:100%; max-width:799px; margin:0 auto;background-color:#000;

    }
    .contentwindow {
        padding:5px;width:98%;
    }
    #header {
        width:100%;text-align: center;background-color:#000;
    }
    #toplogos1, #toplogos2, #toplogos3 {
        float:left; vertical-align: baseline;
    }
    #toplogos1 {
        width:50%;
        padding: 0 20px;
    }
    #toplogos2{
        width: 20%;
        padding:0px;
    }
    #toplogos3 {
        width:12%;
        padding:0 8px;
    }

    #toplogos1 img {
        width:100%;
    }
    #toplogos2 img{
        width: 100%;
    }
    #toplogos3 img{
        width:100%;
        padding-top:50%;
    }
    #homebullets {
        margin-left:-5px;
    }
    #slogan {
        width:100%;text-align: right;
    }
    #footer { text-align:center; width:100%;clear:both;
    }
    #teamandtext {
        text-align: center; width: 90%; margin:0 auto;
    }
    #teamandtext a img{
        width: 100%;
    }
    .conversiontable, .conversiontable2 {
        width:99%; float:left;
    }
    .conversiontable2 {
        border: 1px solid #FFFFFF;
    }
    .whiteborder {
        border: 1px solid #ffffff; width:24%; float:left; line-height:15px; height:36px; text-align: center;padding-top:1%;
    }
    .borderleft {
        border-right:1px solid #000000;border-top:1px solid #000000;border-bottom:1px solid #000000;border-left: 1px solid #ffffff; width:24%; float:left; padding:0px; line-height:15px;
    }
    .borderright {
        border-right: 1px solid #ffffff; border-left:1px solid #000000;border-top:1px solid #000000;border-bottom:1px solid #000000;width:24%; float:left; padding:0px; line-height:15px;
    }
    .borderbottom {
        border-top: 1px solid #ffffff; border-left:1px solid #000000;border-right:1px solid #000000;border-bottom:1px solid #000000;width:24%; float:left; padding:0px; line-height:15px;
    }
    #mainmenudesktop { display:none !important;}
    #mobibutton { float:left; width:100%; text-align:left; display:block; margin-top:5px;margin-left:20px;margin-bottom:10px; }
    #mobibutton a img { height:22px; }
    }