/* ---------------------------------------------------------------------------- # FLATNA: # Created by: DNNRox # Date: Jan 1, 2014 # Website: http://www.dnnrox.com # Version: 2.0 ---------------------------------------------------------------------------- */ /* ================================================== # SPACERS ================================================== */ /* --- Top Positive Margins --- */ .space5 { margin-top: 5px !important } .space10 { margin-top: 10px !important } .space15 { margin-top: 15px !important } .space20 { margin-top: 20px !important } .space25 { margin-top: 25px !important } .space30 { margin-top: 30px !important } .space35 { margin-top: 35px !important } .space40 { margin-top: 40px !important } .space45 { margin-top: 45px !important } .space50 { margin-top: 50px !important } .space55 { margin-top: 55px !important } .space60 { margin-top: 60px !important } .space80 { margin-top: 80px !important } .space100 { margin-top: 100px !important } .space120 { margin-top: 120px !important } /* --- Bottom Possitive Margins --- */ .space-5 { margin-bottom: 5px !important } .space-10 { margin-bottom: 10px !important } .space-15 { margin-bottom: 15px !important } .space-20 { margin-bottom: 20px !important } .space-25 { margin-bottom: 25px !important } .space-30 { margin-bottom: 30px !important } .space-35 { margin-bottom: 35px !important } .space-40 { margin-bottom: 40px !important } .space-45 { margin-bottom: 45px !important } .space-50 { margin-bottom: 50px !important } .space-55 { margin-bottom: 55px !important } .space-60 { margin-bottom: 60px !important } .space-80 { margin-bottom: 80px !important } .space-100 { margin-bottom: 100px !important } .space-120 { margin-bottom: 120px !important } /* --- Bottom Negative Margins --- */ .nspace-5 { margin-bottom: -5px !important } .nspace-10 { margin-bottom: -10px !important } .nspace-15 { margin-bottom: -15px !important } .nspace-20 { margin-bottom: -20px !important } .nspace-25 { margin-bottom: -25px !important } .nspace-30 { margin-bottom: -30px !important } .nspace-35 { margin-bottom: -35px !important } .nspace-40 { margin-bottom: -40px !important } .nspace-45 { margin-bottom: -45px !important } .nspace-50 { margin-bottom: -50px !important } .nspace-55 { margin-bottom: -55px !important } .nspace-60 { margin-bottom: -60px !important } .nspace-80 { margin-bottom: -80px !important } /* --- Top Negative Margins --- */ .nspace5 { margin-top: -5px !important } .nspace10 { margin-top: -10px !important } .nspace15 { margin-top: -15px !important } .nspace20 { margin-top: -20px !important } .nspace25 { margin-top: -25px !important } .nspace30 { margin-top: -30px !important } .nspace35 { margin-top: -35px !important } .nspace40 { margin-top: -40px !important } .nspace45 { margin-top: -45px !important } .nspace50 { margin-top: -50px !important } .nspace55 { margin-top: -55px !important } .nspace60 { margin-top: -60px !important } .padding-top60 { padding-top: 60px !important } .padding-top40 { padding-top: 40px !important } .padding-top30 { padding-top: 30px !important } .padding-top20 { padding-top: 20px !important } .padding-right60 { padding-right: 60px !important } .padding-right50 { padding-right: 50px !important } .padding-right40 { padding-right: 40px !important } .padding-right30 { padding-right: 30px !important } .padding-right20 { padding-right: 20px !important } .padding-left60 { padding-left: 60px !important } .padding-left50 { padding-left: 50px !important } .padding-left40 { padding-left: 40px !important } .padding-left30 { padding-left: 30px !important } .padding-left20 { padding-left: 20px !important } .no-margin { margin: 0 !important } .nomargin { margin: 0 !important } .no-padding { padding: 0 !important } .no-right-padding { padding-right: 0 !important } .no-left-padding { padding-left: 0 !important } .float-left { float: left !important } .float-right { float: right !important } .dl-horizontal dd { margin-left: 100px !important } /* ================================================== # Default ================================================== */ body { font-weight: 300 } a:focus { outline: 0px } h1.boxed { font-family: OpenSansLight; line-height: 44px; margin: auto; text-transform: none !important; width: 85%; } /* Demo Only */ .header-types { list-style: none outside none } .header-types li { padding: 20px } .header-types img { border-radius: 4px; width: 100%; } /* ================================================== # Typography ================================================== */ h1 { font-size: 38px; line-height: 42px; margin-bottom: 7px; } h2 { font-size: 32px; line-height: 36px; margin-bottom: 10px; } h3 { font-size: 26px; line-height: 34px; margin-bottom: 7px; } h4 { font-size: 19px; line-height: 32px; margin-bottom: 7px; } h5 { font-size: 16px; line-height: 26px; margin-bottom: 7px; } h6 { font-size: 14px; line-height: 24px; margin-bottom: 7px; } h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6 { font-family: 'OpenSansSemiBold'; font-weight: normal !important; letter-spacing: -0.5px; line-height: 1.9 !important; } .bold, strong, b { font-family: OpenSansBold; font-weight: normal !important; color: #000; } .uppercase { -webkit-font-smoothing: antialiased; font-family: 'OpenSansbold'; text-transform: uppercase !important; } .lowercase { text-transform: none !important } .centered { text-align: center !important } .align-right { text-align: right !important } .align-left { text-align: left!important } .service-block { margin-bottom: -20px; padding-top: 40px; position: relative; } .absolute { position: absolute !important } .img-with-animation { max-width: 100% } .lg-font { font-size: 32px !important; line-height: 40px !important; text-transform: uppercase !important; } .light { font-family: 'OpenSansLight' !important; font-weight: normal; letter-spacing: normal; } h1.light, h2.light, h3.light, h4.light, h5.light, h6.light, p.light { text-transform: none; -webkit-font-smoothing: antialiased; } .light h1, .light h2, .light h3, .light h4, .light h5, .light h6 { color: #FFFFFF } h1.light { font-size: 34px; margin-bottom: 30px; } h2.light { font-size: 28px; margin-bottom: 30px; letter-spacing: 0.5px; } h3.light { font-size: 24px; margin-bottom: 15px; letter-spacing: 0.5px; } h4.light { font-size: 18px; margin-bottom: 7px; } h5.light { font-size: 16px; margin-bottom: 7px; letter-spacing: 0.5px; } h6.light { font-size: 14px; margin-bottom: 7px; letter-spacing: 0.5px; } h1.uppercase { letter-spacing: 3px } h2.uppercase { letter-spacing: 2.5px } h3.uppercase { letter-spacing: 2px } h4.uppercase { letter-spacing: 2px } h5.uppercase { letter-spacing: 1.3px } h6.uppercase { letter-spacing: 1.3px } h4.light { font-size: 18px; margin-bottom: 7px; } h1 .rox-button, h2 .rox-button, h3 .rox-button, h4 .rox-button { margin-left: 13px } .text-align-center { text-align: center } .section-title { font-size: 30px; line-height: 36px; text-align: center; } .slogan { font-size: 30px; line-height: 36px; margin-bottom: 40px; } .darkgrey { color: #393939 } .white { color: #ffffff !important } .round { -moz-border-radius: 50% 50% 50% 50%; -webkit-border-radius: 50% 50% 50% 50%; border-radius: 50% 50% 50% 50%; } img.office-building { border-radius: 8px; max-width: 100%; } .divide10 { height: 10px; width: 100%; } ul { list-style: circle outside none } ul.bullet { list-style: none outside none; margin: 0; } ul.bullet li:before { content: "\f058"; display: inline-block; font-family: 'icomoon'; font-size: 15px; font-style: normal; font-weight: normal; padding-right: 8px; text-decoration: inherit; } .dropcap { background-color: #F8F8F8; border: 1px solid rgba(0, 0, 0, 0); display: inline-block; float: left; font-family: "OpenSansSemiBold"; font-size: 24px; height: 48px; line-height: 48px; margin: 5px 17px 0 0; position: relative; text-align: center; width: 48px; } .dropcap.circle { border-radius: 2em; color: #ffffff; } .dropcap.square { color: #ffffff } .read-more { padding: 7px 0px 5px 0; font-size: 14px; display: inline-block; margin-bottom: -5px; } .more-arrow { border-radius: 30px; display: inline-block; font-size: 20px; font-weight: normal; height: 20px; line-height: 13px; margin-left: 6px; position: relative; text-align: center; width: 20px; } .image-right, .image-left, .office-building { border: 1px solid #E0E0E0; border-radius: 3px 3px 3px 3px; box-shadow: 0 2px 0 0 rgba(0, 0, 0, 0.03); max-width: 100%; padding: 5px; } .image-left { float: left; margin: 5px 25px 10px 0; } .subtitle { font-family: OpenSansLight; font-size: 18px; line-height: 35px; margin: 0 auto; text-align: center; width: 75%; } section.Top-Colored-Row div.subtitle { color: #FFFFFF } section.Top-Colored-Row div.subtitle span.highlight { color: #FFFFFF } blockquote { background: none repeat scroll 0 0 #FBFBFB; border-bottom: 1px solid #EBEBEB; border-left: 0 none; border-top: 1px solid #EBEBEB; font-family: "OpenSansLight"; font-style: italic; margin-bottom: 20px; margin-top: 10px; padding: 30px; } blockquote.style2 { background: url("https://passbaconference.com/Portals/894/Skins/Flatna/img/quote.png") no-repeat scroll 10px 10px #FCFCFC; min-height: 50px; } blockquote.style2 cite { float: right } blockquote p { margin-bottom: 0; font-size: 13px; } blockquote cite { color: #000000; display: block; font-family: "Open Sans",Arial; font-size: 12px; font-style: normal; margin-top: 10px; } .float-l { float: left !important } /* --- Fancy Headings --- */ .heading-graduate { font-family: 'Graduate',cursive; font-size: 32px; padding: 20px 0; } .heading-lobster { font-family: 'Lobster Two',cursive; font-size: 40px; padding: 0 0 20px; } .heading-pacifico { font-family: 'Pacifico',cursive; font-size: 40px; padding: 0 0 20px; } .heading-damion { font-family: 'Damion',cursive; font-size: 36px; padding: 0 0 20px; } .heading-anonymous { font-family: 'Anonymous Pro',sans-serif; font-size: 36px; padding: 0 0 20px; } .heading-pinyon { font-family: 'Pinyon Script',cursive; font-size: 56px; padding: 0 0 30px; } p.purple { color: #9D9ABF } p.red { color: #D2514B } p.yellow { color: #E8C04F } p.blue { color: #66A3C6 } p.green { background: none repeat scroll 0 0 rgba(0, 0, 0, 0); color: #52A390; } p.tan { color: #C7C47D } /* Sidebar Pages Posts */ .wp-post-image { display: block } .sidebar_posts > img { width: 100%; padding: 5px; border: 1px solid #E0E0E0; border-radius: 3px 3px 3px 3px; box-shadow: 0 2px 0 0 rgba(0, 0, 0, 0.03); } .post-title a { font-size: 28px; line-height: 2.9; color: #414141!important; } h2.post-title { margin: 0 } /*-----------------------------------------------------------------------------------*/ /* Custom Call to Action /*-----------------------------------------------------------------------------------*/ #call-to-action span { color: #4B4F52; display: inline-block; font-family: 'OpenSansSemibold'; font-size: 22px; letter-spacing: -1px; padding: 0 30px; text-align: center; width: 70%; } /* List Elements ========================================================================= */ .rox-list { margin-left: 0; list-style: none!important; } .rox-list > li { list-style: none outside none } .rox-list > li em, .rox-list > li i { margin-right: 8px } .rox-list li { line-height: 175%; padding: 0; } .rox-list li i { margin-right: 8px } /* Homepage Elements ========================================================================= */ /* *New in Version 2* Home-Creative Page -------------------------------- */ /* Dark Section Elements */ .content.fluid { width: 100% } .content { color: #FFFFFF; left: 0; margin: auto; text-align: center } .content h2 { color: #FFFFFF; display: block; font-family: 'OpenSansLight'; font-size: 60px; letter-spacing: -1px; line-height: 80px; } .content p { font-family: 'OpenSansLight'; font-size: 24px; line-height: 38px; letter-spacing: 0.5px; padding-bottom: 27px; } .content .buttons { position: relative } .content .buttons { letter-spacing: 0.5px } .content .button { border-radius: 2px 2px 2px 2px; display: inline-block; margin: 0; padding: 0 10px; line-height: 22px; transition: all 0.2s linear 0s; } .button a::-moz-selection { background: none repeat scroll 0 0 rgba(0, 0, 0, 0) !important; color: #FFFFFF !important; } .buttons > div:first-child { padding-left: 0 } .content .button a { background-color: #6BC1B9; border-radius: 2px 2px 2px 2px; box-shadow: 0 1px 0 rgba(255, 255, 255, 0.25) inset, 0 1px 3px rgba(0, 0, 0, 0.2); color: #FFFFFF; display: block; font-family: 'OpenSansBold'; font-size: 12px; letter-spacing: 2px; padding: 13px 17px; text-decoration: none; text-transform: uppercase; transition: all 0.2s linear 0s; } .big-btn-color-1 { background-color: #E27A3F !important } .big-btn-color-2 { background-color: #444444 !important } .light.responsive { margin-bottom: -50px } /* Parallax Section Box (Found on Landing Page Demo) */ h2.big-section-title { font-family: OpenSansBold; font-size: 52px; font-weight: normal; line-height: 82px !important; margin-bottom: 0; text-transform: none; } h4.section-sub-title { font-size: 24px; line-height: 28px; text-transform: none; } /* Services Boxes */ .services-box1 .icon { display: block; font-size: 36px; line-height: 64px; } .col-xs-1.flat-icon { margin: 13px 0 0 } .flat-icon img { width: 100% } .rox_single_image img { border-radius: 3px; overflow: hidden; max-width: 100%; } /* Parallax Section Box (Found on Parallax Demo) */ .parallax-content { margin: 100px; text-align: center; } .parallax-content p { margin: 0 0 10px } .parallax-title > span { font-family: OpenSansSemiBold; padding: 20px 40px !important; } .parallax-content p span { background: none repeat scroll 0 0 rgba(0, 0, 0, 0.3); border-radius: 3px; color: #FFFFFF; display: inline-block; font-size: 23px; margin: 0 0 3px; padding: 12px 10px; } .parallax-content a { margin-top: 10px } .parallax-sub-title span { font-size: 16px !important } /* ----------------- rxService Box1 styles ----------------- */ .rxservice1-block { background: #f8f8f8 } .rxservice1-icon { color: #fff; background: #5a5a5a; } .rxservice1-icon { background: none repeat scroll 0 0 #5A5A5A; color: #FFFFFF; } .rxservice1-block { background: none repeat scroll 0 0 rgba(0, 0, 0, 0) } .rxservice1-block { border-radius: 6px; border: 1px solid #DDDDDD; float: left; padding: 0 24px 30px; text-align: center; } .rxservice1-block h6 { color: #383936; font-size: 14px; margin: -12px 0 4px; text-align: center; } .rxservice1-icon { border-radius: 50%; display: inline-block; font-size: 24px; height: 64px; padding: 18px; position: relative; text-align: center; top: -35px; width: 64px; } .rxservice1-icon i { padding: 0 } .rxservice1-content { text-align: center; padding: 0 20px 0 20px; } .rxservice1-block .rxservice1-icon { -o-transition: .7s; -ms-transition: .7s; -moz-transition: .7s; -webkit-transition: .7s; transition: 0.7s; } /* ----------------- rxService Box2 styles ----------------- */ .rxservice2-block { background: #f8f8f8 } .rxservice2-block:hover .rxservice2-icon { color: #444 } .rxservice2-block { background: none repeat scroll 0 0 rgba(0, 0, 0, 0) } .rxservice2-block { background: none repeat scroll 0 0 #F7F7F7; border: 1px solid #EEEEEE; border-radius: 6px; float: left; margin: 15px 0; padding: 0 24px 30px; text-align: center; } .rxservice2-block h6 { color: #383936; font-size: 14px; margin: -12px 0 4px; text-align: center; } .rxservice2-icon { border-radius: 50%; display: inline-block; font-size: 32px; margin: 10px 0; padding: 22px 0 18px; position: relative; text-align: center; } .rxservice2-icon i { padding: 0 } .rxservice2-content { text-align: center; padding: 0 20px 0 20px; } .rxservice2-block .rxservice2-icon { -o-transition: .7s; -ms-transition: .7s; -moz-transition: .7s; -webkit-transition: .7s; transition: 0.7s; } /* Team Member Circle */ .sc-wraper a { display: block } .tm-wrapper { width: 100% } .tm-circle { text-align: center } .tm-circle h3 { color: #ffffff; padding: 0; margin: 0; padding-bottom: 4px; padding-top: 5px; border-bottom: 1px solid rgba(255, 255, 255, 0.5); max-width: 85%; margin: auto; margin-bottom: 2px; } .tm-circle .tm-box { -webkit-border-radius: 50%; -moz-border-radius: 50%; border-radius: 50%; background-size: cover; margin: auto 2.3%; height: 232px; width: 232px; /* temp */ color: #ffffff; } .tm-circle .tm-box h3 { color: #ffffff } .tm-circle .tm-title-box { height: 232px; width: 232px; /* temp */ text-align: left; } .tm-circle .tm-content { display: table; position: absolute; top: 0; left: 0; -webkit-border-radius: 50%; -moz-border-radius: 50%; border-radius: 50%; background-color: rgba(76, 201, 149, 0.81); height: 220px; min-height: 220px !important; width: 220px; padding: 20px; color: #ffffff; -moz-opacity: 0; -khtml-opacity: 0; -webkit-opacity: 0; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"; filter: alpha(opacity=0); opacity: 0; line-height: 1.5em; -webkit-transition: all 0.4s ease; -moz-transition: all 0.4s ease; -ms-transition: all 0.4s ease; -o-transition: all 0.4s ease; transition: all 0.4s ease; -webkit-transform: scale(1.1); -moz-transform: scale(1.1); -ms-transform: scale(1.1); -o-transform: scale(1.1); transform: scale(1.1); z-index: 100; } .tm-circle .tm-content .sc-wraper { display: table-cell; vertical-align: middle; } .tm-circle .tm-content a { color: #ffffff } .tm-circle .tm-content p { color: rgba(255, 255, 255, 0.9) } .tm-wrapper.tm-circle .tm-box { height: 220px; width: 220px; } .tm-circle .tm-box:after { content: ""; display: block; box-shadow: 0 0 0 12px rgba(255, 255, 255, 0.3); height: 197px; width: 197px; position: absolute; top: 12px; left: 12px; -webkit-border-radius: 50%; -moz-border-radius: 50%; border-radius: 50%; z-index: 10; } .tm-circle .tm-box:hover .tm-content { -moz-opacity: 1; -khtml-opacity: 1; -webkit-opacity: 1; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)"; filter: alpha(opacity=100); opacity: 1; -webkit-transform: scale(1); -moz-transform: scale(1); -ms-transform: scale(1); -o-transform: scale(1); transform: scale(1); } .tm-circle .tm-title-box h2 { font-size: 20px; padding: 5px 0; } /* ------------------- Team shortcode styles ------------------- */ .team-wrapper em { color: #8c8c8c } .team-list li a { color: #5f5f5f } .team-list li a:hover { color: #da4d40 } .team-wrapper { background: none repeat scroll 0 0 #252525; border-radius: 8px 8px 4px 4px; min-height: 370px !important; } .team-wrapper img { border-radius: 4px 4px 0 0 } .team-content { padding: 0 20px } /*=============== Team Styles ===========*/ .team-wrapper { margin: 18px 0 18px 0 } .team-wrapper, .team-content { text-align: center } .team-wrapper .gwl-wrapper { margin: 17px 0 0 0 } .team-wrapper h4 { font-size: 17px; font-weight: 900; } .team-wrapper p { padding: 2px 0 2px 0 !important } .team-wrapper em { padding: 0 0 12px 0; display: block; font-size: 13px; } .team-img { display: inline-block; width: 100%; } .team-list { list-style: none; margin: 14px 0 0 0; padding: 0; } .team-list li { display: inline-block; margin: 0 3px 0 3px; } .team-list li a { display: block; padding: 4px 6px 4px 6px; font-size: 18px; } .team-list li a i { padding-right: 0 } .team-list li a:hover { text-decoration: none } .col-sm-3 .team-wrapper { margin: 14px 0 10px 0 } .col-sm-3 .team-wrapper .gwl-wrapper { display: none } .col-sm-3 .team-wrapper em { padding: 0 0 4px 0 } .col-sm-3 .team-list { margin-top: 8px; padding-bottom: 20px; } .col-sm-3 .team-list li a i { font-size: 16px } .col-sm-3 .team-wrapper h4 { margin-top: 14px; font-weight: 900; font-size: 15px; } .quote-wrapper .team-wrapper { -webkit-border-radius: 2px; -moz-border-radius: 2px; border-radius: 2px; margin: 20px 0 20px 0; } .quote-wrapper .team-wrapper h4, .quote-wrapper .team-wrapper em, .quote-wrapper .team-wrapper .team-content { padding-left: 13px; padding-right: 13px; } .quote-wrapper .team-wrapper .team-img { -webkit-border-top-left-radius: 2px; -moz-border-top-left-radius: 2px; border-top-left-radius: 2px; -webkit-border-top-right-radius: 2px; -moz-border-top-right-radius: 2px; border-top-right-radius: 2px; } /* Homepage Elements Version 1 -------------------------------- */ .Shaded-Row .element-title h3.headline { background-color: #F6F6F6 !important } h3.headline { background-color: #FFF; float: left; font-size: 20px; line-height: 10px; padding-right: 10px; position: relative; z-index: 5; } span.line { border-bottom: 1px solid #E9E9E9; display: inline-block; float: left; height: 1px; margin: -16px 0 25px; width: 100%; } .element-title { display: inline } .dark-text { color: #666; font-weight: 400; } .welcome-text { font-size: 2em; line-height: 2em; margin: auto; text-align: center; width: 80%; } .subtitle-text { font-size: 18px; margin-bottom: 28px; } h4.headline { color: #444444; font-size: 16px; margin-bottom: 5px; margin-top: 15px; text-transform: none; } h4.headline:after { background: none repeat scroll 0 0 rgba(223, 223, 223, 0.43); content: "-"; display: block; height: 3px; margin: 5px 0 10px; overflow: hidden; text-indent: -999em; width: 40px; } /* Styles on Home Style I -------------------------------- */ /* Features */ h2.heading { font-size: 1.35em; font-weight: 400; position: relative; text-align: center !important; } .profile-pic { border: 10px solid #F1F1F1; -moz-border-radius: 50% 50% 50% 50%; -webkit-border-radius: 50% 50% 50% 50%; border-radius: 50% 50% 50% 50%; width: 200px; } .profile-pic:hover { transition: border 0.2s ease-out 0s, color 0.2s ease-out 0s } .profile-pic img { -moz-border-radius: 50% 50% 50% 50%; -webkit-border-radius: 50% 50% 50% 50%; border-radius: 50% 50% 50% 50%; } .rounded { background-color: #FAFBFD; background-image: none !important; border: 10px solid #F1F1F1; border-radius: 50% 50% 50% 50%; color: #999999; display: inline-block !important; font-size: 2.5em; height: 60px !important; padding: 40px 24px 8px; margin-bottom: 10px; width: 60px !important; } .features { text-align: center } .features p { margin: 0; padding-top: 0; } /* Top icons & Text */ .flatna > li em, .flatna > li i { display: inline-block; font-size: 36px; margin: 0 35px 20px 0; vertical-align: middle; } .flatna > li p { color: #454545; display: inline-block; font-size: 20px; } .flatna > li { list-style: none outside none } /* Feature Boxes on Home Style I -------------------------------- */ .blog-content { -moz-border-bottom-colors: none; -moz-border-left-colors: none; -moz-border-right-colors: none; -moz-border-top-colors: none; border-image: none; border-radius: 0 0 4px 4px; border-style: none solid solid; border-width: medium 1px 1px; box-shadow: 0 2px 0 rgba(0, 0, 0, 0.055); display: block; font-size: 13px; line-height: 20px; padding: 10px; transition: all 0.2s ease-in-out 0s; } .overlay { left: 0; position: absolute; top: 0; transition: background-color 0.2s linear 0s, color 0.2s linear 0s; width: 100%; z-index: 101; } .feature img { display: inline-block !important; margin-top: 16px; max-height: 75px; max-width: 75px; position: absolute; vertical-align: top; } .feature-text p { margin: 1px 0 40px 100px } .feature-text h3 { color: #454545; font-size: 18px; line-height: 30px; margin: 10px 0 5px 100px; } /* Parallax Pane Text */ .parallax-text { font-size: 30px; margin: 7% auto !important; padding: 30px; text-align: center; text-transform: uppercase; } .box-white { border: 2px solid #FFFFFF; color: #FFFFFF; font-family: 'Roboto Condensed',sans-serif; font-weight: 700; letter-spacing: -0.03em; margin: auto; width: 80%; } /* Client Logos */ ul.client-logo { margin: 0 !important } .client-logo li { background-color: #FFFFFF; list-style: none outside none; padding: 40px 10px; text-align: center; } /* Styles on Home Style II -------------------------------- */ p.title, p.title a { color: #454545; font-size: 16px; font-weight: 400 !important; } i.icn:hover, em.icn:hover { transition: all 0.3s ease 0s } i.icn, em.icn { background-color: #454545; border-radius: 50% 50% 50% 50%; color: #FFFFFF; font-size: 26px; height: 70px; left: 50%; line-height: 70px; margin-left: -35px; position: absolute; top: -35px; width: 70px; } p.desc { } .service-box-one { background: none repeat scroll 0 0 #FFFFFF; border: 1px solid #DDDDDD; border-radius: 4px 4px 4px 4px; margin: 60px 0 20px 0; padding: 60px 20px 20px; position: relative; text-align: center; font-family: inherit; word-wrap: break-word; } /* Styles on Home Style III -------------------------------- */ .home-III { display: inline-block } .home-III p { margin-bottom: 40px } .home-III i, .home-III em { color: #FFFFFF; display: inline; font-size: 64px; line-height: 85px; margin: 0 30px 0 0; opacity: 0.4; filter: alpha(opacity=40); } .title-white { background: none repeat scroll 0 0 transparent; border: medium none; color: #FFFFFF; display: inline; font-family: 'Roboto Condensed',sans-serif; font-size: 35px; line-height: 90px !important; padding: 0; text-transform: none; vertical-align: bottom; } .text-white { color: #FFFFFF !important } .text-black { color: #000000 !important } .text-normal { color: #777777 } .flats { margin: 0 } .flats img { height: auto; margin: 30px 0; max-width: 200px; width: 65%; } .hborder { border-bottom: 1px dotted #D9D9D9; margin-bottom: 20px; padding-bottom: 10px; } /* Styles on Services Page -------------------------------- */ p.description { color: #616161; font-size: 18px; font-weight: 300; line-height: 30px; margin: 18px 0 0; } .aligncenter { display: block; margin-left: auto; margin-right: auto; text-align: center; } .flat-icons .icon { height: auto } figure { margin: 0; padding: 0; } .box { background: none repeat scroll 0 0 #F4F4F4; box-shadow: 0 3px 0 rgba(0, 0, 0, 0.05); margin: 8px 0 0; padding: 15px 0 30px; position: relative; -moz-border-radius: 4px 4px 4px 4px; -webkit-border-radius: 4px 4px 4px 4px; border-radius: 4px 4px 4px 4px; } .box h4 { line-height: 18px; margin-bottom: 0; } .box.arrow:before { border-bottom: 9px solid #F4F4F4; border-left: 9px solid transparent; border-right: 9px solid transparent; content: ""; display: block; height: 0; left: 50%; margin-left: -9px; position: absolute; top: -9px; width: 0; } .icons img { margin-bottom: 10px; max-width: 200px; width: 40%; } .grey-box { background: none repeat scroll 0 0 #F8F8F8; padding: 20px; text-align: center; } .grey-box .contact-number { font-size: 24px; font-weight: 500; -moz-border-radius: 4px 4px 4px 4px; -webkit-border-radius: 4px 4px 4px 4px; border-radius: 4px 4px 4px 4px; } .test-quote-icon { left: 48%; margin-bottom: -80px; position: relative; top: -95px; } i.testimonials, em.testimonials { background: none repeat scroll 0 0 #FFFFFF; -moz-border-radius: 50% 50% 50% 50%; -webkit-border-radius: 50% 50% 50% 50%; border-radius: 50% 50% 50% 50%; color: #E9E9E9; font-size: 52px; height: 100px; line-height: 100px; width: 100px; text-align: center; display: block; } span.testi-avatar { background: none repeat scroll 0 0 #E9E9E9; border-radius: 50% 50% 50% 50%; color: #333333; display: block; font-size: 68px; height: 80px; line-height: 80px !important; margin-bottom: 5px; padding: 11px; width: 80px; } .testi-avatar-box { border: 1px solid #DDDDDD; border-radius: 50% 50% 50% 50%; height: 101px; margin: 18px auto 10px; padding: 4px 6px 5px 4px; width: 100px; } div.service-testimonials { margin: auto; width: 75%; } div.service-testimonials #quoted blockquote p { background: none repeat scroll 0 0 transparent; color: #333333; font-size: 1.42em; padding: 13px 0; text-align: center; } div.service-testimonials .bubble { background: none } div.service-testimonials blockquote li { display: block; float: none; text-align: center; } div.service-testimonials li.client-name { text-align: center } div.service-testimonials .cbp-qtcontent img { float: none; margin-bottom: 10px; margin-left: 0; } /* Styles on Contact Page -------------------------------- */ .lt_text { background: url("https://passbaconference.com/Portals/894/Skins/Flatna/img/lt-border.png") no-repeat scroll center top transparent; color: #CCCCCC; font-size: 22px; padding: 50px 0 10px; text-align: center; } .lt_sub_text { background: url("https://passbaconference.com/Portals/894/Skins/Flatna/img/lt-border.png") no-repeat scroll center bottom transparent; color: #595959; font-family: "Open Sans"; font-size: 40px; font-weight: bold; line-height: 35px; margin: 0 0 40px; padding: 0 0 55px; text-align: center; text-transform: uppercase; } /* ================================================== # CSS3 ================================================== */ a, a:hover, .profile:hover .profile-photo, .blog-post:hover .blog-thumb { -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -ms-transition: all 0.3s ease; -o-transition: all 0.3s ease; transition: all 0.3s ease; } /*------------------------------------------------*/ /* DNN Forms and Action Button */ /*------------------------------------------------*/ .dnnPrimaryAction, .dnnFormItem input[type="submit"], a.dnnPrimaryAction, a.DynamicLogin_LoginLink { border-color: transparent; box-shadow: none; color: #FFFFFF !important; float: left; margin-top: 0; text-shadow: none !important; } .dnnPrimaryAction:hover, .dnnFormItem input[type="submit"]:hover, a.dnnPrimaryAction:hover { background: none repeat scroll 0 0 #252525; border-color: transparent; box-shadow: none; color: #595959; text-shadow: none !important; } .dnnLabel { display: inline-block; float: left; margin-right: 18px; overflow: visible; padding-right: 20px; position: relative; width: 30.075%; } .dnnFormItem input[type="text"], .dnnFormItem input[type="password"], .dnnFormItem input[type="email"], .dnnFormItem input[type="tel"], .dnnFormItem select, .dnnFormItem textarea { background-color: #E9E9E9; max-width: 660px; width: 100% !important; } .dnnFormItem input[type="text"], .dnnFormItem select, .dnnFormItem textarea, .dnnFormItem input[type="email"], .dnnFormItem input[type="search"], .dnnFormItem input[type="password"] { padding: 10px!important; width: 100%; min-height: 41px; border: 0px; border-bottom: 1px solid #fff; border-radius: 2px 2px 2px 2px; font-size: 12px; line-height: 22px; color: #555; background-color: #ebebeb; box-shadow: 0 1px 2px rgba(0, 0, 0, 0.12) inset; -moz-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.12) inset; -webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.12) inset; -o-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.12) inset; transition: all 0.2s linear; -moz-transition: all 0.2s linear; -webkit-transition: all 0.2s linear; -o-transition: all 0.2s linear; } .dnnFormItem input[type=text]:focus, .dnnFormItem textarea:focus, .dnnFormItem input[type=email]:focus { background-color: #e1e1e1; border: 0; box-shadow: 0 1px 2px rgba(0, 0, 0, 0.12) inset; -moz-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.12) inset; -webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.12) inset; -o-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.12) inset; } /* Secondary Action */ .dnnFormItem button, .dnnFormItem input[type="button"], .dnnFormItem input[type="reset"], .dnnFormItem input[type="submit"], .dnnPrimaryAction, .dnnSecondaryAction, .dnnTertiaryAction, ul.dnnAdminTabNav li a, .dnnLogin .LoginTabGroup span, .DynamicLogin_LoginLink { border: 0 none; padding: 10px 15px; } .dnnFormItem button, .dnnFormItem input[type="button"], .dnnFormItem input[type="reset"], .dnnSecondaryAction, a.dnnSecondaryAction, ul.dnnAdminTabNav li a, .dnnLogin .LoginTabGroup span { background: none repeat scroll 0 0 #999999; box-shadow: none; color: #FFFFFF; font-weight: normal; text-shadow: none !important; } .dnnFormItem button, .dnnFormItem input[type="button"], .dnnFormItem input[type="reset"], .dnnFormItem input[type="submit"], .dnnPrimaryAction, .dnnSecondaryAction, .dnnTertiaryAction, ul.dnnAdminTabNav li a, .dnnLogin .LoginTabGroup span, .DynamicLogin_LoginLink { border-radius: 3px; cursor: pointer; display: inline-block; font-weight: normal; margin-bottom: 9px; min-width: 75px; text-align: center; text-decoration: none; } .dnnFormItem button:hover, .dnnFormItem input[type="button"]:hover, .dnnFormItem input[type="reset"]:hover, .dnnSecondaryAction:hover, a.dnnSecondaryAction:hover, ul.dnnAdminTabNav li a:hover, .dnnLogin .LoginTabGroup span:hover { color: #FFFFFF } .dnnFormItem button:active, .dnnFormItem input[type="button"]:active, .dnnFormItem input[type="reset"]:active, .dnnFormItem input[type="reset"]:active, .dnnSecondaryAction:active, a.dnnSecondaryAction:active, ul.dnnAdminTabNav li a:active { border-color: #999; background: #c6c6c6; /* Old browsers */ background: -moz-linear-gradient(top, #c6c6c6 0%, #f3f3f3 100%); /* FF3.6+ */ background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#c6c6c6), color-stop(100%,#f3f3f3)); /* Chrome,Safari4+ */ background: -webkit-linear-gradient(top, #c6c6c6 0%,#f3f3f3 100%); /* Chrome10+,Safari5.1+ */ background: -o-linear-gradient(top, #c6c6c6 0%,#f3f3f3 100%); /* Opera 11.10+ */ background: -ms-linear-gradient(top, #c6c6c6 0%,#f3f3f3 100%); /* IE10+ */ background: linear-gradient(top, #c6c6c6 0%,#f3f3f3 100%); /* W3C */ -webkit-box-shadow: inset 0px 1px 5px 0px rgba(0, 0, 0, 0.4); box-shadow: inset 0px 1px 5px 0px rgba(0, 0, 0, 0.4); } ul.dnnAdminTabNav li.ui-tabs-selected a { margin-top: 0; padding: 10px; } ul.dnnAdminTabNav { border-bottom: 0px solid #ddd; height: 46px; } ul.dnnAdminTabNav li.ui-tabs-active a { margin-top: -3px; padding: 14px 9px 12px; } ul.dnnAdminTabNav li a { border-radius: 3px 3px 3px 3px; margin-bottom: 0; } /* Home Slider */ #video-volume { bottom: 30px; color: #FFFFFF; cursor: pointer; font-size: 24px; margin-left: -12px; left: 50%; position: absolute; width: 25px; height: 25px; z-index: 10; background: url("https://passbaconference.com/Portals/894/Skins/Flatna/img/audio.png") no-repeat; opacity: 0.5; } .welcome{ font-family: Georgia, "Times New Roman", Times, serif; font-style: italic; font-size: 26px; letter-spacing: 3px; text-transform: none; } #home-fullWidth div,#home div{ position: relative; width: 100%; height: 100%; } #home-fullWidth{ height: 700px; } .slider-controls{ opacity: 0; padding: 0; margin: 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; transition: all 0.2s ease-in-out; } .slider-controls li{list-style: none;} #home-fullWidth div:hover .slider-controls,#home div:hover .slider-controls{ opacity: 1; -webkit-transition: all 0.2s ease-in-out; -moz-transition: all 0.2s ease-in-out; -o-transition: all 0.2s ease-in-out; transition: all 0.2s ease-in-out; } .slider-controls li a{ position: absolute; z-index: 25; top: 44%; width: 81px; height: 80px; cursor: pointer; } .s-next{ background: url("https://passbaconference.com/Portals/894/Skins/Flatna/img/s-next.png"); margin-right: 70px; right: 0; opacity: 0.3; } .s-prev{ background: url("https://passbaconference.com/Portals/894/Skins/Flatna/img/s-prev.png"); margin-left: 70px; left: 0; opacity: 0.3; } .s-next:hover, .s-prev:hover{opacity: 1;} /*------------------------------------------------*/ /* VIDEO BACKGROUND EFFECT */ /*------------------------------------------------*/ .container-video{ position: relative; overflow: hidden; height: 650px; } .pane-container{ position: absolute; z-index: 50; width: 100%; height: 100%; } .Videobg { height: 100%; max-height: 650px; } .video-mask { background: url("https://passbaconference.com/Portals/894/Skins/Flatna/img/overlays/06.png") repeat scroll center center rgba(0, 0, 0, 0.2); height: 100%; left: 0; position: absolute; width: 100%; max-height: 650px; z-index: 10; } .video-padding { background: none repeat scroll 0 0 rgba(0, 0, 0, 0.5); border-radius: 3px; margin: 110px 0 100px 10px; padding: 60px 0 100px; } .Videobg > div#vidbg { height: 100%; max-height: 600px; position: absolute; z-index: -1; } .mb_YTVPlayer :focus { outline: 0 } .mb_YTVPlayer { animation-timing-function: linear; backface-visibility: hidden; display: block; height: 100%; max-height: 650px; transform: translate3d(0px, 0px, 0px); transform-style: preserve-3d; width: 100%; z-index: -2; } .mb_YTVPlayer.fullscreen { display: block; position: fixed; width: 100%; height: 100%; top: 0; left: 0; margin: 0!important; } .mbYTP_wrapper iframe { max-width: 4000px !important } .inline_YTPlayer { margin-bottom: 20px; vertical-align: top; position: relative; left: 0; overflow: hidden; border-radius: 4px; -moz-box-shadow: 0 0 5px rgba(0,0,0,.7); -webkit-box-shadow: 0 0 5px rgba(0,0,0,.7); box-shadow: 0 0 5px rgba(0,0,0,.7); background: rgba(0,0,0,.5); } .inline_YTPlayer img { border: none!important; -moz-transform: none!important; -webkit-transform: none!important; -o-transform: none!important; transform: none!important; margin: 0!important; padding: 0!important; } /*CONTROL BAR*/ .mb_YTVPBar .ytpicon { font-size: 20px; font-family: 'ytpregular'; } .mb_YTVPBar .mb_YTVPUrl.ytpicon { font-size: 30px } .mb_YTVPBar { transition: opacity 1s; -moz-transition: opacity 1s; -webkit-transition: opacity 1s; -o-transition: opacity 1s; display: block; width: 100%; height: 10px; padding: 5px; background: #333; position: fixed; bottom: 0; left: 0; -moz-box-sizing: padding-box; -webkit-box-sizing: border-box; text-align: left; z-index: 1000; font: 14px/16px sans-serif; color: white; opacity: .1; } .mb_YTVPBar.visible, .mb_YTVPBar:hover { opacity: 1 } .mb_YTVPBar .buttonBar { transition: all 1s; -moz-transition: all 1s; -webkit-transition: all 1s; -o-transition: all 1s; display: none; background: transparent; font: 12px/14px Calibri; position: absolute; top: -30px; left: 0; padding: 5px; width: 100%; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; -o-box-sizing: border-box; box-sizing: border-box; } .mb_YTVPBar:hover .buttonBar { background: rgba(0,0,0,0.4) } .mb_YTVPBar span { display: inline-block; font: 16px/20px Calibri, sans-serif; position: relative; width: 30px; height: 25px; vertical-align: middle; } .mb_YTVPBar span.mb_YTVPTime { width: 130px } .mb_YTVPBar span.mb_YTVPUrl, .mb_YTVPBar span.mb_OnlyYT { position: absolute; width: auto; display: block; top: 6px; right: 10px; cursor: pointer; } .mb_YTVPBar span.mb_YTVPUrl img { width: 60px } .mb_YTVPBar span.mb_OnlyYT { left: 185px; right: auto; } .mb_YTVPBar span.mb_OnlyYT img { width: 25px } .mb_YTVPBar span.mb_YTVPUrl a { color: white } .mb_YTVPPlaypause, .mb_YTVPlayer .mb_YTVPPlaypause img { cursor: pointer } .mb_YTVPMuteUnmute { cursor: pointer } /*PROGRESS BAR*/ .mb_YTVPProgress { height: 10px; display: none; width: 100%; background: #222; bottom: 0; left: 0; } .mb_YTVPLoaded { height: 10px; width: 0; background: #444; left: 0; } .mb_YTVTime { height: 5px; width: 0; background: #fff; bottom: 0; left: 0; -moz-box-shadow: #666666 1px 1px 3px; -webkit-box-shadow: #666666 1px 1px 3px; } /*------------------------------------------------*/ /* ANIMATED NUMBERS /*------------------------------------------------*/ .darkpane .col-sm-3.border-left { border-left: 1px solid #444444 } .darkpane p { font-family: OpenSansLight; font-size: 16px; } .darkpane span.count { font-size: 40px !important; line-height: 70px; } span.count { display: inline-block; font-size: 60px; line-height: 80px; } .animated-counter em { display: block; font-size: 60px; } .animated-counter { color: #FFFFFF; font-size: 14px; margin: 80px 0 90px; } /*------------------------------------------------*/ /* PARRALAX EFFECT */ /*------------------------------------------------*/ #Parallax-gridbg { background: url("https://passbaconference.com/Portals/894/Skins/Flatna/img/parallax-grid.jpg"); background-attachment: fixed; background-origin: initial; background-clip: initial; background-size: cover; background-repeat: no-repeat; background-position: 50% 0; position: relative; z-index: 998; } #Parallax-books { background-image: url(https://passbaconference.com/Portals/894/Skins/Flatna/img/overlay-pattern.png), url(../img/parallax-bg2.jpg); background-attachment: fixed; background-origin: initial; background-clip: initial; background-size: auto, cover; background-repeat: repeat, no-repeat; background-position: 50% 0; position: relative; } #Parallax-1 { background-image: url(https://passbaconference.com/Portals/894/Skins/Flatna/img/overlay-pattern.png), url(https://passbaconference.com/Portals/894/Skins/Flatna/img/parallax-bg4.jpg); background-attachment: fixed; background-origin: initial; background-clip: initial; background-size: auto, cover; background-repeat: repeat, no-repeat; background-position: 50% 0; position: relative; } #Parallax-2 { background-image: url(https://passbaconference.com/Portals/894/Skins/Flatna/img/overlay-pattern.png), url(../img/parallax-bg5.jpg); background-attachment: fixed; background-origin: initial; background-clip: initial; background-size: auto, cover; background-repeat: repeat, no-repeat; background-position: 50% 0; position: relative; } #Parallax-3 { background-image: url(https://passbaconference.com/Portals/894/Skins/Flatna/img/overlay-pattern.png), url(https://passbaconference.com/Portals/894/Skins/Flatna/img/parallax-bg6.jpg); background-attachment: fixed; background-origin: initial; background-clip: initial; background-size: auto, cover; background-repeat: repeat, no-repeat; background-position: 50% 0; position: relative; } #Parallax-x { background: url("https://passbaconference.com/Portals/894/Skins/Flatna/img/shattered_@2X1.jpg"); background-attachment: fixed; background-origin: initial; background-clip: initial; background-repeat: repeat; background-position: 100% 0; position: relative; } #Parallax-gridbg > .gridoverlay { height: 100%; opacity: 0.92; position: absolute; top: 0; width: 100%; z-index: -1; } /*------------------------------------------------*/ /* iOS SLIDER */ /*------------------------------------------------*/ .iosSliderDemo { clear: both; width: 100%; /* padding: 0 0 30% 0; */ padding: 0 0 490px; position: relative; } .fluidHeight { position: absolute; width: 100%; padding: 45px 0; background: #363739 url(https://passbaconference.com/Portals/894/Skins/Flatna/vendor/iosslider/_img/container-bg1.png) repeat 50% 0; box-shadow: inset 0 3px 5px -4px #000, inset 0 -3px 10px -4px #000; } .sliderContainer { height: 100%; max-height: 400px; padding: 0 0; } .iosSlider { position: relative; top: 0; left: 0; overflow: hidden; width: 100%; height: 400px; } .iosSlider .slider { width: 100%; height: 100%; } .iosSlider .slider .item { width: 1200px; height: 100%; padding: 0 0 0 0; text-align: center; } .iosSlider .slider .item .inner { position: relative; top: 0; left: 0; width: 95%; margin: 0 auto; height: 100%; box-shadow: 0 0 10px -5px #000; background-position: 50% 0; background-repeat: no-repeat; } .iosSlider .slider .item .inner img { position: relative; top: 0; left: 0; width: 100%; margin: 0 auto; } .iosSlider .slider .item .inner .selectorShadow { position: absolute; left: 0; bottom: 0; background: url(../vendor/iosslider/_img/selector-shadow.png) no-repeat 0 0; width: 120px; height: 30px; display: none; } .iosSlider .slider .item .inner .text1 { background: none repeat scroll 0 0 #000000; opacity: 0; filter: alpha(opacity=0); position: absolute; left: 100px; top: 30px; padding: 0 2px 0 7px; height: 75px; text-align: left; } .iosSlider .slider .item .inner .text1 span { color: #fff; font-size: 420%; font-weight: 100; line-height: 76px; padding: 0 8px; } .iosSlider .slider .item .inner .text1 span i { margin: 0 0 0 5px } .iosSlider .slider .item .inner .text2 { background: none repeat scroll 0 0 #000000; opacity: 0; filter: alpha(opacity=0); padding: 10px 7px 7px; position: absolute; left: 100px; top: 115px; text-align: left; } .iosSlider .slider .item .inner .text2 span { display: block; color: #fff; font-family: "Helvetica Neue",Helvetica,Arial,sans-serif; font-size: 120%; line-height: 120%; font-weight: 100; padding: 0 8px; } .sliderContainer .slideSelectors { position: relative; bottom: -17px; left: 0; width: 137px; margin: 0 auto; z-index: 1; height: 11px; } .sliderContainer .slideSelectors .prev { float: left; width: 11px; height: 11px; background: url(../vendor/iosslider/_img/selector-prev.png) no-repeat 50% 0; } .sliderContainer .slideSelectors .next { float: left; width: 11px; height: 11px; margin: 0 0 0 10px; background: url(https://passbaconference.com/Portals/894/Skins/Flatna/vendor/iosslider/_img/selector-next.png) no-repeat 50% 0; } .sliderContainer .slideSelectors .item { float: left; width: 9px; height: 9px; background: #aaa; margin: 1px 1px 1px 11px; /* opacity: 0.25; */ filter: alpha(opacity=25); border-radius: 10px; } .sliderContainer .slideSelectors .item.first { margin-left: 1px } .sliderContainer .slideSelectors .selected { width: 11px; height: 11px; margin: 0 0 0 10px; background: #eee; opacity: 1; filter: alpha(opacity=100); box-shadow: none; } .sliderContainer .slideSelectors .selected.first { margin-left: 0 } .sliderContainer .scrollbarContainer { position: relative; bottom: 4px; left: 0; width: 1024px; height: 4px; margin: 0 auto; z-index: 1; } @media screen and (max-width: 1000px) { .iosSliderDemo { padding-bottom: 424px } .fluidHeight { height: 334px } .iosSlider .slider .item { width: 100% } .sliderContainer .slideSelectors, .sliderContainer .scrollbarContainer { display: none } .iosSlider .slider .item .inner { width: 754px } .fluidHeight { padding: 35px 0 } .iosSlider .slider .item .inner { width: 95% } } @media screen and (max-width: 769px) { .iosSliderDemo { height: 320px; padding-bottom: 0; } .fluidHeight { padding: 30px 0 } .fluidHeight { height: 273px } .iosSlider .slider .item .inner .text1 { top: 20px; height: 55px; } .iosSlider .slider .item .inner .text2 { top: 80px } .iosSlider .slider .item .inner .text1 span { color: #FFFFFF; font-size: 200%; font-weight: 100; line-height: 50px; padding: 0 8px; } .iosSlider .slider .item .inner .text2 span { color: #FFFFFF; display: block; font-family: OpenSansRegular; font-size: 11px; font-weight: 100; line-height: 18px; padding: 0 8px; } } @media screen and (max-width: 769px) { .fluidHeight { height: 203px } } /*------------------------------------------------*/ /* FLEX SLIDER */ /*------------------------------------------------*/ .flexslider-wrapper { background: #252525; display: inline; } .fslide-details-container { color: #e2e2e2 } .fslide-details-container a { color: #fff } .fslide-details-container h3 a:hover { color: #da4d40 } .slider-button { background: #da4d40; color: #fff; } .slider-button:hover { background: #fff; color: #da4d40; } /*=============== Interior Slider styles ===============*/ .fslider-wrapper { position: relative; margin: 10px 0 10px 0; } .fslider-wrapper, .fslider-block { float: left; width: 100.4%; overflow: hidden; } .fslider-block { margin: 0; padding: 0; } .fslider-block img { overflow: hidden; display: block; margin-left: -1px; } /* direction navigation styles */ .fslider-wrapper .flex-direction-nav a { width: 40px; height: 60px; display: block; position: absolute; top: 50%; margin: -30px 0 0 0; text-indent: -9999px; outline: none; } .fslider-wrapper .flex-direction-nav .flex-next { opacity: 0; background: url('../vendor/flexslider/images/flexslider_nav.png') no-repeat 0 -60px; right: 32px; } .fslider-wrapper .flex-direction-nav .flex-prev { opacity: 0; background: url('../vendor/flexslider/images/flexslider_nav.png') no-repeat 0 0; left: 32px; } .fslider-wrapper:hover .flex-next, .fslider-wrapper:hover .flex-prev { opacity: 0.8 } .flex-next:hover, .flex-prev:hover { opacity: 1 !important } .fslider-loading { width: 100%; height: 100%; background: #1b1b1b url('https://passbaconference.com/Portals/894/Skins/Flatna/vendor/flexslider/images/loading.gif') no-repeat center center !important; } /*=============== Flexslider styles ===============*/ .flexslider-wrapper { overflow: hidden; width: 100%; float: left; margin: 0; padding: 0; position: relative; } .flexslider-wrapper ul li { position: relative } .flexslider-wrapper ul li img { display: block } .fslide-details { position: absolute; top: 18%; left: 0; width: 100%; } .fslide-details-container { margin: 0 auto; text-align: right; width: 1018px; } .fslider-loading { width: 100%; background: #1b1b1b url('https://passbaconference.com/Portals/894/Skins/Flatna/vendor/flexslider/images/loading.gif') no-repeat center center !important; } .fslide-details-container h3, .fslide-desc { margin: 0 0 2px 0; display: inline-block; background: rgba(0,0,0,0.5); -webkit-border-radius: 2px; -moz-border-radius: 2px; border-radius: 2px; display: inline-block; } .fslide-details-container h3 { padding: 10px 13px 9px 13px; display: inline-block; font-size: 2em; } .fslide-details-container h3 a { text-decoration: none } .fslide-desc { padding: 9px 13px 9px 13px; font-size: 16px; line-height: 24px; } .fdc-right h3, .fdc-right .fslide-desc { float: right } .fdc-center { text-align: center !important } .fdc-left { text-align: left !important } .flexslider-wrapper .flex-direction-nav { width: 40px; height: 60px; position: absolute; top: 50%; margin: -30px 0 0 0; text-indent: -9999px; outline: none; width: 100%; z-index: 9; } .flexslider-wrapper .flex-direction-nav a { width: 40px; height: 60px; display: block; position: absolute; outline: 0; } .flexslider-wrapper .flex-direction-nav .flex-next { opacity: 0; background: url('../vendor/flexslider/images/flexslider_nav.png') no-repeat 0 -60px; right: 42px; } .flexslider-wrapper .flex-direction-nav .flex-prev { opacity: 0; background: url('../vendor/flexslider/images/flexslider_nav.png') no-repeat 0 0; left: 42px; } .flexslider-wrapper:hover .flex-next, .flexslider-wrapper:hover .flex-prev { opacity: 0.6 } .flex-next:hover, .flex-prev:hover { opacity: 0.86 !important } /*=============== flexslider reset styles ===============*/ /* Browser Resets */ .flex-container a:active, .flexslider a:active, .flex-container a:focus, .flexslider a:focus { outline: none } .slides, .flex-control-nav, .flex-direction-nav { margin: 0; padding: 0; list-style: none; } .flexslider .slides > li, .testimonial-wrapper .slides > li, .fslider-wrapper .slides > li, .flexslider-wrapper .slides > li { display: none; -webkit-backface-visibility: hidden; } /* Hide the slides before the JS is loaded. Avoids image jumping */ .flexslider .slides img, .testimonial-wrapper .slides img, .fslider-wrapper .slides img, .flexslider-wrapper .slides img { width: 100%; display: block; } /* Clearfix for the .slides element */ .slides:after { content: "."; display: block; clear: both; visibility: hidden; line-height: 0; height: 0; } html[xmlns] .slides { display: block } * html .slides { height: 1% } /* list resets */ .fslider-wrapper ul, .fslider-wrapper ul li, .flexslider-wrapper ul, .flexslider-wrapper ul li, .testimonial-wrapper ul, .testimonial-block { list-style: none; margin: 0; padding: 0; } /*------------------------------------------------*/ /* ANIMATED GRID BANNER */ /*------------------------------------------------*/ .ri-grid { position: relative; height: auto; } .ri-grid ul { list-style: none; display: block; width: 100%; margin: 0; padding: 0; } /* Clear floats by Nicolas Gallagher: http://nicolasgallagher.com/micro-clearfix-hack/ */ .ri-grid ul:before, .ri-grid ul:after { content: ''; display: table; } .ri-grid ul:after { clear: both } .ri-grid ul { zoom: 1 } .ri-grid ul li { -webkit-perspective: inherit; -moz-perspective: inherit; -o-perspective: 400px; -ms-perspective: inherit; perspective: inherit; padding: 0; float: left; position: relative; display: block; overflow: hidden; background: #000; } .ri-grid ul li a { display: block; outline: none; position: absolute; left: 0; top: 0; width: 100%; height: 100%; -webkit-backface-visibility: hidden; -moz-backface-visibility: hidden; -o-backface-visibility: hidden; -ms-backface-visibility: hidden; backface-visibility: hidden; -webkit-transform-style: preserve-3d; -moz-transform-style: preserve-3d; -o-transform-style: preserve-3d; -ms-transform-style: preserve-3d; transform-style: preserve-3d; -webkit-background-size: 100% 100%; -moz-background-size: 100% 100%; background-size: 100% 100%; background-position: center center; background-repeat: no-repeat; background-color: #333; -webkit-box-sizing: content-box; -moz-box-sizing: content-box; box-sizing: content-box; } /* Grid wrapper sizes */ .ri-grid-size-1 { width: 55% } .ri-grid-size-2 { width: 100% } .ri-grid-size-3 { width: 100%; margin-top: 0px; } /* Shadow style */ .ri-shadow:after, .ri-shadow:before { content: ""; position: absolute; z-index: -2; bottom: 15px; left: 10px; width: 50%; height: 20%; max-width: 300px; max-height: 100px; box-shadow: 0 15px 10px rgba(0, 0, 0, 0.7); -webkit-transform: rotate(-3deg); -moz-transform: rotate(-3deg); -ms-transform: rotate(-3deg); -o-transform: rotate(-3deg); transform: rotate(-3deg); } .ri-shadow:after { right: 10px; left: auto; -webkit-transform: rotate(3deg); -moz-transform: rotate(3deg); -ms-transform: rotate(3deg); -o-transform: rotate(3deg); transform: rotate(3deg); } .ri-grid-loading:after, .ri-grid-loading:before { display: none } .ri-loading-image { display: none } .ri-grid-loading .ri-loading-image { position: relative; width: 30px; height: 30px; left: 50%; margin: 100px 0 0 -15px; display: block; } /*------------------------------------------------*/ /* FOOTER ELEMENTS */ /*------------------------------------------------*/ /* Latest Posts Demo Only */ .lp-post-info a { font-size: 10px; text-transform: uppercase; } .lp-wrapper { padding: 10px 0 } .lp-info-wrapper { display: inline-block } .lp-title { display: block; line-height: 1.5em; margin-top: 6px; vertical-align: middle; } .lp-wrapper img { margin-bottom: 5px; margin-right: 10px; } .footer-latest-posts { margin-top: -7px } /* Some Features Links Demo Only */ .widget ul.side-cat li { border-bottom-color: #E1E1E1 } .widget ul.side-cat a { color: #777777 } .widget ul { list-style: none outside none; margin: 0; } .widget ul li { line-height: 16px; margin-bottom: 0; padding: 5.1px 0; } .widget_recent_comments ul li { padding: 10px 0 } .widget ul li > a { display: block; padding: 10px 0; } .widget a { text-decoration: none } .widget a:hover { text-decoration: underline } .widget_categories ul > li, .widget_archive ul > li, .widget_nav_menu ul > li, .widget_recent_comments ul > li, .widget_meta ul > li, .widget_recent_entries ul > li, .widget_product_categories ul > li, .widget_layered_nav ul li { border-top: 1px solid rgba(0, 0, 0, 0) } .widget_categories ul > li:first-child, .widget_archive ul > li:first-child, .widget_nav_menu ul > li:first-child, .widget_recent_comments ul > li:first-child, .widget_meta ul > li:first-child, .widget_recent_entries ul > li:first-child, .widget_product_categories ul > li:first-child, .widget_layered_nav ul li:first-child { border-top: 0 none } .widget_categories ul > li a:before, .widget_archive ul > li a:before, .widget_nav_menu ul > li a:before, .widget_meta ul > li a:before, .widget_recent_entries ul > li a:before, .widget_product_categories ul > li a:before { content: "ï„…"; display: block; float: right; font-family: icomoon; font-size: 14px; font-style: normal; font-weight: normal; text-decoration: inherit; } /* Video Dection Text Demo Only*/ .video_section_text { color: #000000; padding: 15% 0; text-align: center; } .video_section_promo { color: #000000; padding: 190px 0; text-align: center; } .video_section_text span, .video_section_promo span { color: #FFFFFF; display: block; } .large.h1 { font-family: OpenSansBold; font-size: 50px; line-height: 50px !important; text-transform: uppercase; } .regular.h3 { font-size: 28px; letter-spacing: 0.5px; margin-bottom: 40px; } .video_section_text em, .video_section_promo em { background: none repeat scroll 0 0 #FFFFFF; border-radius: 10px; display: inline-block; font-size: 28px; margin-bottom: 40px; padding: 7px 14px; } .video_section_text em.micon-video-2, .video_section_promo em.micon-video-2 { background: none repeat scroll 0 0 rgba(0, 0, 0, 0); padding: 0; } .video_section_text a, .video_section_promo a { font-size: 12px !important } /* From Our Blog */ ul#fromblog { margin-left: 0; margin-right: 20px; } ul#fromblog a { color: #CCCCCC } ul#fromblog li:first-child { padding-top: 0 !important } ul#fromblog li { border-bottom: 1px solid #333333; list-style: none outside none; margin-bottom: 0; padding: 8px 0; } #fromblog span { color: #999999; display: block; font-size: 11px; line-height: 17px; margin-bottom: 6px; } /* Recent Comments */ ul#recentcomments { margin-left: 0 } ul#recentcomments li { background: none repeat scroll 0 0 rgba(0, 0, 0, 0.15); border: medium none; color: #CCCCCC; display: block; margin-bottom: 18px; margin-right: 20px; padding: 19px !important; position: relative; } /* Contact */ ul.contact-list { display: inline-block; margin: 0; padding: 10px 0 0; } ul.contact-list li i, ul.contact-list li em { margin: 0 10px 0 0 } ul.contact-list li { display: block; list-style: none; } /* Recent News */ .recent_news ul { margin: 0 } .recent_news ul li { list-style: none outside none; padding: 6px 0 6px 15px; position: relative; } .recent_news ul li:first-child { border-top-width: 0; padding-top: 0; } .recent_news li a { display: inline-block; position: relative; } .recent_news li a:before { background-image: url("https://passbaconference.com/Portals/894/Skins/Flatna/img/arrow-black.png"); background-position: 0 center; background-repeat: no-repeat; content: ""; display: block; height: 100%; left: -15px; position: absolute; top: 0; transition: left 0.2s linear 0s; width: 4px; } .recent_news li a:before { background-image: url("https://passbaconference.com/Portals/894/Skins/Flatna/img/arrow-light.png") } .recent_news li a:hover:before { left: -10px } /* Tag Clouds */ .tag-cloud { float: left; margin: 0 0 50px; } .tag-cloud a:hover { display: block; float: left; font-size: 11px; margin: 0 5px 5px 0; padding: 6px 7.5px; } .tag-cloud a, .tag-cloud a:visited { border-radius: 3px; display: block; float: left; font-size: 11px; margin: 0 5px 5px 0; padding: 6px 7.5px; } /* Twitter Feed */ #tweets li a { color: #FFF } #tweets .hash { color: #FFFFFF; opacity: 0.65; } #tweets .reply { color: #838383 } #tweets, #side-tweets li { min-height: 70px; position: relative; padding: 10px 0 0; } #tweets:before { content: "\f099"; font-family: icomoon; font-size: 38px; font-style: normal; font-weight: normal; position: absolute; text-decoration: inherit; color: #fff; margin: 20px 0; top: 9px; } #side-tweets li:before { } #side-tweets li:before { content: "\f099"; font-family: icomoon; font-size: 12px; font-style: normal; font-weight: normal; opacity: 90.35; position: absolute; text-decoration: inherit; } #tweets ul { color: #FFFFFF; font-size: 18px; margin-left: 0 !important; padding: 20px 0 10px; } #side-tweets ul { color: #FFFFFF; font-size: 16px; font-weight: 300; margin: 0 !important; padding: 0 10px; } #tweets ul p { margin: 0 0 0 70px !important } #side-tweets ul p { margin: 0 0 15px 30px !important; font-size: 13px; } #side-tweets ul p time { margin: 0 0 0 -30px !important; font-size: 11px; } #side-tweets li { color: #838383; padding: 0; list-style: none outside none; } #tweets li { list-style: none outside none } #tweets li .timestamp { color: #fff; margin: 0 !important; text-align: left; font-size: 11px; font-style: italic; } #tweets li.tweet_content_0 { border-top: 0 none } #tweets li:last-child { border-bottom: 0 none } /*------------------------------------------------*/ /* Flickr Feed */ /*------------------------------------------------*/ ul#flickr { padding: 0; display: inline-block; margin: 0 auto; } ul#flickr li { list-style: none; display: block; float: left; margin: 0; padding: 0; } ul#flickr li a { border-radius: 3px 3px 3px 3px; display: block; height: 150px; padding: 0; width: 150px; position: relative; margin: 0; text-decoration: none; cursor: pointer; } ul#flickr li a span { position: absolute; left: 0; bottom: 0; padding: 5px; width: 140px; color: #fff; font-family: arial, sans-serif; text-align: right; height: 140px; font-size: 15px; background: #000; } ul#flickr li a.normal span { display: none } ul#flickr li a.normal:hover span { display: block } ul#flickr li a.small { width: 105px; height: 105px; -moz-transform: scale(1); -webkit-transform: scale(1); transform: scale(1); margin: -12px; } ul#flickr li a.small:hover { -moz-transform: scale(1.2); -webkit-transform: scale(1.2); transform: scale(1.2); z-index: 2; } ul#flickr li a.small span { display: none } ul#flickr li a.large { width: 300px; height: 300px; } ul#flickr li a.large span { height: auto; width: 290px; text-transform: uppercase; opacity: 0.8; } /*-----------------------------------------------------------------------------------*/ /* FLAT ICONS /*-----------------------------------------------------------------------------------*/ p.icon { display: block; margin: 0; width: 110px; position: absolute; top: 23.1%; } div.icon { display: block; margin: 0; width: 110px; position: absolute; top: 23.1%; } .icon-wrapper { border-radius: 50%; display: inline-block; height: 110px; margin: auto; position: relative; width: 110px; } .icon-wrapper .icon { text-align: center; vertical-align: middle; } .icon-wrapper.purple { background-color: #9D9ABF } .icon-wrapper.red { background-color: #D2514B } .icon-wrapper.yellow { background-color: #E8C04F } .icon-wrapper.blue { background-color: #66A3C6 } .icon-wrapper.green { background-color: #a4bf60 } .services .icon-wrapper { margin: 0 auto 25px } .services { text-align: center } .flaticons1 .col-sm-2 > img { max-width: 90px } .flaticons .col-sm-2, .flaticons1 .col-sm-2 { height: 200px } .flaticons img { max-height: 50px; max-width: 55px; } .services-box > h3 { font-family: OpenSansSemiBold; font-size: 19px; font-weight: normal; letter-spacing: -0.5px; } /* FONT ICONS DEMO */ .box1 { background: none repeat scroll 0 0 #EEEEEE; font-size: 13px; margin: 5px; padding: 0.25em 0.5em; width: 24% !important; } .fs1 { font-size: 2em; padding: 0.4em 0; } .mtm { width: 100% } .glyph { background: none repeat scroll 0 0 #EEEEEE; border-radius: 0.25em; box-shadow: 0 0 0 1px #F8F8F8 inset, 0 0 0 1px #CCCCCC; float: left; font-size: 16px; margin: 0.75em 1.5em 0.75em 0; padding: 0.75em; text-align: center; width: 7.4em; } .glyph input { border: 0 none; box-shadow: 0 0 0 1px #CCCCCC; font-family: consolas,monospace; font-size: 13px; padding: 0.125em; text-align: center; width: 100%; } /*------------------------------------------------*/ /* ICON BOXES */ /*------------------------------------------------*/ em.emerald { background: #27CFC3 } em.green-apple { background: #2ecc71 } em.grey { background: none repeat scroll 0 0 rgba(0, 0, 0, 0.05) } em.river { background: #3498db } em.midnight-blue { background: #34495e } em.sunset { background: #f1c40f } em.carrot { background: #e67e22 } em.tango { background: #F6653C } em.silver { background: #C9CFD2 } em.concrete { background: #95a5a6 } em.dark { background: #333333 } .micons-box1 { border-radius: 999px; color: #FFFFFF; display: block; font-size: 16px; height: 36px; line-height: 36px !important; margin: 10px 0 0; text-align: center; width: 36px; } .micons-box2 { border-radius: 999px; color: #FFFFFF; display: inline-block; font-size: 16px; height: 36px; line-height: 36px !important; margin: 0 0 5px; text-align: center; width: 36px; } .micons-box3 { border-radius: 999px; color: #FFFFFF; display: inline-block; font-size: 90px; height: 136px; line-height: 136px !important; margin: 0 0 5px; text-align: center; width: 136px; } h5.box2-title { display: inline; margin-left: 10px; } /*************************************************** INDEX INTRO BOXES ***************************************************/ /* Index Boxes */ .tile { background-color: #e3e1e1; -webkit-border-radius: 6px; -moz-border-radius: 6px; border-radius: 6px; padding: 14px; position: relative; text-align: center; margin-bottom: 25px; } .tile.tile-hot:before { background: url("https://passbaconference.com/Portals/894/Skins/Flatna/img/ribbon.png") 0 0 no-repeat; background-size: 82px 82px; content: ""; height: 82px; position: absolute; right: -4px; top: -4px; width: 82px; } .tile p { color: #444444; margin: 10px 0 22px; } .tile-image { height: 100px; margin: 25px 0 15px; vertical-align: bottom; } .tile-image.big-illustration { height: 111px; margin-top: 10px; width: 112px; } .tile-title { font-family: OpenSansLight; font-size: 18px; margin: 0; } /* Index Box Icons */ .intro-icon { text-align: center; margin: 0 auto; -webkit-transform: translate3d(0, 0, 0); -moz-transform: translate3d(0, 0, 0); -o-transform: translate3d(0, 0, 0); -ms-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } .intro-icon-disc.cont-large { padding: 15px; text-align: center; width: 40px; height: 40px; margin: 0 auto; } .intro-icon-large:before { font-size: 38px; padding-left: 0px; margin-left: 3px; color: #45B39E; } .intro-icon-disc { -webkit-transition: border .5s; -moz-transition: border .5s; -o-transition: border .5s; -ms-transition: border .5s; transition: border .5s; -webkit-border-radius: 50%; -moz-border-radius: 50%; border-radius: 50%; -webkit-box-shadow: none; -moz-box-shadow: 0 0 0 30px transparent; box-shadow: 0 0 0 30px transparent; background: rgba(255,255,255,0.4); -webkit-transition: box-shadow .6s ease-in-out; -moz-transition: box-shadow .6s ease-in-out; -o-transition: box-shadow .6s ease-in-out; -ms-transition: box-shadow .6s ease-in-out; transition: box-shadow .6s ease-in-out; } .intro-icon-disc:hover { box-shadow: 0 0 0 0 rgba(255,255,255,0.6); -webkit-transition: box-shadow .4s ease-in-out; -moz-transition: box-shadow .4s ease-in-out; -o-transition: box-shadow .4s ease-in-out; -ms-transition: box-shadow .4s ease-in-out; transition: box-shadow .4s ease-in-out; } /*------------------------------------------------*/ /* HEADER SOCIAL ICONS */ /*------------------------------------------------*/ ul.social-icons-top { margin: 0 } .social-icons-top li { cursor: pointer; display: inline-block; list-style: none outside none; padding: 12px 9px; text-align: center; } /*------------------------------------------------*/ /* FOOTER SOCIAL ICONS */ /*------------------------------------------------*/ .social-icons-bottom { display: block; margin-bottom: 5px; } .social-icons-bottom li { border-radius: 15%; cursor: pointer; display: inline-block; height: 30px; line-height: 30px; list-style: none outside none; margin-left: 2px; text-align: center; width: 30px; } .social-icons-bottom li.micon-rss:hover { background-color: #E86F04 !important; color: #FFFFFF; } .social-icons-bottom li.micon-twitter:hover { background-color: #5DAED5; color: #FFFFFF; } .social-icons-bottom li.micon-facebook:hover { background-color: #4470CF; color: #FFFFFF; } .social-icons-bottom li.micon-linkedin:hover { background-color: #0976b4; color: #FFFFFF; } .social-icons-bottom li.micon-dribbble:hover { background-color: #D07EAD; color: #FFFFFF; } .social-icons-bottom li.micon-googleplus:hover { background-color: #A84539; color: #FFFFFF; } .social-icons-bottom li.micon-github:hover { background-color: #4073A6; color: #FFFFFF; } .social-icons-bottom li.micon-vimeo:hover { background-color: #099FC7; color: #FFFFFF; } /*------------------------------------------------*/ /* Team Profile Pics */ /*------------------------------------------------*/ .ch-item { width: 100%; height: 100%; border-radius: 50% 50% 50% 50%; position: relative; cursor: default; box-shadow: inset 0 0 0 0 rgba(200,95,66, 0.4), inset 0 0 0 12px rgba(255,255,255,0.6), 0 1px 2px rgba(0,0,0,0.1); -webkit-transition: all 0.4s ease-in-out; -moz-transition: all 0.4s ease-in-out; -o-transition: all 0.4s ease-in-out; -ms-transition: all 0.4s ease-in-out; transition: all 0.4s ease-in-out; } .ch-img-1, .ch-img-2, .ch-img-3, .ch-img-4 { background-size: 220px auto } .ch-img-1 { background-image: url("http://placehold.it/320x320") } .ch-img-2 { background-image: url("http://placehold.it/320x320") } .ch-img-3 { background-image: url("http://placehold.it/320x320") } .ch-img-4 { background-image: url("http://placehold.it/320x320") } .ch-info { position: absolute; width: 100%; height: 100%; border-radius: 50% 50% 50% 50%; opacity: 0; -webkit-transition: all 0.4s ease-in-out; -moz-transition: all 0.4s ease-in-out; -o-transition: all 0.4s ease-in-out; -ms-transition: all 0.4s ease-in-out; transition: all 0.4s ease-in-out; -webkit-transform: scale(); -moz-transform: scale(); -o-transform: scale(); -ms-transform: scale(); transform: scale(); -webkit-backface-visibility: hidden; } .ch-info h3 { color: #FFFFFF; font-size: 22px; height: 40px; letter-spacing: 1px; margin: 60px 30px 0; position: relative; text-shadow: 0 0 1px #FFFFFF, 0 1px 2px rgba(0, 0, 0, 0.3); text-transform: uppercase; } .ch-info p { color: #fff; padding: 10px 5px; font-style: italic; margin: 0 30px; font-size: 12px; border-top: 1px solid rgba(255,255,255,0.5); } .ch-info p a { display: block; color: #fff; color: rgba(255,255,255,0.7); font-style: normal; font-weight: 700; text-transform: uppercase; font-size: 9px; letter-spacing: 1px; padding-top: 4px; } .ch-info p a:hover { color: #fff222; color: rgba(255,242,34, 0.8); } .ch-item:hover { box-shadow: 0 0 0 110px rgba(76, 201, 149, 0.8) inset, 0 0 0 12px rgba(255, 255, 255, 0.8) inset, 0 1px 2px rgba(0, 0, 0, 0.1) } .ch-item:hover .ch-info { opacity: 1; -webkit-transform: scale(1); -moz-transform: scale(1); -o-transform: scale(1); -ms-transform: scale(1); transform: scale(1); } .ch-grid { margin: 0; padding: 0; list-style: none; display: block; text-align: center; width: 100%; } .ch-grid:after, .ch-item:before { content: ''; display: table; } .ch-grid:after { clear: both } .ch-grid li { width: 220px; height: 220px; display: inline-block; margin: 0; } .box em.micon-twitter { background: none repeat scroll 0 0 #33CCFF; border-radius: 50%; color: #FFFFFF; display: inline-block; height: 28px; line-height: 27px; margin: 0 3px; width: 28px; } .box em.micon-linkedin { background: none repeat scroll 0 0 #4875B4; border-radius: 50%; color: #FFFFFF; display: inline-block; height: 28px; line-height: 27px; margin: 0 3px; width: 28px; } .box em.micon-facebook { background: none repeat scroll 0 0 #3B5998; border-radius: 50%; color: #FFFFFF; display: inline-block; height: 28px; line-height: 27px; margin: 0 3px; width: 28px; } .box em.micon-apple { background: none repeat scroll 0 0 #FF6A00; border-radius: 50%; color: #FFFFFF; display: inline-block; height: 28px; line-height: 27px; margin: 0 3px; width: 28px; } /*-----------------------------------------------------------------------------------*/ /* COMING SOON COUNTDOWN /*-----------------------------------------------------------------------------------*/ .title { text-align: center } .title h2 { color: #FFFFFF; font-family: pacifico; font-size: 58px; padding: 5px; } /* ---------- TIMER ---------- */ ul#countdown { text-align: center } ul#countdown li { color: #fff; display: inline-block; margin-right: 18px; width: 120px; height: 120px; text-align: center; -webkit-border-radius: 10% 10% 10% 10%; -moz-border-radius: 10% 10% 10% 10%; border-radius: 10% 10% 10% 10%; } ul#countdown li span { color: #FFFFFF; font-family: pacifico; font-size: 52px; position: relative; top: 0; } .title > p { color: #FFFFFF; font-family: OpenSansLight; font-size: 20px; margin-bottom: 30px; } ul#countdown li p.timeRefDays, ul#countdown li p.timeRefHours, ul#countdown li p.timeRefMinutes, ul#countdown li p.timeRefSeconds { font-family: OpenSansLight !important; letter-spacing: 0.5px; position: relative; text-transform: uppercase; top: 73px; } @media (min-width: 768px) and (max-width: 979px) { } @media (max-width: 767px) { } /* Our Clients Logos -------------------------------- */ .clients { margin-left: 0; width: 100%; } .clients ul { float: left; margin: 0; padding: 0; position: relative; width: 100%; } .clients ul li { display: inline; float: left; width: 20%; } .clients ul li a { float: left; height: auto; width: 100%; } .clients ul li img { filter: none; height: auto; width: 100%; } .client { border-left: 1px solid #EEEEEE; border-right: 1px solid #EEEEEE; margin-right: -1px; } .clients ul li img:hover { filter: url("data:image/svg+xml;utf8,#grayscale"); filter: gray; -webkit-filter: grayscale(100%); } /* Services section - homepage */ .services { padding: 60px 0 } .services h3 { font-size: 18px; vertical-align: top; } .services i { display: block; float: left; font-size: 22px; height: 24px; margin: 0 12px 0 0; position: relative; width: 24px; } .services p { font-size: 13px; line-height: 1.6; margin: 0 0 20px; } .services .service-details { padding-left: 38px } /* Portfolio section - Homepage */ /* CSS Transitions */ .portfolio-item img, .item-meta-container, .portfolio-item .overlay .zoom { transition: all .3s ease; -webkit-transition: all .3s ease; border-radius: 3px 3px 0 0; } .portfolio-item-container { margin: 3px } .portfolio-section ul li { padding: 0 } .portfolio-item-container:hover { cursor: pointer } .portfolio-section .portfolio-item { overflow: hidden; position: relative; -webkit-backface-visibility: hidden; } .portfolio-item .overlay { background-color: rgba(0, 0, 0, 0); bottom: 0; left: 0; opacity: 0; position: absolute; right: 0; top: -100%; transition: all .2s ease; -webkit-transition: all .3s ease; } .portfolio-item img { width: 100% } .portfolio-item img { width: 100% } .portfolio-item-container:hover img { transform: scale(1.3); -webkit-transform: scale(1.3); } .portfolio-item-container:hover .overlay { background-color: rgba(20, 22, 23, 0.6); display: block; opacity: 1; top: 0; } .portfolio-item .overlay .zoom { background: none repeat scroll 0 0 rgba(0, 0, 0, 0.5); border-radius: 1500px; color: #FFFFFF; display: inline-block; font-size: 22px; margin: 0 auto; padding: 22px; text-align: center; } .portfolio-item .overlay:hover .zoom { color: #FFFFFF } .portfolio-item .overlay .preview-links { left: 50%; position: absolute; top: 50%; height: 50px; margin: -25px 0 0 -25px; } .portfolio-section .title { font-size: 18px; margin: 40px 0 30px; } .portfolio-section .item-meta-container { background: #f6f6f6; box-shadow: 0 -3px rgba(0, 0, 0, 0.1) inset; border-radius: 0 0 3px 3px; margin: 0; padding: 25px; text-align: center; -webkit-backface-visibility: hidden; } .portfolio-item-container:hover .item-meta-container { box-shadow: 0 -3px rgba(0, 0, 0, 0.1) inset } .portfolio-item-container:hover .item-meta-container h4, .portfolio-item-container:hover .item-meta-container span, .portfolio-item-container:hover .item-meta-container ul { color: #FFFFFF } .portfolio-section .item-title { color: #666; font-size: 14px; margin: 10px 0 5px; letter-spacing: 0.2px; line-height: 10px; } /* ========= PORTFOLIO PAGE ========= */ .filters { margin: 10px 0 25px; overflow: hidden; padding: 0; } .filters li { float: left; list-style: none outside none; } .filters a { color: #5C6D7E; display: block; font-size: 11px; margin: 0 5px; padding: 6px 14px; text-transform: uppercase; } .filters .active { border-radius: 5px; box-shadow: 0 -3px rgba(0, 0, 0, 0.1) inset; color: #FFFFFF; } .filters a:hover { border-radius: 5px; box-shadow: 0 -3px rgba(0, 0, 0, 0.1) inset; color: #FFFFFF; } .portfolio-items { } .portfolio-items #grid { margin: 0 0 30px; padding: 0; overflow: hidden; } #grid .mix { display: none; opacity: 0; } .portfolio-item { max-height: 200px; overflow: hidden; position: relative; } .portfolio-item .overlay { padding: 100px 115px } .portfolio-items .item { margin: 0 0 30px; overflow: hidden; } .two-col.portfolio-item { max-height: 315px } .three-col.portfolio-item { max-height: 290px } .portfolio-items .item img { width: 100% } .portfolio-items .item-title { color: #3E4651; font-size: 12px; line-height: 18px; margin: 0; } .portfolio-items .portfolio-item-container { margin: 0 } .portfolio-items .item-meta-container { background: none repeat scroll 0 0 #F6F6F6; border-radius: 0 0 3px 3px; box-shadow: 0 -3px rgba(0, 0, 0, 0.1) inset; margin: 0; padding: 15px; text-align: center; } .categories { color: #aaa; font-size: 12px; overflow: hidden; margin: 0; padding: 0; } .categories li { display: inline } .categories li:after { content: '/'; margin: 0 5px; } .categories li:last-child:after { display: none } .portfolio-items .item-desc { color: #5c6d7e; font-size: 12px; line-height: 2; } /* Portfolio page modal styles */ .modal-dialog { padding: 0; width: 680px; } .modal-content { background: none; border: 0; -webkit-box-shadow: none; -moz-box-shadow: none; box-shadow: none; margin: 40px 0; } .modal-header, .modal-body { border: 0; padding: 0; } .modal-header .close { color: #fff; font-size: 16px; opacity: 1; padding: 0 0 5px; text-shadow: none; } .modal .item-featured-image { width: 100% } .item-meta { background: #fff; padding: 20px; } .item-description { margin: 10px 0 0 } /*-----------------------------------------------------------------------------------*/ /* QUOTE SLIDER /*-----------------------------------------------------------------------------------*/ /*Quote Box 1*/ .quote-box { max-height: 410px; overflow: hidden !important; } blockquote.boxt > img { display: inline-block; float: right; margin-top: 5px; } #quoted > li { list-style: none outside none } blockquote.boxt { background: none repeat scroll 0 0 rgba(0, 0, 0, 0); border: medium none; margin: 0; padding: 0; } blockquote.boxt p { border-radius: 3px 3px 0; color: #FFFFFF; font-style: normal; padding: 25px; } .client-name { color: #444444; display: inline-block; float: right; font-size: 13px; font-style: normal; font-weight: bold; margin-right: 10px; text-align: right; } .client-name small { font-size: 11px; font-weight: 300; } .bubble { background: url("https://passbaconference.com/Portals/894/Skins/Flatna/img/bubble.png") no-repeat scroll right center rgba(0, 0, 0, 0); float: right; height: 15px; margin: 0 0 5px; width: 15px; } /*Quote Box 2*/ .quote-box2 { max-height: 410px; overflow: hidden !important; } blockquote.boxt2 > img { border-radius: 50%; display: inline-block; max-width: 60px !important; } #quoted2 > li { list-style: none outside none } blockquote.boxt2 { background: none repeat scroll 0 0 rgba(0, 0, 0, 0); border: medium none; margin: 0; padding: 0; } blockquote.boxt2 p { background-color: #F1F1F1; border-radius: 4px; font-style: normal; padding: 30px; } blockquote.boxt2 p:after { display: block; width: 0; content: ""; position: absolute; bottom: 55px; left: 15px; border: 10px solid transparent; border-top-color: #F1F1F1; -webkit-transition: border-color linear .2s; -moz-transition: border-color linear .2s; -o-transition: border-color linear .2s; } .client-name2 { color: #444444; display: inline-block; font-size: 13px; font-style: normal; font-weight: bold; margin: 15px 0 0 10px; } .job-title2 { font-size: 11px; font-weight: 300; line-height: 1em; } .swapmyli { display: block; margin-top: 15px; } .swapmyli.clearfix:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; } .swapmyli.clearfix { display: inline-block } /* Hide from IE Mac \*/ .swapmyli.clearfix { display: block } /* End hide from IE Mac */ .swapmyli ul { display: block; margin: 0; overflow: hidden; position: relative; } .swapmyli ul li { display: inline-block; padding: 0; /* Padding of list element */ width: 100%; position: absolute; clear: both; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } .swapmyli.nocss ul li { padding: 0 } .swapmyli .timer { background: none repeat scroll 0 0 #e9e9e9; /* Color of timer background */ width: 100%; height: 1px; /* Height of timer background */ overflow: hidden; } .swapmyli .timer span { width: 0%; height: 1px; /* Height of indicator */ display: block; } /* Other Client Testimonials */ .circle_testimonial { display: inline-block; float: left; margin-bottom: 30px; margin-left: 20px; margin-top: 30px; } .circle_testimonial p { -moz-box-sizing: border-box; background: none repeat scroll 0 0 #EEEEEE; border-radius: 6px; color: #999999; line-height: 20px; margin: 0; padding: 14px; position: relative; } .circle_testimonial em { color: #444444; float: left; font-size: 20px; margin-left: 3px; margin-top: 10px; } .circle_testimonial .title { color: #444444; float: left; font-size: 13px; font-weight: 500; margin-top: 10px; padding-left: 15px; } .circle_testimonial .position { color: #888888 } .single_testimonial { margin-bottom: 60px; width: 100%; } .single_testimonial dl { margin: 0 } .single_testimonial dd { background: none repeat scroll 0 0 #F5F5F5; border-radius: 6px; margin-left: 100px; max-height: 110px; padding: 25px; } .single_testimonial dt { width: 85px } .single_testimonial dt img { border-radius: 50%; float: left; height: 81px; width: 81px; } .single_testimonial dt .position { color: #999999; float: left; font-size: 11px; font-style: italic; font-weight: 300; margin-top: -2px; text-align: center; width: 81px; } .single_testimonial dt h6 { color: #444444; float: left; font-size: 12px; line-height: 10px !important; text-align: center; width: 81px; } .single_testimonial dd em { color: #E2E2E2; float: left; font-size: 50px; margin-right: 20px; } .single_testimonial dd p { color: #999999; font-size: 12px; font-style: italic; margin: 0; } /*Testimonials with white bubble*/ .testi-bubble { position: relative; background: none repeat scroll 0 0 #F4F4F4; padding: 30px; font-style: italic; -webkit-border-radius: 6px; -moz-border-radius: 6px; -o-border-radius: 6px; border-radius: 6px; -webkit-transition: background linear .2s, color linear .2s; -moz-transition: background linear .2s, color linear .2s; -o-transition: background linear .2s, color linear .2s; } .testi-bubble:after { display: block; width: 0; content: ""; position: absolute; bottom: -20px; left: 15px; border: 10px solid transparent; border-top-color: #FFFFFF; -webkit-transition: border-color linear .2s; -moz-transition: border-color linear .2s; -o-transition: border-color linear .2s; } .testi:hover .testi-bubble { color: #FFFFFF } .Top-Shaded-Row .testi-bubble, .Middle-Shaded-Row .testi-bubble, .Bottom-Shaded-Row .testi-bubble { background: #FFFFFF } .Top-Shaded-Row .testi-bubble:after, .Middle-Shaded-Row .testi-bubble:after, .Bottom-Shaded-Row .testi-bubble:after { background: none repeat scroll 0 0 #f4f4f4 } .person { margin-top: 20px; width: 100%; display: inline-block; } .person img { border-radius: 4px; margin-right: 20px; max-width: 60px !important; } h3.no-margin-bottom { font-family: OpenSansLight; font-size: 22px; line-height: 1em !important; margin: 0; } h4.jobTitle { font-size: 14px; line-height: 1em !important; } /*------------------------------------------------*/ /* Google Maps */ /*------------------------------------------------*/ div.google-map { background: #E5E3DF; height: 400px; margin: 0; width: 100%; } div.google-map img { max-width: 9999px } /* Back to Top */ #to-top { display: block; position: fixed; text-align: center; right: 17px; bottom: -30px; color: #fff; cursor: pointer; border-radius: 4px; -moz-border-radius: 4px; -webkit-border-radius: 4px; -o-border-radius: 4px; z-index: 10000; height: 30px; width: 30px; background-color: rgba(0,0,0,0.4); background-repeat: no-repeat; background-position: center; transition: background-color 0.1s linear; -moz-transition: background-color 0.1s linear; -webkit-transition: background-color 0.1s linear; -o-transition: background-color 0.1s linear; } #to-top i { line-height: 30px!important; width: 30px!important; height: 30px!important; font-size: 14px!important; top: 0px!important; left: 0px!important; text-align: center!important; background-color: transparent!important; } /*----------------------------------------------------------------------------------- COLORS -----------------------------------------------------------------------------------*/ a.rox_short_button.emerald { background: #27CFC3 } a.rox_short_button.green-apple { background: #2ecc71 } a.rox_short_button.river { background: #3498db } a.rox_short_button.midnight-blue { background: #34495e } a.rox_short_button.sunset { background: #f1c40f } a.rox_short_button.carrot { background: #e67e22 } a.rox_short_button.tango { background: #F6653C } a.rox_short_button.silver { background: #C9CFD2 } a.rox_short_button.concrete { background: #95a5a6 } a.rox_short_button.dark { background: #333333 } /*----------------------------------------------------------------------------------- CUSTOM BUTTONS by DNNRox -----------------------------------------------------------------------------------*/ a.rox_short_button { border-radius: 4px; display: inline-block; font-family: OpenSansBold; font-size: 10px; letter-spacing: 1px; line-height: 18px; margin: 0 5px 5px 0; padding: 10px 16px; text-decoration: none; text-transform: uppercase; } a.rox_short_button.large { font-family: OpenSansBold; font-size: 11px; letter-spacing: 1.2px; line-height: 20px; padding: 15.5px 22px; text-transform: uppercase; } a.rox_short_button.jumbo { font-family: OpenSansBold; font-size: 12px; letter-spacing: 1.5px; line-height: 24px; padding: 20px 26px; text-transform: uppercase; } /*** Button Style 1 */ a.rox_short_button.default { color: #fff; box-shadow: 0 -3px rgba(0, 0, 0, 0.1) inset; } a.rox_short_button.default:hover { background: none repeat scroll 0 0 #444444; box-shadow: 0 -3px rgba(0, 0, 0, 0.1) inset; color: #FFF; } a.rox_short_button:hover { background: none repeat scroll 0 0 rgba(0, 0, 0, 0.7); box-shadow: 0 -3px rgba(0, 0, 0, 0.3) inset; } a.rox_short_button.emerald { color: #fff; box-shadow: 0 -3px rgba(0, 0, 0, 0.1) inset; } a.rox_short_button.green-apple { color: #fff; box-shadow: 0 -3px rgba(0, 0, 0, 0.1) inset; } a.rox_short_button.river { color: #fff; box-shadow: 0 -3px rgba(0, 0, 0, 0.1) inset; } a.rox_short_button.midnight-blue { color: #fff; box-shadow: 0 -3px rgba(0, 0, 0, 0.1) inset; } a.rox_short_button.sunset { color: #fff; box-shadow: 0 -3px rgba(0, 0, 0, 0.1) inset; } a.rox_short_button.carrot { color: #fff; box-shadow: 0 -3px rgba(0, 0, 0, 0.1) inset; } a.rox_short_button.tango { color: #fff; box-shadow: 0 -3px rgba(0, 0, 0, 0.1) inset; } a.rox_short_button.silver { color: #fff; box-shadow: 0 -3px rgba(0, 0, 0, 0.1) inset; } a.rox_short_button.concrete { color: #fff; box-shadow: 0 -3px rgba(0, 0, 0, 0.1) inset; } a.rox_short_button.dark { color: #fff; background-color: #444444; box-shadow: 0 -3px rgba(0, 0, 0, 0.1) inset; } a.rox_short_button.dark:hover { color: #fff; background: none repeat scroll 0 0 rgba(0, 0, 0, 0.7); box-shadow: 0 -3px rgba(0, 0, 0, 0.1) inset; } .rox_short_button em, .rox_short_button2 em { font-size: 16px; margin: 0 15px 0 0; position: relative; top: 2px; } a.rox_short_button2 { border-radius: 4px; display: inline-block; font-family: OpenSansBold; font-size: 10px; letter-spacing: 1px; line-height: 18px; margin: 0 5px 5px 0; padding: 10px 16px; text-decoration: none; text-transform: uppercase; } a.rox_short_button2.large { font-family: OpenSansBold; font-size: 11px; letter-spacing: 1.2px; line-height: 20px; padding: 13px 18px; text-transform: uppercase; } a.rox_short_button2.jumbo { font-family: OpenSansBold; font-size: 12px; letter-spacing: 1.5px; line-height: 24px; padding: 16px 18px; text-transform: uppercase; } /*** Button style 2*/ a.rox_short_button2.default { transition: top 200ms linear 0s } a.rox_short_button2.default:hover { box-shadow: 0 -1.2px rgba(0, 0, 0, 0.1) inset; color: #FFFFFF; } a.rox_short_button2.plain { color: #FFFFFF; border: 2px solid #FFFFFF; transition: top 200ms linear 0s; } a.rox_short_button2.plain:hover { color: #000000; background: #FFFFFF; } a.rox_short_button2.emerald { color: #fff; border: 2px solid #27CFC3; } a.rox_short_button2.emerald:hover { background: #27CFC3 } a.rox_short_button2.green-apple { color: #fff; border: 2px solid #2ecc71; } a.rox_short_button2.green-apple:hover { background: #2ecc71 } a.rox_short_button2.river { color: #fff; border: 2px solid #3498db; } a.rox_short_button2.river:hover { background: #3498db } a.rox_short_button2.midnight-blue { color: #fff; border: 2px solid #34495e; } a.rox_short_button2.midnight-blue:hover { background: #34495e } a.rox_short_button2.sunset { color: #fff; border: 2px solid #f1c40f; } a.rox_short_button2.sunset:hover { background: #f1c40f } a.rox_short_button2.carrot { color: #fff; border: 2px solid #e67e22; } a.rox_short_button2.carrot:hover { background: #282828 } a.rox_short_button2.tango { color: #fff; border: 2px solid #F6653C; } a.rox_short_button2.tango:hover { background: #F6653C } a.rox_short_button2.silver { color: #fff; border: 2px solid #C9CFD2; } a.rox_short_button2.silver:hover { background: #C9CFD2 } a.rox_short_button2.concrete { color: #fff } a.rox_short_button2.concrete:hover { background: #95a5a6 } a.rox_short_button2.dark { color: #fff; border: 2px solid #333333; } a.rox_short_button2.dark:hover { background: #333333 } /*** Button Group*/ .bttn { cursor: pointer; display: inline-block; font-family: OpenSansBold; font-weight: normal; } .bttn, .bttn:hover, #footer .bttn, #footer .bttn:hover { color: #FFFFFF !important; text-transform: uppercase; } .bttn:hover { background-color: #444444 } .bttn + .bttn { margin-left: 30px } .bttn-group { margin: 0 auto; overflow: hidden; position: relative; } .bttn-group .bttn { box-shadow: 0 -3px rgba(0, 0, 0, 0.1) inset; float: left; font-size: 18px; letter-spacing: -1px; margin: 0; overflow: hidden; padding: 25px 0; text-align: center; text-transform: uppercase; width: 50%; } .bttn-group .or { background-color: #FFFFFF; display: block; font-size: 12px; font-weight: bold; height: 40px; left: 50.4%; line-height: 41px; margin-left: -23px; margin-top: -20px; position: absolute; text-align: center; text-transform: uppercase; top: 50%; width: 40px; z-index: 99; } .bttn-group .bttn-title { display: block } .bttn-group .bttn-subtitle { font-family: OpenSansLight !important; font-size: 12px; font-weight: normal; letter-spacing: 0; line-height: 18px; } .bttn-group .bttn:first-child { border-radius: 4px 0 0 4px; border-right: 1px solid #FFFFFF; } .bttn-group .bttn:last-child { border-radius: 0 4px 4px 0 } .bttn-title, .bttn-title a { color: #FFFFFF; display: block; text-decoration: none; } .radius-200 { border-radius: 200px } .grey { background-color: #444444 } .one-half { width: 48% } h1.title, h2.title, h3.title, h4.title, h5.title, h6.title { font-family: OpenSansLight; font-size: 26px; font-weight: 300; letter-spacing: -0.5px; line-height: 30px; } .one.text-align-center h4 { font-family: OpenSansLight; font-size: 21px; line-height: 18px; margin: 0 0 10px; } /*-----------------------------------------------------------------------------------*/ /* Custom Callout Boxes /*-----------------------------------------------------------------------------------*/ .rox-custom-box-title-boldregular { font-family: 'OpenSansBold'; font-size: 28px; letter-spacing: -0.5px; margin-bottom: 20px; } .rox-custom-box-title-boldcondensed { font-family: 'OpenSansBold'; font-size: 28px; margin-bottom: 20px; } .rox-custom-box-title-thinregular { font-family: 'OpenSansLight'; font-size: 40px; margin-bottom: 30px; } .micon-size-jumbo { font-size: 128px; display: block; } .micon-size-large { color: #98DBD6; display: block; font-size: 64px; margin-bottom: 40px; } .micon-size-medium { font-size: 32px; display: block; } /* ===== PAGE DIVIDERS ===== */ .g-hr { position: relative; clear: both; margin: 40px 0; width: 100%; height: 10px; } .g-hr-h { position: absolute; top: 50%; left: 0; height: 0; width: 100%; border-top: 1px solid #e8e8e8; } .g-hr-h em { position: absolute; top: 0; left: 50%; font-size: 16px; height: 16px; width: 50px; margin-top: -8px; margin-left: -25px; text-align: center; background-color: #fff; color: #e8e8e8; } .g-hr.size_small { margin: 30px 0 } .g-hr.size_big { margin: 50px 0 } .g-hr.type_invisible { margin: 15px 0 } .g-hr.type_invisible.size_small { margin: 5px 0 } .g-hr.type_invisible.size_big { margin: 25px 0 } .g-hr.type_invisible .g-hr-h { display: none } .g-hr.type_short .g-hr-h { left: 50%; width: 30%; margin-left: -15%; } .home-title, .widget-title { margin: 30px 0 0 } hr { clear: both; height: 0; border-width: 1px 0 0; border-top: 1px solid #D9D9D9; } hr.style-one { border: none; border-top: medium double #DDDDDD; text-align: center; color: #999999; } hr.style-one:after { font-family: 'icomoon'; content: '\e23a'; display: inline-block; position: relative; top: -0.6em; font-size: 1.5em; padding: 0 0.25em; background: white; } hr.style-two { border: 0 none; height: 1px; } hr.style-three { border: 0; height: 1px; background-image: -webkit-linear-gradient(left, rgba(221,221,221,0), rgba(187,187,187,1.0), rgba(221,221,221,0)); background-image: -moz-linear-gradient(left, rgba(221,221,221,0), rgba(187,187,187,1.0), rgba(221,221,221,0)); background-image: -ms-linear-gradient(left, rgba(221,221,221,0), rgba(187,187,187,1.0), rgba(221,221,221,0)); background-image: -o-linear-gradient(left, rgba(221,221,221,0), rgba(187,187,187,1.0), rgba(221,221,221,0)); } hr.style-four { border: 0; border-bottom: 1px dashed #BBBBBB; } hr.style-five { background: url("../img/hr-double-dotted.png") repeat-x scroll 0 50% transparent; border: 0 none; clear: both; height: 10px; width: 100%; } hr.style-six { border: none; border-top: medium double #DDDDDD; text-align: center; color: #999999; } hr.no-margin-top { margin-top: 0 !important } .right { float: right } .left { float: left } /* ===== Back to Top ===== */ #toTop { position: fixed; bottom: 40px; right: 20px; text-decoration: none; cursor: pointer; z-index: 999; display: block; font-size: 11px; text-transform: uppercase; color: #999999; -webkit-transition: .1s all linear; -moz-transition: .1s all linear; transition: .1s all linear; } #toTop:before { font-family: 'icomoon'; content: '\f102'; font-size: 32px; color: #999999; line-height: 32px; display: block; text-align: center; -webkit-transition: .1s all linear; -moz-transition: .1s all linear; transition: .1s all linear; } /*------------------------------------------------*/ /* BOOTSTRAP ELEMENT STYLES */ /*------------------------------------------------*/ /* ***** - Hero Unit - ***** */ .hero-unit { -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; background-color: #F0F0F4; -webkit-box-shadow: none; -moz-box-shadow: none; box-shadow: none; } .hero-unit h1 { margin-bottom: 10px } /* ***** - Alert - ***** */ .alert { border: medium none !important; border-radius: 4px; margin-bottom: 20px; padding: 14px 35px 14px 14px; } .alert.alert-block { -moz-border-radius: 3px; -webkit-border-radius: 3px; border-radius: 3px; border: 0 none; background-color: #FFD56C; color: #000; } .alert.alert-block h4 { color: #000; margin-bottom: 10px; } .alert.alert-info { background-color: #54DCFF; color: #000; border: 0 none; } .alert.alert-error { -moz-border-radius: 3px; -webkit-border-radius: 3px; border-radius: 3px; border: 0 none; background-color: #FE504F; color: #000; text-shadow: none; } .alert.alert-error h4 { color: #753c3c; margin-bottom: 10px; text-shadow: none; } .alert.alert-success { -moz-border-radius: 3px; -webkit-border-radius: 3px; border-radius: 3px; border: 0 none; background-color: #51E3A8; color: #000; text-shadow: none; } .breadcrumb li a { text-shadow: none } .breadcrumb .active { text-shadow: none } .breadcrumb span.divider { text-shadow: none } /* ***** - Skills & Progress Bars - ***** */ .skill { display: inline; margin-bottom: 6px !important; padding: 4px 2px; text-align: center; } .progress { background-color: #EBEBEB; box-shadow: 0 1px 2px rgba(0, 0, 0, 0.12) inset; margin-bottom: 13px; height: 6px !important; overflow: visible; border-radius: 300px 300px 300px 300px; -moz-border-radius: 300px 300px 300px 300px; -webkit-border-radius: 300px 300px 300px 300px; } .progress .bar { box-shadow: none; position: relative; height: 6px; text-indent: -9999px; border-radius: 300px 300px 300px 300px; -moz-border-radius: 300px 300px 300px 300px; -webkit-border-radius: 300px 300px 300px 300px; } .progress-success .bar, .progress .bar-success { background-image: none; filter: none; } /* ***** - Thumbnail - ***** */ .thumbnail { padding: 0; -moz-border-radius: 0 0 5px 5px; -webkit-border-radius: 0 0 5px 5px; border-radius: 0 0 5px 5px; background-color: #F1F1F1; border: 0; -webkit-box-shadow: none; -moz-box-shadow: none; box-shadow: none; } .thumbnail .caption { padding: 30px 20px 20px } .thumbnail .caption p { margin-bottom: 20px } /*-------------------------------------------------------------------------*/ /* New Service Icon Features style1 /*-------------------------------------------------------------------------*/ .rox-features > p { line-height: 20px; margin: 0; } .rox-features.style1 { cursor: pointer; margin: auto; text-align: center; } .rox-features.style1 em { background-color: #F9F9F9; width: 90px; height: 90px; font-size: 28px; line-height: 90px; margin-bottom: 20px; display: inline-block; position: relative; -webkit-border-radius: 100px; -moz-border-radius: 100px; -ms-border-radius: 100px; border-radius: 100px; -webkit-transition: all 0.2s ease; -moz-transition: all 0.2s ease; transition: all 0.2s ease; } .rox-features.style1 em:after { position: absolute; top: 6px; left: 6px; width: 85%; height: 85%; border-radius: 50%; content: ''; -webkit-transform: scale(1.15); -moz-transform: scale(1.15); -ms-transform: scale(1.15); transform: scale(1.15); -webkit-transition: all 0.2s ease; -moz-transition: all 0.2s ease; transition: all 0.2s ease; } .rox-features.style1:hover em:after { -webkit-transform: scale(1.4); -moz-transform: scale(1.4); -ms-transform: scale(1.4); transform: scale(1.4); opacity: 0; } .rox-features h4 { color: #444444; font-size: 16px; line-height: 1; } .rox-features.style1 em { background-color: rgba(0, 0, 0, 0) } .rox-features.style1:hover em { color: #fff } .rox-features.style2 { cursor: pointer; margin: 20px 0; text-align: center; } .rox-features.style2 em { width: 100px; height: 100px; color: #fff; font-size: 35px; line-height: 100px; margin-bottom: 30px; display: inline-block; position: relative; -webkit-border-radius: 100px; -moz-border-radius: 100px; -ms-border-radius: 100px; border-radius: 100px; -webkit-transition: all 0.2s ease; -moz-transition: all 0.2s ease; transition: all 0.2s ease; } .rox-features.style2 em:after { position: absolute; top: 4px; left: 4px; width: 92%; height: 92%; border-radius: 50%; content: ''; -webkit-transform: scale(1.15); -moz-transform: scale(1.15); -ms-transform: scale(1.15); transform: scale(1.15); -webkit-transition: all 0.2s ease; -moz-transition: all 0.2s ease; transition: all 0.2s ease; } .rox-features.style2:hover em:after { -webkit-transform: scale(1.4); -moz-transform: scale(1.4); -ms-transform: scale(1.4); transform: scale(1.4); opacity: 0; } .rox-features.style2:hover em { background: none repeat scroll 0 0 #CCCCCC } /*-----------------------------------------------------------------*/ /* Pricing Boxes *New /*-----------------------------------------------------------------*/ .pricing-table.columns-4 .pricing-column.highlight { margin-right: 1%; /*width: 26%;*/ } .pricing-table.columns-4 .pricing-column { width: 23.66% } .pricing-table.columns-5 .pricing-column.highlight { margin-right: 1%; width: 21%; } .pricing-table.columns-5 .pricing-column { width: 18.75% } .pricing-table.columns-6 .pricing-column.highlight { margin-right: 1%; width: 17.66%; } .pricing-table.columns-6 .pricing-column { width: 15.46% } .pricing-table.columns-1 .pricing-column.highlight { width: 100% } .pricing-table.columns-1 .pricing-column { width: 100% } .pricing-table.columns-2 .pricing-column.highlight { width: 51% } .pricing-table.columns-2 .pricing-column { width: 48% } .pricing-table.columns-3 .pricing-column.highlight { margin-right: 1%; width: 34.33%; } .pricing-table.columns-3 .pricing-column { width: 31.83% } .pricing-table .pricing-column.highlight { margin-top: 0; padding: 0; width: 260px; } .pricing-table .pricing-column.highlight header { height: 82px } .pricing-table .pricing-column.highlight header span.name { color: #FFFFFF } .pricing-table .pricing-column.highlight footer { padding: 30px 0 50px } .pricing-table .pricing-column { background: none repeat scroll 0 0 #FFFFFF; border-radius: 2px; box-shadow: 0 1px 4px rgba(0, 0, 0, 0.12); float: left; margin: 20px 1% 0 0; } .pricing-table .pricing-column header, .pricing-table .pricing-column div.pricing, .pricing-table .pricing-column li { border-bottom: 1px solid #EEEEEE } .pricing-table .pricing-column ul { display: block; list-style: none outside none; } .pricing-table .pricing-column ul li:nth-child(2n+1) { background: none repeat scroll 0 0 #FBFBFB } .pricing-table .pricing-column ul li { display: block; font-size: 12px; padding: 8px 12px; text-align: center; } .pricing-table .pricing-column ul li span.cell { display: inline-block; float: none; vertical-align: middle; } .pricing-table .pricing-column header { border-radius: 2px 2px 0 0; color: #444444; height: 62px; text-align: center; } .pricing-table .pricing-column header span.name { font-family: OpenSansSemiBold; font-size: 26px; letter-spacing: -0.5px; line-height: 28px; padding: 18px 0 0; } .pricing-table .pricing-column header span.sub { font-family: OpenSansBold; font-size: 12px; letter-spacing: 1.5px; line-height: 28px; text-transform: uppercase; } .pricing-table .pricing-column header span { display: block } .pricing-table .pricing-column footer { padding: 30px 0; text-align: center; } .pricing-table .pricing-column div.pricing { padding: 20px; text-align: center; } .pricing-table .pricing-column div.pricing span.recurrence { display: block; font-size: 12px; } .pricing-table .pricing-column div.pricing span.price { display: block; font-family: OpenSansSemiBold; font-size: 54px; letter-spacing: -0.5px; line-height: 42px; width: 100%; } .pricing-table .pricing-column div.pricing span.price span.currency { font-family: OpenSansLight; font-size: 22px; line-height: 22px; padding-bottom: 40px; padding-right: 8px; vertical-align: top; } .pricing-table .pricing-column div.pricing span.price span.decimal { font-size: 24px; line-height: 40px; vertical-align: bottom; } .pricing-table { margin-bottom: 40px } .pricing-table:after { content: ""; display: block; height: 0; clear: both; visibility: hidden; } .pricing-table > div:first-child .pricing-column-content, .pricing-table > div:first-child h3 { border-left: 1px solid #e4e4e4!important } .pricing-column { float: left; overflow: hidden; text-align: center; padding: 0px; background-color: #fff; transition: box-shadow 0.2s linear; -moz-transition: box-shadow 0.2s linear; -webkit-transition: box-shadow 0.2s linear; -o-transition: box-shadow 0.2s linear; } .pricing-column .pricing-column-content { border-right: 1px solid #e4e4e4; border-bottom: 1px solid #e4e4e4; padding: 0px 0px 20px 0px; } .pricing-column.highlight { position: relative; z-index: 100; margin: -20px -1px 0px -1px; background-color: #FFF; box-shadow: 0px 0px 13px rgba(0,0,0,.19); -moz-box-shadow: 0px 0px 13px rgba(0,0,0,.19); -webkit-box-shadow: 0px 0px 13px rgba(0,0,0,.19); -o-box-shadow: 0px 0px 13px rgba(0,0,0,.19); } .pricing-column.highlight .nectar-button { margin: 10px 0px 20px 0px } .pricing-column.highlight .pricing-column-content, .pricing-column.highlight h3 { border: none } .pricing-column.highlight h3 .highlight-reason { display: block; font-family: 'OpenSansbold'; font-size: 12px; text-transform: uppercase; letter-spacing: 1.5px; color: rgba(0, 0, 0, 0.4); } .pricing-column.highlight .pricing-column-content { border-right: 1px solid #e4e4e4; border-left: 1px solid #e4e4e4; border-bottom: 1px solid #e4e4e4; } .pricing-column.highlight:hover { box-shadow: 0px 0px 13px rgba(0,0,0,.15); -moz-box-shadow: 0px 0px 13px rgba(0,0,0,.15); -webkit-box-shadow: 0px 0px 13px rgba(0,0,0,.15); -o-box-shadow: 0px 0px 13px rgba(0,0,0,.15); } .pricing-column ul li { color: #888!important; padding: 10px 25px; list-style: none; line-height: 18px; border-bottom: 1px solid #efefef; } .pricing-column ul li:first-child { border-top: 1px solid rgba(0, 0, 0, 0) } .pricing-column ul li:nth-child(2n+1) { background-color: #fbfbfb } .pricing-column.highlight h3 { color: #fff!important; background-color: #27CFC3; padding: 15px 0px; margin-bottom: 0px!important; } .toggle .pricing-column h3 { font-size: 26px!important } .pricing-column h3 { background-color: #fff; color: #27CFC3; margin-bottom: 0px; font-size: 26px; line-height: 28px; border-right: 1px solid #e4e4e4; border-bottom: 1px solid #EFEFEF; border-top: 1px solid #e4e4e4; padding: 18px 0px 18px 0px; } .pricing-column h4 { margin-left: -22px; padding: 20px 30px 6px 30px; font-size: 54px!important; line-height: 42px!important; color: #333; margin-bottom: 0px; } .pricing-column h4 .dollar-sign { font-size: 22px; line-height: 22px; top: -14px; right: -6px; font-family: 'OpenSansLight'; position: relative; } .pricing-column .interval { display: block; color: #999; min-height: 38px; display: block; padding-bottom: 17px; } .pricing-column ul { margin-left: 0px } .pricing-table.six-cols > div { width: 16.5% } .pricing-table.five-cols > div { width: 20% } .pricing-table.four-cols > div { width: 25% } .pricing-table.three-cols > div { width: 33.2% } .pricing-table.two-cols > div { width: 50% } .pricing-table .col { padding: 0px 20px } .col .pricing-table h3 { margin-bottom: 0px } div.pricing-table div.pricing-column { background: none repeat scroll 0 0 #FFFFFF } div.pricing-table div.pricing-column header, div.pricing-table div.pricing-column div.pricing, div.pricing-table div.pricing-column ul li { border-bottom: 1px solid #EEEEEE } div.pricing-table div.pricing-column header { background: none repeat scroll 0 0 #FFFFFF } div.pricing-table div.pricing-column.highlight header span.name { color: #FFFFFF } div.pricing-table div.pricing-column header span.sub { color: rgba(0, 0, 0, 0.4) } div.pricing-table div.pricing-column div.pricing span.price { color: #333333 } div.pricing-table div.pricing-column div.pricing span.price span.currency { color: #333333 } div.pricing-table div.pricing-column div.pricing span.price span.decimal { color: #444444 } div.pricing-table div.pricing-column div.pricing span.recurrence { color: #777777 } div.pricing-table div.pricing-column ul li { color: #777777 } div.pricing-table div.pricing-column ul li:nth-child(2n+1) { background: none repeat scroll 0 0 #FBFBFB } .pricing-table .pricing-column footer { padding: 30px 0; text-align: center; box-shadow: none; margin-top: 0; } .last { clear: right; margin-right: 0 !important; } @media only screen and (max-width: 991px) { /* CSS Document */ div.pricing-table.columns-6 div.pricing-column, div.pricing-table.columns-5 div.pricing-column, div.pricing-table.columns-4 div.pricing-column, div.pricing-table.columns-3 div.pricing-column, div.pricing-table.columns-2 div.pricing-column, div.pricing-table.columns-1 div.pricing-column, div.pricing-table.columns-6 div.pricing-column.highlight, div.pricing-table.columns-5 div.pricing-column.highlight, div.pricing-table.columns-4 div.pricing-column.highlight, div.pricing-table.columns-3 div.pricing-column.highlight, div.pricing-table.columns-2 div.pricing-column.highlight, div.pricing-table.columns-1 div.pricing-column.highlight { width: 49%; margin: 10px 1% 40px 0; } div.pricing-table.columns-6 div.pricing-column.last, div.pricing-table.columns-5 div.pricing-column.last, div.pricing-table.columns-4 div.pricing-column.last, div.pricing-table.columns-3 div.pricing-column.last, div.pricing-table.columns-2 div.pricing-column.last, div.pricing-table.columns-1 div.pricing-column.last, div.pricing-table.columns-6 div.pricing-column.highlight.last, div.pricing-table.columns-5 div.pricing-column.highlight.last, div.pricing-table.columns-4 div.pricing-column.highlight.last, div.pricing-table.columns-3 div.pricing-column.highlight.last, div.pricing-table.columns-2 div.pricing-column.highlight.last, div.pricing-table.columns-1 div.pricing-column.highlight.last { width: 50%; margin: 10px 0 40px; } div.pricing-table.columns-6 div.pricing-column.highlight, div.pricing-table.columns-5 div.pricing-column.highlight, div.pricing-table.columns-4 div.pricing-column.highlight, div.pricing-table.columns-3 div.pricing-column.highlight, div.pricing-table.columns-2 div.pricing-column.highlight, div.pricing-table.columns-1 div.pricing-column.highlight, div.pricing-table.columns-6 div.pricing-column.highlight.last, div.pricing-table.columns-5 div.pricing-column.highlight.last, div.pricing-table.columns-4 div.pricing-column.highlight.last, div.pricing-table.columns-3 div.pricing-column.highlight.last, div.pricing-table.columns-2 div.pricing-column.highlight.last, div.pricing-table.columns-1 div.pricing-column.highlight.last { margin-top: 0 } } @media only screen and (max-width: 690px) { /* CSS Document */ .pricing-table.columns-6 .pricing-column, .pricing-table.columns-5 .pricing-column, .pricing-table.columns-4 .pricing-column, .pricing-table.columns-3 .pricing-column, .pricing-table.columns-2 .pricing-column, .pricing-table.columns-1 .pricing-column { width: 100%!important; margin: 0 0 40px!important; } } /*-----------------------------------------------------------------*/ /* Pricing Boxes from FLATNA Version 1 /*-----------------------------------------------------------------*/ .pricing-table h1 { color: #FFFFFF; font-family: 'Roboto Condensed',sans-serif; font-size: 80px; font-weight: 500; line-height: 68px; margin: 30px 0; } .pricing-table h2 { color: #FFFFFF; font-family: 'Roboto Condensed',sans-serif; font-size: 20px; font-weight: 400; } .pricing-table h1 sup { font-family: 'Roboto Condensed',sans-serif; font-size: 28px; margin-right: 5px; vertical-align: middle; } .pricing-table p { } .two-column-top, .three-column-top, .four-column-top { border-radius: 4px 4px 0 0; color: #FFFFFF; font-weight: 400; line-height: 28px; padding: 30px; text-align: center; } .two-column-top.first { background: none repeat scroll 0 0 #95A5A6 } .two-column-top.second { background: none repeat scroll 0 0 #444444 } .three-column-top.second { background: none repeat scroll 0 0 #2ECC71 } .three-column-top.third { background: none repeat scroll 0 0 #3498DB } .four-column-top.first { background: none repeat scroll 0 0 #34495E } .four-column-top.second { background: none repeat scroll 0 0 #F1C40F } .four-column-top.third { background: none repeat scroll 0 0 #E67E22 } .four-column-top.fourth { background: none repeat scroll 0 0 #F6653C } .pricing-table-middle { border: 1px solid #d9d9d9; border-radius: 0 0 4px 4px; background: none repeat scroll 0 0 #fafafa; padding: 30px 40px; font-size: 14px; } .pricing-table-bottom { padding-top: 10px; text-align: center; } .pricing-table ul { list-style-type: disc } .pricing-table ul li { padding: 2px 0 } /* ========= HOMEPAGE ========= */ /* Featured Slider */ .featured-slider { height: 500px; overflow: hidden; position: relative; width: 100%; } .featured-slider .container { height: 500px; position: relative; } .featured-slider .slide-meta { color: #fff; left: 15px; max-width: 1170px; margin: 0 auto; position: absolute; top: 200px; } .featured-slider .slide-meta .slide-title { background: rgba(0, 181, 181, 0.63); font-size: 28px; font-weight: 700; margin: 0; padding: 9px 17px; } .featured-slider .slide-meta .slide-description { margin: 0 0 20px } .featured-slider .slide-meta .slide-description span { background: rgba(0, 0, 0, 0.43); font-size: 16px; line-height: 37px; padding: 7px 18px; } .featured-slider .slides li { height: 500px } .featured-slider li .backdrop-featured-image { display: block; width: 100%; } .featured-slider .slide-contents { height: 500px; left: 0; overflow: hidden; position: absolute; top: 0; width: 100%; } .featured-slider li .rhs-featured-image { position: absolute; right: 0; top: 50%; } .featured-slider .slides { height: 500px; margin: 0; overflow: hidden; padding: 0; position: relative; } .featured-slider .flex-direction-nav a { background: rgba(0, 0, 0, 0.7); border-radius: 3px; color: #FFF; font-size: 0; height: 62px; margin-top: -32px; position: absolute; top: 50%; width: 32px; z-index: 100; } .featured-slider .flex-prev:before, .featured-slider .flex-next:before { font-family: icomoon; font-size: 32px; font-style: normal; font-weight: normal; left: 11px; position: absolute; text-decoration: inherit; top: 6px; -webkit-font-smoothing: antialiased; } .featured-slider .flex-prev { opacity: 0; left: -40px; } .featured-slider .flex-prev:before { content: "\f104" } .featured-slider .flex-next { opacity: 0; right: -40px; } .featured-slider .flex-next:before { content: "\f105" } .featured-slider:hover .flex-prev { left: 20px; opacity: 1; } .featured-slider:hover .flex-next { opacity: 1; right: 20px; } /* Fit Video Plugin*/ video { max-width: 100%; height: auto; } iframe, embed, object { max-width: 100% } .vendor { padding: 2%; background: #d1eed1; margin-bottom: 2em; } .unsupported { background: #fddfde } /* Animated Pie Chart*/ p.prcnt { color: #444444; font-family: OpenSansSemiBold; font-size: 14px; margin: 0 0 5px; text-align: center; text-transform: uppercase; } .chart { margin: 0 0 20px; position: relative; } .easyPieChart { position: relative; text-align: center; } .easyPieChart canvas { } .percentage { position: relative; width: 120px; height: 120px; margin: 10px auto; } .label { background: 0 0; text-shadow: none; font-size: 16px; font-weight: 300; line-height: 24px; margin: 10px 0 0; padding: 0; color: #777; } .percentage_inner { border-radius: 50%; height: 90px; left: 20%; line-height: 90px; position: absolute; top: 20%; width: 90px; z-index: 2; font-size: 21px; } .credits { padding-top: .5em; clear: both; color: #999; } .credits a { color: #333 } .dark { background: #333 } .dark .label, .dark .percentage-light { text-align: center; color: #999; font-weight: 100; font-size: 1.2em; margin-bottom: .3em; } /*------------------------------------*\ FluidVids \*------------------------------------*/ .vid-wrapper { margin: 0 auto; text-align: center; } .fluidvids { background: #000; margin: 30px 0; } @media only screen and (max-width: 640px) { .vid-wrapper { } } @media only screen and (max-width: 800px) { .vid-wrapper { } } /** Carousel **/ .jcarousel { overflow: hidden; position: relative; width: 100%; } .jcarousel ul { width: 20000em; position: relative; list-style: none; margin: 0; padding: 0; } .jcarousel li { width: 200px; float: left; border-left: 12px solid rgba(0, 0, 0, 0); -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; } .jcarousel img { display: block; max-width: 100%; height: auto !important; } /** Carousel Controls **/ .jcarousel-control-prev, .jcarousel-control-next { -moz-font-feature-settings: normal; -moz-font-language-override: normal; border-radius: 4px; color: #FFFFFF !important; cursor: pointer; font-size: 18px !important; font-weight: normal; height: 25px; line-height: 22px; margin-top: -15px; position: absolute; text-align: center; text-decoration: none; top: 50%; width: 25px; -webkit-box-shadow: 0 -3px rgba(0, 0, 0, 0.1) inset; -moz-box-shadow: 0 -3px rgba(0, 0, 0, 0.1) inset; box-shadow: 0 -3px rgba(0, 0, 0, 0.1) inset; } .jcarousel-control-prev { right: 28px } .jcarousel-control-next { right: 0 } /** Carousel Pagination **/ .jcarousel-pagination { position: absolute; bottom: -40px; left: 50%; -webkit-transform: translate(-50%, 0); -ms-transform: translate(-50%, 0); transform: translate(-50%, 0); margin: 0; } .jcarousel-pagination a { text-decoration: none; display: inline-block; font-size: 11px; height: 10px; width: 10px; line-height: 10px; background: #fff; color: #4E443C; border-radius: 10px; text-indent: -9999px; margin-right: 7px; -webkit-box-shadow: 0 0 2px #4E443C; -moz-box-shadow: 0 0 2px #4E443C; box-shadow: 0 0 2px #4E443C; } .jcarousel-pagination a.active { color: #fff; opacity: 1; -webkit-box-shadow: 0 0 2px #F0EFE7; -moz-box-shadow: 0 0 2px #F0EFE7; box-shadow: 0 0 2px #F0EFE7; } .nav-btns { margin-right: 0; position: absolute; right: 0; top: 10px; width: 85px; } .nav-btns2 { bottom: 315px; float: right; position: relative; right: -14px; width: 85px; } .come-in { transform: translateY(150px); animation: come-in 0.8s ease forwards; } .come-in:nth-child(odd) { animation-duration: 0.6s; /* So they look staggered */ } @keyframes come-in { to { transform: translateY(0); } } /*----------------------------------------------------------------------------------- BOOTSTRAP CUSTOM -----------------------------------------------------------------------------------*/ .btn { font-size: 14px; text-align: center; padding: 12px 16px; border: 0; border-radius: 3px; cursor: pointer; -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; } .btn.btn-xs { font-size: 12px; padding: 9px 12px; } .btn.btn-sm { font-size: 13px; padding: 10px 14px; } .btn.btn-md { font-size: 16px; padding: 12px 18px; } .btn.btn-lg { font-size: 19px; padding: 12px 24px 11px; } .btn:not(.btn-link):hover { box-shadow: inset 0 -2px rgba(0,0,0,0.2); -webkit-box-shadow: inset 0 -2px rgba(0,0,0,0.2); } .btn:not(.btn-link).active { box-shadow: inset 0 -2px rgba(0,0,0,0.2), 0 0 5px rgba(0,0,0,0.2); -webkit-box-shadow: inset 0 -2px rgba(0,0,0,0.2), 0 0 5px rgba(0,0,0,0.2); } .btn > .fa { margin-right: 5px } .btn.btn-default { color: #919191; background: #e9e9e9; } .btn.btn-default:hover { color: #666 } .btn.btn-primary { color: #fff; box-shadow: 0 -2px rgba(0, 0, 0, 0.2) inset; } .btn.btn-primary:hover { color: #fff; background: none repeat scroll 0 0 rgba(0, 0, 0, 0.7); } .btn.btn-success, .btn.btn-danger { color: #fff } .btn.dropdown-toggle span.caret { min-height: 20px !important } .progress { height: 6px; border: 0; box-shadow: none; -webkit-box-shadow: none; background-color: #DDDDDD; } .progress-bar { box-shadow: none; -webkit-box-shadow: none; } .form-group label { color: #b5b6b7; font-size: 14px; font-weight: 600; } .form-control { height: 37px; font-size: 13px; padding: 7px 12px; border-radius: 1px; background: #f4f4f4; border-color: #f4f4f4; color: #8F8F8F; box-shadow: none; -webkit-box-shadow: none; } .form-control:focus { border-color: #f1f1f1; box-shadow: 0 0 1px rgba(0,0,0,0.3); -webkit-box-shadow: 0 0 1px rgba(0,0,0,0.3); } .input-group .form-control { height: 44px } .form-control.error { border-color: #ff5757 } .nav .open>a, .nav .open>a:hover, .nav .open>a:focus { color: #28A699 } .nav .caret { border-top-color: #959595; border-bottom-color: #959595; } .nav a:hover .caret, .nav .open>a .caret, .nav .open>a:hover .caret, .nav .open>a:focus .caret { border-top-color: #666; border-bottom-color: #666; } .fade.active { opacity: 1 } .tab-pane { padding: 20px; font-size: 13px; } .nav-tabs { border: 0 } .nav-tabs > li > a { margin: 0; border-radius: 0; border-color: #e5e5e8; background-color: #f8f8f8; color: #a7a7a7; } .nav-tabs > li:not(:first-child) > a { border-left-width: 0 !important } .nav-tabs > li > a:hover { border-color: transparent #e5e5e8 #e5e5e8 transparent; color: #a1a1a1; } .tab-content { border: 1px solid #e5e5e8 } .tabbable ul { margin-left: 0 } .nav-tabs-left.nav-tabs > li, .nav-tabs-right.nav-tabs > li { float: none } .nav-tabs-left + .tab-content, .nav-tabs-right + .tab-content { overflow: hidden; zoom: 1; } .nav-tabs-left.nav-tabs > li > a, .nav-tabs-right.nav-tabs > li > a { border-bottom-color: #e5e5e8 } .nav-tabs-left.nav-tabs { float: left } .nav-tabs-left.nav-tabs > li { margin: 0 -1px 0 0 } .nav-tabs-left.nav-tabs > li:not(:first-child) > a { border-left-width: 1px !important; border-top-width: 0 !important; } .nav-tabs-left.nav-tabs > li > a:hover { border-color: #e5e5e8 transparent #e5e5e8 #e5e5e8 } .nav-tabs-left.nav-tabs > li.active > a { border-right-color: transparent } .nav-tabs-right.nav-tabs { float: right } .nav-tabs-right.nav-tabs > li { margin: 0 0 0 -1px } .nav-tabs-right.nav-tabs > li:not(:first-child) > a { border-left-width: 1px !important; border-top-width: 0 !important; } .nav-tabs-right.nav-tabs > li > a:hover { border-color: #e5e5e8 #e5e5e8 #e5e5e8 transparent } .nav-tabs-right.nav-tabs > li.active > a { border-left-color: transparent } .nav-tabs-bottom { margin: -1px 0 0 0 } .nav-tabs-bottom.nav-tabs > li.active > a, .nav-tabs-bottom.nav-tabs > li > a:hover { border-color: transparent #e5e5e8 #e5e5e8 #e5e5e8 } .panel-group .panel { border-radius: 0; border-color: #e5e5e8; } .panel-default > .panel-heading { background-color: #f6f6f6 } .panel-heading { padding: 0 } .panel-heading a { display: block; padding: 13px 16px; position: relative; } .panel-heading a:after { content: "\e0d8"; display: inline-block; font-family: 'icomoon'; font-style: normal; font-weight: normal; line-height: 1; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; position: absolute; right: 20px; top: 18px; font-size: 16px; } .panel.active .panel-heading a:after { content: "\e0d6" } /*------------------------------------------------*/ /* TIME LINE */ /*------------------------------------------------*/ .main { width: 90%; max-width: 69em; margin: 0 auto; padding: 0 1.875em 3.125em; } .cbp_tmtimeline { margin: 0px 0 0 0; padding: 0; list-style: none; position: relative; } /* The line */ .cbp_tmtimeline:before { content: ''; position: absolute; top: 0; bottom: 0; width: 10px; left: 20%; margin-left: -10px; } /* The date/time */ .cbp_tmtimeline > li .cbp_tmtime { display: block; width: 25%; padding-right: 100px; position: absolute; } .cbp_tmtimeline > li .cbp_tmtime span { display: block; text-align: left; } .cbp_tmtimeline > li .cbp_tmtime span:last-child { font-size: 2.4em } /* Right content */ .cbp_tmtimeline > li .cbp_tmlabel { margin: 0 0 15px 25%; color: #fff; padding: 1em 2em; position: relative; border-radius: 5px; } .cbp_tmlabel p { font-size: 1.1em; font-weight: 400; line-height: 1.6em; } .cbp_tmtimeline > li .cbp_tmlabel h2 { border-bottom: 1px solid rgba(255, 255, 255, 0.4); color: #FFFFFF; font-family: OpenSansLight; font-size: 26px; margin-top: 0; } /* The triangle */ .cbp_tmtimeline > li .cbp_tmlabel:after { right: 100%; border: solid transparent; content: " "; height: 0; width: 0; position: absolute; pointer-events: none; border-width: 10px; top: 10px; } /* The icons */ .cbp_tmtimeline > li .cbp_tmicon { width: 40px; height: 40px; font-family: 'icomoon'; speak: none; font-style: normal; font-weight: normal; font-variant: normal; text-transform: none; font-size: 1.4em; line-height: 40px; -webkit-font-smoothing: antialiased; position: absolute; color: #fff; border-radius: 50%; box-shadow: 0 0 0 8px #2ECC71; text-align: center; left: 20%; margin-left: -25px; } .cbp_tmicon-phone:before { content: "\e097" } .cbp_tmicon-screen:before { content: "\e060" } .cbp_tmicon-mail:before { content: "\e004" } .cbp_tmicon-earth:before { content: "\e049" } /* Example Media Queries */ @media screen and (max-width: 65.375em) { .cbp_tmtimeline > li .cbp_tmtime span:last-child { font-size: 1.5em } } @media screen and (max-width: 47.2em) { .cbp_tmtimeline:before { display: none } .cbp_tmtimeline > li .cbp_tmtime { width: 100%; position: relative; padding: 0 0 20px 0; } .cbp_tmtimeline > li .cbp_tmtime span { text-align: left } .cbp_tmtimeline > li .cbp_tmlabel { margin: 0 0 30px 0; padding: 1em; font-weight: 400; font-size: 95%; } .cbp_tmtimeline > li .cbp_tmlabel:after { right: auto; left: 20px; border-right-color: transparent; top: -20px; } .cbp_tmtimeline > li:nth-child(odd) .cbp_tmlabel:after { border-right-color: transparent } .cbp_tmtimeline > li .cbp_tmicon { position: relative; float: right; left: auto; margin: -55px 5px 0 0px; } } /*------------------------------------------------*/ /* MEDIA QUERIES */ /*------------------------------------------------*/ /* CSS Document */ @media only screen and (min-width: 1001px) { /* CSS Document */ .breadcrumbDiv, .breadCrumb { color: #777777 !important; font-family: OpenSansLight; font-size: 11px !important; padding: 0 7px; } .Mobile-Nav-Row { display: none } } @media only screen and (max-width: 1000px) { /* CSS Document */ .xs-no-pad { padding-left: 0; padding-right: 0; } #dnn_Foot_4Col_A, #dnn_Foot_4Col_B, #dnn_Foot_4Col_C, #dnn_Foot_4Col_D { margin: 30px 0 25px } .container.content-box > div { margin: 0 3% } .services-box { margin: 4% auto; max-width: 350px; } .content h2 { font-size: 33px; letter-spacing: -1px; line-height: 40px !important; } .content p { font-size: 16px; padding-bottom: 18px; } h2.light { font-size: 23px } .subtitle { font-size: 14px } .rox-features.style1 { margin: 20px auto; max-width: 325px; } .rxservice1-block.first { margin-top: 0 } .rxservice1-block.last { margin-bottom: 0 } .rxservice1-block { margin: 50px 0 } .video-padding { margin: 20% 0 } .animated-counter .text-center { margin-top: 7% } .sl-slider h2 { font-size: 40px; margin-top: 90px; } .sl-slider blockquote p { font-size: 18px; line-height: 28px; } #slider { height: 365px } } @media only screen and (max-width: 820px) { /* CSS Document */ .sticky { position: relative !important } } @media only screen and (max-width: 767px) { /* CSS Document */ #dnn_Foot_4Col_A, #dnn_Foot_4Col_B, #dnn_Foot_4Col_C, #dnn_Foot_4Col_D { float: left; margin: 40px 0 20px; max-height: none; width: 100%; } .content-wrap { padding: 0 30px } .sf-menu { left: 0 !important } .sticky, nav { padding: 8px 0 !important } .sticky, nav { padding: 8px 0 0 !important } .sticky #Logo img { padding: 0 0 15px; width: 160px !important; } .tag-cloud { margin: 0 } .portfolio-item-container { margin: 0 0 7% } .rox-features.style1 { margin: 40px auto } .services-box { margin: 4% auto; max-width: 280px; } .animated-counter .text-center { margin-top: 5% } .Logo-Box { padding-left: 4px } .Pg-Title { padding-left: 6px !important } h1.pagetitle { font-size: 22px; line-height: 1em !important; } .crumbs { padding: 0 0 20px !important; text-align: left; } .sl-slider h2 { font-size: 24px; margin-top: 40px; } .sl-slider blockquote p { font-size: 14px; line-height: 22px; } #slider { height: 265px } } @media only screen and (min-width: 640px) and (max-width: 767px) { /* CSS Document */ #map { max-height: 200px !important } } @media only screen and (max-width: 630px) { /* CSS Document */ ul.social-icons-top { display: none !important } .no-right-padding { padding: 0 !important } .hi-icon-wrap { margin: 0 auto 50px !important } .item-description h5 { font-size: 0.9em !important } .item-description span { font-size: 0.88em !important } } @media only screen and (min-width: 481px) and (max-width: 639px) { /* CSS Document */ #map { max-height: 180px !important } .clients ul li { width: 33.3333% !important } } @media only screen and (min-width: 481px) and (max-width: 767px) { /* CSS Document */ .clients ul li { width: 33.3333% !important } } @media only screen and (max-width: 480px) { #map { max-height: 160px !important } .clients ul li { width: 50% !important } } @media only screen and (min-width: 321px) and (max-width: 480px) { /* CSS Document */ } @media only screen and (max-width: 320px) { /* CSS Document */ } /* RADIAL PROGRESS BAR */ .circular-content { display: inline-block; height: auto; text-align: center; } .cart { position: relative; overflow: hidden; min-height: 388px; } .cart .hidden { display: none; } .easyPieChart { position: relative; text-align: center; margin: 0px auto; } .easyPieChart canvas { position: absolute; top: 0; left: 0; } .circular-pie { width: 310px; height: 310px; } .circular-pie span { display: block; position: absolute; top: 20px; right: 20px; bottom: 20px; left: 20px; height: 210px; width: 210px; z-index: 10; line-height: 210px; border-radius: 100%; text-align: center; font-size: 68px; letter-spacing: -3px; color: #4CC995; box-shadow: 0px 0px 6px rgba(0, 0, 0, 0.4); } .circ_counter_desc { margin: 20px 0; font-size: 15px; text-align: center; } .circ_counter_desc .lead { color: #fff; font-size: 26px; } /* NUMBER COUNTER */ .number-counters { overflow: hidden; } .counters-item { overflow: hidden; } .number-counters strong { color: #FFFFFF; display: block; font-size: 60px; font-weight: 600; line-height: 60px; } .client-list a img { -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=70)"; filter: alpha(opacity=70); -moz-opacity: 0.7; -khtml-opacity: 0.7; opacity: 0.7; } .client-list a:hover img { -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)"; filter: alpha(opacity=100); -moz-opacity: 1; -khtml-opacity: 1; opacity: 1; } .service-items a, .service-items a h3 { color: #222; } .service-items h3 { font-size: 17px; font-weight: 600; text-transform: uppercase; margin: 10px 0; } .call-number { -webkit-border-radius: 7px; -moz-border-radius: 7px; border-radius: 7px; background-color: rgba(255,255,255,0.2); margin: 20px 0px; line-height: 120px; font-weight: 600; color: #fff; display: block; font-size: 84px; } .call-number a { color: #fff; } .DnnModule-EasyDNNnews .content {text-align: left;} .DnnModule-EasyDNNnews p {padding-bottom: 0;} .DnnModule-EasyDNNnews ol, .DnnModule-EasyDNNnews ol {margin-left: 0;} li.form-group {list-style: none;} /*Overrides*/ .portfolio-item .overlay .preview-links {margin: -25px 0 0 -35px;} .portfolio-item .overlay .zoom {padding: 22px 25px;}