@import url(http://fonts.googleapis.com/css?family=Lato:700,300,100);
@import url(../fontawesome/css/font-awesome.min.css);

html {
    -webkit-font-smoothing: antialiased;
}

body {
    background: #323232;
    font-family: 'Lato', sans-serif;
    font-weight: 300;
    color: #fff;
    padding: 0px 0px;
    margin:0px;
     /*overflow-x:hidden !important;
    overflow-y:hidden !important;*/ 
   

}

p {
    font-size: 25px;
    line-height: 1.5;
}

a {
    color: #c5c5c5;
}

    a:hover {
        text-decoration: none;
        color: #00c4ff;
    }

div,
input,
select,
textarea,
span,
img,
table,
td,
th,
p,
a,
button,
ul,
li {
    -webkit-border-radius: 0 !important;
    -moz-border-radius: 0 !important;
    border-radius: 0 !important;
}

ul, ol {
    padding: 0 !important;
    margin: 0;
}

.indietro {color:#fff; font-size:40px;}


form {
    margin: 0 0 0;
}

/* for highlights */
::selection {
    background: #000; /* Safari */
}

::-moz-selection {
    background: #000; /* Firefox */
}

/*------------- General Styles -------------*/

/* Custom container */
.container-narrow {
    margin: 0 auto;
    max-width: 1080px; /*960*/
    position: relative;
    /*padding-top: 55px;*/
}

/* Span Styles */
.well {
    border: 0;
    overflow: hidden;
    position: relative;
    height: 200px;
    z-index: 1; /* Fix bug on webkit browsers */
}

.large {
    height: 620px;
}
/* Used for main content such as home, about, work and contact */

.fixed-height {
    height: 300px !important;
}




/* For spans which you want to stay the same height on devices down to 767px */

.no-padding {
    padding: 0;
}
/* Used for items such as sliders */

.padding {
    padding: 20px;
}

.overflow-show {
    overflow: visible;
}
/* Need when box contains .outer-box or other overlapping items */

.click {
    cursor: pointer;
}
/* Used it item is clickable */

.fluid-height {
    height: 100% !important;
}

.shadow { /* Used on any div you want a long shadow on */
    box-shadow: #262525 1px 1px, #262525 2px 2px, #262525 3px 3px, #262525 4px 4px, #262525 5px 5px, #262525 6px 6px, #262525 7px 7px, #262525 8px 8px, #262525 9px 9px, #262525 10px 10px, #262525 11px 11px, #262525 12px 12px, #262525 13px 13px, #262525 14px 14px, #262525 15px 15px, #262525 16px 16px, #262525 17px 17px, #262525 18px 18px, #272626 19px 19px, #272626 20px 20px, #272626 21px 21px, #272626 22px 22px, #282727 23px 23px, #282727 24px 24px, #282727 25px 25px, #282727 26px 26px, #292828 27px 27px, #292828 28px 28px, #292828 29px 29px, #292828 30px 30px, #2a2929 31px 31px, #2a2929 32px 32px, #2a2929 33px 33px, #2a2929 34px 34px, #2b2a2a 35px 35px, #2b2a2a 36px 36px, #2b2a2a 37px 37px, #2b2a2a 38px 38px, #2c2b2b 39px 39px, #2c2b2b 40px 40px, #2c2b2b 41px 41px, #2c2b2b 42px 42px, #2c2c2c 43px 43px, #2c2c2c 44px 44px, #2c2c2c 45px 45px, #2c2c2c 46px 46px, #2d2d2d 47px 47px, #2d2d2d 48px 48px, #2d2d2d 49px 49px, #2d2d2d 50px 50px, #2e2e2e 51px 51px, #2e2e2e 52px 52px, #2e2e2e 53px 53px, #2f2f2f 54px 54px, #2f2f2f 55px 55px, #2f2f2f 56px 56px, #303030 57px 57px, #303030 58px 58px, #303030 59px 59px, #313131 60px 60px, #313131 61px 61px, #313131 62px 62px;
}

/* Span Colors (really hard to name the colors) */

.white{background:#fff; }

.orange {
    background: #D3643B;
     
}


.grigio{   background:#e1e1e1;}
.grigio_scuro{   background:#969696;}




.tealblue {
    background: #556270;
}

.sage {
    background: #94C7B6;
}

.blue {
    background: #00B4CC;
}

.green {
    background: #228900;
}

.darksage {
    background: #729c98;
}

.yellow
{
    background:#FFCC40;
}

.plum {
    background: #483e46;
}

.purple {
    background: #6A5E72;
}

.sedgebrown {
    background: #605951;
}

.ecru {
    background: #C1B398;
}

.blueberry {
    background: #625560;
}

.midplum {
    background: #6b4d56;
}

.redplum {
    background: #794147;
}

.darkred {
    background: #863538;
}

.lightgreen{
    background: #b9ea53;
}

.lightblue{
    background: #5780d2;
}

.lightred{
    background:#e64243;
}

.lightorange{
    background:#efa53a;
}

.darkblue{
    background:#0c4050;
}

.verylightgreen{
    background:#cfe7c8;
}

.gray{
    background:#727272;
}

.darkgray{
    background:#535353;
}

/* Content Styles */
.outer-box {
    padding: 20px;
    height: auto;
    width: 111%;
    margin: 30px 0;
    position: relative;
    left: -5%;
    left: -33px;
    border: 5px solid #fff;
    overflow: hidden;
}

.border {
    border: 5px solid #fff;
}

.outer-box-work {
    padding: 20px;
    height: auto;
    width: 81.5%;
    position: relative;
    left: -33px;
    margin: 30px 0;
    border: 5px solid #fff;
    overflow: hidden;
}

.outside {
    height: auto;
    width: 100px;
    position: absolute;
    left: -120px;
    bottom: 0;
}

.article {
    margin-top: 20px;
}
/* Used in news section */

.bold {
    font-weight: 700;
}

.copy { /* Used copyright section */
    position: absolute;
    bottom: 0;
}

.col-xs-1,
.col-xs-2,
.col-xs-3,
.col-xs-4,
.col-xs-5,
.col-xs-6,
.col-xs-7,
.col-xs-8,
.col-xs-9,
.col-xs-10,
.col-xs-11,
.col-xs-12,
.col-sm-1,
.col-sm-2,
.col-sm-3,
.col-sm-4,
.col-sm-5,
.col-sm-6,
.col-sm-7,
.col-sm-8,
.col-sm-9,
.col-sm-10,
.col-sm-11,
.col-sm-12,
.col-md-1,
.col-md-2,
.col-md-3,
.col-md-4,
.col-md-5,
.col-md-6,
.col-md-7,
.col-md-8,
.col-md-9,
.col-md-10,
.col-md-11,
.col-md-12,
.col-lg-1,
.col-lg-2,
.col-lg-3,
.col-lg-4,
.col-lg-5,
.col-lg-6,
.col-lg-7,
.col-lg-8,
.col-lg-9,
.col-lg-10,
.col-lg-11,
.col-lg-12 {
    padding-right: 10px;
    padding-left: 10px;
}

.well-slider {
    border: 0;
    overflow: hidden;
    position: relative;
    height: 300px;
    z-index: 1;
    min-height: 20px;
    margin: 0;
    margin-bottom: 20px;
    border-radius: 4px;
}

.flexslider {
    z-index: 1;
}

/* Add this class when using fitvids.js */
.video {
    border: 0;
}

/************** PULSANTI ******************/

.pulsante {
  -webkit-border-radius: 9 !important;
  -moz-border-radius: 9 !important;
  border-radius: 9px !important;
  -webkit-box-shadow: 1px 5px 13px #666666 !important;
  -moz-box-shadow: 1px 5px 13px #666666 !important;
  box-shadow: 1px 5px 13px #666666 !important;
  font-family: Arial !important;
  color: #ffffff !important;
  font-size: 20px !important;
  background: #d3643b !important;
  padding: 10px 20px 10px 20px !important;
  border: dotted #1f628d 0px !important;
  text-decoration: none !important;
}

.pulsante:hover {
  background: #3cb0fd;
  background-image: -webkit-linear-gradient(top, #3cb0fd, #3498db) !important;
  background-image: -moz-linear-gradient(top, #3cb0fd, #3498db) !important;
  background-image: -ms-linear-gradient(top, #3cb0fd, #3498db) !important;
  background-image: -o-linear-gradient(top, #3cb0fd, #3498db) !important;
  background-image: linear-gradient(to bottom, #3cb0fd, #3498db) !important;
  text-decoration: none;
}

/************** PULSANTI ******************/

/*------------- Blog Styles -------------*/

/* Blog Post */
.bp-post {
    top: 0;
    width: 100%;
    height: 300px;
    position: relative;
}

    .bp-post .overlay {
        /* IE9 SVG, needs conditional override of 'filter' to 'none' */
        background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzAwMDAwMCIgc3RvcC1vcGFjaXR5PSIwIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiMwMDAwMDAiIHN0b3Atb3BhY2l0eT0iMC45Ii8+CiAgPC9saW5lYXJHcmFkaWVudD4KICA8cmVjdCB4PSIwIiB5PSIwIiB3aWR0aD0iMSIgaGVpZ2h0PSIxIiBmaWxsPSJ1cmwoI2dyYWQtdWNnZy1nZW5lcmF0ZWQpIiAvPgo8L3N2Zz4=);
        background: -moz-linear-gradient(top, rgba(0,0,0,0) 0%, rgba(0,0,0,0.9) 100%); /* FF3.6+ */
        background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(0,0,0,0)), color-stop(100%,rgba(0,0,0,0.9))); /* Chrome,Safari4+ */
        background: -webkit-linear-gradient(top, rgba(0,0,0,0) 0%,rgba(0,0,0,0.9) 100%); /* Chrome10+,Safari5.1+ */
        background: -o-linear-gradient(top, rgba(0,0,0,0) 0%,rgba(0,0,0,0.9) 100%); /* Opera 11.10+ */
        background: -ms-linear-gradient(top, rgba(0,0,0,0) 0%,rgba(0,0,0,0.9) 100%); /* IE10+ */
        background: linear-gradient(to bottom, rgba(0,0,0,0) 0%,rgba(0,0,0,0.9) 100%); /* W3C */
        filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00000000', endColorstr='#e6000000',GradientType=0 ); /* IE6-8 */
        position: absolute;
        width: 100%;
        height: 100%;
        top: 0;
        right: 0;
    }

    .bp-post .title {
        color: #fff;
        position: absolute;
        bottom: 0px;
        left: 20px;
    }

    .bp-post .star,
    .bp-post .heart {
        padding: 10px;
        position: absolute;
        bottom: 0;
        color: #fff;
        background: rgba(3,3,3,0.8);
    }


    .bp-post .heart {
        right: 0;
    }

    .bp-post .star {
        right: 34px;
    }

        .bp-post .star:hover .bp-post .heart:hover, {
            background: rgba(3,3,3,0.9);
        }

    .bp-post .heart:hover {
        color: #a30000;
    }

    .bp-post .star:hover {
        color: #ffea00;
    }

/* Blog item ONLY USED IF BLOG POST IS LAST ON ROW otherwise dosent match up on devices less than 767px  */
.blog-post-item {
    position: relative;
    width: 110%;
    height: 0;
    left: -5%;
    overflow: hidden;
    background: #535954;
    opacity: 0;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
    padding: 0 25px;
    -webkit-transition: opacity 0.5s ease-in-out;
    -moz-transition: opacity 0.5s ease-in-out;
    -o-transition: opacity 0.5s ease-in-out;
    -ms-transition: opacity 0.5s ease-in-out;
    transition: opacity 0.5s ease-in-out;
}

.reveal {
    height: auto;
    margin-bottom: 30px;
    overflow: visible;
    padding: 20px;
    opacity: 1;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
}

.arrow-up {
    width: 0;
    height: 0;
    border-left: 20px solid transparent;
    border-right: 20px solid transparent;
    position: absolute;
    top: -20px;
    z-index: 90;
    border-bottom: 20px solid #535954;
}

    .arrow-up.left {
        left: 32%;
    }
    /* Used for span8 blog post on left */
    .arrow-up.right {
        right: 32%;
    }
/* Used for span8 blog post on right */


/*------------- Album Styles -------------*/

/* Photo album block */
.photo-album {
    width: 100%;
    height: 300px;
    position: relative;
}

    .photo-album .album {
        position: absolute;
        width: 100%;
        height: 100%;
        background: rgba(255,255,255,0.29);
        -webkit-transition: background 0.5s ease-in-out;
        -moz-transition: background 0.5s ease-in-out;
        -o-transition: background 0.5s ease-in-out;
        -ms-transition: background 0.5s ease-in-out;
        transition: background 0.5s ease-in-out;
    }

        .photo-album .album:hover {
            background: rgba(255,255,255,0.4);
        }

        .photo-album .album .title {
            width: 130px;
            height: 30px;
            font-weight: 300;
            font-size: 25px;
            text-align: center;
            position: absolute;
            top: 0;
            bottom: 0;
            left: 0;
            right: 0;
            margin-left: auto;
            margin-right: auto;
            margin-top: auto;
            margin-bottom: auto;
        }

/*------------- Portfolio/work Styles -------------*/

/* Portfolio block */
.portfolio-img {
    width: 100%;
    height: 300px;
    position: relative;
}

    .portfolio-img .hover-effect {
        width: 100%;
        height: 100%;
        top: 0;
        color: #fff;
        font-size: 20px;
        font-weight: 300;
        position: absolute;
        -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;
    }

        .portfolio-img .hover-effect > p {
            top: 0;
            bottom: 0;
            margin-top: auto;
            margin-bottom: auto;
            height: 50px;
            width: 100%;
            font-size: 25px;
            position: absolute;
        }

/* Effects Options */
.effect-one {
    background: rgba(51,51,51,0.5);
    opacity: 0;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
}

    .effect-one:hover {
        opacity: 1;
        -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
    }

.effect-two {
    background: rgba(51,51,51,0.5);
    -webkit-transform: rotate(-45deg) scale(2);
    -moz-transform: rotate(-45deg) scale(2);
    -o-transform: rotate(-45deg) scale(2);
    -ms-transform: rotate(-45deg) scale(2);
    transform: rotate(-45deg) scale(2);
    ;
    opacity: 0;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
}

    .effect-two:hover {
        -webkit-transform: rotate(0deg) scale(1);
        -moz-transform: rotate(0deg) scale(1);
        -o-transform: rotate(0deg) scale(1);
        -ms-transform: rotate(0deg) scale(1);
        transform: rotate(0deg) scale(1);
        opacity: 1;
        -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
    }

.effect-three {
    background: rgba(51,51,51,0);
    -webkit-transform: rotate(45deg);
    -moz-transform: rotate(45deg);
    -o-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);
    opacity: 0;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
}

    .effect-three:hover {
        background: rgba(51,51,51,0.5);
        -webkit-transform: rotate(0deg);
        -moz-transform: rotate(0deg);
        -o-transform: rotate(0deg);
        -ms-transform: rotate(0deg);
        transform: rotate(0deg);
        opacity: 1;
        -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
    }

.effect-four {
    background: rgba(51,51,51,0);
    -webkit-transform: rotate(-45deg);
    -moz-transform: rotate(-45deg);
    -o-transform: rotate(-45deg);
    -ms-transform: rotate(-45deg);
    transform: rotate(-45deg);
    opacity: 0;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
}

    .effect-four:hover {
        background: rgba(51,51,51,0.5);
        -webkit-transform: rotate(0deg);
        -moz-transform: rotate(0deg);
        -o-transform: rotate(0deg);
        -ms-transform: rotate(0deg);
        transform: rotate(0deg);
        opacity: 1;
        -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
    }

.effect-five {
    background: #fff;
    opacity: 0;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
}

    .effect-five:hover {
        opacity: 1;
        color: #000;
        -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
    }

.effect-six {
    background: #000;
    opacity: 0;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
}

    .effect-six:hover {
        opacity: 1;
        -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
    }

.effect-seven {
    background: rgba(255,255,255,0.8);
    opacity: 0;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
}

    .effect-seven:hover {
        opacity: 1;
        color: #000;
        -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
    }

.effect-eight {
    background: rgba(51,51,51,0.5);
    -webkit-transform: scale(2);
    -moz-transform: scale(2);
    -o-transform: scale(2);
    -ms-transform: scale(2);
    transform: scale(2);
    opacity: 0;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
}

    .effect-eight:hover {
        -webkit-transform: scale(1);
        -moz-transform: scale(1);
        -o-transform: scale(1);
        -ms-transform: scale(1);
        transform: scale(1);
        opacity: 1;
        -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
    }

.effect-nine {
    background: rgba(51,51,51,0.5);
    -webkit-transform: rotate(45deg) scale(2);
    -moz-transform: rotate(45deg) scale(2);
    -o-transform: rotate(45deg) scale(2);
    -ms-transform: rotate(45deg) scale(2);
    transform: rotate(45deg) scale(2);
    ;
    opacity: 0;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
}

    .effect-nine:hover {
        -webkit-transform: rotate(0deg) scale(1);
        -moz-transform: rotate(0deg) scale(1);
        -o-transform: rotate(0deg) scale(1);
        -ms-transform: rotate(0deg) scale(1);
        transform: rotate(0deg) scale(1);
        opacity: 1;
        -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
    }

/*------------- Menu Styles -------------*/

/* Menu */
.nav {
    width: 180px;
    height: 300px;
    left: 0;
    position: absolute;
    right: 0;
    margin-left: auto;
    margin-right: auto;
    top: 0;
    bottom: 0;
    margin-top: auto;
    margin-bottom: auto;
}

    .nav > li a {
        color: #fff;
        font-size: 40px;
        padding: 17px 25px;
        text-align: center;
    }

        .nav > li a:hover {
            color: #fff;
            text-decoration: none;
            background: transparent;
            background: rgba(0,0,0,0); /* fallback */
        }

.nav-section {
    height: 0;
    width: 0;
    position: fixed;
    z-index: 89;
    overflow: hidden;
    background: rgba(0,0,0,0.75);
    -webkit-transition: all .5s ease-in-out;
    -moz-transition: all .5s ease-in-out;
    -o-transition: all .5s ease-in-out;
    -ms-transition: all .5s ease-in-out;
    transition: all .5s ease-in-out;
    left: 0;
    right: 0;
    margin-left: auto;
    margin-right: auto;
    top: 0;
    bottom: 0;
    margin-top: auto;
    margin-bottom: auto;
}

.show {
    height: 100%;
    width: 100%;
}

/* Menu button */
.nav-bar,
.menu {
    -webkit-transition: all .5s ease-in-out;
    -moz-transition: all .5s ease-in-out;
    -o-transition: all .5s ease-in-out;
    -ms-transition: all .5s ease-in-out;
    transition: all .5s ease-in-out;
}

.nav-bar {
    width: 35px;
    background-color: #d0d0d0;
    height: 5px;
    margin-bottom: 8px;
}

.menu {
    width: 35px;
    height: 31px;
    padding: 10px;
    z-index: 100;
    right: -70px;
    top: 0px;
    position: absolute;
    cursor: pointer;
}

.animate-1 {
    width: 0;
}

.animate-2 {
    width: 35px;
    -webkit-transform: rotate(-45deg) translate(10px, -10px);
    -moz-transform: rotate(-45deg) translate(10px, -10px);
    -o-transform: rotate(-45deg) translate(10px, -10px);
    -ms-transform: rotate(-45deg) translate(10px, -10px);
    transform: rotate(-45deg) translate(10px, -10px);
    background: #fff;
}

.animate-0 {
    width: 35px;
    -webkit-transform: rotate(45deg) translate(8px, 8px);
    -moz-transform: rotate(45deg) translate(8px, 8px);
    -o-transform: rotate(45deg) translate(8px, 8px);
    -ms-transform: rotate(45deg) translate(8px, 8px);
    transform: rotate(45deg) translate(8px, 8px);
    background: #fff;
}

/*------------- Team Styles -------------*/

.person-square2,
.person-square {
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
    width: 100%;
    position: relative;
    height: 300px;
}

/* You can use this method or backstrech.js e.g the portfolio blocks */
.person-square {
    background: #323232 url('../img/person.jpg') no-repeat center center;
}

.person-square2 {
    background: #323232 url('../img/person2.jpg') no-repeat center center;
}

/*------------- Twitter Styles -------------*/

.tweet {
    margin: 25px 0;
}

    .tweet > p {
        font-size: 19px;
    }

/* Twitter Icon */
.social-box {
    height: auto;
    width: auto;
    color: #fff;
    font-size: 30px;
    padding: 20px;
    position: absolute;
    right: -10px; /* Change these around to change position */
    bottom: 10px; /* Change these around to change position */
    border: 5px solid #fff;
    overflow: hidden;
}

    .social-box:hover {
        color: #009eff;
        border: 5px solid #009eff;
    }

/*------------- Contact Styles -------------*/

.bordered-input {
    border-radius: 0 !important;
    background: rgba(0,0,0,0.15) !important;
    border: 0 !important;
    font-weight: 300 !important;
    font-size: 20px !important;
    padding: 15px !important;
    height: auto !important;
    box-shadow: none !important;
    color: #fff !important;
    width: 100%;
    margin: 5px 0;
}

input[placeholder], [placeholder], *[placeholder] {
    color: #fff !important;
}

.contact-icon {
    padding-right: 15px;
}

.social {
    font-size: 18px;
    text-align: center;
    padding: 5px 0;
    height: auto;
    width: auto;
    border: 5px solid rgba(0,0,0,0.25);
}

    .social:hover {
        color: #009eff;
        border: 5px solid #009eff;
    }

#map {
    width: 100%;
    height: 300px;
}

/*------------- Panel Styles -------------*/

.panel {
    display: none;
    position: fixed;
    top: 0;
    width: 100%;
    right: 0%;
    height: 100%;
    z-index: 3;
    margin: 0;
    overflow-x: hidden;
    overflow-y: scroll;
    background-color: #323232;
    z-index: 90000;
}

    .panel .work, /* Add the panels you use here */
    .panel .album {
        display: none;
        font-family: arial;
        color: white;
        height: 100%;
        font-weight: 100;
        position: relative;
        padding: 50px;
        padding-top: 110px;
        overflow-y: scroll;
        margin: 0 auto;
        max-width: 960px;
    }

.closeicon {
    position: absolute;
    right: 5%;
    top: 5%;
    font-family: 'Lato', sans-serif;
    font-weight: 700;
    color: #fff;
    font-size: 45px;
    cursor: pointer;
}

.no-scroll {
    overflow: hidden;
}

.row-portfolio {
    margin-top: 30px;
}

/*------------- Image Background -------------*/

/* Use this or backstrech.js */
.imagebg-13,
.imagebg-12,
.imagebg-11,
.imagebg-10,
.imagebg-9,
.imagebg-8,
.imagebg-7,
.imagebg-6,
.imagebg-5,
.imagebg-4,
.imagebg-3,
.imagebg-2,
.imagebg-1 {
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
}

.imagebg-1 {
    background: url('../img/barack.jpg') no-repeat center bottom;
}

.imagebg-2 {
    background: #00B4CC url('../img/card.png') no-repeat center bottom;
}

.imagebg-3 {
    background: #323232 url('../img/3.jpg') no-repeat center bottom;
}

.imagebg-4 {
    background: #323232 url('../img/14.jpg') no-repeat center bottom;
}

.imagebg-5 {
    background: #323232 url('../img/5.jpg') no-repeat center bottom;
}

.imagebg-6 {
    background: #323232 url('../img/6.jpg') no-repeat center bottom;
}

.imagebg-7 {
    background: #323232 url('../img/7.jpg') no-repeat center bottom;
}

.imagebg-8 {
    background: #323232 url('../img/8.jpg') no-repeat center bottom;
}

.imagebg-9 {
    background: #323232 url('../img/9.jpg') no-repeat center bottom;
}

.imagebg-10 {
    background: #323232 url('../img/10.jpg') no-repeat center bottom;
}

.imagebg-11 {
    background: #323232 url('../img/11.jpg') no-repeat center bottom;
}

.imagebg-12 {
    background: #323232 url('../img/12.jpg') no-repeat center bottom;
}

.imagebg-13 {
    background: #323232 url('../img/13.jpg') no-repeat center bottom;
}


/*------------- Content Slider -------------*/

.content-slider {
    width: 55%;
    float: left;
}

.image-slider {
    width: 200px;
    height: 200px;
    float: left;
    margin-top: 70px;
}

/*------------- Button Styles -------------*/

/* Btn General */
.btn {
    background-color: #e5e5e5;
    border: 3px solid #e5e5e5;
    background-image: none;
    text-shadow: none;
    font-size: 14px;
    color: #333333;
    cursor: pointer;
    outline: none;
    filter: none;
    box-shadow: none;
    -webkit-transition: all .5s ease-in-out;
    -moz-transition: all .5s ease-in-out;
    -ms-transition: all .5s ease-in-out;
    -o-transition: all .5s ease-in-out;
    transition: all .5s ease-in-out;
}

    .btn:hover,
    .btn:focus,
    .btn:active,
    .btn.active,
    .btn[disabled],
    .btn.disabled {
        color: #333333;
        box-shadow: none;
        background-color: transparent;
        -webkit-transition: all .5s ease-in-out;
        -moz-transition: all .5s ease-in-out;
        -ms-transition: all .5s ease-in-out;
        -o-transition: all .5s ease-in-out;
        transition: all .5s ease-in-out;
    }

    /* Btn Red */
    .btn.red {
        color: white;
        text-shadow: none;
        background-color: #F80012;
        border-color: #F80012;
    }

        .btn.red:hover,
        .btn.red:focus,
        .btn.red:active,
        .btn.red.active,
        .btn.red[disabled],
        .btn.red.disabled {
            background-color: transparent;
            border-color: #F80012;
            ;
            color: #F80012;
        }

    /* Btn Blue */
    .btn.blue {
        color: white;
        text-shadow: none;
        background-color: #3D9AD1;
        border-color: #3D9AD1;
    }

        .btn.blue:hover,
        .btn.blue:focus,
        .btn.blue:active,
        .btn.blue.active,
        .btn.blue[disabled],
        .btn.blue.disabled {
            background-color: transparent;
            border-color: #3D9AD1;
            ;
            color: #3D9AD1 !important;
        }

    /* Btn Green */
    .btn.green {
        color: white;
        text-shadow: none;
        border-color: #00C618;
        background-color: #00C618;
    }

        .btn.green:hover,
        .btn.green:focus,
        .btn.green:active,
        .btn.green.active,
        .btn.green.disabled,
        .btn.green[disabled] {
            background: transparent;
            border-color: #00C618;
            color: #00C618 !important;
        }

    /* Btn Purple */
    .btn.purple {
        color: white;
        text-shadow: none;
        border-color: #8506A9;
        background-color: #8506A9;
    }

        .btn.purple:hover,
        .btn.purple:focus,
        .btn.purple:active,
        .btn.purple.active,
        .btn.purple.disabled,
        .btn.purple[disabled] {
            background: transparent;
            border-color: #8506A9;
            color: #8506A9 !important;
        }

    /* Btn Yellow */
    .btn.yellow {
        color: white;
        text-shadow: none;
        background-color: #FFCC40;
        border-color: #FFCC40;
    }

        .btn.yellow:hover,
        .btn.yellow:focus,
        .btn.yellow:active,
        .btn.yellow.active,
        .btn.yellow.disabled,
        .btn.yellow[disabled] {
            background: transparent;
            border-color: #FFCC40;
            color: #FFCC40 !important;
        }

    /* Btn Black */
    .btn.black {
        color: white;
        text-shadow: none;
        background-color: #555555;
        border-color: #555555;
    }

        .btn.black:hover,
        .btn.black:focus,
        .btn.black:active,
        .btn.black.active,
        .btn.black.disabled,
        .btn.black[disabled] {
            background: transparent;
            border-color: #555555;
            color: #555555 !important;
        }

    /* Btn Transparent */
    .btn.transparent {
        color: white;
        text-shadow: none;
        background-color: rgba(255,255,255,0.25);
        border-color: rgba(255,255,255,0.25);
    }

        .btn.transparent:hover,
        .btn.transparent:focus,
        .btn.transparent:active,
        .btn.transparent.active,
        .btn.transparent.disabled,
        .btn.transparent[disabled] {
            background: transparent;
            border-color: rgba(255,255,255,0.25);
            color: #fff !important;
        }

/* Btn Warning */
.btn-warning {
    color: white;
    text-shadow: none;
    background-color: #faa732;
    border-color: #faa732;
}

    .btn-warning:hover,
    .btn-warning:focus,
    .btn-warning:active,
    .btn-warning.active,
    .btn-warning.disabled,
    .btn-warning[disabled] {
        background: transparent;
        border-color: #faa732;
        color: #faa732 !important;
    }

/* Btn Primary */
.btn-primary {
    color: white;
    text-shadow: none;
    background-color: #006dcc;
    border-color: #006dcc;
}

    .btn-primary:hover,
    .btn-primary:focus,
    .btn-primary:active,
    .btn-primary.active,
    .btn-primary.disabled,
    .btn-primary[disabled] {
        background: transparent;
        border-color: #006dcc;
        color: #006dcc !important;
    }

/* Btn Info */
.btn-info {
    color: white;
    text-shadow: none;
    background-color: #49afcd;
    border-color: #49afcd;
}

    .btn-info:hover,
    .btn-info:focus,
    .btn-info:active,
    .btn-info.active,
    .btn-info.disabled,
    .btn-info[disabled] {
        background: transparent;
        border-color: #49afcd;
        color: #49afcd !important;
    }

/* Btn Danger */
.btn-danger {
    color: white;
    text-shadow: none;
    background-color: #da4f49;
    border-color: #da4f49;
}

    .btn-danger:hover,
    .btn-danger:focus,
    .btn-danger:active,
    .btn-danger.active,
    .btn-danger.disabled,
    .btn-danger[disabled] {
        background: transparent;
        border-color: #da4f49;
        color: #da4f49 !important;
    }

/* Btn Success */
.btn-success {
    color: white;
    text-shadow: none;
    background-color: #5bb75b;
    border-color: #5bb75b;
}

    .btn-success:hover,
    .btn-success:focus,
    .btn-success:active,
    .btn-success.active,
    .btn-success.disabled,
    .btn-success[disabled] {
        background: transparent;
        border-color: #5bb75b;
        color: #5bb75b !important;
    }

/* Btn Inverse */
.btn-inverse {
    color: white;
    text-shadow: none;
    background-color: #363636;
    border-color: #363636;
}

    .btn-inverse:hover,
    .btn-inverse:focus,
    .btn-inverse:active,
    .btn-inverse.active,
    .btn-inverse.disabled,
    .btn-inverse[disabled] {
        background: transparent;
        border-color: #363636;
        color: #363636 !important;
    }

/* Btn Sizes */
.btn-mini {
    height: 20px;
    font-size: 9px;
    line-height: 5px;
    padding: 4px 10px;
}

.btn-big {
    height: 38px;
    font-size: 18px;
    line-height: 18px;
    padding: 8px 16px;
}

.btn-large {
    padding: 11px 19px;
    font-size: 17.5px;
    margin-bottom: 10px;
}

.btn-small {
    padding: 2px 10px;
    font-size: 11.9px;
}

.btn-block {
    margin-bottom: 5px;
}

/*------------- Sizes -------------*/

@media (max-width: 1100px) {
    .menu {
        right: 0px !important;
        top: 0px !important;
    }

    .outside {
        display: none;
    }
}

@media (max-width: 979px) {
    .well {
        height: auto;
    }

    .large {
        height: auto;
    }

    .content-slider {
        width: 60%;
        float: left;
    }

    .image-slider {
        width: 30%;
        height: 60px;
        float: left;
        margin-top: 70px;
    }
}

@media (max-width: 767px) {
    body {
        padding: 20px;
    }

    .outer-box {
        width: 105%;
        left: -5%;
    }
}

.box_homepage {
    height: 60px;
    color: white;
    width: 100%;
    position: absolute;
    left: 0px;
    bottom: 0px;
    line-height: 60px;
    font-size: x-large;
    padding-left:10px;
    padding-right:10px;
    font-weight:bolder;
}

.blockleft{padding-top:15px;}

.lateralstart{margin-left:-150%;}


.centrale
{
    min-height:1580px !important;
    max-height:1580px !important;
    overflow-y: scroll;
    overflow-x: hidden;
}


/*************** ATTIVITA e SERVIZI ************/
.box_image_scheda
{
   width:160px; 
   background-color:#ccc;
   float:left; 
   margin:5px;
   -webkit-border-radius: 15px !important;
   -moz-border-radius:15px !important; 
   border-radius:15px !important;
   text-align:center;
}

.box_image_scheda img{vertical-align:middle;width:148px;margin:5px !important;}


.attivita{color:#333 !important;box-shadow: 0 15px 10px #777;width:100%;}
.box1_att{background-color:#fff;}
.box1_att a{color:#333 !important;}

.box2_att{font-size:20px !important;padding:5px;}

.box2_att p{font-size:13px !important;}
.box2_att h2{font-size:25px !important; padding:0px; margin:0px;}

.icona_dati{height:25px;padding:5px;width:8%;background-color:#000;float:left; text-align:center; }
.icona_dati i{font-size:16px;color:#fff;}
.dati_testo{height:25px;padding:5px;width:88%;background-color:#dcdcdc;float:left;}
.spazio{width:2%; float:left; background-color:#fff;}

.dati{padding:8px;}
.clear{clear:both;height:8px;}
 
 
.testo_attivita{font-size:15px !important; padding:5px !important;}
.box_aziende{box-shadow: 0 15px 10px #777;width:100%; }



.etichetta_aziende{margin-top:5px; background-color:#d8d8d8; font-size:18px !important;}
.icona_aziende{width:10%;float:left;font-size:40px !important;padding:6px;background-color:#aaaaaa;height:70px !important;text-align:center;}
.testo_aziende{width:82%;float:left;background-color:#e1e1e1;height:70px !important;text-align:left;padding:6px;font-weight:bold;color:#000;font-size:23px;}
.pulsante_aziende{width:8%;float:left;background-color:#8a8a8a;height:70px !important;text-align:left;padding:6px;font-weight:bold;color:#000;font-size:25px;}
.pulsante_aziende i{font-size:35px;color:#fff; padding:5px;}
.categorie{color:#D3643B !important;font-weight:bold;text-transform:uppercase;font-size:14px !important;}

/*************** ATTIVITA e SERVIZI ************/


/*****************************  NUMERI UTILI *********************/

.box_numeri{
    box-shadow: 0 15px 10px #777;
    min-height:150px !important;
    max-height:150px !important;
    width:100%;
}

.numero{
   
   height:70px !important;
   font-size:50px;
   font-weight:bold;
}

.etichetta{
   height:70px !important;
   margin-top:5px; background-color:#27488d; font-size:18px !important;
}
 
.icona_numeri_tel
{
    width:15%;
    float:left;
    font-size:40px !important;
    padding:6px;
    background-color:#009035;
    height:70px !important;
    text-align:center;
    
}

.testo_numeri_tel
{
    width:85%;
    float:left;
    background-color:rgba(43, 133, 17, 0.59);
    height:70px !important;
    text-align:left;
    font-size:32px !important;
    padding:10px;
}
 
.icona_numeri_etichetta
{
    width:15%;
    float:left;
    font-size:40px !important;
    padding:6px;
    background-color:#27488d;
    height:70px !important;
    text-align:center;
    
}



.testo_numeri_etichetta
{
    width:85%;
    float:left;
    background-color:#3a67c8;
    height:70px !important;
    text-align:left;
    padding:20px;
    font-weight:bold;
    
}
 
.fixed-height_int {
    height:180px !important;
}
 

/*****************************  NUMERI UTILI *********************/

/***************** IL COMUNE *************/

.comune{font-size:18px !important; }

.contenuto_comune {
    color: #000;
    font-weight:bold;
    background-color:#fff; 
     
   
}

.etichetta_comune {color: #000;border-left:1px solid #d3643b ; padding-left:7px; }
 

/***************** IL COMUNE *************/


.margine{margin:8px;}


.mainBlock
{
    /*border:solid 1px #D3643B;*/
}

.effect{
	-webkit-transition: -webkit-transform 0.6s;
	transition: transform 0.6s;
	-webkit-transform: scale3d(1.9,1.4,1) rotate3d(0,0,1,45deg) translate3d(0,-100%,0);
	transform: scale3d(1.9,1.4,1) rotate3d(0,0,1,45deg) translate3d(0,-100%,0);
}

.effect:before{
	-webkit-transform: scale3d(1.9,1.4,1) rotate3d(0,0,1,45deg) translate3d(0,100%,0);
	transform: scale3d(1.9,1.4,1) rotate3d(0,0,1,45deg) translate3d(0,100%,0);
}