1/* Core Stylesheet 2----------------------------------------------- */ 3@import url('//fonts.googleapis.com/css?family=Bitter'); 4 5/* === SOCIAL ICON FONT === */ 6 7@font-face { 8 font-family: 'FontAwesome'; 9 src: url('../fonts/fontawesome-webfont.eot?v=4.0.3'); 10 src: url('../fonts/fontawesome-webfont.eot?#iefix&v=4.0.3') format('embedded-opentype'), url('../fonts/fontawesome-webfont.woff?v=4.0.3') format('woff'), url('../fonts/fontawesome-webfont.ttf?v=4.0.3') format('truetype'), url('../fonts/fontawesome-webfont.svg?v=4.0.3#fontawesomeregular') format('svg'); 11 font-weight: normal; 12 font-style: normal; 13} 14 15@font-face { 16 font-family: "Glyphicons Halflings"; 17 src: url("../../lib/fonts/glyphicons-halflings-regular.eot"); 18 src: url("../../lib/fonts/glyphicons-halflings-regular.eot?#iefix") format("embedded-opentype"), url("../../lib/fonts/glyphicons-halflings-regular.woff") format("woff"), url("../../lib/fonts/glyphicons-halflings-regular.ttf") format("truetype"), url("../../lib/fonts/glyphicons-halflings-regular.svg#glyphicons-halflingsregular") format("svg"); 19 font-weight: normal; 20 font-style: normal; 21} 22 23/*Dropdown widget title*/ 24.screen-reader-text { 25 clip: rect(1px, 1px, 1px, 1px); 26 height: 1px; 27 overflow: hidden; 28 position: absolute; 29 width: 1px; 30} 31 32/* Container Full Width that everything is wrapped in */ 33.container-full-width { 34 width: 100%; 35} 36 37.container-full-width:before, .container-full-width:after { 38 display: table; 39 content: ""; 40 line-height: 0; 41} 42 43.container-full-width:after { 44 clear: both; 45} 46 47/* Text meant only for screen readers */ 48.assistive-text { 49 position: absolute !important; /* IE6, IE7 */ 50 clip: rect(1px 1px 1px 1px); 51 clip: rect(1px, 1px, 1px, 1px); 52} 53 54/* ie only */ 55/* fix for ie 8 and less nav dropdown menu not showing*/ 56.lte9 .nav-collapse.collapse { 57 overflow: visible; 58} 59 60/* CSS to make the video responsive starts */ 61.flex-video { 62 position: relative; 63 overflow: hidden; 64 margin-bottom: 16px; 65 padding-bottom: 60.5%; 66 height: 0; 67} 68 69.flex-video iframe, .flex-video object, .flex-video embed { 70 position: absolute; 71 top: 0; 72 left: 0; 73 width: 100%; 74 height: 100%; 75} 76 77/* CSS to make the video responsive ends */ 78/* CSS for the site title, after removing the hgroup tag */ 79.hgroup { 80 display: block; 81} 82 83/* === FOOTER === */ 84 85#after_footer .cc-credit-logo { 86 float: left; 87} 88 89#after_footer .cc-credit-text { 90 float: left; 91 margin-top: 5px; 92 margin-left: 5px; 93 color: #9b9c9b; 94 font-family: 'Bitter', serif; 95 margin-right: 10px; 96} 97 98#after_footer .cc-credit-text span { 99 color: #22699d; 100 font-weight: 200; 101} 102 103.market { 104 line-height:2.3; 105} 106 107 108/* === SOCIAL ICON FONT === */ 109 110#social { 111 float: right; 112} 113 114.symbol { 115 display: inline-block; 116 font-family: FontAwesome; 117 -webkit-font-smoothing: antialiased; 118 -moz-osx-font-smoothing: grayscale; 119 -webkit-text-rendering: optimizeLegibility; 120 -moz-text-rendering: optimizeLegibility; 121 -ms-text-rendering: optimizeLegibility; 122 -o-text-rendering: optimizeLegibility; 123 -ms-filter: "progid:DXImageTransform.Microsoft.text-rendering(optimizeLegibility)"; 124 -webkit-font-smoothing: antialiased; 125 -moz-font-smoothing: antialiased; 126 -ms-font-smoothing: antialiased; 127 -o-font-smoothing: antialiased; 128 -ms-filter: "progid:DXImageTransform.Microsoft.font-smoothing(antialiased)"; 129} 130 131a.symbol { 132 float: left; 133 margin: 0 6px 10px 0; 134 width: 38px; 135 height: 38px; 136 border: 1px solid #333333; 137 border-radius: 4px; 138 background: #444444; 139 color: white; 140 text-decoration: none; 141 text-shadow: 1px 1px 0 #111111; 142 font-weight: normal; 143 font-style: normal; 144 font-size: 26px; 145 line-height: 1.5; 146 text-align: center; 147} 148 149a.symbol.twitterbird:before { 150 content: "\f099"; 151} 152 153a.symbol.instagram:before { 154 content: "\f16d"; 155} 156 157a.symbol.facebook:before { 158 content: "\f09a"; 159} 160 161a.symbol.googleplus:before { 162 content: "\f0d5"; 163} 164 165a.symbol.flickr:before { 166 content: "\f16e"; 167} 168 169a.symbol.pinterest:before { 170 content: "\f0d2"; 171} 172 173a.symbol.linkedin:before { 174 content: "\f0e1"; 175} 176 177a.symbol.youtube:before { 178 content: "\f167"; 179} 180 181a.symbol.map:before { 182 content: "\f041"; 183} 184 185a.symbol.email:before { 186 content: "\f0e0"; 187} 188 189a.symbol.rss:before { 190 content: "\f09e"; 191} 192 193a.symbol:hover { 194 text-decoration: none; 195} 196 197.default-icons a.symbol { 198 border: 1px solid #cccccc; 199 border-radius: 4px; 200 background: #eeeeee; 201 background: -moz-linear-gradient(top, #eeeeee 0%, #cccccc 100%); 202 background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #eeeeee), color-stop(100%, #cccccc)); 203 background: -webkit-linear-gradient(top, #eeeeee 0%, #cccccc 100%); 204 background: -o-linear-gradient(top, #eeeeee 0%, #cccccc 100%); 205 background: -ms-linear-gradient(top, #eeeeee 0%, #cccccc 100%); 206 background: linear-gradient(to bottom, #eeeeee 0%, #cccccc 100%); 207 color: #555555; 208 text-shadow: 1px 1px 0 #ffffff; 209 -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#eeeeee, endColorstr=#cccccc)"; 210} 211 212.retina-icons a.symbol { 213 margin-right: 0; 214 border: none; 215 background: none; 216 color: #555555; 217 text-shadow: 2px 2px rgba(204, 204, 204, 0.5); 218 font-size: 3.5em; 219} 220 221.retina-icons a.symbol:hover { 222 background: #eeeeee; 223 color: #222222; 224} 225 226.legacy-icons a.symbol { 227 border: 1px solid #cccccc; 228 border-radius: 4px; 229 background: #eeeeee; 230 color: #ffffff; 231 text-shadow: 1px 1px rgba(85, 85, 85, 0.5); 232} 233 234.round-icons a.symbol { 235 border: 1px solid #cccccc; 236 border-radius: 50%; 237 background: #eeeeee; 238 color: #ffffff; 239 text-shadow: 1px 1px rgba(85, 85, 85, 0.5); 240} 241 242.round-icons a.symbol:hover, 243.legacy-icons a.symbol:hover { 244 opacity: .8; 245} 246 247.round-icons a.symbol.facebook, 248.legacy-icons a.symbol.facebook { 249 border: 1px solid #4d6595; 250 background: #556fa3; 251} 252 253.round-icons a.symbol.twitterbird, 254.legacy-icons a.symbol.twitterbird { 255 border: 1px solid #37bce9; 256 background: #4dc4ec; 257} 258 259.round-icons a.symbol.googleplus, 260.legacy-icons a.symbol.googleplus { 261 border: 1px solid #b43727; 262 background: #d34d3b; 263} 264 265.round-icons a.symbol.linkedin, 266.legacy-icons a.symbol.linkedin { 267 border: 1px solid #00659c; 268 background: #0072b1; 269} 270 271.round-icons a.symbol.youtube, 272.legacy-icons a.symbol.youtube { 273 border: 1px solid #9f271f; 274 background: #b42d24; 275} 276 277.round-icons a.symbol.map, 278.legacy-icons a.symbol.map { 279 border: 1px solid #74a82a; 280 background: #7fb72f; 281} 282 283.round-icons a.symbol.flickr, 284.legacy-icons a.symbol.flickr { 285 border: 1px solid #0756b7; 286 background: #0969dd; 287} 288 289.round-icons a.symbol.pinterest, 290.legacy-icons a.symbol.pinterest { 291 border: 1px solid #b81d1f; 292 background: #cd2123; 293} 294 295.round-icons a.symbol.email, 296.legacy-icons a.symbol.email { 297 border: 1px solid #3b65ab; 298 background: #4170bd; 299} 300 301.round-icons a.symbol.rss, 302.legacy-icons a.symbol.rss { 303 border: 1px solid #dc650e; 304 background: #f07013; 305} 306 307a.symbol:hover { 308 background: #cccccc; 309} 310 311/* FONT ICONS ===================*/ 312 313.postformats .glyphicon { 314 position: relative; 315 top: 1px; 316 display: inline-block; 317 margin-left: 10px; 318 color: #cccccc; 319 font-weight: normal; 320 font-style: normal; 321 font-size: 1.9em; 322 font-family: 'Glyphicons Halflings'; 323 line-height: 1; 324 -webkit-font-smoothing: antialiased; 325 -moz-osx-font-smoothing: grayscale; 326} 327 328.glyphicon:empty { 329 width: 1em; 330} 331 332.glyphicon-list-alt:before { 333 content: "\e032"; 334} 335 336.glyphicon-volume-up:before { 337 content: "\e038"; 338} 339 340.glyphicon-comment:before { 341 content: "\e111"; 342} 343 344.glyphicon-file:before { 345 content: "\e022"; 346} 347 348.glyphicon-film:before { 349 content: "\e009"; 350} 351 352.glyphicon-picture:before { 353 content: "\e060"; 354} 355 356.glyphicon-link:before { 357 content: "\e144"; 358} 359 360.glyphicon-share:before { 361 content: "\e066"; 362} 363 364.glyphicon-th:before { 365 content: "\e011"; 366} 367 368.glyphicon-facetime-video:before { 369 content: "\e059"; 370} 371 372.glyphicon-arrow-right:before { 373 content: "\e092"; 374} 375 376/*==================Google maps element ===================*/ 377.google-maps-iframe iframe 378{ 379 max-width:100%; 380} 381/*==================Separator element ====================*/ 382#separator_section 383{ 384 margin-top: 0.5em; 385 margin-bottom: 0.5em; 386} 387 388/*=================Sticky Header ====================*/ 389.sticky-header 390{ 391 position: fixed; 392 top: 0; 393 left: 0px; 394 z-index: 200; 395 width: 100%; 396 background-color:#000; 397 margin: 0 !important; 398 opacity:0.75; 399 box-shadow: 0px 3px 10px 1px rgba(0, 0, 0, 0.9); 400 -webkit-box-shadow: 0px 3px 10px 1px rgba(0, 0, 0, 0.9); 401 -moz-box-shadow: 0px 3px 10px 1px rgba(0, 0, 0, 0.9); 402 -webkit-transition: all 0.8s ease-in-out 0s; 403 -moz-transition: all 0.8s ease-in-out 0s; 404 -o-transition: all 0.8s ease-in-out 0s; 405 transition: all 0.8s ease-in-out 0s; 406} 407.admin-bar .sticky-header 408{ 409 top:46px; 410} 411/*==================Testimonial element ====================*/ 412#testimonial_section .container 413{ 414 max-width:100%; 415} 416#testimonial_img 417{ 418 background: url("../images/icons/testimonial.png") no-repeat; 419 float:right; 420 display:inline-block; 421 height: 1.6em; 422 width: 1.55em; 423} 424 425 426/* Author Bio */ 427.cyberchimps_author_bio 428{ 429 margin-top: 2%; 430} 431.author_bio_wrapper { 432 border: 1px solid #cfcfcf; 433 display: inline-block; 434 padding: 2% 0; 435} 436.author_bio_name a 437{ 438 font-size: 25px; 439} 440.avatar_author img 441{ 442 background: #fff none repeat scroll 0 0; 443 border-radius: 50%; 444 box-shadow: 0 5px 10px 0 #e4e4e4; 445 height: 90px; 446 padding: 5px; 447 width: 90px; 448} 449