/* CSSTidy 1.3: Tue, 20 Jan 2015 22:38:03 -0800 */
html {
height:100%
}

body {
width:100%;
height:100%;
background:#fff;
color:#000;
font:normal 11px/13px Verdana, Arial, Helvetica, sans-serif
}

address {
font-style:normal
}

img,fieldset {
border:0
}

input,select,textarea,button {
font:normal 11px/13px Verdana, Arial, Helvetica, sans-serif
}

@font-face {
font-family:Lato;
font-style:normal;
font-weight:400;
src:local('Lato Regular'), local(Lato-Regular), url(../fonts/9k-RPmcnxYEPm8CNFsH2gg.woff) format(woff)
}

.middle {
background:#f4f3f4
}

.element-hidden {
display: none;
}

.resultlink a {
text-decoration:none;
font-family:Lato,'helvetica neue', helvetica-neue, helvetica, arial, sans-serif;
font-size:17px;
font-weight:700;
color:#4c4c4c
}

.resultlink a:hover {
color:#0064ca
}

.resultlink img {
margin-bottom:5px
}

.resultlink span {
font-family:Verdana,Arial;
font-size:11px;
color:#888;
font-weight:400
}

#savetoweb-results {
width:700px;
display:none
}

#socialbar {
width:600px;
height:30px;
margin-left:20px;
margin-top:10px
}

#socialbar img {
margin-right:10px
}

#directbar {
width:600px;
margin-left:20px;
margin-top:10px;
margin-bottom:20px
}

#directurl {
font-family:Verdana, Geneva, sans-serif;
font-size:12px;
color:#333;
background:#FFF;
border:1px solid #BBB;
-moz-box-shadow:inset 0 1px 1px rgba(0,0,0,0.15);
-webkit-box-shadow:inset 0 1px 1px rgba(0,0,0,0.15);
box-shadow:inset 0 1px 1px rgba(0,0,0,.15);
-moz-border-radius:3px;
-webkit-border-radius:3px;
border-radius:3px;
width:450px;
padding:5px 4px
}



#content-top {
max-width:970px;
margin:0 auto;
padding:25px 0 0
}

#content-top h1 {
box-sizing:border-box;
color:#0e0e0e;
direction:ltr;
display:block;
font-family:'Open Sans', Arial, sans-serif;
font-size:36px;
font-weight:200;
letter-spacing:-1px;
line-height:44px;
text-align:center;
margin:0
}

#content-top p {
box-sizing:border-box;
color:#777;
direction:ltr;
display:block;
font-family:'Open Sans', Arial, sans-serif;
font-size:20px;
font-weight:300;
text-align:center;
line-height:22px;
margin:0 0 20px
}

#content-middle {
width:742px;
padding-top:25px;
padding-bottom:25px;
margin:0 auto
}

#content-bottom {
max-width:970px;
height:100px;
margin:0 auto
}

.top-title {
height:50px;
text-align:center;
margin:0
}

.top-title span {
line-height:34px;
height:34px;
font-family:Lato,'helvetica neue', helvetica-neue, helvetica, arial, sans-serif;
font-size:30px;
font-weight:strong
}

.top-title strong {
font-family:Lato,'helvetica neue', helvetica-neue, helvetica, arial, sans-serif;
font-size:15px;
line-height:18px;
color:gray
}

.top-title img {
height:58px;
position:relative;
margin:0 auto -58px
}

#counter {
color:#096fb9;
display:inline
}

.top-google-ad {
text-align:center
}

#header {
height:60px;
padding:0
}

.header-right {
float:right;
margin:0
}

.copy-right li a {
text-decoration:none;
color:#707070
}

.header-right h3 {
font-size:11px;
font-weight:400;
text-align:right;
margin:15px 0 0;
padding:0 0 4px
}

.header-right h3 span {
font-family:arial, sans-serif;
font-size:12px
}

.header-right h3 a {
border:1px solid #EEE;
border-bottom-left-radius:3px 3px;
border-bottom-right-radius:3px 3px;
border-top-left-radius:3px 3px;
border-top-right-radius:3px 3px;
color:#166CD6;
display:inline-block;
margin-left:3px;
text-decoration:none;
vertical-align:middle;
padding:3px
}

.header-right h3 a:hover {
background:#FFFAE7;
border:1px solid #FFEA96;
color:#004E92
}

.header-right h3 img {
border:0;
margin-right:3px;
vertical-align:top
}

.header-right .active {
background:#C8E6FF;
border:1px solid #A4D1F8;
color:#000;
font-weight:700
}

.logo {
float:left;
margin:0;
padding:0
}

.logo a {
float:left
}

#quick-note {
width:692px;
text-align:center;
margin-bottom:10px;
border:#ffea96 solid 1px;
background:#fffae7;
margin-top:-20px;
padding:5px
}

.padding {
padding:0 18px 10px
}

#content-middle .contentfooter {
margin-top:-5px
}

.footer-top {
padding:15px 0
}

.footer-top h3 {
font-size:11px;
line-height:1.75;
color:#333;
font-weight:600;
margin:0
}

.footer-top a {
text-decoration:none
}

.footer-top ul {
padding:0
}

.footer-left {
font-family:"Myriad Set Pro","Lucida Grande","Helvetica Neue",Helvetica,Arial,Verdana,sans-serif;
font-size:11px;
width:270px;
float:left;
color:#999
}

.footer-left a {
color:#999
}

.footer-left a:hover {
color:#333
}

.footer-right {
min-width:600px;
float:left
}

.footer-right .footer-navigation {
padding-left:20px;
width:130px;
float:left;
font-family:"Myriad Set Pro","Lucida Grande","Helvetica Neue",Helvetica,Arial,Verdana,sans-serif;
font-size:11px;
color:#666;
line-height:1.48em
}

.footer-navigation a {
text-decoration:none;
color:#999;
line-height:1.5
}

.footer-navigation a:hover {
color:#666
}

.footer-right .footer-navigation ul {
list-style-type:none
}

.copy-nav {
color:#5a5a5a;
font-size:11px;
text-align:right
}

.copy-left {
color:#5a5a5a;
font-size:11px;
text-align:left
}

.copy-left li {
display:inline;
padding-left:2px
}

.twitter {
float:left;
height:25px;
width:94px;
margin:0 0 0 8px
}

.google {
float:left;
height:25px;
width:71px;
margin:0 0 0 10px
}

.facebook {
float:left;
height:25px;
width:75px;
margin:0
}

.fblink {
float:left;
height:25px
}

.row {
overflow:hidden;
padding:0 0 0 45px
}

.common-resize {
font:normal 13px/15px Lato, sans-serif
}

.common-resize h2 {
font-weight:700;
font-size:28px;
line-height:20px;
margin:0;
padding:0
}

.common-resize .step-1 h2 {
float:left;
color:#727272;
font-family:'Titillium Web', sans-serif
}

.common-resize .step-1 .formfield {
width:400px;
margin:3px 0 0
}

.common-resize .step-1 #showit {
margin:0 0 0 138px
}

.common-resize .step-1 .loading-quick {
text-align:right;
float:right;
font-size:12px;
font-family:Arial, sans-serif;
margin:0 118px 0 0;
padding:3px 0 0
}

.common-resize .step-1 .loading-bar2 {
postition:absolute;
float:right;
margin:0 118px 0 0;
padding:3px 0 0
}

.common-resize .step-1 .quick-link2 {
font:normal 10px/12px Verdana, Arial, Helvetica, sans-serif;
float:right;
position:relative;
margin:0 118px 0 0;
padding:3px 0 0
}

.common-resize .step-2 {
margin-top:30px
}

.common-resize .step-2 .row select {
width:81px;
height:22px;
font-size:13px;
border:solid #7f9db9 1px;
margin:0;
padding:0
}

.common-resize .step-2 .row-resize select {
width:300px;
height:25px;
font-size:18px;
border:solid #7f9db9 1px;
margin:0;
padding:0
}

.common-resize .step-2 .row label {
padding:0 0 0 11px
}

.common-resize .choose-percent {
overflow:hidden;
padding:10px 0
}

.common-resize .choose-percent li {
width:24%;
line-height:16px;
float:left
}

.common-resize .choose-percent label {
font-weight:none
}

.option-effect {
float:left;
width:620px;
font-size:15px;
border:#FFEA96 solid 1px;
background:#FFFAE7;
margin-top:10px;
display:none;
padding:15px
}

.option-effect span {
font-size:13px;
margin-left:20px
}

.common-resize .special-effect {
height:20px;
width:160px;
float:left;
padding:10px 0 0
}

.common-resize .special-effect span {
border-bottom:1px dotted;
cursor:pointer
}

.common-resize .effects,.common-resize .effects li {
list-style-type:none;
height:20px;
margin:0;
padding:0
}

.common-resize .effects {
padding:10px 0 0
}

.common-resize .effects li {
width:23%;
float:left
}

.common-resize .effects li span {
border-bottom:1px dotted
}

.common-resize .step-4 label,.common-resize .step-4 span label {
font-size:13px;
font-family:Arial, sans-serif
}

.common-resize .step-4 select {
width:70px;
height:22px;
font-size:13px;
border:solid #7f9db9 1px;
margin:0 16px 0 3px;
padding:0
}

.common-resize .step-4 p {
margin:0;
padding:10px 0 0
}

.common-resize .step-0 h2 {
float:left;
color:#727272;
padding:6px 15px 0 0
}

.common-resize .step-0 h3 {
font-size:9px;
font-weight:700;
margin:0;
padding:0
}

.common-resize .step-0 p {
font-size:9px;
margin:0;
padding:0 0 12px
}

.common-resize .step-0 .float-left {
width:140px;
float:left;
position:absolute
}

.common-resize .step-0 .float-right {
margin-top:-25px;
width:550px;
float:right
}

.common-resize .step-0 .float-right p {
font-size:12px;
font-family:arial, sans-serif
}

.common-resize .step-0 .formbutton {
font-size:14px;
margin-top:7px
}

.crop {
font:normal 13px/15px "Trebuchet MS", Helvetica, sans-serif
}

.multi-title {
background:url(gfx/step_one.gif) no-repeat;
font:normal 13px/15px "Trebuchet MS", Helvetica, sans-serif;
padding:0 0 0 45px
}

.multi-title h2 {
font-weight:700;
font-size:18px;
line-height:36px;
margin:0;
padding:0
}

.multi-title .back-link {
font-size:9px;
float:right;
padding:10px 0 0
}

.add-files {
padding:0 0 20px 45px
}

.formfield {
background:#fff;
color:#666;
border:outset 1px #ccc;
font-size:14px;
font-weight:700;
padding:1px 2px
}

.continuebutton {
height:30px;
background:#666 url(/gfx/formbg.gif) repeat-x left top;
color:#000;
cursor:pointer;
border:outset 1px #ccc;
font-size:14px;
font-weight:700;
padding:2px 10px
}

.formbutton {
height:22px;
background:#666 url(/gfx/formbg.gif) repeat-x left top;
color:#000;
cursor:pointer;
border:outset 1px #ccc;
font-size:12px;
font-weight:700;
padding:2px
}

.barbutton {
width:120px;
height:22px;
background:#666 url(/gfx/formbg.gif) repeat-x left top;
color:#000;
cursor:pointer;
border:outset 1px #ccc;
font-size:12px;
font-weight:700;
margin-top:4px;
padding:2px
}

#quick {
padding:20px 0 0
}

.hide {
display:none
}

.status {
color:red;
font:bold 16px/18px "Trebuchet MS", Helvetica, sans-serif;
text-align:center
}

.status p {
margin:0;
padding:0 0 10px
}

.file_list {
width:80%;
font:Trebuchet MS;
font-size:small
}

a {
text-decoration:none;
color:#096fba
}

a.tooltip span {
display:none;
margin-left:8px;
width:250px;
font-family:Verdana;
font-size:11px;
padding:2px 3px
}

a.tooltip:hover span {
display:inline;
position:absolute;
background:#fff;
border:1px solid #ccc;
color:#6c6c6c
}

div.flash {
width:375px;
padding-bottom:10px;
margin:3px 0
}

.progressName {
font-size:8px;
color:#000;
width:70px;
height:14px;
text-align:left;
white-space:nowrap;
overflow:hidden
}

.progressBarInProgress,.progressBarComplete,.progressBarError {
font-size:0;
width:0;
height:2px;
background-color:#40a52b;
margin-top:2px
}

.progressBarComplete {
width:100%;
background-color:green;
visibility:hidden
}

.progressBarError {
width:100%;
background-color:red;
visibility:hidden
}

.progressBarStatus {
font-size:10px;
text-align:center;
line-height:12px;
}

a.progressCancel {
font-size:0;
display:block;
height:12px;
width:12px;
background-image:url(/picresize-assets/gfx/cancel.png);
background-repeat:no-repeat;
/*background-position:-14px 0;*/
float:right
}

.progressWrapper {
width:70px;
overflow:hidden;
float:left;
}

.progressContainer {
border:solid 1px #ccc;
background-color:#F7F7F7;
overflow:hidden;
margin:3px;
padding:2px;
border-radius:5px;
}

.success_message {
text-align:center;
background:#E8FFDD;
border:1px dotted green;
padding:10px
}

.red {
border:solid 1px #B50000;
background-color:#FFEBEB
}

.green {
border:solid 1px #afe14c;
background-color:#E8FFDD
}

.blue {
border:solid 1px #CEE2F2;
background-color:#F0F5FF
}

.speedstat {
font-size:12px;
font-weight:700;
margin:5px 0
}

.track {
background-color:#aaa;
position:relative;
height:.5em;
width:10em;
cursor:pointer;
z-index:0
}

.slider_handle {
background-image:url(gfx/knob.gif);
position:absolute;
height:20px;
width:18px;
top:-5px;
left:-10px;
cursor:move;
z-index:2
}

#header,.footer-top,.row,.common-resize .choose-percent,.common-resize .effects,.common-resize .step-0,.crop-upload,.crop-form fieldset {
_zoom:1
}

.menubar {
width:130px
}

.menubar .menubartop {
width:130px;
height:45px;
color:#000;
background:url(/gfx/menubar_topbg.gif) no-repeat top
}

.menubar .menubartext {
width:100%;
font-family:"Trebuchet MS", Helvetica, sans-serif;
color:#2b65a5;
font-size:15px;
font-weight:700;
padding-top:13px;
text-align:center
}

.menubar .menubarmid {
width:130px;
background:url(/gfx/menubar_midbg.gif) repeat-y left top;
font-family:arial, sans-serif;
font-size:11px;
padding:6px
}

.menubar .menubarbot {
width:130px;
height:20px;
background:url(/gfx/menubar_botbg.gif) no-repeat bottom
}

#customrow select {
height:22px;
font-size:13px;
border:solid #7F9DB9 1px;
margin:0;
padding:0
}

.continue-button {
width:285px;
background:url(../images/button.png) repeat-x;
display:block;
height:46px;
line-height:46px;
text-decoration:none;
font-size:13px;
color:#b67400;
text-shadow:0 1px 0 #fff297;
font-weight:700;
border:none;
clear:both;
font-family:Lato, Arial, sans-serif;
float:right;
margin-top:-25px;
margin-right:35px;
padding:0 0 0 24px
}

.continue-button a {
float:left;
text-decoration:none;
color:#b67400
}

.continue-button:hover {
opacity:0.8;
-moz-transition:opacity .3s;
-webkit-transition:opacity .3s;
transition:opacity .3s
}

.continue-button strong {
color:#714904;
font-size:18px;
font-weight:700;
font-family:Lato, sans-serif
}

.continue-button span {
background:url(../images/button-right.png) no-repeat;
height:46px;
width:33px;
margin-right:-33px;
float:right
}

.right {
float:right!important
}

.browsebutton {
float:right!important;
top:-44px;
right:31px;
position:relative;
z-index:5000;
display:block;
width:114px;
height:32px;
background-image:url(../images/browse-button.png);
background-repeat:no-repeat;
background-position:right;
border:none;
margin:0;
padding:0
}

.browsebutton.hover {
background-image:url(../images/browse-button-hover.png)
}

.left {
float:left!important
}

.clear {
clear:both!important
}

#im_fetch {
width:650px;
height:51px;
line-height:51px;
background:url(../images/browse.png) repeat-x;
-webkit-border-radius:4px;
-moz-border-radius:4px;
border-radius:4px;
border:solid 1px #cbe2ee;
color:#8ea8b5;
font-size:16px;
text-indent:25px;
-moz-box-shadow:0 1px 1px #fff;
-webkit-box-shadow:0 1px 1px #fff;
box-shadow:0 1px 1px #fff;
font-family:Lato, sans-serif;
font-weight:700;
display:none;
margin:-6px 0 32px 33px
}

#clipboard {
margin-bottom:20px;
display:none
}

#browse.hover {
color:red;
border-color:red;
border-style:dashed
}

#browse.target {
color:#18b208;
background:#ebfce9;
border-color:#18b208;
border-style:dashed
}

span#stylefileinput-im_file {
position:relative;
display:block;
line-height:32px;
cursor:pointer
}

span#stylefileinput-im_file span {
position:absolute;
display:block;
top:0;
overflow:hidden;
z-index:1;
width:114px;
height:32px;
opacity:0;
filter:alpha(opacity=0)
}

span#stylefileinput-im_file span input {
position:absolute;
left:-90px;
height:32px;
width:200px;
cursor:pointer
}

span#stylefileinput-im_file input.stylefileinput-button {
display:block;
width:114px;
height:32px;
text-indent:-999em;
background:url(../images/browse-button.png) 0 0 no-repeat;
border:none;
z-index:9999;
margin:0;
padding:0
}

span#stylefileinput-im_file input.stylefileinput-button.hover {
background:url(../images/browse-button-hover.png) 0 0 no-repeat
}

span#stylefileinput-im_file strong {
position:absolute;
bottom:5px;
left:50px;
font-size:14px
}

span#stylefileinput-im_file a {
position:absolute;
top:10px;
left:50px;
font-size:12px
}

.number {
width:47px;
height:47px;
background:url(../images/step.png) no-repeat;
display:block;
text-align:center;
line-height:50px;
font-size:26px;
color:#fff;
text-shadow:0 -1px 0 #4288ab;
position:relative;
right:35px
}

.numberh2 {
font-size:28px;
color:#2385b8;
position:relative;
top:-40px;
left:32px
}

form ul {
list-style:none;
margin:-37px 11px 0 0
}

form ul li {
margin-right:8px
}

.form-button {
height:24px;
color:#246079;
line-height:24px;
text-decoration:none;
display:block;
text-shadow:0 1px 0 #fff;
background:url(../images/form-area-button.png) repeat-x;
webkit-border-radius:4px;
-moz-border-radius:4px;
border-radius:4px;
border:solid 1px #b5d6e6
}

.form-button:hover {
-moz-box-shadow:inset 0 0 1px #f6fcff;
-webkit-box-shadow:inset 0 0 1px #f6fcff;
box-shadow:inner 0 0 1px #f6fcff;
border:solid 1px #97bcce
}

#url {
background:url(../images/link.png) no-repeat 13% 51%
}

#clip {
background:url(../images/clipboard.png) no-repeat 9% 58%
}

.form-button.current {
color:#246079;
border:solid 1px #97bcce;
background:#FFF!important;
-webkit-border-radius:4px;
-moz-border-radius:4px;
border-radius:4px;
-moz-box-shadow:inset 0 0 1px #e3f4fd, 0 1px 1px #c3dfed;
-webkit-box-shadow:inset 0 0 1px #e3f4fd, 0 1px 1px #c3dfed;
box-shadow:inner 0 0 1px #e3f4fd, 0 1px 1px #c3dfed
}

.form-button span {
display:block;
background:url(../images/screen.png) no-repeat 8% 62%;
text-indent:17px;
padding:0 12px
}

.resize-tab {
line-height:13px;
font-size:11px;
color:#666;
border:none;
float:left;
text-shadow:0 1px 0 #FFF
}

.resize-tab a {
color:#06a2f6
}

.rotating {
display:inline-block;
-webkit-transform-style:preserve-3d;
-moz-transform-style:preserve-3d;
-ms-transform-style:preserve-3d;
-o-transform-style:preserve-3d;
transform-style:preserve-3d;
-webkit-transform:rotateX(0) rotateY(0) rotateZ(0);
-moz-transform:rotateX(0) rotateY(0) rotateZ(0);
-ms-transform:rotateX(0) rotateY(0) rotateZ(0);
-o-transform:rotateX(0) rotateY(0) rotateZ(0);
transform:rotateX(0) rotateY(0) rotateZ(0);
-webkit-transition:.5s;
-moz-transition:.5s;
-ms-transition:.5s;
-o-transition:.5s;
transition:.5s;
-webkit-transform-origin-x:50%
}

.rotating.flip {
position:relative
}

.rotating .front,.rotating .back {
left:0;
top:0;
-webkit-backface-visibility:hidden;
-moz-backface-visibility:hidden;
-ms-backface-visibility:hidden;
-o-backface-visibility:hidden;
backface-visibility:hidden
}

.rotating .front {
position:absolute;
display:inline-block;
-webkit-transform:translate3d(0,0,1px);
-moz-transform:translate3d(0,0,1px);
-ms-transform:translate3d(0,0,1px);
-o-transform:translate3d(0,0,1px);
transform:translate3d(0,0,1px)
}

.rotating.flip .front {
z-index:1
}

.rotating .back {
display:block;
opacity:0
}

.rotating.spin {
-webkit-transform:rotate(360deg) scale(0);
-moz-transform:rotate(360deg) scale(0);
-ms-transform:rotate(360deg) scale(0);
-o-transform:rotate(360deg) scale(0);
transform:rotate(360deg) scale(0)
}

.rotating.flip .back {
z-index:2;
display:block;
opacity:1;
-webkit-transform:rotateY(180deg) translate3d(0,0,0);
-moz-transform:rotateY(180deg) translate3d(0,0,0);
-ms-transform:rotateY(180deg) translate3d(0,0,0);
-o-transform:rotateY(180deg) translate3d(0,0,0);
transform:rotateY(180deg) translate3d(0,0,0)
}

.rotating.flip.up .back {
-webkit-transform:rotateX(180deg) translate3d(0,0,0);
-moz-transform:rotateX(180deg) translate3d(0,0,0);
-ms-transform:rotateX(180deg) translate3d(0,0,0);
-o-transform:rotateX(180deg) translate3d(0,0,0);
transform:rotateX(180deg) translate3d(0,0,0)
}

.rotating.flip.cube .front {
-webkit-transform:translate3d(0,0,100px) scale(0.9,0.9);
-moz-transform:translate3d(0,0,100px) scale(0.85,0.85);
-ms-transform:translate3d(0,0,100px) scale(0.85,0.85);
-o-transform:translate3d(0,0,100px) scale(0.85,0.85);
transform:translate3d(0,0,100px) scale(0.85,0.85)
}

.rotating.flip.cube .back {
-webkit-transform:rotateY(180deg) translate3d(0,0,100px) scale(0.9,0.9);
-moz-transform:rotateY(180deg) translate3d(0,0,100px) scale(0.85,0.85);
-ms-transform:rotateY(180deg) translate3d(0,0,100px) scale(0.85,0.85);
-o-transform:rotateY(180deg) translate3d(0,0,100px) scale(0.85,0.85);
transform:rotateY(180deg) translate3d(0,0,100px) scale(0.85,0.85)
}

.rotating.flip.cube.up .back {
-webkit-transform:rotateX(180deg) translate3d(0,0,100px) scale(0.9,0.9);
-moz-transform:rotateX(180deg) translate3d(0,0,100px) scale(0.85,0.85);
-ms-transform:rotateX(180deg) translate3d(0,0,100px) scale(0.85,0.85);
-o-transform:rotateX(180deg) translate3d(0,0,100px) scale(0.85,0.85);
transform:rotateX(180deg) translate3d(0,0,100px) scale(0.85,0.85)
}

.progress-button {
position:relative;
display:inline-block;
text-align:center;
min-width:250px;
margin-top:10px;
float:right;
left:94px
}

.progress-button button {
display:block;
width:250px;
height:70px;
border:2px solid #0079c0;
border-radius:40px;
background:transparent;
color:#0079c0;
letter-spacing:0;
font-size:20px;
font-family:Lato, sans-serif;
-webkit-tap-highlight-color:transparent;
-webkit-transition:background-color .3s color .3s width .3s border-width .3s border-color .3s;
transition:background-color .3s color .3s width .3s border-width .3s border-color .3s;
margin:0 auto;
padding:0
}

.progress-button button:hover {
background-color:#0079c0;
color:#fff;
cursor:pointer
}

.progress-button button span {
-webkit-transition:opacity .3s .1s;
transition:opacity .3s .1s
}

.progress-button svg {
position:absolute;
top:0;
left:50%;
-webkit-transform:translateX(-50%);
transform:translateX(-50%);
pointer-events:none
}

.progress-button svg path {
opacity:0;
fill:none
}

.progress-button svg.progress-circle path {
stroke:#0079c0;
stroke-width:5
}

.progress-button svg.checkmark path,.progress-button svg.cross path {
stroke:#fff;
stroke-linecap:round;
stroke-width:4;
-webkit-transition:opacity .1s;
transition:opacity .1s
}

.loading.progress-button button {
width:70px;
background-color:transparent;
color:#fff;
border-color:#ddd;
border-width:5px
}

.loading.progress-button span {
-webkit-transition:opacity .15s;
transition:opacity .15s
}

.loading.progress-button span,.success.progress-button span,.error.progress-button span {
opacity:0
}

.success.progress-button button,.error.progress-button button {
-webkit-transition:background-color .3s width .3s border-width .3s;
transition:background-color .3s width .3s border-width .3s
}

.success.progress-button button {
background-color:#0079c0;
border-color:#0079c0
}

.error.progress-button button {
background-color:#FB797E;
border-color:#FB797E
}

.loading.progress-button svg.progress-circle path,.success.progress-button svg.checkmark path,.error.progress-button svg.cross path {
opacity:1;
-webkit-transition:stroke-dashoffset .3s;
transition:stroke-dashoffset .3s
}

.elastic.progress-button button {
-webkit-transition:background-color .3s color .3s width .3s cubic-bezier(0.25,0.25,0.4,1.6), border-width .3s border-color .3s;
transition:background-color .3s color .3s width .3s cubic-bezier(0.25,0.25,0.4,1.6), border-width .3s border-color .3s
}

.loading.elastic.progress-button button {
-webkit-transition:background-color .3s color .3s width .3s cubic-bezier(0.6,-0.6,0.75,0.75), border-width .3s border-color .3s;
transition:background-color .3s color .3s width .3s cubic-bezier(0.6,-0.6,0.75,0.75), border-width .3s border-color .3s
}

.zetta-menu {
font-family:Lato, sans-serif;
font-size:16px;
z-index:9999999!important
}

.language-menu {
color:#333;
font-weight:600;
line-height:1.75;
font-size:12px;
float:left;
background-color:transparent;
font-family:"Myriad Set Pro","Lucida Grande","Helvetica Neue",Helvetica,Arial,Verdana,sans-serif
}

.sample {
width:50px;
height:50px;
background-size:cover;
display:block;
border-radius:25px;
-webkit-border-radius:25px;
-moz-border-radius:25px;
float:left;
margin-right:5px;
cursor:pointer
}

.sample-puppy {
background-image:url(http://picresize.com/gfx/sample_puppy.png)
}

.sample-puppy:hover {
background-image:url(http://picresize.com/gfx/sample_puppy_edit.png)
}

.sample-boston {
background-image:url(http://picresize.com/gfx/sample_boston.png)
}

.sample-boston:hover {
background-image:url(http://picresize.com/gfx/sample_boston_edit.png)
}

.sample-flowers {
background-image:url(http://picresize.com/gfx/sample_flowers.png)
}

.sample-flowers:hover {
background-image:url(http://picresize.com/gfx/sample_flowers_edit.png)
}

body,div,a,span,img,fieldset,form,label,.footer-right p {
margin:0;
padding:0
}

#socialbar span,#directbar span {
font-family:Lato,'helvetica neue', helvetica-neue, helvetica, arial, sans-serif;
font-size:20px;
font-weight:700;
color:gray;
text-shadow:0 1px 0 #FFF;
line-height:32px;
padding-right:10px;
float:left
}

.top-title span,.top-title strong,.top-title img,.logo img,.quick,.show {
display:block
}

.copy-right li a:hover,.footer-top a:hover,a:hover {
text-decoration:underline
}

.header-right h3 map,.copy-nav li {
display:inline
}

.footer-top ul,.footer-top li,.copy-nav,.copy-nav li,.common-resize .choose-percent,.common-resize .choose-percent li {
list-style-type:none;
margin:0;
padding:0
}

.copy-nav li img,.common-resize .step-1 .quick-link img {
vertical-align:bottom
}

.copy-left li img,.common-resize .step-2 .row label input {
vertical-align:top
}

.row-resize,.crop-form fieldset {
overflow:hidden
}

.quick-link:focus,.progress-button button:focus {
outline:none
}

.common-resize .step-2 h2,.common-resize .step-3 h2,.common-resize .step-4 h2 {
color:#727272;
padding:6px 15px 0 0
}

.common-resize .step-2 h2 span,.common-resize .step-3 h2 span,.common-resize .step-0 h2 span {
color:#000;
font:normal 11px/12px Arial, Helvetica, sans-serif;
display:block
}

.common-resize .step-2 .row select,.common-resize .step-2 .row input,.common-resize .step-2 .row label,.crop-form select,.crop-form input,.crop-form label,.crop-size span,.crop-size input,.crop-size label {
vertical-align:middle
}

.common-resize .step-2 #custom-width,.common-resize .step-2 #custom-height,.common-resize .special-effect #color,.common-resize .effects #color {
width:46px;
height:16px;
font-size:13px;
line-height:16px;
border:solid #7f9db9 1px;
margin:0;
padding:2px
}

.common-resize .step-3 h2 .optionaltext,.common-resize .step-0 h2 .optionaltext {
font:normal 11px Arial, sans-serif;
color:gray;
display:inline;
padding:0 0 0 5px
}

.common-resize .special-effect .framecolor,.common-resize .effects li .framecolor {
padding:0 0 0 22px
}

.filechooser,.button {
font-size:14px;
border:1px solid #000
}

/*a.progressCancel:hover,span#stylefileinput-im_file input.stylefileinput-button.active {
background-position:0 0
}*/

#clipboardbar,#browse {
width:650px;
height:51px;
line-height:51px;
background:url(../images/browse.png) repeat-x;
-webkit-border-radius:4px;
-moz-border-radius:4px;
border-radius:4px;
border:solid 1px #cbe2ee;
color:#8ea8b5;
font-size:16px;
text-indent:25px;
-moz-box-shadow:0 1px 1px #fff;
-webkit-box-shadow:0 1px 1px #fff;
box-shadow:0 1px 1px #fff;
font-family:Lato, sans-serif;
font-weight:700;
margin:-6px 0 0 33px
}

/* Alerts added 2-14-15 */

.alert {
  font: normal 13px/15px Lato, sans-serif;
  padding: 8px 35px 8px 14px;
  margin-bottom: 18px;
  text-shadow: 0 1px 0 rgba(255, 255, 255, 0.5);
  background-color: #fcf8e3;
  border: 1px solid #fbeed5;
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;
  color: #c09853;
}
.alert-heading {
  color: inherit;
}
.alert .close {
  position: relative;
  top: -2px;
  right: -21px;
  line-height: 18px;
}
.alert-success {
  background-color: #dff0d8;
  border-color: #d6e9c6;
  color: #468847;
}
.alert-danger,
.alert-error {
  background-color: #f2dede;
  border-color: #eed3d7;
  color: #b94a48;
}
.alert-info {
  background-color: #d9edf7;
  border-color: #bce8f1;
  color: #3a87ad;
}
.alert-block {
  padding-top: 14px;
  padding-bottom: 14px;
}
.alert-block > p,
.alert-block > ul {
  margin-bottom: 0;
}
.alert-block p + p {
  margin-top: 5px;
}

.breadcrumbs {
    color: #727272;
    font-family: 'Titillium Web', sans-serif;
    font-size: 28px;
    font-weight:700;
    text-shadow: 0px 1px 0px white;
}

.batch-status {
    color: #727272;
    font-family: 'Titillium Web', sans-serif;
    font-size: 28px;
    font-weight:700;
    text-shadow: 0px 1px 0px white;
}

.batch-option {
    font-family: Lato, sans-serif;
    font-size: 16px;
    font-weight:700;
    cursor:pointer;
}

.batch-option:hover {
    color: #096fba;
    text-decoration:underline;
}

.loader {
  font-size: 90px;
  text-indent: -9999em;
  overflow: hidden;
  width: 1em;
  height: 1em;
  /*border-radius: 50%;*/
  margin: 0.5em auto;
  position: relative;
  -webkit-animation: load6 1.7s infinite ease;
  animation: load6 1.7s infinite ease;
}
@-webkit-keyframes load6 {
  0% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
    box-shadow: -0.11em -0.83em 0 -0.4em #e30e6f, -0.11em -0.83em 0 -0.42em #e30e6f, -0.11em -0.83em 0 -0.44em #e30e6f, -0.11em -0.83em 0 -0.46em #e30e6f, -0.11em -0.83em 0 -0.477em #e30e6f;
  }
  5%,
  95% {
    box-shadow: -0.11em -0.83em 0 -0.4em #e30e6f, -0.11em -0.83em 0 -0.42em #e30e6f, -0.11em -0.83em 0 -0.44em #e30e6f, -0.11em -0.83em 0 -0.46em #e30e6f, -0.11em -0.83em 0 -0.477em #e30e6f;
  }
  30% {
    box-shadow: -0.11em -0.83em 0 -0.4em #e30e6f, -0.51em -0.66em 0 -0.42em #e30e6f, -0.75em -0.36em 0 -0.44em #e30e6f, -0.83em -0.03em 0 -0.46em #e30e6f, -0.81em 0.21em 0 -0.477em #e30e6f;
  }
  55% {
    box-shadow: -0.11em -0.83em 0 -0.4em #e30e6f, -0.29em -0.78em 0 -0.42em #e30e6f, -0.43em -0.72em 0 -0.44em #e30e6f, -0.52em -0.65em 0 -0.46em #e30e6f, -0.57em -0.61em 0 -0.477em #e30e6f;
  }
  100% {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
    box-shadow: -0.11em -0.83em 0 -0.4em #e30e6f, -0.11em -0.83em 0 -0.42em #e30e6f, -0.11em -0.83em 0 -0.44em #e30e6f, -0.11em -0.83em 0 -0.46em #e30e6f, -0.11em -0.83em 0 -0.477em #e30e6f;
  }
}
@keyframes load6 {
  0% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
    box-shadow: -0.11em -0.83em 0 -0.4em #e30e6f, -0.11em -0.83em 0 -0.42em #e30e6f, -0.11em -0.83em 0 -0.44em #e30e6f, -0.11em -0.83em 0 -0.46em #e30e6f, -0.11em -0.83em 0 -0.477em #e30e6f;
  }
  5%,
  95% {
    box-shadow: -0.11em -0.83em 0 -0.4em #e30e6f, -0.11em -0.83em 0 -0.42em #e30e6f, -0.11em -0.83em 0 -0.44em #e30e6f, -0.11em -0.83em 0 -0.46em #e30e6f, -0.11em -0.83em 0 -0.477em #e30e6f;
  }
  30% {
    box-shadow: -0.11em -0.83em 0 -0.4em #e30e6f, -0.51em -0.66em 0 -0.42em #e30e6f, -0.75em -0.36em 0 -0.44em #e30e6f, -0.83em -0.03em 0 -0.46em #e30e6f, -0.81em 0.21em 0 -0.477em #e30e6f;
  }
  55% {
    box-shadow: -0.11em -0.83em 0 -0.4em #e30e6f, -0.29em -0.78em 0 -0.42em #e30e6f, -0.43em -0.72em 0 -0.44em #e30e6f, -0.52em -0.65em 0 -0.46em #e30e6f, -0.57em -0.61em 0 -0.477em #e30e6f;
  }
  100% {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
    box-shadow: -0.11em -0.83em 0 -0.4em #e30e6f, -0.11em -0.83em 0 -0.42em #e30e6f, -0.11em -0.83em 0 -0.44em #e30e6f, -0.11em -0.83em 0 -0.46em #e30e6f, -0.11em -0.83em 0 -0.477em #e30e6f;
  }
}

