/* * Anderson Onepage Retina Template V.1.0.2 * Copyright 2014, @bypixels @breecode * http://bypixels.com/themes/anderson * AUTHOR: Breecode // http://themeforest.net/user/breecode * DATE: 03/12/2014 * Find it only in Themeforest 1 - BASE 2 - PRELOADER 3 - TRANSITIONS 4 - HEADER & MAIN NAV - A) Logo 4 - HEADER & MAIN NAV B) Global 4 - HEADER & MAIN NAV - C)HEADER SOCIAL ICONS BACKGROUND 5 - WELCOME 6 - ABOUT US 7 - PAGE TITLE 8 - RESPONSIVE NAV 9 - REVOLUTION SLIDER & CUSTOM CAPTIONS 10 - VIDEO SLIDER 11 - SERVICES 12 - TEAM 13 - PROCESS 01 14 - RETINA ICONS 15 - SHORTCODES - A) Tabs 15 - SHORTCODES - B) Accordion & Triggers 16 - BLOG - A) Global 16 - BLOG - B) Blog Section 16 - BLOG - C) Blog Post 16 - BLOG - D) About the author 16 - BLOG - E) Comments 17 - BLOG SIDEBAR A) Global 17 - BLOG SIDEBAR B) Tag Cloud 17 - BLOG SIDEBAR C) Categories Widget 18 - PAGINATION 19 - TWITTER FEED 20 - PORTFOLIO A) Global 20 - PORTFOLIO B) two_columns Style 20 - PORTFOLIO C) four_columns Style 20 - PORTFOLIO D) Isotope 21 - FAQ 22 - PRICING TABLES 23 - CLIENTS 24 - FOOTER 25 - SKILLS 26 - BUTTONS 27 - ICONS 28 - TESTIMONIALS 29 - PARALLAX SECTIONS 30- ANIMATIONS 31 - MEDIA QUERIES */ /*================================================= 1 - SKINS COLORS: To change the color replace the Skin CSS. Available skins colors: blue.css gray.css green.css midnight.css orange.css purple.css red.css yellow.css =================================================*/ @import url("css/skins/blue.css"); /*================================================= 1 - BASE =================================================*/ body { font-family: 'Source Sans Pro', sans-serif; font-size:15px; color: #9c9c9c; line-height: 28px; } h1,h2,h3,h4,h5,h6 {color:#323232; font-weight: bold;line-height: 25px;} h1{font-size:22px;} h2{font-size:19px;} h3{font-size:18px;} h4{font-size:16px;} h5{font-size:14px;} h6{font-size:12px;} a {text-decoration: none!important;-moz-transition: .15s ease-in-out; -webkit-transition: .15s ease-in-out; -o-transition: .15s ease-in-out; -ms-transition: .15s ease-in-out; transition: .15s ease-in-out;} a {color: gray;} a:hover {text-decoration: none;} p {margin: 0 0 20px;} .clear {clear: both;} .center{text-align: center;} .bold {font-weight: bold;} .uppercase {text-transform: uppercase;} .divider_padding { padding-bottom: 140px; } .divider_padding.big { padding:60px 0px;} .container-fluid.nopadding {padding:0; margin: 0;} .divider_padding.small { padding:15px 0px;} blockquote { padding: 0 0 0 15px; margin: 0 0 20px; border-left: 5px solid #EEE; } img {max-width: 100%;} blockquote p { margin-bottom: 10px; font-size: 18px; font-weight: 300; line-height: 25px; } .right {float: right;} .left {float: left;} .section{/*padding:160px 0px;*/background-color: #FFFFFF;} .section.gray{background-color: #f3f3f3;} .section.nobottom {margin-bottom: 0; padding-bottom: 0;} .section.notop {margin-bottom: 0; padding-top: 0;} .hidden {display: none;} .loading_icon{ background: #000 url("images/preload.gif") no-repeat center center; height:60px; width:60px; position: fixed; top:50%; left:50%; margin-top:-30px; margin-left:-30px; display:none; z-index: 10000; -webkit-border-radius: 30px; -moz-border-radius: 30px; border-radius: 30px; behavior: url(css/PIE.htc); opacity: .25; } /*================================================= 2 - PRELOADER =================================================*/ #preloader { position:fixed; top:0; left:0; right:0; bottom:0; background-color:#fff; /* change if the mask should have another color than white */ z-index:999999; /* makes sure it stays on top */ } /** * #status { * width:400px; * height:400px; * position:absolute; * left:50%; * top:40%; * background-image:url(images/status.gif); * background-repeat:no-repeat; * background-position:center; * margin:-100px 0 0 -100px; * } */ #status { background-image: url("images/status.gif"); background-position: center center; background-repeat: no-repeat; height: 64px; left: 50%; margin-left: -32px; position: absolute; top: 40%; width: 64px; } /*================================================= 3 - TRANSITIONS =================================================*/ header { -moz-transition: .15s ease-in-out; -webkit-transition: .15s ease-in-out; -o-transition: .15s ease-in-out; -ms-transition: .15s ease-in-out; transition: .15s ease-in-out; } /*================================================= 4 - HEADER & MAIN NAV - A) Logo =================================================*/ #logo { margin-left: -83px; margin-top: 13px; width: 150px; } #logo_dark {display: none;float: left;margin-top: 25px;} /*================================================= 4 - HEADER & MAIN NAV B) Global =================================================*/ header.small {height: 60px;} header { position:fixed; width: 100%; z-index: 999; top: 0; height: 78px; /* border-bottom: 1px solid rgb(105, 105, 105); The Fallback border-bottom: 1px solid rgba(255, 255, 255, .15);*/ -webkit-background-clip: padding-box; /* for Safari */ background-clip: padding-box; /* for IE9+, Firefox 4+, Opera, Chrome */ } .main_nav {float: right; margin-top: 28px; } .main_nav li { float: left; text-transform: uppercase; font-size:13px; margin-right:38px; font-weight: bolder; z-index: 1; list-style: none; position: relative; float: left; display: inline; } .main_nav li a {color:#B8B8B8;} .main_nav li.active a, .main_nav li a:hover {color:white;} /* SOCIAL NAV */ .social_nav i {color:white;} .social_nav { float: right;margin-right: -15px;} .social_nav li {float: left; } .social_nav li i { padding:28px; border-left: 1px solid rgb(105, 105, 105); /* The Fallback */ border-left: 1px solid rgba(255, 255, 255, .15); -webkit-background-clip: padding-box; /* for Safari */ background-clip: padding-box; /* for IE9+, Firefox 4+, Opera, Chrome */ } .social_nav .fa-2x {font-size: 1.5em!important;} /*================================================= 4 - HEADER & MAIN NAV - C)HEADER SOCIAL ICONS BACKGROUND =================================================*/ header.small li.twitter_header_icon:hover {background: #32ccfe;} header.small li.facebook_header_icon:hover {background: #3b5999;} header.small li.wordpress_header_icon:hover{background: #37b1eb} header.small li.tumblr_header_icon:hover {background: #31506d;} header.small li.soundcloud_header_icon:hover {background: #ff4e1e;} header.small li.youtube_header_icon:hover {background: #ff2825;} header.small li.linkedin_header_icon:hover {background: #008ed3;} header.small li.lastfm_header_icon:hover {background: #ff001e;} header.small li.foursquare_header_icon:hover {background: #ff2645;} header.small li.dribbble_header_icon:hover {background: #ff3482;} header.small li.behance_header_icon:hover {background: #131313;} header.small li.deviantart_header_icon:hover {background: #4fb64a;} header.small li.flickr_header_icon:hover {background: #ed1384;} header.small li.pinterest_header_icon:hover {background: #e51e25;} header.small li.vine_header_icon:hover {background: #19b284;} header.small li.digg_header_icon:hover {background: #3651a3;} /* White color for Font-Awesome icons when they are hover over in the header under white state */ header.white .social_nav li:hover i, header.small.transparent_menu .social_nav li:hover i, header.white_menu .social_nav li i, .dark_menu.small .social_nav li:hover i, .transparent_dark_menu.small .social_nav li:hover i {color:white;} /* HEADER SMALL */ header.small .main_nav {margin-top: 18px;} .small #logo_dark { display: block; margin-top:15px; width: 130px} header.small .social_nav li i {padding: 20px;} /* HEADER STYLE 01: TRANSPARENT TO WHITE */ .transparent_menu li a {color:#dbdbdb;} .transparent_menu .social_nav li:hover i {color: #161616;} .transparent_menu .social_nav li:hover {background: white;} header.small.transparent_menu {background-color: rgba(255,255,255, 1); border-bottom: 1px solid #F5F5F5;} header.small.transparent_menu .social_nav i {color:#AFAFAF;} header.small.transparent_menu li a {color: #B8B8B8;} header.small.transparent_menu .social_nav .menu_trigger i {color:white;} header.small.transparent_menu .main_nav li.active a, header.small.transparent_menu .main_nav li a:hover {color:#3c3c3c;} /* HEADER STYLE 02: TRANSPARENT TO DARK */ header.small.transparent_menu.dark {background-color: #232323;border-bottom: 1px solid rgb(46, 46, 46);} header.small.transparent_menu.dark .social_nav li i {border-left: 1px solid rgb(46,46,46);} header.small.transparent_menu.dark .main_nav li.active a, header.small.transparent_menu.dark .main_nav li a:hover {color:white;} /* HEADER STYLE 03: WHITE */ header.white_menu { background-color: rgba(255,255,255, 1); border-bottom: 1px solid #F5F5F5;} header.white_menu .main_nav li a { color:#AFAFAF;} header.white_menu .main_nav li.active a, header.white_menu .main_nav li a:hover {color:#3c3c3c;} header.white_menu .social_nav i {color:#AFAFAF;} header.white_menu li.twitter_header_icon {background: #32ccfe;} header.white_menu li.facebook_header_icon {background: #3b5999;} header.white_menu li.wordpress_header_icon {background: #37b1eb;} header.white_menu li.tumblr_header_icon {background: #31506d;} header.white_menu li.soundcloud_header_icon {background: #ff4e1e;} header.white_menu li.youtube_header_icon {background: #ff2825;} header.white_menu li.linkedin_header_icon {background: #008ed3;} header.white_menu li.lastfm_header_icon {background: #ff001e;} header.white_menu li.foursquare_header_icon {background: #ff2645;} header.white_menu li.dribbble_header_icon {background: #ff3482;} header.white_menu li.behance_header_icon {background: #131313;} header.white_menu li.deviantart_header_icon {background: #4fb64a;} header.white_menu li.flickr_header_icon {background: #ed1384;} header.white_menu li.pinterest_header_icon {background: #e51e25;} header.white_menu li.vine_header_icon {background: #19b284;} header.white_menu li.digg_header_icon {background: #3651a3;} /* HEADER STYLE 04: TRANSPARENT DARK */ .transparent_dark_menu {background-color: rgba(0, 0, 0, 0.5);border-bottom: 1px solid rgba(32, 32, 32, 0.5);} .transparent_dark_menu .social_nav li:hover i {color: #161616;} .transparent_dark_menu .social_nav li:hover {background: white;} /* HEADER STYLE 05: DARK */ .dark_menu {background-color: #232323;border-bottom: 1px solid rgb(46, 46, 46);} .dark_menu .social_nav li i {border-left: 1px solid rgb(46,46,46);} header.white.dark_menu {background-color: #232323;border-bottom: 1px solid rgb(46, 46, 46);} header.white.dark_menu .main_nav li.active a, header.white.dark_menu .main_nav li a:hover {color:white;} .dark_menu .social_nav li:hover i {color: #161616;} .dark_menu .social_nav li:hover {background: white;} /* HEADER STYLE 06: TRANSPARENT DARK TO SOLID WHITE */ header.small.transparent_dark_menu.white {background-color: rgba(255,255,255, 1); border-bottom: 1px solid #F5F5F5;} header.small.transparent_dark_menu.white .social_nav i {color:#AFAFAF;} header.small.transparent_dark_menu.white .main_nav li.active a, header.small.transparent_dark_menu.white .main_nav li a:hover {color:#3c3c3c;} header.transparent_dark_menu .social_nav li a:hover i {color:#3c3c3c;} /* HEADER STYLE 07: TRANSPARENT DARK TO SOLID DARK */ .small.transparent_dark_menu .social_nav li:hover i {color: white;} header.small.transparent_dark_menu.dark {background-color: #232323;border-bottom: 1px solid rgb(46, 46, 46);} header.small.transparent_dark_menu.dark .social_nav li i {border-left: 1px solid rgb(46,46,46);} header.small.transparent_dark_menu.dark .main_nav li.active a, header.small.transparent_dark_menu.dark .main_nav li a:hover {color:white;} /* HEADER STYLE 08: CENTER TRANSPARENT TO SOLID WHITE */ .center_style #logo, .center_style #logo_dark {text-align: center; float: none; margin: 0 auto; width: 160px; } .center_style #logo {padding-top: 24px;} .center_style #logo_dark {padding-top: 14px;} .center_style .main_nav {float: left;} .center_style.small.white {background-color: rgba(255,255,255, 1); border-bottom: 1px solid #F5F5F5;} .center_style.small.white .social_nav i {color:#AFAFAF;} .center_style.small.white .main_nav li.active a, .center_style.small.white .main_nav li a:hover {color:#3c3c3c;} .center_style.white.small .social_nav li:hover i {color: white;} .center_style.white .social_nav li:hover i {color: #161616;} .center_style .social_nav li:hover {background: white;} header.center_style.white_menu li.twitter_header_icon:hover {background: #32ccfe;} header.center_style.white_menu li.facebook_header_icon:hover {background: #3b5999;} header.center_style.white_menu li.wordpress_header_icon {background: #37b1eb;} header.center_style.white_menu li.tumblr_header_icon {background: #31506d;} header.center_style.white_menu li.soundcloud_header_icon {background: #ff4e1e;} header.center_style.white_menu li.youtube_header_icon {background: #ff2825;} header.center_style.white_menu li.linkedin_header_icon {background: #008ed3;} header.center_style.white_menu li.lastfm_header_icon {background: #ff001e;} header.center_style.white_menu li.foursquare_header_icon {background: #ff2645;} header.center_style.white_menu li.dribbble_header_icon {background: #ff3482;} header.center_style.white_menu li.behance_header_icon {background: #131313;} header.center_style.white_menu li.deviantart_header_icon {background: #4fb64a;} header.center_style.white_menu li.flickr_header_icon {background: #ed1384;} header.center_style.white_menu li.pinterest_header_icon {background: #e51e25;} header.center_style.white_menu li.vine_header_icon {background: #19b284;} header.center_style.white_menu li.digg_header_icon {background: #3651a3;} /* HEADER STYLE 09: CENTER TRANSPARENT TO SOLID DARK */ .center_style.small.dark {background-color: #232323;border-bottom: 1px solid rgb(46, 46, 46);} .center_style.small.dark .social_nav i {border-left: 1px solid rgb(46,46,46);} .center_style.small.dark .main_nav li.active a, .center_style.small.dark .main_nav li a:hover {color:white;} header.center_style.dark .social_nav li:hover i {color: #161616;} header.center_style.dark.small .social_nav li:hover i {color:white;} /* HEADER STYLE 10: CENTER DARK */ /****** There is no needed styles for this combination ******/ /* Combine .center_style with .dark_menu */ /* HEADER STYLE 11: CENTER WHITE */ /****** There is no needed styles for this combination ******/ /* Combine .center_style with .white_menu */ /*================================================= 5 - WELCOME =================================================*/ #welcome {background-color: #F7F7F7; font-size: 24px; font-weight: lighter; text-align: center; line-height: 40px; padding:100px 0px;} .welcome-text { width: 78%; text-align: center; margin: 0 auto; margin-top:50px;} /*================================================= 6 - AGRITURISMO =================================================*/ .agriturismo_wrapper {position: relative;background-color: #F7F7F7height: 560px;margin-top: -1px;} .agriturismo_image {background-image: url('img/agriturismo.jpg');position: absolute; -webkit-background-size: cover; background-size: cover; height: 100%; width: 65%; background-position: right top; margin-left: 35%;} .agriturismo {padding-right: 0;} .agriturismo_title {margin-bottom: 30px;text-align: center;font-size: 30px;} /*================================================= 6b - CAMERE =================================================*/ .camere_wrapper {position: relative;background-color: #F7F7F7height: 560px;margin-top: -1px;} .camere_image {background-image: url('img/camere.jpg');position: absolute; -webkit-background-size: cover; background-size: cover; height: 100%; width: 65%;} .camere_content { padding-left: 0; } .camere_title {margin-bottom: 30px;text-align: center;font-size: 30px;} /*================================================= 6c - RISTORANTE =================================================*/ .ristorante_wrapper {position: relative;background-color: #F7F7F7height: 560px;margin-top: -1px;} .ristorante_image {background-image: url('img/ristorante.jpg');position: absolute; -webkit-background-size: cover; background-size: cover; height: 100%; width: 65%; background-position: right top; margin-left: 35%;} .ristorante {padding-right: 0;} .ristorante_title {margin-bottom: 30px;text-align: center;font-size: 30px;} /*================================================= 6d - PRODOTTI =================================================*/ .prodotti_wrapper {position: relative;background-color: #F7F7F7height: 560px;margin-top: -1px;} .prodotti_image {background-image: url('img/prodotti.jpg');position: absolute; -webkit-background-size: cover; background-size: cover; height: 100%; width: 65%;} .prodotti_content { padding-left: 0; } .prodotti_title {margin-bottom: 30px;text-align: center;font-size: 30px;} /*================================================= 6e - LA MANNA =================================================*/ .la-manna_wrapper {position: relative;background-color: #F7F7F7height: 560px;margin-top: -1px;} .la-manna_image {background-image: url('img/la-manna.jpg');position: absolute; -webkit-background-size: cover; background-size: cover; height: 100%; width: 65%; background-position: right top; margin-left: 35%;} .la-manna {padding-right: 0;} .la-manna_title {margin-bottom: 30px;text-align: center;font-size: 30px;} /*================================================= 7 - PAGE TITLE =================================================*/ .page_title { margin-bottom:100px;} .title {font-size:35px!important; text-align: center; text-transform: uppercase; line-height: 45px; letter-spacing: 3px; font-weight: lighter;margin-bottom:15px;} .page_subtitle {color:#909090; text-align: center; font-size:18px; line-height: 30px; font-weight: lighter;margin: 0; } /*================================================= 8 - RESPONSIVE NAV =================================================*/ .responsive_container { width: 100%; position: fixed; z-index: 100; } {float: right; margin-right: 0px;} .responsive_nav { margin-top: -1px; } .mobileAreaMenu {background: white; width: 100%;margin-top: -10px;} .menu_trigger { height: 60px; left: 100%; margin-left: -60px; position: fixed!important; width: 60px; z-index: 99999; text-align: center; } .menu_trigger i:hover {color:white;} .menu_trigger i {padding: 24px; color:white;} .small .menu_trigger i {padding:17px; color:white;} .menu_trigger, .mobileAreaMenu, .responsive_nav {display: none;} header.small .mobileAreaMenu li a {color: #555555;} header.small .mobileAreaMenu li a:hover {color:white;} .mobileAreaMenu li a { color: #555555; line-height: 28px; padding: 10px 0; border-bottom: 1px solid #EFEFEF; display: block; padding-left: 30px; text-decoration: none; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } .mobileAreaMenu a:hover{ color: #fff; } .mobileAreaMenu li { display: block; width: 100%; margin: 0; padding: 0; } /* DARK STYLE */ .mobileAreaMenu.dark_style li a {color: #E0E0E0;border-bottom: 1px solid #414141;} .mobileAreaMenu.dark_style {background: rgb(50, 50, 50);} .mobileAreaMenu.dark_style a:hover {color:white;} /*================================================= 9 - REVOLUTION SLIDER & CUSTOM CAPTIONS =================================================*/ .cap_style_1 {font-family: 'Lato', Arial, Helvetica; font-size: 60px; color:white; } .cap_style_1_subtitle {font-family: 'Lato', Arial, Helvetica; font-size: 18px; color:white; font-weight: 100;} .cap_style_1_button { background: white; -webkit-border-radius: 20px; -moz-border-radius: 20px; border-radius: 20px;font-weight: 100;padding: 5px 25px!important;} .cap_style_1_button a { color:black;} .cap_style_2 {font-family: 'Lato', Arial, Helvetica; font-size: 50px; color:white; font-weight: bold; } .cap_style_2_subtitle {color:white; width: 600px; font-size: 18px; font-weight: 100;} .cap_style_2_button a { color:white;} .cap_style_2_button { padding: 15px 30px; text-transform: uppercase; color: white; letter-spacing: 2px;} .cap_style_3 {font-family: 'Roboto', Arial, Helvetica; color:#202020; font-size: 100px; text-transform: uppercase; font-weight: bold;} .cap_style_3_red {font-size:50px; font-weight: bold; color:white; text-transform: uppercase;} .cap_style_3_subtitle {font-weight: lighter; text-transform: uppercase; font-size: 18px;} .cap_style_3_red.small {font-size:30px;} .cap_style_4 {font-family: 'Raleway', Arial, Helvetica; color:white; font-size: 55px; font-weight: bold;} .cap_style_4_subtitle {font-family: 'Ubuntu', Arial, Helvetica;font-weight: lighter; color:white; font-size: 18px; text-align: center;} .cap_style_4_button { padding: 15px 30px;text-transform: uppercase;color: white;letter-spacing: 4px; border:2px solid white; font-size: 14px; font-weight: bold; } .cap_style_4_button a {color:white;} .cap_style_5 {font-size: 90px; font-family: 'PT Sans', Arial, Helvetica; font-weight: bold; text-transform: uppercase;} .cap_style_5_subtitle {font-weight: lighter; font-size: 22px; color: #9d9cac; text-align: center; letter-spacing: 1px; line-height: 30px;} .cap_style_5_subtitle.white {color:white;} .cap_style_5_button { padding: 15px 30px;text-transform: uppercase;color: white;letter-spacing: 4px; border:2px solid #bebdc5; font-size: 14px; font-weight: bold; } .cap_style_5_button a {color:#9d9cac;} .cap_style_5.pink {color: #E45A7A;} .cap_style_5.blue {color: #00bdcc;} .cap_style_5.yellow {color: #e8d92f;} .cap_style_5.green {color: #5bbf81;} .cap_style_6 {font-family: 'Amatic SC', Arial, Helvetica; font-size: 120px; color:white;} .cap_style_6_subtitle {font-family: 'Amatic SC', Arial, Helvetica; font-size: 62px; color:white;} .cap_style_6_name {font-family: 'Dancing Script', cursive; color:white; font-size: 40px;} .cap_style_7_subtitle {color:#0a0c10; font-weight: bold; font-size: 36px; text-transform: uppercase;font-family: 'Oswald', Arial, Helvetica; } .cap_style_7 {font-family: 'Oswald', Arial, Helvetica; font-size: 170px; color:#0a0c10;} .cap_style_8 { font-family: 'Josefin Slab', Arial, Helvetica; font-size: 83px; text-align: center; color:white; line-height: 80px; text-transform: uppercase ; font-weight: bold;} .cap_style_8_subtitle { font-family: 'Josefin Slab', Arial, Helvetica; font-size: 60px; color:white; font-weight: light; text-transform: uppercase;} .cap_style_9, .cap_style_9_subtitle {font-family: 'Oswald', Arial, Helvetica; font-size: 85px; color:white; text-transform: uppercase;} .cap_style_9_subtitle {font-size: 25px; } .cap_style_9.second_style {font-size: 125px;} .cap_style_9_subtitle.second_style {font-family: 'Josefin Slab', Arial, Helvetica; font-weight: 600; } .cap_style_10_subtitle { font-family: 'PT Sans',arial; font-size:28px; color:white; font-weight: 100; text-transform: uppercase;} .cap_style_10 { font-family: 'PT Sans',arial; font-size:100px; color:white; font-weight: bold; text-transform: uppercase; letter-spacing: -1px;} .cap_style_11 { font-family: 'PT Sans',arial; color:white; font-weight: bold; text-transform: uppercase; letter-spacing: -1px;font-size: 80px;} .cap_style_11_subtitle {font-size:25px; font-weight: 100; color:white; text-align: center; line-height: 35px;} .cap_style_12 {font-size: 67px; font-weight: bold; color:white; line-height: 70px;} .cap_style_12_subtitle {color: white; font-size: 22px; font-weight: 100; line-height: 40px;} .cap_style_13 {color:black; font-size: 62px; background:white; padding:20px 20px; text-transform: uppercase;} .cap_style_13_subtitle {color:black; font-size: 22px; background:white; padding:10px 10px; text-transform: uppercase;} .cap_style_13_button {color:black; font-size: 16px; background:white; padding:10px 10px; text-transform: uppercase; font-weight: bold} .cap_style_13_button a {color:black;} .cap_style_14 {font-size: 40px; text-transform: uppercase; color: white; background-color: #e95143; -webkit-border-radius: 50px; -moz-border-radius: 50px; border-radius: 50px; padding:25px 40px; font-weight: 100; } .cap_style_14_subtitle {font-weight: 100; color:#4d4d4d; background: white; text-transform: uppercase; font-size: 20px; -webkit-border-radius: 50px; -moz-border-radius: 50px; border-radius: 50px; padding:10px 20px;} .cap_style_15 {font-size: 160px; text-transform: uppercase; color: white;font-family: 'Six Caps', sans-serif; text-align: center; line-height: 155px;} .cap_style_15_subtitle {font-size: 30px;text-transform: uppercase; color: white; font-weight: lighter;} .videoWrapper { position: relative; padding-bottom: 56.25%; /* 16:9 */ padding-top: 25px; height: 0; } .videoWrapper iframe { position: absolute; top: 0; left: 0; width: 100%; height: 100%; } .video_caption { text-align: center; position: absolute; width: 600px; margin-left: -300px; left: 50%; top:400px; } .video_logo {padding:20px 0px;} .video_text_small {color:white; font-size:50px;padding-bottom: 20px;} .video_text_big {color:white; font-size:80px;padding: 30px 0px 40px 0px;} .full_slide {height: 100%; width: 100%;} /*================================================= 11 - SERVICES =================================================*/ #service_tab_triggers {margin-bottom:100px!important;} #service_tab_triggers ul li {display: inline-block;} #service_tab_triggers li a {margin-right: 20px;} #service_tab_triggers ul li i {padding:38px; color:white;} #service_tab_triggers {text-align: center;} #service_tab_triggers ul li a{float: left;height: 130px; width: 130px; -webkit-border-radius: 200px; -moz-border-radius: 200px; border-radius: 200px; background: #dcdcdc;} .service_custom_column {margin: 0 -2px; width: 20%; display: inline-block; text-align: center; padding: 50px; background-color: #F7F7F7; border-top: 1px solid #ECECEC;border-bottom: 1px solid #ECECEC; border-right: 1px solid #ECECEC;} .service_custom_column h2 {text-transform: uppercase; padding: 10px 0px;} /* SERVICE STYLE 2 */ .service_wrapper.style2 h1 {text-transform: uppercase; font-weight: lighter; font-size:28px;} .service_wrapper.style2 span.subtitle { text-transform: uppercase; letter-spacing: 2px;} .service_wrapper.style2 .services_description { margin-top: 20px;} .service_wrapper.style2 .service_item_wrapper { margin-bottom:40px;} /* SERVICE STYLE 3 */ .service_wrapper.style3 {text-align: center;} .service_wrapper.style3 h2 {padding-bottom: 10px;} .service_wrapper.style3 .service_item_wrapper {padding-bottom:20px;} .icon_wrapper i { margin-top: 32px;margin-left: -1px;} /* SERVICE STYLE 4 */ .service_wrapper.style4 .icon_wrapper {float: left;margin-left: -20px;padding-bottom: 120px;margin-right: 20px;padding-top: 5px;} .service_wrapper.style4 .hi-icon {width: 50px; height: 50px;} .service_wrapper.style4 .icon_wrapper i {margin-top: 12px;margin-left: 0;} .service_wrapper.style4 .service_item_wrapper {margin-bottom: 30px; float: left;} .service_wrapper.style4 .service_item_wrapper h2 {text-transform: uppercase; font-size: 17px; font-weight: bolder;} /* Float Shadow */ .float-shadow { display: inline-block; position: relative; -webkit-transition-duration: 0.3s; transition-duration: 0.3s; -webkit-transition-property: transform; transition-property: transform; -webkit-transform: translateZ(0); transform: translateZ(0); box-shadow: 0 0 1px rgba(0, 0, 0, 0); } .float-shadow:before { pointer-events: none; position: absolute; z-index: -1; content: ''; top: 100%; left: 5%; height: 10px; width: 90%; opacity: 0; background: radial-gradient(ellipse at center, rgba(0, 0, 0, 0.35) 0%, rgba(0, 0, 0, 0) 80%); /* W3C */ -webkit-transition-duration: 0.3s; transition-duration: 0.3s; -webkit-transition-property: transform, opacity; transition-property: transform, opacity; } .service_custom_column:hover .float-shadow, .service_custom_column:focus .float-shadow, .service_custom_column:active .float-shadow { -webkit-transform: translateY(-25px); transform: translateY(-25px); /* move the element up by 5px */ } .service_custom_column:hover .float-shadow:before, .service_custom_column:focus .float-shadow:before, .service_custom_column:active .float-shadow:before { opacity: 1; -webkit-transform: translateY(25px); transform: translateY(25px); /* move the element down by 5px (it will stay in place because it's attached to the element that also moves up 5px) */ } /* Buzz */ @-webkit-keyframes buzz { 50% { -webkit-transform: translateX(3px) rotate(2deg); transform: translateX(3px) rotate(2deg); } 100% { -webkit-transform: translateX(-3px) rotate(-2deg); transform: translateX(-3px) rotate(-2deg); } } @keyframes buzz { 50% { -webkit-transform: translateX(3px) rotate(2deg); transform: translateX(3px) rotate(2deg); } 100% { -webkit-transform: translateX(-3px) rotate(-2deg); transform: translateX(-3px) rotate(-2deg); } } .buzz { display: inline-block; -webkit-transform: translateZ(0); transform: translateZ(0); box-shadow: 0 0 1px rgba(0, 0, 0, 0); } .buzz:hover, .buzz:focus, .buzz:active { -webkit-animation-name: buzz; animation-name: buzz; -webkit-animation-duration: 0.15s; animation-duration: 0.15s; -webkit-animation-timing-function: linear; animation-timing-function: linear; -webkit-animation-iteration-count: infinite; animation-iteration-count: infinite; } /*================================================= 12 - TEAM =================================================*/ .team_item {height: 480px; width:25%;float: left;-webkit-background-size: cover;background-size: cover; background-position: center; position: relative;} .team_description h2 {font-size: 30px; color: white; text-transform: uppercase; letter-spacing: 2px; margin-bottom: 0; padding-bottom:0;} .team_description .job { color: #f8f8f8; font-size: 19px; font-weight: lighter;margin-bottom: 15px;} .team_description {bottom: 5px;position: absolute;padding-left: 30px;} .team_over { position: absolute; top: 0; left: 0; height: 100%; width: 100%; opacity: 0; background-repeat:no-repeat; background-position:center; background-size:cover; -moz-transition: .45s ease-in-out; -webkit-transition: .45s ease-in-out; -o-transition: .45s ease-in-out; -ms-transition: .45s ease-in-out; transition: .45s ease-in-out; background-color: rgba(255,255,255,.8 );} .team_over ul {text-align: center;top: 45%;position: relative;} .team_over li {display: inline-block; padding: 10px; margin-right: 10px; height: 50px; width: 50px; margin-bottom: 15px;} .team_item:hover .team_over {opacity: 1;} .social_team i {color:white;} .team_over li.facebook_icon {background-color: #3b5999;} .team_over li.twitter_icon {background-color: #00cae9;} .team_over li.dribble_icon {background-color: #f26798;} .team_over li.wordpress_icon {background-color: #1e769c;} .team_over li.linkedin_icon {background-color: #117bb7;} .team_over li.behance_icon {background-color: #000000;} .team_over li.skype_icon {background-color: #25aee2;} .team_over li.youtube_icon {background-color: #cb312f;} .team_over li.instagram_icon {background-color: #5280a4;} .team_over li.googlep_icon {background-color: #de4b39;} .team_over li.tumblr_icon {background-color: #31506d;} .team_over li.github_icon {background-color: #000000;} .team_over li.pinterest_icon {background-color: #ce2029;} /*================================================= 13 - PROCESS 01 =================================================*/ .process_one_wrapper {position: relative;background-color: #F7F7F7;} .process_image {background-image: url('http://placehold.it/670x980');position: absolute; -webkit-background-size: cover;background-size: cover;height: 100%;width: 35%; right:0;} .process_item, .process_item_icon_right {border-bottom:1px dashed #d1d1d1;padding: 30px 0px;} .process_item h3, .process_item_icon_right h3 {margin-bottom: 20px;} .process_icon { float: left;margin-right: 30px;margin-bottom: 110px;} .process_item_icon_right { text-align: right;} .process_item_icon_right .process_icon {float: right;margin-left: 30px;margin-bottom: 110px;} /*================================================= 14 - RETINA ICONS =================================================*/ .services_icon_container .hi-icon {float: left;} .hi-icon { display: inline-block; cursor: pointer; margin-bottom: 20px; width: 110px; height: 110px; -webkit-border-radius: 50%; -moz-border-radius: 50%; border-radius: 50%; text-align: center; position: relative; z-index: 1; color: #fff; } .hi-icon:after { pointer-events: none; position: absolute; width: 100%; height: 100%; border-radius: 50%; content: ''; -webkit-box-sizing: content-box; -moz-box-sizing: content-box; box-sizing: content-box; } .hi-icon:before { font-family: 'FontAwesome'; speak: none; font-size: 48px; line-height: 90px; font-style: normal; font-weight: normal; font-variant: normal; text-transform: none; display: block; -webkit-font-smoothing: antialiased; } .hi-icon-mobile:before { content: "\e009"; } .hi-icon-screen:before { content: "\e00a"; } .hi-icon-earth:before { content: "\e002"; } .hi-icon-support:before { content: "\e000"; } .hi-icon-locked:before { content: "\e001"; } .hi-icon-cog:before { content: "\e003"; } .hi-icon-clock:before { content: "\e004"; } .hi-icon-videos:before { content: "\e005"; } .hi-icon-list:before { content: "\e006"; } .hi-icon-refresh:before { content: "\e007"; } .hi-icon-images:before { content: "\e008"; } .hi-icon-pencil:before { content: "\e00b"; } .hi-icon-link:before { content: "\e00c"; } .hi-icon-mail:before { content: "\e00d"; } .hi-icon-location:before { content: "\e00e"; } .hi-icon-archive:before { content: "\e00f"; } .hi-icon-chat:before { content: "\e010"; } .hi-icon-bookmark:before { content: "\e011"; } .hi-icon-user:before { content: "\e012"; } .hi-icon-contract:before { content: "\e013"; } .hi-icon-star:before { content: "\e014"; } /* Effect 1 */ .hi-icon-effect-1 .hi-icon { background: rgba(194, 194, 194, 1); -webkit-transition: background 0.2s, color 0.2s; -moz-transition: background 0.2s, color 0.2s; transition: background 0.2s, color 0.2s; } .ie8 .hi-icon-effect-1 .hi-icon { background: #3d3d3d; } .hi-icon-effect-1 .hi-icon:after { top: -7px; left: -7px; padding: 7px; -webkit-transition: -webkit-transform 0.2s, opacity 0.2s; -webkit-transform: scale(.8); -moz-transition: -moz-transform 0.2s, opacity 0.2s; -moz-transform: scale(.8); -ms-transform: scale(.8); transition: transform 0.2s, opacity 0.2s; transform: scale(.8); opacity: 0; } /* Effect 1a */ .no-touch .hi-icon-effect-1a .hi-icon:hover { color: #f6f6f6; } .no-touch .hi-icon-effect-1a .hi-icon:hover:after { -webkit-transform: scale(1); -moz-transform: scale(1); -ms-transform: scale(1); transform: scale(1); opacity: 1; } /* Effect 1b */ .no-touch .hi-icon-effect-1b .hi-icon:hover { color: #f6f6f6; } .hi-icon-effect-1b .hi-icon:after { -webkit-transform: scale(1.2); -moz-transform: scale(1.2); -ms-transform: scale(1.2); transform: scale(1.2); } .no-touch .hi-icon-effect-1b .hi-icon:hover:after { -webkit-transform: scale(1); -moz-transform: scale(1); -ms-transform: scale(1); transform: scale(1); opacity: 1; } .hi-icon i.fa_icon { position: relative; top: 25px; } /*================================================= 15 - SHORTCODES =================================================*/ /* OVERWRITE BOOTSTRAP DEFAULT STYLE COLOR*/ .alert-success { color: #FFFFFF; background-color: #2ecc71; } .alert-info { color: #FFFFFF; background-color: #3498db; } .alert-danger { color: #FFFFFF; background-color: #e74c3c; } .alert-warning { color: #FFFFFF; background-color: #f1c40f; } .btn { display: inline; padding: 10px 30px; text-transform: uppercase; -webkit-border-radius: 2px; -moz-border-radius: 2px; border-radius: 2px; font-size: 13px; font-weight: bold; } .btn.btn-success {background: #2ecc71; border:none;} .btn.btn-success:hover {background: #27AE60;} .btn.btn-danger {background: #e74c3c; border:none;} .btn.btn-danger:hover {background: #C0392B;} .btn.btn-warning {background: #f1c40f; border:none;} .btn.btn-warning:hover {background: #F39C12;} .btn.btn-info {background: #3498db; border:none;} .btn.btn-info:hover {background: #2980B9;} .btn.btn-primary {border:none; color:white;} .btn.btn-deep {background: #334458; border:none; color:white;} .btn.btn-deep:hover {background: #3a5168;} .label-success { background-color: #2ecc71;} .label-danger { background-color: #e74c3c;} .label-warning { background-color: #f1c40f;} .label-info { background-color: #3498db;} .label-deep { background-color: #334458;} /*================================================= 15 - SHORTCODES - B) Accordion & Triggers =================================================*/ h3.trigger, h3.accordion {outline: none; background-color:#f9f9f9; font-size: 13px; padding: 14px 0 15px 0; margin:0; -moz-transition:background-color 0.5s ease-out; -webkit-transition:background-color 0.5s ease-out; -o-transition:background-color 0.5s ease-out; -ms-transition:background-color 0.5s ease-out; transition:background-color 0.5s ease-out; border-bottom: 1px solid #e6e6e6; } h3.trigger a,h3.accordion a { text-decoration: none; display: block; font-weight: normal; padding-left: 30px; outline: none; font-size: 14px; color: #323232; font-weight: bold; } i.fa-minus {display: none;} .accordion i, .trigger i {margin-right: 20px; width: 24px; height: 24px; padding: 6px; color:white;} h3.trigger.active i.fa-plus {display:none;} h3.trigger.active i.fa-minus {display:inline-block;} h3.accordion.ui-state-active i.fa-plus {display:none;} h3.accordion.ui-state-active i.fa-minus {display:inline-block;} .toggle_container, .accordion_container{ border-bottom: 1px solid #e6e6e6; background: white; overflow: hidden;outline: none; } .toggle_container .block, .accordion_wrap .block{ padding:10px; padding-top:20px; } .toggle_container .block {min-height:60px;} .toggle, .accordion_wrap {border: 1px solid #e6e6e6 ;border-bottom: none;} #blog {margin-bottom: -8px;} /*FIX FOR THE BLOG BUTTONS MARGIN*/ .wrapper_blog_title {z-index: 100; position: absolute; bottom:20px;} .wrapper_blog_title, .wrapper_blog_title h2, .wrapper_blog_title a{ color: white;} .blog-item-home{ height: 500px; background-size:cover;padding: 25px; position: relative; background-position: center;display: inline-table; width: 100%;} .blog_buttons { background:#f0f0f0;} .read_allnews {text-align: center;padding: 50px;} .read_next_story { float: right;padding: 50px;} .read_prev_story{ padding: 50px;} .read_prev_story i, .read_allnews i {margin-right: 10px;} .read_next_story i {margin-left: 10px;} .read_allnews, .read_next_story, .read_prev_story{padding: 30px 10px;text-transform: uppercase; font-weight: bold;margin-top: 10px;} .read_more:hover { color:white;} .read_more a:hover{ color: white!important;} .over_blog { position: absolute; top: 0; left: 0; height: 100%; width: 100%; opacity: .3; background-color:#000000; background-size:cover; -moz-transition: .45s ease-in-out; -webkit-transition: .45s ease-in-out; -o-transition: .45s ease-in-out; -ms-transition: .45s ease-in-out; transition: .45s ease-in-out;} .blog-item-home:hover .over_blog {opacity: .7 } /*================================================= 16 - BLOG - B) Blog Section =================================================*/ .blog_wrapper {padding:70px 0px;} #blog_header { min-height: 300px;padding-top: 150px;} .blog_title_heading {margin-top: 20px;} .blog_title_heading h1 {color: white; text-transform: uppercase; font-weight: lighter; letter-spacing: 2px; font-size: 26px; display: inline; padding: 10px 20px; } .breadcrums { float: right; font-weight: bold; font-size: 14px; margin-top: 20px;} .breadcrums a {color:white;} .breadcrums li {float: left; margin-left: 20px;} .the-date-big span {display: block;display: block; color: white;} .the-date-big { position: absolute;-moz-transition: .15s ease-in-out; -webkit-transition: .15s ease-in-out; -o-transition: .15s ease-in-out; -ms-transition: .15s ease-in-out; transition: .15s ease-in-out; z-index: 100; width: 80px; height: 80px; text-align: center; padding-top: 15px; } .the-date-big:hover { background-color:#323232;} .the-date-big .number {font-size: 35px; font-weight: bold;} .the-date-big .month { font-size: 18px; } /*================================================= 16 - BLOG - C) Blog item =================================================*/ .blog-item {background-color: #ffffff; margin-bottom: 70px;} .img-container-blog { min-height: 400px; position: relative; background-repeat: no-repeat; -webkit-background-size: cover; background-size: cover; margin-bottom: 30px; background-position: center; } /*================================================= 16 - BLOG - C) Blog Post =================================================*/ .the-title h1 {line-height: 25px;margin: 15px 0px;} .the-title h1 a {font-size: 24px; color: #323232;} .blog-item.blog-post { margin-bottom: 0;} .blog-item .metas { border-bottom: 1px solid #e6e6e6; margin-bottom: 20px; } .the-title {margin: 25px 0px 0px 0px;} .blog-item .metas .the-comments a, .blog-item .metas .the-date a, .blog-item .metas .the-author a { background-repeat: no-repeat; float: left; margin-bottom: 15px; color: #9da0a4; margin-right: 20px; font-size: 13px; } .metas .the-date i, .metas .the-author i, .metas .the-comments i {padding-right:8px; color:#363636;} .read_more_small img {margin-top:5px; } .read_more_small { background: #9da0a4; -moz-transition: .15s ease-in-out; -webkit-transition: .15s ease-in-out; -o-transition: .15s ease-in-out; -ms-transition: .15s ease-in-out; transition: .15s ease-in-out; padding: 0px 7px; margin-top: 4px; float: right; } .read_more_small i {color: white;} .blog-boddy { border-bottom: 1px solid #ECECEC; padding-bottom: 30px; } .used_tags span {font-weight: bold} .used_tags {font-size: 12px; } .used_tags span, .used_tags li {float: left; margin-right:10px;} /*================================================= 16 - BLOG - D) About the author =================================================*/ .about_the_author { background-color: rgb(241, 241, 241); margin-top: 30px; padding: 30px; border: 1px solid rgb(233, 233, 233); } .author_avatar {width: 100px; height: 100px; background-size: cover; float: left; margin-right: 30px; } .about_the_author h4 {display: inline;} .about_the_author p {font-size: 13px; line-height: 24px;margin-bottom: 0;} /*================================================= 16 - BLOG - E) Comments =================================================*/ .comment { margin-bottom: 25px; border:1px solid rgb(233, 233, 233); background-color: #FFF; font-size: 14px; } .comment-body { padding: 10px; } .comment .replybutton { float: right; margin-top: 0px; background-color: #F7F7F7; margin-right: 0px; font-size: 11px; color: #999; padding: 8px; } .post-info { position: relative; padding: 9px 9px 9px 69px; margin-bottom: 15px; -webkit-border-radius: 2px; -moz-border-radius: 2px; border-radius: 2px; font-size: 11px; line-height: 50px; vertical-align: middle; color: #999; background-color: #F7F7F7; -webkit-background-clip: border; behavior: url(css/PIE.htc); border-bottom: 1px solid rgb(233, 233, 233); } .post-info .post-avatar { position: absolute; top: 10px; display: inline-block; left: 10px; width: 50px; height: 50px; background-position: center; } .post-author { font-size: 14px; margin-right: 10px; margin: 0px 5px; margin-right: 10px; } .post-info .post-author { font-weight: bold; color:#232527; } .comment .ago { float: right; font-size: 11px; } .comment.reply { margin-left: 50px; } .label_comment {display: initial;} .reply-input div { margin-bottom: 25px; } .blogpost-title {margin-top: 40px; margin-bottom: 20px;} #response .submit_post { margin-top:20px; color: white; width:200px; border-radius: 2px; -moz-transition: .15s ease-in-out; -webkit-transition: .15s ease-in-out; -o-transition: .15s ease-in-out; -ms-transition: .15s ease-in-out; transition: .15s ease-in-out; border:none; } #response .submit_post:hover { background-color: #25292c; } #response input, #response textarea{ outline: none; padding: 6px 10px; border: none; color: #838383; background-color: #E2E2E2; width: 100%; margin: 0; box-shadow: none; } .label_comment {display: initial;} /*================================================= 17 - BLOG SIDEBAR =================================================*/ .trigger_sidebar a:hover {color:#323232;} .trigger_sidebar li a {float: left; width: 50%; text-align: center; background-color: #e4e4e4; padding:10px; margin-bottom: 10px; font-weight: bold;cursor:pointer; } .trigger_sidebar li.active a {background-color: #323232;} .trigger_sidebar .active a {color:white; font-weight: bold;} .widget { padding-bottom:20px;} .widget h3 { margin-bottom: 20px;} .post-list-wrapper li { display: inline-block; float: left; border-bottom: 1px solid rgb(235, 235, 235); width: 100%; margin-top: 12px; padding-bottom:12px;} .small_featured_image { float: left; width: 70px; height: 60px; background-size: cover; margin-right: 15px;} .list_metas { font-size: 11px; margin-top: -5px;} .list_metas span {margin-right:15px;} .list_metas i {margin-right:5px;} .small_title {font-size: 14px; font-weight: bold; color: rgb(134, 134, 134); line-height: 18px;} /*================================================= 17 - BLOG SIDEBAR B) TAG CLOUD =================================================*/ .tags li a { display: inline-block; padding: 9px; line-height: 9px; text-transform: uppercase; -moz-border-radius: 5px 5px 5px 5px; -webkit-border-radius: 5px 5px 5px 5px; border-radius: 5px 5px 5px 5px; behavior: url(css/PIE.htc); color: #E7E7E7; letter-spacing: 1px; font-size:10px; } .tags li { float: left; background-color: #323232; margin-right: 7px; -moz-border-radius: 5px 5px 5px 5px; -webkit-border-radius: 5px 5px 5px 5px; border-radius: 5px 5px 5px 5px; margin-bottom: 10px; behavior: url(css/PIE.htc); -webkit-transition-duration: 0.15s; -moz-transition-duration: 0.15s; -o-transition-duration: 0.15s; -ms-transition-duration: 0.15s; transition-duration: 0.15s; } /*================================================= 17 - BLOG SIDEBAR C) CATEGORIES WIDGET =================================================*/ .categories li { padding: 10px 0px; border-bottom: 1px dashed rgb(213, 213, 213); text-transform: capitalize; } /*================================================= 18 - PAGINATION =================================================*/ ul.page-numbers { list-style: none; margin: 1em auto; padding: 0; color: #555555; text-transform: uppercase; font-size: 90%; } ul.page-numbers li { display: inline; } ul.page-numbers a.page-numbers { margin: 2px; padding: 5px 10px; display: inline-block; border-top: 1px solid #fff; text-decoration: none !important; font-size: smaller !important; text-shadow: white 0 1px 0; background: white; border: 1px solid rgb(223, 223, 223); } ul.page-numbers a.page-numbers:first-child, ul.page-numbers a.page-numbers.first { margin-left: 0; } ul.page-numbers a.page-numbers:last-child, ul.page-numbers a.page-numbers.last { margin-right: 0; } ul.page-numbers a.page-numbers:hover, ul.page-numbers a.page-numbers:focus { color: #333333; } ul.page-numbers a.page-numbers.more { -webkit-box-shadow: none; -moz-box-shadow: none; box-shadow: none; border: 0 none !important; background: transparent !important; margin-left: 0; margin-right: 0; } ul.page-numbers a.page-numbers.active { -webkit-box-shadow: inset 0 0 0 0 rgba(0, 0, 0, 0.75); -moz-box-shadow: inset 0 0 0 0 rgba(0, 0, 0, 0.75); box-shadow: inset 0 0 0 0 rgba(0, 0, 0, 0.75); border-color: #505050 !important; color: #f2f2f2 !important; text-shadow: black 0 1px 0; background-color: #676767; background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #5f5f5f), color-stop(100%, #5c5c5c)); background-image: -webkit-linear-gradient(#5f5f5f, #5c5c5c); background-image: -moz-linear-gradient(#5f5f5f, #5c5c5c); background-image: -o-linear-gradient(#5f5f5f, #5c5c5c); background-image: linear-gradient(#5f5f5f, #5c5c5c); } ul.page-numbers .prev:before { content: "\2039"; padding-right: 0.5em; } ul.page-numbers .next:after { content: "\203A"; padding-left: 0.5em; } ul.page-numbers .dots { -webkit-box-shadow: none; -moz-box-shadow: none; box-shadow: none; border: 0 none !important; background: transparent !important; color: #999999 !important; margin-left: 0.25em; margin-right: 0.25em; } ul.page-numbers .current { background: #5f5f5f; margin-right: 2px; padding: 5px 10px; display: inline-block; border-top: 1px solid #fff; text-decoration: none !important; font-size: smaller !important; border-color: #505050 !important; color: #f2f2f2 !important; text-shadow: black 0 1px 0; } /*================================================= 19 - TWITTER FEED =================================================*/ .tweet .date {font-size: 12px;} .tweet li {display: inline-block;margin-bottom: 20px;} .tweet li img {-webkit-border-radius: 50px; -moz-border-radius: 50px; border-radius: 50px; margin-bottom: 40px; float: left; margin-right: 15px;} .tweet ul {margin-bottom: 0;} /*================================================= 20 - PORTFOLIO =================================================*/ .grid .portfolio-item .commands { float: right;} .grid .portfolio-item .commands a { text-indent: initial; opacity: 1; position: initial; font-size: 18px; color: #323232; } .grid .portfolio-item img { position: relative; display: block; min-height: 100%; } .grid .portfolio-item div.figcaption { padding: 2em; color: #fff; text-transform: uppercase; font-size: 1.25em; -webkit-backface-visibility: hidden; backface-visibility: hidden; } .grid .portfolio-item div.figcaption::before, .grid .portfolio-item div.figcaption::after { pointer-events: none; } .grid .portfolio-item a { position: absolute; top: 0; left: 0; width: 100%; height: 100%; } .grid .portfolio-item div.figcaption { position: absolute; left: 0; width: 100%; } .grid .portfolio-item a { z-index: 1000; text-indent: 200%; white-space: nowrap; font-size: 0; opacity: 0; } .grid .portfolio-item h2 { word-spacing: -0.15em; font-weight: 300; } .grid .portfolio-item h2 span { font-weight: 800; } .grid .portfolio-item h2 { margin-top:6px; } .over { position: absolute; top: 0; left: 0; height: 100%; width: 100%; opacity: 0; background-size:cover; -moz-transition: .45s ease-in-out; -webkit-transition: .45s ease-in-out; -o-transition: .45s ease-in-out; -ms-transition: .45s ease-in-out; transition: .45s ease-in-out; } .portfolio-item:hover .over{opacity: .8} .portfolio-item.effect div.figcaption { top: auto; bottom: 0; padding: 1em; height: 3.75em; background: #fff; color: #3c4a50; -webkit-transition: -webkit-transform 0.35s; transition: transform 0.35s; -webkit-transform: translate3d(0,100%,0); transform: translate3d(0,100%,0); } .portfolio-item h2 { float: left; font-size: 32px; } .portfolio-item div.figcaption > span { float: right; } .portfolio-item p { position: absolute; bottom: 8em; padding: 2em; color: #fff; text-transform: none; font-size: 90%; opacity: 0; -webkit-backface-visibility: hidden; backface-visibility: hidden; -webkit-transition: opacity 0.35s; transition: opacity 0.35s; } .portfolio-item h2, .portfolio-item div.figcaption > span { -webkit-transition: -webkit-transform 0.35s; transition: transform 0.35s; -webkit-transform: translate3d(0,200%,0); transform: translate3d(0,200%,0); } .portfolio-item div.figcaption span i {padding: 10px;} .portfolio-item div.figcaption > span::before { display: inline-block; padding: 8px 10px; font-family: 'feathericons'; speak: none; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } .icon-eye::before { content: '\e000'; } .icon-paper-clip::before { content: '\e001'; } .icon-heart::before { content: '\e024'; } .portfolio-item h2 { display: inline-block; } .portfolio-item:hover p { opacity: 1; } .portfolio-item:hover div.figcaption, .portfolio-item:hover h2, .portfolio-item:hover div.figcaption > span { -webkit-transform: translate3d(0,0,0); transform: translate3d(0,0,0); } .portfolio-item:hover h2 { -webkit-transition-delay: 0.05s; transition-delay: 0.05s; } .portfolio-item:hover div.figcaption > span:nth-child(4) { -webkit-transition-delay: 0.1s; transition-delay: 0.1s; } .portfolio-item:hover div.figcaption > span:nth-child(3) { -webkit-transition-delay: 0.15s; transition-delay: 0.15s; } .portfolio-item:hover div.figcaption > span:nth-child(2) { -webkit-transition-delay: 0.2s; transition-delay: 0.2s; } #options {background-color: #f0f0f0;} #filters {padding-top: 38px;float: left;margin-bottom: 25px;} #filters li {float:left; margin-right:15px; margin-bottom: 15px;} #filters li a{ background-color: #f6f6f6; border-radius:3px; -moz-border-radius:3px; -webkit-border-radius:3px; border: 1px solid #cccccc; font-size:11px; behavior: url(css/PIE.htc); color: #777777; padding: 8px; font-weight: bold; } #colums_triggers li a { background-color: #f6f6f6; border-radius:3px; -moz-border-radius:3px; -webkit-border-radius:3px; border: 1px solid #cccccc; font-size:11px; behavior: url(css/PIE.htc); color: #777777; padding: 8px 8px 12px 8px; font-weight: bold; } #filters li.active a, #filters li a:hover, #colums_triggers li a:hover { background-color: #ededed; -moz-box-shadow: inset 0 0 10px 2px #dcdcdc ; -webkit-box-shadow: inset 0 0 10px 2px #dcdcdc ; box-shadow: inset 0 0 10px 2px #dcdcdc ; -moz-transition: .15s ease-in-out; -webkit-transition: .15s ease-in-out; -o-transition: .15s ease-in-out; -ms-transition: .15s ease-in-out; transition: .15s ease-in-out; } #colums_triggers {float: right;margin-top: 38px;} #colums_triggers li {float: left;margin-left: 10px;} #portfolioAjaxControlls {float:right; margin-bottom:30px;height: 80px; position: relative;} #portfolioData {margin-bottom: 50px;} #portfolioAjaxControlls .inner { display: block; position: absolute; overflow: hidden; width: 31px; height: 31px; margin-left: -10px; margin-top: -10px; background: #535353 url('images/icons/controlls_ajax.png') 0px -13px; -webkit-border-radius: 20px; -moz-border-radius: 20px; border-radius: 20px; z-index: 5; -moz-transition: .15s ease-in-out; -webkit-transition: .15s ease-in-out; -o-transition: .15s ease-in-out; -ms-transition: .15s ease-in-out; transition: .15s ease-in-out; } .item-data h3 {margin:0;} #portfolioAjaxControlls .outer { display: block; position: absolute; margin-top: -25px; margin-left: -25px; width: 61px; height: 61px; -webkit-border-radius: 40px; -moz-border-radius: 40px; border-radius: 40px; background: rgba(153,153,153,0.1); } .ie8 .inner {behavior: url(css/PIE.htc); } #ajax_close { position: absolute; top:55px; right: 30px; } #portfoliod {display: none;} .grid { overflow: hidden;} .grid .portfolio-item { position: relative; z-index: 1; float: left; width: 33.30%; height: 400px; background: #3085a3; background-size: cover; text-align: center; cursor: pointer; overflow: hidden; background-position: center; } /*================================================= 20 - PORTFOLIO B) two_columns Style =================================================*/ .grid.two_columns .portfolio-item {width: 49.99%; height: 550px;} .grid.two_columns .portfolio-item p {margin-left: -15px;width: 100%; top: -270px;} /*================================================= 20 - PORTFOLIO C) four_columns Style =================================================*/ .grid.four_columns .portfolio-item {width: 24.95%; } /*================================================= 20 - PORTFOLIO D) Isotope =================================================*/ .isotope-item { z-index: 2; } .isotope-hidden.isotope-item { pointer-events: none; z-index: 1; } /**** 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: top, left, 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; } .portfolio_item {-webkit-transition-duration: 0.5s; -moz-transition-duration: 0.5s; -o-transition-duration: 0.5s; -ms-transition-duration: 0.5s; transition-duration: 0.5s} /*================================================= 21 - FAQ =================================================*/ .faq_icons {float: left; margin-right: 20px;} .faq_icon{width: 50px; height: 50px;} .faq_icons i {margin-top: 12px;margin-left: 0; } /*================================================= 22 - PRICING TABLES =================================================*/ .pricing-table {border:1px solid #e9e9e9} .pricing-table .pricing_header {background-color: white; } .pricing-table .pricing_sub_header {background-color: #f7f9fc;border-top: 1px solid #e9e9e9;border-bottom: 1px solid #e9e9e9;} .pricing-table .pricing_header h1 {margin-bottom: 0;margin-top: 0; color: black; padding: 20px 0px; text-align: center; font-size: 20px; text-transform: uppercase;} .pricing-table .pricing_sub_header h1 {color: #000000; text-align: center; margin: 0;padding: 25px 0px 15px 0px; font-size: 22px;} .pricing-table .pricing_sub_header span {font-size: 13px; font-weight: lighter; color: #a4a4a4; margin-left: 5px;} .pricing-table .features li {padding:15px; text-align: center; background-color: #fff;border-bottom: 1px solid #e9e9e9;color: #a4a4a4;font-size: 13px;} .pricing-table ul {border-bottom:0;margin-bottom: 0;} .pricing_footer {-moz-transition: .15s ease-in-out; -webkit-transition: .15s ease-in-out; -o-transition: .15s ease-in-out; -ms-transition: .15s ease-in-out; transition: .15s ease-in-out;background-color: #f9fbfc; border-top:0;padding:30px 0px; text-align: center;} .pricing_footer h3 {margin: 0; color:white; text-align: center;} .pricing_footer h3 a {color:#a4a4a4;} .pricing_button {background: #3fd7ee; display: inline; padding: 10px 30px; text-transform: uppercase; border-radius: 2px; font-size: 12px; color:white; font-weight: bold;} .pricing_button:hover {color:white; background-color: #00CCEB;} /*================================================= 23 - CLIENTS =================================================*/ .clients_list {margin: 0; text-align: center;} .clients_list li {width: 33.3%; background-color: #eaeaea; border-right: 1px solid #d7d7d7; border-bottom: 1px solid #d7d7d7; float: left; display: inline-block; height: 200px;} .clients_list li img {position: relative; top: 30%;} /*================================================= 24 - FOOTER =================================================*/ #footer {background-color: #141414; color:#676767;height: 350px;} .footer_icon li {float: left; background: #212121; border-radius: 200px; height: 45px; width: 45px; margin-left: 10px; -moz-transition: .15s ease-in-out; -webkit-transition: .15s ease-in-out; -o-transition: .15s ease-in-out; -ms-transition: .15s ease-in-out; transition: .15s ease-in-out; } .footer_icon li i {padding: 13px; color:#575757; font-size: 1.5em;} .footer_adress i {margin-right:20px;} .footer_adress li {margin-bottom: 10px;} .footer_icon li:hover {background-color: white;} .footer_icon li:hover i {color: #161616;} .col_footer{float: left; width: 33.32%; padding: 40px 40px 0px 40px; min-height: 620px; padding-bottom: 0;} .col_footer.middle {border-right: 1px solid #242424;border-left: 1px solid #242424;} .footer_logo { float: left; padding: 0px 30px 0px 0px;} #footer h2 {color: white; text-transform: uppercase; margin-bottom: 30px;} #subfooter { background-color: #141414; border-top: 1px solid #242424; font-size: 12px; padding: 20px 15px; padding-bottom: 70px;} #subfooter a { font-weight: bold;} .by_author {float: right;} .copyright {float: left;} #footer a {color:#c4c4c4;} #footer input, #footer textarea {background-color: #141414; border:1px solid #272727;outline: none;width: 100%; margin-bottom:10px; padding:10px 10px; font-size: 12px; font-weight: bold;} #footer .submit_buttom {color:white; } /*================================================= 25 - SKILLS =================================================*/ .skill .bar {height: 35px;width: 0;} .skill .skillbar { height: 36px; background: #dfdfdf; margin: 0 0 10px 0;} .skill .skilltitle { color: #fff; top: 9px; left: 15px; position: absolute;} .skill h4 {margin-bottom:5px;} .percent { float: right; color: white; font-weight: bold; margin-top: 5px; margin-right: 5px; font-size: 18px;} /*================================================= 16 - VIDEO RESPONSIVE =================================================*/ /*================================================= 26 - BUTTONS =================================================*/ /* BUTTON READ MORE WHITE */ .read_more {border: 2px solid white; display: inline-flex; padding: 8px 30px; margin: 10px 0px; -moz-transition: .15s ease-in-out; -webkit-transition: .15s ease-in-out; -o-transition: .15s ease-in-out; -ms-transition: .15s ease-in-out; transition: .15s ease-in-out;text-transform: uppercase; font-weight: bold; letter-spacing: 2px; font-size: 14px;} /* BUTTON READ MORE BLACK */ .read_more.black {border: 2px solid #CECECE; } .read_more.black a { color: #b7b7b7;} .read_more.black:hover a {color: white;} /*================================================= 27 - ICONS =================================================*/ /* GLYFY ICONS*/ .icon.gray { background: url(images/icons/icons-gray.png) no-repeat; border: none; } .icon.calendar { background-position: -171px -138px; width: 20px; height: 20px; padding-right: 25px; } .icon.user { background-position: -103px 0; width: 20px; height: 20px; padding-right: 25px; } .icon.comments { background-position: -307px -1028px; width: 20px; height: 15px; padding-right: 25px; } /*================================================= 28 - TESTIMONIALS =================================================*/ .testimonials_heading .parallax_heading{margin-top:80px;} /* FIX FOR PUSH THE TESTIMONIALS CONTENT DOWN*/ .testimonials_text {font-weight: lighter; font-size: 24px; color: white; line-height: 40px;} .testimonials_name {font-weight: bold;margin-top: 10px;margin-bottom: 0;} /*================================================= 29 - PARALLAX SECTIONS =================================================*/ .parallax_heading { margin-bottom: 50px;} .parallax_over.nobottom {padding:0; padding-top:80px;} .parallax_heading h2 {color:white; font-size: 45px; text-transform: uppercase; line-height: 35px;} .parallax_subtitle {color:white; text-transform: uppercase; font-size: 13px; letter-spacing: 1px; padding:10px 0px;} .parallax {/* min-height: 650px; */ position: relative; color:white; text-align: center; background-size:cover; background-attachment:fixed;} .parallax_over {height: 100%; background-color: rgba(153,148,146,.25); width: 100%; overflow: hidden; padding: 100px 0px;} .parallax_content_wrapper {padding: 80px 0px;} .feature_item h3 {color:white;} .feature_item {text-align: left; margin-bottom: 40px;} .feature_item i{border: 3px solid white; width: 50px; height: 50px; -webkit-border-radius: 100px; -moz-border-radius: 100px; border-radius: 100px; float: left; padding: 14px; padding-top: 15px; margin-right: 20px; margin-bottom: 40px;} /*================================================= 30 - ANIMATIONS =================================================*/ .animated { visibility: hidden; } .bounceInLeft, .bounceInRight, .fadeInUp, .fadeInUpDelay, .fadeInDown, .fadeInUpD, .fadeInLeft, .fadeInRight, .zoomIn, .bounce, .fadeIn { visibility: visible; } .delay-05s { animation-delay: 0.5s; -webkit-animation-delay: 0.5s; } .delay-1s { animation-delay: 1s; -webkit-animation-delay: 1s; } /*================================================= 31 - MEDIA QUERIES =================================================*/ /* QUERIES FROM 1620px TO 1200px */ @media only screen and (min-width: 1200px) { .grid .portfolio-item {height: 350px;} .grid .portfolio-item p {padding:0;} .grid .portfolio-item h2 { font-size: 26px;} .grid .portfolio-item.effect {padding: 0px; } /*14px*/ .portfolio-item div.figcaption > span {margin-top: -4px;} .grid .portfolio-item.effect div.figcaption { height: 55px;padding-top: 10px;} .service_custom_column {width: 33.3%;} .team_item {height: 380px} .team_description {bottom: -5px;padding-left: 15px;} .team_description h2 {font-size: 25px;letter-spacing: 0;} .team_description .job { font-size: 16px;} .video_caption {top:300px;} #logo_mobile{display:none;} } /* QUERIES FROM 1200px TO 992px */ @media only screen and (min-width: 992px) and (max-width: 1200px) { .grid .portfolio-item {height: 300px;} .grid .portfolio-item p {padding: 10px;font-size: 15px;margin-left: -20px;bottom: 105px;} .grid .portfolio-item h2 { font-size: 20px;} .portfolio-item div.figcaption > span {margin-top: -3px;} .grid .portfolio-item.effect div.figcaption { height: 50px;padding-top: 5px;} .grid .portfolio-item div.figcaption span i {padding: 8px;font-size: 16px;} .grid.two_columns .portfolio-item {height: 450px;} .grid.two_columns .portfolio-item p {top: -220px;} .menu_trigger {display: block;} .main_nav {display: none;} .responsive_nav {display: block;} .social_nav { margin-right: 0;} .service_custom_column {width: 33.3%;} .about_content {padding: 0px;} .team_item {width: 50%;} .section {padding: 100px 0px;} .process_item_icon_right .process_icon {margin-left: 30px;margin-bottom: 0;} .process_item .process_icon {margin-left: 30px;margin-bottom: 0;} .process_item_icon_right p {display: inline-block; margin-top:10px;} .process_item p {display: inline-block; margin-top:10px;} .testimonials_heading .parallax_heading {margin-top: 40px;} .video_caption {top:200px;} .mCustomScrollBox { height:86%; } .section{ margin-top: -101px; } .mobile_nav_trigger{ display:none; } .about_image {height: 101%;} .divider_padding {padding-bottom: 0px;} #mappa-sito li { display: inline; padding-right: 22px; }#logo_mobile{display:none;} #subfooter { font-size: 11px; } #rightTop { border-bottom: 1px solid; color: #ffffff; float: right; font-size: 12px; height: 37px; line-height: 37px; margin-right: 45px; text-align: right; width: 390px; } #leftTop { border-bottom: 1px solid; color: #ffffff; float: left; font-size: 12px; height: 37px; line-height: 37px; margin-left: 15px; width: 410px; } #headerContent { height: 109px; margin: 0 auto; width: 915px; margin-left: 50px; } /** * #headerContent { * height: 109px; * margin: 0 auto; * width: 960px; * margin-left: 30px; * } */ #logo { margin-left: -75px; } input { width: 102%!important; } #rightHeader ul { margin-right: 4px; } #leftHeader { margin-left: -30px; } } /* QUERIES FROM 992px TO 768px */ @media only screen and (min-width: 768px) and (max-width: 992px) { .about_content {padding: 10px;} .menu_trigger {display: block;} .main_nav {display: none;} .responsive_nav {display: block;} .social_nav { margin-right: 0;} .service_custom_column {width: 50%;} .about_image {display: block;} .team_item {width: 50%;} .process_image { display: none;} #service_tab_triggers ul li i {font-size: 40px;padding: 0;margin-top: 30px;} #service_tab_triggers ul li a {height: 100px;width: 100px;} .service_wrapper.style2 h1 {line-height: 35px;font-size: 22px;} #video_parallax { height: 450px;} #faq h3 {margin-top:50px;} .faq_icons {margin-top: -20px;} .blog-item-home {height: 400px;} .feature_item {text-align: center;margin-bottom: 0;} .feature_item i {margin-right: 0;margin-bottom: 10px;margin-top: 30px;float:none;} .testimonials_heading .parallax_heading {margin-top: 40px;} #colums_triggers{display: none;} .video_caption {top:100px;} /* PORTFOLIO */ .grid .portfolio-item {width:49.90%; height: 350px} .grid .portfolio-item p {padding: 10px;font-size: 15px;margin-left: -20px;} .grid.two_columns .portfolio-item {width:49.90%; height: 350px} .grid.two_columns .portfolio-item p {padding: 10px;font-size: 15px;margin-left: -20px;} .grid.four_columns .portfolio-item {width:49.90%; height: 350px} .grid.four_columns .portfolio-item p {padding: 10px;font-size: 15px;margin-left: -20px;} .grid .portfolio-item h2 { font-size: 20px;} .portfolio-item div.figcaption > span {margin-top: -8px;} .grid .portfolio-item.effect div.figcaption { height: 50px;padding-top: 8px;} .grid .portfolio-item div.figcaption span i {padding: 10px;font-size: 18px;} #filters {float: none;display: table;margin: 0 auto;margin-bottom: 20px;} .pricing-table {margin-top: 30px;} .parallax_heading h2 {font-size: 25px;} .parallax .picture {display: none;} /* FOOTER */ .col_footer.middle {border-top: 1px solid #242424;border-bottom: 1px solid #242424;} .col_footer {width: 100%;} } @media only screen and (max-width:800px){ #header-wrapper {display: none;} .responsive_nav { display: block; margin-top: -70px; }.about_image {height: 100%;margin-left: 0;width: 100%;} #img-lastoria{display:none;} #sfondo-lastoria{display:block;} #box_left { width: 100%;} #img-officina{display:none;} #sfondo-officina{display:block;} #box_right { width: 100%;} #img-rentals{display:none;} #sfondo-rentals{display:block;} #box-left_rentals{width:100%} #modal-accessori{margin-top: 100px;} #modal-link{margin-top: 100px;} #modal-rentals{margin-top: 100px;} #city {display:none;} .copyright {width: 55%;} #mappa-sito li {display: inline;padding-right: 15px;} #modal-privacy{margin-top:100px;} .menu_trigger i {padding: 17px;} #logo_mobile { display: block; margin-top: 190px; z-index: 99; position: absolute; margin-left: 340px; }.didascalia{display:none;} .forcefullwidth_wrapper_tp_banner{margin-top:-10px!important;} .copyright { width: 56%; line-height: 15px; } .responsive_nav { margin-top: 0; position: fixed; width: 100%; } } @media only screen and (max-width:768px){ #header-wrapper {display: none;} .responsive_nav { display: block; margin-top: -70px; }.about_image {height: 100%;margin-left: 0;width: 100%;} #img-lastoria{display:none;} #sfondo-lastoria{display:block;} #box_left { width: 100%;} #img-officina{display:none;} #sfondo-officina{display:block;} #box_right { width: 100%;} #img-rentals{display:none;} #sfondo-rentals{display:block;} #box-left_rentals{width:100%} #modal-accessori{margin-top: 100px;} #modal-link{margin-top: 100px;} #modal-rentals{margin-top: 100px;} #city {display:none;} .copyright {width: 55%;} #mappa-sito li {display: inline;padding-right: 20px;} #modal-privacy{margin-top:100px;} .didascalia{display:none;} #logo_mobile { display: block; margin-top: 190px; z-index: 99; position: absolute; margin-left: 320px; } .responsive_nav { margin-top: 0; position: fixed; width: 100%; z-index: 9999; } .divider_padding { padding-bottom: 50px; } .mCustomScrollBox { height: 138%; } #box-scroll { height: 140px; } .verificadisponibilita-mobile{ display: block; } .migliortariffa{ display: none; } .TA_selfserveprop{ height: 240px; } } @media only screen and (max-width:640px){ #header-wrapper {display: none;} .responsive_nav {display: block;} .about_image {height: 100%;margin-left: 0;width: 100%;} #img-lastoria{display:none;} #sfondo-lastoria{display:block;} #box_left { width: 100%;} #img-officina{display:none;} #sfondo-officina{display:block;} #box_right { width: 100%;} #img-rentals{display:none;} #sfondo-rentals{display:block;} #box-left_rentals{width:100%} #modal-accessori{margin-top: 100px;} #modal-link{margin-top: 100px;} #modal-rentals{margin-top: 100px;} #city {display:none;} #mappa-sito {margin: 0px auto 0;width: 100%;} .copyright {float: left;text-align: left;} #modal-privacy{margin-top:100px;} .didascalia{display:none;} #logo_mobile { display: block; margin-left: 250px; margin-top: 100px; position: absolute; z-index: 99; } .responsive_nav { margin-top: 0; position: fixed; width: 100%; z-index: 9999; } .verificadisponibilita-mobile{ display: block; } .migliortariffa{ display: none; } .TA_selfserveprop{ height: 240px; } #cookieChoiceInfo { padding: 4px 30px 4px 4px!important; width: auto!important; line-height: 15px; } } @media only screen and (max-width: 600px) { #mappa-sito{ margin: 0px auto 0; } .responsive_nav { margin-top: 0; position: fixed; width: 100%; z-index: 999; } #logo_mobile { display: block; margin-left: 210px; margin-top: 90px; position: absolute; z-index: 99; } .verificadisponibilita-mobile{ display: block; } .migliortariffa{ display: none; } #cookieChoiceInfo { padding: 4px 30px 4px 4px!important; width: auto!important; line-height: 15px; } } @media only screen and (max-width:480px){ #header-wrapper {display: none;} .responsive_nav {display: block; z-index: 999;} .about_image {height: 100%;margin-left: 0;width: 100%;} #img-lastoria{display:none;} #sfondo-lastoria{display:block;} #box_left { width: 100%;} #img-officina{display:none;} #sfondo-officina{display:block;} #box_right { width: 100%;} #img-rentals{display:none;} #sfondo-rentals{display:block;} #box-left_rentals{width:100%} #modal-accessori{margin-top: 100px;} #modal-link{margin-top: 100px;height: 260px;} #modal-rentals{margin-top: 100px;} #city {display:none;} #modal-privacy{margin-top:100px;} .didascalia{display:none;} #logo_mobile { display: block; margin-left: 170px; margin-top: 130px; position: absolute; z-index: 99; } #footer { height: 550px; } .verificadisponibilita-mobile{ display: block; } .migliortariffa{ display: none; } .widSSP { height: 215px !important; margin-top: 232px !important; } #footer-social { width: 300px; } #cookieChoiceInfo { padding: 4px 30px 4px 4px!important; width: auto!important; line-height: 15px; } } @media only screen and (max-width:360px){ #header-wrapper {display: none;} .responsive_nav {display: block; z-index: 999;} .about_image {height: 100%;margin-left: 0;width: 100%;} #img-lastoria{display:none;} #sfondo-lastoria{display:block;} #box_left { width: 100%;} #img-officina{display:none;} #sfondo-officina{display:block;} #box_right { width: 100%;} #img-rentals{display:none;} #sfondo-rentals{display:block;} #box-left_rentals{width:100%} .box-contatti {font-size: 24px;} #footer-social {width: 329px;} .footer_icon li {margin-left: 8px;} #modal-accessori{margin-top: 100px;} #modal-link{margin-top: 100px;height: 290px;} #modal-rentals{margin-top: 100px;} #city {display:none;} #modal-privacy{margin-top:100px;} .didascalia{display:none;} #logo_mobile {display: block;margin-left: 100px;margin-top: 70px;position: absolute;z-index: 99;} #footer {height: 410px;} #mappa-sito li {padding-right: 17px;} .holder {width: 130px;} .holder a {font-size: 15px;} .by_author { line-height: 30px; float:left!important; } .copyright { width: 100%; } #cookieChoiceInfo{ padding-left: 5px!important; padding-right: 26px!important; width: 360px!important; } .verificadisponibilita-mobile{ display: block; } .migliortariffa{ display: none; } #footer { height: 390px; } #cookieChoiceInfo { padding: 4px 30px 4px 4px!important; width: auto!important; line-height: 15px; } } @media only screen and (max-width:320px){ #header-wrapper {display: none;} .responsive_nav {display: block; z-index: 999;} .about_image {height: 100%;margin-left: 0;width: 100%;} #img-lastoria{display:none;} #sfondo-lastoria{display:block;} #box_left { width: 100%;} #img-officina{display:none;} #sfondo-officina{display:block;} #box_right { width: 100%;} #img-rentals{display:none;} #sfondo-rentals{display:block;} #box-left_rentals{width:100%} .box-contatti {font-size: 22px;} #footer-social { width: 68px; } .footer_icon li {margin-left: 8px;} #mappa-sito {margin: 122px auto 0;} #modal-accessori{margin-top: 100px;} #modal-link{margin-top: 100px;} #modal-rentals{margin-top: 100px;} #city {display:none;} #footer {height: 276px;} .didascalia{display:none;} #logo_mobile {display: block;margin-left: 80px;margin-top: 60px;position: absolute;z-index: 99;} #footer {height: 410px;margin-left: -120px;} #mappa-sito {margin: 40px 117px 0px;width: 292px;} #mappa-sito li {padding-right: 8px;} .holder {width: 130px;} .holder a {font-size: 15px;} #cookieChoiceInfo{ padding-left: 5px!important; padding-right: 25px!important; width: 320px!important;} .grid .portfolio-item { height: 250px!important; } .verificadisponibilita-mobile{ display: block; } .migliortariffa{ display: none; } #footer { height: 430px; } .widSSP { width: 180px!important; } #cookieChoiceInfo { padding: 4px 30px 4px 4px!important; width: auto!important; line-height: 15px; } } /* QUERIES FROM 767px TO 480px */ @media only screen and (min-width: 480px) and (max-width: 767px) { header {height: 59px;} #logo {margin-top: 15px;} .menu_trigger i {padding: 14px;} .menu_trigger {display: block;} .main_nav {display: none;} .responsive_nav {display: block; z-index: 9999;} .service_custom_column {width: 100%;padding: 30px;} .about_image {display: block;} .team_item {width: 100%;} .social_nav { display:none;} #welcome {padding: 50px 0px;width: 100%;margin-top: 30px;font-size: 18px;line-height: 30px;} .title {font-size: 25px!important;line-height: 35px;letter-spacing: 0;margin-bottom: 10px;} .section {padding: 0px;} .page_title {margin-bottom: 50px;} .team_description {bottom: 0;padding-left: 20px;} .team_description h2 {font-size: 28px;letter-spacing: 0;} .team_description .job { font-size: 18px;} .about_content {padding:20px 0;} #faq h3 {margin-top:50px;} .faq_icons {margin-top: -20px;} #service_tab_triggers ul li i {font-size: 30px;padding: 0;margin-top: 27px;} #service_tab_triggers ul li a {height: 80px;width: 80px;} #service_tab_triggers{margin-bottom: 0!important;} #service_tab_triggers li a {margin-right: 10px;} .process_image { display: none;} .service_wrapper.style2 h1 {line-height: 35px;font-size: 22px;} .service_wrapper.style4 .icon_wrapper {padding-bottom: 70px;} .pricing-table {margin-top: 30px;} .testimonials_heading .parallax_heading {margin-top: 0;} .testimonials_text {font-size: 18px;line-height: 30px;} .parallax_over{padding:50px 0px;} #video_parallax { height: 400px;} .blog-item-home {height: 350px;} .service_wrapper.style4 .icon_wrapper { margin-left: 0;} .feature_item {text-align: center;margin-bottom: 0;} .feature_item i {margin-right: 0;margin-bottom: 10px;margin-top: 30px;float:none;} #colums_triggers{display: none;} /* PORTFOLIO */ .grid .portfolio-item {width:49.90%; height: 250px} .grid .portfolio-item p {padding: 10px;font-size: 15px;margin-left: -20px;bottom: 80px;} .grid.two_columns .portfolio-item {width:49.90%; height: 250px} .grid.two_columns .portfolio-item p {padding: 10px;font-size: 15px;margin-left: -20px;bottom: 80px;} .grid.four_columns .portfolio-item {width:49.90%; height: 250px} .grid.four_columns .portfolio-item p {padding: 10px;font-size: 15px;margin-left: -20px;bottom: 80px;} .grid .portfolio-item h2 { font-size: 16px;} .portfolio-item div.figcaption > span {margin-top: -8px;} .grid .portfolio-item.effect div.figcaption { height: 45px;padding-top: 5px;} .grid .portfolio-item div.figcaption span i {padding: 5px;font-size: 14px;} #filters {float: none;display: table;margin: 0 auto;margin-bottom: 20px;} /* FOOTER */ .col_footer.middle {border-top: 1px solid #242424;border-bottom: 1px solid #242424;} .col_footer {width: 100%;} .footer_icon li {margin-bottom:10px;} .parallax_heading h2 {font-size: 25px;} .parallax .picture {display: none;} /*VIDEO STYLE CAPTIONS */ .video_caption {top:150px; width:300px; margin-left:-150px;} .video_text_small { font-size:25px;padding: 10px 0px; } .video_text_big {font-size:40px;padding: 0px 0px 10px 0px;} .custom_button a.video {margin-left: 0;} .video_logo {padding: 0;} } /* QUERIES FROM 480px and less than 480px */ @media only screen and (max-width: 480px) { header {height: 59px;} #logo {margin-top: 15px;} .menu_trigger i {padding: 14px;} .menu_trigger {display: block;} .main_nav {display: none;} .responsive_nav { display: block; margin-top: 0; position: fixed; width: 100%; z-index: 9999; } .about_image {display: block;} .service_custom_column {width: 100%;} .team_item {width: 100%; height: 280px} .about_content {padding:20px 0;} #welcome {padding: 50px 0px;width: 100%;margin-top: 30px;font-size: 18px;line-height: 30px;} .title {font-size: 25px!important;line-height: 35px;letter-spacing: 0;margin-bottom: 10px;} .section {padding: 0px;} .page_title {margin-bottom: 50px;} .team_description {bottom: -5px;padding-left: 15px;} .team_description h2 {font-size: 25px;letter-spacing: 0;} .team_description .job { font-size: 16px;} .service_wrapper.style2 h1 {line-height: 35px;font-size: 22px;} #service_tab_triggers ul li i {font-size: 30px;padding: 0;margin-top: 27px;} #service_tab_triggers ul li a {height: 80px;width: 80px;} #service_tab_triggers{margin-bottom: 0!important;} #service_tab_triggers li a {margin-right: 10px;} .process_image { display: none;} .social_nav { display:none;} .pricing-table {margin-top: 30px;} #video_parallax { height: 350px;} .service_wrapper.style4 .icon_wrapper { margin-left: 0;} .blog-item-home {height: 300px;} .testimonials_heading .parallax_heading {margin-top: 0;} .testimonials_text {font-size: 16px;line-height: 30px;} .parallax_over{padding:40px 0px;} #faq h3 {margin-top:50px;} .faq_icons {margin-top: -20px;} .read_next_story, .read_prev_story { display: none;} .parallax_heading h2 {font-size: 25px;} .parallax .picture {display: none;} .feature_item {text-align: center;margin-bottom: 0;} .feature_item i {margin-right: 0;margin-bottom: 10px;margin-top: 30px;float:none;} #colums_triggers{display: none;} .copyright {float: left;text-align: left;} .by_author {text-align: right;float: none;line-height: 13px;} /* PORTFOLIO */ .grid .portfolio-item {width:100%; height: 300px} .grid .portfolio-item p {padding: 10px;font-size: 15px;margin-left: -20px;} .grid.two_columns .portfolio-item {width:100%; height: 300px} .grid.two_columns .portfolio-item p {padding: 10px;font-size: 15px;margin-left: -20px;} .grid.four_columns .portfolio-item {width:100%; height: 300px} .grid.four_columns .portfolio-item p {padding: 10px;font-size: 15px;margin-left: -20px;} .grid .portfolio-item h2 { font-size: 16px;} .portfolio-item div.figcaption > span {margin-top: -8px;} .grid .portfolio-item.effect div.figcaption { height: 45px;padding-top: 5px;} .grid .portfolio-item div.figcaption span i {padding: 5px;font-size: 14px;} #filters {float: none;display: table;margin: 0 auto;margin-bottom: 20px;} /* FOOTER */ .col_footer.middle {border-top: 1px solid #242424;border-bottom: 1px solid #242424;} .col_footer {width: 100%;} .footer_icon li {margin-bottom:10px;} /*VIDEO STYLE CAPTIONS */ .video_caption {top:100px; width:200px; margin-left:-100px;} .video_logo {padding: 0;} } .fancybox-close { position: absolute; top: -18px; left: -18px; width: 36px; height: 36px; cursor: pointer; z-index: 8040; } #cookieChoiceDismiss { background: #ddd url("img/close-icon.png") no-repeat scroll 3px 3px; cursor: pointer; display: block; font-family: icons; font-size: 105px; height: 100%; line-height: 64px; position: absolute; right: 0; top: 0; width: 30px; }