/* Table of Contents
- - - - - - - - -
1. Global
2. Headers
3. Home Pages
4. Projects
5. Inner Pages
6. Blog
7. Shortcodes
8. Shop
9. Footer
10. Media Queries
- - - - - - - - -
*/

/* ========================
1 = Global
======================== */

body { background: #fff; color: #4a4a4a; font-family: 'PT Sans', sans-serif; font-size: 14px; font-style: normal; font-weight: normal; margin: 0; position: relative;}

/* ========================
Modal Fullscreen & Centered Fix
======================== */
.modal-dialog-centered {
    display: flex;
    align-items: center;
    min-height: calc(100% - 1rem);
    margin: 0.5rem auto;
}

/* Modal Appuntamento - Vero Fullscreen */
#myModalappuntamento.modal.modal-fullscreen {
    padding: 0 !important;
    overflow: hidden !important;
}

#myModalappuntamento.modal .modal-dialog,
#myModalappuntamento .modal-dialog.modal-dialog-centered {
    width: 100vw !important;
    height: 100vh !important;
    max-width: 100vw !important;
    min-height: 100vh !important;
    margin: 0 !important;
    padding: 0 !important;
    transform: none !important;
}

#myModalappuntamento .modal-content {
    width: 100% !important;
    height: 100vh !important;
    max-height: 100vh !important;
    border: none !important;
    border-radius: 0 !important;
    display: flex !important;
    flex-direction: column !important;
}

#myModalappuntamento .modal-header {
    flex-shrink: 0;
    padding: 12px 20px;
    background: #3190E7;
    color: #fff;
    border: none;
    min-height: 50px;
}

#myModalappuntamento .modal-header .close {
    color: #fff;
    opacity: 1;
    font-size: 28px;
    text-shadow: none;
    margin: -5px -10px -5px auto;
}

#myModalappuntamento .modal-header .close:hover {
    color: #fff;
    opacity: 0.8;
}

#myModalappuntamento .modal-title,
#myModalappuntamento .modal-header h5 {
    color: #fff;
    font-size: 18px;
    margin: 0;
    line-height: 1.4;
}

#myModalappuntamento .modal-body {
    flex: 1 1 auto !important;
    padding: 0 !important;
    overflow: hidden !important;
    height: calc(100vh - 50px) !important;
}

#myModalappuntamento .modal-body .resx {
    width: 100% !important;
    height: 100% !important;
}

#myModalappuntamento .modal-body object,
#myModalappuntamento .modal-body iframe,
#myModalappuntamento .modal-body #MyFramec {
    width: 100% !important;
    height: 100% !important;
    min-height: calc(100vh - 60px) !important;
    border: none !important;
    display: block;
}

#myModalappuntamento .modal-footer {
    display: none !important;
}

#myModalappuntamento .modal-footer + br {
    display: none !important;
}

/* Altri modal fullscreen generici */
.modal-fullscreen .modal-dialog {
    width: 100%;
    max-width: 95%;
    margin: 1.75rem auto;
}

.modal-fullscreen .modal-content {
    border-radius: 8px;
    max-height: 90vh;
    overflow-y: auto;
}

.modal-fullscreen .modal-body {
    padding: 20px;
}

/* Modal centered fix per Bootstrap 3 */
.modal-dialog-centered {
    display: flex;
    align-items: center;
    min-height: calc(100% - 1rem);
}

@media (max-width: 768px) {
    .modal-fullscreen .modal-dialog {
        width: 100%;
        max-width: 100%;
        margin: 10px;
    }

    .modal-fullscreen .modal-content {
        max-height: 95vh;
        border-radius: 0;
    }

    /* Modal appuntamento mobile */
    #myModalappuntamento .modal-header {
        padding: 10px 15px;
        min-height: 45px;
    }

    #myModalappuntamento .modal-title,
    #myModalappuntamento .modal-header h5 {
        font-size: 16px;
    }

    #myModalappuntamento .modal-body {
        height: calc(100vh - 45px) !important;
    }

    #myModalappuntamento .modal-body object,
    #myModalappuntamento .modal-body iframe {
        min-height: calc(100vh - 55px) !important;
    }
}

/* ========================
Counter Box Styles - Dati Reali
======================== */
.counter-box {
    display: block;
    background: #f6f6f6;
    padding: 12px 10px;
    text-align: center;
    border-radius: 8px;
    box-shadow: 0 2px 8px rgba(0,0,0,0.08);
    height: 100%;
}

.counter-box i {
    font-size: 28px;
    color: #3190E7;
    margin-bottom: 5px;
    display: block;
}

.counter-box .counter {
    display: block;
    font-size: 22px;
    font-weight: 700;
    color: #333;
    line-height: 1.2;
}

.counter-box p {
    margin: 5px 0 0;
    font-size: 11px;
    color: #666;
    line-height: 1.2;
}

/* Container dati reali scrolling verticale */
.demo#gfo {
    width: 100%;
    overflow: hidden;
    padding: 10px 0;
}

.demo#gfo .toutiao.demo2 {
    width: 100%;
    height: 130px !important;
    overflow: hidden;
}

.demo#gfo .toutiao.demo2 ul {
    list-style: none;
    margin: 0;
    padding: 0;
}

.demo#gfo .toutiao.demo2 ul li {
    display: block;
    width: 100%;
    height: 130px !important;
    margin-left: 0 !important;
}

/* Layout contatori - riga orizzontale dentro li */
#copied1,
#copied2,
#copied3,
#copied4 {
    display: flex !important;
    flex-wrap: nowrap;
    justify-content: center;
    align-items: stretch;
    gap: 8px;
    padding: 5px 15px;
    max-width: 1200px;
    margin: 0 auto;
    height: 120px;
}

#copied1 .col-md-2,
#copied2 .col-md-2,
#copied3 .col-md-2,
#copied4 .col-md-2 {
    flex: 1 1 0;
    min-width: 100px;
    max-width: 160px;
    padding: 0;
    float: none;
}

/* Nascondi br.ren2 nella rotazione desktop */
#copied1 .ren2,
#copied2 .ren2,
#copied3 .ren2,
#copied4 .ren2 {
    display: none !important;
}

/* Su mobile #copy1 deve restare visibile - il JS gestisce la visibilità */
/* #copy1 e #copy2 vengono nascosti via JS dopo il clone su desktop */

/* Stile per #copy1 su mobile (quando .demo#gfo non esiste) */
#copy1 {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: stretch;
    gap: 10px;
    padding: 15px;
    max-width: 1200px;
    margin: 0 auto;
}

#copy1 .col-md-2 {
    flex: 0 0 auto;
    width: calc(50% - 10px);
    min-width: 140px;
    max-width: 200px;
    padding: 0;
    float: none;
}

#copy1 .ren2 {
    display: none !important;
}

@media (max-width: 480px) {
    #copy1 .col-md-2 {
        width: 100%;
        max-width: none;
    }
}

/* Media queries per contatori - responsivo */
@media (max-width: 1200px) {
    #copied1 .col-md-2,
    #copied2 .col-md-2,
    #copied3 .col-md-2,
    #copied4 .col-md-2 {
        min-width: 90px;
        max-width: 140px;
    }

    .counter-box .counter {
        font-size: 20px;
    }

    .counter-box i {
        font-size: 24px;
    }
}

@media (max-width: 992px) {
    .demo#gfo .toutiao.demo2,
    .demo#gfo .toutiao.demo2 ul li {
        height: 110px !important;
    }

    #copied1,
    #copied2,
    #copied3,
    #copied4 {
        height: 100px;
        gap: 6px;
        padding: 5px 10px;
    }

    #copied1 .col-md-2,
    #copied2 .col-md-2,
    #copied3 .col-md-2,
    #copied4 .col-md-2 {
        min-width: 80px;
        max-width: 120px;
    }

    .counter-box {
        padding: 8px 6px;
    }

    .counter-box .counter {
        font-size: 18px;
    }

    .counter-box i {
        font-size: 22px;
        margin-bottom: 3px;
    }

    .counter-box p {
        font-size: 10px;
    }
}

/* ========================
Cookie Consent Banner GDPR
======================== */
#cookie-consent-banner {
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    background: rgba(33, 33, 33, 0.98);
    color: #fff;
    padding: 20px;
    z-index: 99999;
    box-shadow: 0 -4px 20px rgba(0,0,0,0.3);
    display: none;
    max-height: 90vh;
    overflow-y: auto;
}

#cookie-consent-banner.show {
    display: block;
    animation: slideUp 0.3s ease;
}

@keyframes slideUp {
    from { transform: translateY(100%); opacity: 0; }
    to { transform: translateY(0); opacity: 1; }
}

.cookie-consent-container {
    max-width: 1000px;
    margin: 0 auto;
}

.cookie-consent-text {
    margin-bottom: 15px;
}

.cookie-consent-text h4 {
    color: #fff;
    margin: 0 0 8px;
    font-size: 18px;
}

.cookie-consent-text p {
    margin: 0;
    font-size: 14px;
    line-height: 1.5;
    color: #bbb;
}

.cookie-consent-text a {
    color: #3190E7;
    text-decoration: underline;
}

/* Cookie Categories */
.cookie-categories {
    background: rgba(255,255,255,0.05);
    border-radius: 8px;
    padding: 15px;
    margin: 15px 0;
}

.cookie-category {
    display: flex;
    align-items: center;
    padding: 12px 0;
    border-bottom: 1px solid rgba(255,255,255,0.1);
}

.cookie-category:last-child {
    border-bottom: none;
}

.cookie-category-info {
    flex: 1;
    margin-left: 15px;
}

.cookie-category-info strong {
    display: block;
    color: #fff;
    font-size: 14px;
    margin-bottom: 3px;
}

.cookie-category-info small {
    color: #999;
    font-size: 12px;
}

/* Toggle Switch */
.cookie-toggle {
    position: relative;
    display: inline-block;
    width: 50px;
    height: 26px;
    flex-shrink: 0;
}

.cookie-toggle input {
    opacity: 0;
    width: 0;
    height: 0;
}

.toggle-slider {
    position: absolute;
    cursor: pointer;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: #555;
    transition: 0.3s;
    border-radius: 26px;
}

.toggle-slider:before {
    position: absolute;
    content: "";
    height: 20px;
    width: 20px;
    left: 3px;
    bottom: 3px;
    background-color: white;
    transition: 0.3s;
    border-radius: 50%;
}

.cookie-toggle input:checked + .toggle-slider {
    background-color: #28CB75;
}

.cookie-toggle input:disabled + .toggle-slider {
    background-color: #28CB75;
    opacity: 0.6;
    cursor: not-allowed;
}

.cookie-toggle input:checked + .toggle-slider:before {
    transform: translateX(24px);
}

/* Buttons */
.cookie-consent-buttons {
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
    justify-content: center;
    margin-top: 15px;
}

.cookie-btn {
    padding: 12px 24px;
    border: none;
    border-radius: 5px;
    cursor: pointer;
    font-size: 14px;
    font-weight: 600;
    transition: all 0.3s ease;
}

.cookie-btn-accept {
    background: #28CB75;
    color: #fff;
}

.cookie-btn-accept:hover {
    background: #22a862;
}

.cookie-btn-reject {
    background: transparent;
    color: #fff;
    border: 1px solid #666;
}

.cookie-btn-reject:hover {
    background: #444;
}

.cookie-btn-settings {
    background: transparent;
    color: #3190E7;
    border: 1px solid #3190E7;
}

.cookie-btn-settings:hover {
    background: #3190E7;
    color: #fff;
}

.cookie-btn-save {
    background: #3190E7;
    color: #fff;
}

.cookie-btn-save:hover {
    background: #2678c7;
}

@media (max-width: 768px) {
    #cookie-consent-banner {
        padding: 15px;
    }

    .cookie-consent-buttons {
        flex-direction: column;
    }

    .cookie-btn {
        width: 100%;
        text-align: center;
    }

    .cookie-category {
        flex-wrap: wrap;
    }

    .cookie-category-info {
        width: 100%;
        margin-left: 0;
        margin-top: 8px;
    }
}
.row { margin: 0 auto; max-width: 1170px; width: 100%; }
.row.full-width {  margin: 0 auto; max-width: 100%; width: 100%; }
.row.custom-width-90 {  margin: 0 auto; max-width: 90%; width: 90%; }
.row.full-width-padding {  margin: 0 auto; max-width: 98%; width: 98%; }
.row.no-gutter { margin:0 auto;}
.row.no-gutter [class*='col-']:not(:first-child), .row.no-gutter [class*='col-']:not(:last-child) { padding-left: 0; padding-right: 0; }
.row.no-gutter-all { margin:0 auto;}
.row.no-gutter-all [class*='col-'] { padding-left: 0; padding-right: 0; }
.center-block { float: none; }
a { color: #36A8FF; outline: 0; text-decoration: none; }
a:hover, a:active, a:focus { outline: 0; text-decoration: none; color:#000; }
code { background: #666; border: 0; border-radius: 6px; color: #fff; display: block; font-family: consolas, monaco, 'andale mono', monospace; font-weight: normal; line-height: 1.3; margin: 8px 0; padding: 12px; white-space: -moz-pre-wrap; white-space: -o-pre-wrap; white-space: pre-wrap; }
mark { color: #fff; padding: 1px 4px; border-radius: 2px; font-weight: 600; background:#3190E7;}
img {  max-width: 100%;  height: auto; -ms-interpolation-mode: bicubic; display: inline-block;  vertical-align: middle;}
.center-block { float: none; }
.alignright {float:right; padding-left:35px;}
.alignleft {float:left; padding-right:35px;}
.spacing-45 {padding-top:45px;}
.spacing-65 {padding-top:65px;}


/* Ηeadings */
h1, h2, h3, h4, h5, h6 { font-family: 'Lato', sans-serif; letter-spacing:-0.02em; font-weight: 900; line-height: 1.3; margin-bottom: 12px; margin-top: 12px; text-rendering: optimizelegibility;}
h1 { font-size: 44px; }
h2 { font-size: 34px; }
h3 { font-size: 27px; }
h4 { font-size: 23px; }
h5 { font-size: 17px; }
h6 { font-size: 14px; }
/* End of Ηeadings */

p { font-family: inherit; font-size: 17px; line-height: 1.5; margin: 0 0 17px 0;  font-weight: 300;}
ul li, ol li { font-family: inherit; font-size: 17px; line-height: 1.5; font-weight: 300;}
hr { border: solid #999; border-width: 1px 0 0; clear: both; height: 0; margin: 21px 0; }
hr.small { border: solid #313740; border-width: 1px 0 0; clear: both; height: 0; margin: 0 auto; margin-top:21px; margin-bottom:21px; max-width:100px;}

/* Forms */
input[type="text"].form-control, input[type="password"].form-control, input[type="date"].form-control, input[type="datetime"].form-control, input[type="email"].form-control, input[type="number"].form-control, input[type="search"].form-control, input[type="tel"].form-control, input[type="time"].form-control, input[type="url"].form-control { font-size: 18px; height: 55px; padding: 5px 15px; width: 100%; }
textarea.form-control { font-size: 18px;padding: 15px; width: 100%; }
select.form-control { font-size: 18px; height: 55px; padding: 5px 15px; width: 100%; }
button[type="submit"] { background: #3190E7; border: 0; border-bottom-left-radius: 0; border-bottom-right-radius: 5px; border-radius: 4px; border-top-left-radius: 0; border-top-right-radius: 5px; color: #fff; cursor: pointer; float: left; font-size: 16px; font-weight: 900; height: 55px; padding: 8px 6px 6px; text-transform: uppercase; width: 100%; }
button[type="submit"]:hover { background: #666; }
input[type="text"].form-control:focus, input[type="password"].form-control:focus, input[type="date"].form-control:focus, input[type="datetime"].form-control:focus, input[type="email"].form-control:focus, input[type="number"].form-control:focus, input[type="search"].form-control:focus, input[type="tel"].form-control:focus, input[type="time"].form-control:focus, input[type="url"].form-control:focus, textarea.form-control:focus, select:focus { box-shadow: none; }

/* Bootstrap 5 columns */
.col-xs-15, .col-sm-15, .col-md-15, .col-lg-15 {    position: relative;    min-height: 1px;    padding-right: 10px;    padding-left: 10px;}

/* ========================
2 = Headers
======================== */

/* HEADER 1  ---------------------- */
#hw-hero {position: relative;}

.header.header1 {position:absolute; top:0;  z-index:9999; width:100%;}
.header.header1 .topbar { padding:12px 0 5px; margin:0; }
.header ul.phone {margin:0; padding:0; list-style:none;}
.header ul.phone li {float:left; font-size:14px; font-weight:500; color:#fff; margin-right:20px; letter-spacing: .045em; padding:0;}

.header ul.phone li i {color:#fff; text-align: center; font-size:14px; padding-top:5px; margin:0;}
.header ul.phone li i:hover {color:#E1E3E4;}

.header ul.toplinks {margin:0; padding:0; list-style:none; float:right;}
.header ul.toplinks li {float:left; font-size:13px; color:#fff; letter-spacing: .025em; padding:0 10px; font-weight:500;}
.header ul.toplinks li:last-child {padding-right:0;}
.header ul.toplinks li a {text-align: center; font-size:13px; color:#fff; }
.header ul.toplinks li a:hover {color:#E1E3E4;}
.header ul.toplinks li i {font-size:14px; padding-top:2px;}
.header ul.toplinks li span.badge {background:#28CB75; padding:3px 6px; font-size:10px; margin:-11px 0 0 0;}

.header .logonav {background:#fff; margin-top:5px; padding:0;  }
.header .logo {margin-top:0px; padding-left:0px;}

#index-slider {display:none;}
#index-slider .sp-slide:after {background:#055AA8; opacity:.8; bottom:0px; content:""; left:0; position:absolute; right:0; top:0; }
#index-slider .sp-slide .hw-the-slider-content { display: block; margin:0 auto; position:absolute; text-align: center; z-index: 2; left: 0;  right: 0;  top: 60%;  -webkit-transform: translateY(-60%);  -ms-transform: translateY(-50%);  transform: translateY(-50%);}
#index-slider .sp-slide .hw-the-slider-container {  display: table;    margin: 0;    padding: 0;    width: 100%;    z-index: 1;    text-align: center;}
#index-slider .sp-slide .hw-the-slider-captions {    display: table-cell;    margin: 0;    padding: 0 100px;    vertical-align: middle;    width: 100%;    z-index: 1;}
#index-slider .sp-slide h2 {color: #fff; text-transform: uppercase; font-size:47px; margin-bottom:35px;}
#index-slider .sp-slide p{  color: #fff; font-size:18px; margin-bottom:55px;}
#index-slider .sp-slide a.hw-btn {background:#28cb75; color:#fff; font-weight:700; letter-spacing: .06em; text-transform: uppercase; font-size:13px; border-radius: 2px;  padding: 15px 30px; transition: background-color 1s ease 0s;}
#index-slider .sp-slide a.hw-btn:hover {background:#0CB863;}

#index-slider .sp-buttons { position: absolute;  width: 100%;  text-align: center;  bottom:15px;}
#index-slider .sp-button {width: 20px; height: 20px; background: #fff none repeat scroll 0 0; border: 0; border-radius: 50%; margin: 4px;  display: inline-block; -moz-box-sizing: border-box;  -webkit-box-sizing: border-box;  box-sizing: border-box;  cursor: pointer;  transform: translate3d(0px, -50%, 0px) scale(0.4); transform-origin: 50% 50% 0;    transition: all 250ms ease-out 0s;}
#index-slider .sp-selected-button, #index-slider .sp-button:hover { background: #28CB75 none repeat scroll 0 0; transform: translate3d(0px, -50%, 0px) scale(0.8);}
#index-slider .sp-arrow { width: 15px; height: 22px;}

/* HEADER SLIDER (index2.html)  ---------------------- */
#index-slider2 {display:none;}
#index-slider2 .sp-mask { background: #666;}
#index-slider2 .sp-slide:after { background: #8C8C8C; opacity:.7; bottom:0px; content:""; left:0; position:absolute; right:0; top:0;}
#index-slider2 .sp-slide .hw-the-slider-content { display: block; margin:0 auto; position:absolute; text-align: center; z-index: 2; left: 0;  right: 0;  top: 50%;  -webkit-transform: translateY(-50%);  -ms-transform: translateY(-50%);  transform: translateY(-50%);}
#index-slider2 .sp-slide .hw-the-slider-container {  display: table;    margin: 0;    padding: 0;    width: 100%;    z-index: 1;    text-align: center;}
#index-slider2 .sp-slide .hw-the-slider-captions {display: table-cell; margin: 0;    padding: 0 100px;    vertical-align: middle;    width: 100%;    z-index: 1;}
#index-slider2 .sp-slide .title-frame {display:none;}
#index-slider2 .sp-slide.sp-selected .title-frame {display:inline-block; padding:25px 45px; background:#3190E7; background:rgba(49,144,231,.7); text-align: center; max-width:100%; width:55%; box-shadow: 2px 2px 5px hsla(0,0%,0%,.2); outline: 1px solid rgba(255,255,255,.25); outline-offset: -16px; color:#fff; -webkit-font-smoothing: antialiased;}
#index-slider2 .sp-slide.sp-selected .title-frame.green {background:#28CB75; background:rgba(40,203,107,.7);}
#index-slider2 .sp-slide.sp-selected .title-frame.black {background:#151515; background:rgba(21,21,21,.7);}
#index-slider2 .sp-slide.sp-selected .title-frame.orange {background:#E5603F; background:rgba(229,96,63,.7);}
#index-slider2 .sp-slide.sp-selected .title-frame h2 {font-size:25px;}
#index-slider2 .sp-slide.sp-selected .title-frame span.typcn {font-size:45px;}
#index-slider2 .sp-slide.sp-selected .title-frame hr.small {border-color:#fff; width:45px;}
#index-slider2 .sp-buttons { position: relative; width:auto; display:table; margin:-30px auto 0;  text-align: center; background:#fff; padding:25px 25px 5px; border-radius:4px; box-shadow: 0 19px 38px rgba(0,0,0,0.10), 0 15px 12px rgba(0,0,0,0.02);}
#index-slider2 .sp-button {width: 20px; height: 20px; background: #b4b1b1 none repeat scroll 0 0; border: 0; border-radius: 50%; margin: 4px;  display: inline-block; -moz-box-sizing: border-box;  -webkit-box-sizing: border-box;  box-sizing: border-box;  cursor: pointer;  transform: translate3d(0px, -50%, 0px) scale(0.4); transform-origin: 50% 50% 0;    transition: all 250ms ease-out 0s;}
#index-slider2 .sp-selected-button, #index-slider2 .sp-button:hover { background: #28CB75 none repeat scroll 0 0; transform: translate3d(0px, -50%, 0px) scale(0.8);}


/* VIDEO HEADER  ---------------------- */
#video-header {height: 650px; position: relative;    overflow: hidden; box-shadow: 0 19px 38px rgba(0,0,0,0.10), 0 15px 12px rgba(0,0,0,0.02);}
#video-header:after { background:#525151 url(../images/overlay-pattern.png); opacity:.7; bottom: 0px; content: ""; left: 0; position: absolute; right: 0; top: 0; z-index: 1; }
#video-header .video-header-message { display: block; margin:0 auto; position:absolute; text-align: center; z-index: 2; left: 0;  right: 0;  top: 50%;  -webkit-transform: translateY(-50%);  -ms-transform: translateY(-50%);  transform: translateY(-50%);}
#video-header .video-header-message h1 {color:#fff; font-size:43px;}
#video-header .video-header-message p {color:#fff; margin-bottom:0; font-size:21px;}
#video-header video { width:100%; min-height:100%;  object-fit: cover;}
#video-header .video-header-message  hr.small { border: solid #fff; opacity:.15; border-width: 2px 0 0; margin-top:32px; margin-bottom:32px; max-width:100px;}

/* SEARCH  ---------------------- */
#search {position: fixed;    top: 0px;    z-index: 99999;    left: 0px;    width: 100%;    height: 100%;    background-color: rgba(255,255,255,.98); -webkit-transition: all 0.5s ease-in-out;  -moz-transition: all 0.5s ease-in-out;  -o-transition: all 0.5s ease-in-out;    -ms-transition: all 0.5s ease-in-out;   transition: all 0.5s ease-in-out;    -webkit-transform: translate(0px, -100%) scale(0, 0);  -moz-transform: translate(0px, -100%) scale(0, 0);  -o-transform: translate(0px, -100%) scale(0, 0);    -ms-transform: translate(0px, -100%) scale(0, 0);   transform: translate(0px, -100%) scale(0, 0);    opacity: 0;}
#search.open {-webkit-transform: translate(0px, 0px) scale(1, 1); -moz-transform: translate(0px, 0px) scale(1, 1); -o-transform: translate(0px, 0px) scale(1, 1);   -ms-transform: translate(0px, 0px) scale(1, 1); transform: translate(0px, 0px) scale(1, 1);    opacity: 1;}
#search form {display: block; margin:0 auto; position:absolute; z-index: 2; left: 15%;  right: 15%;  top: 50%;  -webkit-transform: translateY(-50%);  -ms-transform: translateY(-50%);  transform: translateY(-50%);}
#search form span {text-align:left; position:relative; display:table; width:auto; color:#fff; font-size:13px; letter-spacing: .04em; background:#3190E7; padding:12px; }
#search form span:after {top: 100%; left: 15%;  border: solid transparent;  content: " ";   height: 0;  width: 0;   position: absolute; pointer-events: none;   border-color: rgba(49, 144, 231, 0);    border-top-color: #3190E7;  border-width: 10px; margin-left: -10px;  margin-top:-4px;}
#search input[type="search"] {    width: 100%;    font-size:75px;    text-align: left;    border: 0;    border-bottom:1px solid #e4e4e4;    padding:20px 0;    outline: none;    color:#666666;}
#search .close {    position: fixed;    top: 15px;    right: 15px;    color: #fff;  background: #3190E7;    border: 0;  border-radius: 5px; opacity: 1; padding: 10px 17px; font-size: 17px;}

/* NAVIGATION MENU  ---------------------- */
nav#desktop-menu {  padding: 0; float:right; text-align: left; }
.f-nav{ z-index: 999; position: fixed; left: 0; top: 0; width: 100%; background:#fff; margin-top:-5px;
  -webkit-box-shadow: 0px 3px 5px rgba(100, 100, 100, 0.19);
  -moz-box-shadow:    0px 3px 5px rgba(100, 100, 100, 0.19); box-shadow:  0px 3px 5px rgba(100, 100, 100, 0.19); }
  .fadeindown { -webkit-animation-duration: .45s;  -webkit-animation-timing-function: ease;  -webkit-animation-fill-mode: both;  -webkit-animation-name: fadeInDown;  -moz-animation-duration: .45s;  -moz-animation-timing-function: ease;  -moz-animation-fill-mode: both;  -moz-animation-name: fadeInDown;  animation-duration: .45s;  animation-timing-function: ease;  animation-fill-mode: both;  animation-name: fadeInDown;}
  /*** ESSENTIAL STYLES ***/
  .sf-menu, .sf-menu * {  margin: 0;  padding: 0;  list-style: none;}
  .sf-menu li {  position: relative;}
  .sf-menu ul {  position: absolute;  display: none;  top: 100%;  left: 0;  z-index: 99;}
  .sf-menu > li {  float: left;}
  .sf-menu li:hover > ul, .sf-menu li.sfHover > ul {  display: block;}
  .sf-menu a {  display: block;  position: relative;}
  .sf-menu ul ul {  top: 0;  left: 100%;}

  /*** SKIN ***/
  .sf-menu {  float: left;  margin: 0;}
  .sf-menu ul { min-width: 10em; *width: 10em; box-shadow: 0 2px 2px 0 rgba(0,0,0,.14),0 3px 1px -2px rgba(0,0,0,.2),0 1px 5px 0 rgba(0,0,0,.12);}
  /* 1st level */
  .sf-menu li {  white-space: nowrap;   *white-space: normal;}
  .sf-menu li a {color: #363B3F;  font-weight: 500;  padding:10px 10px 20px;  font-size: 0.77em;  letter-spacing: 0px;  text-transform: uppercase; transition: all 450ms cubic-bezier(0.23, 1, 0.32, 1) 0ms;  -webkit-transition: all 450ms cubic-bezier(0.23, 1, 0.32, 1) 0ms;}
  .sf-menu li:hover a, .sf-menu li.sfHover a, .sf-menu li.current a  { color: #363B3F; background:#F3F5F7;}
  /* 2nd level */
  .sf-menu ul li, .sf-menu li.current ul li{background:#fff!important; padding:0;}
  .sf-menu ul li a {background:#fff!important; font-size: 12px; padding: 12px 16px; color: #363B3F!important; border-bottom:1px solid #e5e8ec;}
  .sf-menu ul li:hover a, .sf-menu ul li.sfHover a  { color: #363B3F!important; background:#F3F5F7!important;  -webkit-transition: none;  transition: none; border-bottom:1px solid #e5e8ec;}
  /* 3rd level */
  .sf-menu ul li.sfHover li a {background:#fff!important; font-size: 12px; padding: 12px 16px; color: #363B3F!important; border-bottom:1px solid #e5e8ec;}
  .sf-menu ul li li:hover a, .sf-menu ul li li.sfHover a  { color: #363B3F!important; background:#F3F5F7!important;  -webkit-transition: none;  transition: none; border-bottom:1px solid #e5e8ec;}
  /* styling for both css and generated arrows */
  .sf-arrows .sf-with-ul {  padding-right: 2.5em;  *padding-right: 1em; }
  .sf-arrows .sf-with-ul:after {  content: '';  position: absolute;  top: 50%;  right: 1em;  margin-top: -3px;  height: 0;  width: 0;  border: 5px solid transparent;  border-top-color: #8C8C8C; }
  .sf-arrows > li > .sf-with-ul:focus:after, .sf-arrows > li:hover > .sf-with-ul:after, .sf-arrows > .sfHover > .sf-with-ul:after {  border-top-color: #8C8C8C; }
  .sf-arrows ul .sf-with-ul:after {  margin-top: -5px;  margin-right: -3px;  border-color: transparent;  border-left-color: #6f6f6f;  }
  .sf-arrows ul li > .sf-with-ul:focus:after, .sf-arrows ul li:hover > .sf-with-ul:after, .sf-arrows ul .sfHover > .sf-with-ul:after {  border-left-color: #6f6f6f;}
  .slicknav_menu {  display:none;}

  /* END OF HEADER 1  ---------------------- */

  /* HEADER 2  ---------------------- */
  .header.header2 {position:relative; z-index:9; }
  .header.header2 .header-navigation {background:#fff;width:100%; padding:10px 0; }
  .header.header2 .topbar { padding:10px 0; margin:0; background:#3190E7; }
  .header.header2 ul.phone li span.typcn {background:transparent; margin-right:5px; color:#fff; text-align: center; font-size:15px; line-height:15px; }
  .header.header2 ul.phone li {font-size:13px;}
  .header.header2 .sf-menu li:hover a, .header.header2 .sf-menu li.sfHover a, .header.header2 .sf-menu li.current a  { background:transparent; color: #3190E7; }
  .header.header2 .logo {margin-top:10px; padding-left:0;}



/* ==================================
3 = Home Pages
==================================== */

/* HOME 1  ---------------------- */
section {padding:55px 0; overflow:hidden;}
section h2 {text-align:center; margin-bottom:25px;}
section h2 span {color:#3190E7;}

/* FEATURES  ---------------------- */
.shadow-effect {  background: #fff;  padding: 20px; border-radius:4px; text-align:center;  box-shadow: 0 19px 38px rgba(0,0,0,0.10), 0 15px 12px rgba(0,0,0,0.02);}
.introtext span.typcn { font-size:70px;color:#3190E7;}
.introtext h3 { font-size:13px; letter-spacing: .06em;}
.introtext p { font-size:15px; letter-spacing: .02em;}
.introtext a.btn.btn-default {-webkit-transition: all 0.3s ease-in-out;  -moz-transition: all 0.3s ease-in-out;  transition: all 0.3s ease-in-out;   border: 1px solid #fff; border-radius:4px; background:#3190E7; color:#fff; font-size:12px; letter-spacing: .06em; font-weight:400; padding: 7px 18px 8px; text-shadow:none;}
.introtext a.btn.btn-default:hover { background: #ffffff; color: #3190E7; border: 1px solid #3190E7;}
.introtext.home2 {text-align: center; padding-bottom:75px;}
.introtext.home2 p { padding:0 8px;}
.introtext.home3 .block-grid-item span.typcn {font-size:54px; display:table-cell; line-height:54px; float:left; margin-right:15px;}
.introtext.home3 .block-grid-item p {font-size:15px;}
.introtext.home3 .introtext-feature {overflow: hidden;}

/* ABOUT US */
section.aboutus {background: linear-gradient(rgba(234,237,242,0.60), rgba(234,237,242,0.60)), url(../images/aboutusbg.jpg) top right #eaedf2; min-height:895px; padding-top:150px;}
/* Contrast fix: leggibilita' testo sopra l'immagine di sfondo aboutus (velo leggero + alone bianco) */
section.aboutus h2, section.aboutus h4, section.aboutus p, section.aboutus .timeline-3 > li p {color:#2f2f2f; text-shadow:0 1px 3px rgba(255,255,255,.95), 0 0 8px rgba(255,255,255,.85);}
section.aboutus p, section.aboutus .timeline-3 > li p {font-weight:400;}
section.aboutus hr.small { border: solid #3190E7; border-width: 2px 0 0; clear: both; height: 0; margin:21px 0 42px; max-width:100px;}
section.aboutus h2 {margin-bottom:25px; text-align: left;}
section.aboutus h4 {font-weight:300; font-size:30px; margin-bottom:35px;}
section.aboutus a.btn.btn-default {margin-top:20px; -webkit-transition: all 0.3s ease-in-out;  -moz-transition: all 0.3s ease-in-out;  transition: all 0.3s ease-in-out;   border: 1px solid #fff; border-radius:4px; background:#3190E7; color:#fff; font-size:14px; letter-spacing: .06em; font-weight:400; padding: 7px 18px 8px; text-shadow:none;}
section.aboutus a.btn.btn-default:hover { background: #ffffff; color: #3190E7;  border: 1px solid #3190E7; }

/* TESTIMONIALS 1 */
section.testimonials {padding-top:15px;}
#customers-testimonials .item, #customers-testimonials2 .item, #customers-testimonials3 .item {text-align: center; padding:50px; opacity:.2; -webkit-transform: scale3d(0.8, 0.8, 1);  transform: scale3d(0.8, 0.8, 1); -webkit-transition: all 0.3s ease-in-out;  -moz-transition: all 0.3s ease-in-out;  transition: all 0.3s ease-in-out;}
#customers-testimonials .owl-item.active.center .item, #customers-testimonials2 .owl-item.active.center .item, #customers-testimonials3 .owl-item.active.center .item {opacity:1;  -webkit-transform: scale3d(1.0, 1.0, 1);  transform: scale3d(1.0, 1.0, 1);}
.img-circle { border-radius: 50%; }
img.img-circle  { max-width:90px; margin:0 auto 17px;}
.testimonial-name {margin:-17px auto 0; display:table; width:auto; background:#3190E7; padding:9px 35px; border-radius:12px; text-align: center; color:#fff; box-shadow: 0 9px 18px rgba(0,0,0,0.12), 0 5px 7px rgba(0,0,0,0.05); }
#customers-testimonials.owl-carousel.owl-theme .owl-dots .owl-dot span, #customers-testimonials2.owl-carousel.owl-theme .owl-dots .owl-dot span, #customers-testimonials3.owl-carousel.owl-theme .owl-dots .owl-dot span {background: #C4C4CC none repeat scroll 0 0; display: block; height: 20px; margin: 0 2px 5px; transform: translate3d(0px, -50%, 0px) scale(0.3); transform-origin: 50% 50% 0;    transition: all 250ms ease-out 0s;  width: 20px;  }
#customers-testimonials.owl-carousel.owl-theme .owl-dots .owl-dot.active span, #customers-testimonials.owl-carousel.owl-theme .owl-dots .owl-dot:hover span, #customers-testimonials2.owl-carousel.owl-theme .owl-dots .owl-dot.active span, #customers-testimonials2.owl-carousel.owl-theme .owl-dots .owl-dot:hover span, #customers-testimonials3.owl-carousel.owl-theme .owl-dots .owl-dot.active span, #customers-testimonials3.owl-carousel.owl-theme .owl-dots .owl-dot:hover span {background: #28CB75 none repeat scroll 0 0; transform: translate3d(0px, -50%, 0px) scale(0.7);}

/* TESTIMONIALS 2 */
section.testimonials.home2 {padding-top:55px;}
section.testimonials.home2 #customers-testimonials .item, section.testimonials.home2 #customers-testimonials2 .item, section.testimonials.home2 #customers-testimonials3 .item {opacity:0;}
section.testimonials.home2 h2 {text-align:left; font-size:29px; margin:40px 0 0;}
section.testimonials.home2 hr.small { border: solid #3190E7; border-width: 1px 0 0; margin: 0; margin-top:31px; margin-bottom:31px; max-width:70px;}
section.testimonials.home2 #customers-testimonials .owl-item.active .item, section.testimonials.home2 #customers-testimonials2 .owl-item.active .item, section.testimonials.home3 #customers-testimonials .owl-item.active .item {opacity:1;  -webkit-transform: scale3d(1.0, 1.0, 1);  transform: scale3d(1.0, 1.0, 1);}
section.testimonials.home2 .testimonial-name.home2 {margin:25px 0 0 11px; display:table; width:100%; background:transparent; padding:0; border-radius:0; text-align: left; color:#808080; box-shadow: none; }
section.testimonials.home2 .testimonial-name.home2 .img-circle {float:left; margin-right:15px;}
section.testimonials.home2 .testimonial-name.home2 img.img-circle  { width:50px;}
section.testimonials.home2 .testimonial-name.home2 span  { display:block; font-size:13px;}
section.testimonials.home2 .testimonial-name.home2 span.name  {padding-top:8px;}
section.testimonials.home2 .testimonial-name.home2 span.company  {color:#b3aeae;}
section.testimonials.home2 .shadow-effect {  background: #fff;  padding: 20px; border-radius:4px; text-align:center; box-shadow: 0 19px 38px rgba(0,0,0,0.10), 0 15px 12px rgba(0,0,0,0.02); position:relative;}
section.testimonials.home2 .shadow-effect:after {top: 100%;   left: 5%;   border: solid transparent;      content: " ";   height: 0;      width: 0;   position: absolute;     pointer-events: none;   border-color: rgba(255, 255, 255, 0);   border-top-color: #ffffff;      border-width: 10px;     margin-left: -10px;  }
section.testimonials.home2 .shadow-effect p {text-align: left; margin-bottom:0;}

/* call to action */
section.calltoaction {background:#f0f0f0;padding-bottom:0;}
section.calltoaction.calltoaction1 {padding-bottom:55px;}
section.calltoaction.calltoaction2 {background: url(../images/1.jpg) no-repeat; background-size:cover; padding-bottom:55px; position: relative;}
section.calltoaction.calltoaction2:after {background: #222; opacity:.85; bottom: 0px; content: ""; left: 0; position: absolute; right: 0; top: 0; }
section.calltoaction.calltoaction2 .cta-text {z-index:1; opacity:1; color:#fff; position: relative;}
section.calltoaction.calltoaction3 {background:#fff; padding-bottom:55px;}
section.calltoaction a.hw-btn { margin:45px auto 0; display:table; background:#28cb75; color:#fff; font-weight:700; letter-spacing: .06em; text-transform: uppercase; font-size:17px; border-radius: 2px;  padding: 15px 30px; transition: background-color 1s ease 0s;}
section.calltoaction a.hw-btn:hover {background:#0CB863;}
.cta-image {margin-top:40px;}
section.calltoaction.home3 {background:#E9E9E9; padding-bottom:140px;}
section.calltoaction.home3 .cta-title {color:#EB1E94; border-radius:3px; font-size:15px; font-weight:700; background:#ccc; display:table; text-align:center; margin:-24px auto 0; padding:12px 20px; box-shadow: 0 19px 38px rgba(0,0,0,0.10), 0 15px 12px rgba(0,0,0,0.02);}
section.calltoaction.home3 .cta-title.green {background:#5AC452;  color:#fff;}
section.calltoaction.home3 .cta-title.gray {background:#53504F; color:#fff;}
section.calltoaction.home3 .cta-title.orange {background:#FF9670; color:#fff;}
section.calltoaction.home3 .shadow-effect {  background: #fff;  padding: 28px 10px 35px; border-radius:4px; text-align:left;  box-shadow: 0 19px 38px rgba(0,0,0,0.10), 0 15px 12px rgba(0,0,0,0.02);}
.calltoaction.home3.cta-button a.hw-btn { margin:-60px auto 0; border-radius:3px; display:table; background: #3190E7; color:#fff; padding: 25px 60px; text-align:center; font-size:32px; letter-spacing:-.02em;  box-shadow: 0 19px 38px rgba(0,0,0,0.14), 0 15px 12px rgba(0,0,0,0.04); font-family: 'Lato', Optima, Segoe, "Segoe UI", Candara, Calibri, Arial, sans-serif; font-weight:900;  vertical-align: middle;  -webkit-transform: translateZ(0);  transform: translateZ(0);  box-shadow: 0 0 1px rgba(0, 0, 0, 0);  -webkit-backface-visibility: hidden;  backface-visibility: hidden;  -moz-osx-font-smoothing: grayscale;  -webkit-transition-duration: 0.3s;  transition-duration: 0.3s;  -webkit-transition-property: transform;  transition-property: transform;  -webkit-transition-timing-function: ease-out;  transition-timing-function: ease-out; }
.calltoaction.home3.cta-button a.hw-btn span { display:block; font-size:15px; margin-top:5px; font-weight:300; color:#E9E9E9;  }
.calltoaction.home3.cta-button a.hw-btn:hover {-webkit-transform: translateY(-8px);  transform: translateY(-8px); }

/* numbers */
section.numbers {background: #eaedf2 url(../images/numbersbg.jpg) top left; min-height:895px; padding-top:215px;}
section.numbers .numbersbox {background: #3190E7;  padding: 15px; border-radius:4px; box-shadow: 0 19px 38px rgba(0,0,0,0.10), 0 15px 12px rgba(0,0,0,0.02);}
section.numbers h2 {margin-bottom:35px; text-align: left;}
section.numbers .numbersbox {background: #3190E7; position:relative; z-index:1; padding: 15px; border-radius:4px; box-shadow: 0 19px 38px rgba(0,0,0,0.10), 0 15px 12px rgba(0,0,0,0.02);}
section.numbers hr.small { border: solid #fff; border-width: 1px 0 0; clear: both; height: 0; margin:21px 0; max-width:100px;}
section.numbers h4 {font-size:23px; color:#fff;}
section.numbers p {color:#fff;}
section.numbers .numbersbox-small {background: #2482d8; margin:16px 0 0 -5px;  border-radius:4px; box-shadow: 0 19px 38px rgba(0,0,0,0.10), 0 15px 12px rgba(0,0,0,0.02);}
section.numbers .numbersbox-small .number {text-align: center; padding: 15px; border-bottom:1px solid #1773c7;}
section.numbers .numbersbox-small .number:last-child {border-bottom:0;}
section.numbers .odometer {color:#fff; font-size:24px; font-weight:900; font-family: 'Lato', Optima, Segoe, "Segoe UI", Candara, Calibri, Arial, sans-serif; margin:0; padding:0; }
section.numbers .numbersbox-small .number .numbername {color:#fff; font-size:11px; margin-top:4px;}

.numbers.home3 {background: #fff; min-height:95px; padding:75px 0 90px;}
.numbers.home3.numbers4 {background: #fff; padding:35px 0;}
.numbers.home3 .number {text-align: center; padding: 15px;}
.numbers.home3 .number .odometer {color:#3190E7; font-size:50px; font-weight:300; letter-spacing: -.02em; font-family: 'Lato', Optima, Segoe, "Segoe UI", Candara, Calibri, Arial, sans-serif; margin:0; padding:0; }
.numbers.home3.numbers5 {background: #fff; padding:35px 0;}
.numbers.home3.numbers5 .number {text-align: center; padding: 15px; background: #666666}
.numbers.home3.numbers5 .number .odometer {color:#fff; font-size:50px; font-weight:900; letter-spacing: -.02em; font-family: 'Lato', Optima, Segoe, "Segoe UI", Candara, Calibri, Arial, sans-serif; margin:0; padding:0; }
.numbers.home3.numbers5 .number .numbername {color:#fff;}
.numbers.home3.numbers5 a.btn.rounded.btn-orange {margin-top: 45px;}
.numbers.home3.numbers6 {background: #fff; padding:35px 0;}
.numbers.home3.numbers6 .number {text-align: center; margin:0 auto; padding-top: 40px; border:1px solid #ccc; border-radius:50%; width:150px; height:150px;}
.numbers.home3.numbers6 .number .odometer {color:#3190E7; font-size:35px; font-weight:300; letter-spacing: -.02em; font-family: 'Lato', Optima, Segoe, "Segoe UI", Candara, Calibri, Arial, sans-serif; margin:0; padding:0; }
.numbers.home3.numbers6 .number .numbername {font-size:12px;}
.numbers.home3.numbers6 a.btn.rounded.btn-orange {margin-top: 45px;}

/* clients */
section.clients {padding:15px 0 110px;}
section.clients.home2 {padding-top:55px;}
#clients-carousel {margin-top:60px;}
#clients-carousel .item {margin-bottom:40px;}
#clients-carousel .item img {border:1px solid #ccc; /*opacity:.4;*/ padding:20px;}
#clients-carousel.owl-carousel.owl-theme .owl-dots .owl-dot span {background: #C4C4CC none repeat scroll 0 0; display: block; height: 20px; margin: 0 2px 5px; transform: translate3d(0px, -50%, 0px) scale(0.3); transform-origin: 50% 50% 0; transition: all 250ms ease-out 0s;  width: 20px; }
#clients-carousel.owl-carousel.owl-theme .owl-dots .owl-dot.active span, #clients-carousel.owl-carousel.owl-theme .owl-dots .owl-dot:hover span {background: #28CB75 none repeat scroll 0 0; transform: translate3d(0px, -50%, 0px) scale(0.7);}

/* features */
section.features {padding:65px 0; background: #e9e9e9;}
section.features h3 {margin:50px 0 45px; padding:0;}
section.features .feature {margin-bottom:32px;}
section.features .feature .featureicon {float: left; margin:0 15px 0 0;}
section.features .feature .featureicon span.typcn {font-size:54px; line-height:30px; display:table-cell; }
section.features .feature h5 {margin:0 0 8px 0; padding:0;}
section.features .feature p {font-size:15px; overflow: hidden;}

/* Pricing Tables Home */
.pricingtables { overflow: hidden; padding: 105px 0; }
.pricingtables.whitebg {background: #fff; padding:110px 0 70px;}
.pricingtables.darkbg {background: url(../images/pricing-table-bg.jpg); background-size:cover; padding:90px 0 70px;}
.price-plans {padding:0 15px;}
.pricingtables .panel { border: 0; border-radius: 0; box-shadow: 20px 0 20px -10px rgba(0, 0, 0, .05), -20px 0 20px -10px rgba(0, 0, 0, .05); margin: 0; padding: 0; }
.pricingtables .panel-heading { background: #E9E9E9; border: 0; border-radius: 0; filter: none !important; }
.pricingtables .panel-heading h3 { color: #808080; font-size: 21px; font-weight: 400; letter-spacing:.07em; margin: 0; padding: 12px 0; }
.pricingtables .panel-body { margin: 0; padding: 45px 0; }
.pricingtables .panel-body h4 { color: #3190E7; font-size: 44px; font-weight:400; margin: 0; padding: 0; text-align: center; }
.pricingtables .panel-body span { color: #3190E7; font-size: 21px;padding: 5px 0; }
.pricingtables ul { border: 0; list-style: none; margin: 0; padding: 0 0 45px; }
.pricingtables ul li { border: 0; font-size: 16px; padding: 10px 0; }
.pricingtables ul li:first-child {padding-top: 0; }
.pricingtables .panel-footer { text-align: center; border: 0; background: #fff;}
.pricingtables .btn-pricetable {background: #3190E7; border-radius: 20px; color: #fff; font-size: 20px; margin: 0 auto 45px; padding: 10px 30px; box-shadow: 0 19px 38px rgba(0,0,0,0.05), 0 15px 12px rgba(0,0,0,0.01); transition: all 0.3s ease 0s;}
.pricingtables .btn-pricetable:hover { background:#5AC452; }
.pricingtables .most-popular { border-width: 3px; box-shadow: 20px 0 20px -10px rgba(0, 0, 0, .15), -20px 0 20px -10px rgba(0, 0, 0, .15); padding: 0; top: -26px; z-index: 2; }
.pricingtables .most-popular .panel, .pricingtables .most-popular .panel-body, .pricingtables .most-popular .panel-footer  {background: #8C8C8C; }
.pricingtables .most-popular .panel-heading { background:#666666;}
.pricingtables .most-popular .panel-body span { color: #fff; }
.pricingtables .most-popular .panel-heading h3 { color: #fff; letter-spacing:.07em; margin: 0; padding: 25px 0; }
.pricingtables .most-popular .panel-body h4 { color: #fff; padding: 16px 0;}
.pricingtables .most-popular ul li { color: #fff; }
.pricingtables .most-popular .btn-pricetable { background: #666666;}
.pricingtables .most-popular .btn-pricetable:hover { background:#5AC452; }

.pricingtables.whitebg.borders h4 { border-bottom:1px solid #e9e9e9; padding-bottom:28px;}
.pricingtables.whitebg.borders ul li { color: #808080; border-bottom:1px solid #e9e9e9;}
.pricingtables.whitebg.borders .most-popular { border-width: 3px; box-shadow: 20px 0 20px -10px rgba(0, 0, 0, .05), -20px 0 20px -10px rgba(0, 0, 0, .05); padding: 0; top: -26px; z-index: 2; }
.pricingtables.whitebg.borders .most-popular .panel, .pricingtables.whitebg.borders .most-popular .panel-body, .pricingtables.whitebg.borders .most-popular .panel-footer  { background: #fff; }
.pricingtables.whitebg.borders .most-popular .panel-heading { background:#E9E9E9;  }
.pricingtables.whitebg.borders .most-popular .panel-body span { color: #3190E7; }
.pricingtables.whitebg.borders .most-popular .panel-heading h3 { color: #808080; letter-spacing:.07em; margin: 0; padding: 25px 0; }
.pricingtables.whitebg.borders .most-popular .panel-body h4 { color: #3190E7; padding: 16px 0 30px; border-bottom:1px solid #e9e9e9;}
.pricingtables.whitebg.borders .most-popular ul li { color: #808080; border-bottom:1px solid #e9e9e9;}
.pricingtables.whitebg.borders .most-popular .btn-pricetable { background: #3190E7;}
.pricingtables.whitebg.borders .most-popular .btn-pricetable:hover { background:#5AC452; }
/* End of Pricing Tables */

/* ==================================
4 = Projects
==================================== */

/* projects */
section.projects {padding-bottom:0; background:#f0f0f0;}
section.projects .projectsposts {margin-top:70px;}
section.projects .projectsposts .block-grid-item {padding:0;}
section.projects .projectsposts .block-grid-item figure {  position: relative;  overflow: hidden;}
section.projects .projectsposts .block-grid-item figure figcaption {position: absolute;    top:0;    bottom: 0;    left: 0;    right: 0;    text-align: center;    -webkit-backface-visibility: hidden;    backface-visibility: hidden; opacity: 0;    -webkit-transition: all 0.35s ease-in-out;    -moz-transition: all 0.35s ease-in-out;    transition: all 0.35s ease-in-out;}
section.projects .projectsposts .block-grid-item figure figcaption h6 {opacity: 0; color: #fff; font-size: 14px; text-transform: uppercase;position: relative; letter-spacing: 0.5px; margin: 0; padding:0; -webkit-transform: translateY(100%); -moz-transform: translateY(100%); -ms-transform: translateY(100%); -o-transform: translateY(100%); transform: translateY(100%);}
section.projects .projectsposts .block-grid-item figure figcaption .fig-overlay { background:#3190E7; background:rgba(49,165,234,.85); height: 100%; margin: auto; bottom: 0; top: 0; position: absolute; width: 100%;}
section.projects .projectsposts .block-grid-item figure figcaption .thetitle {opacity: 0;}
section.projects .projectsposts .block-grid-item:hover figure figcaption .thetitle {position: absolute; top:50%; bottom: 0;left: 0; right: 0; opacity: 1;}
section.projects .projectsposts .block-grid-item:hover figure figcaption {opacity: 1;}
section.projects .projectsposts .block-grid-item:hover figure figcaption h6 { opacity: 1; -webkit-transform: translateY(0); -moz-transform: translateY(0); -ms-transform: translateY(0); -o-transform: translateY(0); transform: translateY(0);}

/* projects filtering */
ul.sub-nav {padding:0; text-align: center; margin: 0 auto 45px; display: table; list-style:none; }
.sub-nav li {float:left;  margin: 0 6px;}
.sub-nav li a {color:#808080; font-size:14px; font-weight:700;}
.sub-nav li a.active {color:#3190E7;}

/* Isotope Necessary Styles for Portfolio Filters */
.isotope-item {    z-index: 2;}
.isotope-hidden.isotope-item { pointer-events: none;    z-index: 1;}
.isotope, .isotope .isotope-item {  -webkit-transition-duration: 0.4s;    -moz-transition-duration: 0.4s;    transition-duration: 0.4s;}
.isotope { -webkit-transition-property: height, width;    -moz-transition-property: height, width;    transition-property: height, width;}
.isotope .isotope-item { -webkit-transition: all 1s ease-in-out; -moz-transition: all 1s ease-in-out; -o-transition: all 1s ease-in-out;
   transition: all 1s ease-in-out;}

   /* projects - isotope grid full */
   section.projects1 {padding-bottom:105px;}
   section.projects1 .projectsposts1 .block-grid-item figure {  position: relative;  overflow: hidden;}
   section.projects1 .projectsposts1 .block-grid-item figure figcaption {position: absolute;    top:0;    bottom: 0;    left: 0;    right: 0;    text-align: center;    -webkit-backface-visibility: hidden;    backface-visibility: hidden; opacity: 0;    -webkit-transition: all 0.35s ease-in-out;    -moz-transition: all 0.35s ease-in-out;    transition: all 0.35s ease-in-out;}
   section.projects1 .projectsposts1 .block-grid-item figure figcaption h6 {opacity: 0; color: #fff; font-size: 14px; text-transform: uppercase;position: relative; letter-spacing: 0.5px; margin: 0; padding:0; -webkit-transform: translateY(100%); -moz-transform: translateY(100%); -ms-transform: translateY(100%); -o-transform: translateY(100%); transform: translateY(100%);}
   section.projects1 .projectsposts1 .block-grid-item figure figcaption .fig-overlay { background:#3190E7; background:rgba(49,165,234,.85); height: 100%; margin: auto; bottom: 0; top: 0; position: absolute; width: 100%;}
   section.projects1 .projectsposts1 .block-grid-item figure figcaption .theicon {opacity: 0;}
   section.projects1 .projectsposts1 .block-grid-item:hover figure figcaption .theicon {left: 50%; top:50%; position: absolute; text-align: center; z-index: 2; transform: translate(-50%, -50%); -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); color:#fff; font-size:46px;opacity:1;}
   section.projects1 .projectsposts1 .block-grid-item:hover figure figcaption {opacity: 1;}
   section.projects1 .projectsposts1 .block-grid-item:hover figure figcaption h6 { opacity: 1; -webkit-transform: translateY(0); -moz-transform: translateY(0); -ms-transform: translateY(0); -o-transform: translateY(0); transform: translateY(0);}
   section.projects1 .projectsposts1 h6 {text-align:center; padding:10px 0;}
   section.projects1 .projectsposts1 h6 a {color:#808080;}
   section.projects1 .projectsposts1 h6 a:hover {color:#3190E7;}

   /* projects - image gallery boxed */
   section.projects2 {padding-bottom:105px;}
   section.projects2 .projectsposts2 .block-grid-item figure {  position: relative;  overflow: hidden;}
   section.projects2 .projectsposts2 .block-grid-item figure figcaption {position: absolute; top:0; bottom: 0; left: 0; right: 0; text-align: center; -webkit-backface-visibility: hidden; backface-visibility: hidden; opacity: 0; -webkit-transition: all 0.35s ease-in-out; -moz-transition: all 0.35s ease-in-out; transition: all 0.35s ease-in-out;}
   section.projects2 .projectsposts2 .block-grid-item figure figcaption .fig-overlay { background:#666; background:rgba(102,102,102,.85); height: 100%;  margin: auto;  bottom: 0;  top: 0;  position: absolute;  width: 100%;}
   section.projects2 .projectsposts2 .block-grid-item figure figcaption .theicon {  opacity:0;}
   section.projects2 .projectsposts2 .block-grid-item:hover figure figcaption .theicon {left: 50%; top:50%; position: absolute; text-align: center; z-index: 2; transform: translate(-50%, -50%); -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); color:#fff; font-size:32px; opacity:1;}
   section.projects2 .projectsposts2 .block-grid-item:hover figure figcaption { opacity: 1;}

   /* Single Project 1 */
   .single-project {padding:70px 0 40px;}
   #single-project-slider.owl-carousel .owl-controls {position:absolute!important; z-index: 3!important; bottom: 95px!important; left:1%; right:1%!important; }
   #single-project-slider.owl-carousel .owl-controls .owl-nav [class*="owl-"] {  background: #fff none repeat scroll 0 0;  }
   #single-project-slider.owl-carousel .owl-controls .owl-nav [class*="owl-"]:hover {background: #28CB75 none repeat scroll 0 0; color: #000;  transform: translate3d(0px, -50%, 0px) scale(0.8);}
   #single-project-slider.owl-carousel .owl-controls .owl-nav .disabled { opacity: 1;  }
   #single-project-slider.owl-carousel.owl-theme .owl-dots .owl-dot span {background: #fff none repeat scroll 0 0; height: 20px; margin: 0 3px; transform: translate3d(0px, -50%, 0px) scale(0.3); transform-origin: 50% 50% 0;    transition: all 250ms ease-out 0s;  width: 20px;  }
   #single-project-slider.owl-carousel.owl-theme .owl-dots .owl-dot.active span, #single-project-slider.owl-carousel.owl-theme .owl-dots .owl-dot:hover span {background: #28CB75 none repeat scroll 0 0; transform: translate3d(0px, -50%, 0px) scale(0.8);}

   .single-project .shadow-effect {text-align:left; padding:30px 25px;}
   .single-project .shadow-effect .element {background:#F3F5F7; padding:22px;}
   .single-project .shadow-effect h2 {font-size: 14px; text-align:center; font-weight:400; letter-spacing:.12em; padding:0; margin:0;}
   .single-project .shadow-effect h3 {text-align:center; font-weight:900; letter-spacing:0; border-top:1px dotted #e0e2e5; font-size:16px;  padding:13px 0 0; margin:18px 0 0;}
   .single-project .shadow-effect .single-project-elements {padding:15px; margin-top:20px;}
   .single-project .shadow-effect hr.small {margin-top:28px; margin-bottom:28px; border-color:#EAE9EE; min-width:310px;}
   .single-project .shadow-effect h4 {color:#3190E7; max-width:420px;text-align:left; text-transform:uppercase; font-size:30px; font-weight:900;}
   .single-project .shadow-effect h5 {color:#8c8c8c; text-align:left; font-size:15px; text-transform:uppercase; font-weight:900; letter-spacing:.12em; margin:20px 0;}
   .single-project .negative-margin {margin-top:-75px; position:relative; z-index:99;}

   /* Share Buttons */
   .single-section-container{padding-top:12px;}
   .single-section-title{border-bottom:1px dotted #ccc; text-align:center; margin-bottom:23px;}
   .single-section-title span.single-section-text{display:block; width:70px; padding:8px; background-color:#fff; margin:0px auto -17px;}
   .sharing-buttons { padding:0; margin:0 auto; display:table;}
   .sharing-buttons ul { list-style: none; margin:0; padding:0;  }
   .sharing-buttons ul li { display:inline-block; padding:11px 7px 12px; margin:0;}
   .sharing-buttons ul li i { color:#fff; text-align: center; font-size:16px; width:38px; height:38px; background:#3190E7; border-radius:50%; padding:12px 0 0 0;}
   .sharing-buttons ul li:hover i { background:#808080;}
   .sharing-buttons ul li a {color:#fff; font-size:17px; }
   .sharing-buttons ul li a:hover {color:#fe8f8c; }

   /* Related Projects */
   section.related-projects {padding-bottom:70px;}
   section.related-projects h2 {font-size:20px;}
   section.related-projects hr.small {border-color:#e0e0e0; margin-bottom:34px;}
   section.related-projects .projectsposts1 .block-grid-item figure {  position: relative;  overflow: hidden;}
   section.related-projects .projectsposts1 .block-grid-item figure figcaption { position: absolute; top:0; bottom: 0; left: 0; right: 0; text-align: center; -webkit-backface-visibility: hidden; backface-visibility: hidden; opacity: 0; -webkit-transition: all 0.35s ease-in-out; -moz-transition: all 0.35s ease-in-out; transition: all 0.35s ease-in-out;}
   section.related-projects .projectsposts1 .block-grid-item figure figcaption .fig-overlay { background:#3190E7; background:rgba(49,165,234,.85); height: 100%;  margin: auto;  bottom: 0;  top: 0;  position: absolute;  width: 100%;}
   section.related-projects .projectsposts1 .block-grid-item figure figcaption .theicon {opacity:0;}
   section.related-projects .projectsposts1 .block-grid-item:hover figure figcaption .theicon {left: 50%; top:50%; position: absolute; text-align: center; z-index: 2; transform: translate(-50%, -50%); -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); color:#fff; font-size:46px;opacity:1;}
   section.related-projects .projectsposts1 .block-grid-item:hover figure figcaption { opacity: 1;}
   section.related-projects .projectsposts1 h6 {text-align:center; padding:10px 0;}
   section.related-projects .projectsposts1 h6 a {color:#808080;}
   section.related-projects .projectsposts1 h6 a:hover {color:#3190E7;}

   /* Previous/Next Project */
   .prevnext {padding:40px 0 95px; background:#f2f6f9; overflow:hidden; border-top:1px solid #e0e4e7; }
   .prevnext span a {color:#fff; font-size:15px; -webkit-transition: all 0.3s ease-in; -moz-transition: all 0.3s ease-in;  -o-transition: all 0.3s ease-in;}
   span.prev {float:left; background:#808080; padding:8px 20px;}
   span.prev i {margin-right:9px;}
   span.prev:hover {background:#3190E7;}
   span.navto {text-align:center; display:table; margin:0 auto; padding:8px 20px; }
   span.navto a {color:#808080; }
   span.navto a:hover {color:#3190E7; }
   span.next {float:right; background:#808080; padding:8px 20px;}
   span.next i {margin-left:9px;}
   span.next:hover {background:#3190E7;}

   /* Single Project 2 */
   .single-project-2 {padding:70px 0 40px;}
   .single-project-2 .negative-margin {margin-top:-35px; position:relative; z-index:99;}
   .single-project-2 .elements {padding:25px; text-align:center;}
   .single-project-2 h2 {padding:0; margin:0;}
   .single-project-2 h2 span.category {font-size:11px; display:table; margin:0 auto; font-weight:400; letter-spacing:.07em; color:#fff; background:#80817D; padding:8px 18px;}
   .single-project-2 .elements h3 {color:#ccc; font-size:20px; margin:25px 0;}
   .single-project-2 .elements h4 {color:#3190E7; font-size:35px; text-transform: uppercase; font-weight:900; letter-spacing:-.02em;}
   .single-project-2 .elements hr.small {margin-top:28px; margin-bottom:28px; border-color:#EAE9EE; max-width:40px; border-width:2px;}
   .single-project-2 .elements p {text-align:left;}
   .single-project-2 .elements a.btn.btn-default {-webkit-transition: all 0.3s ease-in-out;  -moz-transition: all 0.3s ease-in-out;  transition: all 0.3s ease-in-out;   border: 1px solid #fff; border-radius:4px; background:#3190E7; color:#fff; font-size:12px; letter-spacing: .06em; font-weight:400; padding: 7px 18px 8px; text-shadow:none;}
   .single-project-2 .elements a.btn.btn-default:hover { background: #ffffff; color: #3190E7; border: 1px solid #3190E7;}
   #single-project-carousel.owl-carousel .owl-controls {position:absolute!important; z-index: 3!important; bottom: 10px!important; background:#3190E7; display:table; left: 50%;
-webkit-transform: translateX(-50%);
transform: translateX(-50%); margin: 0 auto!important; padding:20px;}
   #single-project-carousel.owl-carousel .owl-controls .owl-nav [class*="owl-"] {  background: #fff none repeat scroll 0 0;  }
   #single-project-carousel.owl-carousel .owl-controls .owl-nav [class*="owl-"]:hover {background: #99DFFB none repeat scroll 0 0; color: #000;  transform: translate3d(0px, -50%, 0px) scale(0.5);}
   #single-project-carousel.owl-carousel .owl-controls .owl-nav .disabled { opacity: 1;  }
   #single-project-carousel.owl-carousel.owl-theme .owl-dots .owl-dot span {background: #fff none repeat scroll 0 0; height: 20px; margin: 0 3px; transform: translate3d(0px, -50%, 0px) scale(0.3); transform-origin: 50% 50% 0;    transition: all 250ms ease-out 0s;  width: 20px;  }
   #single-project-carousel.owl-carousel.owl-theme .owl-dots .owl-dot.active span, #single-project-carousel.owl-carousel.owl-theme .owl-dots .owl-dot:hover span {background: #99DFFB none repeat scroll 0 0; transform: translate3d(0px, -50%, 0px) scale(0.5);}

   /* Single Project 3 */
   .single-project-3 .element {background:#fff; padding:22px;}
   .single-project-3 .element h3 {font-size: 14px; text-align:center; font-weight:400; letter-spacing:.12em; padding:0; margin:0;}
   .single-project-3 .element h4 {text-align:center; font-weight:900; letter-spacing:0; border-top:1px dotted #e0e2e5; font-size:16px;  padding:13px 0 0; margin:18px 0 0;}
   .single-project-3-gallery {background:#eaedf2; padding:0;}
   .single-project-3-gallery .topskew {background:url(../images/white-skew-top.png) no-repeat; height:111px;}
   .single-project-3-gallery .bottomskew {background:url(../images/white-skew-bottom.png) no-repeat; height:111px;}
   .single-project-3-gallery .gallery-container {padding:25px 0 45px;}
   .single-project-3-gallery .projectsposts2 .block-grid-item figure {  position: relative;  overflow: hidden;}
   .single-project-3-gallery .projectsposts2 .block-grid-item figure figcaption {position: absolute; top:0; bottom: 0; left: 0; right: 0; text-align: center; -webkit-backface-visibility: hidden; backface-visibility: hidden; opacity: 0; -webkit-transition: all 0.35s ease-in-out; -moz-transition: all 0.35s ease-in-out; transition: all 0.35s ease-in-out;}
   .single-project-3-gallery .projectsposts2 .block-grid-item figure figcaption .fig-overlay { background:#666; background:rgba(102,102,102,.85); height: 100%;  margin: auto;  bottom: 0;  top: 0;  position: absolute;  width: 100%;}
   .single-project-3-gallery .projectsposts2 .block-grid-item figure figcaption .theicon {  opacity:0;}
   .single-project-3-gallery .projectsposts2 .block-grid-item:hover figure figcaption .theicon {left: 50%; top:50%; position: absolute; text-align: center; z-index: 2; transform: translate(-50%, -50%); -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); color:#fff; font-size:32px; opacity:1;}
   .single-project-3-gallery .projectsposts2 .block-grid-item:hover figure figcaption { opacity: 1;}


/* ==================================
5 = Inner Pages
==================================== */

/* Default Content Section */
section.content {padding-bottom:90px;}
section.content h5.title {padding:12px; background:#eaedf2; margin:0 0 15px;}
section.content hr {border-color:#e8e8e8;}
section.content h2 {margin:12px 0;}
section.content.shortcodes.graybg {background:#eaedf2;}

/* Page Headers */
#page-header {min-height: 360px; background-size: cover; background-position: top center; background: url(../images/1.jpg);}
#page-header:after { background: #055AA8; opacity:.8; bottom: 0px; content: ""; left: 0; position: absolute; right: 0; top: 0; z-index: 1; }
#page-header.services3 {background: url(../images/3.jpg); background-size: cover;}
#page-header.services3:after { background:#8C8C8C;}
#page-header.about1 {background: url(../images/about-1.jpg); background-size: cover;}
#page-header.about1:after { background:#808080;}
#page-header.faq {background: url(../images/faq-bg-header.jpg); background-size: cover;}
#page-header.faq:after { background:#605E60;}
#page-header.projects1 {background: url(../images/projects1-bg-header.jpg); background-size: cover;}
#page-header.projects1:after { background:#3f3f3f;}
#page-header.projects2 {background: url(../images/projects2-bg-header.jpg); background-size: cover;}
#page-header.projects2:after { background:#6d5b63;}
#page-header.single-project-2 {background: url(../images/project-single-3.jpg); background-size: cover;}
#page-header.single-project-2:after { background:#90918C;}
#page-header.single-project-3 {background: url(../images/3.jpg); background-size: cover;}
#page-header.single-project-3:after { background:#848A96;}
#page-header.blog-single {background: url(../images/about1-slider1.jpg); background-size: cover;}
#page-header.blog-single:after { background:#769EAC;}
#page-header.contact {background: url(../images/office.jpg); background-size: cover;}
#page-header.contact:after { background:#055aa8;}
.title-breadcrumbs {display: block; margin:0 auto; position:absolute; text-align: center; z-index: 2; left: 0;  right: 0;  top: 80%;  -webkit-transform: translateY(-68%);  -ms-transform: translateY(-68%);  transform: translateY(-68%);}
.title-breadcrumbs h1 {color:#fff; font-size:28px; padding:0 0 20px; margin:0;font-weight: 900; }
.title-breadcrumbs .thebreadcumb {display:table; width:auto; margin:0 auto; text-align: center;}
.title-breadcrumbs .breadcrumb {background-color: transparent; text-transform: uppercase;   color:#fff;   border-radius: 0; padding:23px 12px 0;   list-style: outside none none;  margin-bottom: 0; border-top:1px solid rgba(255,255,255,.15);}
.title-breadcrumbs .breadcrumb li {font-size:13px;}
.title-breadcrumbs .breadcrumb li a {color:#fff;}
.title-breadcrumbs .breadcrumb li.active {color:#fff; font-weight:700;}

/* SERVICES1 */
.services1-list {background:#eaedf2; padding-bottom:300px;}
.services1-grid .block-grid-item {min-height:300px;  border-radius:0; text-align:center;}
.services1-grid .block-grid-item span.typcn { font-size:74px;}
.services1-grid .block-grid-item h3 { font-size:18px; letter-spacing: .06em; margin:15px 0;}
.services1-grid .block-grid-item p { font-size:15px; letter-spacing: .02em;}
.services1-grid .block-grid-item .servicedetails {padding: 20px; border-radius: 4px; box-shadow: 0 19px 38px rgba(0,0,0,0.10), 0 15px 12px rgba(0,0,0,0.02);}
.services1-grid .block-grid-item.black span.typcn {color:#151515;}
.services1-grid .block-grid-item.blue span.typcn {color:#3FA2FE;}
.services1-grid .block-grid-item.brown span.typcn {color:#604C50;}
.services1-grid .block-grid-item.lynch span.typcn {color:#344458;}
.services1-grid .block-grid-item.orange span.typcn {color:#E5603F;}
.services1-grid .block-grid-item.wisteriapurple span.typcn {color:#9F6F8D;}
.services1-grid .block-grid-item.gray span.typcn {color:#5D5D5D;}
.services1-grid .block-grid-item.oilgreen span.typcn {color:#A3A995;}
.image-mockup {margin:-230px 0 0; padding:0; text-align: center;}

/* SERVICES2 */
section.services2 {padding-bottom:80px;}
section.services2 h2 {margin:0; padding:0;}
section.services2 h5 {font-size:17px; color:#8C8C8C;}
section.services2 .blockquote-colored {margin:30px 45px 0 0; padding:45px; background: #8C8C8C;}
.image-padding-shadow {border:18px solid #fff;  box-shadow: 0 19px 38px rgba(0,0,0,0.10), 0 15px 12px rgba(0,0,0,0.02);}
section.services2-list {text-align: center; background: #F3F5F7}
section.services2-list span.typcn { font-size:70px;color:#3190E7;}
section.services2-list h3 { font-size:13px; letter-spacing: .06em;}
section.services2-list p { font-size:15px; letter-spacing: .02em; padding:0 8px;}
section.services2-list a.btn.btn-default {-webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; border: 1px solid #fff; border-radius:4px; background:#3190E7; color:#fff; font-size:12px; letter-spacing: .06em; font-weight:400; padding: 7px 18px 8px; text-shadow:none;}
section.services2-list a.btn.btn-default:hover { background: #ffffff; color: #3190E7; border: 1px solid #3190E7;}

/* SERVICES3 */
section.services3-list.gray {background: #F3F5F7;}
section.services3-list .text-padding {padding:100px 75px 0 0;}
section.services3-list.gray .text-padding {padding:100px 0 0 75px;}
section.services3-list span.typcn { font-size:60px; color:#35C679; padding:0;}
section.services3-list .service-image {float:right;}
section.services3-list.gray .service-image {float:left;}
section.services3-list h3 { font-size:28px; font-weight: 400; letter-spacing: .06em; padding-left:5px;}
section.services3-list p { font-size:15px; letter-spacing: .02em;  padding-left:5px;}
section.services3-list a.btn.btn-default {-webkit-transition: all 0.3s ease-in-out;  -moz-transition: all 0.3s ease-in-out;  transition: all 0.3s ease-in-out;   border: 1px solid #fff; border-radius:4px; background:#3190E7; color:#fff; font-size:12px; letter-spacing: .06em; font-weight:400; padding: 7px 18px 8px; text-shadow:none;}
section.services3-list a.btn.btn-default:hover { background: #ffffff; color: #3190E7; border: 1px solid #3190E7;}
.introtext hr.small {margin-top:40px; border-width: 3px 0 0; max-width:65px; border-color:#E3E8EB; }

/* ABOUT1 */
.introtext.about1 {padding-bottom:75px;}
.about1-numbers {padding-top:50px;}
.about1-numbers .number {font-family:'Lato', sans-serif; color:#EB1E94; font-size:28px; font-weight:900; letter-spacing:-.07em; background:#ccc; padding:6px; text-align:center; margin-top:20px; border-radius:6px;}
.about1-numbers .number.blue {background:#3190E7;  color:#fff;}
.about1-numbers .number.lightgray {background:#979796; color:#fff;}
.about1-numbers .number.green {background:#28CB75; color:#fff;}
.about1-numbers h4 {color:#808080; padding:18px 0 9px; margin:0; font-size:17px; text-transform: uppercase;}
.about1-numbers  .shadow-effect {text-align:left;}
.about1-numbers  .shadow-effect p {font-size:14px;}
section.about1-slider-accordion {background:#F3F5F7; padding-top:75px;}
.team-grid {margin-top:65px;}
.team-grid .block-grid-item {min-height:300px;  border-radius:0; text-align:center;}
.team-grid .block-grid-item img {width:140px; height:140px;  border-radius:50%;}
.team-grid .block-grid-item h3 { font-size:15px; letter-spacing:.06em; margin:30px auto 15px; display:table; padding:0 15px 15px; border-bottom:1px solid #e8e8e8;}
.team-grid .block-grid-item p { font-size:15px; letter-spacing: .02em;}
.team-grid .block-grid-item .servicedetails {padding: 20px; border-radius: 4px; box-shadow: 0 19px 38px rgba(0,0,0,0.10), 0 15px 12px rgba(0,0,0,0.02);}

/* ABOUT2 */
#about2-video .about2-video-container {  min-height: 550px;  padding-bottom: 50px;    position: relative; overflow:hidden;}
#about2-video .about2-video-container:after { background:#161743 url(../images/video-pattern-overlay.png); opacity:.6; bottom: 0px; content: ""; left: 0; position: absolute; right: 0; top: 0; z-index: 1; }
#about2-video .about2-video-container .videocaption { left: 50%; top:50%; position: absolute; text-align: center; z-index: 2; transform: translate(-50%, -50%);  -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); }
#about2-video .about2-video-container .videocaption .videocaption-content {display:inline-block; padding:25px 45px; background:#666; background:rgba(102,102,102,.85); text-align: left; max-width:100%; box-shadow: 2px 2px 5px hsla(0,0%,0%,.2); outline: 1px solid rgba(255,255,255,.25); outline-offset: -16px; }
#about2-video .about2-video-container .videocaption .videocaption-content h2 { color: #fff; font-size: 30px; font-weight:900; text-align: center;}
#about2-video .about2-video-container .videocaption .videocaption-content hr { border: solid rgba(255,255,255,.25); border-width: 1px 0 0; clear: both; height: 0; margin:21px auto; max-width:100px; }
#about2-video .about2-video-container .videocaption .videocaption-content p { color: #fff; font-size: 15px; font-weight: 300; margin-top: 25px; text-align: center; }
#about2-video video { width:100%;    background-size: cover;    position: absolute;    top: 0;    left: 0;}

section.skills {background:#EAEDF2; margin-top: 35px; padding-top:70px;}
.skills-progressbars {padding-left:70px;}

.team2-grid {margin:65px 0;}
.team2-grid .block-grid-item .shadow-effect {padding:0;}
.team2-grid .block-grid-item {min-height:300px;  border-radius:0; text-align:center;}
.team2-grid .block-grid-item h3 { font-size:15px; letter-spacing: .06em; margin:30px auto 0; display:table; padding:0 15px 5px;}
.team2-grid .block-grid-item h6 { font-size:15px; letter-spacing: .12em; margin:12px 0; padding:0; font-weight:300;}
.team2-grid .block-grid-item p { font-size:15px; letter-spacing: .02em;}
.team2-grid .block-grid-item .team-details {padding: 0 25px;}
.team-social-links {margin:20px 0 0; padding:0 0 25px;}
.team-social-links li {  list-style: none;  display: inline-table;}
.team-social-links li a { color:#808080; border:1px solid #e8e8e8; font-size:13px; display: inline-block; padding-top:7px; text-align: center;  height: 34px; width: 34px; position: relative; z-index: 1; -webkit-transition: color 0.15s; transition: color 0.15s; -moz-osx-font-smoothing: grayscale; border-radius:50%; -webkit-backface-visibility: hidden;}
.team-social-links li a::before { content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 100%; border-radius: inherit; z-index: -1; box-shadow: inset 0 0 0 35px #fff; -webkit-transform: scale3d(0.7, 0.7, 1); transform: scale3d(0.7, 0.7, 1); -webkit-transition: box-shadow 0.15s, -webkit-transform 0.15; transition: box-shadow 0.15s, transform 0.15s;}
.team-social-links li a:hover::before {-webkit-transform: scale3d(1.0, 1.0, 1);  transform: scale3d(1.0, 1.0, 1); box-shadow: inset 0 0 0 35px  #009DE0;}
.team-social-links li a:hover { color:#fff;}

/* FAQ */
section.introtext.faq {background:#EAEDF2; padding-bottom:70px;}
.shadow-effect #accordion {text-align:left;}
section.calltoaction.faq {background:#fff;  padding-bottom:70px;}

/* LOGIN */
section.introtext.login .shadow-effect  {margin-bottom:55px;}
.login-form {margin:0; text-align: center; background:#fff; border:0;  overflow:hidden; padding:15px;}
.login-form span.required {color:#c00;}
.login-form input[type="text"], .login-form input[type="password"] {font-size:18px; padding: 15px; height:65px; width:100%; border: 0; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; background:#EEEDEE; border-radius: 5px; margin:8px 0 18px;}
.login-form input[type="submit"] {width:100%; float: left; font-size:16px; background: #3190E7; height:65px; color:#fff; font-weight:900; padding:6px; text-transform: uppercase; width: 100%; border-radius: 4px; border:0; cursor: pointer; -ms-box-sizing: border-box; -khtml-box-sizing: border-box; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; box-sizing: border-box;}
.login-form input[type="submit"]:hover { background: #6E6E6E; }
.login-form p a {font-size:14px;}
.login-form p a:hover {color:#3190E7;}

/* 404 */
section.introtext.error404 h2 {color:#28CB75; font-size:56px; font-weight:900;}
section.introtext.error404 h5 {font-size:26px; font-weight:300; text-align: center; padding-top:12px;}

/* Pages with sidebar */
.page-content p:first-child::first-letter {float: left; min-width: 0.8em; margin: 7px 10px 0 0; padding: 9px 14px; background: #666;
    color: #fff; font-size:32px; line-height: 1.3; text-align: center; font-weight:700;}

    /* Pages with sidebar - the sidebar */
    .sidebar .widget {margin-bottom:35px;}
    .sidebar .widget h5 {padding:12px 12px 18px; background:#eaedf2; margin:0 0 17px;}
    .sidebar .widget ul {padding:0; margin:0; list-style:none;}
    .sidebar .widget ul li {padding:10px 10px 10px 0; font-size:15px; border-bottom:1px solid #F3F5F7; }
    .sidebar .widget ul li span.badge {float:right; margin-top:1px; padding:6px; background:#3190E7; border-radius: 2px;}
    .sidebar .widget ul li a {color:#808080;}
    .sidebar .widget ul li a:hover {color:#3190E7;}
    .sidebar .tagcloud {overflow:hidden;}
    .sidebar .tagcloud a {background: #EAEDF2; border: 0 none; color: #808080; display: block; float: left; font-size: 14px; margin: 0 3px 3px 0;    padding: 5px 7px; position: relative; border-radius:4px;}
    .sidebar .tagcloud a:hover { background: #3190E7; color:#fff;}

	

    /* Contact Page */
    .about1-numbers.contact {padding:45px 0 75px;}
    .about1-numbers.contact .number {margin-top:15px; padding-top:0;}
    .contact-form hr.small {border-width:1px 0 0; max-width:50px; border-color:#ccc;}
    section.contact-form {padding-top:0;}
    /* [24/08/2026] «Contatti» restava a sinistra mentre «SCRIVICI UNA EMAIL»,
       che gli sta sotto, era centrato: `section h2 {text-align:center}` (riga
       775) vale per gli h2 e non per gli h1, e i due titoli finivano
       disallineati. Qui l'h1 prende lo stesso trattamento del fratello. */
    .contact-form h1 {text-align:center; margin-bottom:10px;}
    #contactform {margin-top:35px;}
    #contactform label {font-weight:300; }
    #contactform textarea.form-control { font-size: 16px; min-height:260px; }
    #contactform input#submit {background:#3190E7; margin:15px auto 0; color:#fff; padding:9px 39px 10px; font-size:16px; border:0; -webkit-border-radius: 4px;-moz-border-radius: 4px;border-radius: 4px; display:table; transition: all 250ms ease-out 0s; }
    #contactform input#submit:hover {  background: #666;}
    #sendstatus { margin: 10px 0 0;}
    #sendstatus .alert.alert-danger {border:0; background:#DE6F4C; color:#fff; border-radius: 4px; margin-bottom:4px;}
    #sendstatus .alert.alert-success {border:0; background:#85EFC7; color:#333; border-radius: 4px;}
    #map_wrapper { height: 550px; }
    #map_canvas {width: 100%;    height: 100%;}
    #map_canvas img {max-width: none;}

/* ==================================
6 = Blog
==================================== */

.blog article {background: #fff; border-radius: 6px; margin-bottom:70px; padding-right:25px;}
.blog article .shadow-effect {padding:0; text-align:left;}
.blog.single article {margin-bottom:40px;}
.blog article .post-content {padding:25px;}
.blog article .post-content h2 {font-size:27px; letter-spacing:-0.03em;  text-align:left; font-weight:700; text-transform:uppercase;}
.blog article .post-content h2 a {color:#666;}
.blog article .post-content h2 a:hover {color:#3190E7;}
.blog article .post-content hr { border: solid #EAEDF2; border-width: 2px 0 0; clear: both; height: 0; margin-top:27px; margin-bottom:27px; max-width:40px; }
.blog article .post-content .themeta {color:#abaaaa; font-size:14px; color:#8C8C8C; margin:15px 0 30px; }
.blog article .post-content .themeta span {margin-right:15px; padding:7px 15px; border:1px solid #EAEDF2;}
.blog article .post-content p {font-size:17px; font-weight:300;}
.blog article .post-content ul li {font-size:17px; font-weight:300;}
.blog article .post-content blockquote {border-left-color: #3190E7;    font-size:17px; font-weight:300;}
.blog article .post-content .button {color: #fff; display:inline-block; font-size: 14px; padding: 12px 16px; background: #3190E7; border-radius: 3px; text-decoration: none; margin:10px 0; transition: all 250ms ease-out 0s;}
.blog article .post-content .button:hover {background: #666; }
.blog nav ul.pagination {display:table; margin:0 auto; margin-bottom:45px;}
.blog nav ul.pagination li {font-size:15px;}
.blog nav ul.pagination li a {color:#808080; padding: 10px 18px 9px;}
.blog nav ul.pagination li a:hover {background: #3190E7; color:#fff;}

/* Author box */
.author-wrap {position: relative;  overflow:hidden; padding:20px; background: #fff; border-radius: 6px; margin:70px 0;  border:1px solid #EAEDF2;}
.author-gravatar {margin: 0;line-height: 1;}
.author-gravatar img {border: 0; border-radius: 50%;  -webkit-border-radius:50%;  -moz-border-radius: 50%;}
.author-title {color: #808080;display: block;line-height: 1.5;margin: 0 0 15px; padding: 0 0 10px; border-bottom:1px solid #E6E6E6;}
.author-title h6 {padding:0; margin: 0 0 6px;font-size: 19px; font-weight: 700;}
.author-description {display: block; margin: 0 0 5px;}
.author-description p {margin: 0; font-size: 17px; font-weight:300;}

/* Comments */
.comments, #addcomments {padding:20px; background: #fff; border-radius: 6px;}
.comments { margin-bottom:50px;}
#thecomments {margin-top: 0;}
#thecomments h2.badge, #respond h2.badge { border-radius:3px; background:#28CB75; padding:7px 12px; display:table; margin:0 auto; margin-top:-32px; font-size:18px; }
#addcomments {margin-top: 0;}

/* Comments List */
ol.commentlist { margin: 0;  padding: 0 20px;}
.commentlist .comment-body{ padding: 0; margin: 0;  position: relative;    border-top: 0;}
.comment-body a:hover{  text-decoration: underline;}
.comment-body a.comment-reply-link {background:#3190E7; margin: 0; text-decoration:none; color:#fff; padding: 3px 8px 4px; font-size:11px; border:0; -webkit-border-radius: 4px;-moz-border-radius: 4px;border-radius: 4px;}
.comment-body a.comment-reply-link:hover {  background: #6E6E6E;}
ol.commentlist li {  margin-top:20px;  list-style: none;    padding: 20px 0;     background:#fff;  border-bottom: 1px solid #e9e9e9;}
ol.commentlist li ul.children {margin-bottom: 0px !important;    margin-top: 25px !important;}
ol.commentlist li ul.children li{ border-bottom: 0; padding-left: 20px  !important; margin: 10px 0; border-left:1px solid #e8e8e8;}
ol.commentlist li ul.children comment-body{ padding: 15px 0 5px;  margin: 10px 0 0; position: relative;}
.reply {margin-bottom:25px;}
ol.commentlist img.avatar { margin-right:20px; float:left; border-radius:50%; -webkit-border-radius:50%; -moz-border-radius:50%; width:48px;}
ol.commentlist .comment-author { line-height: 25px; border:0; width:100%; }
.comment-body h6{  font-style: normal; margin:0; padding:8px 0 0;}
.comment-body h6 a{color: #6E6E6E; }
.comment-body h6 a:hover {color: #3190E7; text-decoration: none}
.comment-time{  font-size: 12px;  font-style: normal;    color: #ccc;}
.commentmetadata {  clear: both;    padding: 0;    margin: 0;}
.commentmetadata a{ margin: 0;  color: #000;    text-decoration: underline;}
.comment-body p{ padding:20px 0 6px; font-weight:300;}
.comment-body .comment-author.vcard{  margin: 0; border-bottom: 1px solid #e8e8e8; padding-bottom:15px;}
.comment-body ul, .comment-body ol {padding:0; margin:0;}
.comment-body ul li, .comment-body ol li {padding:7px 0; margin:0; border:0;}
.comment-body ul li ul, .comment-body ol li ol {padding:7px 0 7px 7px; margin:0; border:0;}
#reply-title { margin:10px 0; padding:0 0 5px; font-weight:normal; font-size:26px; line-height:1.3; display: block; margin-bottom:-2px; font-weight: 700;}
.comment-notes {padding-top:25px; text-align: center;}
form#commentform textarea {min-height:150px;}
form#commentform label, form#commentform p {font-weight:300;}
form#commentform input#submit {background:#3190E7; margin-top: 0; color:#fff; padding:9px 12px 10px; font-size:16px; border:0; -webkit-border-radius: 4px;-moz-border-radius: 4px;border-radius: 4px;}
form#commentform input#submit:hover {  background: #6E6E6E;}

/* ==================================
7 = Shortcodes
==================================== */

/* Tabs */

/* Big Horizontal Tabs */
.bigtabs.tabs-top-horizontal .tab-content {margin-top:55px; padding:40px 40px 55px; font-size:16px; background:#fff; border: 0; border-radius:5px; box-shadow: 0 19px 38px rgba(0,0,0,0.10), 0 15px 12px rgba(0,0,0,0.02); }
.bigtabs.tabs-top-horizontal .tab-content h4 {font-weight:900; font-size:34px; color:#666; display: block; margin:0 0 30px; padding-bottom:30px;  letter-spacing: -0.05em; text-align:center; position:relative;}
.bigtabs.tabs-top-horizontal .tab-content h4::after {background-color: #8C8C8C; bottom: 0; content: ""; height: 1px; left: 50%; margin-left: -30px; position: absolute; width: 60px;}
.bigtabs.tabs-top-horizontal .tab-content p.subtitle {padding:0 150px; text-align:center;}
.bigtabs.tabs-top-horizontal > .nav-tabs {  display:table;  margin:0 auto; border:0;}
.bigtabs.tabs-top-horizontal .tab-content > .tab-pane,.pill-content > .pill-pane {  display: none;}
.bigtabs.tabs-top-horizontal .tab-content > .active,.pill-content > .active {  display: block;}
.bigtabs.tabs-top-horizontal > .nav-tabs > li { float: left; border-radius:4px; text-align: center; border:0; min-width:175px; margin: 0 8px; color:#fff; background: #fff; position:relative; box-shadow: 0 19px 38px rgba(0,0,0,0.10), 0 15px 12px rgba(0,0,0,0.02); transition: all 0.4s ease-in-out 0s;}
.bigtabs.tabs-top-horizontal > .nav-tabs > li .badge { font-size:13px; width:30px; height:30px; border-radius:50%; padding-top:8px; display:block; margin: 0 auto 15px; background:#28CB75; }
.bigtabs.tabs-top-horizontal > .nav-tabs > li > a {  margin-right: 0; color:#808080; padding:25px 10px;-webkit-border-radius:0;-moz-border-radius:0; border-radius:0; border:0; text-transform: uppercase;font-size:14px;font-weight:400;}
.bigtabs.tabs-top-horizontal > .nav-tabs > li > a:hover,.bigtabs.tabs-top-horizontal > .nav-tabs > li > a:focus {  border:0; background:#28CB75;border-radius:4px; color:#fff;}
.bigtabs.tabs-top-horizontal > .nav-tabs .active > a, .bigtabs.tabs-top-horizontal > .nav-tabs .active > a:hover,.bigtabs.tabs-top-horizontal > .nav-tabs .active > a:focus { color:#fff; border-radius:4px; border:0; background:#28CB75; position: relative;}
.bigtabs.tabs-top-horizontal > .nav-tabs > li > a:hover .badge,.bigtabs.tabs-top-horizontal > .nav-tabs > li > a:focus .badge, .bigtabs.tabs-top-horizontal > .nav-tabs .active > a .badge, .bigtabs.tabs-top-horizontal > .nav-tabs .active > a:hover .badge,.bigtabs.tabs-top-horizontal > .nav-tabs .active > a:focus  .badge { color:#28CB75; background:#fff; }
.bigtabs.tabs-top-horizontal > .nav-tabs .active:after {top: 100%;   left: 50%;   border: solid transparent;    content: " ";   height: 0;    width: 0;   position: absolute;   pointer-events: none;   border-color: rgba(255, 255, 255, 0);   border-top-color: #28CB75;    border-width: 10px;   margin-left: -10px;  }
.bigtabs.tabs-top-horizontal .tab-content ul {list-style:none; margin:0; padding:0;}
.bigtabs.tabs-top-horizontal .tab-content ul li { padding:5px 20px 5px 0; border-bottom:1px solid #ccc;}
.bigtabs.tabs-top-horizontal .tab-content ul li:last-child {border-bottom:0;}
.bigtabs.tabs-top-horizontal .tab-content ul li i {margin-right:10px; color:#f67081;}

/* Normal Horizontal Tabs */
.normaltabs.tabs-top-horizontal > .nav-tabs { border:0;}
.normaltabs .tab-content > .tab-pane, .pill-content > .pill-pane {  display: none;}
.normaltabs .tab-content > .active, .pill-content > .active {background:#fff; margin-top:30px; padding:18px 25px; display: block; border-radius: 4px; border:1px solid #D3D6DA; box-shadow: 0px 8px 25px -17px rgba(0,0,0,0.35), 0px 15px 0px -8px #fff, 0px 15px 0px -7px #D3D6DA, 0px 16px 25px -17px rgba(0,0,0,0.35), 0px 30px 0px -15px #fff, 0px 30px 0px -14px #D3D6DA; }
.normaltabs.tabs-top-horizontal > .nav-tabs > li {  float: left; border-radius:0; text-align: center; border:0; margin: 0 3px; color:#fff; background: #fff; position:relative; box-shadow: 0 19px 38px rgba(0,0,0,0.10), 0 15px 12px rgba(0,0,0,0.02); transition: all 0.4s ease-in-out 0s;}
.normaltabs.tabs-top-horizontal > .nav-tabs > li > a {  margin-right: 0; color:#808080; padding:15px 12px;-webkit-border-radius:0;-moz-border-radius:0; border-radius:0; border:0; text-transform: uppercase;font-size:14px;font-weight:400;}
.normaltabs.tabs-top-horizontal > .nav-tabs > li > a:hover, .normaltabs.tabs-top-horizontal > .nav-tabs > li > a:focus {  border:0; background:#28CB75;border-radius:0; color:#fff;}
.normaltabs.tabs-top-horizontal > .nav-tabs .active > a, .normaltabs.tabs-top-horizontal > .nav-tabs .active > a:hover, .normaltabs.tabs-top-horizontal > .nav-tabs .active > a:focus { color:#fff; border-radius:0; border:0; background:#28CB75; position: relative;}
.normaltabs.tabs-top-horizontal > .nav-tabs > li > a:hover .badge, .normaltabs.tabs-top-horizontal > .nav-tabs > li > a:focus .badge, .normaltabs.tabs-top-horizontal > .nav-tabs .active > a .badge, .normaltabs.tabs-top-horizontal > .nav-tabs .active > a:hover .badge, .normaltabs.tabs-top-horizontal > .nav-tabs .active > a:focus  .badge { color:#28CB75; background:#fff; }
.normaltabs.tabs-top-horizontal > .nav-tabs .active:after { top: 100%; left: 50%; border: solid transparent; content: " "; height: 0; width: 0; position: absolute; pointer-events: none; border-color: rgba(255, 255, 255, 0); border-top-color: #28CB75; border-width: 10px; margin-left: -10px;}

/* Vertical Tabs */
.tabs-left-vertical .tab-content {padding:0 0 0 50px; font-size:16px; float:right; width:85%; margin-top:5px;}
.tabs-left-vertical .tab-content h4 {font-weight:900; font-size:25px; display: block; margin:0 0 20px;}
.tabs-left-vertical .tab-content hr.small {margin:21px 0; border-color:#d8d6d6;}
.tabs-left-vertical > .nav-tabs { float:left; width:15%; border:0; }
.tabs-left-vertical .tab-content > .tab-pane,.pill-content > .pill-pane {  display: none;}
.tabs-left-vertical  .tab-content > .active, .pill-content > .active {background:#fff; margin:0; padding:18px 25px; display: block; border-radius: 4px; border:1px solid #D3D6DA; box-shadow: 0px 8px 25px -17px rgba(0,0,0,0.35), 0px 15px 0px -8px #fff, 0px 15px 0px -7px #D3D6DA, 0px 16px 25px -17px rgba(0,0,0,0.35), 0px 30px 0px -15px #fff, 0px 30px 0px -14px #D3D6DA; }
.tabs-left-vertical > .nav-tabs > li {  float: left; border-radius:0; text-align: left;  display:block; width:100%; border:0; margin: 3px 0; background: #fff; position:relative; box-shadow: 0 2px 15px rgba(0,0,0,0.10), 0 15px 2px rgba(0,0,0,0.02); transition: all 0.4s ease-in-out 0s;}
.tabs-left-vertical > .nav-tabs > li > a {  margin-right: 0; color:#808080; padding:15px 12px;-webkit-border-radius:0;-moz-border-radius:0; border-radius:0; border:0; text-transform: uppercase;font-size:14px;font-weight:400;}
.tabs-left-vertical > .nav-tabs > li > a:hover, .tabs-left-vertical > .nav-tabs > li > a:focus {  border:0; background:#28CB75;border-radius:0; color:#fff;}
.tabs-left-vertical > .nav-tabs .active > a, .tabs-left-vertical > .nav-tabs .active > a:hover, .tabs-left-vertical > .nav-tabs .active > a:focus { color:#fff; border-radius:0; border:0; background:#28CB75; position: relative;}
.tabs-left-vertical > .nav-tabs .active:after {left: 100%;  top: 50%;  border: solid transparent;  content: " ";  height: 0;  width: 0;  position: absolute;  pointer-events: none;  border-color: rgba(40, 203, 117, 0);  border-left-color: #28CB75;  border-width: 5px;  margin-top: -5px;}

/* accordion1 */
#accordion.style1 .panel {box-shadow: none !important; background:transparent;}
#accordion.style1 .panel, #accordion.style1 .panel-group .panel-heading+.panel-collapse>.panel-body{ border: none; box-shadow: 0;}
#accordion.style1 .panel-body {border-top: 0 !important;}
#accordion.style1 .panel-heading {border:0; border-bottom:1px solid #e8e8e8; background:transparent;  border-radius:0; padding:12px 0;  }
#accordion.style1 .panel-heading h4.panel-title a {font-size:16px; font-weight:400; line-height: 1.3; color:#808080;}
#accordion.style1 .panel-heading h4.panel-title a:hover {color:#3190E7;}
#accordion.style1 .panel-heading h4.panel-title i {margin:2px 7px 0 0; vertical-align:middle; font-size:19px; color:#3190E7;}
#accordion.style1 .panel-body {padding:15px 0; margin:0;}
#accordion.style1 .panel-body p {text-align: left; font-size:16px; padding:0 15px; margin:0;}

/* accordion2 */
#accordion.style2 .panel, #accordion.style2 .panel-group .panel-heading+.panel-collapse>.panel-body{ border: none; box-shadow: 0;}
#accordion.style2 .panel-body {border-top: 0 !important;}
#accordion.style2 .panel-heading {border:0; background:#3190E7;  border-radius:0; padding:12px 0;  }
#accordion.style2 .panel-heading:hover  {background:#E57744; }
#accordion.style2 .panel-heading h4.panel-title a {font-size:16px; font-weight:400; line-height: 1.3; color:#fff;}
#accordion.style2 .panel-heading h4.panel-title a:hover {color:#fff;}
#accordion.style2 .panel-heading h4.panel-title i {margin:2px 15px 0 10px; vertical-align:middle; font-size:19px; color:#fff;}
#accordion.style2 .panel-body {padding:15px 0; margin:0;}
#accordion.style2 .panel-body p {text-align: left; font-size:16px; padding:0 15px; margin:0;}

/* alerts */
.alert {border:0; border-radius: 0;}
.alert.alert-success {background:#85EFC7;}
.alert.alert-info {background:#DBEFF6;}
.alert.alert-warning {background:#FEFF91;}
.alert.alert-danger {background:#DE6F4C; color:#fff;}

/* blockquotes */
blockquote.blockquote-large {text-transform: uppercase; border:0; padding:0;}
blockquote.blockquote-large p {font-size:20px; font-weight: 700; color:#bcbaba;}
blockquote.blockquote-large i {font-size:30px;}
blockquote.blockquote-border-top {text-transform: uppercase; border:0; padding:15px 0 0; border-top:4px solid #3190E7;}
blockquote.blockquote-border-top p {font-size:20px; font-weight: 700;}
blockquote.blockquote-colored {border-radius:5px; padding:25px; background: #3190E7; border:0;}
blockquote.blockquote-colored p {font-size:20px; font-weight: 700; text-align:center; color:#fff; margin-bottom:0;}
blockquote.blockquote-colored p::before {color: #ccc;  content: open-quote;  font-size: 4em;  line-height: 0;  vertical-align: -30px;}
blockquote.blockquote-colored p::after {color: #ccc;  content: close-quote;  font-size: 4em;  line-height: 0; vertical-align: -55px;}

/* buttons */
.btn {transition: all 250ms ease-out 0s;}
.btn.btn-default {background:#EAEDF2; border:0; text-shadow:none;}
.btn.btn-blue {background:#0238A1; color:#fff; border:0; text-shadow:none;}
.btn.btn-green {background:#619B89; color:#fff; border:0; text-shadow:none;}
.btn.btn-darkblue {background:#1E3549; color:#fff; border:0; text-shadow:none;}
.btn.btn-red {background:#F43955; color:#fff; border:0; text-shadow:none;}
.btn.btn-royalblue {background:#30A3FE;  color:#fff; border:0; text-shadow:none;}
.btn.btn-darkgray {background:#302E24;  color:#fff; border:0; text-shadow:none;}
.btn.btn-orange {background:#EF7841;  color:#fff; border:0; text-shadow:none;}
.btn:hover {background:#666; color:#fff;}
.btn.medium {font-size:18px; padding:10px 22px;}
.btn.large {font-size:24px; padding:15px 30px;}
.btn.rounded {border-radius: 30px;}
.btn.rectangle {border-radius: 0;}

/* progress bars */
@-webkit-keyframes progress-bar-stripes { from { background-position: 40px 0;} to { background-position: 0 0; }}
@keyframes progress-bar-stripes { from { background-position: 40px 0;} to { background-position: 0 0;}}
.six-sec-ease-in-out { -webkit-transition: width 6s ease-in-out; -moz-transition: width 6s ease-in-out; -ms-transition: width 6s ease-in-out; -o-transition: width 6s ease-in-out; transition: width 6s ease-in-out;}
.progressinfo {display:block; padding-bottom:30px;}
.progresstitle {float:left;}
.progresspercent {float:right;}
.progress {  clear:both;  overflow: hidden;  height: 5px;  margin-bottom: 30px;  background: #f5f5f5;  border-radius: 2px;  box-shadow: none;}
.progress.progress2 {  height: 20px;  margin-bottom: 20px;}
.progress-bar {float: left; width: 0%; height: 100%; line-height: 5px; color: #fff; text-align: center; background-color: #337ab7; box-shadow: none; -o-transition: width 0.6s ease; transition: width 0.6s ease;}
.progress.progress2 .progress-bar {  line-height: 20px;  color: #ffffff;}
.progress-striped .progress-bar, .progress-bar-striped { background-image: -webkit-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);  background-image: -o-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);  background-image: linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);  background-size: 40px 40px;}
.progress.active .progress-bar, .progress-bar.active {  -webkit-animation: progress-bar-stripes 2s linear infinite;  -o-animation: progress-bar-stripes 2s linear infinite;  animation: progress-bar-stripes 2s linear infinite;}
.progress-bar-success {  background-color: #5cb85c;}
.progress-striped .progress-bar-success { background-image: -webkit-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);  background-image: -o-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);  background-image: linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);}
.progress-bar-info {  background-color: #5bc0de;}
.progress-striped .progress-bar-info {  background-image: -webkit-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);  background-image: -o-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);  background-image: linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);}
.progress-bar-warning {  background-color: #f0ad4e;}
.progress-striped .progress-bar-warning {  background-image: -webkit-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);  background-image: -o-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);  background-image: linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);}
.progress-bar-danger {  background-color: #d9534f;}
.progress-striped .progress-bar-danger { background-image: -webkit-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);  background-image: -o-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);  background-image: linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);}
.progress {  position: relative;}
.progress .progress-bar { position: absolute;  overflow: hidden;  line-height: 20px;}
.progress .progressbar-back-text { position: absolute;  width: 100%;  height: 100%;  font-size: 12px;  line-height: 20px;  text-align: center;}
.progress .progressbar-front-text { display: block;  width: 100%;  font-size: 12px;  line-height: 20px;  text-align: center;}
.progress.right .progress-bar { right: 0;}
.progress.right .progressbar-front-text { position: absolute;  right: 0;}
.progress.vertical { width: 20px;  height: 100%;  float: left;  margin-right: 20px;}
.progress.vertical.bottom { position: relative;}
.progress.vertical.bottom .progressbar-front-text { position: absolute;  bottom: 0;}
.progress.vertical .progress-bar {width: 100%; height: 0; -webkit-transition: height 0.6s ease; -o-transition: height 0.6s ease; transition: height 0.6s ease;}
.progress.vertical.bottom .progress-bar { position: absolute;  bottom: 0;}

/* icon boxes */
.icon-box span.typcn { font-size:70px;color:#3190E7;}
.icon-box h3 { font-size:13px; letter-spacing: .06em;}
.icon-box p { font-size:15px; letter-spacing: .02em;}
.icon-box a.btn.btn-default {-webkit-transition: all 0.3s ease-in-out;  -moz-transition: all 0.3s ease-in-out;  transition: all 0.3s ease-in-out;   border: 1px solid #fff; border-radius:4px; background:#3190E7; color:#fff; font-size:12px; letter-spacing: .06em; font-weight:400; padding: 7px 18px 8px; text-shadow:none;}
.icon-box a.btn.btn-default:hover { background: #ffffff; color: #3190E7; border: 1px solid #3190E7;}
.icon-box.alt1 {text-align: center;}
.icon-box.alt1 p { padding:0 8px;}
.icon-box.alt2 .block-grid-item span.typcn {font-size:54px; display:table-cell; line-height:54px; float:left; margin-right:15px;}
.icon-box.alt2 .block-grid-item p {font-size:15px;}
.icon-box.alt2 .introtext-feature {overflow: hidden;}

/* ==================================
8 = Shop
==================================== */

.shop_product_wrapper {padding:20px 10px; border:1px solid #e8e8e8; border-radius:4px;}
.shop_product_wrapper select.orderby { font-size: 14px; padding: 5px 15px; float:right; border:1px solid #e8e8e8; margin:0; }
.shop_product_wrapper p.woocommerce-result-count  { font-size: 14px; margin:5px 0 0; }
.products-grid .block-grid-item .shadow-effect {padding:0;}
.products-grid .block-grid-item {min-height:300px;  border-radius:0; text-align:center; margin-bottom:25px;}
.products-grid .block-grid-item h3 { font-size:15px; letter-spacing: .06em; margin:20px auto 0; display:table; padding:0 15px;}
.products-grid .block-grid-item h6 { font-size:15px; letter-spacing: .12em; margin:6px 0; padding:0; font-weight:300;}
.products-grid .block-grid-item h6 ins {text-decoration: none;}
.products-grid .block-grid-item .product-details {padding: 10px 25px 25px;}
.products-grid .block-grid-item .product-details a.btn.btn-default {-webkit-transition: all 0.3s ease-in-out;  -moz-transition: all 0.3s ease-in-out;  transition: all 0.3s ease-in-out;   border: 1px solid #fff; border-radius:4px; background:#3190E7; color:#fff; font-size:12px; letter-spacing: .06em; font-weight:400; padding: 7px 18px 8px; text-shadow:none; margin-top:12px;}
.products-grid .block-grid-item .product-details a.btn.btn-default:hover { background: #ffffff; color: #3190E7; border: 1px solid #3190E7;}
nav.products ul.pagination {display:table; margin:45px auto;}
nav.products ul.pagination li {font-size:15px;}
nav.products ul.pagination li a {color:#808080; padding: 10px 18px 9px;}
nav.products ul.pagination li a:hover {background: #3190E7; color:#fff;}
.sidebar.shop .alignleft.shop {float:left; padding-right:15px; display:inline-block;}
.sidebar.shop  img.alignleft.shop {width:80px; height:auto;}
.sidebar.shop .widget span.price { font-size:15px; letter-spacing: .12em; margin:6px 0; padding:0; font-weight:300; display:block;}

/* Product Single */
  section.content.product-single {padding:65px 0 0;}
#single-product-carousel.owl-carousel {margin-top:20px;}
#single-product-carousel.owl-carousel .owl-controls {padding:20px;}
#single-product-carousel.owl-carousel .owl-controls .owl-nav [class*="owl-"] {  background: #666666 none repeat scroll 0 0;  }
#single-product-carousel.owl-carousel .owl-controls .owl-nav [class*="owl-"]:hover {background: #666666 none repeat scroll 0 0; color: #000;  transform: translate3d(0px, -50%, 0px) scale(0.5);}
#single-product-carousel.owl-carousel .owl-controls .owl-nav .disabled { opacity: 1;  }
#single-product-carousel.owl-carousel.owl-theme .owl-dots .owl-dot span {background: #666666 none repeat scroll 0 0; height: 20px; margin: 0 3px; transform: translate3d(0px, -50%, 0px) scale(0.3); transform-origin: 50% 50% 0; transition: all 250ms ease-out 0s;  width: 20px;  }
#single-product-carousel.owl-carousel.owl-theme .owl-dots .owl-dot.active span, #single-product-carousel.owl-carousel.owl-theme .owl-dots .owl-dot:hover span {background: #3190E7 none repeat scroll 0 0; transform: translate3d(0px, -50%, 0px) scale(0.5);}
.product-single-summary {padding:0 0 0 35px; margin:0;}
.product-single h2 {font-size:24px; text-align: left; padding-top:0; margin-top:0!important;}
.product-single hr.small { border: solid #3190E7; border-width: 1px 0 0; margin: 0; margin-top:31px; margin-bottom:31px; max-width:70px;}
.product-single h6.price { font-size:19px; letter-spacing:.07em; background:#F3F5F7; padding:11px 15px; display:table; width:auto; font-weight:300; margin-bottom:35px;}
.product-single .quantity {margin:35px 0 0;}
.product-single .quantity .qty { width: 4.32em;  text-align: center;}
.product-single .cat-tags {margin:35px 0 0;}
.product-single .cat-tags p {margin:0;}
.product-single input[type="number"] { border-radius:0;border: solid 1px #E7F0F6;background: #F3F5F7;  outline: 0px; padding: 9px 8px; float: left; margin: 0 6px 0 0;}
.product-single a.btn.btn-default {-webkit-transition: all 0.3s ease-in-out;  -moz-transition: all 0.3s ease-in-out;  transition: all 0.3s ease-in-out;   border: 1px solid #fff; border-radius:4px; background:#3190E7; color:#fff; font-size:14px; letter-spacing: .06em; font-weight:400; padding: 9px 18px; text-shadow:none;}
.product-single a.btn.btn-default:hover { background: #ffffff; color: #3190E7; border: 1px solid #3190E7;}

 section.content.product-single-tabs {background:#F3F5F7; padding:60px 0;}
 section.content.product-single-tabs .tab-content p {margin:0;}
section.content.product-single-tabs .tab-content .table-responsive table tr td:first-child {width:30%; background:#f3f5f7;}
#product-reviews .rate i {color:#28CB75;}
#product-reviews form#commentform label, form#commentform p {font-weight:300; display:block; margin-bottom:10px;}
#product-reviews form#commentform input#submit {background:#3190E7; margin-top: 0; color:#fff; padding:9px 12px 10px; font-size:16px; border:0; -webkit-border-radius: 4px;-moz-border-radius: 4px;border-radius: 4px; margin-top:12px;}
#product-reviews form#commentform input#submit:hover {  background: #6E6E6E;}
#product-reviews form#commentform select { font-size: 18px; height: 55px; padding: 5px 15px; width: 100%; border-radius:4px; border:1px solid #ccc; box-shadow:none; }

.content.shop-cart {padding:65px 0 0;}
.content.shop-cart .table-responsive table tr th {text-align:center; vertical-align:middle; background:#666666; color:#fff; border-color:#666; padding:12px 0; border-top:1px solid #666;}
.content.shop-cart .table-responsive table tr td {text-align:center; vertical-align:middle;}
.content.shop-cart .table-responsive table tr td img {width:90px; height:auto;}
.content.shop-cart .table-responsive table tr td a span.typcn {font-size:30px; color:#ccc;}
.content.shop-cart .table-responsive table tr td a span.typcn:hover { color:#3190E7;}
.content.shop-cart .table-responsive { box-shadow: 0 19px 38px rgba(0,0,0,0.10), 0 15px 12px rgba(0,0,0,0.02); }
.content.shop-cart .table-responsive table {margin-bottom:0;}

section.content.calculate-shipping  {padding:55px 0 130px;}
section.content.calculate-shipping .shop-cart-bordered {padding:25px; border-radius:5px; border:1px solid #d9d9d9; overflow:hidden;}
section.content.calculate-shipping .shop-cart-bordered h3 {font-size:21px; padding:0 0 17px; margin:0 0 20px; border-bottom:1px solid #e8e8e8;}

section.content.calculate-shipping .shop-cart-bordered input, section.content.calculate-shipping .shop-cart-bordered select {margin-top:9px; height:40px; border-radius:5px; box-shadow:none; border:1px solid #f0e9e8; background:#F3F5F7; font-size:13px;}
section.content.calculate-shipping .shop-cart-bordered button {margin-top:15px; height:40px; border-radius:5px; box-shadow:none; width:auto; padding:9px 17px;}
.shop-cart-bordered span.cart-total {text-align:right; display:block;}
.shop-cart-bordered hr {margin-top:32px; margin-bottom:32px;}


/* ==================================
9 = Footer
==================================== */
section.footer {background:#666; padding:60px 0; overflow:visible;}
.footer-elements {margin-top:-120px;}
.footer-element { background: #3190E7; padding: 8px 15px 15px; text-align:center; box-shadow: 0 19px 38px rgba(0,0,0,0.10), 0 15px 12px rgba(0,0,0,0.02);}
.footer-element span.typcn { font-size:45px;color:#fff; margin-bottom:15px;}
.footer-element p { font-size:14px; color:#fff;margin-bottom:0;}
.footer-element p span { display: block;}
.footer-element p a { color:#fff;}
.footer-widgets { margin-top: 42px;}
.footer-widget { padding-right:25px;}
.footer-widgets .small-logo { margin:10px 0 15px;}
.footer-widgets p { font-size:15px; color:#ccc;margin-bottom:0;}
.footer-widgets h5 { font-size:18px; color:#fff;margin:12px 0 20px; padding:0;}
.footer-widgets ul.posts { margin:0; padding:0; list-style: none;}
.footer-widgets ul.posts li {padding:9px 0; border-bottom:1px solid #747474; font-size:15px;}
.footer-widgets ul.posts li:first-child {padding-top:0; }
.footer-widgets ul.posts li:last-child {border-bottom:0; }
.footer-widgets ul.posts li a {color:#ccc; transition: all 250ms ease-out 0s;}
.footer-widgets ul.posts li a:hover {color:#fff;}
.footer-widgets ul.posts li span {display:block;font-size:12px; margin-top:3px;color:#B9B9B8;}
#mc_embed_signup { margin-top:15px;}
#mc_embed_signup input[type="email"] { border-radius:5px; width:100%; padding:10px 15px; border:0; box-shadow: 0;}
#mc_embed_signup input[type="submit"] { margin-top:5px; transition: all 250ms ease-out 0s; border-radius:5px; width:100%; padding:10px 15px; border:0; box-shadow: 0; color:#fff; background:#28CB75;}
#mc_embed_signup input[type="submit"]:hover { background:#808080;}

/* Social Buttons ---------------------- */
.social-links {margin:20px 0 0; padding:0;}
.social-links li { list-style: none;  display: inline-table;}
.social-links li a { color:#fff; font-size:13px; display: inline-block;  padding-top:7px;  text-align: center;  height: 34px;  width: 34px;  position: relative; z-index: 1; -webkit-transition: color 0.15s; transition: color 0.15s; -moz-osx-font-smoothing: grayscale; border-radius:50%; -webkit-backface-visibility: hidden;}
.social-links li a::before { content: '';  position: absolute;  top: 0;  left: 0;  width: 100%;  height: 100%;  border-radius: inherit;  z-index: -1;  box-shadow: inset 0 0 0 35px #808080;  -webkit-transform: scale3d(0.7, 0.7, 1);  transform: scale3d(0.7, 0.7, 1);  -webkit-transition: box-shadow 0.15s, -webkit-transform 0.15;  transition: box-shadow 0.15s, transform 0.15s;}
.social-links li a:hover::before {  -webkit-transform: scale3d(1.0, 1.0, 1);  transform: scale3d(1.0, 1.0, 1); box-shadow: inset 0 0 0 35px  #009DE0;}

.copyright {padding:15px 0; background:#525151;}
.copyright p {font-size:14px; color:#ccc; margin-bottom:0;}

/* Back to Top Button  ----------------------- */
#back-to-top { color:#fff; position:fixed; bottom:20px; right:20px; z-index:99; display:none; text-align: center; border-radius: 50%; -moz-border-radius: 50%;  -webkit-border-radius:  50%; -o-border-radius:  50%;    z-index: 10000;    height: 59px;    width: 59px;    background-color:#3190E7;    background-repeat: no-repeat;    background-position: center;  box-shadow: 0 1px 1.5px 0 rgba(0, 0, 0, 0.12), 0 1px 1px 0 rgba(0, 0, 0, 0.24); -webkit-transform: scale3d(0.7, 0.7, 1);  transform: scale3d(0.7, 0.7, 1);  -webkit-transition: box-shadow 0.15s, -webkit-transform 0.15;  transition: box-shadow 0.15s, transform 0.15s;}
#back-to-top i { padding-top:20px; font-size:17px; }
#back-to-top:hover { background:#28CB75;  -webkit-transform: scale3d(1.0, 1.0, 1);  transform: scale3d(1.0, 1.0, 1);}

#back-to-top1 { color:#fff; position:fixed; bottom:20px; right:20px; z-index:99; display:none; text-align: center; border-radius: 50%; -moz-border-radius: 50%;  -webkit-border-radius:  50%; -o-border-radius:  50%;    z-index: 10000;    height: 59px;    width: 59px;    background-color:#3190E7;    background-repeat: no-repeat;    background-position: center;  box-shadow: 0 1px 1.5px 0 rgba(0, 0, 0, 0.12), 0 1px 1px 0 rgba(0, 0, 0, 0.24); -webkit-transform: scale3d(0.7, 0.7, 1);  transform: scale3d(0.7, 0.7, 1);  -webkit-transition: box-shadow 0.15s, -webkit-transform 0.15;  transition: box-shadow 0.15s, transform 0.15s;}
#back-to-top1 i { padding-top:20px; font-size:17px; }
#back-to-top1:hover { background:#28CB75;  -webkit-transform: scale3d(1.0, 1.0, 1);  transform: scale3d(1.0, 1.0, 1);}

/* ===================
 10 = Media Queries
 =================== */

 /* For IE Edge (Spartan)  ----------------------- */
 @supports (-ms-accelerator:true) {
    ::-webkit-input-placeholder {  opacity:  0;}
}
/* End For IE Edge (Spartan)  ----------------------- */

@media only screen and (max-width: 767px) {
    .header ul.phone {margin:0 auto; display:table; text-align: center;}
    .header ul.toplinks {margin:12px auto 0; display:table; float:none; text-align: center;}
    .header ul.phone li, .header ul.toplinks li {font-size:12px;}
    .header.header2 ul.phone li {float:none; margin-right:0; display:block; text-align: center;}
    .header.header2 ul.phone li:first-child {border:0;}
    #navigation {display:none;}
.slicknav_menu {display:block; font-size:13px; font-weight:500; background:#29303C;  border-bottom:1px solid #494B4C; top: 0; z-index:9999;}
.slicknav_btn {font-size:16px; background:#3190E7; border-radius:5px; padding:7px 10px; display:table; margin:8px auto; float:none; }
.slicknav_nav a {text-transform: uppercase; font-size:13px; font-weight:500;}
.slicknav_nav a:hover {-webkit-border-radius: 0!important; -moz-border-radius: 0!important; border-radius:0!important; background:#373f4b!important; color: #fff; }
 .slicknav_nav a {font-size: 14px;}
  .slicknav_nav a:hover {text-decoration: none;}
    .header .logonav {padding:10px 20px; display:table; margin:15px auto 0; }
    .header .logo {margin-top:0; padding-left:0; max-width:230px; text-align:center;}
   #index-slider .sp-slide .hw-the-slider-captions { padding: 0 30px;}
    #index-slider .sp-slide h2 {font-size:25px;}
    #index-slider.home2.owl-carousel .item h3 {font-size:24px; padding-right:45px;}
    #index-slider2 .sp-slide .hw-the-slider-captions {padding: 0 10px;}
    section.testimonials.home2 .shadow-effect:after {left: 18%; }
    #clients-carousel .item img {padding:15px;}
    section.aboutus, section.numbers {background: #eaedf2; min-height:0; padding-top:55px;}
    section.calltoaction.home3 .shadow-effect {margin-top:40px;}
    .footer-widget {padding-right:0; margin-bottom:35px;}
    .footer-widget:last-child {margin-bottom:0;}
    .image-mockup {margin-bottom:70px; padding:0; text-align: center;}
    section.services3-list .service-image, section.services3-list.gray .service-image {float:none;}
    section.services3-list .text-padding, section.services3-list.gray .text-padding  {padding:20px;}
    .about1-numbers  .shadow-effect, #about1-slider {margin-bottom: 20px;}
    .normaltabs.tabs-top-horizontal > .nav-tabs > li { margin: 0 0 20px; display: block; width:100%; }
    .normaltabs.tabs-top-horizontal > .nav-tabs > li > a {  padding:10px 7px;font-size:12px;}
    .skills-progressbars {padding-left:0; margin-top:50px;}
    #video-header .video-header-message h1 {font-size:28px; padding:0 20px;}
    .pricingtables .most-popular { top:0;}
    section.services2 .blockquote-colored {margin:30px 0;}
    .bigtabs.tabs-top-horizontal > .nav-tabs > li {  float: left; min-width:100%; display:block; margin: 20px 8px;}
    .bigtabs.tabs-top-horizontal .tab-content p.subtitle {padding:0;}
    #about2-video .about2-video-container:after { background:#fff; opacity:0; }
    .tabs-left-vertical .tab-content {padding:0; float:none; width:100%; margin-top:20px;}
    .tabs-left-vertical > .nav-tabs { float:none; width:100%;  }
    .tabs-left-vertical > .nav-tabs .active:after {border-width: 0;}
    .negative-margin {margin-top:35px;}
    .single-project .shadow-effect .element {margin-bottom:20px;}
    #single-project-slider.owl-carousel .owl-controls {display:none; }
    .single-project .shadow-effect h3 {font-size:12px; }
    .single-project .shadow-effect .single-project-elements {padding:10px; }
    .single-project .shadow-effect hr.small {margin-top:20px; margin-bottom:20px;}
    .single-project .shadow-effect h4, .single-project-elements.elements h4 { max-width: 300px; font-size: 20px;}
    .sharing-buttons ul li { padding:11px 2px 12px;}
    .sharing-buttons ul li i { font-size:12px; width:25px; height:25px; padding:6px 0 0 0;}
    span.prev, span.next {float:none; display:table; margin:0 auto;}
    span.navto { margin:22px auto;  }
    #single-project-carousel.owl-carousel .owl-controls {display:none;}
    .blog article {padding-right:0;}
    .blog article .post-content .themeta span {display:inline-block; margin: 0 10px 10px 0;}
    .blog nav ul.pagination li {font-size:14px;}
    .blog nav ul.pagination li a {padding: 10px 12px 9px;}
    .author-gravatar img {max-width:90px; display:table; margin:0 auto 25px;}
    .shop_product_wrapper select.orderby {float:none; display:table; margin:0 auto; }
    .shop_product_wrapper p.woocommerce-result-count  { margin:5px 0 12px; text-align:center;}
    section.content.calculate-shipping .shop-cart-bordered {margin-top:22px;}
}

@media (min-width: 768px) {
    .block-grid-sm-1 > .block-grid-item { width: 100%; }
    section.projects1 .block-grid-sm-3 > .block-grid-item { width: 33.3%; }
    section.projects1 .block-grid-sm-4 > .block-grid-item { width: 24.985%; }
    section.projects1 .block-grid-md-4 > .block-grid-item { width: 24.985%; }
    section.projects2 .block-grid-sm-3 > .block-grid-item { width: 33.3%; }
    section.projects2 .block-grid-sm-4 > .block-grid-item { width: 24.985%; }
    section.projects2 .block-grid-md-4 > .block-grid-item { width: 24.985%; }
}

@media only screen and (min-width: 768px) and (max-width: 959px) {
    .header .logo {margin-top:10px;}
    .header.header2 ul.phone li:first-child {border:0;}
    .header.header2 .logo {margin-top:19px;}
    .sf-menu li a {padding:25px 8px;  font-size: 0.7em;}
    .sf-menu ul {  min-width:7.5em; *width: 7.5em;}
    .introtext .shadow-effect {  padding: 10px;}
    .introtext .shadow-effect i { font-size:50px;}
    .introtext .shadow-effect h3 { font-size:13px; letter-spacing: .03em;}
    .introtext .shadow-effect p { font-size:14px; letter-spacing: 0;}
    section.aboutus, section.numbers {padding-top:115px;}
    section.calltoaction.home3 .cta-title {font-size:14px; padding:10px 15px;}
    .footer-element {padding: 15px 10px;}
    .footer-element p { font-size:13px; }
    .footer-widget {padding-right:5px;}
    .services1-grid .block-grid-item h3 { font-size:11px;}
    section.services3-list .service-image, section.services3-list.gray .service-image {float:none;}
    section.services3-list .text-padding, section.services3-list.gray .text-padding  {padding:20px;}
    #about1-slider {margin-bottom: 20px;}
    .skills-progressbars {padding-left:0; margin-top:50px;}
    #about2-video .about2-video-container {  min-height: 360px; }
    #about2-video .about2-video-container .videocaption .videocaption-content {padding:15px; outline-offset: -8px; }
    #about2-video .about2-video-container .videocaption .videocaption-content h2 {font-size: 22px;}
    #about2-video .about2-video-container .videocaption .videocaption-content hr { margin:13px auto; }
    #about2-video .about2-video-container .videocaption .videocaption-content p { font-size: 13px; margin-top: 15px; }
    section.services2 .blockquote-colored {margin:30px 0;}
    .bigtabs.tabs-top-horizontal > .nav-tabs > li { margin:0 3px; min-width:150px;}
    .tabs-left-vertical .tab-content {width:80%;}
    .tabs-left-vertical > .nav-tabs { width:20%;  }
    .single-project .shadow-effect .single-project-elements {padding:10px; }
    .about1-numbers.contact span a {font-size:12px;}
}

@media only screen and (min-width: 960px) and (max-width: 1025px) {
  .services1-grid .block-grid-item h3 { font-size:15px;}
  #about2-video .about2-video-container {  min-height: 450px; }
  .negative-margin {margin-top:-35px;}
}

@media only screen and (max-width: 1025px) {
  #search form {left: 5%;  right: 5%;}
  #search input[type="search"] {font-size:35px; }
  #index-slider2 .sp-slide.sp-selected .title-frame {width:100%;}
}

@media only screen and (min-width: 1026px) and (max-width: 1601px) {
 #index-slider2 .sp-slide.sp-selected .title-frame {width:80%;}
 #index-slider2 .sp-slide .hw-the-slider-captions {padding: 0 40px;}
}

@media (min-width: 768px) {
    .col-sm-15 { width: 20%;  float: left; }
}
@media (min-width: 992px) {
    .col-md-15 { width: 20%;  float: left; }
}
@media (min-width: 1200px) {
    .col-lg-15 { width: 20%;  float: left; }
}

/*marco*/
.toplinks form {
	display: inline-block;
	height: 16px;
}
.toplinks form input {
	padding: 0;
	color: #000;
	width: 100px;
}
.toplinks form .bottone {
	width: 60px;
}
.skype {
	color: #FFF;
	text-decoration: underline;
}



@media only screen and (max-width: 400px) {
	.resp {
		display: none;
	}
	.resp2 {
		font-family: inherit; font-size: 17px; line-height: 1.5; margin: 0 0 17px 0;  font-weight: 300;
	}
	.header ul.toplinks {
		height: 60px;
	}
	.title-breadcrumbs h1 {
		margin-top: 100px;
	}
	.login {
		display: none !important;
	}
}
@media only screen and (min-width : 401px){
	.resp2 {
		display: none !important;
}
}



@media (max-width: 768px) {

.slicknav_menu{
position: fixed;
top: 0;
width: 100%;
z-index:2000000000;
overflow-y: auto;
max-height: 500px;
}

.header-navigation{
display:none;
}

.header{
margin-top: 60px;
}

.slider-pro{
top: -130px;
}

#hw-hero{
height: 600px;
}
#page-header{
height:600px;
}
.title-breadcrumbs{
top: 35%;
}

}


.shadow-effect {
word-wrap:break-word;
}





/* >>> PRELOAD STUDIO PAGHE MF - generato, non modificare a mano >>> */
/* [24/08/2026] Terza forma, e questa e' quella giusta. Prima una barra col
   blu di Bootstrap, poi coi colori di casa, poi sottile e discreta: restava
   sempre una barra, cioe' una promessa di misura che questa pagina non puo'
   mantenere — il tempo era fisso nel codice, non legato al caricamento vero.
   Uno spinner dice soltanto «sto lavorando», che e' tutto cio' che si sa.

   Il markup nelle 22 pagine non e' stato toccato: `.progress` smette di
   essere una striscia e diventa il riquadro centrato, `.progress-bar` si
   spegne, e lo spinner con la scritta arrivano dagli pseudo-elementi. */

/* --- il riquadro al centro ----------------------------------------------- */
/* Lo spinner resta finche' la pagina non e' pronta, e NON un secondo.
   Il sito fa $('.progress').hide() dopo 1000 ms: quello scrive display:none
   nell'attributo style, che batte qualunque regola senza !important — e lo
   spinner spariva prima che si potesse vederlo, o non compariva affatto su
   una pagina in cache. Adesso la visibilita' e' legata allo STATO
   (#containerxx a opacity:0 = sto caricando), non a un timer. */
body:has(#containerxx[style*="opacity:0"]) .progress,
body:has(#containerxx[style*="opacity: 0"]) .progress{
  display:flex !important; visibility:visible !important; opacity:1 !important;
}
.progress{
  position:fixed; inset:0; z-index:3;
  display:flex; flex-direction:column; align-items:center; justify-content:center;
  gap:18px;
  height:auto; margin:0; padding:0;
  background:transparent; border-radius:0; box-shadow:none; overflow:visible;
  pointer-events:none;
}

/* Lo SPINNER. Un anello sottile con un quarto acceso: su una fotografia il
   bianco si legge sempre, e un cerchio non compete con l'immagine come
   farebbe una barra colorata larga quanto lo schermo. */
.progress::before{
  content:"";
  width:58px; height:58px; border-radius:50%;
  border:2.5px solid rgba(255,255,255,.20);
  border-top-color:rgba(255,255,255,.94);
  /* `rotate(0)` esplicito: senza, il valore calcolato e' `none` e
     l'interpolazione verso `rotate(360deg)` non parte. Era questo a tenere
     l'anello fermo. */
  transform:rotate(0deg);
  animation:mf-gira 820ms linear infinite;
  will-change:transform;
  order:1;
}

/* La SCRITTA. Il nome dello studio, non «caricamento»: chi aspetta sa gia'
   di stare aspettando, e in quel secondo l'unica cosa che vale la pena
   dirgli e' dove e' arrivato. */
/* Il nome dello studio, e sotto il mestiere. Due pesi diversi: il primo si
   legge, il secondo si riconosce. */
.progress::after{
  content:"Studio Paghe MF";
  order:2;
  font-family:'Lato','PT Sans',system-ui,sans-serif;
  font-size:28px; font-weight:900;
  letter-spacing:.14em; text-transform:uppercase;
  color:rgba(255,255,255,.97);
  text-shadow:0 1px 16px rgba(2,26,52,.55);
  /* Il logo sta a SINISTRA del nome, non su una riga sua: marchio e nome si
     leggono insieme. Data URI e non un file: durante il preload la rete sta
     ancora scaricando la pagina, e una richiesta in piu' per l'immagine
     arriverebbe a marchio gia' scomparso. */
  padding-left:64px;
  min-height:52px; line-height:52px;
  background:url("../images/logo.png") left center / 52px 52px no-repeat;
}

/* La barra non serve piu' come barra, ma l'elemento c'e' in tutte le 22
   pagine: invece di sprecarlo, porta la seconda riga. Nessun markup nuovo. */
.progress .progress-bar{
  display:block !important; width:auto !important; height:auto !important;
  float:none !important; background:none !important; box-shadow:none !important;
  animation:none !important; -webkit-animation:none !important;
  overflow:visible !important; position:static !important;
  text-align:center; line-height:1.5;
  order:3;
  max-width:min(92vw, 460px);
}
.progress .progress-bar::before{
  /* Riga 1 e riga 2 insieme SONO la denominazione completa: «Studio Paghe MF
     Societa' tra Professionisti S.r.l.». Spezzate come su una carta
     intestata — il nome col corpo grande, la forma sociale sotto per esteso —
     perche' su una riga sola sarebbe larga il doppio di uno schermo di
     telefono. Fonte: privacy.php, politicaq.php, inc/footer.php. */
  content:"Societ\0000E0  tra Professionisti S.r.l.";
  display:block;
  font-family:'PT Sans',system-ui,sans-serif;
  font-size:18px; font-weight:400; letter-spacing:.05em;
  color:rgba(255,255,255,.72);
  text-shadow:0 1px 12px rgba(2,26,52,.5);
}
/* La terza riga porta l'attivita' e le due sedi, e nient'altro.
   Le versioni precedenti erano fuori dalla deontologia: «oltre 900 aziende ci
   hanno gia' scelto» e' autopromozione con prova sociale, «cambiare studio e'
   piu' semplice di quanto pensi» e' un invito a lasciare un altro
   professionista, cioe' accaparramento di clientela. Il codice deontologico
   dei Consulenti del Lavoro vuole comunicazione veritiera, non comparativa e
   NON SUGGESTIVA: chi sei, cosa fai, dove stai. Le sedi sono un fatto, stanno
   in contatti.php, e non invecchiano. */
.progress .progress-bar::after{
  content:"Consulenza del lavoro \0000B7  Tivoli (RM) \0000B7  Arcore (MB)";
  display:block; margin-top:14px;
  font-family:'PT Sans',system-ui,sans-serif;
  font-size:16px; letter-spacing:.05em; line-height:1.5;
  color:rgba(255,255,255,.74);
  /* Nessun ritardo: prima era un avviso di attesa e nasconderlo aveva senso,
     adesso e' un dato identificativo e va letto subito. */
}
@keyframes mf-tardi{ to{ opacity:1 } }

/* La barra non serve piu': il markup resta, l'elemento sparisce. */
/* Delle vecchie regole della barra resta solo lo spegnimento delle strisce:
   l'elemento adesso porta il testo, quindi non va nascosto. */
.progress-striped .progress-bar,
.progress-bar-striped,
.progress.active .progress-bar,
.progress-bar.active{
  background-image:none !important;
  animation:none !important; -webkit-animation:none !important;
}

@keyframes mf-gira{
  from{ transform:rotate(0deg); }
  to{ transform:rotate(360deg); }
}

/* --- il fondo: il primo fotogramma dell'apertura ------------------------- */
/* Niente bianco, mai. `body{background:#fff}` (riga 20) restava scoperto per
   tutto il caricamento, e dopo la prima correzione riemergeva DURANTE la
   dissolvenza: per questo la tinta la prende anche il body. */
body{ transition:background-color 900ms cubic-bezier(.4,0,.5,1); }
body:has(#containerxx[style*="opacity:0"]),
body:has(#containerxx[style*="opacity: 0"]){ background-color:#4476A3; }

/* Gli pseudo-elementi esistono SEMPRE, con `opacity` 0 o 1: se vivessero
   dentro il selettore `:has()` smetterebbero di esistere a pagina pronta, e
   cio' che non esiste non dissolve — spariva di colpo. */
body::before{
  content:""; position:fixed; inset:0; z-index:0; pointer-events:none;
  opacity:0; transition:opacity 900ms cubic-bezier(.4,0,.5,1);
  background-color:#4476A3;
  background-image:url("data:image/jpeg;base64,/9j//gAQTGF2YzYyLjI4LjEwMAD/2wBDAAgYGBwYHCEhISEhISckJygoKCcnJycoKCgrKyszMzMrKysoKCsrMDAzMzc5NzQ0MzQ5OTw8PEhIRUVUVFdnZ3z/xAB3AAEBAQEAAAAAAAAAAAAAAAAGBQQHAQEBAQEBAAAAAAAAAAAAAAAEAwIBABAAAQIEAgkDBQEAAAAAAAAAAQIRAwASIUExUQUiBDJhUoEzcbFTkZJDE3IUEQACAgICAwEBAAAAAAAAAAAAARECITEyEmFxUcFB/8AAEQgAFgAoAwESAAISAAMSAP/aAAwDAQACEQMRAD8Ao0FS4b1+eNo+MzIh6xLj+4i+HEpI0zx2CdXgwqjVZZ9DbdEER47V5QsqejF5AQtaxERSooAMUpCnezBnlch+vkFH6KnwdvpNBvEx6dMjhrIUgKPE7MhR9puHz9JFsDgoNSTt44p5SA3nW/6ckhTC71DObz7IZZMrCQpUgtH8n3DoHOeZHWsVSlAJG2iosctkDRKJMdZDwabgBQYhSB64C4tgc5xw+Ge2Um2dq4kwjcI71A3GLsX+syE4zFqCjLpyTX9FX+tRWhw+TNa+BNjJv8iPUTB1hCHplVaWQrtDGPvBVEAiAFiL0ix75zEj+XuPaS14yj1OAm2LQavzZUEeqp0i+dhoZ+Uxk495SkbWgdjL2f/Z");
  background-size:cover; background-position:16% 45%;
  filter:saturate(.78) contrast(1.08) brightness(1.04) blur(6px);
  transform:scale(1.04);
}
body::after{
  content:""; position:fixed; inset:0; z-index:0; pointer-events:none;
  opacity:0; transition:opacity 1100ms cubic-bezier(.4,0,.5,1);
  background-image:
    linear-gradient(to bottom, rgba(2,40,78,0) 46%, rgba(2,40,78,.42) 100%),
    linear-gradient(rgba(5,90,168,.62), rgba(5,90,168,.62)),
    image-set(url("../images/preload-frame.webp") type("image/webp"),
              url("../images/preload-frame.jpg") type("image/jpeg"));
  background-size:cover; background-position:16% 45%;
}
body:has(#containerxx[style*="opacity:0"])::before,
body:has(#containerxx[style*="opacity: 0"])::before,
body:has(#containerxx[style*="opacity:0"])::after,
body:has(#containerxx[style*="opacity: 0"])::after{ opacity:1; }

/* Il contenuto della pagina sta sopra il fondo. */
body > *:not(.progress){ position:relative; z-index:1; }

/* Sotto i 420px il marchio in orizzontale mangerebbe la riga e la frase
   andrebbe a capo in tre: li' tutto scala di un gradino. */
@media (max-width: 420px){
  .progress::before{ width:48px; height:48px; }
  .progress::after{
    font-size:21px; letter-spacing:.10em;
    padding-left:46px; min-height:38px; line-height:38px;
    background-size:38px 38px;
  }
  .progress .progress-bar::before{ font-size:15.5px; }
  .progress .progress-bar::after{ font-size:14px; letter-spacing:.03em; }
}

@media (prefers-reduced-motion: reduce){
  /* Rallentato, non spento: un anello immobile non dice «sto lavorando»,
     dice «sono bloccato». Due secondi e mezzo per giro restano percepibili
     senza essere un elemento che pulsa. */
  .progress::before{ animation-duration:2600ms; }
  .progress .progress-bar::after{ animation:none; opacity:1; }
  body::before, body::after, body{ transition:none; }
}
/* <<< PRELOAD STUDIO PAGHE MF <<< */
