#container{
             width: 960px;
             margin:0px auto;

#left-column{
                width:700px; 
                float:left;
                background: blue;
}

#right-column{
               width:260px; 
               float:left;
                background: orange;
}

@media screen and (max-width: 959px){
       #container{
              width:100%;
       }

       #left-column{
                width:70%;      
        }
       #right-column{
                width:30%%;      
        }
       img{
              width:100%;
        }

}

@media screen and (max-width: 640px){
        #left-column{
                width:100%;      
        }
       #right-column{
                width:100%;      
        }
}
@media screen and (max-width: 320px){
       #container{
              width:328px;
       }
}

body{ margin: 0px; text-align: center; font-family: Tahoma, Geneva, sans-serif;   font-size: 14px;

    background-size: contain;
    width: 100%;
    height: 400px;
    background-image: url('images/globe3.png');
    background-repeat: no-repeat;
    background-size: contain;
     padding-top: 0px;

}
#pageTop{
	position: fixed;
	top: 0px;
	width:100%;
	height: 90px;
	background: #000;
	color: #fff;
	font-size: 23px;
	padding-top: 50px;
	transition: height 0.3s linear 0s, padding 0.3s linear 0s;
	overflow:hidden;
}

#pageTop > #pageTopWrap{
        width: 70%;
        height: 90px;
        margin: 0px auto;
        background: #999;
	transition: height 0.3s linear 0s;
        background:-webkit-linear-gradient(#666, #000);
	background:linear-gradient(#666, #000);
	height:60px;
        height: 40px;
    }




#pageTop > #pageTopWrap > #pageTopLogo{
position: fixed;
    float:left;
	top: 5px;
    width:11%;
	height:90px;
    margin:0px 0px 0px 50px;
	font-size:16px;
	color:#999;
z-index: 10000;
}
#pageTop > #pageTopWrap > #pageTopRest{
    float:left;
	top: 5px;
    width:89%;
	height:20px;
    margin:0px 0px 0px 50px;
	font-size:16px;
	color:#999;
}

#pageTop > #pageTopWrap > #pageTopRest > #menu1{
   	height:44px;
  
}
#pageTop > #pageTopWrap > #pageTopRest > #menu1 > div {
    margin-top: 8px;
    padding: 4px;    
    text-align: right;
}

a.pagelink:link,
a.pagelink:visited,
a.pagelink:active { color: #3366FF; text-decoration: none; }

a.pagelink:hover { color: #006699; text-decoration: underline; }

a.pt:hover, a.pt:active {color: green;}
a.pt:hover, a.pt:active {font-size: 100%;}
a.pt:hover, a.pt:active {background: #b8e600;}
a.pt:visited, a.pt:link {color: black; text-decoration: none;}

a.mf:hover, a.mf:active {color: green;}
a.mf:hover, a.mf:active {font-size: 100%;}
a.mf:hover, a.mf:active {background: #b8e600;}
a.mf:visited, a.mf:link {color: black; text-decoration: none;}

a.mb:active, {color: red;}
a.mb:hover, {color: #9ad85f;}
a.mb:hover, a.mb:active {color: green;}
a.mb:visited, a.mb:link {color: black; text-decoration: none;}
        
a.no:hover, a.no:active {color: green;}
a.no:hover, a.no:active {font-size: 100%;}
a.no:hover, a.no:active {background: red;}
a.no:visited, a.no:link {color: black; text-decoration: none;}

#pageTop > #pageTopWrap > #pageTopRest > #menu1 > div > a {
     float: left;
     color: #9ad85f;
     text-decoration: none;
     margin: 0px 24px;
}

#pageTop > #pageTopWrap > #pageTopRest > #menu1 > div > a.PageTopLink {
     float: left;
     color: #CCC;
     text-decoration: none;
     margin: 0px 24px;
}
.img-circle {
    border-radius: 50%;
}

/* unvisited link */
a:link {
    color: #FFD700;
text-decoration: none;
}

/* visited link */
a:visited {
    color: FFD700;
}

/* mouse over link */
a:hover {
    color: #ADFF2F;
}

/* selected link */
a:active {
    color: #76EE00;
}






#pageTop > #pageTopWrap > #pageTopRest > #menu1 > div > a:visited {
   
	color: #76EE00;
 } 
#pageTop > #pageTopWrap > #pageTopRest > #menu1 > div > a:active {
   
	color: #ccc;
 } 

#pageTop > #pageTopWrap > #pageTopRest > #menu1 > div > a:hover {
   
	color: #76EE00;
 } 
#pageTop > #pageTopWrap > #pageTopRest > #menu1 > div > a:active {
   
	color: #ccc;
 }  
 #pageTop > #pageTopWrap > #pageTopRest > #menu1 > div > a:visited {
   
	color: #333;
 } 
 
#pageTop > #pageTopWrap > #pageTopRest > #menu2{
   	height:44px;
   
}
#pageTop > #pageTopWrap > #pageTopRest > #menu2 > div {

    margin-top: 2px;
    padding: 4px;    
}

#pageTop > #pageTopWrap > #pageTopRest > #menu2 > div > a {
    display: block;
    float: left;
	color: #9ad85f;
    text-decoration: none;
    margin: 0px 24px;
}
#pageTop > #pageTopWrap > #pageTopRest > #menu2 > div > a:hover {
   
	color: #76EE00;
 } 

#pageTop > #menuBar{
	position: absolute;
	bottom: 0px;
	width:100%;
	background: #333;
	height: 50px;
	transition: height 0.3s linear 0s;
        background:-webkit-linear-gradient(#666, #000);
	background:linear-gradient(#666, #000);
        z-index: 1000;
}

#wrapper{ margin-top: 160px; }

 
      div#menubarButtons{ padding: 12px; border:#999 0px dashed; }
       div#menubarButtons > a{font-family:Arial, Helvetica, sans-serif;
       font-size:14px;
       background: #333;
       padding: 7px 7px;
       color:#999;
       margin-right: 10px;
       text-decoration:none;
       border-radius: 3px;
       transition: background 0.3s linear 0s, color 0.3s linear 0s;
}
      div#menubarButtons > a:hover{
      background: #6F8A00;
      color:#ffffff;
}






/* PAGE MIDDLE */
#pageMiddle{
   width: 100%;
   margin: 0px auto;
   text-align: center;

}


#contactResponse {
 // your css style here 
 color: white;
}

#contact_form{
       position: absolute;
       top: 350px;
       left: 500px;
       width: 200px;
       height: 340px;
       background-image: url("images/globe3.png");
       border: 1px solid #73AD21;
       margin: 0 auto;
       margin-top:auto;	
 z-index: 100;
} 
#contact_form > div {
	margin-top: 120px;	
}
#contact_form > input {
	width: 390px;
	padding: 3px;
	background: #C7E1BA ;
}

#contactbtn {
        width: 100px;	
        margin-right: 0px;
font-size:25px;
	padding: 10px;
}

#wss {
	opacity:0;
	-webkit-transition:opacity 1.0s linear 0s;
    transition:opacity 1.0s linear 0s; 
}


div#peekaboo{
    position:fixed;
    background: -webkit-linear-gradient(#666, #000);
    background: linear-gradient(#666, #000);
    bottom:0px;
    right:-352px;
    padding:25px;
    width:300px;
    height:300px;
    font-size:24px;

}

div#peekaboo>  div{
	background:#333;
	padding:20px;
	height:238px;
	margin:10px;
        border-radius:8px 8px 8px 8px;
	width:250px;
	top:252px;
	left:200px;
	border-radius:0px 0px 8px 8px;
	overflow:hidden;
	z-index:10000;
	transition: height 0.3s linear 0s;
}


/* PAGE BOTTOM */
#pageBottom{
position: fixed;
	bottom: 0px;
	width:100%;
	height: 8px;
	background: #151515;
	padding-top: 50px;
	transition: height 0.3s linear 0s, padding 0.3s linear 0s;
	overflow:hidden;
	padding: 24px;
	font-size: 12px;
	color: #76EE00;
	text-align: center;
}

/* Member Search */
#memSearch{
	float: right;
	width: 120px;
}
#memSearchResults{
	display: none;
	width: 140px;
	z-index: 5000;
	background-color: #eee;
	text-align: left;
	position:fixed;
	top:63px;
	overflow-y:auto;
	padding-bottom: 10px;
	padding-left: 10px;
	max-height:100px;
}

/* Groups Form / List */
#groupWrapper {
padding-top: 10px;
     clear: left;
     width: 1000px;
     margin: 0px auto;
}

#groupList {
    float: left;
    width: 750px;
   background: #8db600;

}
#groupForm {
    float: right;
    width: 200px;
   background: #a1d000;

}

.clear {
    clear: both;
}

#groupPosts {
    float: left;
    width: 760px;
    margin-bottom: 50px;
}

#groupMembers {
    float: right;
    width: 240px;
}

div#profile_pic_box{float:right;  border-radius: 5px; border:#999 2px solid; width:200px; height:200px; margin:20px 30px 0px 0px; overflow-y:hidden;}
div#profile_pic_box > img{z-index:2000; width:200px;}
div#profile_pic_box > a {
	display: none;
	position:absolute; 
	margin:140px 0px 0px 120px;
	z-index:4000;
	background:#D8F08E;
	border:#81A332 1px solid;
	border-radius:3px;
	padding:5px;
	font-size:12px;
	text-decoration:none;
	color:#60750B;
}
div#profile_pic_box > form{
	display:none;
	position:absolute; 
	z-index:3000;
	padding:10px;
	opacity:.8;
	background:#F0FEC2;
	width:180px;
	height:180px;
}
div#profile_pic_box:hover a {
    display: block;
}


textarea.newpost{
    width: 85%;
    height:40px;
    padding:1%;
    border: #999 1px solid:
}

textarea.repost{
   width: 75%;
   height: 40px;
   padding: 1px;
   border:#999 1px solid;
}

/* Groups Posts */
.postsWrapper {
   width: 90%;
   border: 1px solid #333333:
   margin-top: 10px:
}
.postsHead {
   background-color: #454545:
   color: #FFF;
   padding-top: 5px;
   padding-left: 5px;
   padding-bottom: 5px;

}
.postsBody {
   padding-top: 5px;
   padding-left: 5px;
   padding-bottom: 5px;


}
.postsPic {
   float: left;
   width: 65px;
-webkit-border-radius: 50px;
-moz-border-radius: 50px;
border-radius: 50px;

}

.postsWords {
   float: left;
   width: 590px;
}













div.one-third {
	width: 47.5%;
}

div.one-third-second {
	margin: 0;
}

div.one-third-last {
	clear: both;
	float: none;
	width: auto;
	padding: 20px 0 0 0;
}

div.nav ul li {
	width: 25%;
	border-bottom: 1px solid #bababa;
}

@media screen and (max-width: 620px) {
	div.nav ul li {
		width: 33%;
	}
}

@media screen and (max-width: 500px) {
	
	div.nav ul li {
		width: 50%;
		font-size: 85%;
	}
	
	div.mobile-collapse {
		width: auto;
		float: none;
		margin-right: 0;
	}
	
	.hide-mobile {
		display: none;
	}
		
}