ngohungcuong.windy@gmail.com / T-Shats Frontend

Browse Code »

Commit e32d6b2cb5fdca1e68b6e685cea458c300aebe08

Authored by TRUONG 2016-11-18 01:12:21 +0900

1 parent 9e6e89dc74

Exists in master and in 1 other branch

fix style

Showing 2 changed files with 9 additions and 3 deletions Inline Diff

app/styles/main.css
dist/styles/598e506e.main.css

app/styles/main.css

Diff comments View file @ e32d6b2

 /* Space out content a bit */
 @import "../fonts/font.css";
 @import "../fonts/font_canvas/font-canvas.css";
 body {
   font-family: 'Hiragino Kaku Gothic Pro', sans-serif;
   /*font-family: 'gn_aki_iro_sesami_cookies';*/
 }
 /*Scroll bar style*/
 ::-webkit-scrollbar {
   -webkit-appearance: none;
   width: 7px;
 }
 ::-webkit-scrollbar-thumb {
   border-radius: 4px;
   background-color: rgba(0,0,0,.5);
   -webkit-box-shadow: 0 0 1px rgba(255,255,255,.5);
 }
 /*End scroll bar style*/
 .padding-right-0{
   padding-right: 0!important;
 }
 .padding-left-0{
   padding-left: 0!important;
 }
 button.red{
   color: #ffffff;
   background-color: #ff0000;
   border: 1px solid #ff0000;
 }
 button.white{
   border: 1px solid #ff8080;
   color: #ff8080;
   background-color: #ffffff;
 }
 button.brown{
   background-color: #666666;
   border: 1px solid #666666;
   color: #ffffff;
   border-radius: 5px;
 }
 button.black{
   border: 1px solid #c9c9c9;
   background-color: #343434;
   color: #ffffff;
   padding: 1px 6px;
 }
 #tshirt-container{
   border-left: 1px solid #dcdcdc;
   border-right: 1px solid #dcdcdc;
 }
 /*HEADER*/
 header{
   border-bottom: 1px solid #dcdcdc;
 }
 header .logo{
   color: #ed1d24;
   font-size: 30px;
   text-transform: uppercase;
   font-weight: bold;
 }
 header .logo img{
   width: 60px;
 }
 /*NAVIGATION*/
 nav{
   border-bottom: 1px solid #dcdcdc;
   padding: 10px 0;
 }
 nav h2{
   font-size: 27px;
   margin: 0 0;
 }
 nav ul{
   list-style: none;
   padding-left: 0;
   margin-bottom: 0;
 }
 nav ul li{
   margin-left: 2px;
   float: left;
   padding: 6px 12px;
   background-color: #999999;
   position: relative;
 }
 nav ul li i.fa{
   position: absolute;
   color: #ffffff;
   font-size: 18px;
   right: -4px;
   top: 50%;
   transform: translateX(-50%) translateY(-50%);
   -webkit-transform: translateX(-50%) translateY(-50%);
 }
 nav ul li a{
   color: #ffffff;
 }
 nav ul li:hover a{
   text-decoration: none;
   color: #ffffff;
 }
 nav ul li.action{
   color: #ffffff;
   background-color: #ed1d24;
 }
 /*ASIDE*/
 aside{
   margin: 10px 0;
 }
 aside .break-down{
   padding: 0 0;
 }
 aside .break-down i.fa{
   font-size: 35px;
   color: #ff0000;
 }
 aside .break-line{
   height: 10px;
 }
 aside .break-line hr{
   border-top: 1px dotted #cccccc;
 }
 aside .step{
   margin: 0 0;
 }
 aside .step .title{
   font-size: 15px;
   line-height: 16px;
   font-weight: bold;
   margin-bottom: 3px;
 }
 aside .step .title-notice{
   font-size: 13px;
   line-height: 16px;
   margin-bottom: 3px;
 }
 aside .step .title-notice .require{
   font-size: 10px;
 }
 aside .step .step-box{
   border: 2px solid #dcdcdc;
   font-size: 12px;
 }
 /*Step 1*/
 aside .step .step-box .tshirt-design{
   border: 1px solid #cccccc;
   background-color: #f5f5f5;
   margin: 10px 10px;
 }
 aside .step .step-box .tshirt-design:hover{
   border: 1px solid #ff0000;
 }
 aside .step .step-box .tshirt-design button:hover{
   background-color: #fa7b7b;
   border: 1px solid #fa7b7b;
 }
 aside .step .step-box .tshirt-design div{
   float: left;
 }
 aside .step .step-box .tshirt-design .icon{
   padding: 4px 4px;
   border-right: 1px solid #cccccc;
 }
 aside .step .step-box .tshirt-design .icon img{
   height: 50px;
 }
 aside .step .step-box .tshirt-design .name{
   padding: 10px 10px;
 }
 aside .step .step-box .tshirt-design .action{
   padding: 10px 10px;
   float: right;
 }
 aside .step .step-box .tshirt-design .action button{
   padding: 8px 10px;
 }
 /*Step 2*/
 aside .step .step-box .tshirt-color{
   padding: 6px 10px;
   position: relative;
 }
 aside .step .step-box .tshirt-color ul.choice-color{
   float: left;
   list-style: none;
   padding-left: 0;
   width: 100%;
   margin-bottom: 3px;
 }
 aside .step .step-box .tshirt-color ul.choice-color li{
   margin: 0 10px 0 0;
   border: 1px solid #cccccc;
   padding: 2px 2px;
   float: left;
   cursor: pointer;
 }
 aside .step .step-box .tshirt-color ul.choice-color li.action{
   border: 1px solid #ff0000;
 }
 aside .step .step-box .tshirt-color ul.choice-color li:hover{
   border: 1px solid #ff0000;
 }
 aside .step .step-box .tshirt-color ul.choice-color li div{
   height: 30px;
   width: 30px;
 }
 aside .step .step-box .tshirt-color ul.choice-color li.white div{
   background-color: #ece7e4;
 }
 aside .step .step-box .tshirt-color ul.choice-color li.blue div{
   background-color: #e7dfd0;
 }
 aside .step .step-box .tshirt-color .color-name{
   width: 100%;
   font-size: 10px;
 }
 aside .step .step-box .tshirt-color .view-more{
   position: absolute;
   bottom: 6px;
   right: 10px;
 }
 /*Step 3*/
 aside .step .step-box .tshirt-saveorder{
   padding: 10px 10px 6px 10px;
 }
 aside .step .step-box .tshirt-saveorder .action{
   width: 50%;
   float: left;
 }
 aside .step .step-box .tshirt-saveorder .action:first-child{
   padding-right: 5px;
 }
 aside .step .step-box .tshirt-saveorder .action:last-child{
   padding-left: 5px;
 }
 aside .step .step-box .tshirt-saveorder .action button{
   padding: 8px 10px;
 }
 aside .step .step-box .tshirt-saveorder .action button .text{
   float: left;
   width: 80%;
   text-align: center;
   padding-left: 10px;
   vertical-align: bottom;
 }
 aside .step .step-box .tshirt-saveorder .action button .arrow{
   float: left;
   width: 20%;
   height: 40px;
   position: relative;
 }
 aside .step .step-box .tshirt-saveorder .action button .arrow i.fa{
   position: absolute;
   top: 50%;
   right: -6px;
   transform: translateX(-50%) translateY(-50%);
   -webkit-transform: translateX(-50%) translateY(-50%);
 }
 aside .step .step-box .tshirt-saveorder .notice{
   padding: 5px 0 0 0;
 }
 /*Step 4*/
 aside .step .title-notice{
 }
 aside .step .step-box .change-design{
   padding: 4px 4px;
 }
 aside .step .step-box .change-design table{
 }
 aside .step .step-box .change-design table tr{
   border-bottom: 1px dotted #cccccc;
 }
 aside .step .step-box .change-design table tr:last-child{
   border-bottom: 0;
 }
 /*Step 5- finish*/
 aside .step .finish-design{
   padding: 20px 0;
 }
 aside .step .finish-design button{
   width: 100%;
   padding: 8px 10px;
 }
 /*DESIGN CONTENT*/
 #tshirt-content{
   position: relative;
 }
 #tshirt-content .switch-border-design{
   position: absolute;
   top: 5px;
   right: 10px;
   color: red;
   font-size: 11px;
 }
 #tshirt-content .tshirt-image{
   padding: 20px 0 0 0;
 }
 #tshirt-content .tshirt-choice{
 }
 #tshirt-content .tshirt-choice ul{
   list-style: none;
   padding-left: 0;
   display: table;
   margin: auto;
 }
 #tshirt-content .tshirt-choice ul li{
   float: left;
   margin: 10px 10px;
   cursor: pointer;
 }
 #tshirt-content .tshirt-choice ul li .image{
   border: 1px solid #cccccc;
   padding: 3px 3px;
 }
 #tshirt-content .tshirt-choice ul li.focus{
 }
 #tshirt-content .tshirt-choice ul li.focus .image{
   border: 1px solid #ff0000;
 }
 #tshirt-content .tshirt-choice ul li .image img{
   width: 50px;
   height: auto;
 }
 /*MODAL Design*/
 #tshirt-design{
   background-color: #666666;
 }
 #tshirt-design .modal-dialog{
   width: 75%;
   margin: 0 auto;
 }
 #tshirt-design .modal-dialog .modal-content{
   background-color: transparent;
   border-radius: 0;
   border: 0;
   -webkit-box-shadow: 0 0 0 rgba(0, 0, 0, .5)!important;
   box-shadow: 0 0 0 rgba(0, 0, 0, .5)!important;
 }
 #tshirt-design .modal-dialog .modal-content .modal-header{
   padding: 0 0 10px 0;
   border-bottom: 0;
   border-shadow: none!important;
 }
 #tshirt-design .modal-dialog .modal-content .modal-body{
   background-color: #f5f5f5;
   padding: 0 0;
 }
 #tshirt-design header{
   border-bottom: 1px solid #cccccc;
   background-color: #dddddd;
 }
 #tshirt-design header ul.nav{
   padding-left: 0;
   list-style: none;
 }
 #tshirt-design header ul.nav li{
   float: left;
   padding: 8px 26px;
   border-right: 1px solid #cccccc;
   font-size: 14px;
   cursor: pointer;
 }
 #tshirt-design header ul.nav li:hover, #tshirt-design header ul.nav li.active{
   background-color: red;
   color: #ffffff;
 }
 #tshirt-design header ul.nav li:hover i.fa, #tshirt-design header ul.nav li.active i.fa{
   color: #ffffff;
 }
 #tshirt-design header ul.nav li i.fa{
   color: #fe070f;
   font-size: 20px;
   margin-right: 10px;
 }
 #tshirt-design header .action{
 }
 #tshirt-design header .action button{
   padding: 2px 10px;
   margin: 6px 10px;
 }
 #tshirt-design header .action button:hover{
   background-color: red;
   color: #ffffff;
 }
 /*Aside modal*/
 .aside{
 }
 .aside .box-design-option{
   list-style: none;
   padding-left: 0;
   margin-top: 10px;
 }
 .aside .box-design-option li{
   border: 1px solid #cdcdcd;
   position: relative;
   /*cursor: pointer;*/
   margin-bottom: 10px;
 }
 .aside .box-design-option li .hover{
   background-color: #fddad4;
   opacity: 0.6;
   position: absolute;
   width: 100%;
   height: 100%;
   display: none;
 }
 .aside .box-design-option li:hover .hover{
   display: block;
 }
 .aside .box-design-option li .title{
   background: url("../images/bg1.png") repeat #cdcdcd;
   padding: 3px 10px;
 }
 .aside .box-design-option li .title i.fa{
   color: #000000;
 }
 .aside .box-design-option li .content{
 }
 .aside .box-design-option li .content i.fa{
   font-size: 30px;
   color: #fe070f;
   margin: 8px 0;
 }
 .aside .box-design-option li .content .des{
   padding: 3px 10px 3px 0;
 }
 .aside .box-design-option li .content .color-patterns {
   width: 100%;
   border: #bbb solid 1px;
   background: #FFF;
   margin-top: 5px;
   min-height: 65px;
 }
 .aside .box-design-option li .content .color-patterns .color-pattern-item{
   height: 20px;
   float: left;
   margin-left: 4px;
   margin-top: 2px;
   width: 20px;
   cursor: pointer;
   border: 1px solid #ddd;
 }
 .aside .box-design-option li .content .color-patterns .color-pattern-item:hover {
   outline: 1px solid #ed1d24;
 }
 .aside .box-design-option li .content .layer-item {
   text-align: center;
   border: 1px #ddd solid;
   background: #FFF;
   padding: 5px;
   font-size: 12px;
   cursor: pointer;
 }
 .aside .box-design-option li .content .layer-item:hover {
   background: #ffcccc;
 }
 /*Design Text*/
 .aside #choice-text{
 }
 .aside #choice-text .content{
   padding: 10px 10px;
 }
 .aside #choice-text .content ul.font-family-box{
   list-style: none;
   margin: 10px 0;
   padding-left: 0;
   height: 180px;
   width: 100%;
   overflow-y: scroll;
   border: 1px solid #c0c0c0;
 }
 .aside #choice-text .content .font-family-box li{
   cursor: pointer;
   padding: 4px 8px;
   border: 0;
   border-bottom: 1px solid #c0c0c0;
   border-right: 1px solid #c0c0c0;
   font-size: 16px;
 }
 .aside #choice-text .content .spacing-letter{
 }
 .aside #choice-text .content .spacing-letter .text-label{
   font-size: 16px;
   padding: 4px 0;
 }
 .aside #choice-text .content .spacing-letter .box{
   border: 1px solid #8c8c8c;
   box-shadow: 0 0 5px #888888;
   background-color: #f0f0f0;
 }
 .aside #choice-text .content .spacing-letter .item{
   float: left;
 }
 .aside #choice-text .content .spacing-letter .item i.fa{
   font-size: 22px;
   margin: 0 0;
   color: #000000;
 }
 .aside #choice-text .content .spacing-letter .item-text{
   padding: 6px 20px;
   font-size: 12px;
 }
 .aside #choice-text .content .spacing-letter .item-plus{
   border-right: 1px solid #8c8c8c;
 }
 .aside #choice-text .content .spacing-letter .item-minus{
   border-left: 1px solid #8c8c8c;
 }
 .aside #choice-text .content .spacing-letter .item-plus, .aside #choice-text .content .spacing-letter .item-minus {
   padding: 5px 6px 1px 6px;
   cursor: pointer;
 }
 /*Design Choice Illustration*/
 .aside #choice-illustration li .content {
   padding: 10px 10px;
 }
 .aside #choice-illustration li .content select{
   width: 100%;
 }
 .aside #choice-illustration li .content .illustration-list {
   width: 100%;
   border: #bbb solid 1px;
   background: #FFF;
   margin-top: 5px;
-  min-height: 350px;
+  min-height: 310px;
+  padding-bottom: 20px;
 }
 .aside #choice-illustration li .content .illustration-list .illstration-item{
   height: 60px;
   overflow: hidden;
   float: left;
   margin-left: 6px;
   margin-top: 5px;
   margin-bottom: 5px;
   padding: 2px;
   background: #e2e2e2;
   border: solid 2px #d7d7d7;
   cursor: pointer;
 }
 .aside #choice-illustration li .content .illustration-list .illstration-item:hover {
   outline: 2px solid #ed1d24;
 }
 .aside #choice-illustration li .content .illustration-list .illstration-item img {
   width: 50px;
   cursor: pointer;
 }
 .aside #choice-illustration li .content .illustration-list .footer-bar {
-  text-align: center;
+    text-align: center;
-  margin-top: 5px;
+    margin-top: 5px;
+    bottom: 10px;
+    position: absolute;
+    width: 100%;
+    padding-right: 20px;
 }
 .aside #choice-illustration li .content .illustration-list .footer-bar .footer-pagination {
   margin-right: 5px;
   cursor: pointer;
   font-size: 9px;
   color: #FFF;
   background: #666666;
   text-transform: uppercase;
   padding: 2px 5px;
 }
 .aside #choice-illustration li .content .illustration-list .footer-bar .footer-pagination:hover {
   background: #999999;
 }
 #btn-choose-image {
   background: #ff0f00;
   cursor: pointer;
   margin: 10px 0px;
   padding: 0 10px;
   color: #FFF;
   font-size: 12px;
 }
 #btn-choose-image:hover {
   background: #f8aeae;
 }
 .aside #choice-image li .content {
   margin: 0 10px;
   padding: 10px 0;
 }
 .aside #choice-image li .content .small-text {
   font-size:10px;
   margin-bottom: 10px;
 }
 .aside #choice-image {
   font-size: 13px;
 }
 .aside #imgLoader{
   display: none;
 }
 .aside #choice-image li .content .list-images {
   height: 300px;
   background: #FFF;
   border: 1px solid #DDD;
 }
 /*Design content*/
 .tshirt-design-container{
   position: relative;
 }
 .tshirt-design-container .design-content{
   padding: 10px 30px 10px 15px;
 }
 .tshirt-design-container .design-content .content{
   width: 100%;
   min-height: 650px;
   background-color: #f0efea;
   padding: 40px 40px;
   height: 100%;
 }
 .tshirt-design-container .design-content .content .selection-design{
   border: 1px solid #ff0000;
   width: 100%;
   height: 620px;
 }
 .tshirt-design-container .agree-design{
   position: absolute;
   right: -16px;
   top: 40%;
 }
 .tshirt-design-container .trash-design{
   position: absolute;
   right: 5px;
   bottom: 0;
 }
 /*FOOTER*/
 footer{
   background-color: #333333;
 }
 footer ul.nav-footer{
   padding-left: 0;
   list-style: none;
 }
 footer ul.nav-footer li{
   float: left;
   padding: 3px 10px;
   border-right: 1px dotted #ffffff;
 }
 footer ul.nav-footer li a{
   color: #ffffff;
   font-size: 11px;
 }
 /* Customize container */
 @media (min-width: 768px) {
   .container {
     /*max-width: 730px;*/
   }
 }
 /* Responsive: Portrait tablets and up */
 @media screen and (min-width: 768px) {
   /* Remove the padding we set earlier */
 }

dist/styles/598e506e.main.css

Diff comments View file @ e32d6b2

File was created

body{font-family:'Hiragino Kaku Gothic Pro',sans-serif}import "../fonts/font_canvas/font-canvas.css";body{font-family:'Hiragino Kaku Gothic Pro',sans-serif}::-webkit-scrollbar{-webkit-appearance:none;width:7px}::-webkit-scrollbar-thumb{border-radius:4px;background-color:rgba(0,0,0,.5);-webkit-box-shadow:0 0 1px rgba(255,255,255,.5)}.padding-right-0{padding-right:0!important}.padding-left-0{padding-left:0!important}button.red{color:#fff;background-color:red;border:1px solid red}button.white{border:1px solid #ff8080;color:#ff8080;background-color:#fff}button.brown{background-color:#666;border:1px solid #666;color:#fff;border-radius:5px}button.black{border:1px solid #c9c9c9;background-color:#343434;color:#fff;padding:1px 6px}#tshirt-container{border-left:1px solid #dcdcdc;border-right:1px solid #dcdcdc}header{border-bottom:1px solid #dcdcdc}header .logo{color:#ed1d24;font-size:30px;text-transform:uppercase;font-weight:700}header .logo img{width:60px}nav{border-bottom:1px solid #dcdcdc;padding:10px 0}nav h2{font-size:27px;margin:0}nav ul{list-style:none;padding-left:0;margin-bottom:0}nav ul li{margin-left:2px;float:left;padding:6px 12px;background-color:#999;position:relative}nav ul li i.fa{position:absolute;color:#fff;font-size:18px;right:-4px;top:50%;transform:translateX(-50%) translateY(-50%);-webkit-transform:translateX(-50%) translateY(-50%)}nav ul li a{color:#fff}nav ul li:hover a{text-decoration:none;color:#fff}nav ul li.action{color:#fff;background-color:#ed1d24}aside{margin:10px 0}aside .break-down{padding:0}aside .break-down i.fa{font-size:35px;color:red}aside .break-line{height:10px}aside .break-line hr{border-top:1px dotted #ccc}aside .step{margin:0}aside .step .title{font-size:15px;line-height:16px;font-weight:700;margin-bottom:3px}aside .step .title-notice{font-size:13px;line-height:16px;margin-bottom:3px}aside .step .title-notice .require{font-size:10px}aside .step .step-box{border:2px solid #dcdcdc;font-size:12px}aside .step .step-box .tshirt-design{border:1px solid #ccc;background-color:#f5f5f5;margin:10px}aside .step .step-box .tshirt-design:hover{border:1px solid red}aside .step .step-box .tshirt-design button:hover{background-color:#fa7b7b;border:1px solid #fa7b7b}aside .step .step-box .tshirt-design div{float:left}aside .step .step-box .tshirt-design .icon{padding:4px;border-right:1px solid #ccc}aside .step .step-box .tshirt-design .icon img{height:50px}aside .step .step-box .tshirt-design .name{padding:10px}aside .step .step-box .tshirt-design .action{padding:10px;float:right}aside .step .step-box .tshirt-design .action button{padding:8px 10px}aside .step .step-box .tshirt-color{padding:6px 10px;position:relative}aside .step .step-box .tshirt-color ul.choice-color{float:left;list-style:none;padding-left:0;width:100%;margin-bottom:3px}aside .step .step-box .tshirt-color ul.choice-color li{margin:0 10px 0 0;border:1px solid #ccc;padding:2px;float:left;cursor:pointer}aside .step .step-box .tshirt-color ul.choice-color li.action,aside .step .step-box .tshirt-color ul.choice-color li:hover{border:1px solid red}aside .step .step-box .tshirt-color ul.choice-color li div{height:30px;width:30px}aside .step .step-box .tshirt-color ul.choice-color li.white div{background-color:#ece7e4}aside .step .step-box .tshirt-color ul.choice-color li.blue div{background-color:#e7dfd0}aside .step .step-box .tshirt-color .color-name{width:100%;font-size:10px}aside .step .step-box .tshirt-color .view-more{position:absolute;bottom:6px;right:10px}aside .step .step-box .tshirt-saveorder{padding:10px 10px 6px}aside .step .step-box .tshirt-saveorder .action{width:50%;float:left}aside .step .step-box .tshirt-saveorder .action:first-child{padding-right:5px}aside .step .step-box .tshirt-saveorder .action:last-child{padding-left:5px}aside .step .step-box .tshirt-saveorder .action button{padding:8px 10px}aside .step .step-box .tshirt-saveorder .action button .text{float:left;width:80%;text-align:center;padding-left:10px;vertical-align:bottom}aside .step .step-box .tshirt-saveorder .action button .arrow{float:left;width:20%;height:40px;position:relative}aside .step .step-box .tshirt-saveorder .action button .arrow i.fa{position:absolute;top:50%;right:-6px;transform:translateX(-50%) translateY(-50%);-webkit-transform:translateX(-50%) translateY(-50%)}aside .step .step-box .tshirt-saveorder .notice{padding:5px 0 0}aside .step .step-box .change-design{padding:4px}aside .step .step-box .change-design table tr{border-bottom:1px dotted #ccc}aside .step .step-box .change-design table tr:last-child{border-bottom:0}aside .step .finish-design{padding:20px 0}aside .step .finish-design button{width:100%;padding:8px 10px}#tshirt-content{position:relative}#tshirt-content .switch-border-design{position:absolute;top:5px;right:10px;color:red;font-size:11px}#tshirt-content .tshirt-image{padding:20px 0 0}#tshirt-content .tshirt-choice ul{list-style:none;padding-left:0;display:table;margin:auto}#tshirt-content .tshirt-choice ul li{float:left;margin:10px;cursor:pointer}#tshirt-content .tshirt-choice ul li .image{border:1px solid #ccc;padding:3px}#tshirt-content .tshirt-choice ul li.focus .image{border:1px solid red}#tshirt-content .tshirt-choice ul li .image img{width:50px;height:auto}#tshirt-design{background-color:#666}#tshirt-design .modal-dialog{width:75%;margin:0 auto}#tshirt-design .modal-dialog .modal-content{background-color:transparent;border-radius:0;border:0;-webkit-box-shadow:0 0 0 rgba(0,0,0,.5)!important;box-shadow:0 0 0 rgba(0,0,0,.5)!important}#tshirt-design .modal-dialog .modal-content .modal-header{padding:0 0 10px;border-bottom:0;border-shadow:none!important}#tshirt-design .modal-dialog .modal-content .modal-body{background-color:#f5f5f5;padding:0}#tshirt-design header{border-bottom:1px solid #ccc;background-color:#ddd}#tshirt-design header ul.nav{padding-left:0;list-style:none}#tshirt-design header ul.nav li{float:left;padding:8px 26px;border-right:1px solid #ccc;font-size:14px;cursor:pointer}#tshirt-design header ul.nav li.active,#tshirt-design header ul.nav li:hover{background-color:red;color:#fff}#tshirt-design header ul.nav li.active i.fa,#tshirt-design header ul.nav li:hover i.fa{color:#fff}#tshirt-design header ul.nav li i.fa{color:#fe070f;font-size:20px;margin-right:10px}#tshirt-design header .action button{padding:2px 10px;margin:6px 10px}#tshirt-design header .action button:hover{background-color:red;color:#fff}.aside .box-design-option{list-style:none;padding-left:0;margin-top:10px}.aside .box-design-option li{border:1px solid #cdcdcd;position:relative;margin-bottom:10px}.aside .box-design-option li .hover{background-color:#fddad4;opacity:.6;position:absolute;width:100%;height:100%;display:none}.aside .box-design-option li:hover .hover{display:block}.aside .box-design-option li .title{background:url(../images/bg1.png) repeat #cdcdcd;padding:3px 10px}.aside .box-design-option li .title i.fa{color:#000}.aside .box-design-option li .content i.fa{font-size:30px;color:#fe070f;margin:8px 0}.aside .box-design-option li .content .des{padding:3px 10px 3px 0}.aside .box-design-option li .content .color-patterns{width:100%;border:#bbb solid 1px;background:#FFF;margin-top:5px;min-height:65px}.aside .box-design-option li .content .color-patterns .color-pattern-item{height:20px;float:left;margin-left:4px;margin-top:2px;width:20px;cursor:pointer;border:1px solid #ddd}.aside .box-design-option li .content .color-patterns .color-pattern-item:hover{outline:1px solid #ed1d24}.aside .box-design-option li .content .layer-item{text-align:center;border:1px #ddd solid;background:#FFF;padding:5px;font-size:12px;cursor:pointer}.aside .box-design-option li .content .layer-item:hover{background:#fcc}.aside #choice-text .content{padding:10px}.aside #choice-text .content ul.font-family-box{list-style:none;margin:10px 0;padding-left:0;height:180px;width:100%;overflow-y:scroll;border:1px solid silver}.aside #choice-text .content .font-family-box li{cursor:pointer;padding:4px 8px;border:0;border-bottom:1px solid silver;border-right:1px solid silver;font-size:16px}.aside #choice-text .content .spacing-letter .text-label{font-size:16px;padding:4px 0}.aside #choice-text .content .spacing-letter .box{border:1px solid #8c8c8c;box-shadow:0 0 5px #888;background-color:#f0f0f0}.aside #choice-text .content .spacing-letter .item{float:left}.aside #choice-text .content .spacing-letter .item i.fa{font-size:22px;margin:0;color:#000}.aside #choice-text .content .spacing-letter .item-text{padding:6px 20px;font-size:12px}.aside #choice-text .content .spacing-letter .item-plus{border-right:1px solid #8c8c8c}.aside #choice-text .content .spacing-letter .item-minus{border-left:1px solid #8c8c8c}.aside #choice-text .content .spacing-letter .item-minus,.aside #choice-text .content .spacing-letter .item-plus{padding:5px 6px 1px;cursor:pointer}.aside #choice-illustration li .content{padding:10px}.aside #choice-illustration li .content select{width:100%}.aside #choice-illustration li .content .illustration-list{width:100%;border:#bbb solid 1px;background:#FFF;margin-top:5px;min-height:350px}.aside #choice-illustration li .content .illustration-list .illstration-item{height:60px;overflow:hidden;float:left;margin-left:6px;margin-top:5px;margin-bottom:5px;padding:2px;background:#e2e2e2;border:solid 2px #d7d7d7;cursor:pointer}.aside #choice-illustration li .content .illustration-list .illstration-item:hover{outline:2px solid #ed1d24}.aside #choice-illustration li .content .illustration-list .illstration-item img{width:50px;cursor:pointer}.aside #choice-illustration li .content .illustration-list .footer-bar{text-align:center;margin-top:5px}.aside #choice-illustration li .content .illustration-list .footer-bar .footer-pagination{margin-right:5px;cursor:pointer;font-size:9px;color:#FFF;background:#666;text-transform:uppercase;padding:2px 5px}.aside #choice-illustration li .content .illustration-list .footer-bar .footer-pagination:hover{background:#999}#btn-choose-image{background:#ff0f00;cursor:pointer;margin:10px 0;padding:0 10px;color:#FFF;font-size:12px}#btn-choose-image:hover{background:#f8aeae}.aside #choice-image li .content{margin:0 10px;padding:10px 0}.aside #choice-image li .content .small-text{font-size:10px;margin-bottom:10px}.aside #choice-image{font-size:13px}.aside #imgLoader{display:none}.aside #choice-image li .content .list-images{height:300px;background:#FFF;border:1px solid #DDD}.tshirt-design-container{position:relative}.tshirt-design-container .design-content{padding:10px 30px 10px 15px}.tshirt-design-container .design-content .content{width:100%;min-height:650px;background-color:#f0efea;padding:40px;height:100%}.tshirt-design-container .design-content .content .selection-design{border:1px solid red;width:100%;height:620px}.tshirt-design-container .agree-design{position:absolute;right:-16px;top:40%}.tshirt-design-container .trash-design{position:absolute;right:5px;bottom:0}footer{background-color:#333}footer ul.nav-footer{padding-left:0;list-style:none}footer ul.nav-footer li{float:left;padding:3px 10px;border-right:1px dotted #fff}footer ul.nav-footer li a{color:#fff;font-size:11px}