/** ************************************* ** @Author Dorin Grigoras @Website www.stepofweb.com @Last Update 11:47 AM Friday, September 26, 2014 TABLE CONTENTS --------------------------- 01. Resets 02. Placeholder 03. Selection 04. JS Animation 05. Commons 06. Bootstrap Rewrite 07. Pure CSS Animations 06. Callouts 07. Headings 08. Paragraphs 09. Drop Caps & Cite 10. Blockquote 11. Progress Bar 12. Buttons 13. Labels 14. Alerts 15. Pagination 16. Parallax 17. Isotope 18. Dividers 19. Forms 20. Count To [number] 21. Tabs 22. Accordion 23. Toggle 24. Featured Box & Featured Icons 25. Image Thumbnail 26. Modal 27. Carousel 28. Breadcrumbs 29. Nav List (aside) 30. Price Table 31. Animation 32. Dropcap 33. Masonry 34. Media Elements 35. Testimonials 36. Background Patterns 37. Ion.RangeSlider [1.9.2] 38. Datepicker 39. Summernote [HTML EDITOR] 40. Markdown [HTML EDITOR] 41. CKEditor [HTML EDITOR] 42. Colors --. Printable Div --------------------------- ** ************************************* **/ /** 01. Resets *************************************************** **/ button::-moz-focus-inner, input::-moz-focus-inner { border: 0; padding: 0; } button { background: none; border: 0; margin: 0; padding: 0; cursor: pointer; } img { border: 0; vertical-align: top; } input:-webkit-autofill { color: #ffffff !important; } textarea { resize: none; } textarea, input, button, *:focus { outline:none !important; } textarea { resize: vertical; } select { border: 2px solid #E5E7E9; border-radius: 6px; height: 46px; padding: 12px; outline: none; } .radio input[type=radio], .radio-inline input[type=radio], .checkbox input[type=checkbox], .checkbox-inline input[type=checkbox], input[type="radio"], input[type="checkbox"], .form-inline .radio input[type=radio], .form-inline .checkbox input[type=checkbox] { display:inline-block; cursor:pointer; width:15px; height:15px; border:0; } .form-horizontal .checkbox input[type="radio"], .form-horizontal .checkbox input[type="checkbox"] { margin-top:3px; } iframe, fieldset { border: 0; margin: 0; padding: 0; } audio, canvas, img, video { vertical-align: middle; } p { display: block; -webkit-margin-before: 1em; -webkit-margin-after: 1em; -webkit-margin-start: 0px; -webkit-margin-end: 0px; } a, a:focus, a:hover, a:active { outline: 0; cursor:pointer; } .btn-primary .glyphicon, .btn-danger .glyphicon, .btn-info .glyphicon, .btn-warning .glyphicon, .btn-primary .wi, .btn-danger .wi, .btn-info .wi, .btn-warning .wi { color:#fff; } /** 02. Placeholder *************************************************** **/ ::-webkit-input-placeholder { /* WebKit browsers */ color: #999; } :-moz-placeholder { /* Mozilla Firefox 4 to 18 */ color: #999; } ::-moz-placeholder { /* Mozilla Firefox 19+ */ color: #999; } :-ms-input-placeholder { /* Internet Explorer 10+ */ color: #999; } /** 03. Selection *************************************************** **/ ::selection { color:#000; background:#ccc; text-shadow:none; } ::-moz-selection { color:#000; background:#ccc; text-shadow:none; } /** 04. JS Animation *************************************************** **/ .animate_from_bottom { opacity: 0; bottom: -50px; padding-left: 0px; position: relative; } .animate_from_left { opacity: 0; left: -80px; padding-right: 0px; position: relative; } .animate_from_right { opacity: 0; right: -80px; padding-left: 0px; position: relative; } .animate_fade_in { opacity: 0; right: 0px; position: relative; padding-left: 0px; } /** 05. Commons **************************************************************** **/ pre { color: #666; padding: 16px; font-size: 12px; line-height: 16px; padding-bottom: 15px; font-family: 'Open Sans', sans-serif; background: url('data:image/png;base64,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') repeat; border:#ccc 2px solid; box-shadow:#ccc 0 0 6px; -webkit-border-radius: 0; -moz-border-radius: 0; border-radius: 0; } .fsize11 { font-size:11px !important; line-height:15px !important; } .fsize12 { font-size:12px !important; line-height:16px !important; } .fsize13 { font-size:13px !important; line-height:17px !important; } .fsize14 { font-size:14px !important; line-height:18px !important; } .fsize15 { font-size:15px !important; line-height:19px !important; } .fsize16 { font-size:16px !important; line-height:20px !important; } .fsize17 { font-size:17px !important; line-height:23px !important; } .fsize18 { font-size:18px !important; line-height:24px !important; } .fsize19 { font-size:19px !important; line-height:25px !important; } .fsize20 { font-size:20px !important; line-height:26px !important; } .fsize26 { font-size:26px !important; line-height:30px !important; } .fsize30 { font-size:30px !important; line-height:36px !important; } .fsize40 { font-size:40px !important; line-height:46px !important; } .font300 { font-weight:300 !important; } .font500 { font-weight:500 !important; } .font400 { font-weight:400 !important; } .font600 { font-weight:600 !important; } .font700 { font-weight:700 !important; } .font800 { font-weight:800 !important; } .w10 { width:10px; } .w20 { width:20px; } .w30 { width:30px; } .w40 { width:40px; } .w50 { width:50px; } .w100 { width:100px; } .w150 { width:150px; } .w200 { width:200px; } .w250 { width:250px; } .w300 { width:300px; } .w350 { width:350px; } .w400 { width:400px; } .w450 { width:450px; } .w500 { width:500px; } .h10 { height:10px; } .h20 { height:20px; } .h30 { height:30px; } .h40 { height:40px; } .h50 { height:50px; } .h100 { height:100px; } .h150 { height:150px; } .h200 { height:200px; } .h250 { height:250px; } .h300 { height:300px; } .h350 { height:350px; } .h400 { height:400px; } .h450 { height:450px; } .h500 { height:500px; } .padding3 { padding:3px !important; } .padding6 { padding:6px !important; } .padding8 { padding:8px !important; } .padding10 { padding:10px !important; } .padding15 { padding:15px !important; } .padding20 { padding:20px !important; } .padding30 { padding:30px !important; } .padding40 { padding:40px !important; } .padding50 { padding:50px !important; } .padding60 { padding:60px !important; } .padding70 { padding:70px !important; } .padding80 { padding:80px !important; } .padding90 { padding:90px !important; } .padding100 { padding:100px !important; } .padding-top10 { padding-top:10px; } .padding-top20 { padding-top:20px; } .padding-top30 { padding-top:30px; } .padding-top40 { padding-top:40px; } .padding-top50 { padding-top:50px; } .padding-top60 { padding-top:60px; } .padding-top80 { padding-top:80px; } .padding-top100 { padding-top:100px; } .padding-top130 { padding-top:130px; } .padding-top150 { padding-top:150px; } .padding-top180 { padding-top:180px; } .padding-top200 { padding-top:200px; } .margin-top3 { margin-top:3px; } .margin-top6 { margin-top:6px; } .margin-top8 { margin-top:8px; } .margin-top10 { margin-top:10px; } .margin-top20 { margin-top:20px; } .margin-top30 { margin-top:30px; } .margin-top40 { margin-top:40px; } .margin-top50 { margin-top:50px; } .margin-top60 { margin-top:60px; } .margin-top80 { margin-top:80px; } .margin-top100 { margin-top:100px; } .margin-top130 { margin-top:130px; } .margin-top150 { margin-top:150px; } .margin-top180 { margin-top:180px; } .margin-top200 { margin-top:200px; } .margin-bottom3 { margin-bottom:3px; } .margin-bottom6 { margin-bottom:6px; } .margin-bottom8 { margin-bottom:8px; } .margin-bottom10 { margin-bottom:10px; } .margin-bottom20 { margin-bottom:20px; } .margin-bottom30 { margin-bottom:30px; } .margin-bottom40 { margin-bottom:40px; } .margin-bottom50 { margin-bottom:50px; } .margin-bottom60 { margin-bottom:60px; } .margin-bottom80 { margin-bottom:80px; } .margin-bottom100 { margin-bottom:100px; } .margin-bottom130 { margin-bottom:130px; } .margin-bottom150 { margin-bottom:150px; } .margin-bottom180 { margin-bottom:180px; } .margin-bottom200 { margin-bottom:200px; } .radius3 { -webkit-border-radius: 3px !important; -moz-border-radius: 3px !important; border-radius: 3px !important; } .radius6 { -webkit-border-radius: 6px !important; -moz-border-radius: 6px !important; border-radius: 6px !important; } .radius8 { -webkit-border-radius: 8px !important; -moz-border-radius: 8px !important; border-radius: 8px !important; } .img-responsive { display:inline-block; } .fixed { position:fixed !important; } .relative { position:relative !important; } .nopadding { padding:0 !important; } .nopadding-left { padding-left:0 !important; } .nopadding-right { padding-right:0 !important; } .nopadding-top { padding-top:0 !important; } .nopadding-bottom { padding-bottom:0 !important; } .nomargin { margin:0 !important; } .nomargin-left { margin-left:0 !important; } .nomargin-right { margin-right:0 !important; } .nomargin-top { margin-top:0 !important; } .nomargin-bottom { margin-bottom:0 !important; } .noborder { border:0 !important; } .noradius { -webkit-border-radius:0 !important; -moz-border-radius:0 !important; border-radius:0 !important; } .absolute { position:absolute !important; } .lowercase { text-transform:lowercase; } .uppercase { text-transform:uppercase; } .no-text-transform { text-transform:none !important; } .italic { font-style:italic; } .pointer { cursor:pointer; } .block { display:block !important; } .bold { font-weight:bold !important; } .fullwidth { width:100% !important; max-width:100% !important; } .halfwidth { width:50% !important; } .container { position:relative; } i.fa { text-decoration:none !important;} .justify { text-align:justify; } .btn i.fa { padding-right:10px; } .btn-margin-top { margin-top:30px; } .text-underline { text-decoration:underline; } .nowrap { white-space: nowrap !important; } .wrap { white-space: normal !important; } .transparent { background:transparent !important;} .color-white { color:#fff !important; } .color-black { color:#000 !important; } .line-through { text-decoration:line-through; } .transparent { background-color:transparent; } img.pull-left { margin:0 20px 10px 0; } img.pull-right { margin:0 10px 20px 0; } .hide { display:none; } .nofloat { float:none !important; } .default-gradient { background-image: -webkit-gradient(linear,left top,right bottom,color-stop(0.25,rgba(0,0,0,.03)),color-stop(0.25,transparent),color-stop(0.5,transparent),color-stop(0.5,rgba(0,0,0,.03)),color-stop(0.75,rgba(0,0,0,.03)),color-stop(0.75,transparent),to(transparent)); background-image: -webkit-linear-gradient(135deg,rgba(0,0,0,.03)25%,transparent 25%,transparent 50%,rgba(0,0,0,.03)50%,rgba(0,0,0,.03)75%,transparent 75%,transparent); background-image: -moz-linear-gradient(135deg,rgba(0,0,0,.03)25%,transparent 25%,transparent 50%,rgba(0,0,0,.03)50%,rgba(0,0,0,.03)75%,transparent 75%,transparent); background-image: -ms-linear-gradient(135deg,rgba(0,0,0,.03)25%,transparent 25%,transparent 50%,rgba(0,0,0,.03)50%,rgba(0,0,0,.03)75%,transparent 75%,transparent); background-image: -o-linear-gradient(135deg,rgba(0,0,0,.03)25%,transparent 25%,transparent 50%,rgba(0,0,0,.03)50%,rgba(0,0,0,.03)75%,transparent 75%,transparent); background-image: linear-gradient(135deg,rgba(0,0,0,.03)25%,transparent 25%,transparent 50%,rgba(0,0,0,.03)50%,rgba(0,0,0,.03)75%,transparent 75%,transparent); background-color: #FAFCFD; background-size: 18px 18px; } @media only screen and (max-width: 768px) { .mobile-nopadding { padding:0 !important; } .mobile-nopadding-left { padding-left:0 !important; } .mobile-nopadding-right { padding-right:0 !important; } .mobile-nopadding-top { padding-top:0 !important; } .mobile-nopadding-bottom { padding-bottom:0 !important; } .mobile-nofloat { float:none !important; } } .elipsis { width:100%; text-overflow:ellipsis; white-space: nowrap; } .cover { width: 100%; position:relative; background-repeat: no-repeat; background-position: 50% 50%; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; } .hover-scale { -webkit-transition: all 0.2s; -moz-transition: all 0.2s; -o-transition: all 0.2s; transition: all 0.2s; } .hover-scale:hover { -webkit-transform:scale(1.1); -moz-transform:scale(1.1); -o-transform:scale(1.1); transform:scale(1.1); } .label, .nav-pills>li a, .thumbnail, textarea.form-control, select.form-control, input.form-control, .dropdown-menu { -webkit-border-radius: 0; -moz-border-radius: 0; border-radius: 0; } form .input-group-btn .btn i.fa { padding-right:0; } form.input-group { padding:0; } .label a, .label a:hover, a.label, a.label:hover { color:#fff; } label.disabled { color:#888 !important; } /* social icons */ a.social { display:inline-block; width:38px; height:38px; line-height:38px; font-size:18px; text-align:center; background:rgba(0,0,0,0.3); color:#fff; margin:10px 1px; text-decoration:none; -webkit-transition: all 0.2s; -moz-transition: all 0.2s; -o-transition: all 0.2s; transition: all 0.2s; } a.social.fa-twitter:hover { background:#41b7d8!important; color:#fff!important; } a.social.fa-facebook:hover { background:#3b5997!important; color:#fff!important; } a.social.fa-google-plus:hover { background:#d64937!important; color:#fff!important; } a.social.fa-linkedin:hover { background:#0073b2!important; color:#fff!important; } a.social.fa-vimeo-square:hover { background:#388fc5!important; color:#fff!important; } a.social.fa-youtube-square:hover { background:#A40F09!important; color:#fff!important; } a.social.fa-flickr:hover { background:#ff0084!important; color:#fff!important; } a.social.fa-pinterest:hover { background:#cb2027!important; color:#fff!important; } a.social.fa-skype:hover { background:#00aff0!important; color:#fff!important; } a.social.fa-rss:hover { background:#e0812a!important; color:#fff!important; } a.social.default:hover { background:#37353A!important; color:#fff!important; } a.social.rounded { width:38px; height:38px; line-height:38px; } /* page header */ h2.page-header, h2.page-header a, h3.page-header, h3.page-header a { color:#ccc; } /* overlay */ .overlay { background:rgba(0,0,0, 0.2); position:absolute; left:0; right:0; top:0; bottom:0; -webkit-transition: all 1s; -moz-transition: all 1s; -o-transition: all 1s; transition: all 1s; } .overlay.gray { background:rgba(33,33,33,0.9) !important; } /* image rounded */ .rounded { -webkit-border-radius: 50%; -moz-border-radius: 50%; border-radius: 50%; } /* paddings , margins */ section.margin { margin:60px 0; } section.margin-top { margin-top:60px; } section.margin-bottom { margin-bottom:60px; } section.paddings { padding:60px 0; } .styleBackground h1, .styleBackground h2, .styleBackground h3, .styleBackground h4, .styleBackground h5, .styleBackground h6, .styleBackground p, .styleBackground .btn { color:#fff; } /* star rating */ ul.star-rated { margin-bottom:0; } ul.star-rated, ul.list-style-none { clear:both; display:inline-block; margin:; padding:0; list-style:none; } ul.star-rated li { float:left; padding:0 2px; } ul.star-rated.pointer li { cursor:pointer; } /* list icon */ ul.list-icon { margin:0 0 10px 25px; padding:0; } ul.list-icon li { list-style:none; } ul.list-icon li:before { display: inline-block; height: 18px; width: 18px; line-height:18px; font-family: FontAwesome; content: ' '; float: left; margin:3px 0 0 -25px; font-style: normal; font-weight: normal; text-decoration: inherit; text-align: center; -webkit-border-radius: 18px; -moz-border-radius: 18px; border-radius: 18px; } ul.list-icon.circle li:before { color:#fff; background-color:#333; } /* star */ ul.list-icon.star li:before { content:'\f005'; } ul.list-icon.star-o li:before { content:'\f006'; } /* check */ ul.list-icon.check li:before { content:'\f00c'; } ul.list-icon li.check:before { content:'\f00c'; } ul.list-icon.check-square li:before { content:'\f14a'; } ul.list-icon li.check-square:before { content:'\f14a'; } ul.list-icon.check-circle li:before { content:'\f058'; } ul.list-icon li.check-circle:before { content:'\f058'; } /* misc */ ul.list-icon.times li:before { content:'\f00d'; } ul.list-icon li.times:before { content:'\f00d'; } ul.list-icon li.x:before { content:'\f00d'; color:#ccc; } ul.list-icon.ban li:before { content:'\f05e'; } ul.list-icon.dot-circle li:before { content:'\f192'; } ul.list-icon.exclamation-circle li:before { content:'\f06a'; } ul.list-icon.icon-circle li:before { content:'\f05a'; } ul.list-icon.heart-o li:before { content:'\f08a'; } ul.list-icon.heart li:before { content:'\f004'; } ul.list-icon.angle-right li:before { content:'\f105'; } ul.list-icon.spaced li { padding-top:4px; padding-bottom:4px; } .form-bordered .form-group > label { padding: 10px 15px; } .form-bordered .form-group { margin: 0; border-bottom: 1px solid #ededed !important; } .form-bordered .form-group > div { padding: 15px; border-left: 1px solid #efefef; } /** 06. Callouts * Not quite alerts, but custom and helpful notes for folks reading the docs. **************************************************************** **/ .bs-callout { clear:both; position:relative; overflow:hidden; background:#d5dce3; margin:0px 0; padding:36px 0; -webkit-border-radius: 0; -moz-border-radius: 0; border-radius: 0; } .bs-callout.whiteBg { background:#fff !important; } .bs-callout h1, .bs-callout h2, .bs-callout h3 { margin:0; text-transform:none; line-height:30px; font-weight:400; } .bs-callout.margin-top { margin:60px 0 0 0; } .bs-callout.margin-bottom { margin:0 0 60px 0; } .bs-callout.margin-footer { margin:0 0 -60px 0; } .bs-callout.styleBackground { padding:50px 0; } .bs-callout .btn { margin:0 20px; } .callout .row { margin-left: 0; margin-right: 0; } .callout .container .row { margin-left: -15px; margin-right: -15px; } .alert .btn { margin-top:4px; } /* alert callouts */ .alert.callout { padding:15px; } .alert.callout h4 { margin-bottom:3px; } .alert.callout .btn { margin-top:4px; } .alert.callout .row>div { padding:0; } /** 07. Headings **************************************************************** **/ h1, h2, h3, h4, h5, h6 { margin:0; color:#000; font-family:'Open Sans'; font-weight:300; letter-spacing:-1px; } h1 { font-size: 3em; line-height: 44px; margin: 0 0 44px 0; } h2 { font-size: 2.2em; line-height: 42px; margin: 0 0 32px 0; } h3 { font-size: 1.8em; letter-spacing: normal; line-height: 24px; margin: 0 0 32px 0; } h4 { font-size: 1.4em; letter-spacing: normal; line-height: 27px; margin: 0 0 14px 0; } h5 { font-size: 1em; letter-spacing: normal; line-height: 18px; margin: 0 0 14px 0; } h6 { font-size: 1em; letter-spacing: normal; line-height: 18px; margin: 0 0 14px 0; } h1 span.subtitle, h2 span.subtitle, h3 span.subtitle { display:block; font-size:15px; padding:0; margin:-10px 0 0 0; } /** 08. Paragraphs **************************************************************** **/ p { line-height: 22px; margin: 0 0 20px; } p.featured { font-size: 1.6em; line-height: 1.5em; font-weight:200; } /** 09. Drop Caps & Cite **************************************************************** **/ p.drop-caps:first-child:first-letter { float: left; font-size: 75px; line-height: 60px; padding: 4px; margin-right: 5px; margin-top: 5px; font-family: Georgia; } p.drop-caps.secundary:first-child:first-letter { background-color: #CCC; color: #FFF; padding: 6px; margin-right: 5px; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; } cite:after { content: '\00A0 \2014'; } cite:before { content: '\2014 \00A0'; } /** 10. Blockquote **************************************************************** **/ blockquote { border-left: 5px solid #CCC; font-size: 1.3em; font-style: normal; letter-spacing: -1px; margin: 25px 0 25px 12px; padding: 0 0 0 25px; position: relative; } blockquote p { margin:0; padding:0; } blockquote cite { display: block; font-size: 0.75em; color: #9CA6B4; } /** 11. Progress Bar **************************************************************** **/ .progress { overflow:visible; background:#FAFAFA; position:relative; -webkit-border-radius: 0; -moz-border-radius: 0; border-radius: 0; } .progress.slim { height:3px; } .progress.thin { height:6px; } .progress-bar { position: relative; -webkit-box-shadow: none; -moz-box-shadow: none; box-shadow: none; -webkit-border-radius: 0; -moz-border-radius: 0; border-radius: 0; } span.progress-bar-tooltip { padding: 4px 8px; background-color: #2E363F; color: #FFF; line-height: 15px; font-size: 11px; display: block; position: absolute; top: -28px; right: 5px; -o-border-radius: 3px; filter: alpha(opacity=0); opacity: 0; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; } span.progress-bar-tooltip:after { border-color:#2E363F transparent; border-style:solid; border-width:5px 5px 0; bottom: -5px; content: ""; display: block; left: 13px; position: absolute; width: 0; } h6.progress-head { margin-bottom:2px; } /* Circular Bar */ div.circular-bar { margin:30px 0; text-align:center; display:inline-block; height:200px; width:200px; position:relative; } div.circular-bar strong { display: block; font-size: 17px; font-weight: 600; line-height: 30px; } div.circular-bar label { display: block; font-size: 16px; font-weight: 300; } div.circular-bar-content { position:absolute; top:50%; left:0; right:0; margin-top:-20px; text-align:center; } div.circular-bar canvas { margin:0; vertical-align:top; z-index:0; margin-left:-100px; width:200px; height:200px; } @media only screen and (max-width: 600px) { div.circular-bar , div.circular-bar canvas { width:130px; height:130px; content:' '; clear:both; } div.circular-bar canvas { margin-left:-0; margin-top:-70px; } div.circular-bar strong { font-weight:400; font-size:14px; line-height:25px; } div.circular-bar-content { margin-top:-30px; } } /** 12. Buttons **************************************************************** **/ .btn, .btn:hover { border: 0; padding: 8px 18px; margin-bottom:3px; border:rgba(255,255,255,0) 1px solid; -webkit-transition: all 0.2s; -moz-transition: all 0.2s; -o-transition: all 0.2s; transition: all 0.2s; } .btn.notransition { -webkit-transition: all 0s; -moz-transition: all 0s; -o-transition: all 0s; transition: all 0s; } .btn:active, .btn:focus, .btn.active { -webkit-box-shadow: none; -moz-box-shadow: none; box-shadow: none; } .btn.disabled { background-color: #999; border: #bbb 1px solid; } .btn-default, .btn-default:hover, .btn-default.active { background:transparent; border:rgba(0,0,0,0.2) 1px solid; padding:8px 18px; } .btn-default:hover, .btn-default.active { background:rgba(0,0,0,0.04); } .btn-white:hover, .btn-white { color:#333 !important; background-color:rgba(255,255,255,0.8); } .btn-white:hover { background-color:#fff; } .btn[disabled] { background-color:rgba(0,0,0,0.4); border:rgba(0,0,0,0) 1px solid; } .btn-link[disabled] { background-color:transparent; border:0; } .btn-default[disabled] { background-color:transparent; border:rgba(0,0,0,0.2) 1px solid; } .btn-lg,.btn-lg:hover { padding: 12px 32px; } .btn-sm, .btn-sm:hover { padding: 6px 16px; } .btn-xs, .btn-xs:hover { padding: 3px 13px; } .btn.pull-right { margin-left:20px; } .btn-lg, .btn-group-lg>.btn { padding: 10px 16px !important; } .btn-sm, .btn-group-sm>.btn { padding: 5px 10px !important; } .btn-xs, .btn-group-xs>.btn { padding: 1px 5px !important; } .btn-lg, .btn-group-lg>.btn { padding: 10px 16px !important; } .btn-sm, .btn-group-sm>.btn { padding: 5px 10px !important; } .btn-group, .btn-toolbar { margin-bottom:10px; } /* custom buttons */ .btn-facebook { color:#fff!important; background-color:#4863ae; } .btn-facebook:hover { background-color:#445fa4; } .btn-twitter { color:#fff!important; background-color:#46c0fb; } .btn-twitter:hover { background-color:#33bafb; } .btn-google-plus { color:#fff!important; background:#d64937; } .btn-google-plus:hover { background:#d1412c; } .btn-youtube { color:#fff!important; background:#ff0000; } .btn-youtube:hover { background:#e80000; } .btn-vimeo { color:#fff!important; background:#00a2cd; } .btn-vimeo:hover { background:#0093b7; } .btn-android { color:#fff!important; background:#a4c639; } .btn-android:hover { background:#97b834; } .btn-linkedin { color:#fff!important; background:#0083bb; } .btn-linkedin:hover { background-color: #0076a8; } .btn-pinterest { color:#fff!important; background:#c91618; }