
@media screen and (min-width: 840px) {
input#upload {  background: url(img/bg_input_blue_up.png) repeat-x scroll left center #0678c2; color:#FFF;border: 1px solid #035083; 
padding: 6px 18px; font-size: 13px; font-weight: bold; font-family: "Open Sans", Verdana, sans-serif;
-moz-border-radius: 7px; -webkit-border-radius: 7px; -khtml-border-radius: 7px; border-radius: 7px; cursor: pointer; margin: 0px 0px 0px 0px; float:left; }
input#upload:hover { background: url(img/bg_input_blue_hover.png) repeat-x scroll left center #0678c2; color: #fff; border: 1px solid #035083;}


/*custom upload elements*/
.customfile-input { position: absolute; height: 100px; cursor: pointer; background: transparent; border: 0; opacity: 0; -moz-opacity: 0; filter:progid:DXImageTransform.Microsoft.Alpha(opacity=0); z-index: 999;  }

.customfile { width: 420px; background: #e8eef4; cursor: pointer; overflow: hidden; padding: 0px; border: 1px solid #8fa4b2; -moz-border-radius:7px; -webkit-border-radius:7px; border-radius:7px;  position: relative; float:left; margin-right:15px; }
.customfile-disabled { opacity: .5; filter:progid:DXImageTransform.Microsoft.Alpha(opacity=0); cursor: default;  }
.customfile-feedback { display: block; margin: 0px 0px 0px 5px; font-size: 14px; color: #fff; font-style: normal; padding: 0.3em 0em 0.3em 0.6em; }
.customfile-feedback-populated { color: #404040; font-style: normal; font-weight: normal; padding-left: 8px; width:320px; height:22px; overflow:hidden; }

.customfile-button { border: 0px solid #999; background: #67bd3c url(img/bg_input_green_up.png) center repeat-x;  color: #fff; font-weight: normal; float: right; padding: .3em 1.2em .3em 1.2em;  text-align: center; text-decoration: none;  font-size: 13px; text-indent:0px; 
-moz-border-radius-topleft: 0px; border-top-left-radius: 0px; -webkit-border-top-left-radius: 0px; -khtml-border-radius-topleft: 0px; 
-moz-border-radius-topright: 5px; border-top-right-radius: 5px; -webkit-border-top-right-radius: 5px; -khtml-border-radius-topright: 5px;
-moz-border-radius-bottomleft: 0px; border-bottom-left-radius: 0px; -webkit-border-bottom-left-radius: 0px; -khtml-border-radius-bottomleft: 0px; 
-moz-border-radius-bottomright: 5px; border-bottom-right-radius: 5px; -webkit-border-bottom-right-radius: 5px; -khtml-border-radius-bottomright: 5px;-webkit-transition: all 0.2s ease-out; -moz-transition: all 0.2s ease-out; -o-transition: all 0.2s ease-out; -ms-transition: all 0.2s ease-out;


  }
  
 }
.customfile-hover .customfile-button  { color:#404040; background: #67bd3c  url(img/bg_input_green_hover.png) center repeat-x; border-color:#aaa; }
.customfile-focus .customfile-button  { color:#fff; background: #67bd3c  url(img/bg_input_green_up.png) center repeat-x; border-color:#aaa; }
.customfile-focus .customfile-button { outline: none;  }

/*file type icons*/
.customfile-ext-jpg, .customfile-ext-gif, .customfile-ext-png, .customfile-ext-jpeg, .customfile-ext-bmp { background-image: url(../images/icon-image.gif);}
.customfile-ext-mp3, .customfile-ext-mp4, .customfile-ext-mov, .customfile-ext-swf, .customfile-ext-wav, .customfile-ext-m4v { background-image: url(../images/icon-media.gif);}
.customfile-ext-zip, .customfile-ext-tar, .customfile-ext-sit { }

@media screen and (max-width: 768px) {

input#upload { margin: 10px 0px 0px 0px; float:none; }
.customfile { width: 420px; float:none; margin-right:0px; }

}

@media screen and (max-width: 640px) {

input#upload { margin: 10px 0px 0px 0px; float:none; }
.customfile { width: 100%; max-width:100%; float:none; margin-right:0px; }

}