/* 1 - HTML5 display definitions ------------------------------------------------------- */ * { margin: 0px; padding: 0px; } html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video { margin: 0; padding: 0; border: 0; font-size: 100%; font: inherit; vertical-align: baseline; } article, aside, details, figcaption, figure, footer, header, hgroup, main, menu, nav, section, summary { display: block; } audio, canvas, progress, video { display: inline-block; /* 1 */ vertical-align: baseline; /* 2 */ } audio:not([controls]) { display: none; height: 0; } [hidden], template { display: none; } *, *:after, *:before { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } * { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } :after, :before { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } /* 2 - HTML and Body ------------------------------------------------------- */ html { line-height: 1.6; -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } body { position: relative; background: #fff; color: #333333; font-family: 'Open Sans', sans-serif; font-size: 1em; font-weight: 400; line-height: 1.6; margin: 0; padding: 0; width: 100%; min-height: 100%; height: auto; -webkit-font-smoothing: subpixel-antialiased; -webkit-text-size-adjust: 100%; /* Fix Mobile Safari Font Scale */ overflow-x: hidden; } /* 3 - Typography ------------------------------------------------------- */ /* Headings */ h1, h2, h3, h4, h5, h6 { font-family: 'Roboto', sans-serif; font-weight: 700; color: #111111; margin-bottom: 0.2em; } h1 { font-size: 2.4em; margin-top: 0.4em; } h2 { font-size: 2em; margin-top: 0.4em; } h3 { font-size: 1.6em; margin-top: 0.2em; } h4, h5, h6 { font-size: 1.2em; margin-top: 0.2em; } /* PARAGRAPH */ p { margin: 0 0 1em 0; } /* Links */ a, a:hover, a:active, a:focus { background-color: transparent; text-decoration: none; } a:active, a:hover, a:focus { outline: 0; border: 0; } a { color: #d92546; transition: color 0.4s ease; } a:hover, a:visited:hover { color: #8d182d; } a:visited { color: #d92546; } a:active, li a.active { color: #d92546; } /* Abbreviation */ abbr[title] { border-bottom: 1px dotted; } abbr { cursor: help; } acronym { border-bottom: 1px dotted; cursor: help; } /* Text styling */ b, strong { font-weight: bolder; font-weight: bold; color: #111; } i, em, dfn, cite { font-style: italic; } mark, ins { background: #e1e1e1; color: #111; text-decoration: none; padding: 4px 8px; } del { text-decoration: line-through; } small { font-size: 80%; } big { font-size: 125%; } sub, sup { font-size: 75%; line-height: 0; position: relative; vertical-align: baseline; } sup { top: -0.5em; } sub { bottom: -0.25em; } tt, var { font-family: monospace, monospace; } var { font-style: italic; } /* Blockquote */ blockquote { background-color: #e7e7e7; text-shadow: 1px 1px #fff; border-left: 6px solid #d92546; padding:10px 10px 10px 14px; margin: 10px 0px; } blockquote > p:first-child { display: inline; } blockquote > :last-child { margin-bottom: 0; } /* HTML code tags */ pre { overflow: auto; } kbd, pre, samp { font-family: monospace, monospace; font-size: 1em; background-color: #e7e7e7; text-shadow: 1px 1px #fff; border: 1px solid #d92546; padding:10px 10px 10px 20px; } code, pre { font-family: monospace, monospace; font-size: 1em; background-color: #e7e7e7; text-shadow: 1px 1px #fff; border-left: 6px solid #d92546; padding:10px 10px 10px 20px; margin: 10px 0; display: block; } /* Address */ address { font-style: italic; margin: 0 0 1.75em; } /* Definition Lists */ dl { margin: 0 0 1.5em; } dt { font-family: 'Roboto', sans-serif; font-weight: 700; } dd { margin: 0 0 1.5em; } /* 4 - Elements ------------------------------------------------------- */ hr { -webkit-box-sizing: content-box; -moz-box-sizing: content-box; box-sizing: content-box; height: 1px; border: 0; background: #666; clear: both; float: none; margin: 10px 0; width: 100%; overflow: visible; } [dir="rtl"] ul, [dir="rtl"] ol { padding: 0 1em 0.25em 0; } /* List */ ol ol, ul ul { margin: 0; padding: 0 0 0.25em 1em; /* LTR */ } [dir="rtl"] ol ol, [dir="rtl"] ul ul { padding: 0 1em 0.25em 0; } ul { list-style: disc; } ol { list-style: decimal; } li > ul, li > ol { margin-bottom: 0; } /* 5 - Forms ------------------------------------------------------- */ button, input, optgroup, select, textarea { font-family: inherit; font-size: 100%; line-height: 1.6; margin: 0; } button, input { overflow: visible; } button, select { text-transform: none; } button, [type="button"], [type="reset"], [type="submit"] { -webkit-appearance: button; cursor: pointer; } button[disabled], html input[disabled] { cursor: default; opacity: .7; } button::-moz-focus-inner, [type="button"]::-moz-focus-inner, [type="reset"]::-moz-focus-inner, [type="submit"]::-moz-focus-inner { border: 0; padding: 0; } input { line-height: normal; } input[type="checkbox"], input[type="radio"] { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; padding: 0; } input[type="number"]::-webkit-inner-spin-button, input[type="number"]::-webkit-outer-spin-button { height: auto; } input[type="search"] { -webkit-appearance: textfield; box-sizing: content-box; } [type="search"]::-webkit-search-decoration, input[type="search"]::-webkit-search-cancel-button, input[type="search"]::-webkit-search-decoration { -webkit-appearance: none; } fieldset { border: 1px solid #ccc; margin: 0 0 1em 0; padding: 1em; } fieldset > :last-child { margin-bottom: 0; } legend { border: 0; padding: 0; display: table; max-width: 100%; white-space: normal; } textarea { overflow: auto; vertical-align: top; } optgroup { font-weight: bold; } select { padding: 4px 0; } button:-moz-focusring, [type="button"]:-moz-focusring, [type="reset"]:-moz-focusring, [type="submit"]:-moz-focusring { outline: 1px dotted ButtonText; } [type="search"] { -webkit-appearance: textfield; outline-offset: -2px; } ::-webkit-file-upload-button { -webkit-appearance: button; font: inherit; } .button, a.button, .button:visited, a.button:visited { background: #d92546; color: #fff; padding: 10px 12px; -webkit-transition: all 0.4s linear; -moz-transition: all 0.4s linear; transition: all 0.4s linear; } .button:hover, a.button:hover { background: #8d182d; color: #fff; } /* 6 - Tables ------------------------------------------------------- */ table { border-collapse: collapse; border-spacing: 0; margin-bottom: 1.5em; width: 100%; } th, tr, td { vertical-align: middle; } th { font-family: 'Roboto', sans-serif; font-weight: 700; padding: 10px; background: #dddddd; border: 1px solid #b2b2b2; text-align: left; } td { border: 1px solid #b2b2b2; padding: 5px 10px; } .sticky-header th, .sticky-table th { border-bottom: 1px solid #ccc; padding-right: 1em; text-align: left; } /* 7 - Media ------------------------------------------------------- */ img, a img { max-width: 100% !important; height: auto; vertical-align: middle; border: 0; } figure { max-width: 100%; height: auto; border: 0; margin: 0; } svg:not(:root) { overflow: hidden; } /* 8 - Misc ------------------------------------------------------- */ abbr[title] { border-bottom: none; text-decoration: underline; text-decoration: underline dotted; } details { display: block; } summary { display: list-item; } template { display: none; } [hidden] { display: none; } /* 9 - FontAwesome icons ------------------------------------------------------- */ [class^="fa-"]:before, [class*=" fa-"]:before { display: inline-block; font: normal normal normal 14px/1 FontAwesome; font-size: inherit; text-rendering: auto; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } /* 10 - Container, Layout ------------------------------------------------------- */ #container, .container { position: relative; margin: 0 auto; padding: 0 10px; width: 1020px; } /* 1 column: global values*/ #main { display: inline; margin: 0; } /* 3 columns */ body.two-sidebars #main { float: left; margin: 0 0 0 240px; padding: 0; width: 520px; } /* 2 columns: sidebar-first */ body.sidebar-first #main { float: right; margin: 0; padding: 0; width: 760px; } /* 2 columns: sidebar-second */ body.sidebar-second #main { float: left; margin: 0; padding: 0; width: 760px; } /* 11 - Sidebar ------------------------------------------------------- */ /* 3 columns: sidebar-first */ body.two-sidebars #sidebar-first { float: left; margin: 0 0 0 -760px; padding: 0 20px 0 0; width: 240px; } /* 3 columns: sidebar-second */ body.two-sidebars #sidebar-second { float: right; margin: 0; padding: 0 0 0 20px; width: 240px; } /* 2 columns: sidebar-first */ body.sidebar-first #sidebar-first { float: left; margin: 0; padding: 0 20px 0 0; width: 240px; } /* 2 columns: sidebar-second */ body.sidebar-second #sidebar-second { float: right; margin: 0; width: 240px; padding: 0 0 0 20px; } /* 12 - Header ------------------------------------------------------- */ #header { position: relative; background: #fff; padding: 14px 0; margin: 0; clear: both; width: 100%; min-height: 50px; } #header #logo { float: left; margin: 0 1em 0 0; } #social { float: right; } #social li { display: inline; float: right; } #social .icon { width: 36px; height: 36px; line-height: 40px; float: right; text-align: center; background: #d92546; margin-left: 1px; -webkit-transition: all 0.5s ease-in-out; -moz-transition: all 0.5s ease-in-out; -o-transition: all 0.5s ease-in-out; transition: all 0.5s ease-in-out; opacity: 0.5; } #social .icon i { color: #fff; font-size: 1.2em; } #social .icon:hover{ opacity: 1; } #header .search-box .form-submit{ background-color: #d92546; color: #fff; border: 0; padding: 10px 10px; line-height: 1; cursor: pointer; -webkit-transition: all 0.5s ease-in-out; -moz-transition: all 0.5s ease-in-out; -o-transition: all 0.5s ease-in-out; transition: all 0.5s ease-in-out; opacity: 0.5; } #header .search-box .form-submit:hover{ opacity: 1; } #header .search-box .form-text { background: url(images/search.png) no-repeat 2px 8px; border: 1px solid #d92546; padding: 6px 4px 6px 24px; line-height: 1; opacity: 0.5; transition: all linear 0.4s; } #header .search-box .form-text:focus { outline: none; opacity: 1; } /* 13 - Main menu ------------------------------------------------------- */ #navigation { clear: both; margin: 0; padding: 0; background-color: #111314; min-height: 90px; width: 100%; min-width: 960px; font-family: 'Open Sans Condensed', sans-serif; font-weight: 300; } #navigation ul.menu{ clear: both; list-style: none; margin: 0; padding: 0; } #navigation ul.menu li { float: left; margin: 0; padding: 0; font-size: 22px; list-style: none; } #navigation ul.menu li a { } #navigation ul.menu li a.active, #navigation ul.menu li a:hover{ color: #d92546; } /* Little tricking with positions */ .navigation li { float:left; position:relative; } .navigation ul li a{ display: block; padding: 28px 30px 28px 10px; color: #ddd; text-transform: uppercase; } /* Sub Cat Menu stuff*/ .navigation ul ul{ position:absolute; left:0; display:none; /* Hide it by default */ margin:0 0 0 -1px; padding:0; list-style: none; border-bottom: 2px solid #d92546; z-index: 110; } .navigation ul ul li { width: 170px; float: left; border-top: none; } /* Sub Cat menu link properties */ .navigation ul ul a { } .navigation ul ul li a { background:#111314; display:block; /* Making sure a element covers whole li area */ padding: 4px 10px; text-decoration:none; /* No underline */ border-top:1px solid #d92546; text-transform: none; font-size: 18px; } li.expanded > a:after { content: " + "; color: #525356; font-weight: bold; } /* 14 - breaadcrumb ------------------------------------------- */ #breadcrumb { background-color: #eeeeee; padding: 0.5em 0; } .breadcrumb { clear: both; } .breadcrumb a { color: #d92546; } /* 15 - Nodes ------------------------------------------- */ /* menus and item lists */ .item-list ul { margin: 0; padding: 0 0 0 1.5em; } .item-list ul li { margin: 0; padding: 0; } ul.menu li { margin: 0; padding: 0; } ul.inline { clear: both; } ul.inline li { margin: 0; padding: 0 1em 0 0; } /* admin tabs */ .tabs-wrapper { border-bottom: 1px solid #333; margin: 0 0 1.4375em; } ul.primary { border: none; margin: 0; padding: 0; } ul.primary li a { background: none; border: none; display: block; float: left; line-height: 1.5em; margin: 0; padding: 0 1em; } ul.primary li a:hover, ul.primary li a.active { background: #666; border: none; color: #fff; } ul.primary li a:hover { background: #888; text-decoration: none; } ul.secondary { background: #666; border-bottom: none; clear: both; margin: 0; padding: 0; } ul.secondary li { border-right: none; } ul.secondary li a, ul.secondary li a:link { border: none; color: #ccc; display: block; float: left; line-height: 1.5em; padding: 0 1em; } ul.secondary li a:hover, ul.secondary li a.active { background: #888; color: #fff; text-decoration: none; } ul.secondary a.active { border-bottom: none; } .node { margin-bottom: 3em; } .submitted { background: #ddd; padding: 5px 10px; width: 680px; margin: 8px 0; } #main img { max-width: 700px; } #main footer { margin-bottom: 16px; font-family: 'Roboto', sans-serif; font-weight: 700; } /* tags */ .field-name-field-tags { margin: 0 0 1.5em; } .field-name-field-tags .field-item { margin: 0 1em 0 0; } .field-name-field-tags div { display: inline; } /* Pages */ ul.pager { margin-bottom: 20px; padding: 0; font-family: 'Roboto', sans-serif; font-weight: 700; } ul.pager .pager-current { background-color: #222; color: #d92546; } .pager-item, .pager-next, .pager-last, .pager-previous, .pager-first { background-color: #d92546; color: #fff; } .pager-item a, .pager-next a, .pager-last a, .pager-previous a, .pager-first a{ color: #fff; } /* profile */ .profile { margin: 1.5em 0; } .profile h3 { border: none; } .profile dt { margin-bottom: 0; } .profile dd { margin-bottom: 1.5em; } .password-parent { width: 36em; } /* 16 - Comments ------------------------------------------- */ #comments { clear: both; margin-top: 1.5em; } .comment { margin-bottom: 1.5em; } .comment .new { color: red; text-transform: capitalize; margin-left: 1em; } /* 17 - Footer ------------------------------------------- */ #footer { position: relative; clear: both; background: #14171c; width: 100%; padding: 1.5em 0; margin: 0; display: table; } #footer-bottom { position: relative; background: #111314; padding: 10px 0; width: 100%; display: table; } #copyright { position: relative; width: 100%; } #footer, #footer-bottom, #copyright { color: #9e9c98; } #footer a, #footer-bottom a, #copyright a, #footer a:visited, #footer-bottom a:visited, #copyright a:visited { color: #d92546; } #footer a:hover, #footer-bottom a:hover, #copyright a:hover { color: #d92546; } /* 18 - Homepage Slider ------------------------------------------------- */ #slider{ float: left; margin-top: 14px; } .main_view { float: left; position: relative; } .window { overflow: hidden; position: relative; width:940px; height:300px; float: left; } .image_reel { position: absolute; top: 0; left: 0; } .image_reel img { float: left; } .paging { padding: 7px 0 8px 0; text-align: center; z-index: 100; background: url(images/slider.png) bottom left no-repeat; } .paging a { text-indent: -9999px; background: url(images/slide-button.png) no-repeat center; width: 15px; height: 15px; display: inline-block; margin: 4px; border: none; outline: none; } .paging a.active { background: url(images/slide-button-active.png) no-repeat center; border: none; outline: none; } .paging a:hover { font-weight: bold; border: none; outline: none; } .slidertitle{ background: #d92546; display: none; position: absolute; bottom: 30px; left: 0; z-index: 100; color: #fff; font-size: 1.7em; font-family: 'Roboto', sans-serif; font-weight: 700; padding: 10px; margin-bottom: 14px; } .slidertext { background: #ca4c63; display: none; position: absolute; bottom: 0; left: 0; z-index: 101; color: #fff; font-size: 1.4em; padding: 10px; font-family: 'Open Sans', sans-serif; font-weight: 400; } /* 19 - Block regions ------------------------------------------------- */ /* common for all blocks */ .block { margin-bottom: 2.5em; } /* homepage page header */ .page-header { text-align: center; border-bottom: 1px solid #ddd; padding: 10px 0; margin: 0; } .page-header h1, .page-header h2, .page-header h3 { font-family: 'Roboto', sans-serif; font-size: 3em; font-weight: 700; text-transform: uppercase; } .page-header p{ font-size: 1.4em; color: #818181; } .home_service { } .home_service:hover .circle { opacity: 1; } .circle { position: relative; display: block; width: 100px; height: 100px; line-height: 100px; margin: 0 auto; text-align: center; border-radius: 50%; background-color: #d92546; color: #fff; -webkit-transition: all 0.5s ease-in-out; -moz-transition: all 0.5s ease-in-out; -o-transition: all 0.5s ease-in-out; transition: all 0.5s ease-in-out; opacity: 0.6; } .circle img { margin-top: 50px; } .circle i { font-size: 3em; line-height: 100px; } .circle a { color: #fff; } /* Footer blocks */ #footer h3.block-title, #footer-bottom h3.block-title { text-transform: uppercase; color: #fff; } #footer .block ul, .sidebar .block ul { list-style-type: none; padding: 0; margin: 0; } #footer .block li { border-bottom: 1px solid #000; padding: 4px 0; list-style: none; } .footer-bottom-block { position: relative; } /* sidebar blocks */ .sidebar .block li { border-bottom: 1px solid #ceaeb4; padding: 4px 0; list-style: none; } /* 20 - Shortcodes ------------------------------------------------- */ .full, .one_half, .one_three, .one_four { position: relative; float: left; margin: 0 0 16px 0; } .full { width: 100%; } .one_three { width: 33.3%; padding: 0 2% 0 0; } .one_three_last { margin-right: 0; } .text_left { text-align: left; } .text_right { text-align: right; } .text_center { text-align: center; } .last { margin-right: 0; } /* 21 - Clearing ------------------------------------------------------- */ .clear { clear: both; width: 100%;} .display-block { display: block; } .clear::before, #header::before, #navigation::before, #footer::before, #footer-bottom::before, #copyright::before, .container::before, .page-header::before, .full::before { clear: both; content: ''; display: table; } .clear::after, #header::after, #navigation::after, #footer::after, #footer-bottom::after, #copyright::after, .container::after, .page-header::after, .full::after { clear: both; content: ''; display: table; }