/* Theme Name: Project Risk Manager Author: Rude Goose Author URI: http://www.rudegoose.com Template: tiny-framework Version:2.6 */ /* Notes -------------------------------------------------------------- This stylesheet uses rem values with a pixel fallback. The rem values (and line heights) are calculated using two variables: $rembase: 16; $line-height: 24; We use rem for: font-size, margin, padding, width, max-width when using in px. For easy calculation you may use this tool, set "Choose your font-size (px)" to 16: @link https://offroadcode.com/prototypes/rem-calculator/ ---------- Examples padding: 5px 0; padding: 0.3125rem 0; (5 / $rembase) * Set a font-size and then set a line-height based on the font-size: font-size: 16px font-size: 1rem; (16 / $rembase) line-height: 1.5; ($line-height / 16) ---------- Vertical spacing Vertical spacing between most elements should use 24px or 48px to maintain vertical rhythm: .my-new-div { margin: 24px 0; margin: 1.5rem 0; ( 24 / $rembase ) } ---------- Further reading http://snook.ca/archives/html_and_css/font-size-with-rem http://blog.typekit.com/2011/11/09/type-study-sizing-the-legible-letter/ To calculate golden ratio for font size and line height you will need these tools: http://www.pearsonified.com/typography/ http://cssleading.com Sizes in rem units for quick reference: 1px: 0.0625rem 2px: 0.125rem 3px: 0.1875rem 4px: 0.25rem 5px: 0.3125rem 6px: 0.375rem 7px: 0.4375rem 8px: 0.5rem 9px: 0.5625rem 10px: 0.625rem 11px: 0.6875rem 12px: 0.75rem 13px: 0.8125rem 14px: 0.875rem 15px: 0.9375rem 16px: 1rem 17px: 1.0625rem 18px: 1.125rem 19px: 1.1875rem 20px: 1.25rem 21px: 1.3125rem 22px: 1.375rem 23px: 1.4375rem 24px: 1.5rem 25px: 1.5625rem 26px: 1.625rem 27px: 1.6875rem 28px: 1.75rem 29px: 1.8125rem 30px: 1.875rem 31px: 1.9375rem 32px: 2rem 33px: 2.0625rem 34px: 2.125rem 35px: 2.1875rem 36px: 2.25rem 37px: 2.3125rem 38px: 2.375rem 39px: 2.4375rem 40px: 2.5rem 41px: 2.5625rem 42px: 2.625rem 43px: 2.6875rem 44px: 2.75rem 45px: 2.8125rem 46px: 2.875rem 47px: 2.9375rem 48px: 3rem */ /* Accessibility: Colors * All major background and text colors are recorded here. * Border and shadow colors are defined using rgba values. * Color contrast must meet a minimum of 4.5:1 luminosity ratio, or 3:1 for text rendered larger than 18pt/14pt bold * * For links: * A 4.5:1 contrast between the link text color and the background. * A 3:1 contrast between the link text color and the surrounding non-link text color. * More info at: http://webaim.org/blog/wcag-2-0-and-link-colors/ */ /* Site colors Green for icon-font: #6ba420 Green for blockquote: #6ba420 Orange for widget titles and hover link state: #ff6111 Body text color: #222 Content links: Link: #0066df Visited: #800080 Hover, active: #dd3811 Headings: #333 Entry title: In mobile view: #333 Link, visited: #000 Hover, active: #ff6111 Meta, comment links: Link, visited: #555 Hover, active: #dd3811 Sidebar and footer links: Link, visited: #555 Hover, active: #dd3811 Current and parent categories: #dd3811 */ /* Table of Contents: * * 1.0 - Normalize * 2.0 - Typography * 3.0 - Elements * 3.1 - FontAwesome webfont * 4.0 - Forms * 4.1 - General styles first * 4.2 - Buttons * 4.3 - Twitter Bootstrap style button * 5.0 - Navigation * 5.1 - Links * 5.2 - Menus * 5.3 - Post, archive navigation * 6.0 - Accessibility * 7.0 - Alignments * 8.0 - Clearings * 9.0 - Widgets * 9.1 - General widget styles * 9.2 - Specific widget styles * 9.3 - Footer widget styles * 10.0 - Header * 10.1 - Site Header * 11.0 - Content * 11.1 - Posts and pages * 11.2 - Post Formats * 11.3 - Comments * 11.4 - Page templates * 12.0 - Footer * 13.0 - Media * 13.1 - Images * 13.2 - Captions * 13.3 - Galleries * 14.0 - Other styles * 14.1 - Twitter Bootstrap style alerts * 14.2 - Misc. styles * 15.0 - Media queries * 15.1 - Minimum width of 783 pixels (small screens - mobile phones, small tablets in portrait view mode) * 15.2 - Minimum width of 1100 pixels (average size screens - monitors, small tablets in landscape view mode, larger tablets) * 15.3 - Minimum width of 1240 pixels (big screens - widescreen monitors, high resolution tablets) * 15.4 - Retina-specific styles. This style cannot be processed by LESS * 16.0 - Print * 16.1 - Comments * * ---------------------------------------------------------------------------- */ @import url('genericons/genericons.css'); /* 1.0 Normalize -------------------------------------------------------------- */ /* 2.0 Typography -------------------------------------------------------------- */ /* Tip37 - automatically style author's name in a blockquote. Author's name should be enclosed in . * * The symbol list for content: @link http://www.w3schools.com/charsets/ref_utf_punctuation.asp */ blockquote cite:before { content: "\2012\00a0"; } h1{margin-bottom:20px;} /* 3.0 Elements -------------------------------------------------------------- */ /* 3.1 FontAwesome webfont */ /* Tip21 - Icon webfont support implementation and examples * * All icon webfont related styles (except for Tip21 and Tip05) are in this section so it would be easy to change them * in case of migration to another icon webfont. */ /* These are general styles that should be aplied for all elements that are using webfont icons, you do not need to change anything here. * You can add here all your elements that will use webfont icons. */ /* .your-custom-element-1:before, .your-custom-element-2:after { -moz-osx-font-smoothing: grayscale; -webkit-font-smoothing: antialiased; display: inline-block; font-family: FontAwesome; font-size: 14px; font-size: 0.875rem; font-style: normal; font-weight: normal; font-variant: normal; line-height: 1; speak: none; text-rendering: auto; text-align: center; text-decoration: inherit; text-transform: none; } */ /* Once element got general webfont icon styles, next you can style it to your needs */ /* .your-custom-element-1:before { content: "\f007"; font-size: 28px; font-size: 1.75rem; padding-right: 10px; padding-right: 0.625rem; vertical-align: middle; } .your-custom-element-2:after { content: "\f007"; font-size: 28px; font-size: 1.75rem; padding-right: 10px; padding-right: 0.625rem; vertical-align: middle; } */ /* Tip23 - Mark links to documents with corresponding icons for PDF, Word, Excel, PowerPoint and archive documents. * * You can always invoke document icons with classes: icon-pdf, icon-word, icon-excel, icon-powerpoint, icon-archive-file * * To activate automatic icon placement on links to the documents, uncomment next block of CSS rules. * * 7z extension was non added because it produces error, most likelly because of lack of MIME type support on some servers: * https://stackoverflow.com/questions/18562580/possible-to-add-mime-type-to-web-config-without-possibly-breaking-the-site */ /* .content-area a[href$=pdf]:before, .content-area a[href$=doc]:before, .content-area a[href$=docx]:before, .content-area a[href$=xls]:before, .content-area a[href$=xlsx]:before, .content-area a[href$=ppt]:before, .content-area a[href$=pptx]:before, .content-area a[href$=zip]:before, .content-area a[href$=rar]:before, .content-area a[href$=gz]:before { font-size: 18px; font-size: 1.125rem; padding-right: 5px; padding-right: 0.3125rem; vertical-align: baseline; } .content-area a[href$=pdf]:before { color: #bb0706; content: "\f1c1"; } .content-area a[href$=doc]:before, .content-area a[href$=docx]:before { color: #2a5699; content: "\f1c2"; } .content-area a[href$=xls]:before, .content-area a[href$=xlsx]:before { color: #207245; content: "\f1c3"; } .content-area a[href$=ppt]:before, .content-area a[href$=pptx]:before { color: #d24625; content: "\f1c4"; } .content-area a[href$=zip]:before, .content-area a[href$=rar]:before, .content-area a[href$=gz]:before { color: #428f27; content: "\f1c6"; } */ /* Do not add file type icon to buttons */ /* .content-area a.btn[href$=pdf]:before, .content-area a.btn[href$=doc]:before, .content-area a.btn[href$=docx]:before, .content-area a.btn[href$=xls]:before, .content-area a.btn[href$=xlsx]:before, .content-area a.btn[href$=ppt]:before, .content-area a.btn[href$=pptx]:before, .content-area a.btn[href$=zip]:before, .content-area a.btn[href$=rar]:before, .content-area a.btn[href$=gz]:before { content: none; } */ /* 4.0 Forms -------------------------------------------------------------- */ /* 4.1 General styles first */ /* 4.2 Buttons */ /* Make button text bold */ .btn-custom-blue, .btn-custom-red, .btn-custom-orange, .btn-custom-green, .btn-custom-black { font-weight: bold; } /* 4.3 Twitter Bootstrap style buttons */ /* 5.0 Navigation -------------------------------------------------------------- */ /* 5.1 Links */ a { color: #06c; } a:visited { color: #06c; } a:hover, a:active, a:focus { color: #BB2852; text-decoration: none; } .widget-area .widget a.social-link, .widget-area .widget a .social-link, .widget-area .widget a:visited.social-link, .widget-area .widget a:visited .social-link { color: #06c; } .widget-area .widget a:hover.social-link, .widget-area .widget a:hover .social-link, .widget-area .widget a:active.social-link, .widget-area .widget a:active .social-link, .widget-area .widget a:focus.social-link, .widget-area .widget a:focus .social-link { color: #BB2852; } .widget-area .widget a, .widget-area .widget a:visited { color: #06c; } .widget-area .widget a:hover, .widget-area .widget a:active, .widget-area .widget a:focus { color: #BB2852; } .widget-area .widget_categories a:hover, .widget-area .widget_categories a:focus, .widget-area .widget_nav_menu a:hover, .widget-area .widget_nav_menu a:focus, .widget-area .widget .children li.cat-item a:hover, .widget-area .widget .children li.cat-item a:focus, .widget-area .widget .children li.page_item a:hover, .widget-area .widget .children li.page_item a:focus, .widget-area .widget .current-cat-parent a, .widget-area .widget .current-cat-parent a:visited, .widget-area .widget .current_page_parent a, .widget-area .widget .current_page_parent a:visited { color: #BB2852; } .widget-area .widget .current-cat .cat-item a, .widget-area .widget .current-cat .cat-item a:visited, .widget-area .widget .current-cat-parent .cat-item a, .widget-area .widget .current-cat-parent .cat-item a:visited, .widget-area .widget .current_page_item .page_item a, .widget-area .widget .current_page_item .page_item a:visited, .widget-area .widget .current_page_parent .page_item a, .widget-area .widget .current_page_parent .page_item a:visited { color: #06c; } .widget-area .widget .current-cat-parent .current-cat, .widget-area .widget .current-cat-parent .current-cat a, .widget-area .widget .current-cat-parent .current-cat a:visited, .widget-area .widget .current_page_parent .current_page_item, .widget-area .widget .current_page_parent .current_page_item a, .widget-area .widget .current_page_parent .current_page_item a:visited, .widget-area .widget .current-cat, .widget-area .widget .current-cat a, .widget-area .widget .current-cat a:visited, .widget-area .widget .current_page_item, .widget-area .widget .current_page_item a, .widget-area .widget .current_page_item a:visited { color: #BB2852; } #footer-widgets a, #footer-widgets a:visited { color: #06c; } #footer-widgets a:hover, #footer-widgets a:active, #footer-widgets a:focus { color: #BB2852; } .entry-header .entry-title a { text-decoration: none; color: #06c; } .entry-header .entry-title a:hover, .entry-header .entry-title a:focus { color: #BB2852; } .page-header a, .page-header a:visited { color: #0066cc; } .page-header a:hover, .page-header a:active { color: #BB2852; } .template-front-page .site-content .widget-area .widget li a { color: #06c; } .template-front-page .site-content .widget-area .widget li a:hover { color: #BB2852; } .site-footer a { color: #06c; } .site-footer a:hover, .site-footer a:focus { color: #BB2852; } .site-content{background:#f6f6f6;} .blog .site-content{background:fff; border-left:30px solid #f6f6f6; border-right:30px solid #f6f6f6;} /* 5.2 Menus */ /* Small (mobile) menu */ /* From Expound css/expound.css */ .site-header .menu-toggle { background: #3a3a3a; color: #fff; font: 16px/16px "Helvetica Neue", Helvetica, Arial, sans-serif; font-weight: 300; padding: 10px 20px; padding: 0.625rem 1.25rem; } .site-header .menu-toggle:hover, .site-header .menu-toggle:focus { background: #474747; } .site-header .menu-toggle:before { content: "\2261"; font-size: 20px; font-size: 1.25rem; margin-right: 7px; margin-right: 0.4375rem; } .main-navigation.toggled .menu-toggle { background: #474747; } .main-navigation.toggled a { color: #fff; padding: 10px 40px; padding: 0.625rem 2.5rem; text-decoration: none; } .main-navigation.toggled li a { background: #3a3a3a; } .main-navigation.toggled li a:hover { background: #474747; } .main-navigation.toggled ul > .current_page_item > a, .main-navigation.toggled ul > .current-menu-item > a { background: #117bb8; } /* Tip10 - Add Twenty Thirteen search form to WordPress nav menu */ .menu-item.menu-item-search { float: right; margin: 4px 0 0 0; margin: 0.25rem 0 0 0; } .site-header input[type="search"] { -webkit-appearance: textfield; padding-right: 2px; /* Don't cut off the webkit search cancel button */ padding-right: 0.125rem; /* Don't cut off the webkit search cancel button */ width: 270px; width: 19.285714286rem; } .site-header input[type="search"]::-webkit-search-decoration { -webkit-appearance: none; } .site-header .search-form [type="search"], .site-header .search-form [type="text"] { background-color: transparent; border: none; cursor: pointer; height: 28px; margin: 3px 0; margin: 0.1875rem 0; padding: 0 0 0 34px; padding: 0 0 0 2.125rem; position: relative; -webkit-transition: width 400ms ease, background 400ms ease; transition: width 400ms ease, background 400ms ease; width: 0; } .site-header .search-form [type="search"]:focus, .site-header .search-form [type="text"]:focus { background-color: #f5f5f5; border: 1px solid #bbb; cursor: text; outline: 0; width: 230px; width: 16.428571429rem; -webkit-box-shadow: none; -moz-box-shadow: none; box-shadow: none; } .site-header .search-form [type="submit"] { display: none; } /* Hide top menu search in child themes for the mobile menu */ .menu-item.menu-item-search { display: none; } /* Tip86 - Style social icons manualy added in the sidebar. Check also media queries for additional styles. */ .widget-area .widget .social-link { font-size: 30px; font-size: 1.875rem; /* Increasing spacing for tap targets */ line-height: 1.2; margin: 0 24px 24px 0; margin: 0 1.5rem 1.5rem 0; vertical-align: middle; } .widget-area .widget a.social-link, .widget-area .widget a .social-link, .widget-area .widget a:visited.social-link, .widget-area .widget a:visited .social-link { color: #777; } .widget-area .widget a:hover.social-link, .widget-area .widget a:hover .social-link, .widget-area .widget a:active.social-link, .widget-area .widget a:active .social-link { color: #ff6111; } /* 5.3 Post, archive navigation */ /* Tip27 - Uncomment next code line to disable "previous article - next article" navigation below the content of a post */ /* .post-navigation { display: none; } */ /* Tip88 - Customize color scheme: Navigation links for archive and single views (Previous, Next page of articles and article) */ /* .nav-links a, .nav-links a:visited { color: #b076ff; -webkit-tap-highlight-color: rgba(176, 118, 255, 1); } .nav-links a:focus { background-color: #b076ff; color: #fff; } */ /* 6.0 Accessibility -------------------------------------------------------------- */ /* Text meant only for screen readers */ /* 7.0 Alignments -------------------------------------------------------------- */ /* 8.0 Clearings -------------------------------------------------------------- */ /* 9.0 Widgets -------------------------------------------------------------- */ /* 9.1 General widget styles */ /* 9.2 Specific widget styles */ #text-2 img, #text-3 img{max-width:20%; float:left; margin:0;} #text-2 h2, #text-3 h2{ float:left; max-width:75%; padding-left:10px; clear:none; } #text-2 h2 a, #text-3 h2 a{ text-decoration:none; color:#06C; } #text-2 h2 a:hover, #text-3 h2 a:hover{color:#006;} #text-2, #text-3{border-bottom:1px solid #ccc; padding-bottom:10px;} .widget-area .widget { -webkit-hyphens: none; -moz-hyphens: none; -ms-hyphens: none; hyphens: none; } /* Tip53 - Change vertical spacing between lines in Recent Posts widget. If your post titles are rather short, 12px will be a good choice */ /* .widget_recent_entries li { margin-bottom: 12px; margin-bottom: 0.75rem; } */ /* Styles for Categories and Pages widgets */ /* 9.3 Footer widget styles */ /* Four footer widget areas. Additional styles at 15.0 Media queries */ /* 10.0 Header -------------------------------------------------------------- */ /* 10.1 Site Header */ /* Tip88 - Customize color scheme: Site Title and Description - can also be changed via Admin > Appearance > Customizer */ .site-header .site-description{ color:#fff; background:#BB2852; text-align:center; font-size:18px; padding:20px 10%; /*-webkit-box-shadow: inset 0px -7px 5px -4px rgba(0,0,0,0.3); -moz-box-shadow: inset 0px -7px 5px -4px rgba(0,0,0,0.3); box-shadow: inset 0px -7px 5px -4px rgba(0,0,0,0.3);*/ } img.header-image, .site-header img.wp-post-image { margin: 0; } #site-title-wrapper{text-align:center; background:#06c; padding:20px;} .site-header img{display:none;} .site-header img#logo{display:inline; max-width:50%;} /* .site-header .site-title a, .site-header .site-description a { color: #515151; } .site-header .site-title a:hover, .site-header .site-description a:hover { color: #ff6111; } .site-header .site-title { color: #515151; font-size: 24px; font-size: 1.5rem; font-weight: bold; line-height: 1.285714286; } .site-header .site-description { font-weight: normal; font-size: 13px; font-size: 0.8125rem; color: #757575; } */ /* Tip14 - Site Logo plugin/feature support. Check: inc/plugin-compatibility.php for more details. */ /* Enable Site Logo in mobile view */ /* .site-branding { margin-top: 12px; margin-top: 0.75rem; } .site-logo-link { display: inline-block; float: left; margin: 5px 24px 0 0; margin: 0.3125rem 1.5rem 0 0; } #site-title-wrapper { padding: 12px 0 12px 12px; padding: 0.75rem 0 0.75rem 0.75rem; } .site-header .site-title, .site-header .site-title a { clear: none; display: inline; } .site-header .site-title, .site-header .site-description { text-align: left; } */ /* Tip06 - Custom headers for posts and pages. Uncomment following CSS rules to disable border and shadow on main header: */ /* img.header-image, .site-header img.wp-post-image { border-radius: 0; box-shadow: none; } */ /* Tip12 - Uncomment following CSS rules to have classic Twenty Twelve front page look - disable header image for the Front Page Templ.: */ /* .template-front-page img.header-image, .template-front-page .site-header img.wp-post-image { display: none; } */ /* 11.0 Content -------------------------------------------------------------- */ body{ background:#e6e6e6; } .site{background:transparent;} body .site, .site-footer { margin: 0 auto; max-width: 1400px; max-width: 87.5rem; padding:0; /* overflow: hidden; */ /* Had to disable it to make visible top menu sub-items */ } .site-main, .inner{margin:0 auto; max-width:1040px; max-width:65rem; display:block; padding:0 20px;} .page #secondary{ background:url(images/widget-bg.png) repeat-x top; overflow:hidden; boder:0; margin:0; border:0; } .blog #secondary, #secondary{ background:none; margin-top:20px; border-left:1px solid #ccc; padding-left:20px; } .home .entry-content h2, .entry-content h1{text-align:center; color:#06c;} .entry-content h3.button{ border:0; margin:0 0 5px 0; border-radius:5px; -moz-border-radius:5px; -webkit-border-radius:5px; } .entry-content h3.button a:before{font-family:genericons; font-size:32px; margin-right:10px; vertical-align:top; display:inline-block; line-height:1.6rem;} .home .entry-content .infobox1 h3.button a:before{vertical-align:middle;} .entry-content h3.button a{ text-decoration:none; display:block; padding:20px; color:#fff; } .entry-content h3.button a:hover{background-color:rgba(0, 0, 0, 0.2);} .page .content-area{ float:none; margin: 24px auto; } .page-template-software .content-area{width:100%;} @media screen and (min-width:764px){ .content-area, .blog .content-area{ float:left; margin:24px 0 0; } } h3.trial{background:#BB2852 url(images/gradient.png) no-repeat bottom right; color:#fff;} h3.trial a:before{content: '\f440';} h3.buy{background:#006 url(images/gradient.png) no-repeat bottom right; color:#fff;} h3.buy a:before{content: '\f447';} h3.price{background:#06c url(images/gradient.png) no-repeat bottom right; color:#fff;} h3.price a:before{content: '\f302';} h3.info{background:#006 url(images/gradient.png) no-repeat bottom right; color:#fff;} h3.info a:before{content: '\f445';} h3.pdf{background:#06c url(images/gradient.png) no-repeat bottom right; color:#fff;} h3.pdf a:before{content: '\f444';} .entry-content h3.promo{ color:#fff; font-weight:normal; background:#BB2852; border:0; margin-bottom:30px; padding:10px 20px; border-radius: 5px; -moz-border-radius: 5px; -webkit-border-radius: 5px; } .entry-content h3.promo strong{font-weight:strong;} /* 11.1 Posts and pages */ .archive .content-area article, .category .content-area article, .singular .content-area article, .blog .content-area article, .search-results .content-area article { background: transparent; background-image:none; } .infobox1{ background:#e6e6e6; padding:20px; border-radius:5px; -moz-border-radius:5px; -webkit-border-radius:5px; margin:0 0 20px 0; overflow:hidden; } .infobox1 ul li{list-style:none; margin-left:0;} .infobox1 ul li:before{content: '\f418'; font-family:genericons; margin-right:10px;} .home .entry-content .infobox1 h3.button{background:#06C url(images/gradient.png) no-repeat bottom right;} .home .entry-content .infobox1 h3.button a{padding:10px 20px;} .home .entry-content .infobox1 h3.button a:before{content: '\f429';} .entry-content, .entry-summary { text-align: left; } .entry-content .rpt_style_basic .rpt_plan .rpt_title {line-height:26px !important;} .entry-content .rpt_5_plans .rpt_plan .rpt_head .rpt_price{font-size:36px !important; line-height:50px !important;} .entry-content .rpt_5_plans .rpt_recommended_plan .rpt_head .rpt_price {font-size:48px !important; line-height:50px !important;} .entry-content .rpt_5_plans .rpt_plan .rpt_head .rpt_price .rpt_currency {top:0px !important;} /*Forms-----------------------------------*/ .wpcf7-form br{clear:both; line-height:0;} .wpcf7 label, .wpcf7-form-control-wrap{float:left; margin-bottom:5px;} .wpcf7 label{width:160px; text-align:right; margin-right:10px;} .wpcf7 .priceplan label{text-align:left;} .wpcf7 fieldset{ background:#e6e6e6; padding:20px; border-radius:5px; -moz-border-radius:5px; -webkit-border-radius:5px; margin:0 0 10px 0; border:0; } .wpcf7 legend{float:left; display:block; color:#BB2852; font-weight:bold; text-transform:uppercase; width:100%; padding-bottom:10px;} input.wpcf7-submit{background:#06c; color:#fff; border:0;} input.wpcf7-submit:hover{background:#006; color:#fff; border:0;} @media screen and (max-width:700px){ .wpcf7{width:auto;} .wpcf7 input, .wpcf7 select, .wpcf7 textarea{max-width:100%; overflow:hidden;} .wpcf7 label{text-align:left; width:100%;} } /* Tip25b - Disable special icons, that marks the links that will open in a new window */ .entry-content .fa-external-link { display: none; } /* Tip26b - Comment out next CSS rule to Print HTML bellow post title with meta information (date/time and author) * for the index/archive views in MOBILE view. */ /* .home .entry-header .entry-meta, .archive .entry-header .entry-meta { display: block; } */ /* Tip30 - Uncomment next CSS block to hide entry meta section, located below the post (with author, categories, tags) * in the Index page and archive listings. */ /* .list-view footer.entry-meta { display: none; } .format-link footer.entry-meta, .format-status footer.entry-meta { display: block; } .content-area article { padding-bottom: 12px!important; padding-bottom: 0.75rem!important; } */ /* Alternative heading style to try */ /* .entry-content h1, .entry-summary h1, .page-content h1, .entry-content h2, .entry-summary h2, .page-content h2 { margin: 48px 0 24px 0; margin: 3rem 0 1.5rem 0; border-bottom: 3px double #bbb; } */ .entry-content h3{color:#BB2852; border-bottom:1px solid #ccc; margin-bottom:10px;} /* Tip33 - Enable hyphenation of text for article. Please note that automatic hyphenation can reduce * accesibility of the theme - it can cause strange pronunciation with screen readers. */ /* .content-area article { -webkit-hyphens: auto; -moz-hyphens: auto; -ms-hyphens: auto; hyphens: auto; } */ /* Tip36 - Display featured image thumbnail in archive views (index page, categories, etc.) * Image also gets the class "alignright", "aligncenter", etc. via content.php */ .entry-thumbnail .wp-post-image { box-shadow: 0 1px 4px rgba(0, 0, 0, 0.2); } /* You can try using these CSS rules if you place small size (thumbnail) image that is aligned to the left */ /* .entry-thumbnail img.wp-post-image { margin: 24px 24px 0 0; margin: 1.5rem 1.5rem 0 0; width: auto; } */ /* Entry-meta for specific post formats */ /* Author profiles */ /* 11.2 Post Formats */ /* 11.3 Comments */ /* Comment form */ /* 11.4 Page templates */ .template-front-page .page .entry-content { font-size: 16px; font-size: 1rem; } /* Front page template */ /* Links (blogroll) template */ /* Software pages */ #software-topbar{background:#BB2852; color:white; text-align:left; margin-top:-1.5rem;} #software-topbar section{padding:0;} #software-topbar a{ color:#fff; text-transform:uppercase; text-decoration:none; padding:10px 20px; display:block; } #software-topbar a:hover{ background-color: rgb(149, 32, 65); } .page-id-182 #software-topbar a#softwaredownload, .page-id-10 #software-topbar a#software, .page-id-277 #software-topbar a#features, .page-id-121 #software-topbar a#faqs, .page-id-170 #software-topbar a#support { background-color: #06c; } /* 12.0 Footer -------------------------------------------------------------- */ /* Tip63 - Uncomment following CSS rules to have classic Twenty Twelve front page look - disable footer widgets for the Front Page Templ.: */ /* .template-front-page #footer-widgets { display: none; } */ .site-footer { border-top: 0; font-size: 13px; font-size: 0.8125rem; max-width: 1400px; max-width: 87.5rem; margin: 5px auto 0 auto; margin: 0.3125rem auto 0 auto; padding: 0 0 29px 0; padding: 0 0 1.8125rem 0; } /* Give extra top padding when footer widgets are present */ .footer-widgets .site-footer { padding-top: 5px; padding-top: 0.3125rem; } .site-footer a { color: #222; } .site-footer a:hover, .site-footer a:focus { color: #dd3811; } .site-footer { background: #06c; color:#fff; /* Old browsers */ /* IE10 Consumer Preview */ background-image:none; } /* 13.0 Media -------------------------------------------------------------- */ /* Increase size for emoji and smiley icons, so they would look better. */ .page-content .wp-smiley, .page-content .emoji, .entry-content .wp-smiley, .entry-content .emoji, .comment-content .wp-smiley, .comment-content .emoji { height: 1.2em!important; max-height: 1.2em!important; width: 1.2em!important; max-width: 1.2em!important; } /* 13.1 Images */ .entry-content img, .widget img, img.header-image, img.wp-post-image { /* Add fancy borders to all WordPress-added images but not things like badges and icons and the like */ border-radius: 0; -webkit-box-shadow: none; -moz-box-shadow: none; box-shadow: none; } img.wp-post-image {margin-bottom:20px;} /* Responsive images */ /* Single image attachment view */ /* 13.2 Captions */ /* 13.3 Galleries */ /* 14.0 Other styles -------------------------------------------------------------- */ /* 14.1 Twitter Bootstrap style alerts. Usage: http://getbootstrap.com/components/#alerts */ /* 14.2 Misc. styles */ /* Plugins */ /* 15.0 Media queries -------------------------------------------------------------- */ /* Please note, that all CSS rules, placed outside of media queries, affect all screen sizes - starting from small screens * (mobile phones) and going up to the very wide screens (widescreen monitors, high resolution tablets). Those rules can be * adjusted and overridden, targeting specific screen sizes in media queries bellow. * * Important: lower size media queries will also affect wider screen sizes, e.g. min-width: 770px media query will also affect * screen sizes starting with 960px and 1250px. * * Wondering what are the screen sizes of most popular devices? Check: http://screensiz.es */ /* 15.1 Minimum width of 783 pixels - it is activated at the same time as mobile view of WordPress admin-bar * (small screens - mobile phones, small tablets in portrait view mode) */ @media screen and (min-width: 783px) { .site-content .widget-area { float: right; width: 25%; } .content-area { float: left; width: 75%; } .site-header img{display:block;} .site-header img#logo{position:absolute; top:30px; left:60%; max-width:30%;} #site-title-wrapper {float:none;} .site-header .site-description{font-size:24px;} #text-2, #text-3{text-align:center; width:48%; padding:0 1%; margin:0; border:0;} #text-2 h2, #text-3 h2{float:none; text-align:center; margin:0; max-width:100%;} #text-2 img, #text-3 img{float:none; margin:0; max-width:40%;} #software-topbar{background:#BB2852; color:white; text-align:center; margin-top:-1.5rem;} #software-topbar section{padding:0;} #software-topbar a{ width:130px; display:inline-block; color:#fff; text-transform:uppercase; text-decoration:none; text-align:center; margin:0 5px; padding:5px 0; } #software-topbar a:before{ display:block; width:80px; margin:0 auto;} #software-topbar a#softwaredownload:before{ content:url(images/login.svg); } #software-topbar a#software:before{ content:url(images/icon.png); } #software-topbar a#features:before{ content:url(images/features.svg); } #software-topbar a#faqs:before{ content:url(images/faq.svg); } #software-topbar a#support:before{ content:url(images/support.svg); } div.wpcf7{width:650px; margin:0 auto;} /* Top menu for the normal site */ .main-navigation, body.admin-bar .main-navigation { margin-top:0;} .main-navigation { background:#006; border: none; } .main-navigation ul.nav-menu, .main-navigation div.nav-menu > ul { border:none; text-align:center; } /* Adding shadow for the drop down menu items */ .main-navigation ul.nav-menu ul.sub-menu li { -webkit-box-shadow: 3px 3px 5px rgba(100, 100, 100, 0.3); -moz-box-shadow: 3px 3px 5px rgba(100, 100, 100, 0.3); box-shadow: 3px 3px 5px rgba(100, 100, 100, 0.3); } .main-navigation ul { margin: 0; text-indent: 0; } .main-navigation li a, .main-navigation li { display: inline-block; text-decoration: none; } .main-navigation li a { color: #fff; } .main-navigation li a:hover, .main-navigation li a:focus { color: #06c; outline: none; text-decoration: underline; } .main-navigation li { position: relative; margin: 0 32px 0 0; margin: 0 2rem 0 0; font-size: 14px; font-size: 0.875rem; line-height: 1.2; } .main-navigation li ul { margin: 0; padding: 0; position: absolute; top: 100%; z-index: 100; height: 1px; width: 1px; overflow: hidden; clip: rect(1px, 1px, 1px, 1px); } .main-navigation li ul ul { top: 0; left: 100%; } .main-navigation ul li:hover > ul, .main-navigation ul li:focus > ul, .main-navigation .focus > ul { border-left: 0; clip: inherit; overflow: inherit; height: inherit; width: inherit; } .main-navigation li ul li a { background: #006; border-bottom: 0; display: block; font-size: 11px; font-size: 0.6875rem; line-height: 2.181818182; padding: 8px 10px; padding: 0.5rem 0.625rem; width: 200px; width: 14.285714286rem; white-space: normal; color:#fff; } .main-navigation li ul li a:hover, .main-navigation li ul li a:focus { background: #00268c; color: #fff; text-decoration:none; } .main-navigation ul li ul li, .main-navigation ul li ul li ul li { border-bottom: 1px solid #00268c; } .main-navigation ul li ul li:last-child, .main-navigation ul li ul li ul li:last-child { border-bottom: 0; } .main-navigation .current-menu-item > a, .main-navigation .current-menu-ancestor > a, .main-navigation .current_page_item > a, .main-navigation .current_page_ancestor > a { color: #06c; font-weight: bold; } .main-navigation .menu-toggle, .main-navigation.toggled .nav-menu { display: none; } /* Tip05 - Mark main navigation menu items, containing children with special css class * Main navigation menu items with drop-down children will be marked by a distinct icon (caret down) via style.css * @link https://stackoverflow.com/questions/8448978/wordpress-how-do-i-know-if-a-menu-item-has-children */ .nav-menu .menu-item-has-children > a:after, .nav-menu .page_item_has_children > a:after { content: "\f078"; /* fa-chevron-down */ padding: 0 0 2px 5px; padding: 0 0 0.125rem 0.3125rem; font-size: 10px; font-size: 0.625rem; text-decoration: none; vertical-align: middle; } .sub-menu .menu-item-has-children > a:after, .sub-menu .page_item_has_children > a:after { content: "\f054"; /* fa-chevron-right */ position: absolute; right: 8px; top: 16px; font-size: 10px; font-size: 0.625rem; text-decoration: none; } /* Tip52 - Adjust default site layout for normal view */ .entry-content .column{width:48%; padding:0 1%; float:left;} .entry-content .column:nth-of-type(2){float:right;} /* .content-area { float: left; width: 65.104166667%; } .widget-area { float: right; width: 30.5%; } */ /* Tip52b - Change site layout (position of sidebar) for normal view */ /* .content-area { float: right; width: 65.104166667%; } .widget-area { float: left; width: 30.5%; } */ .widget-title { font-size: 20px; font-weight: normal; line-height: 1.4; text-transform: uppercase; color: #006; text-shadow: none; } /* Tip14 - Site Logo plugin/feature support. Check: inc/plugin-compatibility.php for more details. */ .site-logo-link { margin: 24px 24px 0 0; margin: 1.5rem 1.5rem 0 0; } .site-logo { } #site-title-wrapper { padding: 0; margin-bottom: 0; } /* Tip88 - Customize color scheme: Site Title and Description - can also be changed via Admin > Appearance > Customizer */ /* .site-header .site-title, .site-header .site-title a, .site-header .site-description a { color: #333; } .site-header .site-title a:hover, .site-header .site-description a:hover { color: #ff6111; } */ /* Show top menu search in child themes for the full menu */ .menu-item.menu-item-search { display: none; } .entry-header .entry-title { font-size: 36px; font-size: 2.25rem; font-weight: normal; line-height: 1.30; } .entry-header .entry-title, .entry-header .entry-title a { color: #333; /* Tip32 - Add shadow to post/page title. Usage: text-shadow: horizontal-offset vertical-offset blur color; last digit of rgba sets opacity */ /* text-shadow: 1px 1px 3px rgba(0,0,0,0.2); */ } .home .entry-header .entry-meta, .archive .entry-header .entry-meta { display: none; } /* Tip26b - uncomment next CSS rule to Print HTML bellow post title with meta information (date/time and author) * for the index/archive views in NORMAL view. */ /* .home .entry-header .entry-meta, .archive .entry-header .entry-meta { display: block; } */ /* Tip62 - Add side borders for the middle footer widget - to better separate widgets visually. Uncomment next section: */ /* #footer-widgets.three #footer-widget-middle { border: 1px solid #ededed; border-width: 0 1px; } */ /* Tip86 - Style social icons manualy added in the sidebar */ .widget-area .widget .social-link { margin: 0 10px 10px 0; margin: 0 0.625rem 0.625rem 0; } } /* 15.2 Minimum width of 1100 pixels (average size screens - monitors, small tablets in landscape view mode, larger tablets) */ @media screen and (min-width: 1100px) { body .site{ margin-top:0; padding-top:0; -webkit-box-shadow: none; -moz-box-shadow: none; box-shadow: none; } .site-header .site-description{ padding:10px 20% 0 20%; } } /* 15.3 Minimum width of 1240 pixels (big screens - widescreen monitors, high resolution tablets) */ @media screen and (min-width: 1240px) { /* Here you can add specific styles for this screen widh */ } /* 15.4 Retina-specific styles. This style cannot be processed by LESS */ @media print, (-o-min-device-pixel-ratio: 5/4), (-webkit-min-device-pixel-ratio: 1.25), (min-resolution: 120dpi) { /* Here you can add specific styles for Retina displays */ } /* 16.0 Print ----------------------------------------------- */ @media print { /* Here you can add specific styles for the printing */ /* 16.1 Comments */ }