Blame view
app/styles/main.css
20.5 KB
c87bc1f33
|
1 |
/* Space out content a bit */ |
87c93a029
|
2 |
@import "../fonts/font.css"; |
ba689b493
|
3 |
@import "../fonts/font_canvas/font-canvas.css"; |
0136530e3
|
4 |
@import "placedesign.css"; |
2f4c31749
|
5 6 7 8 |
html{ height:100%; width:100%; } |
c87bc1f33
|
9 |
body { |
836a597e5
|
10 |
font-family: 'Hiragino Kaku Gothic Pro', sans-serif; |
2f4c31749
|
11 12 |
height:100%; width:100%; |
862daa8a4
|
13 |
} |
04cbb68af
|
14 15 16 17 18 |
/*Scroll bar style*/ ::-webkit-scrollbar { -webkit-appearance: none; width: 7px; } |
2f4c31749
|
19 20 21 |
::-webkit-scrollbar-track { -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3); } |
04cbb68af
|
22 23 24 25 26 27 |
::-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*/ |
862daa8a4
|
28 29 30 31 32 |
.padding-right-0{ padding-right: 0!important; } .padding-left-0{ padding-left: 0!important; |
e7c9c7707
|
33 34 35 36 37 |
} button.red{ color: #ffffff; background-color: #ff0000; border: 1px solid #ff0000; |
236cbc7b4
|
38 39 40 41 42 43 44 45 46 47 |
} button.yellow1{ background:url("../images/bgbutton1.png") repeat #ff801d; color: #ffffff; border: 1px solid #ff801d; } button.yellow2{ background:url("../images/bgbutton2.png") repeat #ff801d; color: #ffffff; border: 1px solid #ff801d; |
c87bc1f33
|
48 |
} |
e7c9c7707
|
49 |
button.white{ |
236cbc7b4
|
50 51 |
border: 1px solid #ff801d; color: #ff801d; |
e7c9c7707
|
52 53 54 55 56 57 58 59 |
background-color: #ffffff; } button.brown{ background-color: #666666; border: 1px solid #666666; color: #ffffff; border-radius: 5px; } |
862daa8a4
|
60 61 62 63 64 65 |
button.black{ border: 1px solid #c9c9c9; background-color: #343434; color: #ffffff; padding: 1px 6px; } |
236cbc7b4
|
66 67 68 69 |
button.none{ border: 0; background-color: transparent; } |
e7c9c7707
|
70 |
#tshirt-container{ |
8f087d204
|
71 72 |
border-left: 1px solid #dcdcdc; border-right: 1px solid #dcdcdc; |
c87bc1f33
|
73 |
} |
8f087d204
|
74 75 76 |
/*HEADER*/ header{ border-bottom: 1px solid #dcdcdc; |
c87bc1f33
|
77 |
} |
8f087d204
|
78 |
header .logo{ |
5c778530c
|
79 |
padding-left: 0!important; |
c87bc1f33
|
80 |
} |
8f087d204
|
81 |
header .logo img{ |
5c778530c
|
82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 |
height: 60px; } header .social-share{ list-style: none; background-color: #eeeeee; display: table; padding-left: 0; margin-bottom: 0; } header .social-share li{ float: left; margin: 15px 15px; background-color: #c5c5c5; width: 30px; height: 30px; -moz-border-radius: 15px; -webkit-border-radius: 15px; border-radius: 15px; text-align: center; padding: 6px 0; } header .social-share li i{ font-size: 20px; color: #ffffff; } header .top-menu{ list-style: none; padding-left: 0; |
c55955c06
|
110 |
margin-bottom: 5px; |
5c778530c
|
111 112 113 |
} header .top-menu li{ float: left; |
c55955c06
|
114 115 116 117 118 119 120 121 122 123 124 |
padding: 6px 0; } header .top-menu li a{ color: #000000; padding: 0 10px; border-right: 1px solid #000000; font-size: 12px; } header .top-menu li:last-child a{ border-right: 0; |
5c778530c
|
125 126 127 128 129 130 131 132 133 134 135 136 137 |
} header .top-control{ list-style: none; padding-left: 0; margin-bottom: 0; } header .top-control li{ float: left; margin: 0 10px; } header .top-control li .bt-yellow{ background-color: #fe6a00; color: #ffffff; |
c55955c06
|
138 |
padding: 3px 10px; |
5c778530c
|
139 140 141 142 143 |
font-size: 12px; } header .user-control{ background-color: #888888; text-align: center; |
c87bc1f33
|
144 |
} |
c55955c06
|
145 146 147 148 149 150 151 152 153 154 155 |
header .user-control div{ font-size: 12px; color: #ffffff; } header .user-control div:first-child{ padding: 10px 10px; } header .user-control div:last-child{ background-color: #fe6a00; padding: 3px 10px; } |
8f087d204
|
156 157 158 |
/*NAVIGATION*/ nav{ border-bottom: 1px solid #dcdcdc; |
c55955c06
|
159 |
padding: 5px 0; |
c87bc1f33
|
160 |
} |
8f087d204
|
161 |
nav h2{ |
862daa8a4
|
162 |
font-size: 27px; |
c55955c06
|
163 |
margin: 20px 0; |
c87bc1f33
|
164 |
} |
8f087d204
|
165 166 167 |
nav ul{ list-style: none; padding-left: 0; |
862daa8a4
|
168 |
margin-bottom: 0; |
a56541cf9
|
169 |
|
c87bc1f33
|
170 |
} |
8f087d204
|
171 |
nav ul li{ |
8f087d204
|
172 |
float: left; |
c55955c06
|
173 174 175 176 177 178 179 180 181 182 183 184 185 186 187 188 189 190 |
} nav ul li.line{ border-bottom: 2px dashed #000000; width: 34px; height: 34px; } nav ul li.line-action{ border-bottom: 2px dashed #fe6a00; } nav ul li.circle{ width: 70px; height: 70px; -moz-border-radius: 35px; -webkit-border-radius: 35px; border-radius: 35px; text-align: center; font-size: 12px; /*margin-left: 26px;*/ |
8f087d204
|
191 |
background-color: #999999; |
a56541cf9
|
192 |
position: relative; |
c55955c06
|
193 194 |
display: inline; cursor: pointer; |
a56541cf9
|
195 |
} |
c55955c06
|
196 197 |
nav ul li.circle a{ |
a56541cf9
|
198 |
color: #ffffff; |
c55955c06
|
199 |
position: absolute; |
a56541cf9
|
200 |
top: 50%; |
c55955c06
|
201 |
left: 50%; |
a56541cf9
|
202 203 |
transform: translateX(-50%) translateY(-50%); -webkit-transform: translateX(-50%) translateY(-50%); |
c87bc1f33
|
204 |
} |
a56541cf9
|
205 206 207 208 |
nav ul li:hover a{ text-decoration: none; color: #ffffff; } |
8f087d204
|
209 |
nav ul li.action{ |
c55955c06
|
210 |
background-color: #fe6a00; |
8f087d204
|
211 |
} |
e7c9c7707
|
212 213 |
/*ASIDE*/ aside{ |
862daa8a4
|
214 |
margin: 10px 0; |
e7c9c7707
|
215 |
} |
c55955c06
|
216 217 218 219 220 221 222 |
aside .break-left{ position: absolute; left: 50%; top: 50%; transform: translateX(-50%) translateY(-50%); -webkit-transform: translateX(-50%) translateY(-50%); } |
e7c9c7707
|
223 224 225 226 227 228 229 230 |
aside .break-down{ padding: 0 0; } aside .break-down i.fa{ font-size: 35px; color: #ff0000; } aside .break-line{ |
19a110aef
|
231 |
height: 10px; |
e7c9c7707
|
232 233 234 235 236 237 238 239 |
} aside .break-line hr{ border-top: 1px dotted #cccccc; } aside .step{ margin: 0 0; } aside .step .title{ |
862daa8a4
|
240 |
font-size: 15px; |
e7c9c7707
|
241 242 |
line-height: 16px; font-weight: bold; |
862daa8a4
|
243 |
margin-bottom: 3px; |
e7c9c7707
|
244 |
} |
236cbc7b4
|
245 246 247 248 249 250 251 252 253 254 255 256 257 |
aside .step .title span:first-child { float: left; width: 28% } aside .step .title span:last-child{ float: left; width: 72%; padding: 6px 0; } aside .step .title span:last-child { } |
e7c9c7707
|
258 259 260 |
aside .step .title-notice{ font-size: 13px; line-height: 16px; |
236cbc7b4
|
261 |
margin-bottom: 5px; |
e7c9c7707
|
262 263 264 265 266 267 268 |
} aside .step .title-notice .require{ font-size: 10px; } aside .step .step-box{ border: 2px solid #dcdcdc; font-size: 12px; |
236cbc7b4
|
269 |
position: relative; |
e7c9c7707
|
270 271 272 |
} /*Step 1*/ aside .step .step-box .tshirt-design{ |
c55955c06
|
273 |
margin: 4px 4px; |
e7c9c7707
|
274 |
} |
990a1e38d
|
275 |
aside .step .step-box .tshirt-design:hover{ |
c55955c06
|
276 |
/*border: 1px solid #ff0000;*/ |
990a1e38d
|
277 278 279 280 281 |
} aside .step .step-box .tshirt-design button:hover{ background-color: #fa7b7b; border: 1px solid #fa7b7b; } |
e7c9c7707
|
282 |
aside .step .step-box .tshirt-design div{ |
c55955c06
|
283 |
/*float: left;*/ |
e7c9c7707
|
284 285 286 |
} aside .step .step-box .tshirt-design .icon{ padding: 4px 4px; |
c55955c06
|
287 288 |
text-align: center; width: 100%; |
e7c9c7707
|
289 290 |
} aside .step .step-box .tshirt-design .icon img{ |
c55955c06
|
291 |
max-width: 100%; |
e7c9c7707
|
292 |
} |
236cbc7b4
|
293 |
|
e7c9c7707
|
294 |
aside .step .step-box .tshirt-design .name{ |
c55955c06
|
295 296 |
padding: 2px 4px; text-align: center; |
e7c9c7707
|
297 298 299 |
} aside .step .step-box .tshirt-design .action{ |
c55955c06
|
300 301 |
/*padding: 10px 10px;*/ /*float: right;*/ |
e7c9c7707
|
302 303 304 |
} aside .step .step-box .tshirt-design .action button{ |
c55955c06
|
305 306 |
padding: 6px 8px; width: 100%; |
e7c9c7707
|
307 308 309 |
} /*Step 2*/ aside .step .step-box .tshirt-color{ |
236cbc7b4
|
310 311 |
padding: 6px 6px; height: 100%; |
e7c9c7707
|
312 313 |
position: relative; } |
236cbc7b4
|
314 |
|
e7c9c7707
|
315 316 317 318 319 |
aside .step .step-box .tshirt-color ul.choice-color{ float: left; list-style: none; padding-left: 0; width: 100%; |
862daa8a4
|
320 |
margin-bottom: 3px; |
e7c9c7707
|
321 322 |
} aside .step .step-box .tshirt-color ul.choice-color li{ |
236cbc7b4
|
323 |
margin: 0 6px 6px 0; |
e7c9c7707
|
324 325 326 |
border: 1px solid #cccccc; padding: 2px 2px; float: left; |
990a1e38d
|
327 328 329 330 331 332 333 |
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; |
e7c9c7707
|
334 335 |
} aside .step .step-box .tshirt-color ul.choice-color li div{ |
236cbc7b4
|
336 337 338 |
height: 26px; width: 26px; margin: 0; |
e7c9c7707
|
339 340 341 342 343 344 345 346 |
} 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; } |
236cbc7b4
|
347 348 349 350 351 352 353 354 |
aside .step .step-box .choice-color-bottom{ position: absolute; bottom: 0; left: 0; width: 80%; margin: 0 10%; } aside .step .step-box .choice-color-bottom .color-name{ |
e7c9c7707
|
355 |
width: 100%; |
236cbc7b4
|
356 357 358 |
font-size: 12px; text-align: center; padding: 4px 0; |
e7c9c7707
|
359 |
} |
236cbc7b4
|
360 361 |
aside .step .step-box .choice-color-bottom .view-more{ text-align: right; |
e7c9c7707
|
362 363 364 |
} /*Step 3*/ aside .step .step-box .tshirt-saveorder{ |
236cbc7b4
|
365 |
padding: 10px 10px 10px 10px; |
e7c9c7707
|
366 367 368 369 370 371 372 373 374 375 376 377 |
} 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{ |
236cbc7b4
|
378 379 |
padding: 4px 10px; width: 100%; |
e7c9c7707
|
380 |
} |
c55955c06
|
381 |
|
236cbc7b4
|
382 |
|
e7c9c7707
|
383 |
/*Step 4*/ |
e7c9c7707
|
384 |
|
e7c9c7707
|
385 |
aside .step .step-box .change-design{ |
236cbc7b4
|
386 |
/*padding: 4px 4px;*/ |
e7c9c7707
|
387 388 |
} aside .step .step-box .change-design table{ |
236cbc7b4
|
389 |
width: 100%; |
e7c9c7707
|
390 391 392 393 |
} aside .step .step-box .change-design table tr{ border-bottom: 1px dotted #cccccc; } |
236cbc7b4
|
394 395 396 397 398 399 400 401 402 403 404 |
aside .step .step-box .change-design table tr td{ padding: 4px 3px; } aside .step .step-box .change-design table tr td:first-child{ background-color: #ededed; } aside .step .step-box .change-design table tr td:last-child{ background: url("../images/bgbutton2.png"); color: #ffffff; font-size: 15px; } |
e7c9c7707
|
405 406 407 408 409 410 |
aside .step .step-box .change-design table tr:last-child{ border-bottom: 0; } /*Step 5- finish*/ aside .step .finish-design{ |
862daa8a4
|
411 |
padding: 20px 0; |
e7c9c7707
|
412 413 414 |
} aside .step .finish-design button{ width: 100%; |
862daa8a4
|
415 |
padding: 8px 10px; |
e7c9c7707
|
416 417 418 419 |
} /*DESIGN CONTENT*/ #tshirt-content{ |
862daa8a4
|
420 421 422 423 424 425 426 427 |
position: relative; } #tshirt-content .switch-border-design{ position: absolute; top: 5px; right: 10px; color: red; font-size: 11px; |
236cbc7b4
|
428 |
cursor: pointer; |
2f1fcd7ad
|
429 |
z-index: 99; |
e7c9c7707
|
430 431 |
} #tshirt-content .tshirt-image{ |
19a110aef
|
432 |
padding: 20px 0 0 0; |
2f4c31749
|
433 434 435 |
position: relative; height: 100%; width: 100%; |
e7c9c7707
|
436 |
} |
80ff9bbd4
|
437 |
|
010854c35
|
438 439 440 |
#tshirt-content .tshirt-image img{ width: 100%; } |
e7c9c7707
|
441 442 443 444 445 446 447 448 449 450 451 |
#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; |
e7c9c7707
|
452 |
margin: 10px 10px; |
422e7837d
|
453 |
cursor: pointer; |
e7c9c7707
|
454 455 456 457 458 459 460 461 462 463 464 |
} #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; } |
422e7837d
|
465 466 467 468 |
#tshirt-content .tshirt-choice ul li .image img{ width: 50px; height: auto; } |
5fe93ca88
|
469 470 |
/*MODAL Design*/ #tshirt-design{ |
862daa8a4
|
471 |
background-color: #666666; |
5fe93ca88
|
472 473 |
} #tshirt-design .modal-dialog{ |
2f4c31749
|
474 |
/*width: 800px!important;*/ |
5fe93ca88
|
475 476 477 478 479 480 |
margin: 0 auto; } #tshirt-design .modal-dialog .modal-content{ background-color: transparent; border-radius: 0; border: 0; |
a56541cf9
|
481 482 |
-webkit-box-shadow: 0 0 0 rgba(0, 0, 0, .5)!important; box-shadow: 0 0 0 rgba(0, 0, 0, .5)!important; |
5fe93ca88
|
483 484 485 486 |
} #tshirt-design .modal-dialog .modal-content .modal-header{ padding: 0 0 10px 0; border-bottom: 0; |
862daa8a4
|
487 |
border-shadow: none!important; |
5fe93ca88
|
488 489 |
} #tshirt-design .modal-dialog .modal-content .modal-body{ |
862daa8a4
|
490 |
background-color: #f5f5f5; |
5fe93ca88
|
491 492 493 |
padding: 0 0; } #tshirt-design header{ |
862daa8a4
|
494 495 |
border-bottom: 1px solid #cccccc; background-color: #dddddd; |
5fe93ca88
|
496 497 498 499 500 501 502 |
} #tshirt-design header ul.nav{ padding-left: 0; list-style: none; } #tshirt-design header ul.nav li{ float: left; |
862daa8a4
|
503 504 505 506 507 |
padding: 8px 26px; border-right: 1px solid #cccccc; font-size: 14px; cursor: pointer; } |
6f105dbd5
|
508 |
#tshirt-design header ul.nav li:hover, #tshirt-design header ul.nav li.active{ |
236cbc7b4
|
509 |
background-color: #ff7200; |
862daa8a4
|
510 511 |
color: #ffffff; } |
6f105dbd5
|
512 |
#tshirt-design header ul.nav li:hover i.fa, #tshirt-design header ul.nav li.active i.fa{ |
862daa8a4
|
513 514 515 |
color: #ffffff; } #tshirt-design header ul.nav li i.fa{ |
236cbc7b4
|
516 |
color: #fc7500; |
862daa8a4
|
517 518 519 520 521 522 523 |
font-size: 20px; margin-right: 10px; } #tshirt-design header .action{ } #tshirt-design header .action button{ |
19a110aef
|
524 525 |
padding: 2px 10px; margin: 6px 10px; |
862daa8a4
|
526 527 528 529 |
} #tshirt-design header .action button:hover{ background-color: red; color: #ffffff; |
5fe93ca88
|
530 |
} |
e7c9c7707
|
531 |
|
5fe93ca88
|
532 533 |
/*Aside modal*/ .aside{ |
5fe93ca88
|
534 |
} |
c8bfdfd96
|
535 536 |
.aside .box-design-option{ |
5fe93ca88
|
537 538 |
list-style: none; padding-left: 0; |
862daa8a4
|
539 |
margin-top: 10px; |
c8bfdfd96
|
540 |
} |
862daa8a4
|
541 |
|
c8bfdfd96
|
542 |
.aside .box-design-option li{ |
862daa8a4
|
543 |
border: 1px solid #cdcdcd; |
a56541cf9
|
544 |
position: relative; |
682a3b12d
|
545 |
/*cursor: pointer;*/ |
e5669639a
|
546 |
margin-bottom: 10px; |
862daa8a4
|
547 |
} |
c8bfdfd96
|
548 |
.aside .box-design-option li .hover{ |
862daa8a4
|
549 |
background-color: #fddad4; |
a56541cf9
|
550 551 552 553 |
opacity: 0.6; position: absolute; width: 100%; height: 100%; |
862daa8a4
|
554 555 |
display: none; } |
c8bfdfd96
|
556 |
.aside .box-design-option li:hover .hover{ |
862daa8a4
|
557 558 |
display: block; } |
c8bfdfd96
|
559 |
.aside .box-design-option li .title{ |
862daa8a4
|
560 561 562 |
background: url("../images/bg1.png") repeat #cdcdcd; padding: 3px 10px; } |
c8bfdfd96
|
563 |
.aside .box-design-option li .title i.fa{ |
862daa8a4
|
564 565 |
color: #000000; } |
c8bfdfd96
|
566 |
.aside .box-design-option li .content{ |
862daa8a4
|
567 568 |
} |
c8bfdfd96
|
569 |
.aside .box-design-option li .content i.fa{ |
862daa8a4
|
570 |
font-size: 30px; |
236cbc7b4
|
571 |
color: #ff7200; |
862daa8a4
|
572 573 |
margin: 8px 0; } |
c8bfdfd96
|
574 |
.aside .box-design-option li .content .des{ |
862daa8a4
|
575 576 |
padding: 3px 10px 3px 0; } |
04cbb68af
|
577 578 579 580 581 |
.aside .box-design-option li .content .color-patterns { width: 100%; border: #bbb solid 1px; background: #FFF; margin-top: 5px; |
e5669639a
|
582 |
min-height: 65px; |
04cbb68af
|
583 584 585 586 587 588 589 590 591 592 593 594 595 596 597 |
} .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; } |
80ff9bbd4
|
598 599 600 601 602 603 604 605 |
.aside .box-design-option li .title .reset-color-patterns { cursor: pointer; } .aside .box-design-option li .title .reset-color-patterns:hover { opacity: 0.6; } |
04cbb68af
|
606 607 608 609 610 611 612 613 614 615 616 617 618 619 620 621 622 623 624 625 626 627 628 629 630 631 632 633 634 635 |
.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; } |
862daa8a4
|
636 |
|
04cbb68af
|
637 638 639 640 641 642 643 |
.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; |
2f4c31749
|
644 645 646 647 |
margin-bottom: 0; } .aside #choice-text .content .font-family-box li.active{ border: 1px solid #fe070f; |
04cbb68af
|
648 649 650 651 652 653 654 655 656 657 658 659 660 661 662 663 |
} .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; } |
2f4c31749
|
664 665 666 |
.aside #choice-text .content .spacing-letter .item:hover{ background-color: #fddad4; } |
04cbb68af
|
667 668 669 670 671 672 673 674 |
.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; |
2f4c31749
|
675 |
font-size: 13px; |
04cbb68af
|
676 677 678 679 680 681 682 683 684 685 686 |
} .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; } |
c8bfdfd96
|
687 |
/*Design Choice Illustration*/ |
6f105dbd5
|
688 689 690 691 692 693 694 695 696 697 698 699 700 |
.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; |
e32d6b2cb
|
701 702 |
min-height: 310px; padding-bottom: 20px; |
6f105dbd5
|
703 704 705 |
} .aside #choice-illustration li .content .illustration-list .illstration-item{ |
19a541686
|
706 |
height: 60px; |
6f105dbd5
|
707 708 |
overflow: hidden; float: left; |
19a541686
|
709 710 711 712 713 714 |
margin-left: 6px; margin-top: 5px; margin-bottom: 5px; padding: 2px; background: #e2e2e2; border: solid 2px #d7d7d7; |
1de5c616d
|
715 |
cursor: pointer; |
6f105dbd5
|
716 717 718 719 720 721 722 |
} .aside #choice-illustration li .content .illustration-list .illstration-item:hover { outline: 2px solid #ed1d24; } .aside #choice-illustration li .content .illustration-list .illstration-item img { |
19a541686
|
723 |
width: 50px; |
6f105dbd5
|
724 725 |
cursor: pointer; } |
2681003ca
|
726 |
.illustration-list .footer-bar, .saved-list .footer-bar { |
e32d6b2cb
|
727 728 729 730 731 732 |
text-align: center; margin-top: 5px; bottom: 10px; position: absolute; width: 100%; padding-right: 20px; |
682a3b12d
|
733 |
} |
53828b4e7
|
734 |
.footer-bar .footer-pagination { |
682a3b12d
|
735 736 737 738 739 740 741 742 |
margin-right: 5px; cursor: pointer; font-size: 9px; color: #FFF; background: #666666; text-transform: uppercase; padding: 2px 5px; } |
53828b4e7
|
743 |
.footer-bar .footer-pagination:hover { |
682a3b12d
|
744 745 |
background: #999999; } |
e0ee74c15
|
746 747 748 749 750 751 |
.tooltip-arrow, .red-tooltip + .tooltip > .tooltip-inner { background-color: #FFF; margin:0; padding:0; } |
682a3b12d
|
752 |
|
e0ee74c15
|
753 |
/* Insert image*/ |
e5669639a
|
754 755 756 757 758 759 760 761 762 763 764 765 766 767 768 769 770 |
#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; } |
6f105dbd5
|
771 |
|
e5669639a
|
772 773 774 775 776 777 778 779 780 781 782 783 784 785 786 787 788 789 |
.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; } |
6f105dbd5
|
790 |
|
bd0414901
|
791 792 793 794 795 796 797 798 799 800 801 802 803 804 805 806 807 808 809 810 811 |
.aside #choice-image li .content .list-images .recent-img{ 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-image li .content .list-images .recent-img:hover { outline: 2px solid #ed1d24; } .aside #choice-image li .content .list-images .recent-img img { width: 50px; cursor: pointer; } |
862daa8a4
|
812 813 |
/*Design content*/ .tshirt-design-container{ |
4ae9cc634
|
814 |
|
862daa8a4
|
815 816 |
} .tshirt-design-container .design-content{ |
2f4c31749
|
817 |
padding: 10px 0; |
862daa8a4
|
818 819 820 |
} .tshirt-design-container .design-content .content{ width: 100%; |
2f4c31749
|
821 |
height: 100%; |
4ae9cc634
|
822 823 |
min-height: 600px; position: relative; |
422e7837d
|
824 |
padding: 40px 40px; |
862daa8a4
|
825 826 827 |
} .tshirt-design-container .design-content .content .selection-design{ border: 1px solid #ff0000; |
862daa8a4
|
828 829 830 831 832 |
} .tshirt-design-container .agree-design{ position: absolute; right: -16px; top: 40%; |
80ff9bbd4
|
833 834 835 836 |
cursor: pointer; } .tshirt-design-container .agree-design:hover{ opacity: 0.8; |
862daa8a4
|
837 838 839 840 841 |
} .tshirt-design-container .trash-design{ position: absolute; right: 5px; bottom: 0; |
5fe93ca88
|
842 |
} |
e0ee74c15
|
843 844 845 |
.tshirt-design-container .trash-design:hover{ opacity: 0.5; } |
d7aae10e2
|
846 847 848 849 850 |
.object-border{ position: absolute; background-color: rgb(0, 108, 255); border: 0; display:none; |
c674a3608
|
851 |
transform-origin: 0% 0%; |
d7aae10e2
|
852 853 854 855 856 857 858 |
} #object-border-top, #object-border-bottom{ height: 2px; } #object-border-right, #object-border-left{ width: 2px; } |
a56541cf9
|
859 860 861 862 863 864 865 866 867 |
/*FOOTER*/ footer{ background-color: #333333; } footer ul.nav-footer{ padding-left: 0; list-style: none; |
236cbc7b4
|
868 869 870 |
float: left; width: 80%; margin-bottom: 0 |
a56541cf9
|
871 872 873 874 875 876 877 878 879 880 881 |
} 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; } |
236cbc7b4
|
882 883 884 885 886 887 888 889 890 891 892 893 894 895 |
footer .logo-bottom{ float: left; width: 20%; margin-bottom: 0; text-align: right; } footer .logo-bottom img{ height: 25px; max-width: 100%; } .footer{ padding: 15px 0; text-align: center; } |
8f087d204
|
896 897 898 899 900 |
/* Customize container */ @media (min-width: 768px) { .container { /*max-width: 730px;*/ } |
c87bc1f33
|
901 902 903 904 905 |
} /* Responsive: Portrait tablets and up */ @media screen and (min-width: 768px) { /* Remove the padding we set earlier */ |
8f087d204
|
906 |
|
c87bc1f33
|
907 |
} |
e0ee74c15
|
908 909 910 911 |
@media (min-width: 1024px) { #tshirt-design .modal-dialog{ min-width: 1000px; |
2f4c31749
|
912 |
width: 1000px; |
e0ee74c15
|
913 |
} |
a3d420e25
|
914 |
} |
236cbc7b4
|
915 |
/*Mobile responsive*/ |
2f4c31749
|
916 917 |
@media (max-width: 762px) { .modal-dialog{ |
2f4c31749
|
918 919 920 921 922 923 924 925 926 927 |
margin: 0 0!important; } #tshirt-design header .menu-nav{ overflow-x: scroll!important; -webkit-overflow-scrolling: touch; } #tshirt-design header ul.nav { text-align: justify; width: 680px; |
2f4c31749
|
928 929 930 931 932 933 934 935 936 937 938 |
} #tshirt-design header ul.nav li { display: inline-block; /* 6 */ } .tshirt-design-container .design-content .content{ padding: 14px 14px; } .tshirt-design-container .design-content{ padding: 0 0; |
a3d420e25
|
939 |
} |
236cbc7b4
|
940 941 942 943 944 945 946 947 948 949 950 951 952 953 954 955 956 957 958 959 960 961 962 963 964 965 966 967 968 |
/*Header*/ header .logo{ text-align: left; } header .top-control li{ margin: 0 4px; } header .top-menu{ display: table; margin: auto; } header .social-share{ display: none; } header .col-sm-6{ padding: 0!important; } header .user-control{ position: absolute; right: 0; top: -120%; } /*Footer*/ footer ul.nav-footer{ width: 100%; } footer .logo-bottom{ display: none; } |
faf1542f8
|
969 970 971 972 973 974 975 |
} #tshirt-design-saved .subframe-design { width: 80%; margin: auto; |
53828b4e7
|
976 |
margin-top: 100px; |
faf1542f8
|
977 978 979 980 |
border: 10px solid rgb(0, 0, 0); border: 20px solid rgba(0, 0, 0, .5); -webkit-background-clip: padding-box; /* for Safari */ background-clip: padding-box; /* for IE9+, Firefox 4+, Opera, Chrome */ |
53828b4e7
|
981 |
background: #FFF; |
faf1542f8
|
982 983 984 |
} #tshirt-design-saved .modal-content button.close { |
53828b4e7
|
985 |
margin-right: 103px; |
faf1542f8
|
986 |
font-size: 41px; |
53828b4e7
|
987 |
margin-top: -8px; |
faf1542f8
|
988 989 990 991 992 993 994 995 996 997 998 999 1000 1001 1002 1003 1004 1005 1006 1007 1008 1009 1010 1011 1012 1013 1014 |
} #tshirt-design-saved .subframe-design .nav-tabs { background: rgba(0, 0, 0, .5); border-bottom: 1px solid #F5F5F5; } #tshirt-design-saved .subframe-design .nav-tabs li a { text-decoration: none; background-color: #CCC; cursor: pointer; margin-right: 10px; padding: 2px 30px; color: #000; font-weight: 600; border-bottom: 1px solid #F5F5F5 } #tshirt-design-saved .subframe-design .nav-tabs li.active a { background: #F5F5F5; color: #fe070f; } #tshirt-design-saved .subframe-design .tab-content { background: #F5F5F5; width: 100%; min-height: 400px; |
53828b4e7
|
1015 1016 1017 1018 1019 1020 |
} #tshirt-design-saved .saved-list { width: 100%; border: #bbb solid 1px; background: #FFF; |
2681003ca
|
1021 |
margin-top: 0px; |
53828b4e7
|
1022 |
min-height: 400px; |
2681003ca
|
1023 |
padding: 10px; |
53828b4e7
|
1024 1025 1026 |
} #tshirt-design-saved .saved-list .saved-item{ |
2681003ca
|
1027 |
width: 100px; |
53828b4e7
|
1028 1029 1030 1031 1032 1033 1034 1035 1036 1037 1038 1039 1040 1041 1042 1043 1044 1045 1046 1047 |
height: 100px; overflow: hidden; float: left; margin-left: 6px; margin-top: 5px; margin-bottom: 5px; padding: 2px; background: #e2e2e2; border: solid 2px #d7d7d7; cursor: pointer; } #tshirt-design-saved .saved-list .saved-item:hover { outline: 2px solid #ed1d24; } #tshirt-design-saved .saved-list .saved-item img { width: 100px; cursor: pointer; } |
2681003ca
|
1048 1049 1050 1051 1052 1053 1054 1055 1056 1057 1058 1059 |
#tshirt-design-saved .saved-list .saved-item button { background: #ff0f00; color: #FFF; border: 0; position: absolute; margin-left: -5px; margin-top: -5px; padding: 0 5px; } #tshirt-design-saved .saved-list .saved-item button:hover { background: #ffcccc; } |
53828b4e7
|
1060 1061 1062 |
#tshirt-design-saved .saved-list .footer-bar { bottom: 20px; |
2681003ca
|
1063 |
width: 75%; |
e0ee74c15
|
1064 |
} |