@charset "UTF-8";
/* CSS Document */

.item { margin: 0 0 15px 0; }
.item10 { margin: 0 0 10px 0; }

.txt10 { font-size:10px; }
.txt12 { font-size:12px; }
.txt14 { font-size:14px; }
.txt16 { font-size:16px; }
.txt18 { font-size:18px; }
.txt20 { font-size:20px; }
.txtLeft, .textLeft { text-align:left; }
.txtRight { text-align:right; }
.txtCenter, .centerText { text-align:center; }

.rounded_top { 
	-moz-border-radius: 40px 20px 20px 0px; 
	-webkit-border-radius: 40px 20px 20px 0px; 
	-khtml-border-radius: 40px 20px 20px 0px;
	border-radius: 40px 20px 20px 0px;
}
.shadow {
	-moz-box-shadow: 3px 3px 4px #555;
	-webkit-box-shadow: 3px 3px 4px #555;
	box-shadow: 3px 3px 4px #555;
	/* For IE 8 */
	-ms-filter: "progid:DXImageTransform.Microsoft.Shadow(Strength=4, Direction=135, Color='#000000')";
	/* For IE 5.5 - 7 */
	filter: progid:DXImageTransform.Microsoft.Shadow(Strength=4, Direction=135, Color='#000000');
}
.outerGlowWHT {
	-moz-box-shadow: 30px 20px 10px #FFF;
	-webkit-box-shadow: 30px 20px 10px #FFF;
	box-shadow: 30px 20px 10px #FFF;
	/* For IE 8 */
	-ms-filter: "progid:DXImageTransform.Microsoft.Shadow(Strength=4, Direction=135, Color='#FFFFFF')";
	/* For IE 5.5 - 7 */
	filter: progid:DXImageTransform.Microsoft.Shadow(Strength=4, Direction=135, Color='#FFFFFF');
}
#nameBar { background-color:#ccc; color:#FFF; }

.numberCircle {
    border-radius: 50%;
    behavior: url(PIE.htc); /* remove if you don't care about IE8 */

    width: 50px;
    height: 50px;
    padding: 10px;
	margin:0 10px;

    background: #C0C;
    border: 2px solid #666;
    color: #FFF;
    text-align: center;

    font: 40px Arial, sans-serif;
}

input#postTwitterForm:hover { background-color :#C0C; }

#tweetOutputBox .pt { 
    position: absolute;
    width: 100%; 
    top: 50%;
    transform: translateY(-50%); 
    -moz-border-radius: 10px;
	-webkit-border-radius: 10px;
	border-radius: 10px;
}
#tweetOutputBox { width:96%; margin:10px 2% 20px 2%; }
#tweetOutputBox img { vertical-align:middle; width: 24px; } 
#tweetOutputBox h2, #tweetOutputBox h3, #tweetOutputBox h4 { margin:0; padding:0; }
#tweetOutputBox h2,
#tweetOutputBox h3 { font-size:18px; }
#tweetOutputBox h4 { font-size:16px; }
#tweetOutputBox .box222 { width:47%; margin: 0 1% 15px 1%; padding:5px 0; display: inline-block; vertical-align: text-top; } 
#tweetOutputBox .box311, #tweetOutputBox .box321, #tweetOutputBox .box3F1, #tweetOutputBox .box2RD { width:96%; margin:0 auto 15px auto; display: inline-block; vertical-align: text-top; }
#tweetOutputBox .box2RD { 
    background-color:#CCC; 
    padding:5px 3px; 
    margin:5px 0; 
    text-align: right;
	-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
	border-radius: 10px; 
}

#tweetOutputBox a.button,
#tweetOutputBox a.editTweet { font-size: 0.8em; }
#tweetOutputBox a.button, #tweetOutputBox a.editTweet {
	width:100%;
	padding: 7px 0;
	font-weight:bold;
	cursor: pointer;
	display:block;
	text-align:center;
	text-decoration:none;
	border:1px solid #dcdcdc;
	-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
	border-radius: 10px;
	color:#FFF;
	text-transform:uppercase;
}

input#postTwitterForm {
	width:100%;
	padding: 15px 0px;
	font-weight:bold;
	font-size:16px;
    text-align: center;
	cursor: pointer;
	border:1px solid #dcdcdc; 
	-moz-border-radius: 0px 10px 10px 0px; 
	-webkit-border-radius: 0px 10px 10px 0px; 
	-khtml-border-radius: 0px 10px 10px 0px;
	border-radius: 0px 10px 10px 0px;
	color: white;
}

.cTbutton {
    width: 100%;
    border: none;
    color: white;
    padding: 5px 32px;
    font-size: 16px;
    text-align: right;
    text-decoration: none;
    text-transform: uppercase;
    display: inline-block;
    margin: 0 0 35px 0;
    cursor: pointer; 
	-moz-border-radius: 0px 0px 10px 0px; 
	-webkit-border-radius: 0px 0px 10px 0px; 
	-khtml-border-radius: 0px 0px 10px 0px;
	border-radius: 0px 0px 10px 0px;
}

input#postTwitterForm, .cTbutton, #tweetOutputBox a.button, #tweetOutputBox a.editTweet {
    background: #0099FF;
    background: -moz-linear-gradient(left,  #cc00cc 0%, #2989d8 45%, #0099ff 51%, #0099ff 100%);
    background: -webkit-linear-gradient(left,  #cc00cc 0%,#2989d8 45%,#0099ff 51%,#0099ff 100%);
    background: linear-gradient(to right,  #cc00cc 0%,#2989d8 45%,#0099ff 51%,#0099ff 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#cc00cc', endColorstr='#0099ff',GradientType=1 );
}

input#postTwitterForm:hover, .cTbutton:hover, #tweetOutputBox a.button:hover, #tweetOutputBox a.editTweet:hover {
    background: #CC00CC;
    background: -moz-linear-gradient(left,  #cc00cc 0%, #2989d8 88%, #0099ff 97%, #0099ff 100%);
    background: -webkit-linear-gradient(left,  #cc00cc 0%,#2989d8 88%,#0099ff 97%,#0099ff 100%);
    background: linear-gradient(to right,  #cc00cc 0%,#2989d8 88%,#0099ff 97%,#0099ff 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#cc00cc', endColorstr='#0099ff',GradientType=1 );
}

#tweetOutputBox .tweeterINFO {
	position: absolute; bottom: 0px; color: #555; width: 40%; padding: 5px 0; text-align: center;
    background: rgb(231, 231, 231); /* The Fallback */
    background: rgba(231, 231, 231, 0.9); 
	-moz-border-radius: 10px 20px 10px 0px; 
	-webkit-border-radius: 10px 20px 10px 0px; 
	-khtml-border-radius: 10px 20px 10px 0px;
	border-radius: 10px 20px 0px 10px;
}
#tweetOutputBox .tweeterINFO { left: 18px; }

textarea#FB, textarea#TW { width: 98%; font-size: 18px; margin: 16px 0 0 0; }
textarea#FB,
textarea#TW { height: 200px; }

#topBottomBox {
  position: fixed;
  left: 15px;
  top: 20%;
  width: 40px;
  margin-top: -2.5em; 
}
#topBottomBox img { width:26px; height:26px; border:0; margin: 2px auto; vertical-align: middle; }



/* Float Boxs */
#postBox {
    position: relative;
	width: 180px;
	margin:0 5px 15px 5px;
    background-color: #eee;
    vertical-align: top;
	display: inline-block;
}

#postInfo { position: relative; text-align: left; background-color: #555; height: 15px;
	-moz-border-radius: 40px 20px 0px 0px; 
	-webkit-border-radius: 40px 20px 0px 0px; 
	-khtml-border-radius: 40px 20px 0px 0px;
	border-radius: 40px 20px 0px 0px; 
}
#postInfo img { position: absolute; top: 0; left: 0; width:35px; height:35px; border:0; margin: 0; vertical-align: middle; z-index: 35; }
#postInfo .titleBOXbar { font-size: 10px; font-weight: normal; }
#postInfo .titleBOXbar span { display: none; }
#postInfo .titleBOXbar { position: absolute; top: 5px; left: 10px; width: 87%;  padding: 3px 0 2px 26px; color: #FFF; 
     background: rgb(2,0,36);
    background: -moz-linear-gradient(90deg, rgba(2,0,36,1) 75%, rgba(9,9,121,0.0032213569021358746) 95%, rgba(0,212,255,0) 100%);
    background: -webkit-linear-gradient(90deg, rgba(2,0,36,1) 75%, rgba(9,9,121,0.0032213569021358746) 95%, rgba(0,212,255,0) 100%);
    background: linear-gradient(90deg, rgba(2,0,36,1) 75%, rgba(9,9,121,0.0032213569021358746) 95%, rgba(0,212,255,0) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#020024",endColorstr="#00d4ff",GradientType=1);   
    overflow: hidden; 
    z-index: 4;
}

#showIMAGE { height: 75px; }
#showIMAGE { position: relative; overflow: hidden; }
#showIMAGE img { position: absolute; top:-90%; left:0; right: 0; bottom:-90%; width:100%; margin: auto; }

.postTools img { width:16px; height:16px; border:0; margin: 2px 0; vertical-align: middle; }
.postTools img.copyIT { width:24px; height:24px; border:0; margin: 2px 5px 2px 2px; vertical-align: middle; }
.postTools img.postTweeted { width:14px; height:14px; border:0; margin: 2px 5px 2px 2px; vertical-align: middle; }
.postTools a, .postTools a:visited { text-decoration: none; color: blue; font-size: 10px; }
.postTools { text-decoration: none; color: blue; font-size: 10px; }
.postTools { text-align: left; }

#postEDIT { position: absolute; bottom: 5px; right: 5px; width:49px; height:49px; border:0; margin: 0; vertical-align: middle; z-index: 35; background-color: #ddd; }
#postEDIT:hover { background-color: #eee; }
#postEDIT img { position: absolute; bottom: 5px; right: 5px; width: 39px; height:39px; z-index: 36; }
#sortPosts { width: 90%; margin: 15px auto; padding: 10px 0; }
#sortPosts a, #sortPosts a:visited { display: inline-block; margin: 0 1px; padding: 5px 15px; background-color: #09F; color: #FFF; font-weight: bold; text-decoration: none; }
#sortPosts a:hover { background-color: #C0C; }

/* Post Form */
#postFormPOSTS { width: 100%; }
#postFormPAGE { width: 96%; margin: 25px auto; }
#postFormPAGE .box311, #postFormPOSTS .box311, #postFormPAGE .box321, #postFormPOSTS .box321, #postFormPAGE .box2RD, #postFormPOSTS .box2RD { width:96%; margin:0 auto 15px auto; display: inline-block; vertical-align: text-top; }


@media only screen and (min-width: 481px) {
#postBox { width: 210px; }
    
#postInfo .titleBOXbar { font-size: 10px; font-weight: normal; }
#postInfo .titleBOXbar span { display: inline; }

input#postTwitterForm { padding: 10px 0px; font-size:16px; text-align: right; }
    
.postTools img.postTweeted { width:20px; height:20px; border:0; margin: 2px 5px 2px 2px; vertical-align: middle; }
.postTools img { width:24px; height:24px; border:0; margin: 2px 0; vertical-align: middle; }
.postTools a, .postTools a:visited { text-decoration: none; color: blue; font-size: 12px; }
.postTools { text-decoration: none; color: blue; font-size: 12px; } 
#postEDIT img { position: absolute; bottom: 5px; right: 7px; width: 36px; height: 36px; z-index: 6; }
 
#tweetOutputBox a.button { font-size: 1em; } #tweetOutputBox a.editTweet { font-size: 1em; }
#tweetOutputBox .box321 { width:47%; margin: 0 1% 15px 1%; }    
#tweetOutputBox .box3F1 { width:98%; margin: 0 1% 15px 1%; } 
    
}
#showIMAGE { height: 124px; }
#sortPosts { width: 80%; margin: 10px auto; }
#tweetOutputBox .tweeterINFO { left: 0px; }

/* Post Form */
#postFormPAGE .box321, #postFormPOSTS .box321 { width:47%; margin: 0 1% 15px 1%; }



@media only screen and (min-width: 769px) {
#postBox { width: 250px; }

input#postTwitterForm { padding: 5px 0px; }
    
#postInfo .titleBOXbar { font-size: 11px; font-weight: bold; }
#showIMAGE { height: 129px; }
#sortPosts { width: 70%; margin: 15px auto; }
    
#tweetOutputBox a.button { font-size: 16px; } #tweetOutputBox a.editTweet { font-size: 16px; }
#tweetOutputBox .box211 { width:47%; margin: 0 1% 15px 1%; }    
#tweetOutputBox .box311, #tweetOutputBox .box321, #tweetOutputBox .box3F1 { width:31%; margin: 0 1% 15px 1%; }    
#tweetOutputBox .box2RD { width:64%; margin: 0 1% 15px 1%; }
#tweetOutputBox .tweeterINFO { left: 35px; } 

/* Post Form */
#postFormPAGE .box311, #postFormPOSTS .box311, #postFormPAGE .box321, #postFormPOSTS .box321 { width:31%; margin: 0 1% 15px 1%; }    
#postFormPAGE .box2RD, #postFormPOSTS .box2RD { width:64%; margin: 0 1% 15px 1%; }
    
}