/***** Free Tool Style CSS Start *****/
.free-tool-form input[type="text"], .free-tool-form textarea {
    /*width: 100%;*/
    height: 50px;
    padding: 8px;
    border: 1px solid #b7b7b7;
    font-size: 20px;
    font-weight: 100;
}
.free-tool-form input[type="text"]::placeholder {
 color:#464646;
 opacity: 1; /* Firefox */
}
 .free-tool-form input[type="text"]:-ms-input-placeholder {  /* Internet Explorer 10-11 */
 color:#464646;
}
 .free-tool-form input[type="text"]::-ms-input-placeholder {
    /* Microsoft Edge */
    color:#464646;
}
.free-tool-form select {
    /*width: 100%;*/
    border: 1px solid #b7b7b7;
    font-size: 20px;
    color: #000;
    font-weight: 400;
    padding: 8px;
    height: 50px;
    -webkit-appearance: none;
    -moz-appearance: none;
    -o-appearance: none;
    appearance: none;
    background: #fff url(../images/select-arrow-black.png) no-repeat right 10px center;
    cursor: pointer;
}
.free-tool-form select option {
    font-weight: 400;
}
.free-tool-form label {
    font-weight: 400;
    text-align: left;
    text-transform: capitalize;
    line-height: 50px;
    margin-bottom: 0;
    color: #000;
}
.free-tool-form p {
    font-size: 20px;
    font-weight: 400;
}
.free-tool-form p strong {
    font-weight: 600;
}
.form-checkbox {
    position: relative;
    margin-bottom: 0;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}
.form-checkbox label {
    margin-left: 30px;
}

.form-checkbox input {
    position: absolute;
    opacity: 0;
    cursor: pointer;
}
.checkmark {
    position: absolute;
    top: 50%;
    left: 0;
    height: 20px;
    width: 20px;
    transform: translateY(-50%);
    border: 2px solid #d7d7d7;
}
.form-checkbox input:checked ~ .checkmark {
    background-color: #4262ff;
}
.checkmark:after {
    content: "";
    position: absolute;
    display: none;
}
.form-checkbox input:checked ~ .checkmark:after {
    display: block;
}
.form-checkbox .checkmark:after {
    left: 6px;
    top: 3px;
    width: 5px;
    height: 9px;
    border: solid white;
    border-width: 0 2px 2px 0;
    -webkit-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);
}
.group-form ul {
    margin: 0;
    padding: 0;
    list-style: none;
    width: 100%;
    text-align: left;
}
.group-form ul li {
    display: block;
    margin-right: 10px;
    float: left;
}
.group-form ul li button {
    width: 40px;
    height: 50px;
    background-color: #fff !important;
    outline: none;
    border: 1px solid #ccc;
    font-weight: bold;
    text-align: center;
    font-size: 30px;
}
.group-form ul li:last-child {
    width: 116px;
    margin-right: 0;
}
.group-buttons.btn-group {
    padding: 30px 0 0 0;
    float: left;
}
.group-buttons.btn-group > button.free-tool-btn.black {
    margin-right: 15px;
    border-radius: 0;
    background-color: #000;
    color: #fff;
    padding: 14px 17px;
    font-size: 20px;
    text-transform: uppercase;
    font-weight: 100;
}
.group-buttons.btn-group > button:last-child {
    margin-right: 0;
    background-color: #4262ff;
}
.group-buttons.btn-group > button:hover, .group-buttons.btn-group > button:focus {
    color: #fff;
    outline: none;
}
.border-row {
    border: 1px solid #cccccc;
    padding: 10px 0;
    border-right: 0;
    border-left: 0;
    width: 100%;
    float: left;
}
.design-tool-heading {
    margin-top: 9px;
}
.design-tool-heading > a {
    font-size: 35px !important;
    font-weight: 300;
    color: #000;
}
.design-tool-heading > a > span.glyphicon {
    margin-left: 15px;
    font-size: 24px;
}
.design-tool-heading > a:hover, .design-tool-heading > a:focus {
    text-decoration: none;
    outline: none;
}
.design-tool-heading .dropdown-menu {
    top: 62px;
    background-color: #fff;
    border-radius: 0;
    border: 1px solid #ccc;
    box-shadow: none;
    padding: 0;
    margin: 0;
    border-top: 0;
    border-bottom: none;
}
.design-tool-heading .dropdown-menu > li > a {
    font-size: 20px;
    font-weight: 100;
    line-height: normal;
    color: #464646;
    padding: 14px;
    border-bottom: 1px solid #ccc;
}
.design-tool-heading .dropdown-menu > li.active > a {
    background-color: #4262ff;
    color: #fff;
}

.design-tool-heading .dropdown-menu > li.active > a:hover {
    background-color: #4262ff;
    color: #fff;
}
.design-tool-heading .dropdown-menu > li > a:hover, .design-tool-heading .dropdown-menu > li > a:focus {
    background-color: transparent;
    outline: none;
}
.free-tool-btn {
    background: #4262ff;
    border: none;
	padding: 14px 30px;
    color: #FFF;border-radius: 40px !important;
    font-size: 20px;
    font-weight: 400;
    outline: none;
    transition: all 0.5s ease 0s;
}
.free-tool-btn:hover, .free-tool-btn:focus {
    text-decoration: none;
    color: #fff;
    background-color: #000;
}
.free-tool-btn.large {
    font-size: 36px;
    font-weight: bold;
}
.free-tool-btn.black {
    background-color: #000;
    float: right;
}
.border-bottom {
    border-bottom: 1px solid #898989;
}
.btn_bold_on, .btn_italic_on {
    background: #f2f2f2 !important;
}
.step-content {
    padding: 0;
}
.step-content li {
    list-style: none;
    text-align: left;
    font-weight: 500;
    color: #000; font-size:18px;
}
.step-content li span {
    font-weight: 500;
}
.template-images-box ul {
    padding: 0;
    margin: 0;
    list-style: none;
    width: 100%;
    border: 1px solid #d9d9d9;
    overflow: scroll;
    overflow-x: hidden;
    height: 250px;
}
.template-images-box ul li {
    width: 100%;
    height: auto; background-color:#fff;;
    border-bottom: 1px solid #d9d9d9;
}
.template-images-box ul li img {
    width: 100%;
}
.template-images-box ul li:last-child {
    border-bottom: 0;
}
.text-black {
    color: #000;
}
.remove-padding {
    padding: 0;
}
.mb-10 {
    margin-bottom: 50px;
}
hr.seprator-line {
    border-color: #898989;
}
.btn_italic {
    font-style: italic;
    font-weight: 400 !important;
}

.btn_bold {
    font-weight: bold !important;
}
/** Color Palette CSS Start **/
.section-color-palette {
}
.section-color-palette button.free-tool-btn + span {
    font-weight: 100;
    position: absolute;
    top: 50%;
    right: 0;
    margin-right: 3px;
    transform: translateY(-50%);
}
.section-color-palette input[type="text"] {
    width: 100%;
}
.section-color-palette .image {
    width: 41.66666667%;
    float:left;
    position: relative;
    min-height: 1px;
    padding-right: 15px;
    padding-left: 15px;

}
.section-color-palette .color  {
    width: 50%;
    float:left;
    position: relative;
    min-height: 1px;
    padding-right: 15px;
    padding-left: 15px;
}

span.heading {
    font-size: 20px;
    font-weight: 400;
    padding-bottom: 10px;
    float: left;
    clear: both;
    width: 100%;
    text-transform:capitalize;
}

.section-color-palette .image  img.orginalImage {
    width:100%;
}

.section-color-palette  .color-palette {
    border: 1px solid #333333;
    border-radius: 2px;
    float: left;
    font-size: 12px;
    font-weight: bold;
    height: 39px;
    line-height: 95px;
    margin-bottom: 30px;
    margin-right: 10px;
    text-align: center;
    width: 60px;
    display:inline-block;
}

/** Color Palette CSS End **/

/** Business Card CSS Start **/
#theCard {
    width: 100%;
    height: 250px;
    background: #fff url(../../images/throbber100.gif) no-repeat 200px center;
    /*border: 1px solid #ccc;*/
}
.section-business-card #theCard img.generated-image {
    width: auto;
    position: absolute;
    left: 200px;
    top: 6px;
    padding: 18px;
    margin: 0 !important;
}
.business-card-btn {
    width: 100%;
    float: left;
    margin-top: 15px;
}
.bc-button {
    margin-right: 15px;
    border-radius: 0;
    background-color: #000;
    color: #fff;
    padding: 15px 15px;
    font-size: 20px;
    text-transform: uppercase;
    font-weight: 100;
    display: block;
    float: left;
    cursor: pointer;
}
.bc-button:last-child {
    margin-right: 0;
    background-color: #4262ff;
}
.bc-button a {
    color: #fff;
}
.section-business-card ul.qq-upload-list-selector.qq-upload-list {
    list-style: none;
    margin-bottom: 0;
    padding: 0;
    position: relative;
}
.section-business-card ul.qq-upload-list-selector.qq-upload-list li {
    font-size: 14px;
    color: #000;
    font-weight: 400;
}
.section-business-card a.qq-upload-cancel-selector {
    font-weight: bold;
    color: #000;
}
.section-business-card {
}
/*.bc-image img.card-image {
    width: 100%;
}*/
.section-business-card #fine-uploader.bc-button {
    position: relative;
}
.section-business-card ul.qq-upload-list-selector.qq-upload-list {
    position: absolute;
    bottom: -50px;
    left: 0px;
    width: 100%;
}
#renderContainer {overflow:auto;}
#renderContainer img {max-width:100%;}
.section-business-card div#renderContainer {
  /*  width: 100%;
    position: relative;*/
}
.section-business-card span#preview {
    position: absolute;
    top: 20px;
    left: 20px;
}
.section-business-card span#preview img {
    max-width: 150px;
   
}
/*.section-business-card span#preview {
    top: 40px !important;
    left: 45px !important;
}*/
.section-business-card input[type="text"] {
    width: 90%;
}
.section-business-card .group-form ul li:last-child {
    width: 128px;
}
/** Business Card CSS End **/

/** Screenshot Generator CSS Start **/
.section-webss-generator span.text {
    font-weight: 100;
    text-align: left;
    display: block;
    margin-top: 8px;
    font-size: 20px;
}
.screen-images img.screen-shot {
    width: 100%;
    height: auto;
    border: 1px solid #ccc;
}
.section-webss-generator input[type="text"] {
    width: 100%;
}
/** Screenshot Generator CSS End **/

/** CSS3 Code Generator Start **/
.section-code-generator {
}
.option-button ul {
    padding: 0;
    margin-bottom: 0;
}
.option-button ul li {
    margin-right: 20px;
    margin-bottom: 20px;
    display: inline-block;
}
.option-button ul li a {
    font-size: 20px;
    color: #fff;
    font-weight: 300;
    text-transform: uppercase;
    background-color: #000;
    width: 180px;
    height: 50px;
    line-height: 50px;
    display: inline-block;
}
.option-button ul li a:hover, .option-button ul li a:focus {
    text-decoration: none;
    background-color: #4262ff;
}
.code-generator-block .ref {
    text-align: left;
    font-weight: 100;
}
.code-generator-block .ref a {
    color: #899c20;
    font-weight: 400;
}
.code-generator-block {
    width: 100%;
    float: left;
}
.code-generator-area {
    width: 100%;
    float: left;
}
.code-generator-block .main-field {
    width: 100%;
    text-align: left;
}
.code-generator-block .main-field span {
    font-weight: 500;
    text-transform: capitalize;
}
.hex-color span, .shadow-color span, .outline-color span {
    float: left;
    margin-right: 15px;
}
.code-generator-block .main-field input[type="text"] {
    font-weight: 100;
    padding: 0 10px;
    height: 30px;
    text-align: left;
}
.code-generator-block .main-field i {
    font-weight: 100;
    margin-left: 10px;
}
.code-area {
    width: 100%;
    float: left;
}
.code-area pre {
    width: 100% !important;
    background-color: #fafafa;
    border: 1px solid #ccc;
    padding: 20px;
    margin-bottom: 22px;
    text-align: left !important;
    border-radius: 0;
    height: 150px;
}
.main-field select, .main-field option {
    font-weight: 100;
}
ul.transform {
    padding: 0;
    list-style: none;
}
ul.transform li {
    display: inline-block;
    float: left;
    margin-right: 30px;
}
ul.transform li .main-field input[type="text"] {
    font-weight: 100;
    padding: 0 10px;
    height: 30px;
    text-align: left;
    width: 60px;
}
.interaction-area {
    -moz-border-bottom-colors: none;
    -moz-border-left-colors: none;
    -moz-border-right-colors: none;
    -moz-border-top-colors: none;
    background: none repeat scroll 0 0 #fafafa;
    margin: 0;
    opacity: 1;
    height: 150px;
    line-height: 150px;
    padding: 0 10px;
    font-size: 16px;
    width: 150px;
    border: 1px solid #ccc;
}
ul.transform li:last-child {
    margin-right: 0;
}
#multi-col.interaction-area {
    line-height: 1.5;
    padding: 20px;
    text-align: left;
    overflow: hidden;
}
/** CSS3 Code Generator End **/

/** Asciify CSS Start **/
.section-ascii ul.qq-upload-list-selector.qq-upload-list {
    display: none;
}
.section-ascii span.pexels {
    line-height: 50px;
    font-weight: 100;
}
.section-ascii {
}
.section-ascii .free-tool-btn.black + span {
    font-weight: 100;
    color: #000;
    line-height: 50px;
    margin-left: 15px;
}
/** Asciify CSS End **/

/** Letterhead CSS Start **/
.section-letterhead .free-tool-form select, .section-letterhead .free-tool-form input[type="text"] {
    width: 100%;
}
.section-letterhead .group-form ul li:last-child {
    width: 95px;
}
#theletterHead {
    background: url('/images/free-design-tools/Letterhead_01.png') no-repeat #999;
    width:100%;
}
.letterhead-cover {
    /*background: url(../images/design-tool-imgs/letterhead-cover.png) no-repeat;*/
    background-size: cover;
    width: 100%;
    height: 763px;
    border: 1px solid #b7b7b7;
    position: relative;
}
.buttons-group {
    margin-top: 12px;
    float: right;
}
.buttons-group-btn {
    margin-right: 15px;
    border-radius: 0;
    background-color: #000;
    color: #fff;
    padding: 10px 25px;
    font-size: 20px;
    border-radius: 40px;
    font-weight: 400;
    display: block;
    float: left;
    cursor: pointer;
}


#images li img {cursor:pointer;}
.buttons-group-btn input[type=button] {
    background-color: transparent;
    border: 0;
}
.buttons-group-btn a {
    color: #fff;
    padding: 0;
}
.buttons-group-btn.green {
    background-color: #4262ff;
}
.buttons-group-btn:last-child {
    margin-right: 0;
}
/** Letterhead CSS End **/

/** Enveloepr CSS Start **/
.section-enveloped select, .section-enveloped input[type="text"] {
    width: 100%;
}
.section-enveloped .group-form ul li:last-child {
    width: 80px;
}
.enveloped-cover {
    background: url(/images/free-design-tools/envelope_cover.png) no-repeat;
    background-size: cover;
    width: 100%;
    height: 340px;
    border: 1px solid #b5b5b5;
}
.section-enveloped .template-images-box ul {
    border: 1px solid #b5b5b5;
    height: 300px;
}
.section-enveloped .template-images-box ul li {
    height: 81px;
}
#theEnvelope {
    width: 100%;
    height: 100%;
    background: url('/images/free-design-tools/small-envelope/envelope_01.png') no-repeat #999;
     background-size: cover !important;
	 position:relative;
}
.section-enveloped textarea.userInput {
    width: 100%; min-height:100px;
}
/** Enveloepr CSS End **/


/** Favicon CSS Start **/
ul.favicon-generator {
    list-style: none;
    padding: 0;
    margin-bottom: 0;
    width: 100%;
    float: left;
}
ul.favicon-generator li {
    display: block;
    margin-bottom: 30px;
    text-align: left;
    font-weight: 100;
    width:100%;
    float:left;
}
ul.favicon-generator li button.free-tool-btn {
    width: 182px;
    height: 50px;
    padding: 0;
    line-height: 50px;
}
.section-favicon .nav-tabs {
    border-bottom: 1px solid #ccc;
}
.section-favicon .nav-tabs>li.active>a, .section-favicon .nav-tabs>li.active>a:focus, .section-favicon .nav-tabs>li.active>a:hover {
    color: #fff;
    cursor: default;
    background-color: #000;
    border: 1px solid #000;
}
.section-favicon .nav-tabs>li>a {
    margin-right: 10px;
    line-height: normal;
    border-radius: 0;
    text-transform: uppercase;
    padding: 13px 18px;
    background-color: #ccc;
    color: #fff;
    font-weight: 400;
}
.section-favicon .nav-tabs>li>a:hover {
    border-color: transparent;
}
.section-favicon .nav>li>a {
    position: relative;
    display: block;
}
#canvas-board {
    width: 100%;
    margin: 0 auto;
    border: 1px solid #b5b5b5;
    background: #fff;
    padding: 10px;
    overflow: auto;
}
#canvas-bg {
    background: url(/images/free-design-tools/grid.png) no-repeat left top;
    width: 100%;
    height: 380px;
    float: left;
}
.canvas-controler {
    width: 100%;
    float: left;
}
ul.canvas-buttons {
    padding: 0;
    margin: 0;
    list-style: none;
}
ul.canvas-buttons li {
    display: block;
    float: left;
    margin-right: 10px;
    width: 142px;
    height: 50px;
}
ul.canvas-buttons li input[type=button] {
    width: 100%;
    height: 100%;
    background-color: #000;
    color: #fff;
    border: 0;
    font-weight: 400;
    font-size: 18px;
    border-radius:40px;
}
.canvas-controler select {
    text-transform: uppercase;
    width: 100%;
    border: 1px solid #b7b7b7;
    font-size: 20px;
    color: #000;
    font-weight: 100;
    padding: 8px;
    height: 50px;
    -webkit-appearance: none;
    -moz-appearance: none;
    -o-appearance: none;
    appearance: none;
    background: #fff url(../images/select-arrow-black.png) no-repeat right 10px center;
    cursor: pointer;
}
.canvas-controler span {
    text-transform: capitalize;
    text-align: left;
    display: block;
    font-weight: 400;
    font-size: 18px;
    color: #000;
}
.canvas-controler input[type="text"]#color {
    width: 100%;
    height: 50px;
    padding: 8px;
    border: 1px solid #b7b7b7;
    font-size: 20px;
    font-weight: 100;
}
ul.canvas-buttons li:last-child {
    margin-right: 0;
}
.group-row {
    margin-right: -15px;
    margin-left: -15px;
    float: left;
    width: 100%;
}
.create-btn {
    width: 100%;
    float: left;
}
.create-btn input[type=button].free-tool-btn {
    float: left;
}
.favicon-generator .free-tool-btn, .favicon-generator a#download2.free-tool-btn {
    width: 182px;
    height: 50px;
    padding: 0;
    line-height: 50px;
    display: inline-block;
    text-align: center;
}
 .favicon-generator ul.qq-upload-list-selector.qq-upload-list {
    position: absolute;
    bottom: -27px;
    left: 0px;
    width: 100%;
}
.favicon-generator  #fine-uploader.free-tool-btn {
    position: relative;
    padding: 13px 0;
}
.favicon-generator ul.qq-upload-list-selector.qq-upload-list {
    list-style: none;
    margin-bottom: 0;
    padding: 0;
}
.favicon-generator ul.qq-upload-list-selector.qq-upload-list li {
    font-size: 14px;
    color: #000;
    font-weight: 400;
    margin-bottom: -10px;
}
.favicon-generator a.qq-upload-cancel-selector {
    font-weight: bold;
    color: #000;
}
.image-generator {
    width: 100%;
    float: left;
    text-align: left;
    padding: 20px 0;
}


.image-generator a#download {
    display: inline-block;
    margin-top: 0;
}


.image-generator img {border: 1px solid #ccc;box-shadow: 2px 2px 6px #ccc;float: left;width: 44px;height: 44px;}
/** Favicon CSS End **/

/** Monogram CSS Start **/
.section-monogram {
}

.section-monogram .group-form ul li:last-child {
    width: 112px;
    margin-right: 0;
}
.section-monogram .free-tool-form input[type="text"] {
    background-color: #f5f5f5;
}
ul.form-buttons {
    list-style: none;
    padding: 0;
    margin: 0;
    float: right;
    position: relative;
}
ul.form-buttons li:last-child {
    margin-right: 0;
}
ul.form-buttons li {
    display: block;
    float: left;
    margin-right: 10px;
}
.section-monogram input[type="text"]#textcolor {
    width: 100px;
    border: 0;
    height: 48px;
}
.section-monogram .canvas-container {
   background-color:#fff;;
    border: 1px solid #b5b5b5;
    float: left;
    width: 100% !important;
    height: 350px !important;
    position: relative;
    line-height: normal;
        padding: 30px;

}
.section-monogram .canvas-container canvas {
    border: 0;
}
.section-monogram canvas.lower-canvas, .section-monogram canvas.upper-canvas {
  position: absolute;
    left: 0;
    right: 0;
    margin: 0 auto;
    top: 0;
     line-height: normal;

}
.section-monogram .template-images-box ul {
    height: 350px;
}
.section-monogram .template-images-box ul li {
    height: 100px;
    padding: 10px 0;
}
.section-monogram .free-tool-form select {
    width: 100%;

}
.font-button button {
    background-color: transparent;
    border: 1px solid #b7b7b7;
    font-size: 20px;
    text-align:left;
    color: #000;
    font-weight: 100;
    padding: 8px;
    height: 50px;
    width: 100%;
    border-radius: 0;
    background: #fff url(../images/select-arrow-black.png) no-repeat right 10px center;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap; background-color: #fff !important;
}
.dropdown-menu.show {
    display: block !important;
    max-height: 335px;
    overflow-y: auto; min-width:160px !important; width:278px !important;
}	
.font-button.btn-group {
    width: 100%;
}

.font-button.btn-group:hover, .font-button.btn-group:focus {
    outline: none;
    box-shadow: none;
}
.font-button.btn-group ul.dropdown-menu {
      width: 100%;
    border-radius: 0;
    padding: 10px;
    font-size: 20px;
    font-weight: 100;
    margin: 5px 0;
    cursor: pointer;
    height: 200px;
    overflow-y: scroll;
}
.font-button button.dropdown-toggle {
    box-shadow:none;
}
.font-button.btn-group ul.dropdown-menu li {
    padding: 5px 0;
}
.section-monogram ul.form-buttons .free-tool-btn {
    height:50px;
}
.section-monogram ul.form-buttons input[type="text"]#textcolor {
    width: 100px;
    border: 0;
    height: 50px;
}
.section-monogram #loader {
    width: 100%;
    float: left;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
}
.section-monogram img.delet-icon {
    width: 30px;
    height: 30px;
    position: absolute;
    left: -48px;
    top: 10px; cursor:pointer;
}
/** Monogram CSS End **/

/** Faxcover CSS Start **/
.faxcover-slide-box {
    width: 100%;
    float: left;
    background-color: #ccc;
    padding: 10px; 
}
#carouselFaxLetter .carousel-indicators .active { background-color: #4262ff; }
#carouselFaxLetter .carousel-indicators button {background-color: #ccc; }
#carouselFaxLetter .carousel-indicators {bottom:-218px;}

.faxcover-slide-box .slick-slider {
    width: 100%;
    height: auto;
    margin-bottom: 0;
}
.faxcover-slide-box .slick-list {
    width: 100%;
    padding: 0;
    border-radius: 0;
    background-color: transparent;
    height: auto;
    border: 0;
}
.faxcover-slide-box .slick-slide {
    height: auto;
}
.faxcover-slide-box .slick-dots {
  /*  display: none !important; */
}
.faxcover-forms {
    width: 100%;
    padding: 20px;
    border: 1px solid #ccc;
    height: auto;
    float: left;
}
.faxcover-forms .free-tool-form {
    width: 100%;
    float: left;
    margin-bottom: 0;
}
.faxcover-forms .form-group {
    width: 100%;
    float: left;
    border-bottom: 1px solid #000;
    padding-bottom: 10px;
}
.faxcover-forms .free-tool-form label {
    text-align: left;
    display: block;
    font-size: 14px;
    line-height: normal;
    text-transform: capitalize;
}
.faxcover-forms input[type="text"] {
    width: 100%;
    height: 27px;
    padding: 8px;
    border: 1px solid #b7b7b7;
    font-size: 14px;
    font-weight: 100;
    border-radius: 2px;
}
.faxcover-forms textarea {
    width: 100%;
    border: 1px solid #ccc;
    border-radius: 2px;
    margin-top: 10px;
    height: 100px;
    padding: 0;
    font-size: 14px;
    font-weight: 100;
    margin-bottom: 20px;
}
.faxcover-forms .checkboxes {
    width: 100%;
    float: left;
}
.faxcover-forms .checkboxes label.custom-control.custom-radio {
    display: block;
    margin-right: 9px;
    float: left;
}
.section-faxcover #downloadContainer {
    width: 100%;
    float: left;
}
.section-faxcover h1 {
    font-size: 36px;
    font-weight: bold;
}
.section-faxcover h3 {
    font-size: 24px;
    font-weight: 500;
}
.section-faxcover #downloadContainer #theButton {
    text-align: right;
}
.faxcover-forms .table-bordered {
    border: 1px solid #000;
}
.faxcover-forms .table-bordered>tbody>tr>td {
    border: 1px solid #000;
    text-align: left;
    font-size: 14px;
    line-height: normal;
    text-transform: capitalize;
    color: #000;
    font-weight: 100;
}
.faxcover-header {
    margin-bottom: 40px;
}
.faxcover-header h3.h4 {
    margin: 15px 0;
}
.faxcover-header .logo_display {
    line-height: 60px;
    text-align: center;
    float: right;
    margin-right: 0;
    margin-top: 0;
    border: 1px solid #ccc;
    width: 120px;
    height: 60px;
    margin-bottom: 0;
}
#fax-cover-letter-4 .form-group, #fax-cover-letter-7 .form-group {
    border-bottom: 0;
    padding-bottom: 0;
}
.section-faxcover ul.qq-upload-list-selector.qq-upload-list {
    position: absolute;
    bottom: -50px;
    left: 0px;
    width: 100%;
}
.section-faxcover ul.qq-upload-list-selector.qq-upload-list {
    list-style: none;
    margin-bottom: 0;
    padding: 0;
    position: relative;
}
.section-faxcover #fine-uploader.upload-button {
    margin-right: 15px;
    border-radius: 0;
    background-color: #000;
    color: #fff;
    padding: 15px 15px;
    font-size: 20px;
    text-transform: uppercase;
    font-weight: 100;
    display: block;
    float: left;
    cursor: pointer;
}
.border-box {
    border: 1px solid #000;
    padding: 10px;
    width: 100%;
    float: left;
}
#fax-cover-letter-7 .border-box .form-group:last-child {
    margin-bottom: 0;
}
.section-faxcover span#preview {
    top: 20px !important;
    left: 400px !important;
}
.section-faxcover span#deleimage {
    top: 20px !important;
    right: 28px !important;
}
/** Faxcover CSS End **/

/** Flicker RSS CSS Start **/
.section-flicker input[type="text"], .section-flicker select {
    width: 100%;
}
.section-flicker .form-group {
    width: 100%;
    float: left;
}
.section-flicker .free-tool-btn {
    float: left;
}
/** Flicker RSS CSS End **/
/***** Free Tool Style CSS End *****/

/*Bilal*/
#canvasDiv {
    background: #fff url(../images/free-design-tools/grid.png) no-repeat left top;
    float: left;
    width:401px;
    
}
.modal-body label a {
    color: #000;
}
.modal-footer .btn-primary.free-tool-btn {
    margin-bottom: 0;
    margin-left: 5px;
    padding: 6px 12px;
    text-transform: capitalize;
    font-size: 14px;
    border: 1px solid transparent;
}
#font_dropdown.show {display: :block;}
/*========== Responsive Style CSS ==========*/
@media (min-width:1024px) and (max-width:1600px){ .section-enveloped textarea.userInput {max-width:300px; float:left;}  }
@media (min-width:1024px) and (max-width:1200px){
    /** =====> Business Card CSS Start device-1024 **/
    .section-business-card .free-tool-form input[type="text"], .section-business-card .free-tool-form select, #theCard.bc-image {width: 100%;}
    .bc-button{margin-right: 13px;font-size: 16px;}
    span#preview {top: 30px !important;left: 15px !important;}
    span#preview img { width: 120px;height: 120px;}
    img.generated-image {margin: 20px 0px 0 130px !important;width: 220px;}
    #theCard.bc-image img.card-image {width: 100%;}
    .section-business-card .group-form ul li:last-child {width: 127px;}
    .section-business-card #theCard img.generated-image{left: 160px;top: 21px;padding: 0;max-width: 220px;}
    /** Business Card CSS End device-1024 <===== **/
    
    /** =====> Letterhead Card CSS Start device-1024 ---> **/
    /** Letterhead Card CSS End device-1024 <===== **/
    /* =====> Monogram Generator CSS Start device-1024 **/
    .section-monogram ul.form-buttons {margin: 15px 0 10px 0;}
    .section-monogram .pl-0 {padding-left: 15px;}
    .section-monogram .free-tool-form input[type="text"] {width: 100%;}
/* =====> Monogram Generator CSS End device-1024 **/
/* =====> Color-Palette CSS Start device-768 **/
    .section-color-palette button.free-tool-btn + span {right: 20px;}
    .section-color-palette .url-input input[type="text"] {width:100%;}
    ul.transform li{    margin-bottom: 20px;}
    /** Color-Palette CSS End device-768 <===== **/
    .section-enveloped .group-form ul li:last-child {width: 127px;}
    .faxcover-slide-box .slick-list{height:150px;}
}
@media (max-width: 414px) {
    br.d-sm-block {
        display: none !important;
    }
}
@media (max-width:768px){
    .b_card #text_area { float:left; width:100%; margin-left: -5px;}
    #letterhead {overflow-y: auto;}
   .lh-text_area {max-width:100% !important;}
    #btnSubmit.free-tool-btn1 {margin-top:20px; float:left !important;}
	.sitemap_categories ul {margin-right:0px !important;}
	.faxcover-slide-box img { max-width:70px;}
	.xs-p-15 {padding-left:13px !important;}
	
    .free-tool-form label {
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }
    .form-checkbox label {
        margin-left: 30px;
    }
    .design-tool-heading > a {
        font-size: 30px;

    }
    .design-tool-heading > a > span.glyphicon {
        margin-left: 0;
    }
    /** =====> Business Card CSS Start device-768 **/
    #theCard.bc-image {width: 100%; height: 160px;}
    /*img.generated-image {margin: 20px 0 0 130px !important;width: 200px;}*/
    /*span#preview {top: 27px !important;left: 15px !important;}*/
    .section-business-card .group-buttons.btn-group {padding: 15px 0;}
    .section-business-card .bc-button {margin-right: 14px;padding: 10px 10px;font-size: 15px;}
    .section-business-card .group-buttons.btn-group > button:last-child {margin-right:0;}
    .section-business-card .group-form ul li {margin-right: 15px;}
    .section-business-card .group-form ul li button {width: 40px;}
    .section-business-card .group-form ul li:last-child {width: 93px;margin-right:0;}
    .section-business-card .free-tool-form input[type="text"], .section-business-card .free-tool-form select {width: 100%;}
    #theCard.bc-image img.card-image {width: 100%;}
    .section-business-card #theCard img.generated-image{max-width: 220px;height: auto;left: 150px;}
    .section-business-card span#preview img {max-width: 90px;height: auto;}
   /** Business Card CSS End device-768 <===== **/
   
   /** =====> Letterhead CSS Start device-768 **/
   .section-letterhead #theletterHead{  margin-top:0;}
   .section-letterhead .group-form ul li:last-child {width: 103px;}
    /** Letterhead CSS End device-768 <===== **/
    
    /* =====> Color-Palette CSS Start device-768 **/
    .section-color-palette button.free-tool-btn + span {right: 30px;}
    .section-color-palette .url-input {padding: 0;margin-top:0}
    .section-color-palette .url-input input[type="text"] {width:100%;}
    ul.transform li{    margin-bottom: 20px;}
    /** Color-Palette CSS End device-768 <===== **/
    
    /* =====> Screenshot Generator CSS Start device-768 **/
    .section-webss-generator span.text {font-size: 16px;}
    /** Screenshot Generator CSS End device-768 <===== **/
    
    /* =====> Monogram Generator CSS Start device-768 **/
    .section-monogram .group-form ul li:last-child {width: 85px;}
    .section-monogram .free-tool-form  input[type="text"] {width:100%;}
    .section-monogram .pl-0 {padding-left: 15px;}
    .section-monogram ul.form-buttons {margin:15px 0 10px 0;}
     .section-monogram ul.form-buttons li:last-child {margin-right: -10px;}
     .section-monogram  .group-form ul li button {width: 35px;}
    /** Monogram Generator CSS  End device-768 <===== **/
    .section-flicker .free-tool-form label { white-space: normal;overflow: auto;text-overflow: unset;}
    .section-enveloped .group-form ul li:last-child {width: 135px;}
    .section-enveloped textarea.userInput{margin-top:15px;}
    .enveloped-cover , .template-images-box{margin-top: 10px;}
    .faxcover-slide-box .slick-list{height:150px;}
}
@media (min-width:481px) and (max-width:766px){
}
@media (min-width:320px) and (max-width:480px){
    #canvasDiv {width:99%;}
    #canvasDiv .canvas-container {width:100% !important;}
    #canvasDiv .canvas-container canvas{width:100% !important;}
    .favicons-btn-wrap li {width:50%;}
    ul.canvas-buttons li { width: 100px; margin-bottom:10px; margin-top: 12px;}
      .form-checkbox {
        margin-top: 15px;
    }
    .form-checkbox > label {
        margin-left: 30px;
        display: block;
        text-align: left;
        line-height: 35px;
    }
    .form-group .free-tool-btn.pull-right {
        width: 100%;
    }
    .design-tool-heading {
        margin-top:0;
        margin-bottom: 20px;
        text-align: center;
    }
    .design-tool-heading > a {
        font-size: 27px;
    }
    .design-tool-heading > a > span.glyphicon {
        margin-left: 10px;
        font-size: 20px;
    }
    .social-media-icons {
        width: 100%;
        text-align: center;
    }
    .design-tool-heading .dropdown-menu {
        top: 80%;
        background-color: #fbfbfb;
        width: 100%;
        border-top: 1px solid #ccc;
    }
    .design-tool-heading .dropdown-menu > li > a {
        text-overflow: ellipsis;
        overflow: hidden;
    }
    .form-checkbox {margin-top: 15px;}
    .form-checkbox > label {margin-left: 30px;display: block;text-align: left;line-height: 35px;}
    .form-group .free-tool-btn.pull-right {width: 100%;}
    .design-tool-heading {margin-top:0;margin-bottom: 20px;text-align: center;}
    .design-tool-heading > a {font-size: 27px;}
    .design-tool-heading > a > span.glyphicon {margin-left: 10px;font-size: 20px;}
    .social-media-icons {width: 100%;text-align: center;}
    .design-tool-heading .dropdown-menu { top: 80%;background-color: #fbfbfb;width: 100%;border-top: 1px solid #ccc;}
    .design-tool-heading .dropdown-menu > li > a {text-overflow: ellipsis;overflow: hidden;}
    /** =====> Business Card CSS Start device-320 x 480 **/
    .business-card-btn{margin-top: 15px;padding: 10px 0 40px 0; }
    .section-business-card .bc-button{width: 100%;margin-bottom: 10px;}
    ul.qq-upload-list-selector.qq-upload-list{bottom: -35px;}
    .section-business-card .bc-button:last-child{margin-top: 30px;}
    #theCard.bc-image{width: 100%;height: 150px;}
    .section-business-card #theCard img.generated-image {    max-width: 140px;
    left: 150px;top: 29px;padding: 0;margin: 0 !important;}
    .section-business-card .pl-0 {padding-left: 25px;}
    .section-business-card .group-form ul li {width: 13%;margin-right:0;}
    .section-business-card .group-form ul li:last-child {width: 60%;}
    .section-business-card .group-form {margin-top: 15px;}
    .free-tool-btn.large {font-size: 16px;}
    .section-business-card ul.qq-upload-list-selector.qq-upload-list{bottom: -30px;}
    #theCard.bc-image img.card-image {width: 100%;height:auto;}
     /** Business Card CSS End device-320 x 480 <===== **/
    
    /** =====> Letterhead Card CSS Start device-320 x 480 **/
    .section-letterhead .pl-0{padding-left: 15px;}
    .section-letterhead .group-form{margin-top: 15px; margin-left:0px;}
    .section-letterhead .template-images-box{margin-bottom: 30px; float:left; width:100%;}
    .section-letterhead #theletterHead{height: 400px;}
    
    /** Letterhead Card CSS End device-320 x 480 <===== **/
    
    /* =====> Screenshot Generator CSS Start device-768 **/
    .section-webss-generator .free-tool-btn {float: left;margin-top: 10px;}
    .screen-images img {margin-bottom:20px;}
    .section-webss-generator .download-btn a.free-tool-btn {float: none;}
    .section-webss-generator span.text {font-size: 15px;}
    /** Screenshot Generator CSS End device-768 <===== **/
    
    /* =====> Color-Palette CSS Start device-320 x 480 **/
    .section-color-palette .pl-0 {padding: 0;}
    .section-color-palette button.free-tool-btn + span {position:static;}
    .section-color-palette .url-input {padding: 0 15px;margin-top: 15px;}
    ul.transform{width: 100%;float: left;} 
    ul.transform li {float: none;margin-right: 0;margin-bottom: 20px;width: 100%;display: block;}
    .section-color-palette .image {width: 100% !important;margin-bottom: 20px;}
    .section-color-palette .color {width: 100% !important;}
    /** Color-Palette CSS End device-320 x 480 <===== **/
    
    /* =====> CSS3 Code Generator CSS Start device-320 x 480 **/
    .option-button ul {padding: 0;}
    .option-button ul li {margin-right: 0;margin-bottom: 10px;width: 100%;}
    .option-button ul li a {width: 100%;}
    /** CSS3 Code Generator CSS End device-320 x 480 <===== **/
    
    /* =====>  Asciify CSS Start device-320 x 480 **/
    .section-ascii .free-tool-btn.black {float: none;margin-top: 50px;}
    .section-ascii .free-tool-btn.black + span {position: absolute;top: 0;margin-left: 0;left: 50%;transform: translateX(-50%);}
    .section-ascii .form-checkbox {margin-top: 15px;}
    .section-ascii .form-checkbox > label {margin-left: 30px;display: block;text-align: left;line-height: 35px;}
    .section-ascii .form-group .free-tool-btn.pull-right {width: 100%;}
    /** Asciify CSS End device-320 x 480 <===== **/
    
    /* =====> Monogram Generator CSS Start device-320 x 480 **/
    .section-monogram .canvas-container canvas{width:100% !important;}
    .section-monogram .template-images-box {margin-top: 20px;}
    .section-monogram .canvas-container {padding:0;height: 350px !important;}
    .section-monogram .group-form ul{float: left;margin-bottom: 15px;}
    .section-monogram .group-form ul li button {width: 40px;}
    .section-monogram .group-form ul li:last-child {width: 195px;}
    .section-monogram .font-button.btn-group{margin-bottom:15px;}
    .section-monogram .font-button.btn-group{margin-bottom:15px;}
    .section-monogram .font-button.btn-group{margin-bottom:15px;}
    .section-monogram .font-button.btn-group{margin-bottom:15px;}
    /** Monogram Generator CSS End device-320 x 480 <===== **/
    .section-enveloped select, .section-enveloped input[type="text"]{margin-bottom:15px;}
    .section-enveloped .pl-0 {padding-left: 15px;}
    .faxcover-slide-box{margin-bottom:15px;}
    .section-faxcover #fine-uploader.upload-button{margin-bottom:20px;}

}


/*========== Responsive Style CSS End ==========*/

/* Free Design Tool Tag Start */
.sitemap_categories ul {padding: 5px 20px; padding: 5px 20px;display: inline-block;margin-right: 40px;text-align: left;}
.sitemap_categories ul li a {font-weight:400; font-size:18px !important; display:block; margin-bottom:5px;}
.sitemap_categories ul li a:focus {color:#464646; text-decoration:none;}
@media only screen and (max-width: 990px) {
    .sitemap-page h2 { font-size: 17px;}
    .sitemap_categories ul li a {font-size:18px;}
}
.sitemap_categories li a:hover {
    color: #4262ff;
}

.button-green-new a {
    color: #fff !important;
    background-color: #4262ff !important;
    transition: all .5s ease 0s;
}

#btnSubmit.free-tool-btn1 {
	    background: #4262ff;
    border: none;
    border-radius:40px;
    padding: 10px 30px;
    color: #fff;
    font-size: 18px;
    font-weight: 400;
    outline: 0;
    transition: all 0.5s ease 0s;
    width: auto;
    float: right;
	} 
	
	
	#btnAddText.free-tool-btn1 {
	background: #4262ff;
    border: none;
	border-radius:40px;
    padding: 10px 20px;
    color: #fff;
    font-size: 18px;
    font-weight: 400;
    outline: 0;
    transition: all 0.5s ease 0s;
    width: auto;
    float: right;
	} 
.hero { margin-top: 10px; }
.dropdown-menu#font_dropdown {padding-top:0px;}
.dropdown-menu#font_dropdown li {padding:6px 5px;}
.dropdown-menu#font_dropdown li:hover {background-color:#ebebeb; cursor:pointer;}

/* Free Design Tool Tag End */

	.container-freetool {max-width:1170px;}
	#hero ul,  #hero ul li a {font-size:16px;font-weight:400;}
	#hero ul li {margin-bottom:10px;}
	.sitemap_categories li a:hover{color:#4262ff}.design-tool-heading{margin-top:9px}.design-tool-heading>a{font-size:35px !important;font-weight:300;color:#000}.design-tool-heading>a>span.glyphicon{margin-left:10px;font-size:24px}.design-tool-heading>a:focus,.design-tool-heading>a:hover{text-decoration:none;outline:0}.design-tool-heading .dropdown-menu{ z-index: 999999; top:7px !important;background-color:#fff;border-radius:0;border:1px solid #ccc;box-shadow:none;padding:0;margin:0;border-top:0;border-bottom:none}.design-tool-heading .dropdown-menu>li>a{font-size:20px;font-weight:100;line-height:normal;color:#464646;padding:14px;border-bottom:1px solid #ccc}.design-tool-heading .dropdown-menu>li.active>a{background-color:#4262ff;color:#fff}.design-tool-heading .dropdown-menu>li.active>a:hover{background-color:#4262ff;color:#fff}.design-tool-heading .dropdown-menu>li>a:focus,.design-tool-heading .dropdown-menu>li>a:hover{;background-color:transparent;outline:0}.free-tool-btn{border-radius:2px;background:#4262ff;border:none;padding:10px 30px;color:#fff;font-size:18px;font-weight:400;outline:0;transition:all .5s ease 0s}
		@media (min-width: 320px) and (max-width: 480px) {
		.design-tool-heading > a { font-size: 27px; } }
		.logo_maker .icon_gallery>li { border-left: none; width: 25%; border-top: none; padding:7px;}
		#text-styles-div button.active {background-color: #262626;}
		#align-custom-option {float: left;margin-right: 6px;width: 85px;padding: 8px; font-size: 16px;border: 1px solid #ccc;}
		#align-custom-option:focus {outline:none;}
		#AddTextFieldBtn.free-tool-btn{background-color: #6a6b6b; border: none; color: #fff; padding: 6px 10px 0px; font-size: 20px;vertical-align: super;border-radius: 4px;outline: none; font-size: 24px;}
		#align-custom-option {margin-left:47px;}		.active-text-select #align-custom-option {margin-left:0px;}
		#AddTextFieldBtn svg { width: 21px;fill: #fff;}
		#text-color.icon-layer {height:41px;}
	@media (min-width: 320px) and (max-width: 767px) {
		.logo_maker #pickerTool.color-picker { margin: 0px 1px 0 0; }
		 .active-text-select #text-color.icon-layer.active {display:none;}
	}
		
.design-tool-heading .dropdown-menu>li>a{display:block}
		ul.dropdown-menu {
    position: absolute;
    top: 100%;
    left: 0;
    z-index: 1000;
    display: none;
    float: left;
    min-width: 160px;
    padding: 5px 0;
    margin: 2px 0 0;
    font-size: 14px;
    text-align: left;
    list-style: none;
    background-color: #fff;
    -webkit-background-clip: padding-box;
    background-clip: padding-box;
    border: 1px solid #ccc;
    border: 1px solid rgba(0, 0, 0, .15);
    border-radius: 4px;
    -webkit-box-shadow: 0 6px 12px rgba(0, 0, 0, .175);
    box-shadow: 0 6px 12px rgba(0, 0, 0, .175);
}

.design-tool-heading .dropdown-menu li:nth-child(1){border-top:1px solid #ddd;}