/* Website template by freewebsitetemplates.com */
/*------------------------- Layout styles ------------------------*/
body{
        margin:0;
        background:url(../images/bg-body.jpg);
}
.page{
        background:url(../images/bg-header.jpg) no-repeat center top;
}

/*------------------------- Font ------------------------*/
@font-face {
    font-family: 'RokkittRegular';
    src: url('rokkitt-regular-webfont.eot');
    src: url('rokkitt-regular-webfont.eot?#iefix') format('embedded-opentype'),
         url('rokkitt-regular-webfont.woff') format('woff'),
         url('rokkitt-regular-webfont.ttf') format('truetype'),
         url('rokkitt-regular-webfont.svg#RokkittRegular') format('svg');
    font-weight: normal;
    font-style: normal;
}

/*------------------------- Header ------------------------*/
.header{
       // background:url(../images/bg-navigation.jpg) no-repeat center 90px;
        width:940px;
        margin:0 auto;
        height:105px;
        padding:36px 10px 0;
}
.header a#logo{
        display:block;
        float:left;
        outline:none;
}
.header a#logo img{
        border:0;
}
.header ul{
        margin:0;
        list-style:none;
        padding:13px 0 0;
        float:right;
}
.header ul li{
        float:left;
        margin:0 0 0 63px;
}
.header ul li.selected a,.header ul li a:hover{
        color:#ce5c1e;
}
.header ul li a{
        font-size:16px;
        text-decoration:none;
        color:#3d3c3c;
        font-family: 'RokkittRegular';
        outline:none;
}

/*------------------------- Body ------------------------*/
.body{
        width:940px;
        margin:0 auto;
        padding:0 10px;
        overflow:hidden;
}
.body div#featured{
        background:url(../images/house2.jpg) no-repeat right top;
        height:448px;
        padding:0 0 17px;
}
.body div#featured h3{
        color:#ce5c1e;
        font-size:36px;
        font-family: 'RokkittRegular';
        margin:0 0 20px;
        width:490px;
        padding:20px 0 0;
        font-weight:normal;
}
.body div#featured p{
        width:480px;
        color:#3d3c3c;
        font-family: 'RokkittRegular';
        font-size:16px;
        line-height:25px;
        text-shadow: 0 1px 0 #fcfcfc;
        text-align:justify;
        margin:0;
}
.body div#featured input{
        background:url(../images/interface.jpg) no-repeat;
        border:0;
    height:48px;
    width:216px;
        font-family: 'RokkittRegular';
        color:#fff;
        font-size:30px;
        margin:28px 0 0 125px;
        cursor:pointer;
        outline:none;
}
.body ul.blog{
        list-style:none;
        margin:40px 0 0;
        padding:0 0 50px;
        background:url(../images/separator.jpg) no-repeat center top;
        overflow:hidden;
}
.body ul.blog li:first-child{
        margin:60px 0 0;
}
.body ul.blog li{
        float:left;
        background:url(../images/interface.jpg) no-repeat 0 -68px!important;
        margin:60px 0 0 48px;
        height:400px;
        padding:0;
}
.body ul.blog li div{
        width:281px;
        height:380px;
        text-align:center;
        padding: 8px 0 20px 0;
        float:none;
        margin:0;
        background:none;
}
.body ul.blog li div a img{
        border:0;
        margin:0 0 0 -3px;
}
.body ul.blog li div a img:hover{
        filter:alpha(opacity=80);
        opacity:0.8;
}
.body ul.blog li div p{
        width:258px;
        text-align:center;
        color:#ce5c1e;
        font-family: 'RokkittRegular';
        margin:17px 0 0 10px;
        line-height:20px;
        font-size:16px;
        background:none;
        padding:0;
}
.body ul.blog li div a:first-child{
        margin:0;
        padding:0;
        background:none;
        width:auto;
}
.body ul.blog li div a:hover{
        color:#ce5c1e;
}
.body ul.blog li div a{
        color:#606060;
        font-family: 'RokkittRegular';
        font-style:italic;
        text-decoration:none;
        padding:98px 0 0;
        margin:32px auto 0;
        display:block;
        width: 150px;
        background:url(../images/button-more.jpg) no-repeat center top;
        outline:none;
        font-size:16px;
        font-weight:normal;
        text-shadow: 0 1px 0 #fcfcfc;
}
.body h3{
        font-family: 'RokkittRegular';
        font-size:16px;
        font-weight:bold;
        color:#636363;
        margin:15px 0 0;
        line-height:21px;
}
.body p{
        font-family: 'RokkittRegular';
        font-size:16px;
        text-align:justify;
        color:#636363;
        margin:0 0 20px;
        line-height:21px;
}
.body p a{
        outline:none;
        color:#636363;
}
.body ul{
        list-style:none;
    margin:0;
    padding:0;
        overflow:hidden;
}
.body ul li:first-child{
        background:none;
        padding:0 0 30px;
}
.body ul li{
        overflow:hidden;
        background:url(../images/separator.jpg) no-repeat center top;
        padding:30px 0;
}
.body ul li div.featured{

        background:url(../images/interface.jpg) no-repeat 0 -68px;
        width:281px;
        height:292px;
        text-align: center;
        margin:0;

}
.body ul li div.featured img{
        margin:10px 0 0 -3px;
        border:0;
}
.body ul li div.featured ul{
        overflow:hidden;
        margin:2px 0 0 10px;

}
.body ul li div.featured ul li:first-child{
        margin:0;
}
.body ul li div.featured ul li{
        float:left;
        margin:0 0 0 18px;
        background:none;
        padding:0;
}
.body ul li div.featured ul li a{
        padding:0;
}
.body ul li div.featured ul li a img{
        margin:0;
}
.body ul li div.featured ul li a img:hover{
        filter:alpha(opacity=80);
        opacity:0.8;
}
.body ul li div.featured a{
        clear:both;
        display:block;
        font-size:13px;
        font-family: 'RokkittRegular';
        text-decoration:none;
        color:#8a8889;
        font-weight:bold;
        padding:5px 0 0;
        width:auto;
        outline:none;
}
.body ul li div{
        float:left;
        margin:0 0 0 50px;
        width:609px;
        //background:url(../images/button-more.jpg) no-repeat left bottom;
}
.body ul li div h3{
        //margin:10;
        font-size:20px;
        font-weight:bold;
        font-family: 'RokkittRegular';
        color:#ce5c1e;
        line-height:22px;
}
.body ul li div p{
        line-height:22px;
        font-family: 'RokkittRegular';
        font-size:14px;
        color:#5D5D5D;
        padding:0 0 20px;
        margin:0;
}
.body ul.paging{
        margin:15px 0 10px 210px;
}
.body ul.paging li{
        float:left;
        padding:0 5px;
        background:none;
}
.body ul.paging li a{
        text-decoration:none;
        color:#ff7e0d;
        font-family: arial;
        font-size:12px;
}
.body ul.paging li a:hover{
        color:#5D5D5D;
}

/*------------------------- Footer ------------------------*/
.footer{
        width:940px;
        background:url(../images/bg-footer.jpg) no-repeat center top;
        padding:65px 10px 207px;
        margin:0 auto;
        overflow:hidden;
}
.footer ul{
        list-style:none;
        margin:0 0 0 60px;
        padding:0;
        overflow:hidden;
        float:left;
}
.footer ul li:first-child a{
        border:none;
        padding:0 6px 0 0;
}
.footer ul li{
        float:left;
}
.footer ul li a:hover{
        color:#ce5c1e;
}
.footer ul li a{
        border-width: 1px;
        border-color:#3d3c3c;
        border-style: none none none solid;
        color:#5b5b5b;
        font-size:10px;
        font-family: Trebuchet MS;
        text-decoration:none;
        font-weight:bold;
        padding:0 6px;
        outline:none;
}
.footer p{
        color:#5b5b5b;
        font-size:10px;
        font-family: Trebuchet MS;
        font-weight:bold;
        float:left;
        margin:6px 0 0 135px;
}
.footer div.connect{
        float:left;
        margin:0 0 0 92px;
}
.footer div.connect a{
        float:left;
        outline:none;
}
.footer div.connect a#facebook{
        width:27px;
        height:28px;
        display:block;
        text-indent:-9999px;
        background:url(../images/icons.gif) no-repeat;
}
.footer div.connect a#twitter{
        width:36px;
        height:28px;
        display:block;
        text-indent:-9999px;
        background:url(../images/icons.gif) no-repeat 0 -48px;
        margin:0 0 0 68px;
}
.footer div.connect a#vimeo{
        width:32px;
        height:28px;
        display:block;
        text-indent:-9999px;
        background:url(../images/icons.gif) no-repeat 0 -96px;
        margin:0 0 0 73px;
}

#container ul
                        {
                        }
                                #container li
                                {
                                        display: inline-block;
                                        margin: 0.625em; /* 10 */
                                }
                                        #container img
                                        {
                                                width: 100 px; /* 100 */
                                                height: 67 px; /* 67 */
                                                border-color: #eee;
                                                //border: 0.625em solid rgba( 255, 255, 255, .5 ); /* 10 */

                                                -webkit-box-shadow: 0 0 0.313em rgba( 0, 0, 0, .05 ); /* 5 */
                                                box-shadow: 0 0 0.313em rgba( 0, 0, 0, .05 ); /* 5 */

                                                -webkit-transition: -webkit-box-shadow .3s ease, border-color .3s ease;
                                                transition: box-shadow .3s ease, border-color .3s ease;
                                        }
                                                #container img:hover,
                                                #container img:focus
                                                {
                                                        border-color: #fff;

                                                        -webkit-box-shadow: 0 0 0.938em rgba( 0, 0, 0, .25 ); /* 15 */
                                                        box-shadow: 0 0 0.938em rgba( 0, 0, 0, .25 ); /* 15 */
                                                }


#imagelightbox
{
    background-color: #fff;
                        background-color: rgba( 255, 255, 255, .9 );
                        position: fixed;
                        z-index: 9998;
                        top: 0;
                        right: 0;
                        bottom: 0;
                        left: 0;

    -ms-touch-action: none;
    touch-action: none;
}
/* ACTIVITY INDICATION */

                #imagelightbox-loading,
                #imagelightbox-loading div
                {
                        border-radius: 50%;
                }
                #imagelightbox-loading
                {
                        width: 2.5em; /* 40 */
                        height: 2.5em; /* 40 */
                        background-color: #444;
                        background-color: rgba( 0, 0, 0, .5 );
                        position: fixed;
                        z-index: 10003;
                        top: 50%;
                        left: 50%;
                        padding: 0.625em; /* 10 */
                        margin: -1.25em 0 0 -1.25em; /* 20 */

                        -webkit-box-shadow: 0 0 2.5em rgba( 0, 0, 0, .75 ); /* 40 */
                        box-shadow: 0 0 2.5em rgba( 0, 0, 0, .75 ); /* 40 */
                }
                        #imagelightbox-loading div
                        {
                                width: 1.25em; /* 20 */
                                height: 1.25em; /* 20 */
                                background-color: #fff;

                                -webkit-animation: imagelightbox-loading .5s ease infinite;
                                animation: imagelightbox-loading .5s ease infinite;
                        }

                        @-webkit-keyframes imagelightbox-loading
                        {
                                from { opacity: .5;        -webkit-transform: scale( .75 ); }
                                50%         { opacity: 1;        -webkit-transform: scale( 1 ); }
                                to         { opacity: .5;        -webkit-transform: scale( .75 ); }
                        }
                        @keyframes imagelightbox-loading
                        {
                                from { opacity: .5;        transform: scale( .75 ); }
                                50%         { opacity: 1;        transform: scale( 1 ); }
                                to         { opacity: .5;        transform: scale( .75 ); }
                        }


                /* OVERLAY */

                #imagelightbox-overlay
                {
                        background-color: #fff;
                        background-color: rgba( 255, 255, 255, .9 );
                        position: fixed;
                        z-index: 9998;
                        top: 0;
                        right: 0;
                        bottom: 0;
                        left: 0;
                }


                /* "CLOSE" BUTTON */

                #imagelightbox-close
                {
                        width: 2.5em; /* 40 */
                        height: 2.5em; /* 40 */
                        text-align: left;
                        background-color: #666;
                        border-radius: 50%;
                        position: fixed;
                        z-index: 10002;
                        top: 2.5em; /* 40 */
                        right: 2.5em; /* 40 */

                        -webkit-transition: color .3s ease;
                        transition: color .3s ease;
                }
                        #imagelightbox-close:hover,
                        #imagelightbox-close:focus
                        {
                                background-color: #111;
                        }
                        #imagelightbox-close:before,
                        #imagelightbox-close:after
                        {
                                width: 2px;
                                background-color: #fff;
                                content: '';
                                position: absolute;
                                top: 20%;
                                bottom: 20%;
                                left: 50%;
                                margin-left: -1px;
                        }
                        #imagelightbox-close:before
                        {
                                -webkit-transform: rotate( 45deg );
                                -ms-transform: rotate( 45deg );
                                transform: rotate( 45deg );
                        }
                        #imagelightbox-close:after
                        {
                                -webkit-transform: rotate( -45deg );
                                -ms-transform: rotate( -45deg );
                                transform: rotate( -45deg );
                        }