/*-----------------------------------------------------------------------------------*/ /* 6. Revolution Slider Setup Graphics /*-----------------------------------------------------------------------------------*/ .main-content .container-fluid .revolution_slider_container { margin-right: -15px; margin-left: -15px; } .fullwidthbanner ul li { list-style: none; } .tp-bullets.simplebullets.round .bullet { margin-top: 0; margin-left: 20px; width: 11px; height: 11px; background-color: #FFFFFF; background-image: none; -webkit-transform: rotate(45deg); -moz-transform: rotate(45deg); -ms-transform: rotate(45deg); -o-transform: rotate(45deg); transform: rotate(45deg); -webkit-transition: background 0.15s ease-in-out 0s; -moz-transition: background 0.15s ease-in-out 0s; -o-transition: background 0.15s ease-in-out 0s; transition: background 0.15s ease-in-out 0s; } .tp-bullets.simplebullets.round .bullet.first { margin-left: 0 !important; } .tp-bullets.simplebullets.round .bullet.last { margin-right: 0 !important; } .tp-bullets.simplebullets.round .bullet:hover, .tp-bullets.simplebullets.round .bullet.selected, .tp-bullets.simplebullets.navbar .bullet:hover, .tp-bullets.simplebullets.navbar .bullet.selected { background-color: #F05253; } .tp-caption.very_big_custom_text { position: absolute; color: #FFFFFF; text-shadow: none; font-weight: 400; font-size: 48px; line-height: 1.3em; margin: 0px; border-width: 0px; border-style: none; white-space:nowrap; } .tp-bannertimer { z-index: 20; } .tp-caption.fullscreenvideo iframe { border: none; } /*-----------------------------------------------------------------------------------*/ /* 7. Full-width Image /*-----------------------------------------------------------------------------------*/ #image-static { position: relative; overflow: hidden; } .overlay-bg { width: 100%; height: 100%; position: absolute; background: #F05253; opacity: 0.70; z-index: 1; } .overlay-bg-fill { width: 100%; height: 100%; position: absolute; background: #F05253; z-index: 1; } .fullimage-container { position: relative; overflow: hidden; width: 100%; height: 350px; } .fullimage-container.titlize { height: auto; } .section-overlay-mask { position: absolute; top: 0; left: 0; width: 100%; height: 100%; } #image-static .pagize { position: relative; padding-top: 100px; padding-bottom: 100px; z-index: 2; } #image-static h2 { margin-bottom: 0; font-weight: 600; font-size: 42px; letter-spacing: -2px; line-height: 1.3em; color: #FFFFFF; text-transform: uppercase; } #image-static .page-caption, #image-static .entry-meta.entry-header { margin-top: 0; margin-bottom: 0; color: #FFFFFF; font-weight: 300; font-size: 28px; letter-spacing: -1px; font-style: italic; line-height: 1.4em; } #image-static .entry-meta.entry-header a { color: #FFFFFF; font-weight: 300; -webkit-transition: opacity 0.15s ease-in-out 0s; -moz-transition: opacity 0.15s ease-in-out 0s; -o-transition: opacity 0.15s ease-in-out 0s; transition: opacity 0.15s ease-in-out 0s; } #image-static .entry-meta.entry-header a:hover { opacity: 0.75; } /*-----------------------------------------------------------------------------------*/ /* 8. Section Title Page /*-----------------------------------------------------------------------------------*/ #title-page { position: relative; overflow: hidden; } #title-page .pagize { position: relative; padding-top: 100px; padding-bottom: 100px; z-index: 2; } #title-page h2 { margin-bottom: 0; font-weight: 600; font-size: 42px; letter-spacing: -2px; line-height: 1.3em; color: #FFFFFF; text-transform: uppercase; } #title-page .page-caption, #title-page .entry-meta.entry-header { margin-top: 0; margin-bottom: 0; color: #FFFFFF; font-weight: 300; font-size: 28px; letter-spacing: -1px; font-style: italic; line-height: 1.4em; } #title-page .entry-meta.entry-header a { color: #FFFFFF; font-weight: 300; -webkit-transition: opacity 0.15s ease-in-out 0s; -moz-transition: opacity 0.15s ease-in-out 0s; -o-transition: opacity 0.15s ease-in-out 0s; transition: opacity 0.15s ease-in-out 0s; } #title-page .entry-meta.entry-header a:hover { opacity: 0.75; } /* Video Background */ .video-section-container { overflow: hidden; position: absolute; width: 100% !important; height: 100% !important; top: 0; left: 0; } .video-section-container .video-wrap { left: 0; overflow: hidden; position: absolute; top: 0; width: 100%; z-index: 10; } .video-section-container .video-wrap .mejs-container { background-color: rgba(0, 0, 0, 0) !important; background-image: none !important; height: auto !important; } .video-section-container .mobile-video-image { background-position: center center; background-repeat: no-repeat; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; display: none; height: 100%; left: 0; position: absolute; top: 0; width: 100%; z-index: 10; } .video-section-container .video-overlay { width: 100%; height: 100%; position: absolute; top: 0; left: 0; z-index: 11; } /*-----------------------------------------------------------------------------------*/ /* 9. Special Heading /*-----------------------------------------------------------------------------------*/ .special-heading > * { margin: 0; } .special-heading.italic > * { font-style: italic; } /*-----------------------------------------------------------------------------------*/ /* 10. Team and Single Post Team /*-----------------------------------------------------------------------------------*/ #team-filter.mobile-filter { display: none; } #team-filter.desktop-filter { display: block; } #team-filter.desktop-filter, #team-filter.mobile-filter { padding-bottom: 40px; } #team-filter .team-left { float: left; } #team-filter .team-right { float: right; } #team-filter .team-left p { margin: 0; line-height: 30px; color: #2D3C48; font-weight: 400; } #team-filter .team-right ul { margin: 0; padding: 0; } #team-filter .team-right ul li { list-style: none; float: left; margin-left: 20px; } #team-filter .team-right ul li a { color: #818B92; font-weight: 300; } #team-filter .team-right ul li a:hover, #team-filter .team-right ul li a.selected { color: #2D3C48; } #team-people { margin-left: 13px; margin-right: 13px; } #team-people .single-people.col-md-3, #team-people .single-people.col-md-4, #team-people .single-people.col-md-6 { padding-left: 2px; padding-right: 2px; } #people img { width: 100%; } #people { margin: 0; padding: 0; } #people li { float: left; margin-bottom: 4px; list-style: none; } .single-people { position: relative; overflow: hidden; } .single-people .hover-wrap { position: relative; overflow: hidden; width: 100%; height: 100%; } .single-people .hover-wrap img { position: relative; width: 100%; } .single-people .team-name { background: rgba(0,0,0,0.75); display: block; float: left; height: 100%; opacity: 0; padding: 20px; position: absolute; text-align: center; top: 0; width: 100%; z-index: 3; -webkit-transition: opacity 0.3s ease 0s; -moz-transition: opacity 0.3s ease 0s; -o-transition: opacity 0.3s ease 0s; transition: opacity 0.3s ease 0s; } .single-people .team-name .va { display: table-cell; text-align: center; vertical-align: middle; } .single-people .team-name .va .team-title { display: block; } .single-people .hover-wrap:hover .team-name, .single-people .hover-wrap:active .team-name, .single-people .hover-wrap:focus .team-name { opacity: 1; } .single-people .team-name .va h3 { color: #FFFFFF; margin-bottom: 0; } .single-people .team-name h4 { margin: 2px 0 0; font-weight: 400; font-size: 14px; opacity: 0.75; color: #FFFFFF; letter-spacing: 0; font-style: italic; text-transform: uppercase; } /*-----------------------------------------------------------------------------------*/ /* 11. Portfolio and Single Post Portfolio /*-----------------------------------------------------------------------------------*/ /* Portfolio Fluid */ .portfolio-full .container-fluid, .portfolio-full .container-fluid .col-md-12, .portfolio-full .row.portfolio-full-width .col-md-12 { padding-left: 0; padding-right: 0; } .portfolio-full .container-fluid .row { margin: 0; } .portfolio-full .item-project.col-full-3, .portfolio-full .item-project.col-full-4, .portfolio-full .item-project.col-full-6 { float: left; margin: 0; overflow: hidden; padding: 0; position: relative; } /* 6 Columns */ .portfolio-full .item-project.col-full-1 { width: 16.6667%; } /* 5 Columns */ .portfolio-full .item-project.col-full-2 { width: 20%; } /* 4 Columns */ .portfolio-full .item-project.col-full-3 { width: 25%; } /* 3 Columns */ .portfolio-full .item-project.col-full-4 { width: 33.3333%; } /* 2 Columns */ .portfolio-full .item-project.col-full-6 { width: 50%; } /* Portfolio Filter for Wall Effects */ #portfolio-filter.mobile-filter { display: none; } #portfolio-filter.desktop-filter { display: block; } #portfolio-filter.desktop-filter, #portfolio-filter.mobile-filter { padding-bottom: 40px; } #portfolio-filter .portfolio-left { float: left; } #portfolio-filter .portfolio-right { float: right; } #portfolio-filter .portfolio-right ul { margin: 0; padding: 0; } #portfolio-filter .portfolio-right ul li { list-style: none; float: left; margin-left: 20px; } #portfolio-filter .portfolio-left p { margin: 0; line-height: 30px; color: #2D3C48; font-weight: 400; font-size: 13px; font-weight: 600; padding-top: 3px; margin-top: -2px; background-color: #B3B3B3; color: white; padding: 0 11px; float:right; -webkit-border-radius: 2px; -moz-border-radius: 2px; -ms-border-radius: 2px; -o-border-radius: 2px; border-radius: 2px; } #portfolio-filter .portfolio-right ul { margin: 0; padding: 0; } #portfolio-filter .portfolio-right ul li { list-style: none; float: left; margin-left: 20px; } #portfolio-filter .portfolio-right ul li a { color: #818B92; font-weight: 300; } #portfolio-filter .portfolio-right ul li a:hover, #portfolio-filter .portfolio-right ul li a.selected { color: #2D3C48; } .portfolio-full #portfolio-filter.desktop-filter, .portfolio-full #portfolio-filter.mobile-filter { background: #222222; padding: 40px 0; } .portfolio-full #portfolio-filter .portfolio-left p { margin: 0; line-height: 30px; color: #FFFFFF; font-weight: 400; } .portfolio-full #portfolio-filter .portfolio-right ul li a { color: #818B92; font-weight: 300; } .portfolio-full #portfolio-filter .portfolio-right ul li a:hover, .portfolio-full #portfolio-filter .portfolio-right ul li a.selected { color: #FFFFFF; } .portfolio-full #portfolio-filter .col-md-12 { padding: 0 15px !important; max-width: 1170px; margin: 0 auto; } .portfolio-full #portfolio-filter.mobile-filter .dropmenu { margin: 0; border: 2px solid #444444; } .portfolio-full #portfolio-filter.mobile-filter .dropmenu p { color: #FFFFFF; padding: 15px 0 13px 13px; } .portfolio-full #portfolio-filter.mobile-filter .dropmenu-active { background: #222222; border: 2px solid #444444; border-top: 1px solid #444444; } .portfolio-full #portfolio-filter.mobile-filter .dropmenu-active ul li a { color: #818B92; } .portfolio-full #portfolio-filter.mobile-filter .dropmenu-active ul li a:hover { color: #FFFFFF; } /* Projects */ .portfolio-full #portfolio-projects { margin-left: 0; margin-right: 0; } #portfolio-projects { margin-left: 13px; margin-right: 13px; } #portfolio-projects .item-project.col-md-3, #portfolio-projects .item-project.col-md-4, #portfolio-projects .item-project.col-md-6 { padding-left: 2px; padding-right: 2px; } #projects img { width: 100%; } #projects { margin: 0; padding: 0; } #projects li { float: left; margin-bottom: 4px; list-style: none; } .item-project { position: relative; overflow: hidden; } .item-project .hover-wrap { position: relative; overflow: hidden; width: 100%; height: 100%; } .item-project .hover-wrap img { position: relative; width: 100%; } .item-project .project-name { background: rgba(0,0,0,0.75); display: block; float: left; height: 100%; opacity: 0; padding: 20px; position: absolute; text-align: center; top: 0; width: 100%; z-index: 3; -webkit-transition: opacity 0.3s ease 0s; -moz-transition: opacity 0.3s ease 0s; -o-transition: opacity 0.3s ease 0s; transition: opacity 0.3s ease 0s; } .item-project .project-name .va { display: table-cell; text-align: center; vertical-align: middle; } .item-project .project-name .va .project-title { display: block; } .item-project .hover-wrap:hover .project-name, .item-project .hover-wrap:active .project-name, .item-project .hover-wrap:focus .project-name { opacity: 1; } .item-project .project-name .va h3 { color: #FFFFFF; margin-bottom: 0; } .item-project .project-name h4 { margin: 2px 0 0; font-weight: 400; font-size: 14px; opacity: 0.75; color: #FFFFFF; letter-spacing: 0; font-style: italic; text-transform: uppercase; } .item-project i { position: absolute; top: 0; right: 0; width: 40px; height: 40px; text-align: center; background: #F05253; color: #FFFFFF; font-size: 16px; line-height: 38px; z-index: 5; opacity: 0; -webkit-transition: opacity 0.3s ease 0s; -moz-transition: opacity 0.3s ease 0s; -o-transition: opacity 0.3s ease 0s; transition: opacity 0.3s ease 0s; } .item-project .hover-wrap:hover i, .item-project .hover-wrap:active i, .item-project .hover-wrap:focus i { opacity: 1; } /* Project Wall Effects */ .portfolio-full #projects li { float: left; margin-bottom: 0; list-style: none; } /*-----------------------------------------------------------------------------------*/ /* 12. Navigation Projects / Navigation Posts /*-----------------------------------------------------------------------------------*/ /* Navigation Project Posts and Team Posts*/ .post-type-navi { margin: -35px 0 0; position: absolute; top: 50%; width: 100%; z-index: 20; } .post-type-navi .prev a, .post-type-navi .next a { background: #fa5454; display: block; height: 58px; width: 130px; position: fixed; -webkit-transition: all 0.15s ease-in-out 0s; -moz-transition: all 0.15s ease-in-out 0s; -o-transition: all 0.15s ease-in-out 0s; transition: all 0.15s ease-in-out 0s; -webkit-border-top-right-radius: 4px; -webkit-border-bottom-right-radius: 4px; -moz-border-radius-topright: 4px; -moz-border-radius-bottomright: 4px; border-top-right-radius: 4px; border-bottom-right-radius: 4px; } .post-type-navi .prev a:hover, .post-type-navi .next a:hover, .post-type-navi .prev a:focus, .post-type-navi .next a:focus, .post-type-navi .prev a:active, .post-type-navi .next a:active { } .post-type-navi .prev a { left: -100px; text-align: right; } .post-type-navi .prev a:hover, .post-type-navi .prev a:focus, .post-type-navi .prev a:active { left: 0; } .post-type-navi .next a { right: -100px; } .post-type-navi .next a:hover, .post-type-navi .next a:focus, .post-type-navi .next a:active { right: 0; } .post-type-navi .prev a span, .post-type-navi .next a span { color: #FFFFFF; display: inline-block; padding: 0 30px; line-height: 58px; } /* Navigation Blog Posts */ .main-content-navi { border-top: 2px solid #EBEDEF; } .navigation-projects { position: relative; } .navigation-projects ul { margin: 0; padding: 0; text-align: center; } .navigation-projects ul li { display: inline-block; list-style: none; margin: 2px; } .navigation-projects ul li.prev a, .navigation-projects ul li.next a, .navigation-projects ul li.back-page a{ width: 48px; height: 48px; padding: 0; position: relative; display: block; background: transparent; border: 2px solid #EBEDEF; text-indent: -9999px; -webkit-transition: background 0.15s ease-in-out 0s, border 0.15s ease-in-out 0s; -moz-transition: background 0.15s ease-in-out 0s, border 0.15s ease-in-out 0s; -o-transition: background 0.15s ease-in-out 0s, border 0.15s ease-in-out 0s; transition: background 0.15s ease-in-out 0s, border 0.15s ease-in-out 0s; } .navigation-projects ul li.prev a i, .navigation-projects ul li.next a i, .navigation-projects ul li.back-page a i { color: #BCBCC4; font-size: 16px; position: absolute; top: 50%; left: 50%; margin: -8px 0 0 -8px; text-indent: 0; -webkit-transition: color 0.15s ease-in-out 0s; -moz-transition: color 0.15s ease-in-out 0s; -o-transition: color 0.15s ease-in-out 0s; transition: color 0.15s ease-in-out 0s; } .navigation-projects ul li.prev a i { margin: -8px 0 0 -9px; } .navigation-projects ul li.prev a:hover, .navigation-projects ul li.next a:hover, .navigation-projects ul li.back-page a:hover { background-color: #F05253; border-color: #F05253; } .navigation-projects ul li.prev a:hover i, .navigation-projects ul li.next a:hover i, .navigation-projects ul li.back-page a:hover i { color: #FFFFFF; } /* Navigation Boxed Layout */ .wrap_all.boxed .post-type-navi { display: none; } .wrap_all.boxed .main-content-navi.team, .wrap_all.boxed .main-content-navi.portfolio { display: block; } /* Navigation Mobile Team / Portfolio Single Post */ .main-content-navi.team.mobile, .main-content-navi.portfolio.mobile { display: none; } /*-----------------------------------------------------------------------------------*/ /* 13. Map Area and Contact Form /*-----------------------------------------------------------------------------------*/ #map-area { width: 100%; } #map-area img { max-width: none !important; } .map { height: 520px; } /* Contact Form Styles */ .wpcf7-form { margin-bottom: 0; } .wpcf7-form p { margin-top: 0; } .wpcf7 p.quote-budget { overflow: visible; } .wpcf7-form-control-wrap.budget { display: inline-block; margin-bottom: 0; width: 50%; } span.wpcf7-form-control-wrap { display: block; margin: 15px 0; } .wpcf7 .watermark { color: #BCBCC4 !important; } .wpcf7 input, .wpcf7 textarea { margin: 0; padding: 15px; height: auto; border: 2px solid #EBEDEF; -webkit-border-radius: 0; -moz-border-radius: 0; border-radius: 0; background: #FFFFFF; -webkit-box-shadow: none; -moz-box-shadow: none; box-shadow: none; color: #BCBCC4; font-size: 16px; resize: none; -webkit-transition: border 0.15s ease-in-out 0s, color 0.15s ease-in-out 0s; -moz-transition: border 0.15s ease-in-out 0s, color 0.15s ease-in-out 0s; -o-transition: border 0.15s ease-in-out 0s, color 0.15s ease-in-out 0s; transition: border 0.15s ease-in-out 0s, color 0.15s ease-in-out 0s; } .wpcf7 input:focus, .wpcf7 textarea:focus { border-color: #DFDFDF; -webkit-box-shadow: none; -moz-box-shadow: none; box-shadow: none; color: #56646F; } .wpcf7 input { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; width: 100%; } .wpcf7 textarea { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; margin-bottom: 8px; width: 100%; resize: vertical; } .wpcf7 .wpcf7-submit { width: auto; border: none; display: inline-block; padding: 16px 24px; background-color: transparent; color: #BCBCC4; vertical-align: middle; text-align: center; text-transform: uppercase; font-weight: 400; font-size: 14.5px; cursor: pointer; border: 2px solid #EBEDEF; -webkit-transition: background 0.15s ease-in-out 0s, border 0.15s ease-in-out 0s, color 0.15s ease-in-out 0s; -moz-transition: background 0.15s ease-in-out 0s, border 0.15s ease-in-out 0s, color 0.15s ease-in-out 0s; -o-transition: background 0.15s ease-in-out 0s, border 0.15s ease-in-out 0s, color 0.15s ease-in-out 0s; transition: background 0.15s ease-in-out 0s, border 0.15s ease-in-out 0s, color 0.15s ease-in-out 0s; } .wpcf7 .wpcf7-submit:hover, .wpcf7 .wpcf7-submit:focus, .wpcf7 .wpcf7-submit:active { background-color: #F05253; border-color: #F05253; color: #FFFFFF; } .wpcf7-form.invalid input.wpcf7-not-valid, .wpcf7-form.invalid textarea.wpcf7-not-valid, .wpcf7-form input:focus:invalid:focus, .wpcf7-form textarea:focus:invalid:focus { border-color: #F05253; -webkit-box-shadow: none; -moz-box-shadow: none; box-shadow: none; } .wpcf7-form.invalid span.wpcf7-not-valid-tip { display: none; } .wpcf7 .wpcf7-response-output { margin: 0; padding: 0; } .wpcf7 .wpcf7-validation-errors, .wpcf7 .wpcf7-mail-sent-ng, .wpcf7 .wpcf7-mail-sent-ok { border: none; } .wpcf7 img.ajax-loader { margin-left: 15px; width: auto; } .clearfix:after { display: block; visibility: hidden; clear: both; height: 0; content: " "; font-size: 0; } /* Bootstrap Select */ .bootstrap-select.btn-group { height: 58px; } .bootstrap-select { float: none; margin: 0; } .btn-group.bootstrap-select { display: block; } .bootstrap-select .custom-select { margin: 0; padding: 15px; width: 100%; height: auto; border: 2px solid #EBEDEF; -webkit-border-radius: 0; -moz-border-radius: 0; border-radius: 0; background: #FFFFFF; -webkit-box-shadow: none; -moz-box-shadow: none; box-shadow: none; color: #BCBCC4; font-size: 16px; resize: none; -webkit-transition: border 0.15s ease-in-out 0s, color 0.15s ease-in-out 0s; -moz-transition: border 0.15s ease-in-out 0s, color 0.15s ease-in-out 0s; -o-transition: border 0.15s ease-in-out 0s, color 0.15s ease-in-out 0s; transition: border 0.15s ease-in-out 0s, color 0.15s ease-in-out 0s; -webkit-appearance: none; } .bootstrap-select .custom-select:focus { border-color: #DFDFDF; -webkit-box-shadow: none; -moz-box-shadow: none; box-shadow: none; color: #56646F; } .bootstrap-select.btn-group .custom-select .plus-select { position: absolute; top: 22px; right: 15px; width: 18px; height: 18px; background: url(../images/plus_select.png) no-repeat; -webkit-transition: -webkit-transform 250ms ease-out 0s; -moz-transition: -moz-transform 250ms ease-out 0s; -o-transition: -o-transform 250ms ease-out 0s; transition: transform 250ms ease-out 0s; -webkit-transform: rotate(0deg); -moz-transform: rotate(0deg); -ms-transform: rotate(0deg); transform: rotate(0deg); } .bootstrap-select.btn-group.open .custom-select .plus-select { background-position: 0 -18px; -webkit-transition: -webkit-transform 250ms ease-out 0s; -moz-transition: -moz-transform 250ms ease-out 0s; -o-transition: -o-transform 250ms ease-out 0s; transition: transform 250ms ease-out 0s; -webkit-transform: rotate(-180deg); -moz-transform: rotate(-180deg); -ms-transform: rotate(-180deg); transform: rotate(-180deg); } .bootstrap-select.btn-group > .disabled, .bootstrap-select.btn-group .dropdown-menu li.disabled > a { cursor: not-allowed; } .bootstrap-select.btn-group[class*="span"] .custom-select { width: 100%; } .bootstrap-select.btn-group .dropdown-menu { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; margin: 0; min-width: 100%; } .bootstrap-select.btn-group .dropdown-menu dt { display: block; padding: 3px 20px; cursor: default; } .bootstrap-select.btn-group .div-contain { overflow: hidden; } .bootstrap-select.btn-group .dropdown-menu li > a.opt { padding-left: 35px; } .bootstrap-select.btn-group .dropdown-menu li > a { display: block; clear: both; padding: 15px; min-height: 20px; white-space: nowrap; font-weight: 400; font-size: 16px; line-height: 20px; } .bootstrap-select.btn-group .dropdown-menu li { border-bottom: 2px solid #EBEDEF; line-height: 0; } .bootstrap-select.btn-group .dropdown-menu li:last-child { border-bottom: none; } .bootstrap-select.btn-group.open .dropdown-toggle { border-color: #DFDFDF; -webkit-border-radius: 0; -moz-border-radius: 0; border-radius: 0; box-shadow: none; } .dropdown-menu { position: absolute; top: 100%; left: 0; z-index: 1000; display: none; float: left; margin: -15px 0 0; padding: 0; min-width: 160px; border-top: none; border-right: 2px solid #EBEDEF; border-bottom: 2px solid #EBEDEF; border-left: 2px solid #EBEDEF; -webkit-border-radius: 0; -moz-border-radius: 0; border-radius: 0; background-color: #FFFFFF; -webkit-box-shadow: none; -moz-box-shadow: none; box-shadow: none; list-style: none outside none; } .dropdown-menu > li > a { color: #56646F; } .dropdown-menu > li > a:hover, .dropdown-menu > li > a:focus, .dropdown-submenu:hover > a, .dropdown-submenu:focus > a { background-color: #F8F9F9; color: #56646F; background-image: none; text-decoration: none; filter: progid:DXImageTransform.Microsoft.gradient(enabled = false); } /*-----------------------------------------------------------------------------------*/ /* 14. Latest Post and Blog Style /*-----------------------------------------------------------------------------------*/ #latest-posts { margin: 0; padding: 0; } #latest-posts article { margin-bottom: 30px; } #latest-posts li { float: left; list-style: none; } .post-thumb { position: relative; overflow: hidden; } .post-thumb img { display: block; height: auto; width: 100%; } .post-thumb .hover-wrap { position: relative; display: block; overflow: hidden; width: 100%; height: 100%; } .post-thumb .hover-wrap .overlay { position: absolute; top: 0; left: 0; right: 0; bottom: 0; display: block; background: rgba(0,0,0,0.75); opacity: 0; -webkit-transition: opacity 0.3s ease 0s; -moz-transition: opacity 0.3s ease 0s; -o-transition: opacity 0.3s ease 0s; transition: opacity 0.3s ease 0s; } .post-thumb .hover-wrap:hover .overlay, .post-thumb .hover-wrap:active .overlay, .post-thumb .hover-wrap:focus .overlay { opacity: 1; } .post-thumb .hover-wrap .circle { position: absolute; top: 50%; left: 50%; background: transparent; border: 2px solid #FFFFFF; width: 48px; height: 48px; margin: -24px 0 0 -24px; -webkit-border-radius: 999px; -moz-border-radius: 999px; border-radius: 999px; } .post-thumb .hover-wrap i { position: absolute; top: 50%; left: 50%; margin: -8px 0 0 -8px; color: #FFFFFF; font-size: 16px; } #latest-posts .post-thumb { margin-bottom: 20px; } #latest-posts .entry-meta.entry-header { border-top: 2px solid #EBEDEF; padding-top: 15px; margin-top: 20px; } #latest-posts .post-name .entry-title { font-size: 24px; } #latest-posts .post-name .entry-title a { color: #2D3C48; } #latest-posts .post-name .entry-title a:hover { color: #F05253; } .entry-meta.entry-header a { color: #818B92; font-weight: 300; } .entry-meta.entry-header a:hover, .entry-meta.entry-header a:active, .entry-meta.entry-header a:focus { color: #F05253; } /* Standard Blog */ .standard-blog article { margin-bottom: 50px; } .standard-blog article:last-child { margin-bottom: 0; } .standard-blog .post-container { position: relative; overflow: hidden; border-bottom: 2px solid #EBEDEF; padding-bottom: 30px; } .standard-blog article:last-child .post-container { padding: 0; border-bottom: none; } .standard-blog .post-thumb, .standard-blog .video-thumb, .standard-blog .audio-thumb { margin-bottom: 20px; } .standard-blog .post-name .entry-title { font-size: 24px; } .standard-blog .post-name .entry-title a { color: #2D3C48; } .standard-blog .post-name .entry-title a:hover { color: #F05253; } .standard-blog .more-link { display: block; margin-top: 10px; } .standard-blog .post-link, .standard-blog .post-quote { background: #F05253; padding: 50px 20px; margin-bottom: 20px; text-align: center; -webkit-transition: background 0.3s ease 0s; -moz-transition: background 0.3s ease 0s; -o-transition: background 0.3s ease 0s; transition: background 0.3s ease 0s; } .standard-blog .post-link:hover, .standard-blog .post-quote:hover { background-color: #171717; } .standard-blog .post-link .entry-title a, .standard-blog .post-quote .entry-title a, .standard-blog .post-quote .entry-title { color: #FFFFFF; } .standard-blog .post-link .entry-title, .standard-blog .post-quote .entry-title { font-size: 28px; margin-bottom: 5px; } .standard-blog .post-link p, .standard-blog .post-quote p { margin: 0; } .standard-blog .post-link .link-source a, .standard-blog .post-quote .quote-source a { color: #FFFFFF; } /* Masonry Blog */ .masonry-blog article .item-blog { display: none; } .masonry-blog article { margin-bottom: 30px; } .masonry-blog .post-container { position: relative; overflow: hidden; border-bottom: 2px solid #EBEDEF; padding-bottom: 10px; } .masonry-blog .post-thumb, .masonry-blog .video-thumb, .masonry-blog .audio-thumb { margin-bottom: 20px; } .masonry-blog .post-name .entry-title { font-size: 24px; } .masonry-blog .post-name .entry-title a { color: #2D3C48; } .masonry-blog .post-name .entry-title a:hover { color: #F05253; } .masonry-blog .more-link { display: block; margin-top: 10px; } .masonry-blog .post-link, .masonry-blog .post-quote { background: #F05253; padding: 50px 20px; margin-bottom: 20px; text-align: center; -webkit-transition: background 0.3s ease 0s; -moz-transition: background 0.3s ease 0s; -o-transition: background 0.3s ease 0s; transition: background 0.3s ease 0s; } .masonry-blog .post-link:hover, .masonry-blog .post-quote:hover { background-color: #171717; } .masonry-blog .post-link .entry-title a, .masonry-blog .post-quote .entry-title a, .masonry-blog .post-quote .entry-title { color: #FFFFFF; } .masonry-blog .post-link .entry-title, .masonry-blog .post-quote .entry-title { font-size: 28px; margin-bottom: 5px; } .masonry-blog .post-link p, .masonry-blog .post-quote p { margin: 0; } .masonry-blog .post-link .link-source a, .masonry-blog .post-quote .quote-source a { color: #FFFFFF; } /* Center Blog */ .center-blog article { margin-bottom: 80px; } .center-blog article:last-child { margin-bottom: 0; } .center-blog .post-container { position: relative; overflow: hidden; border-bottom: 2px solid #EBEDEF; padding-bottom: 60px; } .center-blog article:last-child .post-container { padding: 0; border-bottom: none; } .center-blog .post-thumb, .center-blog .video-thumb, .center-blog .audio-thumb { margin-bottom: 20px; } .center-blog .post-name { margin-bottom: 30px; } .center-blog .post-name .entry-title { font-size: 36px; margin: 30px 0 10px; text-align: center; } .center-blog .post-name .entry-title a { color: #2D3C48; } .center-blog .post-name .entry-title a:hover { color: #F05253; } .center-blog .entry-content, .center-blog .entry-meta.entry-header { text-align: center; } .center-blog .more-link { display: block; margin-top: 10px; } .center-blog .post-link, .center-blog .post-quote { background: #F05253; padding: 50px 20px; margin-bottom: 20px; text-align: center; -webkit-transition: background 0.3s ease 0s; -moz-transition: background 0.3s ease 0s; -o-transition: background 0.3s ease 0s; transition: background 0.3s ease 0s; } .center-blog .post-link:hover, .center-blog .post-quote:hover { background-color: #171717; } .center-blog .post-link .entry-title a, .center-blog .post-quote .entry-title a, .center-blog .post-quote .entry-title { color: #FFFFFF; } .center-blog .post-link .entry-title, .center-blog .post-quote .entry-title { font-size: 28px; margin-bottom: 5px; } .center-blog .post-link p, .center-blog .post-quote p { margin: 0; } .center-blog .post-link .link-source a, .center-blog .post-quote .quote-source a { color: #FFFFFF; } /* Single Post */ #blog.single-post article { padding-bottom: 70px; border-bottom: none; background: none; } #blog .entry-meta.entry-footer span { display: block; } #blog.single-post .post-thumb, #blog.single-post .audio-thumb, #blog.single-post .video-thumb, #blog.single-post .post-quote, #blog.single-post .post-link { margin-bottom: 30px; } #blog.single-post .entry-meta.entry-footer { padding-top: 20px; } #blog.single-post .post-quote, #blog.single-post .post-link { padding: 60px 30px 50px; background: #FBFBFB; text-align: center; } #blog.single-post .post-quote .entry-title, #blog.single-post .post-link .entry-title { padding: 0; font-size: 24px !important; } #blog.single-post .link-source a, #blog.single-post .quote-source { font-weight: 400; font-size: 16px; } #blog.single-post .link-source a + a, #blog.single-post .quote-source a { margin-left: 10px; font-weight: 400; font-size: 16px; } /* Search Results */ .standard-blog .no-results .entry-title, .masonry-blog .no-results .entry-title, .center-blog .no-results .entry-title { font-size: 26px !important; } .no-results .entry-title { margin-bottom: 0; } .no-results .entry-title, .no-results .entry-content { padding: 0; } .masonry-blog .no-results, .center-blog .no-results { text-align: center; } /*-----------------------------------------------------------------------------------*/ /* 15. Comments /*-----------------------------------------------------------------------------------*/ .comment-area { padding-bottom: 70px; } #comments { } .comments-title, .pings-title, #reply-title { margin: 0; padding: 0 0 25px; border-bottom: 2px solid #EBEDEF; font-size: 24px; line-height: 32px; } .comment-form { margin-top: 30px; } .commentlist, .pinglist { margin: 20px 0 80px; list-style-type: none; } .comment-section { padding: 30px 30px 20px; } .comment-body { border-bottom: 2px solid #EBEDEF; padding-bottom: 20px; } .comment-side { float: left; margin: 0 30px 0 0; } .comment-side .avatar { display: block; width: 50px; height: 50px; -webkit-border-radius: 999px; -moz-border-radius: 999px; border-radius: 999px; } .comment .comment-cont { margin-left: 80px; } .comment-author cite, .comment-author cite a { color: #2D3C48; font-size: 24px; font-weight: 300; } .comment-author cite a:hover { color: #F05253; } .comment-meta, .comment-meta a { color: #818B92; font-size: 14px; font-weight: 300; line-height: 20px; } .comment-meta a:hover { color: #F05253; } .comment-meta { margin: 8px 0 15px; } .children { margin: 0; padding: 0; list-style: none; } .children .comment { padding-left: 60px; } .comment-author { position: relative; } .badge_author { position: absolute; top: 12px; right: 10px; display: inline-block; width: 10px; height: 10px; -webkit-border-radius: 999px; -moz-border-radius: 999px; border-radius: 999px; background: #F05253; opacity: 0.5; } .nocomments { padding: 20px 30px 20px; } /* Comment Form */ #commentform p { overflow: hidden; margin: 0 0 35px 0; } #commentform label, #commentform span.required { position: relative; top: 16px; display: inline-block; font-weight: 300; font-size: 14px; } #commentform span.required { top: 0; color: #F05253; font-size: 12px; } #commentform input, #commentform textarea { margin: 0; padding: 15px; height: auto; border: 2px solid #EBEDEF; -webkit-border-radius: 0; -moz-border-radius: 0; border-radius: 0; background: #FFFFFF; -webkit-box-shadow: none; -moz-box-shadow: none; box-shadow: none; color: #BCBCC4; font-size: 16px; resize: none; -webkit-transition: border 0.15s ease-in-out 0s, color 0.15s ease-in-out 0s; -moz-transition: border 0.15s ease-in-out 0s, color 0.15s ease-in-out 0s; -o-transition: border 0.15s ease-in-out 0s, color 0.15s ease-in-out 0s; transition: border 0.15s ease-in-out 0s, color 0.15s ease-in-out 0s; -webkit-appearance: none; } #commentform input:focus, #commentform textarea:focus { border-color: #DFDFDF; -webkit-box-shadow: none; -moz-box-shadow: none; box-shadow: none; color: #56646F; } #commentform input { float: left; margin-right: 20px; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; width: 50%; } #commentform textarea { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; width: 100%; resize: vertical; } #commentform #submit { width: auto; border: none; display: inline-block; padding: 16px 24px; background-color: transparent; color: #BCBCC4; vertical-align: middle; text-align: center; text-transform: uppercase; font-weight: 400; font-size: 14.5px; cursor: pointer; border: 2px solid #EBEDEF; -webkit-transition: background 0.15s ease-in-out 0s, border 0.15s ease-in-out 0s, color 0.15s ease-in-out 0s; -moz-transition: background 0.15s ease-in-out 0s, border 0.15s ease-in-out 0s, color 0.15s ease-in-out 0s; -o-transition: background 0.15s ease-in-out 0s, border 0.15s ease-in-out 0s, color 0.15s ease-in-out 0s; transition: background 0.15s ease-in-out 0s, border 0.15s ease-in-out 0s, color 0.15s ease-in-out 0s; } #commentform #submit:hover { background-color: #F05253; border-color: #F05253; color: #FFFFFF; } /*-----------------------------------------------------------------------------------*/ /* 16. Sidebar /*-----------------------------------------------------------------------------------*/ #sidebar, .sidebar_content { font-size: 14px; line-height: 20px; } .sidebar_content { margin-top: 11px; } /* Right Sidebar - Left Content */ #blog .col-md-9.left_side { float: left; } #blog .col-md-3.right_side { float: right; } /* Left Sidebar - Right Content */ #blog .col-md-3.left_side { float: left; } #blog .col-md-9.right_side { float: right; } /*-----------------------------------------------------------------------------------*/ /* 17. Big Twitter Feed Area /*-----------------------------------------------------------------------------------*/ #twitter-feed .slides > li { display: none; } #twitter-feed .tweet_list { margin: 0; padding: 0; } #twitter-feed .tweet_list li { list-style: none; text-align: center; } #twitter-feed .tweet_list li .tweet_text { display: block; font-size: 22px; line-height: 1.5em; } #twitter-feed .tweet_list li .tweet_time a { display: inline-block; margin-top: 22px; color: #818B92; font-size: 16px; font-weight: 300; } /*-----------------------------------------------------------------------------------*/ /* 18. Footer /*-----------------------------------------------------------------------------------*/ footer { position: relative; background: #222222; } .footer-widgets { padding: 30px 0; } #social-footer { float: right; margin-top: -2px; } #social-footer ul { margin: 0; padding: 0; } #social-footer ul li { display: inline-block; list-style: none; cursor: pointer; margin: 0 0px 5px 25px; } #social-footer ul li:first-child { margin-left: 0; } #social-footer ul li a { position: relative; display: inline-block; opacity: 0.25; -webkit-transition: opacity 0.15s ease-in-out 0s; -moz-transition: opacity 0.15s ease-in-out 0s; -o-transition: opacity 0.15s ease-in-out 0s; transition: opacity 0.15s ease-in-out 0s; } #social-footer ul li a i { color: #FFFFFF; font-size: 16px; } #social-footer ul li a:hover { opacity: 1; } /* Footer Credits */ #footer-credits { position: relative; background: #121212; padding: 50px 0 40px; } #footer-credits p { margin: 0; color: #FFFFFF; font-size: 12px; } #footer-credits p a { color: #F05253; } #footer-credits p a:hover { color: #FFFFFF; } /*-----------------------------------------------------------------------------------*/ /* 19. Back to Top /*-----------------------------------------------------------------------------------*/ #back-to-top { background: #171717; display: block; height: 0px; overflow: hidden; padding-top: 0px; text-align: center; width: 100%; -webkit-transition: all 0.8s ease 0s; -moz-transition: all 0.8s ease 0s; -o-transition: all 0.8s ease 0s; transition: all 0.8s ease 0s; } #back-to-top.opened { padding-top: 40px; height: 100px; } #back-to-top i { color: #FFFFFF; font-size: 24px; opacity: 1; -webkit-transition: opacity 0.35s linear 0s; -moz-transition: opacity 0.35s linear 0s; -o-transition: opacity 0.35s linear 0s; transition: opacity 0.35s linear 0s; } #back-to-top:hover i { opacity: 0.6; } /*-----------------------------------------------------------------------------------*/ /* 20. Error Page /*-----------------------------------------------------------------------------------*/ #error-page { background: #F7F7F7; padding: 150px 0; } #error-page.error-404-image { padding: 330px 0; background-position: center center; background-repeat: no-repeat; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; } #error-page .error-btn { background: #F05253; color: #FFFFFF; display: block; margin: 0 auto; -webkit-border-radius: 999px; -moz-border-radius: 999px; border-radius: 999px; width: 190px; min-height: 190px; padding: 50px 0; opacity: 0.85; -webkit-transition: opacity 0.2s linear 0s; -moz-transition: opacity 0.2s linear 0s; -o-transition: opacity 0.2s linear 0s; transition: opacity 0.2s linear 0s; } #error-page .error-btn:hover, #error-page .error-btn:focus, #error-page .error-btn:active { opacity: 1; color: #FFFFFF; } #error-page .error-btn .error-title, #error-page .error-btn .error-caption { display: inline-block; line-height: 1.2; font-weight: 300; text-align: center; vertical-align: middle; width: 100%; } #error-page .error-btn .error-title { font-size: 40px; } #error-page .error-btn .error-caption { font-size: 24px; margin-top: 8px; } /*-----------------------------------------------------------------------------------*/ /* 21. Archives / Sitemap Template /*-----------------------------------------------------------------------------------*/ .widget_archives ul { margin-left: 30px !important; } .widget_archives ul li { list-style: disc !important; } .widget.widget_archives { margin-bottom: 20px; } .widget.widget_archives .widget_title h4 { margin-bottom: 10px; } .widget.widget_archives .widget_title h4 { font-size: 18px; font-weight: 400; text-transform: uppercase; } .widget.widget_archives li a { margin-left: 0; } /*-----------------------------------------------------------------------------------*/ /* 22. Widgets /*-----------------------------------------------------------------------------------*/ .widget { margin-bottom: 40px; } .widget ul { margin: 0; padding: 0; } .widget ul li { list-style: none; } .widget ul.children, .widget ul.sub-menu { padding-left: 20px; } .widget-title { margin-bottom: 15px; text-transform: uppercase; letter-spacing: 0; font-size: 16px; line-height: 22px; } /* Calendar */ .widget_calendar { position: relative; } .widget_calendar table { width: 100%; border-collapse: collapse; } .widget_calendar table td, #footer-outer #footer-widgets .col .widget_calendar table th { text-align: center; } .widget_calendar table tbody td { padding: 4px; border: 0px; color: #666666; font-size: 11px; } .widget_calendar table tbody tr td:first-child { border-left: 0px; } .widget_calendar table tbody tr:nth-child(2n+1) { background-color: #f0f0f0; } .widget_calendar table th { padding-bottom: 10px; border-bottom: 0px; color: #999999; text-align: center!important; } .widget_calendar table #prev { position: relative; z-index: 2; padding: 10px 0px 0px 0px; text-align: left; } .widget_calendar table #next { position: relative; z-index: 2; padding: 10px 0px 0px 0px; text-align: right; } .widget_calendar caption { position: absolute; bottom: 0px; z-index: 1; width: 100%; text-align: center; } /* Search */ .widget_search form { margin: 0; } #searchform input[type="text"], .widget_search form input[type="text"] { margin: 0; padding: 15px; width: 100%; height: auto; border: 2px solid #EBEDEF; -webkit-border-radius: 0; -moz-border-radius: 0; border-radius: 0; background: #FFFFFF; -webkit-box-shadow: none; -moz-box-shadow: none; box-shadow: none; color: #BCBCC4; font-size: 16px; resize: none; -webkit-transition: border 0.15s ease-in-out 0s, color 0.15s ease-in-out 0s; -moz-transition: border 0.15s ease-in-out 0s, color 0.15s ease-in-out 0s; -o-transition: border 0.15s ease-in-out 0s, color 0.15s ease-in-out 0s; transition: border 0.15s ease-in-out 0s, color 0.15s ease-in-out 0s; -webkit-appearance: none; } #searchform input[type="text"]:focus, .widget_search form input[type="text"]:focus { -webkit-box-shadow: none; -moz-box-shadow: none; box-shadow: none; border-color: #DFDFDF; color: #56646F; } /* RSS Widget */ .rsswidget img { display: none; } /* Tag Cloud */ .tagcloud a { display: inline-block; margin: 0 3px 4px 0; padding: 8px 12px; width: auto; border: 2px solid #F05253; background: transparent; color: #F05253; vertical-align: middle; text-align: center; text-transform: uppercase; font-weight: 400; font-size: 12px !important; cursor: pointer; -webkit-transition: background 0.15s ease-in-out 0s, color 0.15s ease-in-out 0s; -moz-transition: background 0.15s ease-in-out 0s, color 0.15s ease-in-out 0s; -o-transition: background 0.15s ease-in-out 0s, color 0.15s ease-in-out 0s; transition: background 0.15s ease-in-out 0s, color 0.15s ease-in-out 0s; -webkit-appearance: none; } .tagcloud a:hover, .tagcloud a:active, .tagcloud a:focus { background: #F05253; color: #FFFFFF; } /* Twitter Widget */ .az_widget_twitter li:first-child { margin-top: 0; } .az_widget_twitter li { line-height: 24px; margin-top: 20px; } .tweet_timestamp > a { display: block; margin-top: 6px; font-size: 13px; font-weight: 400; color: #56646F !important; } /* Flickr Widget */ .widget_quick-flickr-widget ul { margin: 20px 0 0 0; padding: 0; } .widget_quick-flickr-widget ul li { position: relative; display: inline-block; margin: 0 3px 3px 0; list-style: none; } .widget_quick-flickr-widget ul li a { display: block; -webkit-transition: opacity 0.15s ease-in-out 0s; -moz-transition: opacity 0.15s ease-in-out 0s; -o-transition: opacity 0.15s ease-in-out 0s; transition: opacity 0.15s ease-in-out 0s; opacity: 1; filter: alpha(opacity=100); } .widget_quick-flickr-widget ul li a:hover { opacity: 0.35; filter: alpha(opacity=35); } .widget_quick-flickr-widget ul li a img { width: 84px !important; height: 84px; -moz-backface-visibility: hidden; /* Prevents Flickr Image On Firefox */ } /* Dribbble Widget */ .dribbble-widget ul { margin: 0; padding: 0; } .dribbble-widget ul li { position: relative; display: inline-block; margin: 0 3px 3px 0; list-style: none; } .dribbble-widget ul li a { display: block; -webkit-transition: opacity 0.15s ease-in-out 0s; -moz-transition: opacity 0.15s ease-in-out 0s; -o-transition: opacity 0.15s ease-in-out 0s; transition: opacity 0.15s ease-in-out 0s; opacity: 1; filter: alpha(opacity=100); } .dribbble-widget ul li a:hover { opacity: 0.35; filter: alpha(opacity=35); } .dribbble-widget ul li a img { width: 84px !important; height: 84px; -moz-backface-visibility: hidden; /* Prevents Flickr Image On Firefox */ } /* Social Widget */ .social_widget a { position: relative; display: inline-block; margin: 0 5px 5px 0; width: 40px; height: 40px; border: 2px solid #F05253; background-color: transparent; -webkit-transition: background 0.15s ease-in-out 0s; -moz-transition: background 0.15s ease-in-out 0s; -o-transition: background 0.15s ease-in-out 0s; transition: background 0.15s ease-in-out 0s; } .social_widget a i { position: absolute; top: 50%; left: 50%; margin: -8px 0 0 -8px; color: #F05253; font-size: 16px; -webkit-transition: color 0.15s ease-in-out 0s; -moz-transition: color 0.15s ease-in-out 0s; -o-transition: color 0.15s ease-in-out 0s; transition: color 0.15s ease-in-out 0s; } .social_widget a:hover { background-color: #F05253; } .social_widget a:hover i { color: #FFFFFF; } /***** Footer Area Widgets ******/ .footer-widgets .widget + .widget { margin-top: 30px; } .footer-widgets { color: #FFFFFF; font-size: 14px; } .footer-widgets h3 { color: #717580; text-transform: uppercase; font-size: 16px; letter-spacing: 0; font-weight: 400 !important; margin-bottom: 25px; } .footer-widgets a:hover { color: #FFFFFF; } /* Search */ .footer-widgets .widget_search form { margin: 0; } .footer-widgets .widget_search #searchform input[type="text"], .footer-widgets .widget_search .widget_search form input[type="text"] { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; margin: 0; padding: 15px; width: 100%; height: auto; border: none; -webkit-border-radius: 2px; -moz-border-radius: 2px; border-radius: 2px; background: #171717; -webkit-box-shadow: none; -moz-box-shadow: none; box-shadow: none; color: #444444; font-size: 16px; resize: none; -webkit-transition: color 0.15s ease-in-out 0s; -moz-transition: color 0.15s ease-in-out 0s; -o-transition: color 0.15s ease-in-out 0s; transition: color 0.15s ease-in-out 0s; } .footer-widgets .widget_search #searchform input[type="text"]:focus, .footer-widgets .widget_search .widget_search form input[type="text"]:focus { color: #FFFFFF; } /* Dribbble Widget */ .footer-widgets .dribbble-widget ul { margin: 20px 0 0 0; } /* Footer Twitter Widget */ .footer-widgets .az_widget_twitter li:first-child { margin-top: 0; } .footer-widgets .az_widget_twitter li { margin-top: 20px; } .footer-widgets .tweet_timestamp > a { display: block; margin-top: 0; font-size: 13px; color: #717580 !important; } /* Footer Calendar Widget */ .footer-widgets .widget_calendar table tbody tr:nth-child(2n+1) { background-color: #171717; } .footer-widgets .widget_calendar table tbody td { color: #F0F0F0; } .footer-widgets .widget_calendar table th { color: #FFFFFF; } /* Social Widget */ .footer-widgets .social_widget a { color: #FFFFFF; } .footer-widgets .social_widget a:hover { color: #67C0B9; } /* Flickr & Dribbble Widget */ .footer-widgets .widget_quick-flickr-widget ul li a img, .footer-widgets .dribbble-widget ul li a img { width: 87px !important; height: 87px; -webkit-border-radius: 0; -moz-border-radius: 0; border-radius: 0; -moz-backface-visibility: hidden; /* Prevents Flickr Image On Firefox */ } .footer-widgets .widget_quick-flickr-widget ul li, .footer-widgets .dribbble-widget ul li { margin: 0 3px 3px 0; } /*-----------------------------------------------------------------------------------*/ /* 23. Isotope Portfolio Filtering Settings /*-----------------------------------------------------------------------------------*/ /**** Isotope Filtering ****/ .isotope-item { z-index: 2; } .isotope-hidden.isotope-item { z-index: 1; pointer-events: none; } /**** Isotope CSS3 transitions ****/ .isotope, .isotope .isotope-item { -webkit-transition-duration: 0.8s; -moz-transition-duration: 0.8s; -ms-transition-duration: 0.8s; -o-transition-duration: 0.8s; transition-duration: 0.8s; } .isotope { -webkit-transition-property: height, width; -moz-transition-property: height, width; -ms-transition-property: height, width; -o-transition-property: height, width; transition-property: height, width; } .isotope .isotope-item { -webkit-transition-property: -webkit-transform, opacity; -moz-transition-property: -moz-transform, opacity; -ms-transition-property: -ms-transform, opacity; -o-transition-property: -o-transform, opacity; transition-property: transform, opacity; } /**** disabling Isotope CSS3 transitions ****/ .isotope.no-transition, .isotope.no-transition .isotope-item, .isotope .isotope-item.no-transition { -webkit-transition-duration: 0s; -moz-transition-duration: 0s; -ms-transition-duration: 0s; -o-transition-duration: 0s; transition-duration: 0s; } /* End: Recommended Isotope styles */ /* disable CSS transitions for containers with infinite scrolling*/ .isotope.infinite-scrolling { -webkit-transition: none; -moz-transition: none; -ms-transition: none; -o-transition: none; transition: none; } /*-----------------------------------------------------------------------------------*/ /* 24. Animation Preloader Settings /*-----------------------------------------------------------------------------------*/ .animation-enabled header, .animation-enabled #main, .animation-enabled footer { opacity: 0; filter: alpha(opacity=0); } .animation-enabled header { margin-top: -150px; } #jpreOverlay, #jSplash { background-color: #F05253; position: absolute; width: 100%; height: 100%; z-index: 700; } #jpreLoader { position: relative !important; width: 100% !important; height: 100% !important; } #jprePercentage { background: #F05253; width: 150px; height: 100px !important; text-align: center; left: 50%; top: -54px; margin: 0 0 0 -75px; line-height: 100px; z-index: 800; font-size: 48px; font-weight: 400; color: #FFFFFF; } #jpreBar { background: #FFFFFF; height: 4px !important; } /*-----------------------------------------------------------------------------------*/ /* 25. Fancybox Settings /*-----------------------------------------------------------------------------------*/ .fancybox-wrap, .fancybox-skin, .fancybox-outer, .fancybox-inner, .fancybox-image, .fancybox-wrap iframe, .fancybox-wrap object, .fancybox-nav, .fancybox-nav span, .fancybox-tmp { padding: 0; margin: 0; border: 0; outline: none; vertical-align: top; } .fancybox-wrap { position: absolute; top: 0; left: 0; z-index: 8020; } .fancybox-skin { position: relative; background: #f9f9f9; color: #444; text-shadow: none; } .fancybox-opened { z-index: 8030; } .fancybox-opened .fancybox-skin { -webkit-box-shadow: 0 10px 25px rgba(0, 0, 0, 0.5); -moz-box-shadow: 0 10px 25px rgba(0, 0, 0, 0.5); box-shadow: 0 10px 25px rgba(0, 0, 0, 0.5); } .fancybox-outer, .fancybox-inner { position: relative; } .fancybox-inner { overflow: hidden; } .fancybox-type-iframe .fancybox-inner { -webkit-overflow-scrolling: touch; } .fancybox-error { color: #444; font: 14px/20px "Helvetica Neue",Helvetica,Arial,sans-serif; margin: 0; padding: 15px; white-space: nowrap; } .fancybox-image, .fancybox-iframe { display: block; width: 100%; height: 100%; } .fancybox-image { max-width: 100%; max-height: 100%; } #fancybox-loading, .fancybox-close, .fancybox-prev span, .fancybox-next span { background-image: url('../images/fancybox_sprite.png'); } #fancybox-loading { position: fixed; top: 50%; left: 50%; margin-top: -22px; margin-left: -22px; background-position: 0 -108px; opacity: 0.8; cursor: pointer; z-index: 8060; } #fancybox-loading div { width: 44px; height: 44px; background: url('_include/img/fancybox/fancybox_loading.gif') center center no-repeat; } .fancybox-close { position: absolute; top: -18px; right: -18px; width: 36px; height: 36px; cursor: pointer; z-index: 8040; } .fancybox-nav { position: absolute; top: 40%; width: 20%; height: 20%; cursor: pointer; text-decoration: none; background: transparent url('_include/img/fancybox/blank.gif'); /* helps IE */ -webkit-tap-highlight-color: rgba(0,0,0,0); z-index: 8040; } .fancybox-prev { left: 0; } .fancybox-next { right: 0; } .fancybox-nav span { position: absolute; top: 50%; width: 36px; height: 34px; margin-top: -18px; cursor: pointer; z-index: 8040; visibility: hidden; } .fancybox-prev span { left: 10px; background-position: 0 -36px; } .fancybox-next span { right: 10px; background-position: 0 -72px; } .fancybox-nav:hover span { visibility: visible; } .fancybox-tmp { position: absolute; top: -99999px; left: -99999px; visibility: hidden; max-width: 99999px; max-height: 99999px; overflow: visible !important; } /* Overlay helper */ .fancybox-lock { overflow: hidden !important; width: auto; } .fancybox-lock body { overflow: hidden !important; } .fancybox-lock-test { overflow-y: hidden !important; } .fancybox-overlay { position: absolute; top: 0; left: 0; overflow: hidden; display: none; z-index: 8010; background: url('../images/fancybox_overlay.png'); } .fancybox-overlay-fixed { position: fixed; bottom: 0; right: 0; } .fancybox-lock .fancybox-overlay { overflow: auto; overflow-y: scroll; } /* Title helper */ .fancybox-title { visibility: hidden; font-size: 18px; font-weight: 400; line-height: 1.5; position: relative; text-shadow: none; z-index: 8050; } .fancybox-title-inside-wrap { padding: 14px 20px; } .fancybox-opened .fancybox-title { visibility: visible; } .fancybox-title-float-wrap { position: absolute; bottom: 0; right: 50%; margin-bottom: -35px; z-index: 8050; text-align: center; } .fancybox-title-float-wrap .child { display: inline-block; margin-right: -100%; padding: 2px 20px; background: transparent; /* Fallback for web browsers that doesn't support RGBa */ background: rgba(0, 0, 0, 0.8); -webkit-border-radius: 15px; -moz-border-radius: 15px; border-radius: 15px; text-shadow: 0 1px 2px #222; color: #FFF; font-weight: 400; line-height: 24px; white-space: nowrap; } .fancybox-title-outside-wrap { position: relative; margin-top: 10px; color: #fff; } .fancybox-title-inside-wrap { padding-top: 14px; } .fancybox-title-over-wrap { position: absolute; bottom: 0; left: 0; color: #fff; padding: 10px; background: #000; background: rgba(0, 0, 0, .8); } .fancybox-wrap .counter-img { float: right; color: #ACACAC; font-size: 14px; line-height: 26px; } /*Retina graphics!*/ @media only screen and (-webkit-min-device-pixel-ratio: 1.5), only screen and (min--moz-device-pixel-ratio: 1.5), only screen and (min-device-pixel-ratio: 1.5){ #fancybox-loading, .fancybox-close, .fancybox-prev span, .fancybox-next span { background-image: url('../images/fancybox_sprite@2x.png'); background-size: 44px 152px; /*The size of the normal image, half the size of the hi-res image*/ } #fancybox-loading div { background-image: url('../images/fancybox_loading@2x.gif'); background-size: 24px 24px; /*The size of the normal image, half the size of the hi-res image*/ } } /*-----------------------------------------------------------------------------------*/ /* 26. Shortcodes /*-----------------------------------------------------------------------------------*/ /*-----------------------------------------------------------------------------------*/ /* 0-1. Buttons /*-----------------------------------------------------------------------------------*/ .button-main { display: inline-block; padding: 12px 20px 11px; background-color: transparent; color: #CCCCCC; vertical-align: middle; text-align: center; text-transform: uppercase; font-weight: 400; font-size: 14.5px; cursor: pointer; font-weight: bold; border: 2px solid #CCCCCC; border-radius: 3px; -webkit-transition: background 0.1s linear, color 0.1s linear, border 0.1s linear; -moz-transition: background 0.1s linear, color 0.1s linear, border 0.1s linear; -o-transition: background 0.1s linear, color 0.1s linear, border 0.1s linear; transition: background 0.1s linear, color 0.1s linear, border 0.1s linear; } /*--- Hover/Active/Focus State ---*/ .button-main:hover, .button-main:active, .button-main:focus { background-color: #F05253; border-color: #F05253; color: #FFFFFF; border-radius: 3px; } /* --- Button Sizes --- */ .button-main.button-large { padding: 16px 30px 15px; font-size: 16.5px; } .button-main.button-small { padding: 8px 18px 7px; font-size: 12.5px; } .button-main.button-mini { padding: 4px 12px 3px; font-size: 11.5px; } .button-main.button-block { padding-right: 0; padding-left: 0; width: 100%; } .button-main + .button-main { margin-left: 10px; } /*--- Inverted ---*/ .button-main.inverted { background-color: #F05253; border-color: #F05253; color: #FFFFFF; } .button-main.inverted:hover, .button-main.inverted:active, .button-main.inverted:focus { background-color: transparent; border-color: #CCCCCC; color: #CCCCCC; } /*--- With Icon ---*/ .button-main i { position: relative; top: 1px; left: -2px; margin-right: 5px; } /*--- Custom Buttons ---*/ .button-main.custom-button-color { color: #FFFFFF; opacity: 1; -webkit-transition: opacity 0.1s linear; -moz-transition: opacity 0.1s linear; -o-transition: opacity 0.1s linear; transition: opacity 0.1s linear; } .button-main.custom-button-color:hover, .button-main.custom-button-color:active, .button-main.custom-button-color:focus { opacity: 0.9; color: #FFFFFF; } .button-main.custom-button-color.inverted { background: transparent !important; opacity: 1; -webkit-transition: opacity 0.1s linear; -moz-transition: opacity 0.1s linear; -o-transition: opacity 0.1s linear; transition: opacity 0.1s linear; } .button-main.custom-button-color.inverted:hover, .button-main.custom-button-color.inverted:active, .button-main.custom-button-color.inverted:focus { opacity: 0.9; } /*-----------------------------------------------------------------------------------*/ /* 0-2. Box Icon /*-----------------------------------------------------------------------------------*/ .box { display: block; padding: 10px; text-align: center; } .box h4 { margin-bottom: 0; } .box p { color: #818B92; font-weight: 300; } /* Box Circle Icon */ .box .icon.circle-mode-box { position: relative; display: inline-block; margin-bottom: 20px; width: 64px; height: 64px; background: transparent; border: 2px solid rgba(240,82,83,0.5); border-radius: 999px; -webkit-transition: background 0.15s ease-in-out 0s, border 0.15s ease-in-out 0s; -moz-transition: background 0.15s ease-in-out 0s, border 0.15s ease-in-out 0s; -o-transition: background 0.15s ease-in-out 0s, border 0.15s ease-in-out 0s; transition: background 0.15s ease-in-out 0s, border 0.15s ease-in-out 0s; } .box .icon.circle-mode-box i { position: absolute; top: 50%; left: 50%; margin: -12px 0 0 -12px; color: #F05253; font-size: 24px; -webkit-transition: color 0.15s ease-in-out 0s; -moz-transition: color 0.15s ease-in-out 0s; -o-transition: color 0.15s ease-in-out 0s; transition: color 0.15s ease-in-out 0s; } .box:hover .icon.circle-mode-box, .box:active .icon.circle-mode-box, .box:focus .icon.circle-mode-box { border-color: #F05253; background: #F05253; } .box:hover .icon.circle-mode-box i, .box:active .icon.circle-mode-box i, .box:focus .icon.circle-mode-box i{ color: #FFFFFF; } /* Box Standard Icons */ .box.standard-icon i { font-size: 22px; margin-right: 8px; vertical-align: -2px; } /* Box Only Icons */ .box .icon.icon-only-mode-box { color: #F05253; font-size: 36px; margin-bottom: 20px; } .box.listed-left.only-icon .icon.icon-only-mode-box, .box.listed-right.only-icon .icon.icon-only-mode-box { margin-bottom: 0; } /* Box Icons Left and Right with Circle and Icons Only */ .box.listed-left { display: block; padding: 30px 0; text-align: left; } .box.listed-left .icon{ float: left; text-align: center; } .box.listed-right { display: block; padding: 30px 0; text-align: right; } .box.listed-right .icon { float: right; text-align: center; } .box.listed-left.circle-icon .box-text { padding-left: 90px; } .box.listed-right.circle-icon .box-text { padding-right: 90px; } .box.listed-left.only-icon .box-text { padding-left: 60px; } .box.listed-right.only-icon .box-text { padding-right: 60px; } /* Boxed Version */ .box.boxed-version { position: relative; background: #FFFFFF; border: 1px solid #EDEDED; display: block; padding: 30px 30px 20px; margin: 30px 0; text-align: center; } .box.boxed-version .icon-boxed { margin-bottom: 20px; } .box.boxed-version .icon-boxed i { color: #F05253; font-size: 32px; vertical-align: middle; } /*-----------------------------------------------------------------------------------*/ /* 0-3. Dropdown /*-----------------------------------------------------------------------------------*/ .dropmenu { position: relative; overflow: hidden; margin: 20px 0 30px; width: 263px; height: 46px; border: 1px solid #DFDFDF; line-height: 1; cursor: pointer; -webkit-transition: border 0.1s linear 0s; -moz-transition: border 0.1s linear 0s; -o-transition: border 0.1s linear 0s; transition: border 0.1s linear 0s; } .dropmenu p { display: block; margin: 0; padding: 16px 0 16px 16px; color: #2D3C48; font-weight: 400; font-size: 14px; } .dropmenu i { position: absolute; top: 50%; right: 10px; margin-top: -8px; color: #BDC3C7; font-size: 20px; -webkit-transition: all 0.15s ease-in-out 0s; -moz-transition: all 0.15s ease-in-out 0s; -o-transition: all 0.15s ease-in-out 0s; transition: all 0.15s ease-in-out 0s; } .dropmenu:hover, .dropmenu:hover, .dropmenu.open, .dropmenu.open { border-color: #C5C5C5; } .dropmenu.open i { -webkit-transform: rotate(180deg); -moz-transform: rotate(180deg); -ms-transform: rotate(180deg); -o-transform: rotate(180deg); transform: rotate(180deg); } .dropmenu-active { position: absolute; top: 45px; z-index: 10; display: none; width: 263px; background: #FFFFFF; border: 1px solid #C5C5C5; border-top: 1px solid #DFDFDF; color: #56646F; } .dropmenu-active ul { margin: 0; padding: 0; } .dropmenu-active ul li { list-style: none; } .dropmenu-active ul li a { display: block; padding: 8px 0 8px 16px; font-size: 14px; font-weight: 300; color: #818B92; } .dropmenu-active ul li a:hover { color: #F05253; } .dropmenu-active ul li:first-child a { padding-top: 16px; } .dropmenu-active ul li:last-child a { padding-bottom: 16px; } /*-----------------------------------------------------------------------------------*/ /* 0-4. Accordion and Toggle /*-----------------------------------------------------------------------------------*/ .panel { -webkit-box-shadow: none; -moz-box-shadow: none; box-shadow: none; -webkit-border-radius: 0; -moz-border-radius: 0; border-radius: 0; border: 1px solid #DFDFDF; margin-bottom: 5px; -webkit-transition: border 0.1s linear 0s; -moz-transition: border 0.1s linear 0s; -o-transition: border 0.1s linear 0s; transition: border 0.1s linear 0s; } .panel:hover { border-color: #C5C5C5; } .accordion-group { margin-bottom: 4px; border: none; } .accordion-heading { border-bottom: 0 none; } .accordion-heading .accordion-toggle { position: relative; display: block; padding: 15px 15px 15px 25px; color: #2D3C48; font-weight: 400; font-size: 16px; } .accordion-toggle { cursor: pointer; } .accordion-heading .accordion-toggle.active { border-bottom: 1px solid #DFDFDF; } .accordion-heading .accordion-toggle.inactive { border-bottom: none; } .accordion-heading.accordionize .accordion-toggle span, .accordion-heading.togglize .accordion-toggle span { position: absolute; top: 50%; right: 20px; margin: -8px 0 0 0; color: #BDC3C7; font-size: 20px; -webkit-transition: all 0.1s linear 0s; -moz-transition: all 0.1s linear 0s; -o-transition: all 0.1s linear 0s; transition: all 0.1s linear 0s; } .accordion-heading.accordionize .accordion-toggle.active span, .accordion-heading.togglize .accordion-toggle.active span { -webkit-transform: rotate(180deg); -moz-transform: rotate(180deg); -ms-transform: rotate(180deg); -o-transform: rotate(180deg); transform: rotate(180deg); } .accordion-heading.togglize .accordion-toggle span { margin: -8px 0 0 0; font-size: 20px; } .accordion-heading.togglize .accordion-toggle.active span { opacity: 0; filter: alpha(opacity=0); } .accordion-heading.togglize .accordion-toggle.active span + span { opacity: 1; filter: alpha(opacity=100); } .accordion-inner { margin-top: 4px; padding: 15px 25px 17px; border: none; } /*-----------------------------------------------------------------------------------*/ /* 0-5. Alerts /*-----------------------------------------------------------------------------------*/ .alert { margin-bottom: 20px; padding: 15px 35px 15px 15px; border: none; -webkit-border-radius: 0px; -moz-border-radius: 0px; border-radius: 0px; background-color: #F39C12; -webkit-box-shadow: 0 -2px 0 rgba(0, 0, 0, 0.1) inset; -moz-box-shadow: 0 -2px 0 rgba(0, 0, 0, 0.1) inset; box-shadow: 0 -2px 0 rgba(0, 0, 0, 0.1) inset; } .alert, .alert h4 { color: #FFFFFF; } .alert h4 { margin-bottom: 5px; } .alert .close { position: relative; top: 2px; right: -22px; color: #FFFFFF; text-shadow: none; line-height: 20px; opacity: 0.5; -webkit-transition: opacity 0.1s linear 0s; -moz-transition: opacity 0.1s linear 0s; -o-transition: opacity 0.1s linear 0s; transition: opacity 0.1s linear 0s; } .alert .close:hover { opacity: 1; } .alert-standard { background-color: #EFF0F2; color: #56646F; } .alert-standard .close { color: #BDC3C7; } .alert-success { background-color: #2ECC71; } .alert-danger, .alert-error { background-color: #E74C3C; } .alert-info { background-color: #3498DB; } .alert-block { padding-top: 14px; padding-bottom: 14px; } .alert-block > ul { margin-bottom: 0; } .alert-block > p { margin: 0; } .alert-block p + p { margin-top: 5px; } /*-----------------------------------------------------------------------------------*/ /* 0-6. Tabs /*-----------------------------------------------------------------------------------*/ .nav { margin-bottom: 0px; margin-left: 0; list-style: none; } .nav > li > a { display: inline-block; -webkit-border-radius: 0; -moz-border-radius: 0; border-radius: 0; color: #2D3C48; font-weight: 400; font-size: 16px; } .nav > li > a:hover, .nav > li > a:focus { display: block; border-color: #C5C5C5; background: #FFFFFF; text-decoration: none; } .nav > li > a > img { max-width: none; } .nav > .pull-right { float: right; } .nav-tabs { *zoom: 1; } .nav-tabs:before, .nav-tabs:after { display: table; content: ""; line-height: 0; } .nav-tabs:after { clear: both; } .nav-tabs { border-bottom: none; } .nav-tabs > li { float: left; margin: 0 0 0 0; background: #FBFBFB; border: 1px solid #DFDFDF; border-left: none; border-bottom: none; } .nav-tabs > li:first-child { border-left: 1px solid #DFDFDF; } .nav-tabs > li > a { padding: 15px; border: none; line-height: 20px; margin: 0; -webkit-transition: all 0.1s linear 0s; -moz-transition: all 0.1s linear 0s; -o-transition: all 0.1s linear 0s; transition: all 0.1s linear 0s; } .nav-tabs > li.active > a, .nav-tabs > li.active > a:hover, .nav-tabs > li.active > a:focus { background: #FFFFFF; color: #2D3C48; border: none; } .tabbable { *zoom: 1; } .tabbable:before, .tabbable:after { display: table; content: ""; line-height: 0; } .tabbable:after { clear: both; } .tab-content { overflow: auto; padding: 20px; border: 1px solid #DFDFDF; } .tab-content > .tab-pane { display: none; } .tab-content > .active { display: block; } /*-----------------------------------------------------------------------------------*/ /* 0-7. Blockquotes /*-----------------------------------------------------------------------------------*/ /*blockquote { border-left: 3px solid #DFDFDF; font-style: italic; margin: 30px 15px; padding-left: 15px; } blockquote p { font-weight: 400; font-size: 15px; line-height: 24px; padding: 0; margin: 0; }*/ /*-----------------------------------------------------------------------------------*/ /* 0-8. Tooltip /*-----------------------------------------------------------------------------------*/ .tooltip { position: absolute; z-index: 999; display: block; visibility: visible; font-weight: 400; font-size: 14px; opacity: 0; filter: alpha(opacity=0); } .tooltip.in { opacity: 1; filter: alpha(opacity=100); } .tooltip.top { margin-top: -5px; } .tooltip.right { margin-left: 15px; } .tooltip.bottom { margin-top: 5px; } .tooltip.left { margin-left: -15px; } .tooltip-inner { padding: 12px; max-width: 300px; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; background-color: #F05253; color: #FFFFFF; font-size: 13px; text-align: center; text-decoration: none; } .tooltip-arrow { position: absolute; width: 0; height: 0; border-style: solid; border-color: transparent; } .tooltip.top .tooltip-arrow { bottom: 0; left: 50%; margin-left: -10px; border-width: 10px 10px 0; border-top-color: #F05253; } .tooltip.right .tooltip-arrow { top: 50%; left: 0; margin-top: -10px; border-width: 10px 10px 10px 0; border-right-color: #F05253; } .tooltip.left .tooltip-arrow { top: 50%; right: 0; margin-top: -10px; border-width: 10px 0 10px 10px; border-left-color: #F05253; } .tooltip.bottom .tooltip-arrow { top: 0; left: 50%; margin-left: -10px; border-width: 0 10px 10px; border-bottom-color: #F05253; } /*-----------------------------------------------------------------------------------*/ /* 0-9. Highlights /*-----------------------------------------------------------------------------------*/ .color-text { color: #F05253; } .highlight-text { padding: 0 4px; background-color: #F05253; color: #FFFFFF; } /*-----------------------------------------------------------------------------------*/ /* 0-10. Dropcap /*-----------------------------------------------------------------------------------*/ .dropcap { display: block; float: left; margin: 4px 12px 0 0; color: #2D3C48; font-weight: 400; font-size: 38px; line-height: 38px; } .dropcap-color { display: block; float: left; margin: 4px 12px 0 0; color: #F05253; font-weight: 400; font-size: 38px; line-height: 38px; } /*-----------------------------------------------------------------------------------*/ /* 0-11. Video Embed Iframe / Audio /*-----------------------------------------------------------------------------------*/ iframe, object, embed { max-width: 100%; border: none; } .videoWrapper, .video-container, .audio-container { margin-bottom: 20px; } /*-----------------------------------------------------------------------------------*/ /* 0-12. Progress Bar and Circular Graph /*-----------------------------------------------------------------------------------*/ .progress-bar { float: none; width: auto; margin: 10px 0; background-color: #EBEDEF; -webkit-border-radius: 0; -moz-border-radius: 0; border-radius: 0; -webkit-box-shadow: none; -moz-box-shadow: none; box-shadow: none; } .progress { position: relative; margin: 0; height: 46px; background-color: #EBEDEF; -webkit-border-radius: 0; -moz-border-radius: 0; border-radius: 0; -webkit-box-shadow: 0 -2px 0 rgba(0, 0, 0, 0.05) inset; -moz-box-shadow: 0 -2px 0 rgba(0, 0, 0, 0.05) inset; box-shadow: 0 -2px 0 rgba(0, 0, 0, 0.05) inset; } .progress-bar .bar { float: left; font-size: 12px; height: 100%; text-align: center; -webkit-border-radius: 0; -moz-border-radius: 0; border-radius: 0; background-color: #F05253; background-image: none; -webkit-box-shadow: 0 -2px 0 rgba(0, 0, 0, 0.1) inset; -moz-box-shadow: 0 -2px 0 rgba(0, 0, 0, 0.1) inset; box-shadow: 0 -2px 0 rgba(0, 0, 0, 0.1) inset; } .progress .field { position: absolute; left: 20px; color: #FFFFFF; font-weight: 400; line-height: 46px; text-transform: uppercase; } .progress .field i { margin-right: 10px; vertical-align: middle; font-size: 16px; } .progress-circle { margin: 30px 0; text-align: center; } .easyPieChart { position: relative; text-align: center; display: inline-block; color: #2D3C48; font-size: 48px; font-weight: 700; } .easyPieChart .percentage { position: relative; top: -10px; } .easyPieChart .field { position: absolute; top: 15%; left: 50%; width: 120px; height: 30px; margin: 0 0 0 -60px; font-size: 14px; font-weight: 400; text-transform: uppercase; } .easyPieChart canvas { position: absolute; top: 0; left: 0; } /*-----------------------------------------------------------------------------------*/ /* 0-13. Lightbox Images and Video Fancybox /*-----------------------------------------------------------------------------------*/ .lightbox { position: relative; overflow: hidden; margin-bottom: 30px; } .fancy-wrap.hidden { display: none; } .fancy-wrap { position: relative; display: block; overflow: hidden; width: 100%; height: 100%; } .fancy-wrap img { position: relative; width: 100%; } .fancy-wrap .overlay { position: absolute; top: 0; left: 0; right: 0; bottom: 0; display: block; background: rgba(0,0,0,0.75); opacity: 0; -webkit-transition: opacity 0.3s ease 0s; -moz-transition: opacity 0.3s ease 0s; -o-transition: opacity 0.3s ease 0s; transition: opacity 0.3s ease 0s; } .fancy-wrap:hover .overlay, .fancy-wrap:active .overlay, .fancy-wrap:focus .overlay { opacity: 1; } .fancy-wrap .overlay .circle { position: absolute; top: 50%; left: 50%; background: transparent; border: 2px solid #FFFFFF; width: 48px; height: 48px; margin: -24px 0 0 -24px; -webkit-border-radius: 999px; -moz-border-radius: 999px; border-radius: 999px; } .fancy-wrap .overlay i { position: absolute; top: 50%; left: 50%; margin: -8px 0 0 -8px; color: #FFFFFF; font-size: 16px; } /*-----------------------------------------------------------------------------------*/ /* 0-14. Pricing Tables /*-----------------------------------------------------------------------------------*/ .pricing-table { display: inline-block; overflow: hidden; margin: 20px 0 14px; width: 100%; } .pricing-table h5 { display: block; margin: 0; padding: 17px 0; width: 100%; text-align: center; border: 1px solid #DFDFDF; text-transform: uppercase; } .pricing-table .price { display: block; border: 1px solid #DFDFDF; border-top: none; padding: 17px 0; width: 100%; color: #2D3C48; text-align: center; font-weight: 700; font-size: 24px; } .pricing-table .price span { display: block; font-weight: 400; font-size: 12px; } .pricing-table ul { margin: 0; padding: 0; border-left: 1px solid #DFDFDF; border-right: 1px solid #DFDFDF; } .pricing-table li { display: block; padding: 10px 0; border-bottom: 1px solid #DFDFDF; text-align: center; font-size: 14px; } .pricing-table li:last-child { border-bottom: none; } .pricing-table .confirm { display: block; padding: 16px 0; width: 100%; background: #7A8499; color: #FFFFFF; text-align: center; text-transform: uppercase; font-weight: 400; font-size: 14px; -webkit-box-shadow: 0 -2px 0 rgba(0, 0, 0, 0.1) inset; -moz-box-shadow: 0 -2px 0 rgba(0, 0, 0, 0.1) inset; box-shadow: 0 -2px 0 rgba(0, 0, 0, 0.1) inset; -webkit-transition: opacity 0.15s ease-in-out 0s; -moz-transition: opacity 0.15s ease-in-out 0s; -o-transition: opacity 0.15s ease-in-out 0s; transition: opacity 0.15s ease-in-out 0s; } .pricing-table.selected { margin-top: 0; } .pricing-table.selected h5 { padding: 27px 0; } .pricing-table.selected .price { background: #F05253; color: #FFFFFF; } .pricing-table.selected .price span { color: #FFFFFF; } .pricing-table.selected li { font-weight: 400; } .pricing-table.selected .confirm { padding: 24px 0; background: #F05253; } .pricing-table .confirm:hover, .pricing-table.selected .confirm:hover { opacity: 0.90; } /*-----------------------------------------------------------------------------------*/ /* 0-15. Divider /*-----------------------------------------------------------------------------------*/ .divider { position: relative; margin: 30px 0 36px; width: 100%; border-bottom: 2px solid #EBEDEF; } .divider.short { margin: 30px auto 36px; width: 30%; } .blank_divider { width: 100%; height: 20px; } /*-----------------------------------------------------------------------------------*/ /* 0-16. Media Elements /*-----------------------------------------------------------------------------------*/ audio, canvas, video { outline: none; } .mejs-container { position: relative; min-width: 150px; width: 100% !important; outline: none; background: none; vertical-align: top; text-align: left; text-decoration: none; font-family: sans-serif; } .me-plugin { position: absolute; } .mejs-embed, .mejs-embed body { overflow: hidden; margin: 0; padding: 0; width: 100%; height: 100%; background: #000; } .mejs-container-fullscreen { position: fixed; top: 0; right: 0; bottom: 0; left: 0; z-index: 1000; overflow: hidden; } .mejs-container-fullscreen .mejs-mediaelement, .mejs-container-fullscreen video { width: 100%; height: 100%; background: #000000; } /* Start: LAYERS */ .mejs-background { position: absolute; top: 0; left: 0; } .mejs-mediaelement { position: absolute; top: 0; left: 0; width: 100%; height: 100%; } .mejs-poster { position: absolute; top: 0; left: 0; overflow: hidden; } .mejs-poster img { display: block; padding: 0; width: 100%; height: 100%; border: 0; border: 0; } .mejs-overlay { position: absolute; top: 0; left: 0; width: 100% !important; height: 100% !important; } .mejs-overlay-play { width: 100% !important; height: 100% !important; cursor: pointer; } .mejs-overlay-button { position: absolute; top: 50%; left: 50%; margin: -35px 0 0 -35px; width: 70px; height: 70px; -webkit-border-radius: 70px; -moz-border-radius: 70px; border-radius: 70px; background-color: rgba(0,0,0,0.5); background-image: url(../images/bigplay.png); background-position: center center; background-repeat: no-repeat; -webkit-transition: background 0.15s ease-in-out 0s; -moz-transition: background 0.15s ease-in-out 0s; -o-transition: background 0.15s ease-in-out 0s; transition: background 0.15s ease-in-out 0s; } .mejs-overlay:hover .mejs-overlay-button { background-color: #F05253; } .mejs-overlay-loading { position: absolute; top: 50%; left: 50%; display: none; margin: -40px 0 0 -40px; width: 80px; height: 80px; } .mejs-overlay-loading span { display: block; width: 80px; height: 80px; border-radius: 40px; background: #3A3C3D url(_include/img/mediaelement/loading.gif) 50% 50% no-repeat; } /* End: LAYERS */ /* Start: CONTROL BAR */ .mejs-container .mejs-controls { position: absolute; bottom: 0; left: 0; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; margin: 0; padding: 0; padding: 10px; width: 100%; height: 50px; background: #171717; list-style: none; } .mejs-container .mejs-controls div { display: block; float: left; margin: 0; padding: 0; width: 32px; height: 30px; list-style-type: none; font-size: 11px; font-family: sans-serif; line-height: 11px; } .mejs-controls .mejs-button button { position: absolute; display: block; margin: 7px 7px 0 9px; padding: 0; width: 15px; height: 16px; border: 0; background: transparent url(../images/controls.png) no-repeat; text-decoration: none; font-size: 0; line-height: 0; cursor: pointer; } /* :focus for accessibility */ .mejs-controls .mejs-button button:focus { } /* End: CONTROL BAR */ /* Start: Time (current / duration) */ .mejs-container .mejs-controls .mejs-time { display: block; overflow: hidden; -webkit-box-sizing: content-box; -moz-box-sizing: content-box; box-sizing: content-box; padding: 8px 8px 5px 10px; /*width: auto;*/ height: 17px; color: #FFFFFF; text-align: center; } .mejs-container .mejs-controls .mejs-time span { display: block; float: left; margin: 2px 2px 0 2px; width: auto; color: #DDDDDD; font-size: 11px; line-height: 12px; } .mejs-time.mejs-currenttime-container { display: none !important; } /* End: Time (current / duration) */ /* Start: Play/pause */ .mejs-container .mejs-controls .mejs-playpause-button { width: 30px; background: none; cursor: pointer; } .mejs-controls .mejs-playpause-button button { margin: 7px 8px; } .mejs-controls .mejs-play button { background-position: 0 0; } .mejs-controls .mejs-play:hover button { background-position: 0 -32px; } .mejs-controls .mejs-pause button { background-position: 0 -16px; } .mejs-controls .mejs-pause:hover button { background-position: 0 -48px; } /* End: Play/pause */ /* Stop */ .mejs-controls .mejs-stop button { background-position: -112px 0; } .mejs-controls .mejs-stop:hover button { background-position: -112px -32px; } /* End: Play/pause */ /* Start: Progress bar */ .mejs-controls div.mejs-time-rail { width: 200px; } .mejs-controls .mejs-time-rail span { position: absolute; display: block; width: 180px; height: 7px; background: #000000; cursor: pointer; } .mejs-controls .mejs-time-rail .mejs-time-total { margin: 11px 8px 0 10px; } .mejs-controls .mejs-time-rail .mejs-time-buffering { z-index: 1; width: 100%; background: #373A3A; } .mejs-controls .mejs-time-rail .mejs-time-loaded { width: 0; background: #373A3A; } .mejs-controls .mejs-time-rail .mejs-time-current { z-index: 1; width: 0; background: #F05253; } .mejs-controls .mejs-time-rail .mejs-time-handle { position: absolute; top: 1px; z-index: 1; display: none; margin: 0; width: 5px; background: transparent; text-align: center; cursor: pointer; } .mejs-controls .mejs-time-rail .mejs-time-float { position: absolute; top: -26px; display: none !important; margin-left: -18px; width: 36px; height: 17px; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; background: #C2C8CF; box-shadow: 0 1px 1px rgba(0, 0, 0, .4); color: #111; text-align: center; } .mejs-container.mejs-audio .mejs-controls .mejs-time-rail .mejs-time-float { display: none !important; } .mejs-controls .mejs-time-rail .mejs-time-float-current { left: 0; display: block; margin: 3px; width: 30px; text-align: center; } .mejs-controls .mejs-time-rail .mejs-time-float-corner { position: absolute; top: 17px; left: 13px; display: block; width: 0; height: 0; border: solid 4px #C2C8CF; border-color: #C2C8CF transparent transparent transparent; -webkit-border-radius: 0; -moz-border-radius: 0; border-radius: 0; line-height: 0; } /*.mejs-controls .mejs-time-rail:hover .mejs-time-handle { visibility:visible;*/ /* End: Progress bar */ /* Start: Fullscreen */ .mejs-controls .mejs-fullscreen-button button { background-position: -32px 0; } .mejs-controls .mejs-unfullscreen button { background-position: -32px -16px; } /* End: Fullscreen */ /* Start: Mute/Volume */ .mejs-controls .mejs-volume-button { } .mejs-controls .mejs-mute button { background-position: -16px -16px; } .mejs-controls .mejs-mute button:hover { background-position: -16px -48px; } .mejs-controls .mejs-unmute button { background-position: -16px 0; } .mejs-controls .mejs-unmute button:hover { background-position: -16px -32px; } .mejs-controls .mejs-volume-button { position: relative; } .mejs-controls .mejs-volume-button .mejs-volume-slider { position: absolute; top: -68px; left: 1px; z-index: 1; display: none; margin: 0; width: 32px; height: 68px; -webkit-border-radius: 0; -moz-border-radius: 0; border-radius: 0; background: #171717; } .mejs-controls .mejs-volume-button:hover { -webkit-border-radius: 0 0 4px 4px; -moz-border-radius: 0 0 4px 4px; border-radius: 0 0 4px 4px; } /*.mejs-controls .mejs-volume-button:hover .mejs-volume-slider { display: block;*/ .mejs-controls .mejs-volume-button .mejs-volume-slider .mejs-volume-total { position: absolute; top: 8px; left: 13px; margin: 0; padding: 0; width: 7px; height: 46px; background: #373A3A; } .mejs-controls .mejs-volume-button .mejs-volume-slider .mejs-volume-current { position: absolute; top: 6px; left: 13px; margin: 0px; width: 7px; height: 50px; background: #F05253; background-position: bottom; } .mejs-controls .mejs-volume-button .mejs-volume-slider .mejs-volume-handle { position: absolute; top: 16px; left: 14px; margin: 0; width: 5px; height: 5px; background: transparent; } /* horizontal version */ .mejs-controls div.mejs-horizontal-volume-slider { position: relative; width: 62px; height: 26px; background: none; } .mejs-controls .mejs-horizontal-volume-slider .mejs-horizontal-volume-total { position: absolute; top: 11px; left: 0; margin: 0; padding: 1px; width: 50px; height: 7px; background: #373A3A; font-size: 1px; } .mejs-controls .mejs-horizontal-volume-slider .mejs-horizontal-volume-current { position: absolute; top: 11px; left: 0; padding: 0; width: 50px; height: 7px; background: #F05253; font-size: 1px; } .mejs-controls .mejs-horizontal-volume-slider .mejs-horizontal-volume-handle { display: none; } /* End: Mute/Volume */ /* Start: TRACK (Captions and Chapters) */ .mejs-controls .mejs-captions-button { position: relative; } .mejs-controls .mejs-captions-button button { background-position: -48px 0; } .mejs-controls .mejs-captions-button:hover button { background-position: -48px -32px; } .mejs-controls .mejs-captions-button .mejs-captions-selector { position: absolute; right: -10px; bottom: 30px; visibility: hidden; overflow: hidden; padding: 10px; width: 130px; height: 100px; border: solid 1px transparent; -webkit-border-radius: 0; -moz-border-radius: 0; border-radius: 0; background: #3A3C3D; } /*.mejs-controls .mejs-captions-button:hover .mejs-captions-selector { visibility: visible;*/ .mejs-controls .mejs-captions-button .mejs-captions-selector ul { display: block; overflow: hidden; margin: 0; padding: 0; list-style-type: none !important; } .mejs-controls .mejs-captions-button .mejs-captions-selector ul li { display: block; overflow: hidden; margin: 0 0 6px 0; padding: 0; color: #fff; list-style-type: none !important; } .mejs-controls .mejs-captions-button .mejs-captions-selector ul li input { float: left; clear: both; margin: 3px 3px 0 5px; } .mejs-controls .mejs-captions-button .mejs-captions-selector ul li label { float: left; padding: 4px 0 0 0; width: 100px; font-size: 10px; font-family: sans-serif; line-height: 15px; } .mejs-controls .mejs-captions-button .mejs-captions-translations { margin: 0 0 5px 0; font-size: 10px; } .mejs-chapters { position: absolute; top: 0; left: 0; z-index: 1; width: 10000px; -xborder-right: solid 1px #FFFFFF; } .mejs-chapters .mejs-chapter { position: absolute; float: left; overflow: hidden; border: 0; background: #3A3C3D; } .mejs-chapters .mejs-chapter .mejs-chapter-block { display: block; padding: 5px; border-right: solid 1px #313335; border-right: solid 1px rgba(49, 51, 53, .7); border-bottom: solid 1px #313335; border-bottom: solid 1px rgba(49, 51, 53, .7); color: #fff; font-size: 11px; cursor: pointer; } .mejs-chapters .mejs-chapter .mejs-chapter-block-last { border-right: none; } .mejs-chapters .mejs-chapter .mejs-chapter-block:hover { background: #2D3C48; } .mejs-chapters .mejs-chapter .mejs-chapter-block .ch-title { display: block; margin: 0 0 3px 0; text-overflow: ellipsis; white-space: nowrap; font-weight: bold; font-size: 12px; line-height: 12px; } .mejs-chapters .mejs-chapter .mejs-chapter-block .ch-timespan { display: block; margin: 3px 0 4px 0; text-overflow: ellipsis; white-space: nowrap; font-size: 12px; line-height: 12px; } .mejs-captions-layer { position: absolute; bottom: 0; left: 0; color: #fff; text-align: center; /*font-weight: bold;*/ font-size: 12px; line-height: 22px; } .mejs-captions-layer a { color: #fff; text-decoration: underline; } .mejs-captions-layer[lang=ar] { font-weight: normal; font-size: 20px; } .mejs-captions-position { position: absolute; bottom: 15px; left: 0; width: 100%; } .mejs-captions-position-hover { bottom: 45px; } .mejs-captions-text { padding: 5px 7px; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; background: #3a3c3d; background: rgba(58, 60, 61, 0.8); } /* End: TRACK (Captions and Chapters) */ .mejs-clear { clear: both; } /* Start: ERROR */ .me-cannotplay { } .me-cannotplay a { color: #fff; font-weight: bold; } .me-cannotplay span { display: block; padding: 15px; } /* End: ERROR */ /* Start: Loop */ .mejs-controls .mejs-loop-off button { background-position: -64px -16px; } .mejs-controls .mejs-loop-off:hover button { background-position: -64px -48px; } .mejs-controls .mejs-loop-on button { background-position: -64px 0; } .mejs-controls .mejs-loop-on::hover button { background-position: -64px -32px; } /* End: Loop */ /* Start: backlight */ .mejs-controls .mejs-backlight-off button { background-position: -80px -16px; } .mejs-controls .mejs-backlight-off:hover button { background-position: -80px -48px; } .mejs-controls .mejs-backlight-on button { background-position: -80px 0; } .mejs-controls .mejs-backlight-on:hover button { background-position: -80px -32px; } /* End: backlight */ /* Start: picture controls */ .mejs-controls .mejs-picturecontrols-button { background-position: -96px 0; } .mejs-controls .mejs-picturecontrols-button:hover { background-position: -96px -32px; } /* End: picture controls */ /* context menu */ .mejs-contextmenu { position: absolute; top: 0; left: 0; z-index: 1001; /* make sure it shows on fullscreen */ padding: 10px; width: 150px; border: solid 1px #999; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; background: #fff; } .mejs-contextmenu .mejs-contextmenu-separator { margin: 5px 6px; height: 1px; background: #333; font-size: 0; } .mejs-contextmenu .mejs-contextmenu-item { padding: 4px 6px; color: #333; font-size: 12px; font-family: sans-serif; cursor: pointer; } .mejs-contextmenu .mejs-contextmenu-item:hover { background: #2C7C91; color: #fff; } /* Start: SourceChooser */ .mejs-controls .mejs-sourcechooser-button { position: relative; } .mejs-controls .mejs-sourcechooser-button button { background-position: -128px 0; } .mejs-controls .mejs-sourcechooser-button button { background-position: -128px -32px; } .mejs-controls .mejs-sourcechooser-button .mejs-sourcechooser-selector { position: absolute; right: -10px; bottom: 26px; visibility: hidden; overflow: hidden; padding: 10px; width: 130px; height: 100px; border: solid 1px transparent; -webkit-border-radius: 0; -moz-border-radius: 0; border-radius: 0; background: #3A3C3D; } .mejs-controls .mejs-sourcechooser-button .mejs-sourcechooser-selector ul { display: block; overflow: hidden; margin: 0; padding: 0; list-style-type: none !important; } .mejs-controls .mejs-sourcechooser-button .mejs-sourcechooser-selector ul li { display: block; overflow: hidden; margin: 0 0 6px 0; padding: 0; color: #fff; list-style-type: none !important; } .mejs-controls .mejs-sourcechooser-button .mejs-sourcechooser-selector ul li input { float: left; clear: both; margin: 3px 3px 0 5px; } .mejs-controls .mejs-sourcechooser-button .mejs-sourcechooser-selector ul li label { float: left; padding: 4px 0 0 0; width: 100px; font-size: 10px; font-family: sans-serif; line-height: 15px; } /*-----------------------------------------------------------------------------------*/ /* 0-17. Social Profiles /*-----------------------------------------------------------------------------------*/ .social-icons { margin: 20px 0 0; } .social-icons li { display: inline-block; list-style: none outside none; } .social-icons li a { position: relative; display: block; margin: 0 20px 5px 0; } .social-icons li a i { color: #DFDFDF; font-size: 24px; -webkit-transition: color 0.15s ease-in-out 0s; -moz-transition: color 0.15s ease-in-out 0s; -o-transition: color 0.15s ease-in-out 0s; transition: color 0.15s ease-in-out 0s; } .social-icons li a:hover i { color: #F05253; } /*-----------------------------------------------------------------------------------*/ /* 0-18. Icons Example for Demo Content Only /*-----------------------------------------------------------------------------------*/ .icons-example ul { margin: 0; padding: 0; text-align: center; } .icons-example ul li { display: inline-block; margin: 15px; list-style: none; cursor: pointer; } .icons-example ul li a { position: relative; display: block; width: 66px; height: 66px; border: 2px solid #EDEDED; } .icons-example ul li a i { position: absolute; top: 50%; left: 50%; margin: -12px 0 0 -12px; color: #CCCCCC; font-size: 24px; -webkit-transition: color 0.15s ease-in-out 0s; -moz-transition: color 0.15s ease-in-out 0s; -o-transition: color 0.15s ease-in-out 0s; transition: color 0.15s ease-in-out 0s; } .icons-example ul li a:hover i { color: #A4A4A4; } /*-----------------------------------------------------------------------------------*/ /* 0-19. Testimonial Slider /*-----------------------------------------------------------------------------------*/ .az-testimonials-container .slides > li { display: none; } .az-testimonials-container { position: relative; } .az-testimonial-quote:before { content: "“"; } .az-testimonial-quote:after { content: "”"; } .az-testimonial-quote { font-size: 20px; font-style: italic; line-height: 1.6em; margin: 0 auto 30px; text-align: center; width: 80%; } .az-testimonial-source { display: block; margin-bottom: 30px; font-size: 16px; font-weight: 400; text-align: center; text-transform: uppercase; } .az-testimonials-container .flex-control-nav { display: block; margin: 0 auto !important; position: relative; text-align: center; width: auto; } .az-testimonials-container .flex-control-nav li { display: inline-block; margin: 0 5px; text-indent: -9999px; } .az-testimonials-container .flex-control-nav li a { background: transparent; border: 2px solid #818B92; -webkit-border-radius: 999px; -moz-border-radius: 999px; border-radius: 999px; cursor: pointer; display: block; height: 16px; width: 16px; text-indent: -999em; -webkit-transition: background 0.15s ease-in-out 0s; -moz-transition: background 0.15s ease-in-out 0s; -o-transition: background 0.15s ease-in-out 0s; transition: background 0.15s ease-in-out 0s; } .az-testimonials-container .flex-control-nav li a.flex-active, .az-testimonials-container .flex-caption, .az-testimonials-container .flex-control-nav li a:hover { background: #818B92; } .testimonial-builder.white .az-testimonials-container .flex-control-nav li a { border-color: #FFFFFF; } .testimonial-builder.white .az-testimonials-container .flex-control-nav li a.flex-active, .testimonial-builder.white .az-testimonials-container .flex-caption, .testimonial-builder.white .az-testimonials-container .flex-control-nav li a:hover { background: #FFFFFF; } /*-----------------------------------------------------------------------------------*/ /* 0-20. Social Share /*-----------------------------------------------------------------------------------*/ .az-social-share iframe { max-width: none; } .az-social-share .fb-like { width: 107px; } .az-social-share.single-post { border-bottom: 2px solid #EBEDEF; border-top: 2px solid #EBEDEF; margin-bottom: 70px; padding: 50px 0; } /*-----------------------------------------------------------------------------------*/ /* 0-21. Count Number /*-----------------------------------------------------------------------------------*/ .counter-number { margin: 30px 0; text-align: center; } .counter-number .number-field { font-size: 12px; font-weight: 400; margin-top: 5px; display: block; text-transform: uppercase; } .counter-number .number-value { color: #2D3C48; font-size: 60px; font-weight: 700; line-height: 60px; } .counter-number .count-number-icon { color: #F05253; font-size: 36px; margin-bottom: 25px; } /*-----------------------------------------------------------------------------------*/ /* 27. Animation Modules Settings /*-----------------------------------------------------------------------------------*/ .js .animated-content { opacity: 0; } .no-js .animated-content, .no-csstransitions .animated-content { opacity: 1; } .lt-ie9 .animated-content { opacity: 1; animation: none !important; transform: none !important; } /* Fade In */ .fade_in.animate { -webkit-animation: fadeIn 0.65s ease forwards; -moz-animation: fadeIn 0.65s ease forwards; animation: fadeIn 0.65s ease forwards; } @-webkit-keyframes fadeIn { to { opacity: 1; } } @-moz-keyframes fadeIn { to { opacity: 1; } } @keyframes fadeIn { to { opacity: 1; } } /* Move Left */ .move_left.animate { -webkit-transform: translateX(-200px); -moz-transform: translateX(-200px); transform: translateX(-200px); -webkit-animation: moveLeft 0.65s ease forwards; -moz-animation: moveLeft 0.65s ease forwards; animation: moveLeft 0.65s ease forwards; } @-webkit-keyframes moveLeft { to { -webkit-transform: translateX(0); opacity: 1; } } @-moz-keyframes moveLeft { to { -moz-transform: translateX(0); opacity: 1; } } @keyframes moveLeft { to { transform: translateX(0); opacity: 1; } } /* Move Right */ .move_right.animate { -webkit-transform: translateX(200px); -moz-transform: translateX(200px); transform: translateX(200px); -webkit-animation: moveLeft 0.65s ease forwards; -moz-animation: moveLeft 0.65s ease forwards; animation: moveLeft 0.65s ease forwards; } @-webkit-keyframes moveRight { to { -webkit-transform: translateX(0); opacity: 1; } } @-moz-keyframes moveRight { to { -moz-transform: translateX(0); opacity: 1; } } @keyframes moveRight { to { transform: translateX(0); opacity: 1; } } /* Move Up */ .move_up.animate { -webkit-transform: translateY(200px); -moz-transform: translateY(200px); transform: translateY(200px); -webkit-animation: moveUp 0.65s ease forwards; -moz-animation: moveUp 0.65s ease forwards; animation: moveUp 0.65s ease forwards; } @-webkit-keyframes moveUp { to { -webkit-transform: translateY(0); opacity: 1; } } @-moz-keyframes moveUp { to { -moz-transform: translateY(0); opacity: 1; } } @keyframes moveUp { to { transform: translateY(0); opacity: 1; } } /* Scale Up */ .scale_up.animate { -webkit-transform: scale(0.6); -moz-transform: scale(0.6); transform: scale(0.6); -webkit-animation: scaleUp 0.65s ease-in-out forwards; -moz-animation: scaleUp 0.65s ease-in-out forwards; animation: scaleUp 0.65s ease-in-out forwards; } @-webkit-keyframes scaleUp { to { -webkit-transform: scale(1); opacity: 1; } } @-moz-keyframes scaleUp { to { -moz-transform: scale(1); opacity: 1; } } @keyframes scaleUp { to { transform: scale(1); opacity: 1; } } /* Little Bounce */ .little_bounce.animate { -webkit-transform: scale(0.4); -moz-transform: scale(0.4); transform: scale(0.4); -webkit-animation: popUp .8s ease-in forwards; -moz-animation: popUp .8s ease-in forwards; animation: popUp .8s ease-in forwards; } @-webkit-keyframes popUp { 70% { -webkit-transform: scale(1.1); opacity: .8; -webkit-animation-timing-function: ease-out; } 100% { -webkit-transform: scale(1); opacity: 1; } } @-moz-keyframes popUp { 70% { -moz-transform: scale(1.1); opacity: .8; -moz-animation-timing-function: ease-out; } 100% { -moz-transform: scale(1); opacity: 1; } } @keyframes popUp { 70% { transform: scale(1.1); opacity: .8; animation-timing-function: ease-out; } 100% { transform: scale(1); opacity: 1; } } /*-----------------------------------------------------------------------------------*/ /* 28. Font Icons /*-----------------------------------------------------------------------------------*/ @font-face { font-family: 'Icons'; src:url('_include/css/fonts/Icons.eot'); src:url('_include/css/fonts/Icons.eot?#iefix') format('embedded-opentype'), url('_include/css/fonts/Icons.woff') format('woff'), url('_include/css/fonts/Icons.ttf') format('truetype'), url('_include/css/fonts/Icons.svg#Icons') format('svg'); font-weight: normal; font-style: normal; } /* Use the following CSS code if you want to use data attributes for inserting your icons */ [data-icon]:before { font-family: 'Icons'; content: attr(data-icon); speak: none; font-weight: normal; font-variant: normal; text-transform: none; line-height: 1; -webkit-font-smoothing: antialiased; } [class^="font-"]:before, [class*=" font-"]:before { font-family: 'Icons'; speak: none; font-style: normal; font-weight: normal; font-variant: normal; text-transform: none; -webkit-font-smoothing: antialiased; } [class^="font-"], [class*=" font-"]{ display:inline-block; line-height:1em; } /* Use the following CSS code if you want to have a class per icon */ /* Instead of a list of all class selectors, you can use the generic selector below, but it's slower: [class*="font-icon-"] { */ .font-icon-phone, .font-icon-mobile, .font-icon-mouse, .font-icon-directions, .font-icon-mail, .font-icon-paperplane, .font-icon-pencil, .font-icon-feather, .font-icon-paperclip, .font-icon-drawer, .font-icon-reply, .font-icon-reply-all, .font-icon-forward, .font-icon-user, .font-icon-users, .font-icon-user-add, .font-icon-vcard, .font-icon-export, .font-icon-location, .font-icon-map, .font-icon-compass, .font-icon-location-2, .font-icon-target, .font-icon-share, .font-icon-sharable, .font-icon-heart, .font-icon-heart-2, .font-icon-star, .font-icon-star-2, .font-icon-thumbs-up, .font-icon-thumbs-down, .font-icon-chat, .font-icon-comment, .font-icon-quote, .font-icon-house, .font-icon-popup, .font-icon-search, .font-icon-flashlight, .font-icon-printer, .font-icon-bell, .font-icon-link, .font-icon-flag, .font-icon-cog, .font-icon-tools, .font-icon-trophy, .font-icon-tag, .font-icon-camera, .font-icon-megaphone, .font-icon-moon, .font-icon-palette, .font-icon-leaf, .font-icon-music, .font-icon-music-2, .font-icon-new, .font-icon-graduation, .font-icon-book, .font-icon-newspaper, .font-icon-bag, .font-icon-airplane, .font-icon-lifebuoy, .font-icon-eye, .font-icon-clock, .font-icon-microphone, .font-icon-calendar, .font-icon-bolt, .font-icon-thunder, .font-icon-droplet, .font-icon-cd, .font-icon-briefcase, .font-icon-air, .font-icon-hourglass, .font-icon-gauge, .font-icon-language, .font-icon-network, .font-icon-key, .font-icon-battery, .font-icon-bucket, .font-icon-magnet, .font-icon-drive, .font-icon-cup, .font-icon-rocket, .font-icon-brush, .font-icon-suitcase, .font-icon-cone, .font-icon-earth, .font-icon-keyboard, .font-icon-browser, .font-icon-publish, .font-icon-progress-3, .font-icon-progress-2, .font-icon-brogress-1, .font-icon-progress-0, .font-icon-sun, .font-icon-sun-2, .font-icon-adjust, .font-icon-code, .font-icon-screen, .font-icon-light-bulb, .font-icon-credit-card, .font-icon-database, .font-icon-voicemail, .font-icon-clipboard, .font-icon-cart, .font-icon-box, .font-icon-ticket, .font-icon-rss, .font-icon-signal, .font-icon-thermometer, .font-icon-droplets, .font-icon-layout-3, .font-icon-statistics, .font-icon-pie, .font-icon-bars, .font-icon-graph, .font-icon-lock, .font-icon-lock-open, .font-icon-logout, .font-icon-login, .font-icon-checkmark, .font-icon-cross, .font-icon-minus, .font-icon-plus, .font-icon-cross-2, .font-icon-minus-2, .font-icon-plus-2, .font-icon-cross-3, .font-icon-minus-3, .font-icon-plus-3, .font-icon-erase, .font-icon-blocked, .font-icon-info, .font-icon-info-2, .font-icon-question, .font-icon-help, .font-icon-warning, .font-icon-cycle, .font-icon-cw, .font-icon-ccw, .font-icon-shuffle, .font-icon-arrow, .font-icon-arrow-2, .font-icon-retweet, .font-icon-loop, .font-icon-history, .font-icon-back, .font-icon-switch, .font-icon-list, .font-icon-add-to-list, .font-icon-layout, .font-icon-list-2, .font-icon-text, .font-icon-text-2, .font-icon-document, .font-icon-docs, .font-icon-landscape, .font-icon-pictures, .font-icon-video, .font-icon-music-3, .font-icon-folder, .font-icon-archive, .font-icon-trash, .font-icon-upload, .font-icon-download, .font-icon-disk, .font-icon-install, .font-icon-cloud, .font-icon-upload-2, .font-icon-bookmark, .font-icon-bookmarks, .font-icon-book-2, .font-icon-play, .font-icon-pause, .font-icon-record, .font-icon-stop, .font-icon-next, .font-icon-previous, .font-icon-first, .font-icon-last, .font-icon-resize-enlarge, .font-icon-resize-shrink, .font-icon-volume, .font-icon-sound, .font-icon-mute, .font-icon-flow-cascade, .font-icon-flow-branch, .font-icon-flow-tree, .font-icon-flow-line, .font-icon-flow-parallel, .font-icon-arrow-left-big-flat, .font-icon-arrow-down-big-flat, .font-icon-arrow-up-big-flat, .font-icon-arrow-right-big-flat, .font-icon-arrow-left-small-flat, .font-icon-arrow-down-small-flat, .font-icon-arrow-up-small-flat, .font-icon-arrow-right-small-flat, .font-icon-arrow-left-circle, .font-icon-arrow-down-circle, .font-icon-arrow-up-circle, .font-icon-arrow-right-circle, .font-icon-arrow-left-triangle, .font-icon-arrow-down-triangle, .font-icon-arrow-up-triangle, .font-icon-arrow-right-triangle, .font-icon-arrow-left-simple-round, .font-icon-arrow-down-simple-round, .font-icon-arrow-up-simple-round, .font-icon-arrow-right-simple-round, .font-icon-arrow-left-simple-thin-round, .font-icon-arrow-down-simple-thin-round, .font-icon-arrow-up-simple-thin-round, .font-icon-arrow-right-simple-thin-round, .font-icon-arrow-left-simple-thin, .font-icon-arrow-down-simple-thin, .font-icon-arrow-up-simple-thin, .font-icon-arrow-right-simple-thin, .font-icon-arrow-left-big, .font-icon-arrow-down-big, .font-icon-arrow-up-big, .font-icon-arrow-right-big, .font-icon-arrow-menu, .font-icon-ellipsis, .font-icon-dots, .font-icon-dot, .font-icon-social-zerply, .font-icon-social-youtube, .font-icon-social-yelp, .font-icon-social-yahoo, .font-icon-social-wordpress, .font-icon-social-virb, .font-icon-social-vimeo, .font-icon-social-viddler, .font-icon-social-twitter, .font-icon-social-tumblr, .font-icon-social-stumbleupon, .font-icon-social-soundcloud, .font-icon-social-skype, .font-icon-social-share-this, .font-icon-social-quora, .font-icon-social-photobucket, .font-icon-social-paypal, .font-icon-social-myspace, .font-icon-social-linkedin, .font-icon-social-last-fm, .font-icon-social-instagram, .font-icon-social-grooveshark, .font-icon-social-google-plus, .font-icon-social-github, .font-icon-social-forrst, .font-icon-social-flickr, .font-icon-social-facebook, .font-icon-social-evernote, .font-icon-social-envato, .font-icon-social-email, .font-icon-social-dribbble, .font-icon-social-digg, .font-icon-social-deviant-art, .font-icon-social-blogger, .font-icon-social-behance, .font-icon-social-bebo, .font-icon-social-addthis, .font-icon-social-500px, .font-icon-social-pinterest, .font-icon-align-right, .font-icon-align-left, .font-icon-align-justify, .font-icon-align-center, .font-icon-group, .font-icon-grid, .font-icon-grid-large { font-family: 'Icons'; speak: none; font-style: normal; font-weight: normal; font-variant: normal; text-transform: none; line-height: 1; -webkit-font-smoothing: antialiased; } .font-icon-phone:before { content: "\e0f3"; } .font-icon-mobile:before { content: "\e0f4"; } .font-icon-mouse:before { content: "\e0f5"; } .font-icon-directions:before { content: "\e0f6"; } .font-icon-mail:before { content: "\e0f7"; } .font-icon-paperplane:before { content: "\e0f8"; } .font-icon-pencil:before { content: "\e0f9"; } .font-icon-feather:before { content: "\e0fa"; } .font-icon-paperclip:before { content: "\e0fb"; } .font-icon-drawer:before { content: "\e0fc"; } .font-icon-reply:before { content: "\e0fd"; } .font-icon-reply-all:before { content: "\e0fe"; } .font-icon-forward:before { content: "\e0ff"; } .font-icon-user:before { content: "\e100"; } .font-icon-users:before { content: "\e101"; } .font-icon-user-add:before { content: "\e102"; } .font-icon-vcard:before { content: "\e103"; } .font-icon-export:before { content: "\e104"; } .font-icon-location:before { content: "\e105"; } .font-icon-map:before { content: "\e106"; } .font-icon-compass:before { content: "\e107"; } .font-icon-location-2:before { content: "\e108"; } .font-icon-target:before { content: "\e109"; } .font-icon-share:before { content: "\e10a"; } .font-icon-sharable:before { content: "\e10b"; } .font-icon-heart:before { content: "\e10c"; } .font-icon-heart-2:before { content: "\e10d"; } .font-icon-star:before { content: "\e10e"; } .font-icon-star-2:before { content: "\e10f"; } .font-icon-thumbs-up:before { content: "\e110"; } .font-icon-thumbs-down:before { content: "\e111"; } .font-icon-chat:before { content: "\e112"; } .font-icon-comment:before { content: "\e113"; } .font-icon-quote:before { content: "\e114"; } .font-icon-house:before { content: "\e115"; } .font-icon-popup:before { content: "\e116"; } .font-icon-search:before { content: "\e117"; } .font-icon-flashlight:before { content: "\e118"; } .font-icon-printer:before { content: "\e119"; } .font-icon-bell:before { content: "\e11a"; } .font-icon-link:before { content: "\e11b"; } .font-icon-flag:before { content: "\e11c"; } .font-icon-cog:before { content: "\e11d"; } .font-icon-tools:before { content: "\e11e"; } .font-icon-trophy:before { content: "\e11f"; } .font-icon-tag:before { content: "\e120"; } .font-icon-camera:before { content: "\e121"; } .font-icon-megaphone:before { content: "\e122"; } .font-icon-moon:before { content: "\e123"; } .font-icon-palette:before { content: "\e124"; } .font-icon-leaf:before { content: "\e125"; } .font-icon-music:before { content: "\e126"; } .font-icon-music-2:before { content: "\e127"; } .font-icon-new:before { content: "\e128"; } .font-icon-graduation:before { content: "\e129"; } .font-icon-book:before { content: "\e12a"; } .font-icon-newspaper:before { content: "\e12b"; } .font-icon-bag:before { content: "\e12c"; } .font-icon-airplane:before { content: "\e12d"; } .font-icon-lifebuoy:before { content: "\e12e"; } .font-icon-eye:before { content: "\e12f"; } .font-icon-clock:before { content: "\e130"; } .font-icon-microphone:before { content: "\e131"; } .font-icon-calendar:before { content: "\e132"; } .font-icon-bolt:before { content: "\e133"; } .font-icon-thunder:before { content: "\e134"; } .font-icon-droplet:before { content: "\e135"; } .font-icon-cd:before { content: "\e136"; } .font-icon-briefcase:before { content: "\e137"; } .font-icon-air:before { content: "\e138"; } .font-icon-hourglass:before { content: "\e139"; } .font-icon-gauge:before { content: "\e13a"; } .font-icon-language:before { content: "\e13b"; } .font-icon-network:before { content: "\e13c"; } .font-icon-key:before { content: "\e13d"; } .font-icon-battery:before { content: "\e13e"; } .font-icon-bucket:before { content: "\e13f"; } .font-icon-magnet:before { content: "\e140"; } .font-icon-drive:before { content: "\e141"; } .font-icon-cup:before { content: "\e142"; } .font-icon-rocket:before { content: "\e143"; } .font-icon-brush:before { content: "\e144"; } .font-icon-suitcase:before { content: "\e145"; } .font-icon-cone:before { content: "\e146"; } .font-icon-earth:before { content: "\e147"; } .font-icon-keyboard:before { content: "\e148"; } .font-icon-browser:before { content: "\e149"; } .font-icon-publish:before { content: "\e14a"; } .font-icon-progress-3:before { content: "\e14b"; } .font-icon-progress-2:before { content: "\e14c"; } .font-icon-brogress-1:before { content: "\e14d"; } .font-icon-progress-0:before { content: "\e14e"; } .font-icon-sun:before { content: "\e14f"; } .font-icon-sun-2:before { content: "\e150"; } .font-icon-adjust:before { content: "\e151"; } .font-icon-code:before { content: "\e152"; } .font-icon-screen:before { content: "\e153"; } .font-icon-light-bulb:before { content: "\e155"; } .font-icon-credit-card:before { content: "\e156"; } .font-icon-database:before { content: "\e157"; } .font-icon-voicemail:before { content: "\e158"; } .font-icon-clipboard:before { content: "\e159"; } .font-icon-cart:before { content: "\e15a"; } .font-icon-box:before { content: "\e15b"; } .font-icon-ticket:before { content: "\e15c"; } .font-icon-rss:before { content: "\e15d"; } .font-icon-signal:before { content: "\e15e"; } .font-icon-thermometer:before { content: "\e15f"; } .font-icon-droplets:before { content: "\e160"; } .font-icon-layout-3:before { content: "\e161"; } .font-icon-statistics:before { content: "\e162"; } .font-icon-pie:before { content: "\e163"; } .font-icon-bars:before { content: "\e164"; } .font-icon-graph:before { content: "\e165"; } .font-icon-lock:before { content: "\e166"; } .font-icon-lock-open:before { content: "\e167"; } .font-icon-logout:before { content: "\e168"; } .font-icon-login:before { content: "\e169"; } .font-icon-checkmark:before { content: "\e16a"; } .font-icon-cross:before { content: "\e16b"; } .font-icon-minus:before { content: "\e16c"; } .font-icon-plus:before { content: "\e16d"; } .font-icon-cross-2:before { content: "\e16e"; } .font-icon-minus-2:before { content: "\e16f"; } .font-icon-plus-2:before { content: "\e170"; } .font-icon-cross-3:before { content: "\e171"; } .font-icon-minus-3:before { content: "\e172"; } .font-icon-plus-3:before { content: "\e173"; } .font-icon-erase:before { content: "\e174"; } .font-icon-blocked:before { content: "\e175"; } .font-icon-info:before { content: "\e176"; } .font-icon-info-2:before { content: "\e177"; } .font-icon-question:before { content: "\e178"; } .font-icon-help:before { content: "\e179"; } .font-icon-warning:before { content: "\e17a"; } .font-icon-cycle:before { content: "\e17b"; } .font-icon-cw:before { content: "\e17c"; } .font-icon-ccw:before { content: "\e17d"; } .font-icon-shuffle:before { content: "\e17e"; } .font-icon-arrow:before { content: "\e17f"; } .font-icon-arrow-2:before { content: "\e180"; } .font-icon-retweet:before { content: "\e181"; } .font-icon-loop:before { content: "\e182"; } .font-icon-history:before { content: "\e183"; } .font-icon-back:before { content: "\e184"; } .font-icon-switch:before { content: "\e185"; } .font-icon-list:before { content: "\e186"; } .font-icon-add-to-list:before { content: "\e187"; } .font-icon-layout:before { content: "\e188"; } .font-icon-list-2:before { content: "\e189"; } .font-icon-text:before { content: "\e18a"; } .font-icon-text-2:before { content: "\e18b"; } .font-icon-document:before { content: "\e18c"; } .font-icon-docs:before { content: "\e18d"; } .font-icon-landscape:before { content: "\e18e"; } .font-icon-pictures:before { content: "\e18f"; } .font-icon-video:before { content: "\e190"; } .font-icon-music-3:before { content: "\e191"; } .font-icon-folder:before { content: "\e192"; } .font-icon-archive:before { content: "\e193"; } .font-icon-trash:before { content: "\e194"; } .font-icon-upload:before { content: "\e195"; } .font-icon-download:before { content: "\e196"; } .font-icon-disk:before { content: "\e197"; } .font-icon-install:before { content: "\e198"; } .font-icon-cloud:before { content: "\e199"; } .font-icon-upload-2:before { content: "\e19a"; } .font-icon-bookmark:before { content: "\e19b"; } .font-icon-bookmarks:before { content: "\e19c"; } .font-icon-book-2:before { content: "\e19d"; } .font-icon-play:before { content: "\e19e"; } .font-icon-pause:before { content: "\e19f"; } .font-icon-record:before { content: "\e1a0"; } .font-icon-stop:before { content: "\e1a1"; } .font-icon-next:before { content: "\e1a2"; } .font-icon-previous:before { content: "\e1a3"; } .font-icon-first:before { content: "\e1a4"; } .font-icon-last:before { content: "\e1a5"; } .font-icon-resize-enlarge:before { content: "\e1a6"; } .font-icon-resize-shrink:before { content: "\e1a7"; } .font-icon-volume:before { content: "\e1a8"; } .font-icon-sound:before { content: "\e1a9"; } .font-icon-mute:before { content: "\e1aa"; } .font-icon-flow-cascade:before { content: "\e1ab"; } .font-icon-flow-branch:before { content: "\e1ac"; } .font-icon-flow-tree:before { content: "\e1ad"; } .font-icon-flow-line:before { content: "\e1ae"; } .font-icon-flow-parallel:before { content: "\e1af"; } .font-icon-arrow-left-big-flat:before { content: "\e1b0"; } .font-icon-arrow-down-big-flat:before { content: "\e1b1"; } .font-icon-arrow-up-big-flat:before { content: "\e1b2"; } .font-icon-arrow-right-big-flat:before { content: "\e1b3"; } .font-icon-arrow-left-small-flat:before { content: "\e1b4"; } .font-icon-arrow-down-small-flat:before { content: "\e1b5"; } .font-icon-arrow-up-small-flat:before { content: "\e1b6"; } .font-icon-arrow-right-small-flat:before { content: "\e1b7"; } .font-icon-arrow-left-circle:before { content: "\e1b8"; } .font-icon-arrow-down-circle:before { content: "\e1b9"; } .font-icon-arrow-up-circle:before { content: "\e1ba"; } .font-icon-arrow-right-circle:before { content: "\e1bb"; } .font-icon-arrow-left-triangle:before { content: "\e1bc"; } .font-icon-arrow-down-triangle:before { content: "\e1bd"; } .font-icon-arrow-up-triangle:before { content: "\e1be"; } .font-icon-arrow-right-triangle:before { content: "\e1bf"; } .font-icon-arrow-left-simple-round:before { content: "\e1c0"; } .font-icon-arrow-down-simple-round:before { content: "\e1c1"; } .font-icon-arrow-up-simple-round:before { content: "\e1c2"; } .font-icon-arrow-right-simple-round:before { content: "\e1c3"; } .font-icon-arrow-left-simple-thin-round:before { content: "\e1c4"; } .font-icon-arrow-down-simple-thin-round:before { content: "\e1c5"; } .font-icon-arrow-up-simple-thin-round:before { content: "\e1c6"; } .font-icon-arrow-right-simple-thin-round:before { content: "\e1c7"; } .font-icon-arrow-left-simple-thin:before { content: "\e1c8"; } .font-icon-arrow-down-simple-thin:before { content: "\e1c9"; } .font-icon-arrow-up-simple-thin:before { content: "\e1ca"; } .font-icon-arrow-right-simple-thin:before { content: "\e1cb"; } .font-icon-arrow-left-big:before { content: "\e1cc"; } .font-icon-arrow-down-big:before { content: "\e1cd"; } .font-icon-arrow-up-big:before { content: "\e1ce"; } .font-icon-arrow-right-big:before { content: "\e1cf"; } .font-icon-arrow-menu:before { content: "\e1d0"; } .font-icon-ellipsis:before { content: "\e1d1"; } .font-icon-dots:before { content: "\e1d2"; } .font-icon-dot:before { content: "\e1d3"; } .font-icon-social-zerply:before { content: "\e01b"; } .font-icon-social-youtube:before { content: "\e017"; } .font-icon-social-yelp:before { content: "\e01d"; } .font-icon-social-yahoo:before { content: "\e01e"; } .font-icon-social-wordpress:before { content: "\e01f"; } .font-icon-social-virb:before { content: "\e020"; } .font-icon-social-vimeo:before { content: "\e021"; } .font-icon-social-viddler:before { content: "\e022"; } .font-icon-social-twitter:before { content: "\e023"; } .font-icon-social-tumblr:before { content: "\e024"; } .font-icon-social-stumbleupon:before { content: "\e025"; } .font-icon-social-soundcloud:before { content: "\e073"; } .font-icon-social-skype:before { content: "\e074"; } .font-icon-social-share-this:before { content: "\e075"; } .font-icon-social-quora:before { content: "\e076"; } .font-icon-social-photobucket:before { content: "\e078"; } .font-icon-social-paypal:before { content: "\e079"; } .font-icon-social-myspace:before { content: "\e026"; } .font-icon-social-linkedin:before { content: "\e027"; } .font-icon-social-last-fm:before { content: "\e028"; } .font-icon-social-instagram:before { content: "\e029"; } .font-icon-social-grooveshark:before { content: "\e02a"; } .font-icon-social-google-plus:before { content: "\e02b"; } .font-icon-social-github:before { content: "\e02c"; } .font-icon-social-forrst:before { content: "\e02d"; } .font-icon-social-flickr:before { content: "\e02e"; } .font-icon-social-facebook:before { content: "\e02f"; } .font-icon-social-evernote:before { content: "\e030"; } .font-icon-social-envato:before { content: "\e031"; } .font-icon-social-email:before { content: "\e032"; } .font-icon-social-dribbble:before { content: "\e033"; } .font-icon-social-digg:before { content: "\e034"; } .font-icon-social-deviant-art:before { content: "\e035"; } .font-icon-social-blogger:before { content: "\e036"; } .font-icon-social-behance:before { content: "\e037"; } .font-icon-social-bebo:before { content: "\e038"; } .font-icon-social-addthis:before { content: "\e07a"; } .font-icon-social-500px:before { content: "\e07b"; } .font-icon-social-pinterest:before { content: "\e077"; } .font-icon-align-right:before { content: "\e000"; } .font-icon-align-left:before { content: "\e001"; } .font-icon-align-justify:before { content: "\e002"; } .font-icon-align-center:before { content: "\e003"; } .font-icon-group:before { content: "\e004"; } .font-icon-grid:before { content: "\e005"; } .font-icon-grid-large:before { content: "\e006"; } /*-----------------------------------------------------------------------------------*/ /* 29. Flex Slider Settings /*-----------------------------------------------------------------------------------*/ /* 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 Necessary Styles *********************************/ .flexslider {margin: 0; padding: 0;max-height: 350px;overflow: hidden;} .flexslider .slides > li {display: none; -webkit-backface-visibility: hidden;} /* Hide the slides before the JS is loaded. Avoids image jumping */ .flexslider .slides img {width: 100%; display: block;} .flexslider .slides.round img {border-radius: 0;} .flex-pauseplay span {text-transform: capitalize;} /* 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%;} /* No JavaScript Fallback */ /* If you are not using another script, such as Modernizr, make sure you * include js that eliminates this class on page load */ .no-js .slides > li:first-child {display: block;} /* FlexSlider Default Theme *********************************/ .flexslider {position: relative; zoom: 1;} .flex-viewport {max-height: 2000px; -webkit-transition: all 1s ease; -moz-transition: all 1s ease; transition: all 1s ease;} .loading .flex-viewport {max-height: 300px;} .flexslider .slides {zoom: 1;} .loading {min-height:350px;margin:0 auto; background: url("../../images/loading.html") no-repeat center center;} .carousel li {margin-right: 5px} @media screen and (max-width: 860px) { .flex-direction-nav .flex-prev {opacity: 1; left: 0;} .flex-direction-nav .flex-next {opacity: 1; right: 0;} } /*-----------------------------------------------------------------------------------*/ /* 30. Media Queries /*-----------------------------------------------------------------------------------*/ @media (min-width: 1300px) and (max-width: 1599px) { .portfolio-full .item-project.col-full-1 { width: 20%; } } @media (min-width: 1200px) and (max-width: 1299px) { .portfolio-full .item-project.col-full-1, .portfolio-full .item-project.col-full-2 { width: 25%; } } @media (min-width: 992px) and (max-width: 1199px) { .wrap_all.boxed, .wrap_all.boxed .sticky-header { width: 90%; } .wrap_all.boxed .container { max-width: none; padding-left: 30px; padding-right: 30px; } .wrap_all.boxed .portfolio-full #portfolio-filter .col-md-12 { max-width: none; } #navigation-mobile { display: none !important; } .single-people.col-md-3, .single-people.col-md-4, .item-project.col-md-3, .item-project.col-md-4, .masonry-blog article.col-md-3, .masonry-blog article.col-md-4 { width: 33.3333%; } .portfolio-full .item-project.col-full-1, .portfolio-full .item-project.col-full-2, .portfolio-full .item-project.col-full-3, .portfolio-full .item-project.col-full-4 { width: 33.3333%; } .single-people.col-md-6, .item-project.col-md-6, .masonry-blog article.col-md-6 { width: 50%; } .portfolio-full .item-project.col-full-6 { width: 50%; } /* Portfolio Filter */ .portfolio-full #portfolio-filter .col-md-12 { max-width: 970px; } /* Map */ .map { height: 420px; } /* Navigation Team / Portfolio Single Post */ .post-type-navi { display: none; } .main-content-navi.team.mobile, .main-content-navi.portfolio.mobile { display: block; } } @media (min-width: 768px) and (max-width: 991px) { /* Boxed Layout */ .wrap_all.boxed { width: 90%; } .wrap_all.boxed .container { max-width: none; padding-left: 30px; padding-right: 30px; } .wrap_all.boxed .portfolio-full #portfolio-filter .col-md-12 { max-width: none; } /* Header */ header, header.sticky-header, header.sticky-header.nav-small { position: relative; height: 90px; } header.sticky-header, header.sticky-header.nav-small { padding: 0; -webkit-box-shadow: none; -moz-box-shadow: none; box-shadow: none; -webkit-transition: none; -moz-transition: none; -o-transition: none; transition: none; } header #logo a, header #menu ul a, header.sticky-header #logo a, header.sticky-header #menu ul a, header.sticky-header.nav-small #logo a, header.sticky-header.nav-small #menu ul a { line-height: 90px; padding-top: 0; padding-bottom: 0; } #main.sticky-header-enabled, .wrap_all.boxed #main.sticky-header-enabled { padding-top: 0; } header #logo a { font-size: 24px; } header #logo a img { margin-top: -8px; } header .col-md-3 { float: left; width: 80%; } header .col-md-9 { float: left; width: 20%; } #menu { display: none; } #mobile-nav { display: block; float: right; } /* Portfolio and Team Columns */ .single-people.col-md-3, .single-people.col-md-4, .single-people.col-md-6, .item-project.col-md-3, .item-project.col-md-4, .item-project.col-md-6, .masonry-blog article.col-md-3, .masonry-blog article.col-md-4, .masonry-blog article.col-md-6 { width: 50%; } .portfolio-full .item-project.col-full-1, .portfolio-full .item-project.col-full-2, .portfolio-full .item-project.col-full-3, .portfolio-full .item-project.col-full-4, .portfolio-full .item-project.col-full-6 { width: 50%; } /* Contact Form and Comment */ .wpcf7 input, .wpcf7 .wpcf7-submit, .wpcf7-form-control-wrap.budget, #searchform input[type="text"], .widget_search form input[type="text"] { width: 100%; } #commentform input { width: 100%; margin-right: 0; } #commentform label, #commentform span.required { top: 0; } #commentform #submit { width: 100%; } .children .comment { padding-left: 0; } #commentform p { margin-bottom: 15px; } #commentform .logged-in-as, #commentform .comment-form-url, #commentform .comment-form-comment { margin-bottom: 30px; } #commentform p.form-submit { margin: 0; } #commentform #submit { margin-bottom: 20px; } /* Sidebar */ .col-md-3 > #sidebar, .col-md-3 > .sidebar { border-top: 3px solid #EBEDEF; margin-top: 30px; padding-top: 50px; } .col-md-3 > .sidebar { margin-top: 50px; } .sidebar_content { margin-top: 0; } #blog .col-md-9.right_side { float: left; } #blog .col-md-9, #blog .col-md-3 { width: 100%; } /* Portfolio and Team Filter Dropdown */ #portfolio-filter .dropdown, #team-filter .dropdown { width: 100%; } .dropmenu, .dropmenu-active { width: 100%; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } #portfolio-filter.mobile-filter, #team-filter.mobile-filter { display: block; } #portfolio-filter.desktop-filter, #team-filter.desktop-filter { display: none; } .portfolio-full #portfolio-filter .col-md-12 { max-width: 750px; } /* Social Footer */ #social-footer { float: left; margin-top: 20px; } /* Map */ .map { height: 420px; } /* Back to Top */ #back-to-top { display: none !important; } /* Navigation Team / Portfolio Single Post */ .post-type-navi { display: none; } .main-content-navi.team.mobile, .main-content-navi.portfolio.mobile { display: block; } } @media (min-width: 481px) and (max-width: 767px) { /* Boxed Layout */ .wrap_all.boxed { width: 90%; } .wrap_all.boxed .container { padding-left: 30px; padding-right: 30px; } /* Header */ header, header.sticky-header, header.sticky-header.nav-small { position: relative; height: 90px; } header.sticky-header, header.sticky-header.nav-small { padding: 0; -webkit-box-shadow: none; -moz-box-shadow: none; box-shadow: none; -webkit-transition: none; -moz-transition: none; -o-transition: none; transition: none; } header #logo a, header #menu ul a, header.sticky-header #logo a, header.sticky-header #menu ul a, header.sticky-header.nav-small #logo a, header.sticky-header.nav-small #menu ul a { line-height: 90px; padding-top: 0; padding-bottom: 0; } #main.sticky-header-enabled, .wrap_all.boxed #main.sticky-header-enabled { padding-top: 0; } header #logo a { font-size: 24px; } header #logo a img { margin-top: -8px; } header .col-md-3 { float: left; width: 80%; } header .col-md-9 { float: left; width: 20%; } #menu { display: none; } #mobile-nav { display: block; float: right; } /* Portfolio and Team Columns */ .single-people.col-md-3, .single-people.col-md-4, .single-people.col-md-6, .item-project.col-md-3, .item-project.col-md-4, .item-project.col-md-6, .masonry-blog article.col-md-3, .masonry-blog article.col-md-4, .masonry-blog article.col-md-6 { width: 100%; } .portfolio-full .item-project.col-full-1, .portfolio-full .item-project.col-full-2, .portfolio-full .item-project.col-full-3, .portfolio-full .item-project.col-full-4, .portfolio-full .item-project.col-full-6 { width: 100%; } /* Contact Form and Comment */ .wpcf7 input, .wpcf7 .wpcf7-submit, .wpcf7-form-control-wrap.budget, #searchform input[type="text"], .widget_search form input[type="text"] { width: 100%; } #commentform input { width: 100%; margin-right: 0; } #commentform label, #commentform span.required { top: 0; } #commentform #submit { width: 100%; } .children .comment { padding-left: 0; } #commentform p { margin-bottom: 15px; } #commentform .logged-in-as, #commentform .comment-form-url, #commentform .comment-form-comment { margin-bottom: 30px; } #commentform p.form-submit { margin: 0; } #commentform #submit { margin-bottom: 20px; } /* Sidebar */ .col-md-3 > #sidebar, .col-md-3 > .sidebar { border-top: 3px solid #EBEDEF; margin-top: 30px; padding-top: 50px; } .col-md-3 > .sidebar { margin-top: 50px; } .sidebar_content { margin-top: 0; } #blog .col-md-9, #blog .col-md-3 { width: 100%; } /* Portfolio and Team Filter Dropdown */ #portfolio-filter .dropdown, #team-filter .dropdown { width: 100%; } .dropmenu, .dropmenu-active { width: 100%; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } #portfolio-filter.mobile-filter, #team-filter.mobile-filter { display: block; } #portfolio-filter.desktop-filter, #team-filter.desktop-filter { display: none; } /* Social Footer */ #social-footer { float: left; margin-top: 20px; } /* Map */ .map { height: 420px; } /* Section Title Page */ #title-page .pagize, #image-static .pagize { padding-top: 100px !important; padding-bottom: 100px !important; } #title-page h2, #image-static h2 { font-size: 40px; } #title-page .page-caption, #title-page .entry-meta.entry-header, #image-static .page-caption, #image-static .entry-meta.entry-header { font-size: 26px; } /* Back to Top */ #back-to-top { display: none !important; } /* Navigation Team / Portfolio Single Post */ .post-type-navi { display: none; } .main-content-navi.team.mobile, .main-content-navi.portfolio.mobile { display: block; } /* Error Page */ #error-page.error-404-image { padding: 220px 0; } /* Mobile Padding Class */ .mobile-padding { padding: 200px 0 !important; } /* Special Heading */ .special-heading > h1 { font-size: 36px; } } @media (max-width: 480px) { /* Boxed Layout */ .wrap_all.boxed { width: 90%; } .wrap_all.boxed .container { padding-left: 30px; padding-right: 30px; } /* Header */ header, header.sticky-header, header.sticky-header.nav-small { position: relative; height: 90px; } header.sticky-header, header.sticky-header.nav-small { padding: 0; -webkit-box-shadow: none; -moz-box-shadow: none; box-shadow: none; -webkit-transition: none; -moz-transition: none; -o-transition: none; transition: none; } header #logo a, header #menu ul a, header.sticky-header #logo a, header.sticky-header #menu ul a, header.sticky-header.nav-small #logo a, header.sticky-header.nav-small #menu ul a { line-height: 90px; padding-top: 0; padding-bottom: 0; } #main.sticky-header-enabled, .wrap_all.boxed #main.sticky-header-enabled { padding-top: 0; } header #logo a { font-size: 24px; } header #logo a img { margin-top: -8px; } header .col-md-3 { float: left; width: 80%; } header .col-md-9 { float: left; width: 20%; } #menu { display: none; } #mobile-nav { display: block; float: right; } /* Portfolio and Team Columns */ .single-people.col-md-3, .single-people.col-md-4, .single-people.col-md-6, .item-project.col-md-3, .item-project.col-md-4, .item-project.col-md-6, .masonry-blog article.col-md-3, .masonry-blog article.col-md-4, .masonry-blog article.col-md-6 { width: 100%; } .portfolio-full .item-project.col-full-1, .portfolio-full .item-project.col-full-2, .portfolio-full .item-project.col-full-3, .portfolio-full .item-project.col-full-4, .portfolio-full .item-project.col-full-6 { width: 100%; } /* Contact Form and Comment */ .wpcf7 input, .wpcf7 .wpcf7-submit, .wpcf7-form-control-wrap.budget, #searchform input[type="text"], .widget_search form input[type="text"] { width: 100%; } #commentform input { width: 100%; margin-right: 0; } #commentform label, #commentform span.required { top: 0; } #commentform #submit { width: 100%; } .comment-section { padding-left: 0; padding-right: 0; } .children .comment { padding-left: 0; } #commentform p { margin-bottom: 15px; } #commentform .logged-in-as, #commentform .comment-form-url, #commentform .comment-form-comment { margin-bottom: 30px; } #commentform p.form-submit { margin: 0; } #commentform #submit { margin-bottom: 20px; } .comment-side { display: none; } .comment .comment-cont { margin-left: 0; } /* Sidebar */ .col-md-3 > #sidebar, .col-md-3 > .sidebar { border-top: 3px solid #EBEDEF; margin-top: 30px; padding-top: 50px; } .col-md-3 > .sidebar { margin-top: 50px; } .sidebar_content { margin-top: 0; } #blog .col-md-9, #blog .col-md-3 { width: 100%; } /* Portfolio and Team Filter Dropdown */ #portfolio-filter .dropdown, #team-filter .dropdown { width: 100%; } .dropmenu, .dropmenu-active { width: 100%; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } #portfolio-filter.mobile-filter, #team-filter.mobile-filter { display: block; } #portfolio-filter.desktop-filter, #team-filter.desktop-filter { display: none; } /* Social Footer */ #social-footer { float: left; margin-top: 20px; } /* Map */ .map { height: 300px; } /* Section Title Page */ #title-page .pagize, #image-static .pagize { padding-top: 100px !important; padding-bottom: 100px !important; } #title-page h2, #image-static h2 { font-size: 36px; } #title-page .page-caption, #title-page .entry-meta.entry-header, #image-static .page-caption, #image-static .entry-meta.entry-header { font-size: 22px; } /* Testimonial */ .az-testimonial-quote { font-size: 18px; } .az-testimonial-source { font-size: 14px; } /* Back to Top */ #back-to-top { display: none !important; } /* Navigation Team / Portfolio Single Post */ .post-type-navi { display: none; } .main-content-navi.team.mobile, .main-content-navi.portfolio.mobile { display: block; } /* Error Page */ #error-page.error-404-image { padding: 150px 0; } /* Mobile Padding Class */ .mobile-padding { padding: 100px 0 !important; } /* Special Heading */ .special-heading > h1 { font-size: 36px; } /* FancyBox */ .fancybox-nav span { visibility: visible; } .fancybox-title { display: none; } } @media (max-width: 320px) { /* Boxed Layout */ .wrap_all.boxed { width: 100%; margin: 0; } .wrap_all.boxed .container { padding-left: 15px; padding-right: 15px; } .wrap_all.boxed #portfolio-filter.desktop-filter, .wrap_all.boxed #portfolio-filter.mobile-filter { padding-left: 0; padding-right: 0; } } /* iPad Portrait & Landscape */ @media only screen and (min-device-width : 768px) and (max-device-width : 1024px) { .fullimage-container { background-attachment: scroll !important; } #content .main-content.image-cont { background-attachment: scroll !important; } } /* iPhone 5 Portrait & Landscape */ @media only screen and (min-device-width : 320px) and (max-device-width : 568px) { .fullimage-container { background-attachment: scroll !important; } #content .main-content.image-cont { background-attachment: scroll !important; } } /* iPhone Portrait & Landscape */ @media only screen and (min-device-width : 320px) and (max-device-width : 480px) { .fullimage-container { background-attachment: scroll !important; } #content .main-content.image-cont { background-attachment: scroll !important; } } /* Retina Display */ @media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (-moz-min-device-pixel-ratio: 2), only screen and (-o-min-device-pixel-ratio: 2/1), only screen and (min-device-pixel-ratio: 2), only screen and (min-resolution: 2dppx) { header #logo a img.standard { display: none; } header #logo a img.retina { display: inline-block; } .menu-nav .menu-icon { background-image: url(../images/menu-mobile_@2x.png); background-size: 16px 32px; } .bootstrap-select.btn-group .custom-select .plus-select { background-image: url(../images/plus_select_@2x.png); background-size: 18px 36px; } .mejs-overlay-button { background-image: url(../images/bigplay_@2x.png); background-size: 32px 32px; } .mejs-controls .mejs-button button { background-image: url(../images/controls.png); background-size: 50px 64px; } } #projects li { position: relative; width: 340px; border: 1px solid gainsboro; margin: 0 36px 36px 0; -webkit-border-radius: 5px; -moz-border-radius: 5px; -ms-border-radius: 5px; -o-border-radius: 5px; border-radius: 5px; max-width: 100%; } #projects a.image_link img { width:340px; height:auto; -moz-border-radius-topleft: 5px; -webkit-border-top-left-radius: 5px; border-top-left-radius: 5px; -moz-border-radius-topright: 5px; -webkit-border-top-right-radius: 5px; border-top-right-radius: 5px; position: absolute; left: 0; top: 0; height: auto; width: 100%; } #projects a.image_link { display: block; height: 200px; width:340px; overflow: hidden; max-width: 100%; position: relative; } #projects .bio { padding: 0 22px; background-color: white; border-bottom: 4px solid #E6E6E6; height: 175px; overflow: hidden; font-size: 14px; color: #393838; line-height: normal; } #projects h2 { margin: 0; font-family: "Source Sans Pro",sans-serif; } #projects h2 a { color: #2D3C48; font-size: 18px; } #projects p { font-size: 13px; color: #818B92; padding: 0; margin: 0; } #projects .meta { padding: 18px 20px; min-height: 59px; background: #f2f2f2; } #projects .price { font-size: 13px; font-weight: 600; padding-top: 3px; margin-top: -2px; background-color: #B3B3B3; color: white; padding: 0 11px; float:right; -webkit-border-radius: 2px; -moz-border-radius: 2px; -ms-border-radius: 2px; -o-border-radius: 2px; border-radius: 2px; } #projects .free .price { background: #f0544f; } #projects .list_attributes span { display: inline-block; margin: 0 5px 5px 0; font-size: 13px; background: #FFF; color: rgb(102, 102, 102); padding: 5px 5px; -webkit-border-radius f0544f: 2px; -moz-border-radius: 2px; -ms-border-radius: 2px; -o-border-radius: 2px; border-radius: 2px; line-height: normal; float: left; } #projects span.view { display: inline-block; margin: 0 5px 5px 0; font-size: 13px; color: rgb(102, 102, 102); line-height: normal; float: left; padding: 5px 0; } .counter_view_in_content { font-size: 18px; line-height: normal; display: block; margin-bottom: 20px; } .counter_view_in_content b { font-size: 20px; margin-right: 10px; } .social_share .mod { width: 90px; float: left; } body .tp-bannertimer { background: url(../images/timer.png); } .btn-vote-projet div, .btn-vote-projet span { display: inline-block; text-align: center; float: none; margin: 0; padding: 0; } .btn-vote-projet .gdt-size-20.gdthumb.gdup { display: none !important; } .btn-vote-projet .inactive { color: #CCCCCC; } .btn-vote-projet:hover .inactive { color: #FFF; } .social_share { background: #FFF; border: 1px solid #dce4e8; padding: 16px 8px 5px; margin-bottom: 15px; position: relative; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; text-align: center; } .body-user-logout .menu-btn-account, .body-user-login .menu-btn-login { display: none !important; } .flip-container { -webkit-perspective: 1000; -moz-perspective: 1000; perspective: 1000; -moz-transform: perspective(1000px); -moz-transform-style: preserve-3d; } .flip-container.can-hover:hover .flipper, .flip-container.hover .flipper, #flip-toggle.flip .flipper { -webkit-transform: rotateY(180deg); -moz-transform: rotateY(180deg); transform: rotateY(180deg); filter: FlipH; -ms-filter: "FlipH"; } .flip-container, .front, .back { } .flipper { -webkit-transition: 0.6s; -webkit-transform-style: preserve-3d; -moz-transition: 0.6s; -moz-transform: perspective(1000px); -moz-transform-style: preserve-3d; transition: 0.6s; transform-style: preserve-3d; position: relative; } .front, .back { -webkit-backface-visibility: hidden; -moz-backface-visibility: hidden; backface-visibility: hidden; -webkit-transition: 0.6s; -webkit-transform-style: preserve-3d; -moz-transition: 0.6s; -moz-transform-style: preserve-3d; -o-transition: 0.6s; -o-transform-style: preserve-3d; -ms-transition: 0.6s; -ms-transform-style: preserve-3d; transition: 0.6s; transform-style: preserve-3d; position: absolute; top: 0; left: 0; background: transparent; width: 100%; } .front { -webkit-transform: rotateY(0deg); z-index: 2; } .back { -webkit-transform: rotateY(180deg); -moz-transform: rotateY(180deg); transform: rotateY(180deg); } /* vertical */ .vertical.flip-container { position: relative; } .vertical .back { -webkit-transform: rotateX(180deg); -moz-transform: rotateX(180deg); transform: rotateX(180deg); } .vertical.flip-container .flipper { -webkit-transform-origin: 100% 213.5px; -moz-transform-origin: 100% 213.5px; transform-origin: 100% 213.5px; } .vertical.flip-container:hover .flipper { -webkit-transform: rotateX(-180deg); -moz-transform: rotateX(-180deg); transform: rotateX(-180deg); } #bloc-header-user p { margin: 0 0 0.4em; } .lwa-submit { } .lwa-password input, .lwa-username input, .lwa-email input, .lwa-remember-email input { height: 47px; border: 2px solid #ededed; -webkit-border-radius: 7px; -webkit-background-clip: padding-box; -moz-border-radius: 7px; -moz-background-clip: padding; border-radius: 7px; background-clip: padding-box; background-color: #f2f2f2; padding: 0 0 0 35px; -webkit-transition: .1s; -moz-transition: .1s; -o-transition: .1s; -ms-transition: .1s; transition: .1s; color: #8a8a8a; font-weight: 400; width: 100%; display: inline-block; } .lwa-password input:focus, .lwa-username input:focus, .lwa-email input:focus, .lwa-remember-email input:focus { border-color: #CCC; } .lwa .icon { position: absolute; left: 13px; top: 15px; font-size: 16px; } .warraper-for-input { position: relative; display: block; } .lwa-submit-links label { font-size: 12px; } #bloc-header-user { display: none; padding-top: 10px; } body .lwa-modal { z-index: 10001; }body .lwa-modal-bg { z-index: 10000; } body .lwa-loading { z-index: 2; } body #footer-credits p.copyright { text-align: left; } .large_bold_white { font-size: 98px; line-height: 60px; font-weight: 800; font-family: 'Open Sans'; color: #ffffff; text-decoration: none; background-color: transparent; border-width: 0px; border-color: #ffd658; border-style: none; } #counterdownload { font-size: 3em; color: #4c4c4c; font-weight: bold; font-family: 'Open Sans'; line-height: normal; text-transform: uppercase; } #counterdownload span { display: inline-block; vertical-align: middle; } #counterdownload i { display: inline-block; vertical-align: middle; background: url(images/mistouche.png) no-repeat; width: 143px; height: 62px; margin: 0 15px; } .wpcf7 input { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; width: 100%; } .cont_image_s_s_m { width:960px ; margin:auto} .cont_image_s_s_m img{ width:960px} .style_image_slider{ cursor:pointer}