You are here

main.css in Share Buttons, Related Posts, Content Analytics - Shareaholic 7.3

Same filename and directory in other branches
  1. 8 assets/css/main.css
body {
  background: transparent;
  font-family: sans-serif;
}

#app_settings{
  padding-top:20px;
}

div#shareaholic-form-container fieldset {
	border: 1px solid #d8d8d8;
	margin: 5px;
	padding: 10px;
	color: #666666;
	line-height: 3em;
  font-size: 12px;
  float:left;
}

div#shareaholic-form-container .app {
  width:100%;
}

div#shareaholic-form-container .app h2 {
  font-size: 20px;
  color: #464646;
  font-family: "HelveticaNeue-Light","Helvetica Neue Light","Helvetica Neue",sans-serif;
 }

div#shareaholic-form-container .wrap h2 {
  padding: 9px 15px 4px 0;
  line-height: 29px;
  font-weight: normal;
  margin: 0;
  text-shadow: #fff 0 1px 0;
}
 
div#shareaholic-form-container legend {
	border: none;
	width: auto;
	font-weight: bold;
	padding: 0px 10px;
	color: #007bb6;
  margin-bottom: 0;
  font-size: 14px;
}

.check {
	position: relative;
	top:-4px;
}

.helper {
	display: block;
	margin-left: 20px;
	font-size: 12px;
	line-height: 14pt;
	text-indent: -17px;
}

.label {
	margin-right:20px;
}

h3 {
  clear:both;
}

.clear {
  clear:both
}

#iframe_container, iframe {
  width:100%;
  height: 550px;
}

.bg-loading-img {
  background-image:url(../img/ajax_loader_green_128.gif);
  background-repeat:no-repeat;
  background-position: center center;
}

#shortcode_container, #shortcode {
  cursor: inherit;
  width: 100%;
  text-align: center;
  background: white;
  height: 30px;
}

#shortcode_container {
  border-top: 3px solid #ccc;
}

#shortcode {
  font-family: monospace;
}

.reveal-modal {
  width: 720px;
  height: 550px;
  margin-left: -335px;
  position: fixed;
  /* display: none; */
}

.reveal-modal.has-shortcode iframe,
.reveal-modal.has-shortcode #iframe_container {
  height: 550px;
}

.fieldset-footer {
  clear: both;
  padding-top: 10px;
  overflow: hidden;
}

.fieldset-footer button{
  float: left;
}

#editing_modal {
  padding: 0;
}

#editing_modal #iframe_container iframe {
  height: 550px;
}

.wp-submenu-wrap ul {
  margin: 0;
}

/* OOCSS Styles */

.line,.lastUnit{overflow:hidden; *overflow:visible;*zoom:1;}
.unit{float:left;}
.unitRight{float:right;}
.size1of1{float:none;}
.size1of2{width:50%;}
.size1of3{width:33.33333%;}
.size2of3{width:66.66666%;}
.size1of4{width:25%;}
.size3of4{width:75%;}
.size1of5{width:20%;}
.size2of5{width:40%;}
.size3of5{width:60%;}
.size4of5{width:80%;}
.lastUnit{float:none;width:auto;_position:relative;_left:-3px;_margin-right:-3px;}

/**
 * Spacing classes
 * Should be used to modify the default spacing between objects (not between nodes of the same object)
 * Please use judiciously. You want to be using defaults most of the time, these are exceptions!
 * <type><location><size>
 */
 /* ====== Default spacing ====== */
h1, h2, h3, h4, h5, h6, ul, ol,dl, p,blockquote, .media {margin:10px;}
h1, h2, h3, h4, h5, h6,img{padding-bottom:0px;}
pre{margin: 10px;}
table h1,table h2,table h3, table h4, table h5, table h6, table p, table ul, table ol, table dl{padding:0;}

/* spacing helpers
p,m = padding,margin
a,t,r,b,l,h,v = all,top,right,bottom,left,horizontal,vertical
s,m,l,n = small(5px),medium(10px),large(20px),none(0px)
*/

.ptn,.pvn,.pan{padding-top:0px !important}
.pts,.pvs,.pas{padding-top:5px !important}
.ptm,.pvm,.pam{padding-top:10px !important}
.ptl,.pvl,.pal{padding-top:20px !important}
.prn,.phn,.pan{padding-right:0px !important}
.prs,.phs,.pas{padding-right:5px !important}
.prm,.phm,.pam{padding-right:10px !important}
.prl,.phl,.pal{padding-right:20px !important}
.pbn,.pvn,.pan{padding-bottom:0px !important}
.pbs,.pvs,.pas{padding-bottom:5px !important}
.pbm,.pvm,.pam{padding-bottom:10px !important}
.pbl,.pvl,.pal{padding-bottom:20px !important}
.pln,.phn,.pan{padding-left:0px !important}
.pls,.phs,.pas{padding-left:5px !important}
.plm,.phm,.pam{padding-left:10px !important}
.pll,.phl,.pal{padding-left:20px !important}
.mtn,.mvn,.man{margin-top:0px !important}
.mts,.mvs,.mas{margin-top:5px !important}
.mtm,.mvm,.mam{margin-top:10px !important}
.mtl,.mvl,.mal{margin-top:20px !important}
.mrn,.mhn,.man{margin-right:0px !important}
.mrs,.mhs,.mas{margin-right:5px !important}
.mrm,.mhm,.mam{margin-right:10px !important}
.mrl,.mhl,.mal{margin-right:20px !important}
.mbn,.mvn,.man{margin-bottom:0px !important}
.mbs,.mvs,.mas{margin-bottom:5px !important}
.mbm,.mvm,.mam{margin-bottom:10px !important}
.mbl,.mvl,.mal{margin-bottom:20px !important}
.mln,.mhn,.man{margin-left:0px !important}
.mls,.mhs,.mas{margin-left:5px !important}
.mlm,.mhm,.mam{margin-left:10px !important}
.mll,.mhl,.mal{margin-left:20px !important}
.mra,.mha{margin-right:auto !important}
.mla,.mha{margin-left:auto !important}

/* body { */
/* background: rgba(0,0,0, 0.3); */
/*     font-family: 'Open Sans', sans-serif; */
/*     margin: 0; */
/*     padding: 0; */
/*     height: 100%; */
/*     min-height: 100%; */
/* } */

.blocking-modal{
  font-family: 'Open Sans', sans-serif;
  top:150px;
  background: white;
  width: 680px;
  overflow: hidden;
  text-align: center;
  color: #414042;
  font-size: 14px;
  line-height: 16pt;
  box-shadow: 0px 0px 52px rgba(0,0,0,0.32);
  padding: 0;
  height: 500px;
}

.api-key-modal{
  height: 400px;
}

.blocking-modal .content{

}

div#shareaholic-form-container h4 {
    background: #424142;
    color: #e6e6e6;
    font-size: 30px;
    line-height: 60px;
    height: auto;
    font-weight: 300;
    margin: 0;
}

.blocking-modal a {
    color: #2ba9e1;
    font-weight: bold;
    text-decoration: none;
}

.blocking-modal a:hover {
  border-bottom: 1px dashed;
  color: #0988be;
}


.blocking-modal h2 {
    font-size: 28px;
   font-weight: normal;
}

.blocking-modal p {
  margin: 10px;
  font-size: 14px;
  line-height: 21px;
}

.blocking-modal img {
    width: 100px;
    height: 100px;
}

.blocking-modal .btn_main {
  position: relative;
  cursor: pointer;
  display: inline-block;
  background: #27ae60;
  color: white;
  text-transform: uppercase;
  text-decoration: none;
  padding: 20px 40px;
  font-size: 18px;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.25);
  border-radius: 5px;
  -webkit-box-shadow: inset 0 -3px #14947b;
  box-shadow: inset 0 -3px #14947b;
}

.blocking-modal .btn_main:active {
  top: 1px;
  color: white;
  outline: none;
  -webkit-box-shadow: none;
  box-shadow: none;
}

.blocking-modal .btn_main:hover {
  background: #21A057;
  color: white;
  border: none;
}

.blocking-modal .small {
  font-size: 12px;
  color: #888888;
}

input[type='text'] {
  width: 272px;
}

.settings_updated {
  color: #fff;
  text-shadow: 0px 1px 1px rgba(0,0,0,0.4);
  font-size: 14px;
  background-color: #45a147 !important;
  border-color: #316632 !important;
}

.signuppromo{
  border: 1px solid #d8d8d8;
	border-radius: 6px;
	padding: 20px 20px;
	color: #45A147;
	font-size: 14px;
	float: right;
	margin: 25px 0 0 20px;
	min-width: 250px;
}

.signuppromo_note{
	font: 300 12px/20px "open sans","helvetica neue",helvetica,arial,sans-serif;
	color: #555;
}

.promoh1{
	font: 400 16px/22px "open sans","helvetica neue",helvetica,arial,sans-serif;
	margin: 0;
	padding: 0;
}

.promosub{
	color: black;
	margin: 10px 0 0 0;
	font-weight: bold;
}

div#shareaholic-form-container .signuppromo ul{
margin: 24px 0px;
}

.signuppromo ul li{
  background: url(../img/bolt.png) 0 2px no-repeat;
  background-size: 22px 22px;
  color: #555;
  float: left;
  font: 400 13px/20px "open sans","helvetica neue",helvetica,arial,sans-serif;
  list-style: none;
  padding: 2px 0 2px 32px;
  margin: 0 0 18px 0;
  text-align: left;
}

.signuppromo a,.signuppromo a:active {
  -moz-box-shadow:inset 0px 1px 0px 0px #ffffff;
  -webkit-box-shadow:inset 0px 1px 0px 0px #ffffff;
  box-shadow:inset 0px 1px 0px 0px #ffffff;
  background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #ffffff), color-stop(1, #f6f6f6));
  background:-moz-linear-gradient(top, #ffffff 5%, #f6f6f6 100%);
  background:-webkit-linear-gradient(top, #ffffff 5%, #f6f6f6 100%);
  background:-o-linear-gradient(top, #ffffff 5%, #f6f6f6 100%);
  background:-ms-linear-gradient(top, #ffffff 5%, #f6f6f6 100%);
  background:linear-gradient(to bottom, #ffffff 5%, #f6f6f6 100%);
  filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#f6f6f6',GradientType=0);
  background-color:#ffffff;
  -moz-border-radius:6px;
  -webkit-border-radius:6px;
  border-radius:6px;
  width: 50%;
  border:1px solid #dcdcdc;
  text-align: center;
  margin: 0 auto;
  display:block;
  color:#666666;
  font-size:15px;
  font-weight:bold;
  padding:16px 24px;
  text-decoration:none;
  text-shadow:0px 1px 0px #ffffff;
}
    
.signuppromo a:hover {
  background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #f6f6f6), color-stop(1, #ffffff));
  background:-moz-linear-gradient(top, #f6f6f6 5%, #ffffff 100%);
  background:-webkit-linear-gradient(top, #f6f6f6 5%, #ffffff 100%);
  background:-o-linear-gradient(top, #f6f6f6 5%, #ffffff 100%);
  background:-ms-linear-gradient(top, #f6f6f6 5%, #ffffff 100%);
  background:linear-gradient(to bottom, #f6f6f6 5%, #ffffff 100%);
  filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#f6f6f6', endColorstr='#ffffff',GradientType=0);
  background-color:#f6f6f6;
}

div#shareaholic-form-container input[type="submit"].settings {
  -webkit-appearance: button;
  border: 1px solid #3F81AE;
  border-color: #3F81AE #2E68A1 #1F5496;
  border-radius: 4px;
  -webkit-box-shadow: inset 0 1px 0 0 #72baeb,0 1px 2px 0 #c3c3c3;
  box-shadow: inset 0 1px 0 0 #72baeb,0 1px 2px 0 #c3c3c3;
  color: #fff;
  display: inline-block;
  font: 600 13px/1 "open sans","helvetica neue",helvetica,arial,sans-serif;
  background-color: #52a8e8;
  background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #52a8e8), color-stop(100%, #377ad0));
  background-image: -webkit-linear-gradient(top, #52a8e8, #377ad0);
  background-image: -moz-linear-gradient(top, #52a8e8, #377ad0);
  background-image: -ms-linear-gradient(top, #52a8e8, #377ad0);
  background-image: -o-linear-gradient(top, #52a8e8, #377ad0);
  background-image: linear-gradient(top, #52a8e8, #377ad0);
  line-height: 17px;
  margin: 0;
  padding: 8px 14px;
  text-align: center;
  text-shadow: 0 -1px 1px #3275BB;
  -webkit-background-clip: padding-box;
}

div#shareaholic-form-container input[type="submit"]:hover.settings {
  -webkit-box-shadow: inset 0 1px 0 0 #6aadd9;
  box-shadow: inset 0 1px 0 0 #6aadd9;
  background-color: #4b9ad6;
  background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #4b9ad6), color-stop(100%, #326fbf));
  background-image: -webkit-linear-gradient(top, #4b9ad6, #326fbf);
  background-image: -moz-linear-gradient(top, #4b9ad6, #326fbf);
  background-image: -ms-linear-gradient(top, #4b9ad6, #326fbf);
  background-image: -o-linear-gradient(top, #4b9ad6, #326fbf);
  background-image: linear-gradient(top, #4b9ad6, #326fbf);
}

div#shareaholic-form-container input.btn_main {
  margin-bottom: 0;
  margin-right: 0;
  border: 0;
}

div #shareaholic-form-container .app label {
  display: inline;
  font-size: 12px;
}

div #shareaholic-form-container .nav li {
  list-style: none;
}

div #shareaholic-form-container ul.nav  {
  border-bottom: 1px solid #ddd;
  margin: 0;
}

div #shareaholic-form-container fieldset.app legend img  {
  width: 32px;
  height: 32px;
}

#shareaholic-form-container .key-status {
  padding: 0.4em 1em;
  color: #fff;
  text-align: center;
  -webkit-border-radius: 3px;
  border-radius: 3px;
  border-width: 1px;
  border-style: solid;
  text-shadow: 0px 1px 0px rgba(0,0,0,0.4);
}

#shareaholic-form-container .key-description {
  line-height: 1.6em;
  margin-top:10px;
}

#shareaholic-form-container .key-status.failed {
  background-color: #EB5353;
  border: 1px solid #e62525;
}

#shareaholic-form-container .key-status.passed {
  background-color: #45a147;
  border: 1px solid #1E8520;
}

.help_links{
  border: 1px solid #d8d8d8;
	border-radius: 6px;
	padding: 20px 20px;
	color: #45A147;
	font-size: 14px;
	float: right;
	margin: 25px 0 0 20px;
	width: 250px;
}

.help_links ul{
  margin: 0px 0px 0px 15px;
  list-style-type: square;
}

.help_links ul li{
  color: #555;
  float: left;
  font: 400 12px/18px "open sans","helvetica neue",helvetica,arial,sans-serif;
  margin: 0 0 4px 0;
  text-align: left;
}

i.icon.icon-share_buttons {
  background-position: 0 0px;
  width: 16px;
  height: 16px;
}

i.icon.icon-recommendations {
  background-position: 0 -16px;
  width: 16px;
  height: 16px;
}

i.icon.icon-affiliate {
  background-position: 0 -160px;
  width: 16px;
  height: 16px;
}

i.icon.icon-analytics {
  background-position: 0 -32px;
  width: 16px;
  height: 16px;
}

i.icon.icon-website {
  background-position: 0 -96px;
  width: 16px;
  height: 16px;
}

i.icon {
  vertical-align: middle;
  background-image: url(../img/shareaholic_com_sprite.png);
  background-position: 0 0;
  background-repeat: no-repeat;
  display: inline-block;
  position: relative;
  width: 16px;
  height: 16px;
  margin-right: 7px;
}

/* Header - Start */

#shr-header-container {
  padding-bottom: 10px !important;
}

#shr-header {
  top: auto !important;
  position: inherit !important;
  box-shadow: 0 0 0px #c3c3c3 !important;
}

#shr-header .shr-header-content {
  max-width: unset !important;
}

#shr-header .shr-toplevel-link {
  border-right: none !important;
  border-left: none !important;
}

.shr-sites-container {
  z-index: 2147483647 !important;
}

/* Header - End */

File

assets/css/main.css
View source
  1. body {
  2. background: transparent;
  3. font-family: sans-serif;
  4. }
  5. #app_settings{
  6. padding-top:20px;
  7. }
  8. div#shareaholic-form-container fieldset {
  9. border: 1px solid #d8d8d8;
  10. margin: 5px;
  11. padding: 10px;
  12. color: #666666;
  13. line-height: 3em;
  14. font-size: 12px;
  15. float:left;
  16. }
  17. div#shareaholic-form-container .app {
  18. width:100%;
  19. }
  20. div#shareaholic-form-container .app h2 {
  21. font-size: 20px;
  22. color: #464646;
  23. font-family: "HelveticaNeue-Light","Helvetica Neue Light","Helvetica Neue",sans-serif;
  24. }
  25. div#shareaholic-form-container .wrap h2 {
  26. padding: 9px 15px 4px 0;
  27. line-height: 29px;
  28. font-weight: normal;
  29. margin: 0;
  30. text-shadow: #fff 0 1px 0;
  31. }
  32. div#shareaholic-form-container legend {
  33. border: none;
  34. width: auto;
  35. font-weight: bold;
  36. padding: 0px 10px;
  37. color: #007bb6;
  38. margin-bottom: 0;
  39. font-size: 14px;
  40. }
  41. .check {
  42. position: relative;
  43. top:-4px;
  44. }
  45. .helper {
  46. display: block;
  47. margin-left: 20px;
  48. font-size: 12px;
  49. line-height: 14pt;
  50. text-indent: -17px;
  51. }
  52. .label {
  53. margin-right:20px;
  54. }
  55. h3 {
  56. clear:both;
  57. }
  58. .clear {
  59. clear:both
  60. }
  61. #iframe_container, iframe {
  62. width:100%;
  63. height: 550px;
  64. }
  65. .bg-loading-img {
  66. background-image:url(../img/ajax_loader_green_128.gif);
  67. background-repeat:no-repeat;
  68. background-position: center center;
  69. }
  70. #shortcode_container, #shortcode {
  71. cursor: inherit;
  72. width: 100%;
  73. text-align: center;
  74. background: white;
  75. height: 30px;
  76. }
  77. #shortcode_container {
  78. border-top: 3px solid #ccc;
  79. }
  80. #shortcode {
  81. font-family: monospace;
  82. }
  83. .reveal-modal {
  84. width: 720px;
  85. height: 550px;
  86. margin-left: -335px;
  87. position: fixed;
  88. /* display: none; */
  89. }
  90. .reveal-modal.has-shortcode iframe,
  91. .reveal-modal.has-shortcode #iframe_container {
  92. height: 550px;
  93. }
  94. .fieldset-footer {
  95. clear: both;
  96. padding-top: 10px;
  97. overflow: hidden;
  98. }
  99. .fieldset-footer button{
  100. float: left;
  101. }
  102. #editing_modal {
  103. padding: 0;
  104. }
  105. #editing_modal #iframe_container iframe {
  106. height: 550px;
  107. }
  108. .wp-submenu-wrap ul {
  109. margin: 0;
  110. }
  111. /* OOCSS Styles */
  112. .line,.lastUnit{overflow:hidden; *overflow:visible;*zoom:1;}
  113. .unit{float:left;}
  114. .unitRight{float:right;}
  115. .size1of1{float:none;}
  116. .size1of2{width:50%;}
  117. .size1of3{width:33.33333%;}
  118. .size2of3{width:66.66666%;}
  119. .size1of4{width:25%;}
  120. .size3of4{width:75%;}
  121. .size1of5{width:20%;}
  122. .size2of5{width:40%;}
  123. .size3of5{width:60%;}
  124. .size4of5{width:80%;}
  125. .lastUnit{float:none;width:auto;_position:relative;_left:-3px;_margin-right:-3px;}
  126. /**
  127. * Spacing classes
  128. * Should be used to modify the default spacing between objects (not between nodes of the same object)
  129. * Please use judiciously. You want to be using defaults most of the time, these are exceptions!
  130. *
  131. */
  132. /* ====== Default spacing ====== */
  133. h1, h2, h3, h4, h5, h6, ul, ol,dl, p,blockquote, .media {margin:10px;}
  134. h1, h2, h3, h4, h5, h6,img{padding-bottom:0px;}
  135. pre{margin: 10px;}
  136. table h1,table h2,table h3, table h4, table h5, table h6, table p, table ul, table ol, table dl{padding:0;}
  137. /* spacing helpers
  138. p,m = padding,margin
  139. a,t,r,b,l,h,v = all,top,right,bottom,left,horizontal,vertical
  140. s,m,l,n = small(5px),medium(10px),large(20px),none(0px)
  141. */
  142. .ptn,.pvn,.pan{padding-top:0px !important}
  143. .pts,.pvs,.pas{padding-top:5px !important}
  144. .ptm,.pvm,.pam{padding-top:10px !important}
  145. .ptl,.pvl,.pal{padding-top:20px !important}
  146. .prn,.phn,.pan{padding-right:0px !important}
  147. .prs,.phs,.pas{padding-right:5px !important}
  148. .prm,.phm,.pam{padding-right:10px !important}
  149. .prl,.phl,.pal{padding-right:20px !important}
  150. .pbn,.pvn,.pan{padding-bottom:0px !important}
  151. .pbs,.pvs,.pas{padding-bottom:5px !important}
  152. .pbm,.pvm,.pam{padding-bottom:10px !important}
  153. .pbl,.pvl,.pal{padding-bottom:20px !important}
  154. .pln,.phn,.pan{padding-left:0px !important}
  155. .pls,.phs,.pas{padding-left:5px !important}
  156. .plm,.phm,.pam{padding-left:10px !important}
  157. .pll,.phl,.pal{padding-left:20px !important}
  158. .mtn,.mvn,.man{margin-top:0px !important}
  159. .mts,.mvs,.mas{margin-top:5px !important}
  160. .mtm,.mvm,.mam{margin-top:10px !important}
  161. .mtl,.mvl,.mal{margin-top:20px !important}
  162. .mrn,.mhn,.man{margin-right:0px !important}
  163. .mrs,.mhs,.mas{margin-right:5px !important}
  164. .mrm,.mhm,.mam{margin-right:10px !important}
  165. .mrl,.mhl,.mal{margin-right:20px !important}
  166. .mbn,.mvn,.man{margin-bottom:0px !important}
  167. .mbs,.mvs,.mas{margin-bottom:5px !important}
  168. .mbm,.mvm,.mam{margin-bottom:10px !important}
  169. .mbl,.mvl,.mal{margin-bottom:20px !important}
  170. .mln,.mhn,.man{margin-left:0px !important}
  171. .mls,.mhs,.mas{margin-left:5px !important}
  172. .mlm,.mhm,.mam{margin-left:10px !important}
  173. .mll,.mhl,.mal{margin-left:20px !important}
  174. .mra,.mha{margin-right:auto !important}
  175. .mla,.mha{margin-left:auto !important}
  176. /* body { */
  177. /* background: rgba(0,0,0, 0.3); */
  178. /* font-family: 'Open Sans', sans-serif; */
  179. /* margin: 0; */
  180. /* padding: 0; */
  181. /* height: 100%; */
  182. /* min-height: 100%; */
  183. /* } */
  184. .blocking-modal{
  185. font-family: 'Open Sans', sans-serif;
  186. top:150px;
  187. background: white;
  188. width: 680px;
  189. overflow: hidden;
  190. text-align: center;
  191. color: #414042;
  192. font-size: 14px;
  193. line-height: 16pt;
  194. box-shadow: 0px 0px 52px rgba(0,0,0,0.32);
  195. padding: 0;
  196. height: 500px;
  197. }
  198. .api-key-modal{
  199. height: 400px;
  200. }
  201. .blocking-modal .content{
  202. }
  203. div#shareaholic-form-container h4 {
  204. background: #424142;
  205. color: #e6e6e6;
  206. font-size: 30px;
  207. line-height: 60px;
  208. height: auto;
  209. font-weight: 300;
  210. margin: 0;
  211. }
  212. .blocking-modal a {
  213. color: #2ba9e1;
  214. font-weight: bold;
  215. text-decoration: none;
  216. }
  217. .blocking-modal a:hover {
  218. border-bottom: 1px dashed;
  219. color: #0988be;
  220. }
  221. .blocking-modal h2 {
  222. font-size: 28px;
  223. font-weight: normal;
  224. }
  225. .blocking-modal p {
  226. margin: 10px;
  227. font-size: 14px;
  228. line-height: 21px;
  229. }
  230. .blocking-modal img {
  231. width: 100px;
  232. height: 100px;
  233. }
  234. .blocking-modal .btn_main {
  235. position: relative;
  236. cursor: pointer;
  237. display: inline-block;
  238. background: #27ae60;
  239. color: white;
  240. text-transform: uppercase;
  241. text-decoration: none;
  242. padding: 20px 40px;
  243. font-size: 18px;
  244. text-shadow: 0 1px 2px rgba(0, 0, 0, 0.25);
  245. border-radius: 5px;
  246. -webkit-box-shadow: inset 0 -3px #14947b;
  247. box-shadow: inset 0 -3px #14947b;
  248. }
  249. .blocking-modal .btn_main:active {
  250. top: 1px;
  251. color: white;
  252. outline: none;
  253. -webkit-box-shadow: none;
  254. box-shadow: none;
  255. }
  256. .blocking-modal .btn_main:hover {
  257. background: #21A057;
  258. color: white;
  259. border: none;
  260. }
  261. .blocking-modal .small {
  262. font-size: 12px;
  263. color: #888888;
  264. }
  265. input[type='text'] {
  266. width: 272px;
  267. }
  268. .settings_updated {
  269. color: #fff;
  270. text-shadow: 0px 1px 1px rgba(0,0,0,0.4);
  271. font-size: 14px;
  272. background-color: #45a147 !important;
  273. border-color: #316632 !important;
  274. }
  275. .signuppromo{
  276. border: 1px solid #d8d8d8;
  277. border-radius: 6px;
  278. padding: 20px 20px;
  279. color: #45A147;
  280. font-size: 14px;
  281. float: right;
  282. margin: 25px 0 0 20px;
  283. min-width: 250px;
  284. }
  285. .signuppromo_note{
  286. font: 300 12px/20px "open sans","helvetica neue",helvetica,arial,sans-serif;
  287. color: #555;
  288. }
  289. .promoh1{
  290. font: 400 16px/22px "open sans","helvetica neue",helvetica,arial,sans-serif;
  291. margin: 0;
  292. padding: 0;
  293. }
  294. .promosub{
  295. color: black;
  296. margin: 10px 0 0 0;
  297. font-weight: bold;
  298. }
  299. div#shareaholic-form-container .signuppromo ul{
  300. margin: 24px 0px;
  301. }
  302. .signuppromo ul li{
  303. background: url(../img/bolt.png) 0 2px no-repeat;
  304. background-size: 22px 22px;
  305. color: #555;
  306. float: left;
  307. font: 400 13px/20px "open sans","helvetica neue",helvetica,arial,sans-serif;
  308. list-style: none;
  309. padding: 2px 0 2px 32px;
  310. margin: 0 0 18px 0;
  311. text-align: left;
  312. }
  313. .signuppromo a,.signuppromo a:active {
  314. -moz-box-shadow:inset 0px 1px 0px 0px #ffffff;
  315. -webkit-box-shadow:inset 0px 1px 0px 0px #ffffff;
  316. box-shadow:inset 0px 1px 0px 0px #ffffff;
  317. background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #ffffff), color-stop(1, #f6f6f6));
  318. background:-moz-linear-gradient(top, #ffffff 5%, #f6f6f6 100%);
  319. background:-webkit-linear-gradient(top, #ffffff 5%, #f6f6f6 100%);
  320. background:-o-linear-gradient(top, #ffffff 5%, #f6f6f6 100%);
  321. background:-ms-linear-gradient(top, #ffffff 5%, #f6f6f6 100%);
  322. background:linear-gradient(to bottom, #ffffff 5%, #f6f6f6 100%);
  323. filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#f6f6f6',GradientType=0);
  324. background-color:#ffffff;
  325. -moz-border-radius:6px;
  326. -webkit-border-radius:6px;
  327. border-radius:6px;
  328. width: 50%;
  329. border:1px solid #dcdcdc;
  330. text-align: center;
  331. margin: 0 auto;
  332. display:block;
  333. color:#666666;
  334. font-size:15px;
  335. font-weight:bold;
  336. padding:16px 24px;
  337. text-decoration:none;
  338. text-shadow:0px 1px 0px #ffffff;
  339. }
  340. .signuppromo a:hover {
  341. background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #f6f6f6), color-stop(1, #ffffff));
  342. background:-moz-linear-gradient(top, #f6f6f6 5%, #ffffff 100%);
  343. background:-webkit-linear-gradient(top, #f6f6f6 5%, #ffffff 100%);
  344. background:-o-linear-gradient(top, #f6f6f6 5%, #ffffff 100%);
  345. background:-ms-linear-gradient(top, #f6f6f6 5%, #ffffff 100%);
  346. background:linear-gradient(to bottom, #f6f6f6 5%, #ffffff 100%);
  347. filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#f6f6f6', endColorstr='#ffffff',GradientType=0);
  348. background-color:#f6f6f6;
  349. }
  350. div#shareaholic-form-container input[type="submit"].settings {
  351. -webkit-appearance: button;
  352. border: 1px solid #3F81AE;
  353. border-color: #3F81AE #2E68A1 #1F5496;
  354. border-radius: 4px;
  355. -webkit-box-shadow: inset 0 1px 0 0 #72baeb,0 1px 2px 0 #c3c3c3;
  356. box-shadow: inset 0 1px 0 0 #72baeb,0 1px 2px 0 #c3c3c3;
  357. color: #fff;
  358. display: inline-block;
  359. font: 600 13px/1 "open sans","helvetica neue",helvetica,arial,sans-serif;
  360. background-color: #52a8e8;
  361. background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #52a8e8), color-stop(100%, #377ad0));
  362. background-image: -webkit-linear-gradient(top, #52a8e8, #377ad0);
  363. background-image: -moz-linear-gradient(top, #52a8e8, #377ad0);
  364. background-image: -ms-linear-gradient(top, #52a8e8, #377ad0);
  365. background-image: -o-linear-gradient(top, #52a8e8, #377ad0);
  366. background-image: linear-gradient(top, #52a8e8, #377ad0);
  367. line-height: 17px;
  368. margin: 0;
  369. padding: 8px 14px;
  370. text-align: center;
  371. text-shadow: 0 -1px 1px #3275BB;
  372. -webkit-background-clip: padding-box;
  373. }
  374. div#shareaholic-form-container input[type="submit"]:hover.settings {
  375. -webkit-box-shadow: inset 0 1px 0 0 #6aadd9;
  376. box-shadow: inset 0 1px 0 0 #6aadd9;
  377. background-color: #4b9ad6;
  378. background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #4b9ad6), color-stop(100%, #326fbf));
  379. background-image: -webkit-linear-gradient(top, #4b9ad6, #326fbf);
  380. background-image: -moz-linear-gradient(top, #4b9ad6, #326fbf);
  381. background-image: -ms-linear-gradient(top, #4b9ad6, #326fbf);
  382. background-image: -o-linear-gradient(top, #4b9ad6, #326fbf);
  383. background-image: linear-gradient(top, #4b9ad6, #326fbf);
  384. }
  385. div#shareaholic-form-container input.btn_main {
  386. margin-bottom: 0;
  387. margin-right: 0;
  388. border: 0;
  389. }
  390. div #shareaholic-form-container .app label {
  391. display: inline;
  392. font-size: 12px;
  393. }
  394. div #shareaholic-form-container .nav li {
  395. list-style: none;
  396. }
  397. div #shareaholic-form-container ul.nav {
  398. border-bottom: 1px solid #ddd;
  399. margin: 0;
  400. }
  401. div #shareaholic-form-container fieldset.app legend img {
  402. width: 32px;
  403. height: 32px;
  404. }
  405. #shareaholic-form-container .key-status {
  406. padding: 0.4em 1em;
  407. color: #fff;
  408. text-align: center;
  409. -webkit-border-radius: 3px;
  410. border-radius: 3px;
  411. border-width: 1px;
  412. border-style: solid;
  413. text-shadow: 0px 1px 0px rgba(0,0,0,0.4);
  414. }
  415. #shareaholic-form-container .key-description {
  416. line-height: 1.6em;
  417. margin-top:10px;
  418. }
  419. #shareaholic-form-container .key-status.failed {
  420. background-color: #EB5353;
  421. border: 1px solid #e62525;
  422. }
  423. #shareaholic-form-container .key-status.passed {
  424. background-color: #45a147;
  425. border: 1px solid #1E8520;
  426. }
  427. .help_links{
  428. border: 1px solid #d8d8d8;
  429. border-radius: 6px;
  430. padding: 20px 20px;
  431. color: #45A147;
  432. font-size: 14px;
  433. float: right;
  434. margin: 25px 0 0 20px;
  435. width: 250px;
  436. }
  437. .help_links ul{
  438. margin: 0px 0px 0px 15px;
  439. list-style-type: square;
  440. }
  441. .help_links ul li{
  442. color: #555;
  443. float: left;
  444. font: 400 12px/18px "open sans","helvetica neue",helvetica,arial,sans-serif;
  445. margin: 0 0 4px 0;
  446. text-align: left;
  447. }
  448. i.icon.icon-share_buttons {
  449. background-position: 0 0px;
  450. width: 16px;
  451. height: 16px;
  452. }
  453. i.icon.icon-recommendations {
  454. background-position: 0 -16px;
  455. width: 16px;
  456. height: 16px;
  457. }
  458. i.icon.icon-affiliate {
  459. background-position: 0 -160px;
  460. width: 16px;
  461. height: 16px;
  462. }
  463. i.icon.icon-analytics {
  464. background-position: 0 -32px;
  465. width: 16px;
  466. height: 16px;
  467. }
  468. i.icon.icon-website {
  469. background-position: 0 -96px;
  470. width: 16px;
  471. height: 16px;
  472. }
  473. i.icon {
  474. vertical-align: middle;
  475. background-image: url(../img/shareaholic_com_sprite.png);
  476. background-position: 0 0;
  477. background-repeat: no-repeat;
  478. display: inline-block;
  479. position: relative;
  480. width: 16px;
  481. height: 16px;
  482. margin-right: 7px;
  483. }
  484. /* Header - Start */
  485. #shr-header-container {
  486. padding-bottom: 10px !important;
  487. }
  488. #shr-header {
  489. top: auto !important;
  490. position: inherit !important;
  491. box-shadow: 0 0 0px #c3c3c3 !important;
  492. }
  493. #shr-header .shr-header-content {
  494. max-width: unset !important;
  495. }
  496. #shr-header .shr-toplevel-link {
  497. border-right: none !important;
  498. border-left: none !important;
  499. }
  500. .shr-sites-container {
  501. z-index: 2147483647 !important;
  502. }
  503. /* Header - End */