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

/* Start: One-Offs */
.txt12 { font-size: 12px; }
.txt16 { font-size: 16px; }
.txt18 { font-size: 18px; }
.txt20 { font-size: 20px; }   
.item { margin: 0 0 15px 0; }    
.item5 { margin: 0 0 5px 0; }  
.centerText { text-align: center; }
.textLeft { text-align: left; }
.padTB20 { padding: 20px 0; }
.clearB { clear: both; }

.w40 { width: 38%; margin: 0 auto; }
.w100 { width: 98%; margin: 0 auto; }

.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;
}

.rounded_corners { 
	-moz-border-radius: 20px 20px 20px 20px; 
	-webkit-border-radius: 20px 20px 20px 20px; 
	-khtml-border-radius: 20px 20px 20px 20px;
	border-radius: 20px 20px 20px 20px;
}
.boxShadow {
	-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');
}
a.goPage,
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[type=submit]#fullBoxLink, .fullBoxLink, .fullBoxLink:visited { width: 100%; padding: 35px 0; font-size: 36px; text-align: center; text-decoration: none; color: #555; background-color: #ededed; border: 2px solid #555; display: block; }
input[type=submit]#fullBoxLink:hover, .fullBoxLink:hover { background-color: #09F; color: #fff; }

input.largerCheckbox { width: 60px; height: 60px; }
input#postForm {
	width:100%;
	padding: 9px 0;
	font-weight:bold;
	font-size:18px;
	opacity:1;
	cursor: pointer;
	border:1px solid #dcdcdc; /*required or the default border for the browser will appear*/
	/*give the button curved corners, alter the size as required*/
	-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
	border-radius: 10px;
	/*give the button a drop shadow*/
	-webkit-box-shadow: 0 0 4px rgba(0,0,0, .75);
	-moz-box-shadow: 0 0 4px rgba(0,0,0, .75);
	box-shadow: 0 0 4px rgba(0,0,0, .75);
	/*style the text*/
	color:#f3f3f3;
}
input#postForm:hover, input#postForm:focus {
	/*reduce the drop shadow size to give a pushed button effect*/
	-webkit-box-shadow: 0 0 1px rgba(0,0,0, .75);
	-moz-box-shadow: 0 0 1px rgba(0,0,0, .75);
	box-shadow: 0 0 1px rgba(0,0,0, .75);
	opacity:0.9;
}
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;
}
input#postForm, input#postTwitterForm, a.goPage, 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#postForm:hover, input#postTwitterForm:hover, a.goPage:hover, 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 );
}


input[type=text], .select {
  font-size: 14px;  
  width: 96%;
  padding: 8px 12px;
  margin: 4px 2%;
  display: inline-block;
  border: 1px solid #ccc;
  border-radius: 4px;
  box-sizing: border-box;
}

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

#nameBar2 { background-color:#ccc; color:#FFF; text-align: center; padding: 15px 0 0 0; }
/* End: One-Offs */
    
/* Start: Under Width 481 */

.circle {
  position: relative;
  display: inline-block;
  width: 100%;
  height: 0;
  padding: 13% 0 87% 0;
  border-radius: 50%;
  background: #38a9e4;
  color: white;
  font-size: 28px;
  text-align: center;
}

/* WRAPERS */
.wrapper6090100 { width: 100%; margin: 0; }
.orWrap { position: absolute; width: 14%; left: 43%; top: 38%; }

/* BOXS */
.box211, .box221, .box311, .box321, .box2RD, .box421 { width:96%; margin:0 auto 15px auto; display: inline-block; vertical-align: text-top; }

@media only screen and (min-width: 481px) {

.circle { padding: 25% 0 75% 0; font-size: 24px; }

/* WRAPERS */
.wrapper6090100 { width: 90%;  margin: 25px auto 0 auto; }
.orWrap { position: absolute; width: 10%; left: 45%; top: 17%; }

/* BOXS */
.box221, .box421 { width:47%; margin: 0 1% 15px 1%; }
.box321 { width:47%; margin: 0 1% 15px 1%; }
    
}
@media only screen and (min-width: 769px) {

.circle { padding: 30% 0 70% 0; font-size: 28px; }

/* WRAPERS */
.wrapper6090100 { width: 60%; margin: 45px auto 0 auto; }

/* BOXS */
.box211 { width:48%; margin: 0 1% 15px 1%; }
.box311, .box321 { width:30%; margin: 0 1% 15px 1%; }
.box2RD { width:64%; margin: 0 1% 15px 1%; }
.box421 { width:22%; margin: 0 1% 15px 1%; }
    
}