mirror of https://github.com/IoTcat/cp-acc.git
You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
3220 lines
65 KiB
3220 lines
65 KiB
/*** |
|
==================================================================== |
|
Table of contents |
|
==================================================================== |
|
|
|
- [0. Reset and Set Defaults] |
|
- [1. Body] |
|
- [2. Wrapper] |
|
- [3. Navigation] |
|
- [4. Inline Wrapper] |
|
- [5. Header] |
|
- [6. main] |
|
- [7. Container] |
|
- [8. Form Elements] |
|
- [9. Accordion] |
|
- [10. Wizards] |
|
- [11. Tab Control] |
|
- [12. Popup] |
|
- [13. Lists] |
|
- [14. Search] |
|
- [15. Divider] |
|
- [16. Posts] |
|
- [17. Profile Page] |
|
- [18. Post Author Page] |
|
- [19. Gallery and Album] |
|
- [20. Contact] |
|
- [21. Product Pages] |
|
- [22. Panel] |
|
- [23. Bouble Menu] |
|
- [24. Page Loader] |
|
- [25. Responsive Media Queries] |
|
- [26. Background Color Helpers] |
|
- [27. Text Helpers] |
|
- [28. Text Animations] |
|
- [29. CUSTOMIZE THE CAROUSEL] |
|
- [30. Home Tabs] |
|
- [31. Content Styles] |
|
- [32. Home Tabs] |
|
|
|
***/ |
|
|
|
/*------------------------------------------------------------------- |
|
[0. Reset and Set Defaults] |
|
*------------------------------------------------------------------*/ |
|
::-webkit-scrollbar-thumb |
|
{ |
|
border-radius: 10px; |
|
background-color: #ccc; |
|
} |
|
::-webkit-scrollbar |
|
{ |
|
width: 12px; |
|
background-color: #F5F5F5; |
|
} |
|
a{ |
|
color: #4c4c4c; |
|
text-decoration: none; |
|
font-weight: 700; |
|
outline: none; |
|
} |
|
a:hover{ |
|
text-decoration: none !important; |
|
} |
|
body *{ |
|
box-sizing: border-box; |
|
} |
|
p { |
|
margin-top: 0; |
|
margin-bottom: 0 |
|
} |
|
ul{ |
|
margin-bottom: 0 |
|
} |
|
input,button, select, textarea, label{ |
|
font-family: Nunito; |
|
font-size: 14px; |
|
color: #929292; |
|
line-height: 1.4; |
|
font-weight: 600; |
|
} |
|
::-webkit-input-placeholder { /* Chrome/Opera/Safari */ |
|
color: #929292; |
|
} |
|
::-moz-placeholder { /* Firefox 19+ */ |
|
color: #929292; |
|
} |
|
:-ms-input-placeholder { /* IE 10+ */ |
|
color: #929292; |
|
} |
|
:-moz-placeholder { /* Firefox 18- */ |
|
color: #929292; |
|
} |
|
/*end of part 0----------------------------------------------------*/ |
|
|
|
|
|
|
|
/*------------------------------------------------------------------- |
|
[1. Body] |
|
*------------------------------------------------------------------*/ |
|
body{ |
|
margin: 0; |
|
padding: 0; |
|
background-color: #FFF; |
|
font-family: Nunito; |
|
font-size: 14px; |
|
color: #777; |
|
line-height: 1.4; |
|
font-weight: 400; |
|
box-sizing: border-box; |
|
-webkit-font-smoothing: antialiased; |
|
} |
|
/*end of part 1----------------------------------------------------*/ |
|
|
|
|
|
/*------------------------------------------------------------------- |
|
[2. Wrapper] |
|
*------------------------------------------------------------------*/ |
|
.wrapper{ |
|
position: fixed; |
|
left: 0; |
|
top: 0; |
|
bottom: 0; |
|
right: 0; |
|
background-position: center center; |
|
background-size: cover; |
|
background-repeat: no-repeat; |
|
|
|
} |
|
|
|
/*end of part 2----------------------------------------------------*/ |
|
|
|
|
|
|
|
/*------------------------------------------------------------------- |
|
[3. Navigation] |
|
*------------------------------------------------------------------*/ |
|
.nav-menu{ |
|
position: absolute; |
|
left: 0; |
|
right: 0; |
|
top: 0; |
|
bottom: 0; |
|
z-index: 999; |
|
background-color: rgba(0,0,0,0.3); |
|
display: none; |
|
} |
|
nav.menu.opened{ |
|
left: 0; |
|
} |
|
nav.menu{ |
|
position: absolute; |
|
left: -70%; |
|
top: 0; |
|
bottom: 0; |
|
width: 70%; |
|
background-color: #fff; |
|
-webkit-transition: left 200ms cubic-bezier(0.000, 0.655, 0.000, 1); /* older webkit */ |
|
-webkit-transition: left 200ms cubic-bezier(0.025, 0.685, 0.000, 0.990); |
|
-moz-transition: left 200ms cubic-bezier(0.025, 0.685, 0.000, 0.990); |
|
-o-transition: left 200ms cubic-bezier(0.025, 0.685, 0.000, 0.990); |
|
transition: left 200ms cubic-bezier(0.025, 0.685, 0.000, 0.990); /* custom */ |
|
} |
|
.image-round{ |
|
border-radius: 60px; |
|
width: 100px; |
|
height: 100px; |
|
border: 3px solid #fff; |
|
} |
|
nav.menu .nav-header span{ |
|
display: block; |
|
color: #fff; |
|
font-weight: normal; |
|
} |
|
|
|
nav.menu .nav-header a{ |
|
color: #2eb18d; |
|
} |
|
|
|
nav.menu .nav-header{ |
|
height: 160px; |
|
text-align: center; |
|
padding-top: 10px; |
|
background:url("../img/avatar-bg.jpg") no-repeat; |
|
background-size: cover |
|
} |
|
|
|
nav .nav-container{ |
|
position: absolute; |
|
left: 0; |
|
right: 0; |
|
bottom: 0; |
|
top: 0px; |
|
overflow: auto; |
|
} |
|
|
|
nav.menu ul{ |
|
list-style: none; |
|
padding: 0; |
|
margin: 0; |
|
} |
|
nav.menu ul li{ |
|
display: block; |
|
width: 100%; |
|
} |
|
nav.menu ul li img{ |
|
max-width: 23px |
|
} |
|
nav.menu ul li strong{ |
|
position: relative; |
|
top: -5px; |
|
margin-left: 10px; |
|
font-weight: 500; |
|
} |
|
nav.menu ul li strong.special{ |
|
top: 2px |
|
} |
|
nav.menu ul.main-menu > li.active{ |
|
background-color: #f5f5f5; |
|
} |
|
|
|
nav.menu ul.main-menu > li.active > ul{ |
|
display: block; |
|
} |
|
|
|
nav.menu ul.main-menu > li ul li.active{ |
|
background-color: rgba(0,0,0,0.2); |
|
} |
|
|
|
nav.menu ul.main-menu>li>a{ |
|
display: block; |
|
color: #4c4b4b; |
|
padding: 12px 12px; |
|
font-weight: normal; |
|
} |
|
|
|
nav.menu ul.main-menu > li.active i{ |
|
color: #2eb18d !important; |
|
} |
|
|
|
nav.menu ul.main-menu>li>a>i{ |
|
display: inline-block; |
|
width: 30px; |
|
font-size: 18px; |
|
color: #777777; |
|
} |
|
nav.menu ul.main-menu>li>a>span{ |
|
display: inline-block; |
|
float: right; |
|
opacity: 0.5; |
|
} |
|
nav.menu ul.main-menu>li ul{ |
|
display: none; |
|
} |
|
nav.menu ul.main-menu>li li a{ |
|
display: block; |
|
color: #4c4b4b; |
|
padding: 8px 20px 8px 48px; |
|
font-weight: 400; |
|
} |
|
.mt-0{ |
|
margin-top: 0 !important |
|
} |
|
.mt-10{ |
|
margin-top: 10px !important |
|
} |
|
.mt-15{ |
|
margin-top: 15px !important |
|
} |
|
.mt-20{ |
|
margin-top: 20px !important |
|
} |
|
.mt-30{ |
|
margin-top: 30px !important |
|
} |
|
.mb-0{ |
|
margin-bottom: 0 !important |
|
} |
|
.mb-5{ |
|
margin-bottom: 5px !important |
|
} |
|
.mb-10{ |
|
margin-bottom: 10px !important |
|
} |
|
.mb-15{ |
|
margin-bottom: 15px !important |
|
} |
|
.mb-30{ |
|
margin-bottom: 30px !important |
|
} |
|
.ml-10{ |
|
margin-left: 7px |
|
} |
|
.mr-10{ |
|
margin-right: 8px |
|
} |
|
.pl-0{ |
|
padding-left: 0 !important |
|
} |
|
.pr-0{ |
|
padding-right: 0 !important |
|
} |
|
.w-text{ |
|
color: #fff !important |
|
} |
|
.g-text{ |
|
color: #ede6e6 !important; |
|
} |
|
.p-text{ |
|
color: #999 !important |
|
} |
|
.text-center{ |
|
text-align: center !important; |
|
} |
|
.relative{ |
|
position: relative !important |
|
} |
|
/*end of part 3----------------------------------------------------*/ |
|
|
|
|
|
|
|
/*------------------------------------------------------------------- |
|
[4. Inline Wrapper] |
|
*------------------------------------------------------------------*/ |
|
.wrapper-inline{ |
|
position: absolute; |
|
width: 100%; |
|
bottom: 0; |
|
top: 0; |
|
background-color: #f9fafb; |
|
overflow: auto; |
|
} |
|
.wrapper.with-bg-image .wrapper-inline{ |
|
background-color: rgba(255,255,255,0.9); |
|
} |
|
/*end of part 4----------------------------------------------------*/ |
|
|
|
|
|
|
|
/*------------------------------------------------------------------- |
|
[5. Header] |
|
*------------------------------------------------------------------*/ |
|
header{ |
|
position: fixed; |
|
z-index: 998; |
|
top: 0; |
|
left: 0; |
|
right: 0; |
|
background-color: #FFF; |
|
height: 50px; |
|
border-bottom:solid 1px #EEE; |
|
padding: 10px; |
|
|
|
} |
|
|
|
header.no-background{ |
|
background-color: transparent; |
|
border-bottom: none; |
|
color: #FFF; |
|
-webkit-transition: background-color .3s ease-in-out; |
|
-moz-transition: background-color .3s ease-in-out; |
|
-o-transition: background-color .3s ease-in-out; |
|
transition: background-color .3s ease-in-out; |
|
} |
|
header.no-background a{ |
|
color: #FFF; |
|
} |
|
header.no-background .navi-menu-button em{ |
|
background: #FFF; |
|
} |
|
|
|
header.set-bg{ |
|
background-color: #FFF; |
|
border-bottom:solid 1px #EEE; |
|
color: #464646; |
|
-webkit-box-shadow: 0px 1px 2px 0px rgba(0,0,0,0.1); |
|
-moz-box-shadow: 0px 1px 2px 0px rgba(0,0,0,0.1); |
|
box-shadow: 0px 1px 2px 0px rgba(0,0,0,0.1); |
|
} |
|
header.set-bg a{ |
|
color: #464646; |
|
} |
|
header.set-bg .navi-menu-button em{ |
|
background: #464646; |
|
} |
|
|
|
header .go-back-link{ |
|
width: 30px; |
|
height: 30px; |
|
display: inline-block; |
|
line-height: 30px; |
|
text-align: center; |
|
float: left; |
|
margin-left: -10px; |
|
} |
|
header .page-title{ |
|
font-size: 16px; |
|
position: absolute; |
|
left: 50px; |
|
right: 50px; |
|
top: 10px; |
|
margin: 0; |
|
padding: 0; |
|
height: 30px; |
|
line-height: 30px; |
|
text-align: center; |
|
letter-spacing: 2px; |
|
overflow: hidden; |
|
text-overflow:ellipsis; |
|
-o-text-overflow: ellipsis; |
|
-ms-text-overflow: ellipsis; |
|
white-space: nowrap; |
|
} |
|
header.with-search-icon .page-title{ |
|
left: 80px; |
|
right: 50px; |
|
} |
|
.navi-menu-button{ |
|
width: 30px; |
|
height: 30px; |
|
float: right; |
|
position: relative; |
|
cursor: pointer; |
|
} |
|
.navi-menu-button em{ |
|
width: 24px; |
|
height: 2px; |
|
background-color: #4c4c4c; |
|
display: block; |
|
position: absolute; |
|
border-radius: 30px; |
|
right: 0; |
|
|
|
-webkit-transition: all 200ms cubic-bezier(0.250, 0.250, 0.750, 0.750); |
|
-moz-transition: all 200ms cubic-bezier(0.250, 0.250, 0.750, 0.750); |
|
-o-transition: all 200ms cubic-bezier(0.250, 0.250, 0.750, 0.750); |
|
transition: all 200ms cubic-bezier(0.250, 0.250, 0.750, 0.750); /* linear */ |
|
} |
|
.navi-menu-button em:nth-child(1){ |
|
top: 7px; |
|
width: 20px; |
|
} |
|
.navi-menu-button em:nth-child(2){ |
|
top: 14px; |
|
} |
|
.navi-menu-button em:nth-child(3){ |
|
top: 21px; |
|
width: 20px; |
|
} |
|
|
|
.navi-menu-button.focused em:nth-child(1){ |
|
-ms-transform: rotate(-45deg); |
|
-webkit-transform: rotate(-45deg); |
|
transform: rotate(-45deg); |
|
top: 14px; |
|
} |
|
.navi-menu-button.focused em:nth-child(2){ |
|
width: 0; |
|
} |
|
.navi-menu-button.focused em:nth-child(3){ |
|
-ms-transform: rotate(45deg); |
|
-webkit-transform: rotate(45deg); |
|
transform: rotate(45deg); |
|
top: 14px; |
|
} |
|
/*end of part 5----------------------------------------------------*/ |
|
|
|
|
|
|
|
/*------------------------------------------------------------------- |
|
[6. Main] |
|
*------------------------------------------------------------------*/ |
|
main{ |
|
margin-top: 60px; |
|
} |
|
main.no-margin{ |
|
margin-top: 0; |
|
} |
|
main.fix-top-menu{ |
|
margin-top: 50px; |
|
} |
|
main.no-margin .container{ |
|
padding: 0; |
|
} |
|
main.no-header .TurboWrapper{ |
|
top: 0; |
|
} |
|
/*end of part 6----------------------------------------------------*/ |
|
|
|
|
|
|
|
/*------------------------------------------------------------------- |
|
[7. Container] |
|
*------------------------------------------------------------------*/ |
|
section.container{ |
|
padding: 0 10px; |
|
} |
|
div.container{ |
|
padding: 0 10px; |
|
} |
|
/*end of part 7----------------------------------------------------*/ |
|
|
|
|
|
|
|
/*------------------------------------------------------------------- |
|
[8. Form Elements] |
|
*------------------------------------------------------------------*/ |
|
.form-row{ |
|
display: block; |
|
width: 100%; |
|
padding: 0; |
|
position: relative; |
|
} |
|
.form-row.no-padding{ |
|
padding: 0; |
|
} |
|
.form-row-group{ |
|
border-radius: 3px; |
|
background-color: #FFF; |
|
border:solid 1px #f2f2f2; |
|
-webkit-box-shadow: 0px 0px 1px 0px rgba(0,0,0,0.2); |
|
-moz-box-shadow: 0px 0px 1px 0px rgba(0,0,0,0.2); |
|
box-shadow: 0px 0px 1px 0px rgba(0,0,0,0.2); |
|
} |
|
.form-row-group .form-row{ |
|
padding: 0 10px; |
|
} |
|
.form-row-group.with-icons .form-row i{ |
|
position: absolute; |
|
line-height: 40px; |
|
width: 24px; |
|
} |
|
.form-row-group.with-icons .form-row .form-element{ |
|
padding-left: 24px; |
|
} |
|
.form-element{ |
|
display: block; |
|
width: 100%; |
|
border:none; |
|
border-bottom: solid 1px #EEE; |
|
height: 40px; |
|
outline: none; |
|
line-height: 40px; |
|
background-color: #FFF; |
|
|
|
} |
|
select.form-element{ |
|
-webkit-appearance: none; |
|
background-color: white; |
|
background-image: url(../img/up-down.svg); |
|
background-position : right center; |
|
background-repeat: no-repeat; |
|
padding-right: 1.5em; |
|
border-color:transparent; |
|
border-bottom: solid 1px #EEE; |
|
} |
|
|
|
.error{ |
|
color: #cc0c35; |
|
} |
|
.error .form-element{ |
|
border-color: #cc0c35 !important; |
|
color: #cc0c35; |
|
} |
|
textarea.form-element{ |
|
resize: none; |
|
line-height: 1.4; |
|
padding: 10px 0; |
|
min-height: 80px; |
|
} |
|
select.form-element{ |
|
padding: 0; |
|
margin-left: -4px; |
|
} |
|
.form-element:focus{ |
|
border-color: #2eb18d; |
|
} |
|
|
|
.button{ |
|
padding: 10px 20px; |
|
background-color: #FFF; |
|
border:none; |
|
border-radius: 3px; |
|
text-align: center; |
|
font-weight: 600; |
|
outline: none; |
|
-webkit-box-shadow: 0px 0px 3px 0px rgba(0,0,0,0.2); |
|
-moz-box-shadow: 0px 0px 3px 0px rgba(0,0,0,0.2); |
|
box-shadow: 0px 0px 3px 0px rgba(0,0,0,0.2); |
|
cursor: pointer; |
|
} |
|
.button.circle{ |
|
border-radius: 5px; |
|
} |
|
.button.block{ |
|
display: block; |
|
width: 100%; |
|
} |
|
.button:hover, .button:active, .button:focus{ |
|
background-color: #f9f9f9; |
|
} |
|
.button.darkblue{ |
|
background-color: #2C6EBC; |
|
color: #FFF; |
|
border-color:transparent; |
|
-webkit-box-shadow: none; |
|
-moz-box-shadow: none; |
|
box-shadow: none; |
|
} |
|
.button.orange{ |
|
background-color: #2eb18d; |
|
color: #FFF; |
|
border-color:transparent; |
|
-webkit-box-shadow: none; |
|
-moz-box-shadow: none; |
|
box-shadow: none; |
|
} |
|
.button.blue{ |
|
background-color: #3e7ab7; |
|
color: #FFF; |
|
border-color:transparent; |
|
-webkit-box-shadow: none; |
|
-moz-box-shadow: none; |
|
box-shadow: none; |
|
} |
|
.button.yellow{ |
|
background-color: #ebad4d; |
|
color: #FFF; |
|
border-color:transparent; |
|
-webkit-box-shadow: none; |
|
-moz-box-shadow: none; |
|
box-shadow: none; |
|
} |
|
.button.red{ |
|
background-color: #d3514b; |
|
color: #FFF; |
|
border-color:transparent; |
|
-webkit-box-shadow: none; |
|
-moz-box-shadow: none; |
|
box-shadow: none; |
|
} |
|
|
|
.button.green{ |
|
background-color: #65b95f; |
|
color: #FFF; |
|
border-color:transparent; |
|
-webkit-box-shadow: none; |
|
-moz-box-shadow: none; |
|
box-shadow: none; |
|
} |
|
.more-btn{ |
|
background: #7965ff; |
|
color: #fff; |
|
padding: 10px 40px; |
|
border: 1px solid #7965ff; |
|
border-radius: 25px; |
|
margin-top: 10px; |
|
display: inline-block; |
|
transition: all .3s ease-in-out; |
|
} |
|
.more-btn:hover, |
|
.more-btn.transparent{ |
|
background: transparent; |
|
color: #7965ff |
|
} |
|
.sweet-check{ |
|
height: 30px; |
|
width: 60px; |
|
cursor: pointer; |
|
border-radius: 30px; |
|
border:solid 1px #eee; |
|
display: inline-block; |
|
position: relative; |
|
background-color: #FFF; |
|
-webkit-box-shadow: 1px 1px 3px 0px rgba(0,0,0,0.1); |
|
-moz-box-shadow: 1px 1px 3px 0px rgba(0,0,0,0.1); |
|
box-shadow: 1px 1px 3px 0px rgba(0,0,0,0.1); |
|
-webkit-transition: background-color 200ms cubic-bezier(0.250, 0.250, 0.750, 0.750); |
|
-moz-transition: background-color 200ms cubic-bezier(0.250, 0.250, 0.750, 0.750); |
|
-o-transition: background-color 200ms cubic-bezier(0.250, 0.250, 0.750, 0.750); |
|
transition: background-color 200ms cubic-bezier(0.250, 0.250, 0.750, 0.750); /* linear */ |
|
} |
|
.sweet-check input{ |
|
opacity: 0; |
|
position: absolute; |
|
} |
|
|
|
.sweet-check .outline{ |
|
width: 27px; |
|
height: 27px; |
|
border-radius: 50%; |
|
display: block; |
|
-webkit-box-shadow: 1px 1px 3px 0px rgba(0,0,0,0.2); |
|
-moz-box-shadow: 1px 1px 3px 0px rgba(0,0,0,0.2); |
|
box-shadow: 1px 1px 3px 0px rgba(0,0,0,0.2); |
|
background-color: #FFF; |
|
position: absolute; |
|
left: 0; |
|
-webkit-transition: left 200ms cubic-bezier(0.250, 0.250, 0.750, 0.750); |
|
-moz-transition: left 200ms cubic-bezier(0.250, 0.250, 0.750, 0.750); |
|
-o-transition: left 200ms cubic-bezier(0.250, 0.250, 0.750, 0.750); |
|
transition: left 200ms cubic-bezier(0.250, 0.250, 0.750, 0.750); /* linear */ |
|
} |
|
.sweet-check.checked{ |
|
background-color: #60B2FE; |
|
border-color: #60B2FE; |
|
} |
|
.sweet-check.checked .outline{ |
|
left: 30px; |
|
} |
|
/*end of part 8----------------------------------------------------*/ |
|
|
|
|
|
|
|
|
|
/*------------------------------------------------------------------- |
|
[9. Accordion] |
|
*------------------------------------------------------------------*/ |
|
.expandable-item{ |
|
background-color: #fff; |
|
border-radius: 3px; |
|
margin-bottom: 15px; |
|
} |
|
.expandable-header{ |
|
background-color: #FFF; |
|
padding: 15px; |
|
position: relative; |
|
-webkit-box-shadow: 1px 1px 3px 0px rgba(0,0,0,0.1); |
|
-moz-box-shadow: 1px 1px 3px 0px rgba(0,0,0,0.1); |
|
box-shadow: 1px 1px 3px 0px rgba(0,0,0,0.1); |
|
border-radius: 3px; |
|
cursor: pointer; |
|
} |
|
.expandable-header .list-icon{ |
|
font-size: 18px; |
|
display: inline-block; |
|
width: 24px; |
|
} |
|
.expandable-header .list-title{ |
|
font-size: 16px; |
|
line-height: 18px; |
|
margin: 0; |
|
padding: 0; |
|
display: inline-block; |
|
} |
|
.expandable-header .list-item-extra{ |
|
position: absolute; |
|
right: 40px; |
|
top: 17px; |
|
font-size: 12px; |
|
} |
|
.expandable-header .list-arrow{ |
|
position: absolute; |
|
right: 15px; |
|
top: 15px; |
|
font-size: 20px; |
|
} |
|
.expandable-content{ |
|
border:solid 1px transparent; |
|
border-top: none; |
|
border-bottom-right-radius: 3px; |
|
border-bottom-left-radius: 3px; |
|
overflow: hidden; |
|
max-height: 0; |
|
-webkit-transition: max-height .2s linear; |
|
-moz-transition: max-height .2s linear; |
|
-o-transition: max-height .2s linear; |
|
transition: max-height .2s linear; |
|
} |
|
.expandable-content .padding-content{ |
|
padding: 0 15px 30px; |
|
} |
|
.expandable-item.active .expandable-content{ |
|
border-color:#EEE; |
|
min-height: 200px |
|
} |
|
.expandable-item.active .list-arrow:before{ |
|
content: "\f106"; |
|
} |
|
/*end of part 9----------------------------------------------------*/ |
|
|
|
|
|
|
|
/*------------------------------------------------------------------- |
|
[10. Wizard] |
|
*------------------------------------------------------------------*/ |
|
.wizard{ |
|
position: absolute; |
|
left: 0; |
|
right: 0; |
|
top: 0; |
|
bottom: 0; |
|
} |
|
.wizard .wizard-item{ |
|
position: relative; |
|
} |
|
.wizard .wizard-content{ |
|
position: absolute; |
|
left: 20px; |
|
top: 20px; |
|
height: 100%; |
|
right: 20px; |
|
bottom: 60px; |
|
overflow: hidden; |
|
text-align: center; |
|
} |
|
|
|
.wizard-page .TurboWrapper{ |
|
position: absolute; |
|
top: 50px; |
|
right: 0; |
|
bottom: 0; |
|
left: 0; |
|
} |
|
|
|
.wizard-page .slider-navigation{ |
|
position: absolute; |
|
z-index: 99; |
|
bottom: 10px; |
|
left: 20px; |
|
right: 20px; |
|
} |
|
.wizard-skip-link{ |
|
position: absolute; |
|
z-index: 99; |
|
bottom: 10px; |
|
right: 20px; |
|
height: 33px; |
|
line-height: 33px; |
|
font-weight: 400; |
|
cursor: pointer; |
|
font-size: 14px; |
|
} |
|
.wizard-skip-link:hover{ |
|
color: #069; |
|
} |
|
.dotClass{ |
|
background-color: #DDD; |
|
margin: 5px 3px; |
|
width: 15px; |
|
border-radius: 9px; |
|
height: 6px; |
|
} |
|
.dotClass.active { |
|
background: rgb(121, 101, 255,.8); |
|
} |
|
/*end of part 10----------------------------------------------------*/ |
|
|
|
|
|
|
|
/*------------------------------------------------------------------- |
|
[11. Tab Control] |
|
*------------------------------------------------------------------*/ |
|
.tab-item .fix-width .menu-item{ |
|
display: block; |
|
float: left; |
|
text-align: center; |
|
} |
|
.tab-item .tab-content .content-item{ |
|
display: none; |
|
} |
|
.tab-item .tab-content .active{ |
|
display: block; |
|
} |
|
.tab-item .tab-menu{ |
|
background-color: #FFF; |
|
overflow: hidden; |
|
-webkit-box-shadow: 1px 1px 3px 0px rgba(0,0,0,0.1); |
|
-moz-box-shadow: 1px 1px 3px 0px rgba(0,0,0,0.1); |
|
box-shadow: 1px 1px 3px 0px rgba(0,0,0,0.1); |
|
z-index: 99; |
|
} |
|
.tab-item .menu-item{ |
|
line-height: 40px; |
|
} |
|
.tab-item .menu-item.active{ |
|
border-bottom: solid 2px #96a5f6; |
|
color: #96a5f6; |
|
} |
|
.tab-item .tab-content{ |
|
padding: 10px 10px 30px |
|
} |
|
.tab-item.fixed-bottom .tab-menu{ |
|
position: fixed; |
|
bottom: 0; |
|
left: 0; |
|
right: 0; |
|
-webkit-box-shadow: 0px -1px 3px 0px rgba(0,0,0,0.2); |
|
-moz-box-shadow: 0px -1px 3px 0px rgba(0,0,0,0.2); |
|
box-shadow: 0px -1px 3px 0px rgba(0,0,0,0.2); |
|
} |
|
.tab-item.fixed-bottom .menu-item.active{ |
|
border-bottom:none; |
|
border-top: solid 2px #2eb18d; |
|
background-color: rgba(0,0,0,0.05); |
|
} |
|
.tab-item.fixed-bottom .tab-menu.only-icons .menu-item{ |
|
font-size: 18px; |
|
} |
|
/*end of part 11----------------------------------------------------*/ |
|
|
|
|
|
|
|
/*------------------------------------------------------------------- |
|
[12. Popup] |
|
*------------------------------------------------------------------*/ |
|
.popup-overlay{ |
|
position: fixed; |
|
z-index: 900; |
|
left: 0; |
|
right: 0; |
|
top: 0; |
|
bottom: 0; |
|
background-color: rgba(0,0,0,0.4); |
|
overflow: auto; |
|
padding: 20px; |
|
display: none; |
|
cursor: pointer; |
|
} |
|
.popup-overlay.no-overlay{ |
|
background-color: transparent; |
|
} |
|
.popup-overlay .popup-container{ |
|
overflow: hidden; |
|
background-color: #FFF; |
|
border-radius: 5px; |
|
-webkit-box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.2); |
|
-moz-box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.2); |
|
box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.2); |
|
} |
|
.popup-overlay .popup-container.add{ |
|
position: relative; |
|
top: 50%; |
|
transform: translateY(-50%); |
|
} |
|
.popup-overlay .popup-header{ |
|
border-bottom: solid 1px #EEE; |
|
background-color: #f4f4f4; |
|
padding: 10px; |
|
position: relative; |
|
} |
|
.popup-overlay .popup-title{ |
|
margin: 0; |
|
padding: 0; |
|
padding-right: 40px; |
|
} |
|
.popup-overlay .popup-close{ |
|
display: block; |
|
width: 24px; |
|
height: 24px; |
|
position: absolute; |
|
right: 10px; |
|
top: 10px; |
|
text-align: center; |
|
line-height: 24px; |
|
cursor: pointer; |
|
} |
|
.popup-overlay .popup-content{ |
|
padding: 10px; |
|
min-height: 50px; |
|
} |
|
.img-buy{ |
|
max-width: 100px; |
|
margin-top: 10px |
|
} |
|
.popup-overlay .popup-footer{ |
|
border-top:solid 1px #EEE; |
|
padding: 10px; |
|
text-align: right; |
|
} |
|
/*end of part 12----------------------------------------------------*/ |
|
|
|
|
|
|
|
/*------------------------------------------------------------------- |
|
[13. Lists] |
|
*------------------------------------------------------------------*/ |
|
.list-box{ |
|
width: 100%; |
|
} |
|
.list-box .list-item{ |
|
padding: 15px; |
|
background-color: #FFF; |
|
display: block; |
|
-webkit-box-shadow: 0px 0px 3px 0px rgba(0,0,0,0.2); |
|
-moz-box-shadow: 0px 0px 3px 0px rgba(0,0,0,0.2); |
|
box-shadow: 0px 0px 3px 0px rgba(0,0,0,0.2); |
|
overflow: hidden; |
|
} |
|
.list-box .list-item .sweet-check{ |
|
float: right; |
|
} |
|
.list-box a.list-item:hover, .list-box a.list-item:focus{ |
|
background-color: #f5f6f8 !important; |
|
} |
|
.list-box a.list-item:hover i, .list-box a.list-item:focus i{ |
|
color: #585858 !important; |
|
} |
|
.list-box .list-item i{ |
|
font-size: 20px; |
|
display: inline-block; |
|
line-height: 28px; |
|
color: #797979; |
|
float:left; |
|
width: 36px; |
|
} |
|
.list-box .list-item img { |
|
display: inline-block; |
|
padding-right: 10px; |
|
line-height: 28px; |
|
float: left; |
|
width: 36px; |
|
} |
|
.list-box .list-item .list-item-title{ |
|
font-weight: 700; |
|
display: inline-block; |
|
line-height: 28px; |
|
float: left; |
|
font-size: 16px; |
|
} |
|
.list-box .list-item .seperate{ |
|
display: inline-block; |
|
float: left; |
|
width: 1px; |
|
height: 30px; |
|
background-color: #EEE; |
|
margin-right: 10px; |
|
} |
|
.list-box.half-box{ |
|
width: 50%; |
|
float: left; |
|
} |
|
.list-box.half-box .list-item{ |
|
padding: 20px; |
|
text-align: center; |
|
margin-bottom: 10px; |
|
} |
|
|
|
.list-box.half-box:nth-child(odd) .list-item{ |
|
margin-right: 5px; |
|
} |
|
.list-box.half-box:nth-child(even) .list-item{ |
|
margin-left: 5px; |
|
} |
|
.list-box.half-box .list-item i{ |
|
font-size: 36px; |
|
float: none; |
|
} |
|
|
|
.list-box.half-box .list-item .list-item-title{ |
|
display: block; |
|
width: 100%; |
|
font-weight: 700; |
|
font-size: 14px; |
|
} |
|
/*end of part 13----------------------------------------------------*/ |
|
|
|
|
|
|
|
/*------------------------------------------------------------------- |
|
14. Search] |
|
*------------------------------------------------------------------*/ |
|
.search-button{ |
|
width: 30px; |
|
height: 30px; |
|
position: relative; |
|
text-align: center; |
|
line-height: 30px; |
|
cursor: pointer; |
|
font-size: 16px; |
|
display: inline-block; |
|
float: left; |
|
} |
|
.search-button img{ |
|
max-width: 22px |
|
} |
|
header.no-background .search-button .not-icon1{ |
|
position: absolute; |
|
top: 5px; |
|
visibility: hidden; |
|
} |
|
header.no-background.set-bg .search-button .not-icon1{ |
|
visibility: visible; |
|
} |
|
.search-form{ |
|
position: fixed; |
|
left: 0; |
|
right: 0; |
|
top: 0; |
|
bottom: 0; |
|
z-index: 1000; |
|
background-color: rgba(0,0,0,0.4); |
|
overflow: auto; |
|
display: none; |
|
} |
|
.search-form .search-input{ |
|
margin: 70px 20px 40px 20px; |
|
position: relative; |
|
} |
|
.search-form .form-element{ |
|
border:solid 1px #EEE; |
|
padding: 0 10px; |
|
border-radius: 3px; |
|
-webkit-box-shadow: 1px 1px 3px 0px rgba(0,0,0,0.1); |
|
-moz-box-shadow: 1px 1px 3px 0px rgba(0,0,0,0.1); |
|
box-shadow: 1px 1px 3px 0px rgba(0,0,0,0.1); |
|
border-bottom-width: 2px; |
|
} |
|
.search-form .form-element:focus{ |
|
border-bottom-color: #2eb18d; |
|
|
|
} |
|
.search-form .search-input-btn{ |
|
position: absolute; |
|
width: 37px; |
|
height: 37px; |
|
right: 1px; |
|
top: 1px; |
|
background-color: #FFF; |
|
border:none; |
|
line-height: 37px; |
|
text-align: center; |
|
} |
|
.search-form .search-input-btn:hover, .search-form .search-input-btn:focus{ |
|
color: #2eb18d; |
|
} |
|
.search-form .recent-search, .search-form .popular-search { |
|
padding: 0 20px; |
|
margin-bottom: 20px; |
|
} |
|
.search-form .search-tag{ |
|
display: inline-block; |
|
padding: 4px 12px; |
|
background-color: #FFF; |
|
border:solid 1px #DDD; |
|
font-weight: 400; |
|
border-radius: 15px; |
|
margin:0 5px 5px 0; |
|
} |
|
.search-form .search-tag:hover, .search-form .search-tag:focus{ |
|
border-color: #2eb18d; |
|
color: #2eb18d; |
|
} |
|
.search-form .search-group-title{ |
|
margin: 0; |
|
padding: 0; |
|
margin-bottom: 6px; |
|
} |
|
.search-form .close-search-form{ |
|
position: absolute; |
|
right: 20px; |
|
top: 20px; |
|
display: block; |
|
width: 30px; |
|
height: 30px; |
|
text-align: center; |
|
line-height: 30px; |
|
color: #FFF; |
|
background: #6de3c2; |
|
border:solid 1px #ccc; |
|
border-radius: 3px; |
|
cursor: pointer; |
|
} |
|
.search-form .close-search-form:focus, .search-form .close-search-form:hover{ |
|
background-color: transparent; |
|
color: #FFF; |
|
} |
|
.search-result-header{ |
|
background-color: #FFF; |
|
margin: -10px -10px 10px -10px; |
|
-webkit-box-shadow: 1px 1px 3px 0px rgba(0,0,0,0.1); |
|
-moz-box-shadow: 1px 1px 3px 0px rgba(0,0,0,0.1); |
|
box-shadow: 1px 1px 3px 0px rgba(0,0,0,0.1); |
|
position: relative; |
|
} |
|
.search-result-header.fix-searchbar{ |
|
position: fixed; |
|
top: 60px; |
|
left: 0; |
|
right: 0; |
|
padding: 0 10px; |
|
z-index: 100; |
|
} |
|
.search-result-header.fix-searchbar + .search-result-container{ |
|
padding-top: 30px; |
|
} |
|
.search-result-header .form-element{ |
|
padding: 0 10px; |
|
} |
|
.search-result-header.fix-searchbar .search-result-btn{ |
|
right: 10px; |
|
} |
|
.search-result-header .search-result-btn{ |
|
position: absolute; |
|
right: 0; |
|
top: 0; |
|
height: 38px; |
|
width: 38px; |
|
border:none; |
|
background-color: #FFF; |
|
overflow: hidden; |
|
outline: none; |
|
cursor: pointer; |
|
} |
|
.search-result-header .search-result-btn:focus, .search-result-header .search-result-btn:hover{ |
|
color: #2eb18d; |
|
} |
|
/*end of part 14----------------------------------------------------*/ |
|
|
|
|
|
|
|
/*------------------------------------------------------------------- |
|
[15. Divider] |
|
*------------------------------------------------------------------*/ |
|
.form-divider{ |
|
display: block; |
|
width: 100%; |
|
clear: both; |
|
height: 10px; |
|
margin: 10px 0; |
|
} |
|
.form-mini-divider{ |
|
display: block; |
|
width: 100%; |
|
clear: both; |
|
height: 1px; |
|
margin: 5px 0; |
|
} |
|
.form-label-divider{ |
|
display: block; |
|
width: 100%; |
|
clear: both; |
|
height: 1px; |
|
background-color: #DDD; |
|
text-align: center; |
|
opacity: 0.5; |
|
} |
|
.form-label-divider span{ |
|
position: relative; |
|
top: -8px; |
|
font-weight: 700; |
|
display: inline-block; |
|
background-color: #F5F6F8; |
|
padding: 0 10px; |
|
} |
|
/*end of part 15----------------------------------------------------*/ |
|
|
|
|
|
|
|
/*------------------------------------------------------------------- |
|
[16. Posts] |
|
*------------------------------------------------------------------*/ |
|
.post-item{ |
|
width: 100%; |
|
border-radius: 3px; |
|
background-color: #FFF; |
|
min-height: 100px; |
|
-webkit-box-shadow: 1px 1px 3px 0px rgba(0,0,0,0.1); |
|
-moz-box-shadow: 1px 1px 3px 0px rgba(0,0,0,0.1); |
|
box-shadow: 1px 1px 3px 0px rgba(0,0,0,0.1); |
|
} |
|
.post-item .post-asset{ |
|
border-top-left-radius: 3px; |
|
border-top-right-radius: 3px; |
|
overflow: hidden; |
|
} |
|
.post-item .post-asset.image img{ |
|
display: block; |
|
width: 100%; |
|
} |
|
.post-item .post-asset.video{ |
|
position: relative; |
|
padding-bottom: 56.25%; /* 16:9 */ |
|
padding-top: 25px; |
|
height: 0; |
|
} |
|
.post-item .post-asset.video iframe{ |
|
position: absolute; |
|
top: 0; |
|
left: 0; |
|
width: 100%; |
|
height: 100%; |
|
} |
|
.post-item .post-header{ |
|
padding: 15px; |
|
border-bottom: solid 1px #EEE; |
|
} |
|
.post-item .post-title{ |
|
font-size: 18px; |
|
padding: 0; |
|
margin: 0; |
|
margin-bottom: 4px; |
|
color: #333; |
|
} |
|
.post-item .post-title a{ |
|
font-size: 18px; |
|
color: #4c4c4c; |
|
line-height: 18px; |
|
} |
|
.post-item .post-header span{ |
|
font-size: 12px; |
|
margin-right: 10px; |
|
opacity: 0.6; |
|
} |
|
.post-item .post-footer{ |
|
padding: 10px 15px; |
|
} |
|
.post-item .post-author{ |
|
display: inline-block; |
|
} |
|
.post-item .author-img{ |
|
width: 44px; |
|
height: 44px; |
|
display: block; |
|
float: left; |
|
overflow: hidden; |
|
border-radius: 50%; |
|
padding: 3px; |
|
background: #FFF; |
|
border:solid 1px #2eb18d; |
|
margin-right: 10px; |
|
} |
|
.post-item .author-img img{ |
|
width: 36px; |
|
height: 36px; |
|
border-radius: 50%; |
|
} |
|
.post-item .author-name{ |
|
font-size: 12px; |
|
font-weight: 400; |
|
white-space: nowrap; |
|
} |
|
.post-item .author-name b{ |
|
white-space: nowrap; |
|
display: block; |
|
font-size: 14px; |
|
} |
|
.post-item .post-extra{ |
|
display: inline-block; |
|
float: right; |
|
} |
|
.post-item .post-extra div{ |
|
display: inline-block; |
|
height: 40px; |
|
width: 40px; |
|
text-align: center; |
|
font-size: 24px; |
|
cursor: pointer; |
|
} |
|
.post-item .post-share{ |
|
position: relative; |
|
line-height: 40px; |
|
} |
|
.post-item .post-share > i{ |
|
cursor: pointer; |
|
display: block; |
|
width: 40px; |
|
height: 40px; |
|
line-height: 40px; |
|
} |
|
.post-item .post-share .social-links{ |
|
position: absolute; |
|
z-index: 10; |
|
top: 0; |
|
width: auto; |
|
display: inline-block; |
|
white-space: nowrap; |
|
left: -130px; |
|
width: 130px; |
|
border:solid 1px #EEE; |
|
border-radius: 5px; |
|
background: #FFF; |
|
display: none; |
|
-webkit-box-shadow: 1px 1px 3px 0px rgba(0,0,0,0.1); |
|
-moz-box-shadow: 1px 1px 3px 0px rgba(0,0,0,0.1); |
|
box-shadow: 1px 1px 3px 0px rgba(0,0,0,0.1); |
|
} |
|
.post-item .post-share .social-links a{ |
|
font-size: 18px; |
|
display: block; |
|
width: 40px; |
|
height: 40px; |
|
text-align: center; |
|
line-height: 40px; |
|
position: relative; |
|
float: left; |
|
} |
|
.post-item .post-share .social-links a.share-facebook{ |
|
color: #2C6EBC; |
|
} |
|
.post-item .post-share .social-links a.share-twitter{ |
|
color: #1DA1F2; |
|
} |
|
.post-item .post-share .social-links a.share-google-plus{ |
|
color: #D24C41; |
|
} |
|
.post-detail{ |
|
background: #FFF; |
|
padding: 10px; |
|
border-top:solid 1px #EEE; |
|
} |
|
.post-detail p{ |
|
margin: 0; |
|
margin-bottom: 10px; |
|
} |
|
.post-detail h1, .post-detail h2, .post-detail h3, .post-detail h4, .post-detail h5 .post-detail h6{ |
|
font-weight: 900; |
|
} |
|
.post-comments{ |
|
margin-top: 10px; |
|
} |
|
.post-comments ul{ |
|
padding: 0; |
|
list-style: none; |
|
margin: 0; |
|
padding: 0; |
|
} |
|
.post-comments ul li{ |
|
display: block; |
|
width: 100%; |
|
} |
|
.post-comments > ul > li li{ |
|
padding-left: 20px; |
|
} |
|
.post-comments ul li .comment-container{ |
|
background-color: #FFF; |
|
padding: 10px; |
|
margin: 10px; |
|
} |
|
.post-comments.no-padding{ |
|
margin-top:0; |
|
} |
|
.post-comments.no-padding ul li .comment-container{ |
|
margin: 0; |
|
margin-bottom: 10px; |
|
} |
|
.post-comments .comment-header{ |
|
position: relative; |
|
border-bottom: solid 1px #EEE; |
|
overflow: hidden; |
|
padding-bottom: 10px; |
|
} |
|
.post-comments .user-image{ |
|
display: block; |
|
width: 38px; |
|
height: 38px; |
|
border:solid 1px #2eb18d; |
|
border-radius: 50%; |
|
float: left; |
|
padding: 2px; |
|
margin-right: 10px; |
|
} |
|
.post-comments .user-image img{ |
|
width: 32px; |
|
height: 32px; |
|
border-radius: 50%; |
|
} |
|
.post-comments .user-name{ |
|
display: inline-block; |
|
float: left; |
|
line-height: 38px; |
|
font-weight: 700; |
|
} |
|
.post-comments .comment-date{ |
|
display: inline-block; |
|
position: absolute; |
|
right: 10px; |
|
top: 10px; |
|
font-size: 12px; |
|
opacity: 0.6; |
|
} |
|
.post-comments .comment-content{ |
|
padding-top: 10px; |
|
opacity: 0.7; |
|
} |
|
.post-comments .comment-post-link{ |
|
border-bottom:solid 1px #EEE; |
|
margin-bottom: 10px; |
|
padding-bottom: 10px; |
|
} |
|
.post-comments .comment-post-link a{ |
|
color: #2eb18d; |
|
font-weight: 700; |
|
} |
|
|
|
.news-list-item{ |
|
-webkit-box-shadow: 1px 1px 3px 0px rgba(0,0,0,0.1); |
|
-moz-box-shadow: 1px 1px 3px 0px rgba(0,0,0,0.1); |
|
box-shadow: 1px 1px 3px 0px rgba(0,0,0,0.1); |
|
background-color: #FFF; |
|
min-height: 30px; |
|
border-radius: 3px; |
|
position: relative; |
|
} |
|
.news-list-item.no-image .list-content{ |
|
padding-left: 10px; |
|
height: auto; |
|
} |
|
.news-list-item.no-image .list-title{ |
|
height: auto; |
|
} |
|
.news-list-item .list-image{ |
|
width: 100px; |
|
height: 100px; |
|
position: absolute; |
|
border-top-left-radius: 3px; |
|
border-bottom-left-radius: 3px; |
|
overflow: hidden; |
|
float: left; |
|
} |
|
.news-list-item .list-content{ |
|
height: 100px; |
|
position: relative; |
|
padding: 10px 10px 10px 110px; |
|
} |
|
.news-list-item .list-category{ |
|
font-size: 12px; |
|
display: inline-block; |
|
padding: 3px 10px; |
|
color: #FFF; |
|
border-radius: 10px; |
|
margin-bottom: 6px; |
|
} |
|
.news-list-item .list-title{ |
|
margin: 0; |
|
padding: 0; |
|
font-size: 14px; |
|
line-height: 16px; |
|
height: 32px; |
|
|
|
} |
|
.news-list-item .list-author, .news-list-item .list-time{ |
|
font-size: 12px; |
|
opacity: 0.6; |
|
} |
|
.news-list-item .list-author{ |
|
font-weight: 700; |
|
} |
|
/*end of part 16----------------------------------------------------*/ |
|
|
|
|
|
|
|
/*------------------------------------------------------------------- |
|
[17. Profile Page] |
|
*------------------------------------------------------------------*/ |
|
.profile-image{ |
|
width: 110px; |
|
height: 110px; |
|
padding: 5px; |
|
border-radius: 50%; |
|
background-color: #FFF; |
|
display: inline-block; |
|
-webkit-box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.1); |
|
-moz-box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.1); |
|
box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.1); |
|
position: relative; |
|
} |
|
.profile-image .avatar-img{ |
|
border-radius: 50%; |
|
} |
|
.profile-image .update-btn{ |
|
position: absolute; |
|
display: block; |
|
width: 32px; |
|
height: 32px; |
|
border-radius: 50%; |
|
-webkit-box-shadow: 0px 0px 3px 0px rgba(0,0,0,0.2); |
|
-moz-box-shadow: 0px 0px 3px 0px rgba(0,0,0,0.2); |
|
box-shadow: 0px 0px 3px 0px rgba(0,0,0,0.2); |
|
background-color: #fff; |
|
right: 0; |
|
bottom: 0; |
|
text-align: center; |
|
line-height: 32px; |
|
} |
|
/*end of part 17----------------------------------------------------*/ |
|
|
|
|
|
|
|
/*------------------------------------------------------------------- |
|
[18. Post Author Page] |
|
*------------------------------------------------------------------*/ |
|
.author-item .author-bg{ |
|
width: 100%; |
|
height: auto; |
|
position: relative; |
|
background-size: cover; |
|
} |
|
.author-item .author-bg-inline{ |
|
width: 100%; |
|
background-color: rgba(14, 14, 14, 0.1); |
|
padding: 60px 0 20px 0; |
|
} |
|
.author-item .author-avatar{ |
|
border-radius: 50%; |
|
width: 120px; |
|
height: 120px; |
|
background-color: rgba(255,255,255,0.2); |
|
padding: 10px; |
|
display: block; |
|
margin: 0 auto; |
|
|
|
} |
|
.author-item .author-avatar img{ |
|
border-radius: 50%; |
|
width: 100%; |
|
height: 100%; |
|
} |
|
.author-item .author-name{ |
|
display: block; |
|
text-align: center; |
|
color: #FFF; |
|
font-size: 18px; |
|
font-weight: 900; |
|
margin: 0; |
|
padding: 0; |
|
margin-top: 20px; |
|
} |
|
.author-item .author-desc{ |
|
display: block; |
|
text-align: center; |
|
color: rgba(255,255,255,0.5); |
|
font-size: 14px; |
|
} |
|
.author-item .author-number{ |
|
overflow: hidden; |
|
color: rgba(255,255,255,0.6); |
|
text-align: center; |
|
margin-top: 40px; |
|
} |
|
.author-item .author-number > div{ |
|
width: 33%; |
|
float: left; |
|
} |
|
.author-item .author-number > div > span{ |
|
display: block; |
|
font-size: 18px; |
|
font-weight: 400; |
|
color: #FFF; |
|
} |
|
/*end of part 18----------------------------------------------------*/ |
|
|
|
|
|
|
|
/*------------------------------------------------------------------- |
|
19. Gallery and Album] |
|
*------------------------------------------------------------------*/ |
|
.album-item{ |
|
background-color: #FFF; |
|
-webkit-box-shadow: 1px 1px 3px 0px rgba(0,0,0,0.1); |
|
-moz-box-shadow: 1px 1px 3px 0px rgba(0,0,0,0.1); |
|
box-shadow: 1px 1px 3px 0px rgba(0,0,0,0.1); |
|
border-radius: 3px; |
|
margin-bottom: 10px; |
|
display: block; |
|
} |
|
.album-item:focus, .album-item:hover{ |
|
color: #35d9ac; |
|
} |
|
.album-item:focus .album-image:before, .album-item:hover .album-image:before{ |
|
content: ''; |
|
position: absolute; |
|
left: 0; |
|
right: 0; |
|
top: 0; |
|
bottom: 0; |
|
background-color: rgba(0,0,0,0.4); |
|
z-index: 9; |
|
} |
|
.album-item .album-image{ |
|
height: 140px; |
|
width: 100%; |
|
overflow: hidden; |
|
border-top-right-radius: 3px; |
|
border-top-left-radius: 3px; |
|
position: relative; |
|
} |
|
.album-item .album-image img{ |
|
position: absolute; |
|
top: -9999px; |
|
right: -9999px; |
|
bottom: -9999px; |
|
left: -9999px; |
|
margin: auto; |
|
min-width: 100%; |
|
min-height: 100%; |
|
} |
|
|
|
.album-item .album-info{ |
|
padding: 10px; |
|
position: relative; |
|
} |
|
.album-item .album-title{ |
|
margin: 0; |
|
padding: 0; |
|
} |
|
.album-item .image-count{ |
|
font-size: 12px; |
|
opacity: 0.6; |
|
float: right; |
|
position: absolute; |
|
right: 10px; |
|
top: 10px; |
|
} |
|
.album-item.half-box .album-image{ |
|
height: 100px; |
|
} |
|
.album-item.half-box{ |
|
width: 49%; |
|
} |
|
.album-item.half-box:nth-child(odd){ |
|
float: left; |
|
} |
|
|
|
.album-item.half-box:nth-child(even){ |
|
float: right; |
|
} |
|
.album-item.half-box .image-count{ |
|
position: relative; |
|
display: block; |
|
float: none; |
|
top: inherit; |
|
right: inherit; |
|
} |
|
.gallery-item{ |
|
display: block; |
|
position: relative; |
|
overflow: hidden; |
|
height: 140px; |
|
border-radius: 3px; |
|
cursor: pointer; |
|
} |
|
.gallery-item.half-box{ |
|
width: 50%; |
|
float: left; |
|
margin-bottom: 0; |
|
} |
|
.gallery-item img{ |
|
position: absolute; |
|
top: -9999px; |
|
right: -9999px; |
|
bottom: -9999px; |
|
left: -9999px; |
|
margin: auto; |
|
min-width: 100%; |
|
min-height: 100%; |
|
} |
|
.gallery-item .image-name{ |
|
position: absolute; |
|
width: 100%; |
|
bottom: 0; |
|
left: 0; |
|
right: 0; |
|
padding: 10px; |
|
z-index: 9; |
|
color: #FFF; |
|
background: rgba(135,135,135,0); |
|
background: -moz-linear-gradient(top, rgba(135,135,135,0) 0%, rgba(51,51,51,1) 100%); |
|
background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(135,135,135,0)), color-stop(100%, rgba(51,51,51,1))); |
|
background: -webkit-linear-gradient(top, rgba(135,135,135,0) 0%, rgba(51,51,51,1) 100%); |
|
background: -o-linear-gradient(top, rgba(135,135,135,0) 0%, rgba(51,51,51,1) 100%); |
|
background: -ms-linear-gradient(top, rgba(135,135,135,0) 0%, rgba(51,51,51,1) 100%); |
|
background: linear-gradient(to bottom, rgba(135,135,135,0) 0%, rgba(51,51,51,1) 100%); |
|
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#878787', endColorstr='#333333', GradientType=0 ); |
|
} |
|
.gallery-item .image-name b{ |
|
position: absolute; |
|
display: block; |
|
bottom: 10px; |
|
left: 10px; |
|
} |
|
.gallery-item .image-name i{ |
|
position: absolute; |
|
font-size: 18px; |
|
right: 10px; |
|
bottom: 10px; |
|
} |
|
.gallery-item:hover .image-name, .gallery-item:focus .image-name{ |
|
top: 0; |
|
background: rgba(0,0,0,0.4); |
|
} |
|
/*end of part 19----------------------------------------------------*/ |
|
|
|
|
|
|
|
/*------------------------------------------------------------------- |
|
[20. Contact] |
|
*------------------------------------------------------------------*/ |
|
.map_container{ |
|
position: relative; |
|
left: 0; |
|
right: 0; |
|
top: -10px; |
|
width: 100%; |
|
height: 300px; |
|
} |
|
.contact-info{ |
|
background-color: #FFF; |
|
margin: 0 10px 10px; |
|
padding: 10px; |
|
-webkit-box-shadow: 1px 1px 3px 0px rgba(0,0,0,0.1); |
|
-moz-box-shadow: 1px 1px 3px 0px rgba(0,0,0,0.1); |
|
box-shadow: 1px 1px 3px 0px rgba(0,0,0,0.1); |
|
} |
|
.contact-info .address-name{ |
|
margin: 6px 0; |
|
padding: 0; |
|
} |
|
.contact-info .contact-stars{ |
|
opacity: 0.6; |
|
} |
|
.contact-info .address{ |
|
padding: 0; |
|
margin: 0; |
|
} |
|
.contact-short-info{ |
|
background-color: #FFF; |
|
padding: 10px; |
|
margin: 10px; |
|
-webkit-box-shadow: 1px 1px 3px 0px rgba(0,0,0,0.1); |
|
-moz-box-shadow: 1px 1px 3px 0px rgba(0,0,0,0.1); |
|
box-shadow: 1px 1px 3px 0px rgba(0,0,0,0.1); |
|
} |
|
.contact-short-info .title{ |
|
margin: 0; |
|
} |
|
.contact-address{ |
|
background-color: #FFF; |
|
margin: 10px; |
|
padding: 10px; |
|
-webkit-box-shadow: 1px 1px 3px 0px rgba(0,0,0,0.1); |
|
-moz-box-shadow: 1px 1px 3px 0px rgba(0,0,0,0.1); |
|
box-shadow: 1px 1px 3px 0px rgba(0,0,0,0.1); |
|
} |
|
.contact-address .contact-item{ |
|
margin-bottom: 6px; |
|
} |
|
.contact-address .contact-item i{ |
|
display: inline-block; |
|
width: 20px; |
|
} |
|
/*end of part 20----------------------------------------------------*/ |
|
|
|
|
|
|
|
/*------------------------------------------------------------------- |
|
[21. Product Pages] |
|
*------------------------------------------------------------------*/ |
|
.product-two-column .product-item{ |
|
display: block; |
|
width: 50%; |
|
float: left; |
|
} |
|
.product-item{ |
|
display: block; |
|
width: 100%; |
|
position: relative; |
|
} |
|
.product-item > a{ |
|
display: block; |
|
background-color: #FFF; |
|
-webkit-box-shadow: 1px 1px 3px 0px rgba(0,0,0,0.1); |
|
-moz-box-shadow: 1px 1px 3px 0px rgba(0,0,0,0.1); |
|
box-shadow: 1px 1px 3px 0px rgba(0,0,0,0.1); |
|
margin-bottom: 10px; |
|
border-radius: 3px; |
|
} |
|
.product-two-column .product-item:nth-child(odd){ |
|
padding-right: 5px; |
|
} |
|
.product-two-column .product-item:nth-child(even){ |
|
padding-left: 5px; |
|
} |
|
.product-item .product-title{ |
|
display: block; |
|
margin:0; |
|
padding: 0; |
|
font-size: 14px; |
|
padding: 5px 10px; |
|
overflow: hidden; |
|
height:25px; |
|
text-overflow:ellipsis; |
|
-o-text-overflow: ellipsis; |
|
-ms-text-overflow: ellipsis; |
|
white-space: nowrap; |
|
color: #525252; |
|
font-weight: normal; |
|
} |
|
.title-main{ |
|
margin:30px 0px 15px; |
|
font-size: 16px; |
|
} |
|
.product-item .product-image{ |
|
display: block; |
|
width: 100%; |
|
border-top-left-radius: 3px; |
|
border-top-right-radius: 3px; |
|
} |
|
.product-item .product-info{ |
|
display: block; |
|
padding: 0px 10px 0px 10px; |
|
font-weight: 800; |
|
height: 35px; |
|
} |
|
.product-item .product-price{ |
|
font-size: 12px; |
|
line-height: 30px; |
|
} |
|
.product-item .add-to-chart{ |
|
border:none; |
|
border-radius: 3px; |
|
color: #FFF; |
|
font-size: 12px; |
|
line-height: 18px; |
|
float: right; |
|
} |
|
.product-item .old-price{ |
|
opacity: 0.7; |
|
margin-left: 10px; |
|
text-decoration: line-through; |
|
} |
|
.product-item .add-to-favorite{ |
|
position: absolute; |
|
right: 15px; |
|
top: 10px; |
|
color: #FFF; |
|
font-size: 20px; |
|
cursor: pointer; |
|
} |
|
.product-viewer .view-item{ |
|
padding: 10px; |
|
} |
|
|
|
.product-viewer .view-item img{ |
|
display: block; |
|
margin:0 auto; |
|
max-width: 100%; |
|
padding: 10px; |
|
background-color: #FFF; |
|
-webkit-box-shadow: 1px 1px 3px 0px rgba(0,0,0,0.1); |
|
-moz-box-shadow: 1px 1px 3px 0px rgba(0,0,0,0.1); |
|
box-shadow: 1px 1px 3px 0px rgba(0,0,0,0.1); |
|
} |
|
.product-view-title{ |
|
text-align: center; |
|
margin: 0; |
|
} |
|
.product-view-price{ |
|
margin: 0; |
|
text-align: center; |
|
} |
|
.product-view-price .old-price{ |
|
opacity: 0.5; |
|
font-weight: 400; |
|
text-decoration: line-through; |
|
} |
|
.cart-btn{ |
|
display: block; |
|
width: 30px; |
|
height: 30px; |
|
background-color: #ececec; |
|
float: right; |
|
border: 0px; |
|
border-radius: 25px; |
|
font-size: 14px; |
|
margin-top: 2px; |
|
color: #2eb18d; |
|
} |
|
.product-size{ |
|
margin: 10px auto; |
|
width: 300px; |
|
} |
|
.product-size li{ |
|
list-style-type: none; |
|
float: left; |
|
margin: 0px 10px; |
|
|
|
} |
|
.product-size li a{ |
|
text-align: center; |
|
border-radius: 50%; |
|
border: 1px solid #2eb18d; |
|
float: left; |
|
width: 50px; |
|
height: 50px; |
|
line-height: 50px; |
|
color: #2eb18d; |
|
} |
|
.product-size li a:hover{ |
|
border: 1px solid #ccc; |
|
} |
|
.product-size li.active a{ |
|
background:#2eb18d; |
|
text-align: center; |
|
border-radius: 50%; |
|
border: 1px solid #2eb18d; |
|
float: left; |
|
width: 50px; |
|
height: 50px; |
|
line-height: 50px; |
|
color: #fff !important; |
|
} |
|
/*end of part 21----------------------------------------------------*/ |
|
|
|
|
|
|
|
/*------------------------------------------------------------------- |
|
[22. Panel] |
|
*------------------------------------------------------------------*/ |
|
.panel{ |
|
padding: 10px; |
|
background-color: #FFF; |
|
-webkit-box-shadow: 1px 1px 3px 0px rgba(0,0,0,0.1); |
|
-moz-box-shadow: 1px 1px 3px 0px rgba(0,0,0,0.1); |
|
box-shadow: 1px 1px 3px 0px rgba(0,0,0,0.1); |
|
} |
|
.panel .title{ |
|
margin: 0; |
|
padding: 0; |
|
} |
|
/*end of part 22----------------------------------------------------*/ |
|
|
|
|
|
|
|
/*------------------------------------------------------------------- |
|
[23. Bouble Menu] |
|
*------------------------------------------------------------------*/ |
|
.bouble-link{ |
|
position: fixed; |
|
z-index: 777; |
|
display: block; |
|
width: 46px; |
|
height: 46px; |
|
border-radius: 50%; |
|
bottom: 30px; |
|
right: 30px; |
|
line-height: 46px; |
|
text-align: center; |
|
-webkit-box-shadow: 2px 2px 15px 0px rgba(0,0,0,0.2); |
|
-moz-box-shadow: 2px 2px 15px 0px rgba(0,0,0,0.2); |
|
box-shadow: 2px 2px 15px 0px rgba(0,0,0,0.2); |
|
font-size: 18px; |
|
} |
|
/*end of part 23----------------------------------------------------*/ |
|
|
|
|
|
|
|
/*------------------------------------------------------------------- |
|
[24. Page Loader] |
|
*------------------------------------------------------------------*/ |
|
|
|
|
|
.sweet-loader{ |
|
position: fixed; |
|
left: 0; |
|
right: 0; |
|
top: 0; |
|
bottom: 0; |
|
z-index: 1000000; |
|
background-color: rgba(255,255,255,0.9); |
|
display: none; |
|
opacity: 0; |
|
-webkit-transition: opacity .3s ease-in-out; |
|
-moz-transition: opacity .3s ease-in-out; |
|
-o-transition: opacity .3s ease-in-out; |
|
transition: opacity .3s ease-in-out; |
|
|
|
} |
|
.sweet-loader.show{ |
|
display: block; |
|
opacity: 1; |
|
} |
|
|
|
.sweet-loader.show .box { |
|
width: 70px; |
|
height: 24px; |
|
text-align: center; |
|
position: absolute; |
|
top: 50%; |
|
margin-top:-12px; |
|
left: 50%; |
|
margin-left: -35px; |
|
} |
|
|
|
.sweet-loader.show .box > div { |
|
width: 18px; |
|
height: 18px; |
|
background-color: #2eb18d; |
|
|
|
border-radius: 100%; |
|
display: inline-block; |
|
-webkit-animation: sk-bouncedelay 1.4s infinite ease-in-out both; |
|
animation: sk-bouncedelay 1.4s infinite ease-in-out both; |
|
} |
|
|
|
.sweet-loader.show .box .circle1 { |
|
-webkit-animation-delay: -0.32s; |
|
animation-delay: -0.32s; |
|
} |
|
|
|
.sweet-loader.show .box .circle2 { |
|
-webkit-animation-delay: -0.16s; |
|
animation-delay: -0.16s; |
|
} |
|
|
|
@-webkit-keyframes sk-bouncedelay { |
|
0%, 80%, 100% { -webkit-transform: scale(0) } |
|
40% { -webkit-transform: scale(1.0) } |
|
} |
|
|
|
@keyframes sk-bouncedelay { |
|
0%, 80%, 100% { |
|
-webkit-transform: scale(0); |
|
transform: scale(0); |
|
} 40% { |
|
-webkit-transform: scale(1.0); |
|
transform: scale(1.0); |
|
} |
|
} |
|
/*end of part 24----------------------------------------------------*/ |
|
|
|
|
|
|
|
/*------------------------------------------------------------------- |
|
[25. Responsive Media Queries] |
|
*------------------------------------------------------------------*/ |
|
@media screen and (min-width: 480px) { |
|
body { |
|
font-size: 16px; |
|
} |
|
header{ |
|
padding: 10px 20px; |
|
} |
|
section.container, |
|
div.container{ |
|
padding: 0 20px; |
|
} |
|
nav.menu{ |
|
width: 300px; |
|
} |
|
.form-label-divider span{ |
|
top: -10px; |
|
} |
|
.post-detail{ |
|
padding: 20px; |
|
} |
|
.search-result-header{ |
|
margin: -10px -20px 20px -20px; |
|
} |
|
.search-result-header .form-element{ |
|
padding: 0 20px; |
|
} |
|
.search-result-header .search-result-btn{ |
|
right: 10px; |
|
} |
|
h1 .button{ |
|
font-size: 16px; |
|
} |
|
} |
|
/*end of part 25----------------------------------------------------*/ |
|
|
|
|
|
|
|
/*------------------------------------------------------------------ |
|
[26. Background Color Helpers] |
|
|
|
Orange / .orange #2eb18d |
|
Red / .red #F34954 |
|
Purple / .purple #7A5AAD |
|
Turquoise/ .turquoise #30BFBB |
|
Green / .green #27AE61 |
|
Blue / .blue #2A80BB |
|
Yellow / .yellow #CCA000 |
|
White / .white #FFFFFF |
|
-------------------------------------------------------------------*/ |
|
.orange{ |
|
background-color: #2eb18d; |
|
} |
|
.red{ |
|
background-color: #F34954; |
|
} |
|
.purple{ |
|
background-color: #7A5AAD; |
|
} |
|
.turquoise{ |
|
background-color: #30BFBB; |
|
} |
|
.green{ |
|
background-color: #27AE61; |
|
} |
|
.blue{ |
|
background-color: #2A80BB; |
|
} |
|
.yellow{ |
|
background-color: #CCA000; |
|
} |
|
.white{ |
|
background-color: #FFFFFF; |
|
color: #464646; |
|
} |
|
/*end of part 26----------------------------------------------------*/ |
|
|
|
|
|
|
|
/*------------------------------------------------------------------- |
|
[27. Text Helpers] |
|
*------------------------------------------------------------------*/ |
|
.txt-center{ |
|
text-align: center; |
|
} |
|
.txt-left{ |
|
text-align: left; |
|
} |
|
.txt-right{ |
|
text-align: right; |
|
} |
|
.txt-orange{ |
|
color: #2eb18d; |
|
} |
|
.txt-red{ |
|
color: #F34954; |
|
} |
|
.txt-purple{ |
|
color: #7A5AAD; |
|
} |
|
.txt-turquoise{ |
|
color: #30BFBB; |
|
} |
|
.txt-green{ |
|
color: #33cb4d ; |
|
} |
|
.txt-blue{ |
|
color: #2A80BB; |
|
} |
|
.txt-yellow{ |
|
color: #CCA000; |
|
} |
|
.txt-default{ |
|
color: #464646; |
|
} |
|
.txt-white{ |
|
color: #FFFFFF; |
|
} |
|
.txt-bold{ |
|
font-weight: bold; |
|
font-weight: 700; |
|
} |
|
.txt-extra-bold{ |
|
font-weight: bold; |
|
font-weight: 900; |
|
} |
|
.txt-normal{ |
|
font-weight: normal; |
|
font-weight: 400; |
|
} |
|
.txt-light{ |
|
font-weight: lighter; |
|
font-weight: 300; |
|
} |
|
.o-hidden{ |
|
overflow: hidden; |
|
} |
|
/*end of part 27----------------------------------------------------*/ |
|
|
|
|
|
|
|
/*------------------------------------------------------------------- |
|
[28. Text Animations] |
|
*------------------------------------------------------------------*/ |
|
.animated-text{ |
|
text-align: center; |
|
position: relative; |
|
} |
|
.animated-text h1{ |
|
margin: 0; |
|
padding: 0; |
|
position: relative; |
|
} |
|
.animated-text .text1{ |
|
font-size: 24px; |
|
display: block; |
|
} |
|
.animated-text .text2{ |
|
font-size: 14px; |
|
} |
|
.animated-text .text3{ |
|
display: block; |
|
font-size: 14px; |
|
} |
|
.animated-text .text4{ |
|
display: block; |
|
font-size: 36px; |
|
} |
|
.animated-text .text5{ |
|
display: block; |
|
font-size: 36px; |
|
} |
|
.animated-text .text6{ |
|
display: block; |
|
font-size: 36px; |
|
} |
|
.animated-text .text7{ |
|
font-size: 14px; |
|
display: block; |
|
margin-top: 20px; |
|
} |
|
/*end of part 28----------------------------------------------------*/ |
|
|
|
|
|
|
|
|
|
/*Other Styles and helpers------------------------------------------*/ |
|
.block{ |
|
display: block; |
|
} |
|
.hide{ |
|
display: none !important; |
|
} |
|
.animated{ |
|
display: block !important; |
|
opacity: 1; |
|
} |
|
.zero-opacity{ |
|
opacity: 0; |
|
} |
|
|
|
h1 .button{ |
|
font-size: 14px; |
|
} |
|
|
|
/*------------------------------------------------------------------- |
|
[29. CUSTOMIZE THE CAROUSEL] |
|
*------------------------------------------------------------------*/ |
|
|
|
|
|
|
|
/* Carousel base class */ |
|
|
|
/* Since positioning the image, we need to help out the caption */ |
|
.carousel-caption { |
|
z-index: 1; |
|
} |
|
|
|
/* Declare heights because of positioning of img element */ |
|
.carousel .item { |
|
height: 400px; |
|
background-color:#555; |
|
} |
|
.carousel img { |
|
position: absolute; |
|
top: 0; |
|
left: 0; |
|
min-height: 218px; |
|
width: 100%; |
|
} |
|
|
|
|
|
|
|
/* MARKETING CONTENT |
|
-------------------------------------------------- */ |
|
|
|
/* Pad the edges of the mobile views a bit */ |
|
.marketing { |
|
padding-left: 15px; |
|
padding-right: 15px; |
|
} |
|
|
|
/* Center align the text within the three columns below the carousel */ |
|
.marketing .col-lg-4 { |
|
text-align: center; |
|
margin-bottom: 20px; |
|
} |
|
.marketing h2 { |
|
font-weight: normal; |
|
} |
|
.marketing .col-lg-4 p { |
|
margin-left: 10px; |
|
margin-right: 10px; |
|
} |
|
|
|
|
|
/* Featurettes |
|
------------------------- */ |
|
|
|
.featurette-divider { |
|
margin: 80px 0; /* Space out the Bootstrap <hr> more */ |
|
} |
|
.featurette { |
|
padding-top: 120px; /* Vertically center images part 1: add padding above and below text. */ |
|
overflow: hidden; /* Vertically center images part 2: clear their floats. */ |
|
} |
|
.featurette-image { |
|
margin-top: -120px; /* Vertically center images part 3: negative margin up the image the same amount of the padding to center it. */ |
|
} |
|
|
|
/* Give some space on the sides of the floated elements so text doesn't run right into it. */ |
|
.featurette-image.pull-left { |
|
margin-right: 40px; |
|
} |
|
.featurette-image.pull-right { |
|
margin-left: 40px; |
|
} |
|
|
|
/* Thin out the marketing headings */ |
|
.featurette-heading { |
|
font-size: 50px; |
|
font-weight: 300; |
|
line-height: 1; |
|
letter-spacing: -1px; |
|
} |
|
|
|
|
|
|
|
/* RESPONSIVE CSS |
|
-------------------------------------------------- */ |
|
|
|
@media (min-width: 768px) { |
|
|
|
/* Remve the edge padding needed for mobile */ |
|
.marketing { |
|
padding-left: 0; |
|
padding-right: 0; |
|
} |
|
|
|
/* Navbar positioning foo */ |
|
.navbar-wrapper { |
|
margin-top: 20px; |
|
margin-bottom: -90px; /* Negative margin to pull up carousel. 90px is roughly margins and height of navbar. */ |
|
} |
|
/* The navbar becomes detached from the top, so we round the corners */ |
|
.navbar-wrapper .navbar { |
|
border-radius: 4px; |
|
} |
|
|
|
/* Bump up size of carousel content */ |
|
.carousel-caption p { |
|
margin-bottom: 20px; |
|
font-size: 21px; |
|
line-height: 1.4; |
|
} |
|
|
|
} |
|
.margin{ |
|
margin-top: 49px; |
|
} |
|
/*end of part 28----------------------------------------------------*/ |
|
|
|
|
|
/*------------------------------------------------------------------- |
|
[30. Home Tabs] |
|
*------------------------------------------------------------------*/ |
|
|
|
#content-body { |
|
flex:1; |
|
min-height:170px; |
|
flex-direction: column; |
|
background: #fff; |
|
border: 1px solid #e6e6e6; |
|
} |
|
.round{ |
|
border-radius: 19px; |
|
background: #f7c558; /* Old browsers */ |
|
background: -moz-linear-gradient(top, #f7c558 0%, #e26f25 100%); /* FF3.6-15 */ |
|
background: -webkit-linear-gradient(top, #f7c558 0%,#e26f25 100%); /* Chrome10-25,Safari5.1-6 */ |
|
background: linear-gradient(to bottom, #f7c558 0%,#e26f25 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */ |
|
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f7c558', endColorstr='#e26f25',GradientType=0 ); /* IE6-9 */ |
|
padding: 15px; |
|
} |
|
.app{ |
|
background: #f76b71; /* Old browsers */ |
|
background: -moz-linear-gradient(top, #f76b71 1%, #de2125 100%); /* FF3.6-15 */ |
|
background: -webkit-linear-gradient(top, #f76b71 1%,#de2125 100%); /* Chrome10-25,Safari5.1-6 */ |
|
background: linear-gradient(to bottom, #f76b71 1%,#de2125 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */ |
|
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f76b71', endColorstr='#de2125',GradientType=0 ); /* IE6-9 */ |
|
border-radius: 19px; |
|
padding: 15px; |
|
} |
|
.hot{ |
|
background: #70b2fe; /* Old browsers */ |
|
background: -moz-linear-gradient(top, #70b2fe 0%, #3378f7 100%); /* FF3.6-15 */ |
|
background: -webkit-linear-gradient(top, #70b2fe 0%,#3378f7 100%); /* Chrome10-25,Safari5.1-6 */ |
|
background: linear-gradient(to bottom, #70b2fe 0%,#3378f7 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */ |
|
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#70b2fe', endColorstr='#3378f7',GradientType=0 ); /* IE6-9 */ |
|
border-radius: 19px; |
|
padding: 15px; |
|
} |
|
.vip{ |
|
background: #9f6dfe; /* Old browsers */ |
|
background: -moz-linear-gradient(top, #9f6dfe 0%, #6a1ff4 100%); /* FF3.6-15 */ |
|
background: -webkit-linear-gradient(top, #9f6dfe 0%,#6a1ff4 100%); /* Chrome10-25,Safari5.1-6 */ |
|
background: linear-gradient(to bottom, #9f6dfe 0%,#6a1ff4 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */ |
|
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#9f6dfe', endColorstr='#6a1ff4',GradientType=0 ); /* IE6-9 */ |
|
border-radius: 19px; |
|
padding: 15px; |
|
} |
|
.brands{ |
|
background: #7ff0f1; /* Old browsers */ |
|
background: -moz-linear-gradient(top, #7ff0f1 0%, #39b4fe 100%); /* FF3.6-15 */ |
|
background: -webkit-linear-gradient(top, #7ff0f1 0%,#39b4fe 100%); /* Chrome10-25,Safari5.1-6 */ |
|
background: linear-gradient(to bottom, #7ff0f1 0%,#39b4fe 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */ |
|
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#7ff0f1', endColorstr='#39b4fe',GradientType=0 ); /* IE6-9 */ |
|
border-radius: 19px; |
|
padding: 15px; |
|
} |
|
.flash{ |
|
background: #c5f493; /* Old browsers */ |
|
background: -moz-linear-gradient(top, #1ddc3e 0%, #28a745 100%); /* FF3.6-15 */ |
|
background: -webkit-linear-gradient(top, #1ddc3e 0%,#28a745 100%); /* Chrome10-25,Safari5.1-6 */ |
|
background: linear-gradient(to bottom, #1ddc3e 0%,#28a745 100%) /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */ |
|
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#1ddc3e', endColorstr='#28a745',GradientType=0 ); /* IE6-9 */ |
|
border-radius: 19px; |
|
padding: 15px; |
|
} |
|
|
|
.content-row { |
|
display:flex; |
|
flex:1; |
|
} |
|
.content-col { |
|
padding:23px 0px; |
|
width:33.33%; |
|
text-align:center; |
|
font-size:14px; |
|
float: left; |
|
clear: both; |
|
} |
|
.content-col:last-child { |
|
border-right: none; |
|
} |
|
.content-row:last-child { |
|
border-bottom:none; |
|
} |
|
.content-col>i { |
|
width:55px; |
|
|
|
font-size:25px; |
|
color: #fff; |
|
margin-bottom:10px; |
|
} |
|
.content-col span{ |
|
display: block; |
|
} |
|
|
|
/*end of part 30----------------------------------------------------*/ |
|
|
|
/*------------------------------------------------------------------- |
|
[31. Content Styles] |
|
*------------------------------------------------------------------*/ |
|
.dash-balance{ |
|
background: url(../img/content/dash-bg.jpg) no-repeat center center; |
|
background-size: cover; |
|
position: relative; |
|
overflow: hidden; |
|
padding: 40px 20px 70px; |
|
} |
|
.dash-balance:before{ |
|
content: ''; |
|
position: absolute; |
|
width: 103%; |
|
height: 100%; |
|
left: -3px; |
|
right: 0px; |
|
bottom: -1px; |
|
background: url(../img/content/curve.svg) no-repeat bottom; |
|
z-index: 0; |
|
} |
|
.dash-content h3{ |
|
display: inline-block; |
|
} |
|
.bal-section{ |
|
position: relative; |
|
margin-top: -70px |
|
} |
|
.flex-grow { |
|
-webkit-box-flex: 1; |
|
-ms-flex-positive: 1; |
|
flex-grow: 1; |
|
} |
|
.balance-card{ |
|
background: url(../img/content/b1-bg.png) no-repeat; |
|
background-size: cover; |
|
padding: 30px 20px; |
|
border-radius: 10px |
|
} |
|
@media(min-width: 992px){ |
|
.balance-card{ |
|
background-position: center; |
|
} |
|
.dash-balance:before{ |
|
background: none |
|
} |
|
} |
|
.b-val{ |
|
margin: 0; |
|
color: #fff; |
|
line-height: 1; |
|
margin-bottom: 5px; |
|
font-size: 32px; |
|
font-weight: 700; |
|
} |
|
.balance-card .badge{ |
|
background-color: rgba(255, 255, 255, 0.2); |
|
padding: 10px 15px; |
|
} |
|
.balance-card .badge i{ |
|
color: #1ce93f |
|
} |
|
.resources-card-wrapper { |
|
display: -webkit-box; |
|
display: -ms-flexbox; |
|
display: flex; |
|
-ms-flex-pack: distribute; |
|
justify-content: space-around; |
|
} |
|
.resources-card { |
|
width: 49%; |
|
padding: 25px 15px; |
|
border-radius: 3px; |
|
background: #ffffff; |
|
-webkit-box-shadow: 0px 0px 9px 1px rgba(0, 0, 0, 0.1); |
|
box-shadow: 0px 0px 9px 1px rgba(0, 0, 0, 0.1); |
|
z-index: 10; |
|
} |
|
.resources-card i{ |
|
font-size: 20px; |
|
margin-bottom: 5px |
|
} |
|
|
|
.transaction-list img{ |
|
max-width: 40px; |
|
max-height: 40px |
|
} |
|
.transaction-list{ |
|
margin-bottom: 30px |
|
} |
|
.transaction-list li{ |
|
background: #fff; |
|
padding: 10px; |
|
border-radius: 10px; |
|
margin: 0 0 10px; |
|
box-shadow: 0px 0px 9px 1px rgba(0, 0, 0, 0.02); |
|
} |
|
.coin-name{ |
|
margin: 0; |
|
font-weight: 600; |
|
|
|
} |
|
|
|
.buy-card{ |
|
background-image: linear-gradient(-12deg,#a1c4fc 0,#8473ee 100%); |
|
width: 49%; |
|
padding: 30px 15px; |
|
border-radius: 3px; |
|
-webkit-box-shadow: 0px 0px 9px 1px rgba(0, 0, 0, 0.1); |
|
box-shadow: 0px 0px 9px 1px rgba(0, 0, 0, 0.1); |
|
} |
|
.buy-card h4{ |
|
margin: 10px 0 5px; |
|
color: #fff; |
|
font-weight: 600 |
|
} |
|
.buy-card p{ |
|
margin: 5px 0; |
|
font-weight: 400 |
|
} |
|
|
|
.crypto-b{ |
|
display: -ms-flexbox; |
|
display: flex; |
|
-ms-flex-align: center; |
|
align-items: center; |
|
text-align: left; |
|
width: 100%; |
|
margin-right: 10px; |
|
padding: 15px 13px |
|
} |
|
@media(max-width: 400px){ |
|
|
|
.crypto-b{ |
|
margin-right: 10px; |
|
flex: 1; |
|
} |
|
} |
|
.live-trade{ |
|
padding: 0 15px |
|
} |
|
.crypto-b .coin-name{ |
|
color: #fff |
|
} |
|
.crypto-b i{ |
|
font-size: 20px; |
|
width: 35px; |
|
height: 35px; |
|
font-weight: 500; |
|
text-align: center; |
|
padding: 3px; |
|
border: 1px solid #fff; |
|
border-radius: 50%; |
|
color: #fff; |
|
} |
|
.coin-box{ |
|
background: #fff; |
|
padding: 17px 15px; |
|
border: 1px solid #eee; |
|
} |
|
.img-xs{ |
|
max-width: 60px |
|
} |
|
.ref-card{ |
|
padding: 20px 15px; |
|
border-radius: 10px; |
|
margin-bottom: 15px; |
|
background-size: cover !important |
|
} |
|
.ref-card .badge { |
|
background-color: rgba(255, 255, 255, 0.2); |
|
padding: 10px 15px; |
|
} |
|
.ref-card.c1{ |
|
background: url(../img/content/ref1.png) no-repeat center center; |
|
} |
|
.ref-card.c2{ |
|
background: url(../img/content/ref2.png) no-repeat center center; |
|
} |
|
.ref-card.c3{ |
|
background: url(../img/content/ref3.png) no-repeat center center; |
|
} |
|
|
|
.refer #content-body{ |
|
padding-top: 0; |
|
padding-bottom: 30px |
|
} |
|
.refer .content-head{ |
|
position: relative; |
|
padding: 20px 15px; |
|
margin-bottom: 30px |
|
} |
|
.ref-bouns{ |
|
background: orange; |
|
position: absolute; |
|
text-align: center; |
|
right: 15px; |
|
color: #fff; |
|
top: 0; |
|
padding: 10px; |
|
} |
|
.ref-content{ |
|
padding: 0 15px |
|
} |
|
.ref-content .button{ |
|
margin-top: 10px |
|
} |
|
.ref-copy{ |
|
position: absolute; |
|
right: -6px; |
|
background: #00adf2; |
|
width: 40px; |
|
height: 40px; |
|
color: #fff; |
|
text-align: center; |
|
line-height: 40px; |
|
} |
|
.ref-statistics{ |
|
width: 49%; |
|
padding: 25px 15px; |
|
border-radius: 3px; |
|
background: #ffffff; |
|
-webkit-box-shadow: 0px 0px 9px 1px rgba(0, 0, 0, 0.1); |
|
box-shadow: 0px 0px 9px 1px rgba(0, 0, 0, 0.1); |
|
text-align: center; |
|
margin-top: 15px; |
|
} |
|
.ref-statistics p{ |
|
margin-bottom: 0 |
|
} |
|
|
|
|
|
/*Live crypto widgets*/ |
|
.widget_logo{display: none;} |
|
|
|
|
|
.amcharts-graph-column-front.amcharts-graph-column-element, |
|
.amcharts-legend-marker{ |
|
fill:#8688ff; |
|
stroke: #8688ff |
|
} |
|
.amcharts-graph-stroke{ |
|
stroke: #8688ff; |
|
} |
|
.amcharts-graph-fill{ |
|
fill:#8688ff |
|
} |
|
.ccc-widget.ccc-chart-v3{ |
|
margin-bottom: 15px |
|
} |
|
.chartTypeTabLinks{ |
|
display: none; |
|
} |
|
.tabsPeriodsContainer{ |
|
margin-top: 20px |
|
} |
|
#marketsContainerUSD{ |
|
display: none !important; |
|
} |
|
.cryptocompare-logo{ |
|
display: none; |
|
} |
|
.img-affa-wrapper{ |
|
padding: 20px; |
|
border: 2px dashed #8688ff; |
|
margin-bottom: 30px; |
|
} |
|
.content-head{ |
|
padding: 10px 15px; |
|
border-bottom: 1px solid #eee; |
|
} |
|
|
|
.wallet-card{ |
|
width: 49%; |
|
padding: 15px 10px; |
|
text-align: center; |
|
border-radius: 3px; |
|
-webkit-box-shadow: 0px 0px 9px 1px rgba(0, 0, 0, 0.1); |
|
box-shadow: 0px 0px 9px 1px rgba(0, 0, 0, 0.1); |
|
} |
|
.purp{ |
|
background-image: linear-gradient(-12deg,#a1c4fc 0,#8473ee 100%) !important; |
|
} |
|
.wallet-card .c-icon{ |
|
font-size: 26px; |
|
color: #fff |
|
} |
|
.wallet-card h3{ |
|
margin: 10px 0; |
|
font-size: 16px |
|
} |
|
|
|
.wallets-list{ |
|
position: relative; |
|
} |
|
.wallets-list h3{ |
|
color: #fff |
|
} |
|
.wallets-list i{ |
|
color: #fff; |
|
margin-right: 10px; |
|
border: 1px solid #fff; |
|
width: 30px; |
|
display: inline-block; |
|
height: 30px; |
|
line-height: 27px; |
|
border-radius: 50%; |
|
text-align: center; |
|
} |
|
.wallets-list .form-row-group.with-icons .form-row i{ |
|
top: -2px; |
|
border: none; |
|
} |
|
.wallets-list .expandable-item.active .expandable-content{ |
|
min-height: 800px |
|
} |
|
.recent-trans{ |
|
position: relative; |
|
padding: 30px 15px; |
|
background: url(../img/content/trans-bg1.png) no-repeat bottom center; |
|
border-radius: 15px; |
|
background-size: cover; |
|
} |
|
.recent-trans .dropdown-menu-list:before{ |
|
content: ''; |
|
position: absolute; |
|
top: 50%; |
|
left: 31px; |
|
width: 0px; |
|
transform: translateY(-50%); |
|
height: 77%; |
|
border: 1px dashed rgba(255,255,255,.4); |
|
|
|
} |
|
.recent-trans .dropdown-menu-list li { |
|
width: 100%; |
|
display: block; |
|
position: relative; |
|
padding: 15px 0 15px 0; |
|
border-bottom: 1px solid transparent; |
|
} |
|
.recent-trans .dropdown-menu-list li strong{ |
|
color: #fff |
|
} |
|
.recent-trans .dropdown-menu-list li:after{ |
|
content: ''; |
|
position: absolute; |
|
bottom: 0; |
|
right: 0; |
|
width: 87%; |
|
height: 1px; |
|
background: rgba(255,255,255,.4) |
|
} |
|
.recent-trans .time{ |
|
display: block; |
|
margin-top: 5px; |
|
color: #ede6e6 |
|
} |
|
.recent-trans .notice-icon i { |
|
border-radius: 50%; |
|
-o-border-radius: 50%; |
|
-ms-border-radius: 50%; |
|
-moz-border-radius: 50%; |
|
-webkit-border-radius: 50%; |
|
height: 35px; |
|
width: 35px; |
|
background: #5776d5; |
|
line-height: 35px; |
|
float: left; |
|
display: inline-block; |
|
text-align: center; |
|
margin-right: 15px; |
|
color: #ffffff; |
|
margin-top: 5px; |
|
} |
|
.wallet-address{ |
|
position: relative; |
|
padding: 30px 15px; |
|
background: url(../img/content/trans-bg2.png) no-repeat center; |
|
border-radius: 0 0 15px 15px; |
|
text-align: center; |
|
overflow: hidden; |
|
background-size: cover; |
|
} |
|
.wallet-address:before{ |
|
position: absolute; |
|
content: ''; |
|
width: 98%; |
|
left: 50%; |
|
top: 0; |
|
transform: translateX(-50%); |
|
height: 1px; |
|
border-top: 1px dashed #fff; |
|
} |
|
.wallet-address h4{ |
|
color: #fff; |
|
margin-bottom: 10px |
|
} |
|
.wallet-address .icon{ |
|
position: absolute; |
|
max-width: 15px; |
|
top: 12px; |
|
} |
|
.member-img { |
|
width: 44px; |
|
height: 44px; |
|
display: block; |
|
float: left; |
|
overflow: hidden; |
|
border-radius: 50%; |
|
padding: 3px; |
|
background: #FFF; |
|
border: solid 1px #2eb18d; |
|
} |
|
.member-img img { |
|
width: 36px; |
|
height: 36px; |
|
border-radius: 50%; |
|
} |
|
.add-receiever{ |
|
position: relative; |
|
border: 1px solid #eee; |
|
background-image: linear-gradient(-12deg,#a1c4fc 0,#8473ee 100%); |
|
border-radius: 10px; |
|
padding: 20px 5px; |
|
width: 94%; |
|
text-align: center; |
|
} |
|
.add-receiever i{ |
|
width: 40px; |
|
height: 40px; |
|
line-height: 40px; |
|
color: #9ffcae; |
|
border-radius: 50%; |
|
background: rgba(255, 255, 255, .3); |
|
} |
|
.add-receiever h4{ |
|
font-size: 15px; |
|
margin: 15px 0 0; |
|
color: #fff |
|
} |
|
.money-receiver{ |
|
position: relative; |
|
border: 1px solid #eee; |
|
background: #fff; |
|
border-radius: 10px; |
|
margin-bottom: 0px; |
|
padding: 15px 5px; |
|
width: 94%; |
|
text-align: center; |
|
} |
|
.money-receiver img{ |
|
border-radius: 50%; |
|
padding: 5px; |
|
max-width: 50px; |
|
border: 1px solid #00b1f2; |
|
} |
|
.money-receiver h4{ |
|
font-size: 15px; |
|
margin: 15px 0 0; |
|
} |
|
.calc-crr{ |
|
width: 40%; |
|
float: left; |
|
} |
|
.calc-crr-mid{ |
|
width: 10%; |
|
margin: 5%; |
|
float: left; |
|
} |
|
.transaction-details li { |
|
background: #fff; |
|
padding: 7px 10px; |
|
border-radius: 10px; |
|
border: 1px solid #ddd; |
|
margin: 6px 0; |
|
box-shadow: 0px 0px 9px 1px rgba(0, 0, 0, 0.02); |
|
} |
|
|
|
.notification-list{ |
|
margin:0 20px; |
|
margin-top: -20px; |
|
background: #fff; |
|
border: 1px solid #eee; |
|
box-shadow: 0px 0px 9px 1px rgba(0, 0, 0, 0.02); |
|
} |
|
.notification-list li{ |
|
padding: 7px 10px 10px; |
|
border-bottom: 1px solid #eee; |
|
margin: 6px 0; |
|
} |
|
.notification-list li:last-child{ |
|
padding: 10px; |
|
background: #eee; |
|
margin: -6px 0 0; |
|
} |
|
.notification-list li a{ |
|
font-weight: 600 |
|
} |
|
.notification-list .notice-icon{ |
|
border-radius: 50%; |
|
height: 30px; |
|
width: 30px; |
|
font-size: 14px; |
|
line-height: 31px; |
|
display: inline-block; |
|
text-align: center; |
|
} |
|
.available{ |
|
background-color: #4CAF50; |
|
} |
|
.away{ |
|
background-color: rgba(255,193,7,1); |
|
} |
|
.busy{ |
|
background-color: rgba(240,80,80,1); |
|
} |
|
.notification-list .notice-icon i{ |
|
color: #ffffff; |
|
} |
|
.notification{ |
|
position: absolute; |
|
right: 0; |
|
transform: translateY(-50%); |
|
top: 50%; |
|
} |
|
.notification i{ |
|
font-size: 18px; |
|
color: #fff |
|
} |
|
.c-panel{ |
|
background: #fff; |
|
position: relative; |
|
border: 1px solid #e6e6e6; |
|
padding: 30px 15px; |
|
} |
|
.has-shadow{ |
|
-webkit-box-shadow: 0 2px 28px rgba(0,0,0,.1); |
|
box-shadow: 0 2px 28px rgba(0,0,0,.1); |
|
} |
|
|
|
ul.adv-stats li { |
|
display: inline-block; |
|
color: gray; |
|
padding: 4px 6px; |
|
margin: 3px; |
|
} |
|
ul.adv-stats { |
|
margin: 0px 0 0; |
|
padding: 0 |
|
} |
|
ul.adv-stats li span { |
|
margin-left: 3px; |
|
} |
|
ul.adv-stats li:nth-child(1), ul.adv-stats li:nth-child(1) .fa { |
|
color: #FF9800; |
|
} |
|
ul.adv-stats li:nth-child(2), ul.adv-stats li:nth-child(2) .fa { |
|
color: #6e91cb; |
|
} |
|
ul.adv-stats li:nth-child(3), ul.adv-stats li:nth-child(3) .fa { |
|
color: #F782AA; |
|
} |
|
ul.adv-stats li:nth-child(4), ul.adv-stats li:nth-child(4) .fa { |
|
color: #3bcfb4; |
|
} |
|
ul.adv-stats li:nth-child(5), ul.adv-stats li:nth-child(5) .fa { |
|
color: #968f8f; |
|
} |
|
|
|
.chart-height-sm { |
|
position: relative; |
|
height: 156px; |
|
} |
|
.advertising-wrapper { |
|
position: relative; |
|
} |
|
.advertising-wrapper h3.info-label span { |
|
font-weight: 100; |
|
display: block; |
|
font-size: 16px; |
|
margin-bottom: 5px; |
|
} |
|
.advertising-wrapper h3.info-label { |
|
position: absolute; |
|
left: 50%; |
|
right: 50%; |
|
width: 100px; |
|
margin-left: -50px; |
|
top: 50%; |
|
text-align: center; |
|
color: #0094f0; |
|
height: 48px; |
|
margin-top: -24px; |
|
} |
|
@media (max-width:480px) { |
|
.split-list{ |
|
text-align: center; |
|
margin-top: 15px |
|
} |
|
.b-val{ |
|
font-size: 22px |
|
} |
|
.balance-card { |
|
padding: 30px 15px; |
|
} |
|
} |
|
ul.income-list li { |
|
float: left; |
|
margin: 0; |
|
padding: 10px; |
|
box-sizing: border-box; |
|
text-align: center; |
|
width: 33.3333%; |
|
} |
|
|
|
.trader-info{ |
|
text-align: center; |
|
} |
|
.trader-info h3{ |
|
font-size: 18px; |
|
margin-bottom: 10px; |
|
line-height: 1; |
|
} |
|
.trader-info p{ |
|
margin: 0 |
|
} |
|
.trader-info-list{ |
|
margin-top: 15px; |
|
background: #fff; |
|
border: 1px solid #eee; |
|
padding: 30px 0px; |
|
} |
|
.trader-info-list li{ |
|
width: 32%; |
|
display: inline-block; |
|
} |
|
.trader-info-list li h2{ |
|
margin-bottom: 0; |
|
color: #72a1ec; |
|
font-size: 16px; |
|
font-weight: 700; |
|
} |
|
/*end of part 31----------------------------------------------------*/ |
|
|
|
|
|
/*------------------------------------------------------------------- |
|
[32. Home Tabs] |
|
*------------------------------------------------------------------*/ |
|
|
|
footer { |
|
padding: 20px 0; |
|
text-align: center; |
|
background-color: #fff; |
|
} |
|
|
|
footer ul { |
|
padding: 0; |
|
margin: 0; |
|
border-bottom: 1px solid #eee; |
|
padding-bottom: 20px; |
|
margin-bottom: 18px; |
|
} |
|
footer ul li { |
|
display: inline-block; |
|
margin: 2px 4px; |
|
} |
|
footer ul li a i { |
|
background: #f7f7f7; |
|
width: 35px; |
|
height: 35px; |
|
line-height: 35px !important; |
|
border-radius: 50%; |
|
} |
|
|
|
/*end of part 31----------------------------------------------------*/ |