body{
	background-color:#F5F5DC;
	color:#000000;
}

.container{
	margin: 0 auto;
	max-width:1050px;
	text-align:justify;
	font-family: sans-serif;
	padding:10px;
	padding-top:20px;
}

.main{
	max-width:600px;
	float:left;
	margin-right:20px;
}

@media (max-width: 956px){

	.main{
		max-width:500px;
	}
	
	.instructionsbox{
		margin: 0 auto;
	}
	
	.splittercontainer{
		margin: 0 auto;
	}
	

}

h1{
	font-size:22px;
}

h2{
	font-size:17px;
}

.instructionsbox{
	border: 2px dashed #CECECE;
	max-width: 475px;
	padding: 0px 10px 0px 15px;
	text-align:left;
}

/* upload file css*/
div.upload {	
	overflow: hidden;
	background-color: #444444;
	margin-left: 3px;
	margin-top: 3px;
	margin-top: 3px;
	position:relative;
}

span.loadfilebuttontext{
	color:white;
	position:absolute;
	top:8px;
	left:24px;
	font-size:18px;
}

div.upload:hover{
	background-color:#333333;
	color:#DDDDDD;
	cursor: pointer; cursor: hand;
	
	-webkit-box-shadow: 0px 0px 12px 1px rgba(0,0,0,0.43);
	-moz-box-shadow: 0px 0px 12px 1px rgba(0,0,0,0.43);
	box-shadow: 0px 0px 12px 1px rgba(0,0,0,0.43);
}


div.upload input {
	display: block !important;
	width: 127px !important;
	height: 37px !important;
	opacity: 0 !important;
	overflow: hidden !important;
	margin-top: 3px;
}
div.upload input:hover{
	cursor: pointer; cursor: hand;
}

form#inputform{
	width:127px;
	float: left;
}

#inputfilename{
	float:left;
	margin-top:3px;
	height: 40px;
	padding-left:10px;
	width:330px;
	
	font-size:20px;
	background:#e8e8e8;
	text-align:right;
	
-webkit-box-shadow: inset 0px 0px 27px -9px rgba(0,0,0,0.43);
-moz-box-shadow: inset 0px 0px 27px -9px rgba(0,0,0,0.43);
box-shadow: inset 0px 0px 27px -9px rgba(0,0,0,0.43);
}

#inputfilename .text{
	position: relative;
	padding-right:20px;
	top: 50%;
	transform: translateY(-50%);
}

.clear{
	clear:both;
}

#splitfile{
	margin-top:10px;
	height:38px;
	width:119px;
	text-align:center;
	line-height:38px;
	background-color:#444444;
	color:white;
	font-size:22px;
	float:right;
	margin-right:17px;
}

#splitfile:hover{
	background-color:#333333;
	color:#DDDDDD;
	cursor: pointer; cursor: hand;
	
	-webkit-box-shadow: 0px 0px 12px 1px rgba(0,0,0,0.43);
	-moz-box-shadow: 0px 0px 12px 1px rgba(0,0,0,0.43);
	box-shadow: 0px 0px 12px 1px rgba(0,0,0,0.43);
}


#numbertext{
	height:38px;
	width:114px;
	font-size:22px;
	text-align:center;
	margin-left:12px;

}

.textinputdiv{
	font-size:20px;
	text-align:right;
	margin-right:17px;
	margin-top:25px;
}

.splittercontainer{
	max-width:480px;
	padding:10px;
	padding-top:15px;
	padding-bottom:15px;
	border:2px solid #e3e3e3;
	
	background-color:#f7f7f7;
	
	-webkit-box-shadow: 10px 10px 13px -3px rgba(0,0,0,0.75);
	-moz-box-shadow: 10px 10px 13px -3px rgba(0,0,0,0.75);
	box-shadow: 10px 10px 13px -3px rgba(0,0,0,0.75);
}

.smallnote{
	color:#515151;
	font-size:14px;
}


a#instructions{
	text-decoration:none;
	color:black;
}

#collapse{
	display: none;
}


/* RIGHT SIDE*/
.rightside{

	margin-top:135px;
	float:right;
}

.rightside img{
	
}

.adunitleaderboard{
	margin-bottom:20px;
	/*background-color:blue;*/
}

.adunitrectanglelong{
	width:300px;
	height:600px;
	margin-top:10px;	
	/*background-color:blue;*/
}


/* counter box*/
.counterbox{
	background-color:#444;
	color:white;
	
	
	box-shadow: 0px 0px 12px 1px rgba(0,0,0,0.43);
}
.counterbox .title{
	display:inline-block;
	padding: 10px 0px 10px 10px;
	font-size:14px;
	background-color:#444;

}

.counterbox #counternumber{
	
	display:inline-block;
	background-color:white;
	color:#444;
	width:100px;
	text-align:center;
	padding-top:10px;
	padding-bottom:10px;
	width:100px;
}

.counterbox .explanation{
	display:inline-block;
	padding-left:6px;
	padding-right:12px;
	font-size:14px;
	text-decoration:none;
	color:inherit;
	
}

.thankyounote{
	width:200px;
	font-size: 13px;
	text-align: center;
	margin-left: 20px;
}

.paypalimg{
	width:245px;
	background-image: url("donate-with-paypal.jpg");
    background-color: white;
	
}

.COINWIDGETCOM_CONTAINER.COINWIDGETCOM_BIG > a, .COINWIDGETCOM_CONTAINER.COINWIDGETCOM_BIG > span{
	line-height:1.8em !important;
	box-shadow: 0px 0px 12px 1px rgba(0,0,0,0.43);
}

@media (max-width: 856px){

	.adslot_1 {
		display:none !important;
	}
	
	.adunitresponsive {
		display:none !important;
	}
	
	.adunitleaderboard {
		display:none !important;
	}

	.adunitrectanglelong{
		display:none !important;
	}
	
	.rightside{
		display:none !important;
	}
	
	.main{
		max-width:700px;
	}
	
	.counterbox{
		display:none;
	}
}


.adunitresponsive{
	width:100%;
	height: 100px;
	margin: 0 auto;
	margin-top:10px;
	margin-bottom:10px;
}

/* foot*/
.footer{
	
}

.logoimg{
	float:left;
	clear:both;
}

.gplusouter, .fb-like{
	float:left;
	margin-right:20px;
}

.fb-like{
	margin-left:35px;
}

.privacy {
	float:right;
	font-size:14px;
}

.privacy{
	padding-top: 40px;
	
}

.privacy a{
	color: blue;
	text-decoration:none;
	transition: all 0.65s ease-in-out 0s;
}

.privacy a:hover, .privacy a:focus{
	color: #000000;
}

.copyright{
	font-size:13px;
	color:black;
	text-align:center;
}

.largeparagraph{
	font-size:30px;
}

@media (max-width: 550px){
	
	
	#inputfilename{
		width:97%;
		text-align:center;
	}
	
	form#inputform{
		float:right;
	}
	
	.textinputdiv{
		float:right;
		text-align:justify;
		margin-right:5px;
	}
	
	#numbertext{
		float:right;
		margin-left:25px;
	}
	
	#splitfile{
		margin-right:5px;
	}
	
	.radiogroup{
		margin-top:35px;
		
		text-align:center;
	}
	
	.radioitem{
		float:right;
		margin-bottom:15px;
		font-size:16px !important;
	}

}

/*radio */
.radioform{

}
.radiogroup{
	margin-bottom:15px;
}
.radioitem{
	float:right;
	margin-right:13px;
	font-size:15px;
}

input[type=checkbox]:not(old),
input[type=radio   ]:not(old){
  width     : 2em;
  margin    : 0;
  padding   : 0;
  font-size : 1em;
  opacity   : 0;
}

input[type=checkbox]:not(old) + label,
input[type=radio   ]:not(old) + label{
  display      : inline-block;
  margin-left  : -2em;
  line-height  : 1.5em;
}

input[type=checkbox]:not(old) + label > span,
input[type=radio   ]:not(old) + label > span{
  display          : inline-block;
  width            : 0.875em;
  height           : 0.875em;
  margin           : 0.25em 0.5em 0.25em 0.25em;
  border           : 0.0625em solid rgb(192,192,192);
  border-radius    : 0.25em;
  background       : rgb(224,224,224);
  background-image :    -moz-linear-gradient(rgb(240,240,240),rgb(224,224,224));
  background-image :     -ms-linear-gradient(rgb(240,240,240),rgb(224,224,224));
  background-image :      -o-linear-gradient(rgb(240,240,240),rgb(224,224,224));
  background-image : -webkit-linear-gradient(rgb(240,240,240),rgb(224,224,224));
  background-image :         linear-gradient(rgb(240,240,240),rgb(224,224,224));
  vertical-align   : bottom;
}

input[type=checkbox]:not(old):checked + label > span,
input[type=radio   ]:not(old):checked + label > span{
  background-image :    -moz-linear-gradient(rgb(224,224,224),rgb(240,240,240));
  background-image :     -ms-linear-gradient(rgb(224,224,224),rgb(240,240,240));
  background-image :      -o-linear-gradient(rgb(224,224,224),rgb(240,240,240));
  background-image : -webkit-linear-gradient(rgb(224,224,224),rgb(240,240,240));
  background-image :         linear-gradient(rgb(224,224,224),rgb(240,240,240));
}

input[type=checkbox]:not(old):checked + label > span:before{
  content     : '?';
  display     : block;
  width       : 1em;
  color       : rgb(153,204,102);
  font-size   : 0.875em;
  line-height : 1em;
  text-align  : center;
  text-shadow : 0 0 0.0714em rgb(115,153,77);
  font-weight : bold;
}
input[type=radio]:not(old):checked + label > span > span{
  display          : block;
  width            : 0.5em;
  height           : 0.5em;
  margin           : 0.125em;
  border           : 0.0625em solid rgb(115,153,77);
  border-radius    : 0.125em;
  background       : rgb(153,204,102);
  background-image :    -moz-linear-gradient(rgb(179,217,140),rgb(153,204,102));
  background-image :     -ms-linear-gradient(rgb(179,217,140),rgb(153,204,102));
  background-image :      -o-linear-gradient(rgb(179,217,140),rgb(153,204,102));
  background-image : -webkit-linear-gradient(rgb(179,217,140),rgb(153,204,102));
  background-image :         linear-gradient(rgb(179,217,140),rgb(153,204,102));
}

input[type=radio]:not(old):checked + label > span > span{
  display          : block;
  width            : 0.5em;
  height           : 0.5em;
  margin           : 0.125em;
  border           : 0.0625em solid rgb(115,153,77);
  border-radius    : 0.125em;
  background       : rgb(37,37,37);

}



/*POPUP EXPLAIN*/
 /* Popup container */
.popup {
    position: relative;
    display: inline-block;
    cursor: pointer;
}

/* The actual popup (appears on top) */
.popup .popuptext {
    visibility: hidden;
    width: 180px;
    background-color: #555;
    color: #fff;
    text-align: center;
    border-radius: 6px;
    padding: 8px 0;
    position: absolute;
    z-index: 1;
    bottom: 250%;
    left: -10%;
    margin-left: -135px;
}

/* Popup arrow */
.popup .popuptext::after {
    content: "";
    position: absolute;
    top: 100%;
    left: 50%;
    margin-left: 59px;
    border-width: 5px;
    border-style: solid;
    border-color: #555 transparent transparent transparent;
}

/* Toggle this class when clicking on the popup container (hide and show the popup) */
.popup .show {
    visibility: visible;
    -webkit-animation: fadeIn 1s;
    animation: fadeIn 1s
}

/* Add animation (fade in the popup) */
@-webkit-keyframes fadeIn {
    from {opacity: 0;}
    to {opacity: 1;}
}

@keyframes fadeIn {
    from {opacity: 0;}
    to {opacity:1 ;}
}

