/* WHITE BOX BEHIND THE CONTENT  */
.mainbox{
width: auto;
padding: 5px;
height: auto;
max-width: 420px;
border-radius: 5px;
background-color: #fbfbfb;
margin-left: auto;
margin-right: auto;
box-shadow: 0 0 3px #bbb;
}


textarea{
	width: auto;
	max-width: 400px;
	height: 50px;
	border-radius: 15px;
	border: 1px solid;
	border-color:  #dedede;
	margin-right: auto;
	margin-left: auto;
	padding: 14px;
}

textarea:focus{
outline: none;
}


body{
background: url(img/texture.png);
font-family: 'Lato';
font-weight: lighter;
width: auto;
overflow-x: hidden;
}


/* SUBMIT BUTTON  */

input[type="submit"]{
 background: #9a382f;/* Fallback color for non-css3 browsers */

-webkit-appearance: none;

  font-family: 'Lato', sans-serif;
 border: 0;
 color: #fff;
 cursor: pointer;
 font-weight: lighter;
 font-size: 15px;
 height: 30px;
 margin: 4px 4px 0;
 width: 84px;
 outline: none;
 position: relative;

 /* Rounded Corners */
 border-radius: 6px;
 -webkit-border-radius: 6px;
 -moz-border-radius: 6px;
   border:1px solid #9a382f;

     background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, ##9a382f), color-stop(1, ##9a382f) );
  background:-moz-linear-gradient( center top, #9a382f 5%, #9a382f 100% );
  filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#9a382f', endColorstr='#9a382f');



}

/* TITLE OF THE UPLOADED IMAGE  */

.comment{
	text-align: left;
	width: auto;
	max-width: 360px;
	height: auto;
	background-color: #f4f4f4;
	border: 1px ;
	padding: 20px;
word-wrap: break-word;
	border-radius: 10px;
	box-shadow: 0 0 1px #a3a3a3;

}


/* 'BACK' BUTTON  */

.action{
	width: auto;
	max-width: 400px;
	text-align: left;
	padding: 5px;
    margin-left: 14px;
    opacity: 0.3;
}



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

}

/* visited link */
a:visited {
    color: #232323;
        text-decoration: none;

}

/* mouse over link */
a:hover {
    color: #232323;
        text-decoration: none;

}

/* selected link */
a:active {
    color: #232323;
        text-decoration: none;

}


/* COMMENT INPUT  */

input[type="text"]{
 background: #fff; /* Fallback color for non-css3 browsers */

max-width: 290px;

 border: 0;
 border-bottom: 1px solid #fff;
 border-right: 1px solid rgba(255,255,255,.8);
 font-size: 16px;
 margin: 4px;
 padding: 5px;
 width: 100%;
    border:1px solid #c5c5c5;


 /* Rounded Corners */
 border-radius: 6px;
 -webkit-border-radius: 6px;
 -moz-border-radius: 6px;


}


/* DIRECT LINK / HTML CODE OF THE IMAGE  */

.options{
	text-align: left;
	width: auto;
	max-width: 400px;
	height: auto;
	background-color: #f4f4f4;
	border: 1px ;
word-wrap: break-word;
	border-radius: 10px;
	box-shadow: 0 0 1px #a3a3a3;


}


.options2{
	text-align: left;
	width: auto;
	max-width: 400px;
	height: 50px;
	background-color: #f4f4f4;
	border: 1px ;
word-wrap: break-word;
	border-radius: 10px;
	box-shadow: 0 0 1px #a3a3a3;


}


.inneroptions2{
	
	padding: 10px;
	text-align: center;
}


hr { display: block; height: 1px;
    border: 0; border-top: 1px solid #ccc;
    margin: 1em 0; padding: 0; 
    
    
    }
    
    #img{
	    border: 5px solid #fff;
	    background-color: #fff;
	    box-shadow: 0 0 2px #bbb;
	    border-radius: 15px;
	    width: auto;
	    max-width: 380px;
    }
    
     
     
     /* MAX WIDTH FOR IMAGES ON MOBILE DEVICES  */

    @media only screen and (max-device-width: 480px) { 
	    
	    #img{
		    max-width: 280px;
	    }
	    
	    
    }
    
    
    .progress { 
position:relative; 
top:12px;
width:280px;
border: 1px solid #fbfbfb;
padding: 1px;
background-color: #fbfbfb;
border-radius: 5px; 
}  
 .bar {
 background-color: #9a382f;
  width:0%;
   height:10px;
    border-radius: 5px;
     }  
 .percent { 
 position:absolute;
  display:inline; 
  font-size: 10px;
  left:48%; 
  top:-1px;
  color: #fbfbfb;
  }  



button[type="submit"]{
 background: #9a382f;/* Fallback color for non-css3 browsers */

-webkit-appearance: none;

  font-family: 'Lato', sans-serif;
 border: 0;
 color: #fff;
 cursor: pointer;
 font-weight: lighter;
 font-size: 15px;
 line-height: 25px;
 height: 30px;
 margin: 4px 4px 0;
 width: 84px;
 outline: none;
 position: relative;

 /* Rounded Corners */
 border-radius: 6px;
 -webkit-border-radius: 6px;
 -moz-border-radius: 6px;
   border:1px solid #9a382f;

     background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, ##9a382f), color-stop(1, ##9a382f) );
  background:-moz-linear-gradient( center top, #9a382f 5%, #9a382f 100% );
  filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#9a382f', endColorstr='#9a382f');



}