/* #Reset & Basics (Inspired by E. Meyers) ================================================== */ 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: top; } article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display: block; } body { line-height: 1; } ol, ul { list-style: none; } blockquote, q { quotes: none; } blockquote:before, blockquote:after, q:before, q:after { content: ''; content: none; } table { border-collapse: collapse; border-spacing: 0; } /* #Basic Styles ================================================== */ body { background: #D9D9D9; font: 14px/21px arial, sans-serif; color: #555555; -webkit-font-smoothing: antialiased; /* Fix for webkit rendering */ -webkit-text-size-adjust: 100%; } /* #Typography ================================================== */ h1, h2, h3, h4, h5, h6 { color: #555; font-family: Roboto, arial, serif; font-weight: normal; } h1 a, h2 a, h3 a, h4 a, h5 a, h6 a { font-weight: inherit; } h1 { font-size: 29px; line-height: 38px; margin-bottom: 14px;} h2 { font-size: 21px; line-height: 28px; margin-bottom: 10px; } h3 { font-size: 18px; line-height: 26px; margin-bottom: 8px; } h4 { font-size: 16px; line-height: 24px; margin-bottom: 8px; margin-top: 4px; } h5 { font-size: 15px; line-height: 21px; } h6 { font-size: 14px; line-height: 21px; } .subheader { color: #777; } p { margin: 0 0 20px 0; } p img { margin: 0; } p.lead { font-size: 21px; line-height: 27px; color: #777; } em { font-style: italic; } strong { font-weight: bold; color: #333; } small { font-size: 80%; } /* Blockquotes */ blockquote, blockquote p { font-size: 17px; line-height: 24px; color: #777; font-style: italic; } blockquote { margin: 0 0 20px; padding: 9px 20px 0 19px; border-left: 1px solid #ddd; } blockquote cite { display: block; font-size: 12px; color: #555; } blockquote cite:before { content: "\2014 \0020"; } blockquote cite a, blockquote cite a:visited, blockquote cite a:visited { color: #555; } hr { border: solid #ddd; border-width: 1px 0 0; clear: both; margin: 10px 0 30px; height: 0; } /* #Links ================================================== */ a, a:visited { color: #444; outline: 0; text-decoration: none; -webkit-transition: all 0.2s linear; -moz-transition: all 0.2s linear; -ms-transition: all 0.2s linear; -o-transition: all 0.2s linear; transition: all 0.2s linear; } a:hover, a:focus { color: #f5821f; } p a, p a:visited { line-height: inherit; } /* #Lists ================================================== */ ul, ol { margin-bottom: 10px; } ul { list-style: none outside; } ol { list-style: decimal; } ol, ul.square, ul.circle, ul.disc { margin-left: 30px; } ul.square { list-style: square outside; } ul.circle { list-style: circle outside; } ul.disc { list-style: disc outside; } ul ul, ul ol, ol ol, ol ul { margin: 4px 0 5px 30px; } ul ul li, ul ol li, ol ol li, ol ul li { margin-bottom: 6px; } li { line-height: 1.5em; margin-bottom: 12px; } ul.large li { line-height: 21px; } li p { line-height: 21px; } /* #Images ================================================== */ img.scale-with-grid { max-width: 100%; height: auto; } .frame-scale-with-grid { max-width: 100%; } #google_map iframe { width: 100%; height: 416px; border: 0; } /* #Forms ================================================== */ form { margin-bottom: 20px; } fieldset { margin-bottom: 20px; } input[type="text"], input[type="password"], input[type="email"], textarea, select { border: 1px solid #ccc; padding: 6px 4px; outline: none; -moz-border-radius: 2px; -webkit-border-radius: 2px; border-radius: 2px; font: 13px Arial, sans-serif; color: #777; margin: 0; width: 210px; max-width: 100%; display: block; margin-bottom: 20px; background: #fff; } select { padding: 0; } input[type="text"]:focus, input[type="password"]:focus, input[type="email"]:focus, textarea:focus { border: 1px solid #aaa; color: #444; -moz-box-shadow: 0 0 3px rgba(0,0,0,.2); -webkit-box-shadow: 0 0 3px rgba(0,0,0,.2); box-shadow: 0 0 3px rgba(0,0,0,.2); } textarea { min-height: 60px; } label, legend { display: block; font-weight: bold; font-size: 13px; } select { width: 220px; } input[type="checkbox"] { display: inline; } label span, legend span { font-weight: normal; font-size: 13px; color: #444; } /* #Misc ================================================== */ .remove-bottom { margin-bottom: 0 !important; } .half-bottom { margin-bottom: 10px !important; } .add-bottom { margin-bottom: 20px !important; } /* #Buttons ================================================== */ .button, a.button, button, input[type="submit"], input[type="reset"], input[type="button"] { border-style: solid; border-width: 0; -moz-border-radius: 3px; -webkit-border-radius: 3px; border-radius: 3px; /* box-shadow: 0 1px 0 rgba(255, 255, 255, 0.15) inset, 0 0;*/ background-image: -moz-linear-gradient(top, rgba(255, 255, 255, 0.2), rgba(0, 0, 0, 0.1)); background-image: -ms-linear-gradient(top, rgba(255, 255, 255, 0.2), rgba(0, 0, 0, 0.1)); background-image: -o-linear-gradient(top, rgba(255, 255, 255, 0.2), rgba(0, 0, 0, 0.1)); background-image: -webkit-linear-gradient(top, rgba(255, 255, 255, 0.2), rgba(0, 0, 0, 0.1)); background-image: linear-gradient(top, rgba(255, 255, 255, 0.2), rgba(0, 0, 0, 0.1)); background-repeat: repeat-x; /* border-color: rgba(0, 0, 0, 0.03) rgba(0, 0, 0, 0.05) rgba(0, 0, 0, 0.15);*/ color: white; text-shadow: 0 1px rgba(0, 0, 0, 0.4); background-color: #F5821F; text-decoration: none; font-size: 16px; font-family: "Tahoma", arial; font-weight: 400; display: inline-block; cursor: pointer; line-height: normal; padding: 1px 7px; -webkit-transition: all 0.2s linear; -moz-transition: all 0.2s linear; -ms-transition: all 0.2s linear; -o-transition: all 0.2s linear; transition: all 0.2s linear; } .button:hover, a:hover.button, button:hover, input[type="submit"]:hover, input[type="reset"]:hover, input[type="button"]:hover { background-color: #374045; } .button:active, button:active, input[type="submit"]:active, input[type="reset"]:active, input[type="button"]:active { background-color: #3d494f; } .button.full-width, button.full-width, input[type="submit"].full-width, input[type="reset"].full-width, input[type="button"].full-width { width: 100%; padding-left: 0 !important; padding-right: 0 !important; text-align: center; } /* Fix for odd Mozilla border & padding issues */ button::-moz-focus-inner, input::-moz-focus-inner { border: 0; padding: 0; } .button_hilite, a.button_hilite{ background-color: #f5821f; } .button_hilite:hover, a:hover.button_hilite{ background-color: #374045; } .button_pale, a.button_pale{ color: #374045; background-color: #f8f8f8; text-shadow: 0 1px 0 rgba(256, 256, 256, 0.4); } a:hover.button_pale{ color: #fff; background-color: #374045; text-shadow: 0 1px 0 rgba(0, 0, 0, 0.4); } .button, button.sm_button, a.sm_button, input[type="submit"].sm_button, input[type="reset"].sm_button, input[type="button"].sm_button { font-size: 13px; } /* #Main Navigation ================================================== */ /* menu */ #menu-holder { background: #fff; position:relative; } #menu { float:right; height: 40px; padding: 0px 0 0 5px; font-family: 'Tahoma', arial, sans-serif; font-weight: lighter; text-transform:lowercase; -moz-border-radius: 4px; -webkit-border-radius: 4px; -khtml-border-radius: 4px; border-radius: 4px; } #menu a{ font-size: 15px; text-decoration: none; } #menu ul { list-style: none; margin: 0; padding: 0; } #menu ul li { margin-bottom: 0; } #menu > ul > li { position: relative; float: left; z-index: 1015; padding: 0px 2px 0px 0px; background: url('../images/main_nav_bgr_sep.png') right top no-repeat; } #menu > ul > li:hover { } #menu > ul > li > a { color: #222; text-shadow: 0px 1px 0px #fff; line-height: 40px; text-decoration: none; display: block; padding: 0px 16px 0px 16px; z-index: 6; position: relative; font-size: 16px; -webkit-transition: all 0.2s linear; -moz-transition: all 0.2s linear; -ms-transition: all 0.2s linear; -o-transition: all 0.2s linear; transition: all 0.2s linear; } #menu > ul > li:hover > a { color:#ffcb04; } #menu > ul > li > a > span { padding: 0px 0px 0px 14px; background: url('../images/arrow_down_tiny.png') right center no-repeat; } #menu > ul > li > a .home_icon{ width: 16px; height: 40px; padding:0; display: block; background: url('../images/home_icon_dark.png') center center no-repeat; } #menu > ul > li > div { display: none; background: #FFFFFF; position: absolute; left: -1px; z-index: 1020; padding: 0px 0 5px; background: url('../images/menu_pale.png'); background-image: -moz-linear-gradient(#f8f8f8,#eeeeee); background-image: -o-linear-gradient(#f8f8f8,#eeeeee); background-image: -webkit-linear-gradient(#f8f8f8,#eeeeee); background-image: linear-gradient(#f8f8f8,#eeeeee); border: 1px solid #e8e8e8; border-top: 1px solid #d2d2d2; border-right: 1px solid #ddd; border-bottom: 1px solid #ddd; -moz-border-radius: 0 0 4px 4px; -webkit-border-radius: 0 0 4px 4px; -khtml-border-radius: 0 0 4px 4px; border-radius: 0 0 4px 4px; webkit-box-shadow: 1px 1px 3px rgba(0,0,0,0.12); -moz-box-shadow: 1px 1px 3px rgba(0,0,0,0.12); box-shadow: 1px 1px 3px rgba(0,0,0,0.12); } #menu > ul > li > div > ul { display: table-cell; border-top: 3px solid #e9e9e9; padding-top: 7px; } #menu > ul > li ul + ul { padding-left: 20px; } #menu > ul > li ul > li { position:relative; } #menu > ul > li ul > li > a { padding: 7px 0px 9px; margin: 0 16px; color: #222; text-shadow: 0px 1px 0px #fff; display: block; white-space: nowrap; min-width: 160px; font-size: 14px; background: url('../images/main_nav_bgr_sep_vertical.png') bottom left repeat-x; -webkit-transition: all 0.3s ease-out; -moz-transition: all 0.3s ease-out; -ms-transition: all 0.3s ease-out; -o-transition: all 0.3s ease-out; transition: all 0.3s ease-out; } #menu > ul > li ul > li > a > span { background: url('../images/arrow_left_tiny.png') -20px center no-repeat; -webkit-transition: all 0.3s ease-out; -moz-transition: all 0.3s ease-out; -ms-transition: all 0.3s ease-out; -o-transition: all 0.3s ease-out; transition: all 0.3s ease-out; } #menu > ul > li ul > li > a:hover > span { background: url('../images/arrow_left_tiny.png') left center no-repeat; padding-left: 12px; } #menu > ul > li ul > li > a.last_submenu_item{ padding: 7px 0px 7px; background: none; } #menu > ul > li ul > li > a:hover { text-decoration: none; } #menu > ul > li > div > ul > li > a { color: #444; } /* Dark Nav */ .dark_menu #menu { background: #393b3c url('../images/main_nav_bgr_dark.png') top left repeat-x; } .dark_menu #menu > ul > li > a .home_icon{ background: url('../images/home_icon.png') center center no-repeat; } .dark_menu #menu > ul > li { background: url('../images/main_nav_bgr_sep_dark.png') right top no-repeat; } .dark_menu #menu > ul > li > a { background: #393b3c url('../images/main_nav_bgr_dark.png') top left repeat-x; color: #fff; text-shadow: 0px 1px 0px #111; } .dark_menu #menu > ul > li:hover > a { background: url('../images/main_nav_bgr_dark_hover.png') top left repeat-x; } .dark_menu #menu > ul > li > a:hover { background: url('../images/main_nav_bgr_dark_hover.png') top left repeat-x; } .dark_menu #menu > ul > li > a > span { background: url('../images/arrow_down_tiny_dark.png') right center no-repeat; } .dark_menu #menu > ul > li > div { background: #4f5152; background-image: -moz-linear-gradient(#58595a,#414344); background-image: -o-linear-gradient(#58595a,#414344); background-image: -webkit-linear-gradient(#58595a,#414344); background-image: linear-gradient(#58595a,#414344); border: 1px solid #3b3d3e; border-top: 1px solid #212223; } .dark_menu #menu > ul > li > div > ul { border-top: 3px solid #45494b; } .dark_menu #menu > ul > li ul > li > a { color: #fff; text-shadow: 0px -1px 0px #343a3c; } .dark_menu #menu > ul > li ul > li > a { background: url('../images/main_nav_bgr_sep_vertical_dark.png') bottom left repeat-x; } .dark_menu #menu > ul > li ul > li > a > span { background: url('../images/arrow_left_tiny_dark.png') -20px center no-repeat; } .dark_menu #menu > ul > li ul > li > a:hover > span { background: url('../images/arrow_left_tiny_dark.png') left center no-repeat; } .dark_menu #menu > ul > li ul > li > a.last_submenu_item{ background: none; } /* Dark Nav : End */ /* Custom Nav */ .custom_menu #menu { background: #f5821f url('../images/grad_menu.png') top left repeat-x; } .custom_menu #menu > ul > li > a .home_icon{ background: url('../images/home_icon.png') center center no-repeat; } .custom_menu #menu > ul > li > a:hover .home_icon{ background: url('../images/home_icon.png') center center no-repeat; } .custom_menu #menu > ul > li { background: none; padding:0; } .custom_menu #menu > ul > li > a { background: #f5821f url('../images/grad_menu.png') top left repeat-x; text-shadow: none; color: #fff; text-shadow: 0 1px 0 rgba(0, 0, 0, 0.25); } .custom_menu #menu > ul > li:hover > a { background: #404040; color: #fff; } .custom_menu #menu > ul > li > a:hover { background: #404040; color: #fff; } .custom_menu #menu > ul > li > a > span { background: none; padding: 0; } .custom_menu #menu > ul > li > div { background: url('../images/menu.png') top left; border: none; box-shadow: none; left: 0; } .custom_menu #menu > ul > li > div > ul { border-top: none; } .custom_menu #menu > ul > li ul > li > a { color: #fff; text-shadow: none; } .custom_menu #menu > ul > li ul > li > a { background: none; } .custom_menu #menu > ul > li ul > li > a > span { background: url('../images/arrow_left_tiny_dark.png') -20px center no-repeat; } .custom_menu #menu > ul > li ul > li > a:hover > span { background: url('../images/arrow_left_tiny_dark.png') left center no-repeat; } .custom_menu #menu > ul > li ul > li > a.last_submenu_item{ background: none; } /* Custom Nav : End */ /* 3rd level */ .subsub_menu { display: none; position: absolute; top: -3px; left:97%; background: url('../images/menu_pale.png'); background-image: -moz-linear-gradient(#f8f8f8,#eeeeee); background-image: -o-linear-gradient(#f8f8f8,#eeeeee); background-image: -webkit-linear-gradient(#f8f8f8,#eeeeee); background-image: linear-gradient(#f8f8f8,#eeeeee); border: 1px solid #ddd; webkit-box-shadow: 1px 1px 3px rgba(0,0,0,0.12); -moz-box-shadow: 1px 1px 3px rgba(0,0,0,0.12); box-shadow: 1px 1px 3px rgba(0,0,0,0.12); z-index: 1021; padding: 3px 0 3px; -moz-border-radius: 4px 4px 4px 4px; -webkit-border-radius: 4px 4px 4px 4px; -khtml-border-radius: 4px 4px 4px 4px; border-radius: 4px 4px 4px 4px; } .dark_menu .subsub_menu { background: #4f5152; background-image: -moz-linear-gradient(#58595a,#414344); background-image: -o-linear-gradient(#58595a,#414344); background-image: -webkit-linear-gradient(#58595a,#414344); background-image: linear-gradient(#58595a,#414344); border: 1px solid #3b3d3e; box-shadow: none; } .custom_menu .subsub_menu { background: url('../images/menu.png') top left; border: none; box-shadow: none; left: 100%; } /* #menu > ul > li ul > li.active { position: relative; }*/ /* 3rd level : End */ /* 4rd level */ .subsubsub_menu { display: none; position: absolute; top: -3px; left:97%; background: url('../images/menu_pale.png'); background-image: -moz-linear-gradient(#f8f8f8,#eeeeee); background-image: -o-linear-gradient(#f8f8f8,#eeeeee); background-image: -webkit-linear-gradient(#f8f8f8,#eeeeee); background-image: linear-gradient(#f8f8f8,#eeeeee); border: 1px solid #ddd; webkit-box-shadow: 1px 1px 3px rgba(0,0,0,0.12); -moz-box-shadow: 1px 1px 3px rgba(0,0,0,0.12); box-shadow: 1px 1px 3px rgba(0,0,0,0.12); z-index: 1021; padding: 3px 0 3px; -moz-border-radius: 4px 4px 4px 4px; -webkit-border-radius: 4px 4px 4px 4px; -khtml-border-radius: 4px 4px 4px 4px; border-radius: 4px 4px 4px 4px; } .dark_menu .subsubsub_menu { background: #4f5152; background-image: -moz-linear-gradient(#58595a,#414344); background-image: -o-linear-gradient(#58595a,#414344); background-image: -webkit-linear-gradient(#58595a,#414344); background-image: linear-gradient(#58595a,#414344); border: 1px solid #3b3d3e; } .custom_menu .subsubsub_menu { background: url('../images/menu.png') top left; border: none; box-shadow: none; left: 100%; } /* 4rd level : End */ #select_menu { display: none; } /* #Main Navigation :: END ================================================== */ /* #Main containers + Common styles ================================================== */ #wrapper{ width: 990px; margin: 10px auto; text-align: left; background: white; } #wrapper.full_wrapper{ width: 100%; margin: 0px auto; padding: 20px 0 0; } .h5 { height: 5px; } .h10 { height: 10px; } .h15 { height: 1px; } .h20 { height: 20px; } .h40 { height: 40px; } .mt50 { margin-top: 50px !important; } .divider_bgr { background: url('../images/header_bgr_diag.png') left top; } .title { font-family: 'Tahoma', arial, sans-serif; font-weight: 400; background: url('../images/header_bgr_diag.png') left top; font-size: 20px; line-height: 18px; margin: 20px 0 22px; letter-spacing: -1px; } .title span{ background: #fff; padding-right: 12px; } .sidebar { padding-bottom: 20px; margin-top: -30px; } .sidebar .title { font-size: 18px; line-height: 18px; margin-top: 30px; } .heading { font-family: 'Tahoma', arial, sans-serif; font-weight: 300; font-size: 26px; line-height: 30px; margin: 30px 0 24px; letter-spacing: -1px; padding-bottom: 10px; background: url('../images/header_bgr.png') left top; } .heading span{ display: block; line-height: 30px; background: #fff; padding-bottom: 10px; } .header { height: 105px; } .header_left img{ margin-top: 5px; margin-right: 0; margin-bottom: 0; margin-left: 0; } .header_contacts { height: 20px; font-size: 12px; color: #888888; margin-top: 0px; margin-right: 0; margin-bottom: 0px; margin-left: 0; } .header_phone{ background: none no-repeat scroll left center #f5821f; color: #FFF; float: right; font-size: 20px; margin: 13px 0 10px; padding: 15px 28px; } .header_mail{ float: right; padding-left: 23px; background: url('../images/header_mail.png') left top no-repeat; font-size:16px; } .header_soc_search { margin-bottom: 6px; } .header_soc_twitter { float: right; width: 16px; height: 16px; background: url('../images/header_soc_twitter.png') left -16px no-repeat; margin: 8px 0 0 12px; text-indent: -10000px; } a:hover.header_soc_twitter { background: url('../images/header_soc_twitter.png') left top no-repeat; } .header_soc_fb { float: right; width: 16px; height: 16px; background: url('../images/header_soc_fb.png') left -16px no-repeat; margin: 8px 0 0 12px; text-indent: -10000px; } a:hover.header_soc_fb { background: url('../images/header_soc_fb.png') left top no-repeat; } .header_soc_rss { float: right; width: 16px; height: 16px; background: url('../images/header_soc_rss.png') left -16px no-repeat; margin: 8px 0 0 12px; text-indent: -10000px; } a:hover.header_soc_rss { background: url('../images/header_soc_rss.png') left top no-repeat; } .header_soc_search a { -webkit-transition: all 0.3s ease-out; -moz-transition: all 0.3s ease-out; -o-transition: all 0.3s ease-out; -ms-transition: all 0.3s ease-out; transition: all 0.3s ease-out; } .header_search { /* height: 32px; float: right; */ } .header_search form { margin-bottom: 0; } #s{ float: right; position: relative; top: 0px; right: -22px; width: 150px; margin-bottom: 0; border: 1px solid #eeeeee; padding: 7px 30px 7px 8px; font-size: 13px; color: #ccc; background: #fbfbfb; -moz-border-radius: 4px; -webkit-border-radius: 4px; border-radius: 4px; -moz-box-shadow: inset 0 0 6px rgba(0,0,0,.05); -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, .05); box-shadow: inset 0 0 6px rgba(0, 0, 0, .05); -webkit-transition: all 0.2s ease-out; -moz-transition: all 0.2s ease-out; -o-transition: all 0.2s ease-out; -ms-transition: all 0.2s ease-out; transition: all 0.2s ease-out; } #s:focus { width: 180px; border: 1px solid #eeeeee; color: #888; -moz-box-shadow: inset 0 0 6px rgba(0,0,0,.05); -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, .05); box-shadow: inset 0 0 6px rgba(0, 0, 0, .05); } #s:hover { width: 180px; } .button_search{ float: right; position: relative; top: 0px; right: 5px; padding: 0; background: url('../images/button_search.png') center center no-repeat; width: 22px; height: 31px; cursor: pointer; border: none; z-index: 100; box-shadow: none; } .button_search:hover{ background: url('../images/button_search.png') center center no-repeat; border: none; } .section_big_title { background:#f5821f; text-align: center; margin: 5px 0 5px; padding-top:15px; padding-bottom:5px; } .section_big_no_m { margin: 10px 0 0; } .section_big_title h1{ margin: 30px 0 0; font-family: 'Tahoma', arial, sans-serif; font-weight: 300; font-size: 31px; line-height: 38px; color:#444; letter-spacing: -1px; } .section_big_title h1 strong{ font-weight: 400; text-transform: uppercase; color:#f5821f; } .section_big_title h2{ margin: 2px 0 22px; font-family: 'Tahoma', arial, sans-serif; font-size: 21px; line-height: 28px; font-style: italic; font-weight: 300; color:#969696; } .carousel_section { position: relative; margin-bottom: 40px; } .section_featured_services{ position: relative; } .section_featured_services h4{ margin: 14px 0 6px; font-size: 16px; line-height: 24px; } .section_featured_services p{ color: #777; font-size: 12px; } .clients_list ul{ margin: 20px 0 !important; } .clients_list li{ float: left; margin: 0 10px; } .clients_list li img{ height: auto; max-width: 100%; } .services_list li img{ height: auto; max-width: 100%; -moz-border-radius: 3px; -webkit-border-radius: 3px; -khtml-border-radius: 3px; border-radius: 3px; } .services_description { padding-left: 16px; } .services_description h5 { margin: 20px 0 16px; font-size: 17px; } .services_description p { margin: 0 0 12px; } .services_description ul { margin-bottom: 30px; } .pic { position:relative; display: table; } .pic img{ width: 100%; display: block; -moz-border-radius: 3px; -webkit-border-radius: 3px; -khtml-border-radius: 3px; border-radius: 2px; } a .img_overlay { position: absolute; top:0; left: 0; width: 100%; height: 100%; background: #333; background-color: rgba(0, 0, 0, 0.3); background-image: url(../images/icon_plus.png); background-position: center center; background-repeat: no-repeat; opacity: 0; filter: alpha(opacity=0); z-index: 0; -webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; -ms-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; -moz-border-radius: 3px; -webkit-border-radius: 3px; -khtml-border-radius: 3px; border-radius: 3px; } a:hover .img_overlay { opacity: 1; filter: alpha(opacity=100); z-index: 1; } a .img_overlay_zoom { position: absolute; top:0; left: 0; width: 100%; height: 100%; background: #333; background-color: rgba(0, 0, 0, 0.3); background-image: url(../images/icon_zoom.png); background-position: center center; background-repeat: no-repeat; opacity: 0; filter: alpha(opacity=0); z-index: 0; -webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; -ms-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; -moz-border-radius: 3px; -webkit-border-radius: 3px; -khtml-border-radius: 3px; border-radius: 3px; } a:hover .img_overlay_zoom { opacity: 1; filter: alpha(opacity=100); z-index: 1; } .section_featured_texts { margin: 34px 0 40px; } .section_featured_texts_no_m { margin-bottom: 10px; } .section_featured_texts .icon{ float: left; margin: 1px 16px 66px 0; width: 37px; height: 37px; } .section_featured_texts h3 { font-weight: 600; font-size: 20px; line-height: 26px; color: #555; letter-spacing: -1px; margin-left: 54px; } .section_featured_texts h3 a{ color: #555; } .section_featured_texts h3 a:hover{ color: #f5821f; } .section_featured_texts p { color: #777; font-size: 13px; line-height: 21px; margin-right: 12px; margin-left: 54px; } .media_item { border-bottom: 1px dotted #EEE; margin: 20px 0 20px; padding-bottom:60px; } /* Icons */ .big_screen { background: url(../images/icon_big_screen.png) center center no-repeat; } .big_cog { background: url(../images/icon_big_cog.png) center center no-repeat; } .big_profile { background: url(../images/icon_big_profile.png) center center no-repeat; } .big_brush { background: url(../images/icon_big_brush.png) center center no-repeat; } .big_chat { background: url(../images/icon_big_chat.png) center center no-repeat; } .big_check { background: url(../images/icon_big_check.png) center center no-repeat; } .big_download { background: url(../images/icon_big_download.png) center center no-repeat; } .big_graph { background: url(../images/icon_big_graph.png) center center no-repeat; } .big_heart { background: url(../images/icon_big_heart.png) center center no-repeat; } .big_portfolio { background: url(../images/icon_big_portfolio.png) center center no-repeat; } .big_university { background: url(../images/icon_big_university.png) center center no-repeat; } .big_pencil { background: url(../images/icon_big_pencil.png) center center no-repeat; } /* LISTS */ ul.arrowed{ list-style: none; margin: 0; padding: 0; } ul.arrowed li { padding: 0 0 0 20px; background: url('../images/arrow.png') 0px 3px no-repeat; margin-bottom: 6px; } ul.dotted{ list-style: none; margin: 0; padding: 0; } ul.dotted li { padding: 0 0 0 20px; background: url('../images/dot.png') 0px 3px no-repeat; margin-bottom: 6px; } ul.checked{ list-style: none; margin: 0; padding: 0; } ul.checked li { padding: 0 0 0 26px; background: url('../images/check.png') 0px 3px no-repeat; margin-bottom: 6px; } /* Tipsy */ .tipsy { padding: 5px; font-size: 10px; position: absolute; z-index: 100000; } .tipsy-inner { padding: 2px 8px 2px 8px; background-color: black; color: white; max-width: 200px; text-align: center; } .tipsy-inner { border-radius: 3px; -moz-border-radius:3px; -webkit-border-radius:3px; } .tipsy-arrow { position: absolute; background: url('../images/tipsy.gif') no-repeat top left; width: 9px; height: 5px; } .tipsy-n .tipsy-arrow { top: 0; left: 50%; margin-left: -4px; } .tipsy-nw .tipsy-arrow { top: 0; left: 10px; } .tipsy-ne .tipsy-arrow { top: 0; right: 10px; } .tipsy-s .tipsy-arrow { bottom: 0; left: 50%; margin-left: -4px; background-position: bottom left; } .tipsy-sw .tipsy-arrow { bottom: 0; left: 10px; background-position: bottom left; } .tipsy-se .tipsy-arrow { bottom: 0; right: 10px; background-position: bottom left; } .tipsy-e .tipsy-arrow { top: 50%; margin-top: -4px; right: 0; width: 5px; height: 9px; background-position: top right; } .tipsy-w .tipsy-arrow { top: 50%; margin-top: -4px; left: 0; width: 5px; height: 9px; } .hilite { background: #7fe7f2; padding: 2px; } .hilite_dark { background: #4d5559; color: #fff; padding: 2px; } /* Testimonials */ .testimonials { position:relative; } .testimonial_quote { } .quote_content { background: #f8f8f8 url('../images/quote.png') 12px 12px no-repeat; border: 1px solid #e5e5e5; position:relative; -moz-border-radius: 3px; -webkit-border-radius: 3px; -khtml-border-radius: 3px; border-radius: 3px; } .quote_content p{ margin: 14px 14px 16px 46px; font-size: 13px; line-height: 20px; font-style: italic; color: #777; } .quote_arrow { width: 12px; height: 7px; position: absolute; bottom:-7px; left: 46px; background:url('../images/quote_arrow.png') 0px 0px no-repeat; } .quote_author { position: relative; left: 46px; margin-top: 12px; } .quote_author_description { display: block; color: #aaa; font-size: 11px; } .icon_testimonial { display: inline; background:url('../images/icon_testimonial.png') 0px 3px no-repeat; padding-left: 24px; font-size: 14px; font-weight: 600; } /* TABS */ .htabs { height: 27px; line-height: 15px; border-bottom: 1px solid #eeeeee; margin-right: 4px; } .htabs a { color: #666; background: #fafafa url('../images/grad_menu.png') top left repeat-x; border-top: 1px solid #e4e4e4; border-left: 1px solid #e4e4e4; border-right: 1px solid #e4e4e4; padding: 6px 10px 5px 10px; float: left; font-size: 13px; text-align: center; text-decoration: none; text-shadow: 0 1px 0 rgba(256, 256, 256, 0.8); margin-right: 4px; -moz-border-radius: 3px 3px 0px 0px; -webkit-border-radius: 3px 3px 0px 0px; -khtml-border-radius: 3px 3px 0px 0px; border-radius: 3px 3px 0px 0px; } .htabs a.selected { border-top: 1px solid #e4e4e4; border-left: 1px solid #e4e4e4; border-right: 1px solid #e4e4e4; padding-bottom: 6px; background: #FFFFFF; } .tab-content { border-left: 1px solid #e4e4e4; border-right: 1px solid #e4e4e4; border-bottom: 1px solid #e4e4e4; padding: 20px 20px 20px; margin-bottom: 20px; z-index: 2; overflow: auto; -moz-border-radius: 0 4px 4px 4px; -webkit-border-radius: 0 4px 4px 4px; -khtml-border-radius: 0 4px 4px 4px; border-radius: 0 4px 4px 4px; } /* Accordions */ .acc_holder { } .acc_item { padding: 12px 0px; margin: 0px 0 0; position: relative; cursor: pointer; -webkit-transition: all 0.3s linear; -moz-transition: all 0.3s linear; -ms-transition: all 0.3s linear; -o-transition: all 0.3s linear; transition: all 0.3s linear; background: #fff; -moz-border-radius: 4px; -webkit-border-radius: 4px; -khtml-border-radius: 4px; border-radius: 4px; } .acc_item:hover { background: #f8f8f8; } .acc_control { float: left; background: #778185 url('../images/acc_bgr.png') 0px -18px no-repeat; width: 18px; height: 18px; margin: 0 14px 0px 8px; -webkit-transition: all 0.2s linear; -moz-transition: all 0.2s linear; -ms-transition: all 0.2s linear; -o-transition: all 0.2s linear; transition: all 0.2s linear; -moz-border-radius: 17px; -webkit-border-radius: 17px; -khtml-border-radius: 17px; border-radius: 17px; } .active_acc .acc_control { background: #778185 url('../images/acc_bgr.png') 0px 0px no-repeat; } .acc_heading { display: block; margin-left: 40px; } .accordion { padding: 0px; margin: 0; -webkit-transition: all 0.2s linear; -moz-transition: all 0.2s linear; -ms-transition: all 0.2s linear; -o-transition: all 0.2s linear; transition: all 0.2s linear; font-size: 14px; font-weight:600; line-height: 18px; } .accordion.active_acc { background:url('../images/acc_bgr.png') 0px 0px no-repeat; } .accordion_content { display: none; padding: 10px 10px 0 40px; color: #777; } /* Page elements */ .page_heading{ margin: 0px 0 10px; background: url('../images/heading_bgr.png') left top repeat-x; } .page_heading h1{ display: inline; font-family: 'Tahoma', arial, sans-serif; font-weight: 300; font-size: 28px; line-height: 28px; background: #fff; margin:0; padding-right: 10px; } .breadcrumb { margin: 16px 0 0; height: 20px; line-height: 20px; } .breadcrumb a.first_bc{ -moz-border-radius: 4px 0 0 4px; -webkit-border-radius: 4px 0 0 4px; -khtml-border-radius: 4px 0 0 4px; border-radius: 4px 0 0 4px; } .breadcrumb a{ float: left; color: #666; font-size: 11px; background: #f8f8f8 url('../images/grad_menu.png') top left repeat-x; text-shadow: 0 1px 0 rgba(256,256,256,0.8); -webkit-transition: all 0.3s linear; -moz-transition: all 0.3s linear; -ms-transition: all 0.3s linear; -o-transition: all 0.3s linear; transition: all 0.3s linear; line-height: 20px; } .breadcrumb a:hover { color:#f5821f; } .breadcrumb a span{ display: block; line-height: 20px; background:url('../images/breadcrumb_divider.png') center right no-repeat; padding: 0 20px 0 12px; } .breadcrumb a.last_bc span{ display: block; line-height: 20px; background:url('../images/breadcrumb_divider_last.png') center right no-repeat; padding: 0 20px 0 12px; } .success, .warning, .attention, .information { padding: 8px 14px; margin-top: 6px; margin-bottom: 14px; -moz-border-radius: 4px; -webkit-border-radius: 4px; -khtml-border-radius: 4px; border-radius: 4px; } .success a, .warning a, .attention a, .information a{ color: #444; } .success { background: #d6f7e2; border: 1px solid #c2ebd1; } .warning { background: #ffe8e8; border: 1px solid #efd9d9; } .attention { background: #FFF5CC; border: 1px solid #f0e6bf; } .information { background: #e2f5f7; border: 1px solid #d1e9ec; } .success .close, .warning .close, .attention .close, .information .close { float: right; padding-top: 4px; padding-right: 4px; cursor: pointer; } .required { color: #ff4242; font-weight: bold; padding-left: 2px; } .error { display: block; color: #ff4242; } .close_img { width: 7px; height: 7px; float: right; margin: 7px 0 7px 20px; background:url('../images/close.png') 0px 0px no-repeat; cursor: pointer; } /* Sidebar Menu */ .box-category { padding: 0px; } .side_bar_menu { list-style: none; margin: 0; padding: 0; } .side_bar_menu > li { margin: 1px 0px; } .side_bar_menu > li + li { } .side_bar_menu > li > a { display: inline-block; color: #444; text-decoration: none; font-size: 13px; border-radius: 3px; position: relative; } .link_span{ display: block; padding: 4px 10px 4px 19px; position: relative; z-index: 21; text-shadow: 0 1px 0 rgba(256,256,256, 0.7); background: url('../images/arrow.png') 2px 7px no-repeat; } .side_bar_menu > li ul { margin: 1px 0 3px 10px; } .side_bar_menu > li a.active { background: #f7f7f7; } .side_bar_menu > li a:hover { } .side_bar_menu > li a.active + ul { display: block; } .side_bar_menu > li ul > li { margin: 1px 0px; } .side_bar_menu > li ul > li > a { display: inline-block; color: #444; font-size: 13px; text-decoration: none; border-radius: 3px; text-shadow: 0 0 1px #fff; position: relative; } .side_bar_menu > li ul > li > a.active { background-color: #f5f5f5; border-radius: 3px; text-shadow: 0 0 1px #fff; } .hover_span { display:block; width: 0; height: 100%; background: #fafafa url('../images/grad_menu.png') top left repeat-x; border-radius: 3px; position: absolute; top:0; z-index: 20; } .textwidget { padding: 0 0 10px; margin: 0px 0 0; } .tagcloud { padding: 0 0 10px; } .tagcloud a{ float: left; font-size: 12px; padding: 3px 7px; color: #555; text-shadow: 0 1px 0 rgba(256,256,256, 0.7); background: #fafafa url('../images/grad_menu.png') top left repeat-x; margin: 0 6px 6px 0; border: 1px solid #e6e6e6; -webkit-transition: all 0.2s ease-in-out; -moz-transition: all 0.2s ease-in-out; -o-transition: all 0.2s ease-in-out; -ms-transition: all 0.2s ease-in-out; transition: all 0.2s ease-in-out; border-radius: 2px; } .tagcloud a:hover{ color: #666; background-color: #eee; border: 1px solid #d5d5d5; } /* Blog Page */ .post_item { border-bottom: 1px dotted #eee; margin-bottom: 30px; } .post_title { margin: 24px 0 10px; font-size: 23px; line-height: 30px; } .post_meta { margin: 0; font-size: 12px; line-height: 20px; color: #999; } .post_meta a{ color: #888; } .post_meta a:hover{ color: #f5821f; } .calendar { margin-right: 8px; background: url('../images/blog_icon_date.png') 0px 1px no-repeat; padding: 0 12px 0 22px; border-right: 1px solid #ddd; } .author { margin-right: 8px; background: url('../images/blog_icon_author.png') 0px 1px no-repeat; padding: 0 12px 0 22px; border-right: 1px solid #ddd; } .comments { margin-right: 8px; background: url('../images/blog_icon_comments.png') 0px 1px no-repeat; padding: 0 12px 0 23px; border-right: 1px solid #ddd; } .tags { margin-right: 8px; background: url('../images/blog_icon_tags.png') 0px 0px no-repeat; padding: 0 12px 0 23px; } .post_description { margin: 16px 0 24px; } /* Post/Portfolio specific elements */ .post_description ul{ margin-bottom: 20px; margin-left: 12px; } .post_description h1{ margin-top: 20px; font-size: 24px; line-height: 30px; } .post_description h2{ margin-top: 16px; font-size: 21px; line-height: 27px; } .post_description h3{ margin-top: 14px; font-size: 18px; line-height: 24px; } .post_description h4{ margin-top: 10px; font-size: 16px; line-height: 21px; } .post_description h5{ margin-top: 10px; font-size: 15px; line-height: 20px; } .post_description p{ margin: 0 0 12px; } .padded_block { margin-bottom: 80px; } .half_padded_block { margin-bottom: 40px; position:relative; } .portfolio_page { margin-top: 32px; } .portfolio_description { margin-top: -20px; padding-left: 16px; } .portfolio_description h5 { margin: 20px 0 16px; font-size: 17px; } .portfolio_description p { margin: 0 0 12px; } .portfolio_description ul { margin-bottom: 30px; } /* Comments Section */ .comments_section { margin: 60px 0 60px; } .comments_section label { font-weight: normal; } .aqua_input, input[type="text"].aqua_input, input[type="password"].aqua_input, input[type="email"].aqua_input, textarea.aqua_input, select.aqua_input{ width: 250px; border: 1px solid #EEE; padding: 7px 8px 7px 8px; font-size: 13px; background: #FBFBFB; -moz-border-radius: 4px; -webkit-border-radius: 4px; border-radius: 4px; -moz-box-shadow: inset 0 0 6px rgba(0,0,0,.05); -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, .05); box-shadow: inset 0 0 6px rgba(0, 0, 0, .05); transition: all 0.3s cubic-bezier(0.4,0.1,0.2,0.7); -webkit-transition: all 0.3s cubic-bezier(0.4,0.1,0.2,0.7); -moz-transition: all 0.3s cubic-bezier(0.4,0.1,0.2,0.7); } textarea.aqua_input { width: 400px; } .aqua_input:focus { border: 1px solid #ccc !important; } /* Related Posts */ .related_posts_section { position: relative; margin: 0px 0 0 -10px; } .related_posts_section h4{ margin: 14px 0 8px; font-size: 16px; line-height: 21px; } .related_posts_section .meta_date { font-size: 12px; line-height: 12px; margin: 0 0 10px 0; color: #999; font-style: italic; } .related_posts_section p{ color: #777; font-size: 12px; line-height: 18px; } /* Comments */ .comment_list { margin: 40px 0; border-top: 1px solid #EEE; padding-top: 30px; } /* Comment List */ .comment_list ol { list-style: none; margin-left: 0px; } .comment_list ol.comment_sub { list-style: none; } li.comment .single_comment { padding: 20px 0; border-top: 1px dotted #ddd; } li.comment .single_comment.first_comment { border-top: none; } li.comment ol.comment_sub { margin-left: 65px; } /* Comment List Content */ .comment_list ol .comment_avatar { float: left; margin-right: 15px; } .comment_list ol .comment_avatar a.comment_edit { display: block; margin-top: 12px; text-align: center; font-style: italic; } .comment_list ol .comment_content { overflow: hidden; } .comment_list ol .comment_name { font-weight: bold; } .comment_list ol .comment_name span{ font-weight: normal; color: #aaa; margin: 0 8px; } .comment_list ol .comment_name a { font-size: 14px; font-weight: 600; } .comment_list ol .comment_name a.comment_reply { font-size: 13px; font-weight: normal; } .comment_list ol .comment_desc { font-size: 12px; margin-bottom: 16px; color: #999; font-style: italic; } /* Pagination */ .pagination { margin-bottom: 20px; } .pagination .links { float: left; font-size: 13px; line-height: 16px; } .pagination .links a { display: inline-block; padding: 4px 10px; text-decoration: none; background: #f8f8f8 url('../images/grad_menu.png') top left repeat-x; -moz-border-radius: 4px; -webkit-border-radius: 4px; -khtml-border-radius: 4px; border-radius: 4px; text-shadow: 0px 1px 0px #fff; color: #666; font-weight: 400; } .pagination .links a:hover { background-color: #f5821f; color: white; text-shadow: none; } .pagination .links b { display: inline-block; padding: 3px 9px; font-weight: normal; text-decoration: none; color: #555; font-weight: 400; cursor: default; } .pagination .results { float: right; padding-top: 3px; } /* Sidebar Latest Posts */ .latest_post_sidebar { font-size: 11px; line-height: 15px; margin-right: 8px; } .latest_post_sidebar img { float: left; width: 52px; height: 52px; border: 1px solid #ddd; padding: 3px; background: #fff; margin: 2px 14px 22px 0; -webkit-transition: all 0.3s linear; -moz-transition: all 0.3s linear; -ms-transition: all 0.3s linear; -o-transition: all 0.3s linear; transition: all 0.3s linear; } .latest_post_sidebar img:hover { border: 1px solid #bbb; } .latest_post_sidebar p{ font-size: 11px; line-height: 15px; margin-bottom: 8px; } .latest_post_sidebar p.date{ color: #999; } .latest_post_sidebar p.latest_post_sidebar_title { padding-top: 2px; font-size: 12px; line-height: 15px; } /* Portfolio Page */ .portfolio { margin: 20px -20px 20px 0; } #portfolio_items { margin-right: -20px; } .portfolio_filter { margin: 20px 0; } .portfolio_filter span{ float: left; margin: 0 6px 6px 0; font-size: 12px; padding: 5px 12px; color: #555; } .portfolio_filter div{ float: left; font-size: 12px; padding: 5px 12px; color: #555; text-shadow: 0 1px 0 rgba(256,256,256, 0.7); background: #fafafa url('../images/grad_menu.png') top left repeat-x; margin: 0 6px 6px 0; -webkit-transition: all 0.2s ease-in-out; -moz-transition: all 0.2s ease-in-out; -o-transition: all 0.2s ease-in-out; -ms-transition: all 0.2s ease-in-out; transition: all 0.2s ease-in-out; border-radius: 2px; cursor: pointer; } .portfolio_filter div:hover{ color: #fff; background-color: #374045; text-shadow: 0 1px 0 rgba(0, 0, 0, 0.1); } .portfolio_filter div.current{ color: #fff; background-color: #f5821f; text-shadow: 0 1px 0 rgba(0, 0, 0, 0.1); } .portfolio_item { float: left; width: 300px; margin-right: 20px; margin-bottom: 20px; } .portfolio_item .pic img{ -webkit-border-radius: 3px 3px 0 0; -moz-border-radius: 3px 3px 0 0; border-radius: 3px 3px 0 0; } .portfolio_item a h4{ text-align: center; font-size: 14px; line-height: 20px; margin: 0; -webkit-border-radius: 0 0 4px 4px; -moz-border-radius: 0 0 4px 4px; border-radius: 0 0 4px 4px; color: #333; padding: 10px; -webkit-transition: all 0.2s ease-in-out; -moz-transition: all 0.2s ease-in-out; -o-transition: all 0.2s ease-in-out; -ms-transition: all 0.2s ease-in-out; transition: all 0.2s ease-in-out; -webkit-border-radius: 0 0 4px 4px; -moz-border-radius: 0 0 4px 4px; border-radius: 0 0 4px 4px; background: #fcfcfc url('../images/grad_menu.png') top left repeat-x; text-shadow: 0 1px 0 rgba(256, 256, 256, 0.8); } .portfolio_item a:hover h4{ color: #222; background-color: #e5e5e5; text-shadow: 0 1px 0 rgba(256, 256, 256, 0.6); } .portfolio_item a h5{ text-align: center; font-size: 13px; line-height: 16px; margin: 0; -webkit-border-radius: 0 0 4px 4px; -moz-border-radius: 0 0 4px 4px; border-radius: 0 0 4px 4px; color: #333; padding: 8px; -webkit-transition: all 0.2s ease-in-out; -moz-transition: all 0.2s ease-in-out; -o-transition: all 0.2s ease-in-out; -ms-transition: all 0.2s ease-in-out; transition: all 0.2s ease-in-out; -webkit-border-radius: 0 0 4px 4px; -moz-border-radius: 0 0 4px 4px; border-radius: 0 0 4px 4px; background: #fcfcfc url('../images/grad_menu.png') top left repeat-x; text-shadow: 0 1px 0 rgba(256, 256, 256, 0.8); } .portfolio_item a:hover h5{ color: #222; background-color: #e5e5e5; text-shadow: 0 1px 0 rgba(256, 256, 256, 0.6); } /* About Page */ .team_block { margin: 30px 0; } .team_block h4{ margin: 20px 0 6px; text-align: center; font-weight: 600; font-size: 15px; line-height: 22px; } .team_block .team_desc{ font-style: italic; color: #aaa; text-align: center; } .team_block p{ } /* Table */ .aqua_table { margin: 20px 0; } .aqua_table th { border: 1px solid #e2e2e2; background: #fcfcfc url('../images/grad_menu.png') top left repeat-x; text-align: center; padding: 8px 14px; font-size: 14px; text-align: left; font-weight: 600; } .aqua_table td { padding: 8px 14px; border: #e2e2e2 1px solid; -webkit-transition: all 0.3s linear; -moz-transition: all 0.3s linear; -ms-transition: all 0.3s linear; -o-transition: all 0.3s linear; transition: all 0.3s linear; } .aqua_table tr.odd td { background: #f9f9f9; } .aqua_table tr:hover td { background: #edf9fa; } .aqua_table td.b{ font-weight: 600; } .al_right { text-align: right; } .no_bm { margin-bottom: 0; } /* Sequence Slider */ #slider_holder { height: 100%; position: relative; } #sequence { /*backface-visibility prevents graphical glitches when frames are animating*/ -webkit-backface-visibility: hidden; -moz-backface-visibility: hidden; -ms-backface-visibility: hidden; -o-backface-visibility: hidden; backface-visibility: hidden; overflow: hidden; } #sequence ul { margin: 0; } #sequence ul li{ z-index: 1; margin: 0 !important; } .prev, .next { cursor: pointer; position: absolute; top: 170px; height: 41px; width: 41px; z-index: 20; background: #556167; background: rgba(85, 97, 103, 0.7); transition: all 0.3s; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; filter: alpha(opacity=0); opacity: 0; -moz-border-radius: 21px; -webkit-border-radius: 21px; -khtml-border-radius: 21px; border-radius: 21px; } .prev { left: 15px; } .next { right: 15px; } .next > span, .prev > span { background: url(../images/slider_arrows.png) no-repeat; display: block; height: 21px; width: 21px; margin: 10px; -webkit-transition: all 0.4s cubic-bezier(0.165, 0.840, 0.440, 1.000); -moz-transition: all 0.4s cubic-bezier(0.165, 0.840, 0.440, 1.000); -ms-transition: all 0.4s cubic-bezier(0.165, 0.840, 0.440, 1.000); -o-transition: all 0.4s cubic-bezier(0.165, 0.840, 0.440, 1.000); transition: all 0.4s cubic-bezier(0.165, 0.840, 0.440, 1.000); } .prev > span { background-position: 0px 0px; } .next > span { background-position: -21px 0px; } .next:hover,.prev:hover { background: #f5821f; } .next:hover span,.prev:hover span{ background-position-y: -21px; } #sequence li > * { position: absolute; } #sequence { height: 300px; margin: 0 auto; position: relative; max-width: 1400px; } .info { color: black; left: 80%; top: 10%; width: 40%; z-index: 10; vertical-align: middle; opacity: 0; filter: alpha(opacity=0); display: none; } .info.animate-in { left: 5%; top: 10%; opacity: 1; filter: alpha(opacity=100); -webkit-transition: all 1s cubic-bezier(0.165, 0.840, 0.440, 1.000) 0.5s; -moz-transition: all 1s cubic-bezier(0.165, 0.840, 0.440, 1.000) 0.5s; -ms-transition: all 1s cubic-bezier(0.165, 0.840, 0.440, 1.000) 0.5s; -o-transition: all 1s cubic-bezier(0.165, 0.840, 0.440, 1.000) 0.5s; transition: all 1s cubic-bezier(0.165, 0.840, 0.440, 1.000) 0.5s; } .info.animate-out { left: 80%; filter: alpha(opacity=0); opacity: 0; -webkit-transition: all 0.2s ease-out; -moz-transition: all 0.2s ease-out; -ms-transition: all 0.2s ease-out; -o-transition: all 0.2s ease-out; transition: all 0.2s ease-out; } .info h2{ color: #fff; /* text-shadow: 0 1px 0 rgba(0,0,0,0.2);*/ background: #f5821f; padding: 0px 7px; font-size: 38px; line-height: 45px; letter-spacing: -1px; text-transform: uppercase; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; display: inline-block; margin: 0 0 6px 0; } .info h3{ color: #fff; background: #404b50; padding: 4px 6px; font-size: 26px; line-height: 26px; letter-spacing: 0px; text-transform: uppercase; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; display: inline-block; margin: 0 0 24px 0; } .info p{ color: #3c4549; width:80%; font-size: 17px; line-height: 27px; text-shadow: 0 1px 0 rgba(256, 256, 256, 0.5); margin: 0 0 28px; } .info a.link{ color: #3c4549; width:80%; font-size: 14px; line-height: 25px; text-shadow: 0 1px 0 rgba(256, 256, 256, 0.5); margin: 0 0 14px; } .slider_img { max-height: 100%; width: auto; left: 0%; top: 0px; filter: alpha(opacity=0); opacity: 0; z-index: 6; } .slider_img.animate-in { left: 25%; top: 0px; filter: alpha(opacity=100); opacity: 1; z-index: 4; /* -webkit-transition: all 1s cubic-bezier(0.2,0.1,0.1,0.9) 0.3s; -moz-transition: all 1s cubic-bezier(0.2,0.1,0.1,0.9) 0.3s; -ms-transition: all 1s cubic-bezier(0.2,0.1,0.1,0.9) 0.3s; -o-transition: all 1s cubic-bezier(0.2,0.1,0.1,0.9) 0.3s; transition: all 1s cubic-bezier(0.5,0.1,0.1,0.9) 0.3s; */ -webkit-transition: all 500ms cubic-bezier(0.165, 0.840, 0.440, 1.000) 0.3s; -moz-transition: all 500ms cubic-bezier(0.165, 0.840, 0.440, 1.000) 0.3s; -ms-transition: all 500ms cubic-bezier(0.165, 0.840, 0.440, 1.000) 0.3s; -o-transition: all 500ms cubic-bezier(0.165, 0.840, 0.440, 1.000) 0.3s; transition: all 500ms cubic-bezier(0.165, 0.840, 0.440, 1.000) 0.3s; } .slider_img.animate-out { left: -340%; top: 0px; filter: alpha(opacity=0); opacity: 0; z-index: 2; -webkit-transition: all 0.3s ease-out; -moz-transition: all 0.3s ease-out; -ms-transition: all 0.3s ease-out; -o-transition: all 0.3s ease-out; transition: all 0.3s ease-out; } .slider_bgr { height: auto; width: 100%; left: 0; filter: alpha(opacity=0); opacity: 0; top: 0; vertical-align: middle; -webkit-transition: all 0.3s ease-out; -moz-transition: all 0.3s ease-out; -ms-transition: all 0.3s ease-out; -o-transition: all 0.3s ease-out; transition: all 0.3s ease-out; z-index: 1; } .slider_bgr.animate-in { filter: alpha(opacity=100); opacity: 1; z-index: 1; } .slider_bgr.animate-out { filter: alpha(opacity=0); opacity: 0; -webkit-transition: all 0.3s ease-out; -moz-transition: all 0.3s ease-out; -ms-transition: all 0.3s ease-out; -o-transition: all 0.3s ease-out; transition: all 0.3s ease-out; z-index: 1; } .sequence-preloader .preloading .circle { fill: #ccc !important; } div.inline{ background-color: #ccc !important; } /* Sequence Slider::END */ /* #Footer ================================================== */ #footer { width: 990px; clear: both; overflow: auto; background: #2d3032; font-size: 12px; color: #757d82; } #wrapper.full_wrapper #footer { width: 100%; } .footer_inside { margin: 20px 15px; } #wrapper.full_wrapper .footer_inside { width: 960px; margin: 20px auto; } #footer h3 { color: #d1d6d9; font-size: 15px; line-height: 21px; margin-top: 0px; margin-bottom: 14px; } #footer.footer_dark h3{ color: #818f96; text-shadow: 0px -1px 0px #111; } #footer .column { float: left; width: 18%; min-height: 100px; } #footer .big_column { float: right; width: 28%; min-height: 100px; } #footer p { margin-bottom: 0; } /* Footer Icons*/ .icon_tweet { float: right; width: 23px; height: 23px; background: url('../images/icon_tweet.png') center -23px no-repeat; text-indent: -9999px; margin-left: 12px; } a.icon_tweet:hover { background: url('../images/icon_tweet.png') center top no-repeat; } .icon_facebook { float: right; width: 23px; height: 23px; background: url('../images/icon_facebook.png') center -23px no-repeat; text-indent: -9999px; margin-left: 12px; } a.icon_facebook:hover { background: url('../images/icon_facebook.png') center top no-repeat; } .icon_pinterest { float: right; width: 23px; height: 23px; background: url('../images/icon_pinterest.png') center -23px no-repeat; text-indent: -9999px; margin-left: 12px; } a.icon_pinterest:hover { background: url('../images/icon_pinterest.png') center top no-repeat; } .icon_skype { float: right; width: 23px; height: 23px; background: url('../images/icon_skype.png') center -23px no-repeat; text-indent: -9999px; margin-left: 12px; } a.icon_skype:hover { background: url('../images/icon_skype.png') center top no-repeat; } .icon_google { float: right; width: 23px; height: 23px; background: url('../images/icon_google.png') center -23px no-repeat; text-indent: -9999px; margin-left: 12px; } a.icon_google:hover { background: url('../images/icon_google.png') top center no-repeat; } .icon_phone { font-size: 13px; line-height: 24px; background: url('../images/icon_footer_phone.png') left 4px no-repeat; padding: 0 0 0 30px; margin-bottom: 6px; } .icon_mail { font-size: 13px; line-height: 24px; background: url('../images/icon_footer_mail.png') left 5px no-repeat; padding: 0 0 0 30px; margin-bottom: 6px; } .icon_loc { font-size: 13px; line-height: 24px; background: url('../images/icon_footer_loc.png') left 3px no-repeat; padding: 0 0 0 30px; margin-bottom: 6px; } #footer.footer_dark .icon_phone, #footer.footer_dark .icon_mail, #footer.footer_dark .icon_loc{ color: #748188; text-shadow: none; } #footer .columns ul { margin: 0px 0 0 18px; list-style: none; padding: 0; } #footer .columns ul li { margin-bottom: 4px; background: url('../images/arrow_footer_list.png') -5px 1px no-repeat; padding-left: 16px; } .margined_left { margin-left: 18px; } #footer a { text-decoration: none; padding: 0px; font-size: 12px; line-height: 15px; color:#949ea3; -webkit-transition: all 0.2s ease-out; -moz-transition: all 0.2s ease-out; -o-transition: all 0.2s ease-out; -ms-transition: all 0.2s ease-out; transition: all 0.2s ease-out; } #footer a:hover { color:#f5821f; } .footer_pic img{ float:left; border: 3px solid #ededed; margin: 2px 14px 22px 0; -webkit-transition: all 0.3s linear; -moz-transition: all 0.3s linear; -ms-transition: all 0.3s linear; -o-transition: all 0.3s linear; transition: all 0.3s linear; } .footer_pic img:hover{ border: 3px solid #f5821f; } .footer_news_item { font-size: 11px; line-height: 15px; margin-right: 12px; } .footer_news_item p{ font-size: 11px; line-height: 15px; margin-bottom: 12px; } .footer_news_item h4 { font-size: 12px; line-height: 15px; color:#949ea3; } #powered { float: left; margin-top: 1px; margin-right: 10px; font-size: 11px; color: #748188; } #powered a{ font-size: 11px; } .footer_btm { clear: both; overflow: auto; padding: 10px 20px 10px; background: #222425; border-top: 1px solid #373737; -moz-border-radius: 0 0 4px 4px; -webkit-border-radius: 0 0 4px 4px; -khtml-border-radius: 0 0 4px 4px; border-radius: 0 0 4px 4px; } #wrapper.full_wrapper .footer_btm_inner { width: 960px; margin: 0px auto; } /* #Footer :: END ================================================== */ /* #Template Styles ================================================== */ /* Custom Menu BGR COLOR */ .custom_menu #menu, .custom_menu #menu > ul > li > a { } /* Menu Font */ .custom_menu #menu > ul > li > a { } /* Menu Font Size */ #menu > ul > li > a { } /* HighLight Color */ /* a:hover, a:focus { color: hex ; } .button:hover,a:hover.button,button:hover,input[type="submit"]:hover,input[type="reset"]:hover, input[type="button"]:hover, .button_hilite, a.button_hilite { color: #fff; background-color: hex ;} .button_hilite, a.button_hilite { color: #fff; background-color: hex ;} .button_hilite:hover, a:hover.button_hilite { color: #fff; background-color: #374045;} .section_big_title h1 strong { color: hex ;} .section_featured_texts h3 a:hover { color: hex ;} .breadcrumb a:hover{ color: hex ;} .post_meta a:hover{ color: hex ;} .portfolio_filter div.current{ background-color: hex ;} .next:hover,.prev:hover{ background-color: hex ;} .pagination .links a:hover{ background-color: hex ;} .info h2{ background-color: hex ;} #footer a:hover { color: hex ;} .footer_pic img:hover{ border: 3px solid hex ;} .jcarousel-next-horizontal:hover, .jcarousel-prev-horizontal:hover { background-color: hex ;} */ /* Title Font */ h1, h2, h3, h4, h5, .title, .section_big_title h1, .heading, #footer h3 { color: #333333; } /* Button Font */ .button, a.button, button, input[type="submit"], input[type="reset"], input[type="button"] { } /* Body Font */ body { } /* #Template Styles::END ================================================== */ /* CUSTOM RESPONSIVE STYLES */ /* #Tablet (Portrait) ================================================== */ /* Note: Design for a width of 768px */ @media only screen and (min-width: 768px) and (max-width: 959px) { #wrapper, #wrapper.full_wrapper { width: 100%; margin: 0px auto; border-radius: 0px; padding:0;} #footer { width: 100%; } .footer_inside, #wrapper.full_wrapper .footer_inside { margin: 20px auto; width: 768px; } .footer_btm { border-radius: 0; } .footer_btm_inner, #wrapper.full_wrapper .footer_btm_inner { width: 748px; margin: 0px auto; } /* Sequence slider */ .prev, .next { top: 130px; height: 33px; width: 33px; } .prev { left: 10px; } .next { right: 10px; } .next > span, .prev > span { margin: 6px; } #sequence { height: 318px; } .info h2 { padding: 0px 5px;font-size: 27px;line-height: 35px;margin: 0 0 5px 0;} .info h3 { padding: 4px 6px;font-size: 20px;line-height: 20px; margin: 0 0 20px 0;} .info p { font-size: 14px;line-height: 22px;margin: 0 0 20px;width: 100%;} .info a.link { font-size: 14px;line-height: 25px;margin: 0 0 14px;} } /* #Mobile (Portrait) ================================================== */ /* Note: Design for a width of 320px */ @media only screen and (max-width: 767px) { #wrapper, #wrapper.full_wrapper { width: 100%; margin: 0px auto; border-radius: 0px; padding:0; } #footer { width: 100%; } .footer_inside, #wrapper.full_wrapper .footer_inside { margin: 0px auto 10px; width: 300px; } .footer_btm { border-radius: 0; } .footer_btm_inner, #wrapper.full_wrapper .footer_btm_inner { width: 300px; margin: 0px auto; } .header_left { text-align: center;} .header_left img { margin: 40px 0 0 0px; max-width: 100%; height: auto;} .header_right { text-align: center;} #menu { display: none; } #select_menu { display: block; width: 100%; padding: 8px; margin-bottom: 0;} .header_contacts { text-align: center; margin: 20px 0 20px; height: auto; } .header_phone { float: none; display: inline; margin: 4px 14px 25px 0;font-size:15px; } .header_mail { float: none; display:none; margin-top: 4px;line-height:15px} .header_search { float: left; } #s { right: auto;} #s:focus, #s:hover { width: 150px; } .button_search { right: 26px; } .columns.title, .column.title { margin: 20px 0 22px; } .margined_left { margin-left: 0; } #footer h3 { margin-top: 30px; } #footer .columns ul { margin-left: 0; } #powered { display: none; } /* Page Specific */ .related_posts_section { margin: 0; } textarea.aqua_input { width: 280px; } .page_heading h1 { font-size: 20px;} .section_big_title { margin: 10px 0 24px !important;} .section_featured_services .jcarousel-next-horizontal, .carousel_section .jcarousel-next-horizontal { right: 0px !important; } .section_featured_services .jcarousel-prev-horizontal, .carousel_section .jcarousel-prev-horizontal { right: 20px !important; } .section_featured_services .carousel_arrows_bgr, .carousel_section .carousel_arrows_bgr { width: 44px !important; } .htabs a { padding: 6px 7px 5px 7px; font-size: 12px; margin-right: 2px; } .portfolio_description { padding-left: 0; } .services_description { padding-left: 0; margin-top: 20px !important; } /* Sequence slider */ .prev, .next { top: 40%; height: 30px; width: 30px;} .prev { left: 0px; } .next { right: 0px; } .next > span, .prev > span { margin: 4px; } #sequence { height: 128px; } .info { top: 25%; } .info.animate-in { top: 25%; } .info h2 { padding: 0px 5px;font-size: 13px;line-height: 22px;margin: 0 0 3px 0; letter-spacing: 0;} .info h3 { padding: 2px 4px;font-size: 10px;line-height: 15px; margin: 0 0 10px 0;} .info p { display: none; } .info a.link { font-size: 10px;line-height: 22px;margin: 0 0 10px;} } /* #Mobile (Landscape) ================================================== */ /* Note: Design for a width of 480px */ @media only screen and (min-width: 480px) and (max-width: 767px) { .footer_inside, #wrapper.full_wrapper .footer_inside { margin: 0px auto 20px; width: 420px; padding:0; } .footer_btm_inner, #wrapper.full_wrapper .footer_btm_inner { margin: 0px auto; width: 420px; } #powered { display: block; } /* Page Specific */ .htabs a { padding: 6px 10px 5px 10px; font-size: 13px; } /* Sequence slider */ .prev, .next { top: 40%; height: 30px; width: 30px; } .prev { left: 0px; } .next { right: 0px; } .next > span, .prev > span { margin: 4px; } #sequence { height: 179px; } .info { top: 14%; } .info.animate-in { top: 14%; } .info h2 { padding: 0px 5px;font-size: 19px;line-height: 28px;margin: 0 0 2px 0;} .info h3 { padding: 4px 6px;font-size: 14px;line-height: 15px; margin: 0 0 6px 0;} .info p { display: block; font-size: 10px;line-height: 15px;margin: 0 0 6px;width: 100%;} .info a.link { font-size: 10px;line-height: 18px;margin: 0 0 0px;} } /** NEW STYLES **/ .service-tabs li { display:inline; padding:10px; color:#fff; margin-top:20px; } .service-tabs li a { color:#fff; } .service-tabs li a:hover { color:#000; } .colored { color:#f5821f; } .two.columns img { height: 70px; width: 70px; margin-top:29px; margin-left:13px; } .eight.columns .five.columns p { line-height: 15px; margin: 5px 0 10px; } .eight.columns .five.columns { padding: 0 10px; background:#f0f0f0; margin-bottom:10px; } .eight.columns .five.columns .button.sm_button { margin-top: 8px; } .eight.columns .five.columns h3 { margin-bottom:0; padding-top:5px; } tbody p { background: none repeat scroll 0 0 #e0e0e0; height: 110px; width: 320px; margin: 0 0 25px; padding: 0 10px;} .three.columns img { height: 100px; width: 100px; } .two.columns img { height: 70px; width: 70px; margin-top:29px; margin-left:13px; } .service-tabs li a { font-size: 13px; font-weight: 800;} #menu li:last-child { background: none; } .row.padded_block img {height: 120px; margin: 13px; width: 210px; border-radius: 3px 3px 0 0;} p { margin: 0 0 20px; text-align: justify; }