/* -----------------------------------------------------------------------------

    Feerichno

----------------------------------------------------------------------------- */


/* -----------------------------------------------------------------------------

    TABLE OF CONTENT
    
    1.) Google Fonts
    2.) General
    3.) Typography
    4.) Components
    5.) Header
    6.) Main Slider
    7.) Homepage
    8.) Page Types
    9.) Sidebar
    10.) Twitter Feed
    11.) Bottom
    12.) Footer
    13.) Responsive
    14.) Bitrix24

----------------------------------------------------------------------------- */


/* -----------------------------------------------------------------------------

    1.) GOOGLE FONTS
    Please see the documentation on how to change fonts.

----------------------------------------------------------------------------- */



/* -----------------------------------------------------------------------------

    2.) GENERAL
    Some general definitions and resets.

----------------------------------------------------------------------------- */

body { margin: 0; font: 17px "PT Sans",Helvetica,Arial, sans-serif; font-weight: normal; color: #333; -webkit-font-smoothing: antialiased!important; text-rendering: optimizeLegibility!important; }

    /* ----------------------------------
        RESET
    ---------------------------------- */

    ::-moz-focus-inner { border: 0; padding: 0; }
    a { text-decoration: none;
        -webkit-transition: color 300ms ease-in-out, background-color 300ms ease-in-out; -moz-transition: color 300ms ease-in-out, background-color 300ms ease-in-out; -ms-transition: color 300ms ease-in-out, background-color 300ms ease-in-out; -o-transition: color 300ms ease-in-out, background-color 300ms ease-in-out; transition: color 300ms ease-in-out, background-color 300ms ease-in-out; }
    a img { border: 0; }
    button { padding: 0; border: 0; font-family: 'PT Sans', sans-serif; background: transparent; cursor: pointer;
        -webkit-transition: color 300ms ease-in-out, background-color 300ms ease-in-out; -moz-transition: color 300ms ease-in-out, background-color 300ms ease-in-out; -ms-transition: color 300ms ease-in-out, background-color 300ms ease-in-out; -o-transition: color 300ms ease-in-out, background-color 300ms ease-in-out; transition: color 300ms ease-in-out, background-color 300ms ease-in-out; }
    h1,h2,h3,h4,h5,h6 { margin: 0; }
    iframe { border: 0; }
    img { max-width: 100%; }
    input, textarea { font-family: 'PT Sans', sans-serif; outline: 0; }
    ol, ul, li { margin: 0; padding: 0; list-style-type: none; }
    p { margin: 0 0 30px 0; line-height: 1.5em; }
    var { display: none; }

    /* ----------------------------------
        UTILITY CLASSES
    ---------------------------------- */

    .centered { text-align: center; }


/* -----------------------------------------------------------------------------

    3.) TYPOGRAPHY

----------------------------------------------------------------------------- */

.various-content *:first-child { margin-top: 0; }

    /* ----------------------------------
        HEADINGS
    ---------------------------------- */

    .various-content h1 { margin: 40px 0 0 0; font-size: 2.28em; font-weight: normal; }
    .various-content h2 { margin: 40px 0 0 0; font-size: 1.78em; font-weight: normal; }
    .various-content h3 { margin: 30px 0 0 0; font-size: 1.07em; font-weight: bold; }
    .various-content h4 { margin: 30px 0 0 0; font-size: 1.07em; font-weight: normal; }
    .various-content h5 { margin: 30px 0 0 0; font-size: 1em; font-weight: bold; }
    .various-content h6 { margin: 30px 0 0 0; font-size: 1em; font-weight: normal; }

    /* ----------------------------------
        PARAGRAPHS & SECTIONS
    ---------------------------------- */

    .various-content p { margin: 15px 0 0 0; line-height: 1.6em; }
    .various-content p.lead { font-size: 1.3em; line-height: 1.5em; margin-bottom: 30px; }
    .various-content section { margin: 60px 0 0 0; }
    .various-content section.minor { margin: 30px 0 0 0; }
    .various-content blockquote { background-color: #f7f7f7; border: 0px; color: #5a5a5a; font-size: 1.1em; font-style: italic; line-height: 1.7em; margin: 50px 0px; padding: 40px 30px; position: relative; }
    .various-content blockquote:before { background-color: #3499dc; content: '\f10e'; color: #fff; display: block; font-family: 'FontAwesome'; height: 60px; left: 50%; line-height: 70px; margin-left: -35px; position: absolute; top: -30px; width: 60px; text-align: center;}
    .various-content blockquote:after { background-color: #3499dc; bottom: -8px; content: ''; display: block; height: 8px; left: 50%; margin-left: -15%; position: absolute; width: 30%;}

    /* ----------------------------------
        LISTS
    ---------------------------------- */

    ul.default-list,
    ul.check-list { margin: 30px 0 0 0; list-style-type: none; line-height: 1.6em;}
    ul.default-list li,
    ul.check-list li { position: relative; margin: 10px 0 0 0; padding: 0 0 0 25px; list-style-type: none; }
    ul.default-list li:first-child,
    ul.check-list li:first-child { margin-top: 0; }
    ul.default-list li .ico,
    ul.check-list li .ico { position: absolute; left: 0; top: 4px; font-size: 10px; }
    ul.default-list i,
    ul.check-list i { position: absolute; left: 0; top: 6px; font-size: 10px; }

    .various-content ol { margin: 30px 0 0 0; list-style-type: decimal; }
    .various-content ol li { position: relative; margin: 20px 0 0 0; list-style-type: decimal; list-style-position: inside; line-height: 1.6em;}
    .various-content ol li:first-child { margin-top: 0; }

    /* ----------------------------------
        TABLE
    ---------------------------------- */

    .various-content table { width: 100%; }
    .various-content table { margin-top: 30px; border-collapse: collapse; border: 0; }
    .various-content table th { font-weight: bold; text-align: left; }
    .various-content table td,
    .various-content table th { padding: 20px 15px; vertical-align: top; border: 1px solid transparent; }


/* -----------------------------------------------------------------------------

    4.) COMPONENTS

----------------------------------------------------------------------------- */

    /* ----------------------------------
        ACCORDION
    ---------------------------------- */

    .accordion { margin-top: 30px; }
    .accordion .accordion-item { margin-top: 10px; border: 1px solid transparent;
        -webkit-transition: background-color 300ms ease-in-out; -moz-transition: background-color 300ms ease-in-out; -ms-transition: background-color 300ms ease-in-out; -o-transition: background-color 300ms ease-in-out; transition: background-color 300ms ease-in-out; }
    .accordion .accordion-toggle { position: relative; margin: 0; padding: 14px 20px 14px 55px; font-size: 1.07em; cursor: pointer; }
    .accordion .accordion-toggle i { position: absolute; top: 16px; left: 22px; margin-right: 15px; font-size: 15px; }
    .accordion .accordion-content { display: none; padding: 0 20px 14px 55px; }
    .accordion .active .accordion-content { display: block; }

    /* ----------------------------------
        ALERT MESSAGES
    ---------------------------------- */

    p.alert { position: relative; margin: 30px 0 0 0; padding: 16px 20px 16px 55px; border: 1px solid transparent; }
    p.alert .ico { position: absolute; top: 23px; left: 22px; font-size: 24px; }

    /* ----------------------------------
        AUDIO PLAYER
    ---------------------------------- */

    .audio-player-inner { display: none; position: relative; height: 45px; }
    html.audio .audio-player-inner { display: block; }
    .audio-player .ico { position: absolute; left: 0; bottom: 0; width: 45px; height: 45px; text-align: center; z-index: 40; }
    .audio-player .ico i { position: relative; top: 13px; font-size: 18px; }
    .audio-player button { display: block; position: absolute; top: 0; left: 45px; width: 45px; height: 45px; font-size: 18px; text-align: center; }
    .audio-player button i {
        -webkit-transition: color 300ms ease-in-out; -moz-transition: color 300ms ease-in-out; -ms-transition: color 300ms ease-in-out; -o-transition: color 300ms ease-in-out; transition: color 300ms ease-in-out; }
    .audio-player .icon-play { display: none; }
    .audio-player.paused .icon-pause { display: none; }
    .audio-player.paused .icon-play { display: inline; }
    .audio-player .progbar { position: relative; top: 21px; margin: 0 15px 0 95px; height: 4px; line-height: 0; font-size: 0; cursor: pointer; }
    .audio-player .progbar div { width: 0; height: 4px; line-height: 0; font-size: 0; }
    html.audio .audio-player .audio-player-oldbrowsers { display: none; }

    /* ----------------------------------
        BUTTON PAGINATION
    ---------------------------------- */

    .button-pagination { position: relative; margin-top: 60px; min-height: 40px; text-align: center; }
    .button-pagination p.status { position: absolute; left: 0; top: 7px; margin: 0; font-size: 1.1em; }
    .button-pagination a { display: inline-block; position: relative; padding: 10px 20px 9px 40px; border-radius: 7px;
        -webkit-transition: all 300ms ease-in-out; -moz-transition: all 300ms ease-in-out; -ms-transition: all 300ms ease-in-out; -o-transition: all 300ms ease-in-out; transition: all 300ms ease-in-out; }
    .button-pagination a .loading-anim { display: none; left: 6px; top: 3px; width: 30px; height: 30px; }
    .button-pagination a .ico { position: absolute; top: 12px; left: 15px; font-size: 15px; }

    /* LOADING */

    .button-pagination a.loading .loading-anim { display: block; }
    .button-pagination a.loading .ico { display: none; }

    /* ----------------------------------
        BUTTONS
    ---------------------------------- */

    .button { display: inline-block; padding: 14px 22px 13px 22px; text-decoration: none; font-size: 1.1em; text-transform: uppercase; border-radius: 7px; }
    .button i { position: relative; margin-right: 12px; }
    .button.wide { padding: 14px 45px 13px 45px; }

    /* ----------------------------------
        CTA MESSAGE
    ---------------------------------- */

    .cta-message { margin-top: 30px; padding: 30px; border-radius: 7px; }
    .cta-message h2 { margin: 0; font-family: 'PT Sans', Georgia, 'Times New Roman', Times, serif; /*font-style:italic; */font-weight: normal; font-size: 1.5em; }
    .cta-message p { margin: 5px 0 0 0; font-size: 1.1em; }
    .cta-message .button { float: right; text-align: center; }

    /* ----------------------------------
        LIST SLIDER
    ---------------------------------- */

    .list-slider { position: relative; }
    .list-slider-items { height: auto;
        -webkit-transition: height 300ms ease-in-out; -moz-transition: height 300ms ease-in-out; -ms-transition: height 300ms ease-in-out; -o-transition: height 300ms ease-in-out; transition: height 300ms ease-in-out; }
    .list-slider-items > ul { position: relative; top: 0; left: 0;
        -webkit-transition: left 300ms ease-in-out; -moz-transition: left 300ms ease-in-out; -ms-transition: left 300ms ease-in-out; -o-transition: left 300ms ease-in-out; transition: left 300ms ease-in-out; }
    .list-slider-items > ul > li { float: left; }
    .list-slider-items > ul > li > * { float: none; }

    /* NAV */

    .list-slider-nav { position: absolute; right: 0; top: -100px; }
    .list-slider-nav button { display: block; position: relative; float: left; width: 28px; height: 28px; }
    .list-slider-nav button.prev { margin-right: 5px; }
    .list-slider-nav button i { display: block; position: absolute; top: -1px; left: -1px; width: 30px; height: 30px;
        -webkit-transition: left 300ms ease-in-out; -moz-transition: left 300ms ease-in-out; -ms-transition: left 300ms ease-in-out; -o-transition: left 300ms ease-in-out; transition: left 300ms ease-in-out; }
    .list-slider-nav button.prev:active i { left: -5px; }
    .list-slider-nav button.next:active i { left: 3px; }
    .list-slider-nav button.disabled { cursor: default; }
    .list-slider-nav button.disabled:active i { left: -1px; }

    /* ----------------------------------
        LOADING ANIMATION
    ---------------------------------- */

    @keyframes loading { from { transform: rotate(0); } to { transform: rotate(359deg); } }
    @-moz-keyframes loading { from { -moz-transform: rotate(0); } to { -moz-transform: rotate(359deg); } }
    @-webkit-keyframes loading { from { -webkit-transform: rotate(0); } to { -webkit-transform: rotate(359deg); } }
    @-o-keyframes loading { from { -o-transform: rotate(0); } to { -o-transform: rotate(359deg); } }

    .loading-anim { display: none; position: absolute; width: 100%; }
    .loading-anim span { display: block; position: relative; margin: 0 auto 0 auto; width: 50px; height: 50px; border-radius: 50%; }
    .loading-anim i { display: block; position: relative; top: 10px; left: 10px; width: 30px; height: 30px;
        animation-name: loading; animation-duration: 1s; animation-timing-function: linear; animation-iteration-count: infinite;
        -moz-animation-name: loading; -moz-animation-duration: 1s; -moz-animation-timing-function: linear; -moz-animation-iteration-count: infinite;
        -webkit-animation-name: loading; -webkit-animation-duration: 1s; -webkit-animation-timing-function: linear; -webkit-animation-iteration-count: infinite;
        -o-animation-name: loading; -o-animation-duration: 1s; -o-animation-timing-function: linear; -o-animation-iteration-count: infinite;
    }
    
    /* SMALL */

    .loading-anim.small span { width: 30px; height: 30px; }
    .loading-anim.small span i { left: 0; top: 0; }

    /* ----------------------------------
        PAGINATION
    ---------------------------------- */

    .pagination { margin-top: 90px; text-align: right; }
    .pagination li { display: inline-block; margin: 10px 0 0 0; font-size: 1.07em; }
    .pagination li a { display: block; width: 40px; height: 40px; line-height: 40px; text-align: center; font-weight: bold; border-radius: 7px; }

    /* ----------------------------------
        PROGRESS BARS
    ---------------------------------- */

    .progressbar { font-weight: bold; text-transform: uppercase; }
    .progressbar .inner { position: relative; padding: 18px 20px 17px 20px; width: 10px; white-space: nowrap;
        -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;
        -webkit-transition: width 600ms ease-in-out; -moz-transition: width 600ms ease-in-out; -ms-transition: width 600ms ease-in-out; -o-transition: width 600ms ease-in-out; transition: width 600ms ease-in-out; }
    .progressbar .inner .percentage { position: absolute; top: 16px; right: 20px; }

    /* ----------------------------------
        PROJECT PREVIEW
    ---------------------------------- */

    /*.project-preview { border-bottom: 1px solid transparent; }*/
    .project-preview .thumb { position: relative; padding-bottom: 75%; width: 100%; height: 0; overflow: hidden; }
    .project-preview .thumb .overlay { position: absolute; top: 0; left: 0; width: 100%; height: 100%; opacity: 0;
        -webkit-transition: opacity 300ms ease-in-out; -moz-transition: opacity 300ms ease-in-out; -ms-transition: opacity 300ms ease-in-out; -o-transition: opacity 300ms ease-in-out; transition: opacity 300ms ease-in-out; }
    .project-preview .thumb .overlay-inner { position: absolute; width: 100%; height: 40px; top: 50%; text-align: center; }
    .project-preview .thumb .overlay a { position: relative; top: 200px; display: inline-block; margin: 0 2px 0 2px; width: 40px; height: 40px; text-align: center; border-radius: 7px; opacity: 0;
        -webkit-transition: all 300ms ease-in-out; -moz-transition: all 300ms ease-in-out; -ms-transition: all 300ms ease-in-out; -o-transition: all 300ms ease-in-out; transition: all 300ms ease-in-out; }
    .project-preview .thumb .overlay a i { position: relative; top: 11px; font-size: 18px; }
    .project-preview .thumb.hover .overlay { opacity: 1; }
    .project-preview .thumb.hover .overlay a { top: -20px; opacity: 1; }
    .project-preview .thumb.hover .overlay a:hover { top: -16px; }
    .project-preview .thumb.hover .overlay a:active { top: -13px; }
    .project-preview .thumb.hover .overlay a.link { -webkit-transition: all 400ms ease-in-out; -moz-transition: all 400ms ease-in-out; -ms-transition: all 400ms ease-in-out; -o-transition: all 400ms ease-in-out; transition: all 400ms ease-in-out; }
    .project-preview .thumb img { display: block; }
    .project-preview .title { position: relative; padding: 24px 0 20px 0; }
    .project-preview h3 { margin: 0; font-size: 0.9em; /*text-transform: uppercase; */font-weight: normal; }
    .project-preview .date { position: absolute; top: 28px; right: 0; margin: 0; font-size: 0.8em; }

    /* ----------------------------------
        SECTION TITLE
    ---------------------------------- */

    h2.section-title { font-weight: normal; font-size: 1.8em; }
    h2.section-title strong { display: block; font-weight: bold; font-size: 0.45em; }

    /* ----------------------------------
        TABS
    ---------------------------------- */

    .tabs { position: relative; margin-top: 30px; z-index: 30; }
    .tabs .tab { display: block; position: relative; float: left; padding: 22px 25px 22px 55px; font-size: 1.07em; font-weight: bold; border: 1px solid transparent; border-left-width: 0; cursor: pointer; }
    .tabs .tab:first-child { border-left-width: 1px; }
    .tabs .tab i { position: absolute; top: 24px; left: 25px; font-size: 15px; }
    .tab-content { position: relative; top: -1px; z-index: 20; }
    .tab-content .item { display: none; padding: 20px; border: 1px solid transparent; }
    .tab-content .item.active { display: block; }


/* -----------------------------------------------------------------------------

    5.) HEADER

----------------------------------------------------------------------------- */

header { position: relative; z-index: 50; }

    /* ----------------------------------
        TOPBAR
    ---------------------------------- */

    #topbar { padding: 10px 0 10px 0; }
    .topbar-inner { position: relative; height: 42px; }

    /* SOCIAL ICONS */

    #topbar .social-icons ul { float: left; position: relative; z-index: 30; }
    #topbar .social-icons li { display: block; float: left; margin-right: 10px; }
    #topbar .social-icons li a { display: block; width: 42px; height: 42px; }
    #topbar .social-icons li a i { display: block; position: relative; top: 8px; left: 10px; width: 30px; height: 30px; opacity: 1;
        -webkit-transition: opacity 300ms ease-in-out; -moz-transition: opacity 300ms ease-in-out; -ms-transition: opacity 300ms ease-in-out; -o-transition: opacity 300ms ease-in-out; transition: opacity 300ms ease-in-out; }
    #topbar .social-icons li a:active i { opacity: .7; }

    /* SEARCH */

    #topbar .search-form { position: absolute; top: 0; right: 0; width: 100%; height: 42px; z-index: 20; }
    #topbar .search-form .input { display: none; position: absolute; left: 0; width: 100%; height: 42px; z-index: 20; }
    #topbar .search-form .input button.close { display: block; position: absolute; top: 0; left: 0; width: 42px; height: 42px; font-size: 18px; z-index: 30; }
    #topbar .search-form .input input { position: absolute; padding: 9px 0 0 70px; width: 70%; line-height: 1px; font: 19px 'Sintony', sans-serif; background: none; border: 0; z-index: 20; }
    #topbar .search-form button.submit { position: absolute; top: 0; right: 0; width: 42px; height: 42px; font-size: 18px; z-index: 30; }
    #topbar .search-form button i { opacity: 1;
        -webkit-transition: opacity 300ms ease-in-out; -moz-transition: opacity 300ms ease-in-out; -ms-transition: opacity 300ms ease-in-out; -o-transition: opacity 300ms ease-in-out; transition: opacity 300ms ease-in-out; }
    #topbar .search-form button:active i { opacity: .7; }
    #topbar .search-form.active { z-index: 30; }

    /* TELEPHONE */

    #topbar .telephone { position: absolute; top: 0; right: 0; width: 100%; height: 42px; z-index: 20; }
	#topbar .telephone .number {position: absolute; top: 0px; right: 0; height: 42px; font-size: 1.1em; z-index: 30; text-align:right;}
	#topbar .telephone .number a {underline: none; color: #99a4aa;}
	#topbar .telephone .number a:hover {color: #99a4aa;}
	#topbar .telephone .callback {position: absolute; top: 26px; right: 0; color: #E8E8E8; font-size: 13px; z-index: 30; text-align:right; cursor: pointer; border-bottom: 1px dashed #E8E8E8;}
	#topbar .telephone .callback:hover {color: #3498DA; border-bottom: 1px dashed #3498DA;}

    /* RESPONSIVE CONTROLS */

    .responsive-controls { display: none; }
    .responsive-controls button { display: block; position: relative; width: 60px; height: 60px; z-index: 40; }
    .responsive-controls button i { font-size: 24px; }

    /* ----------------------------------
        NAVBAR
    ---------------------------------- */

    .navbar-inner { position: relative; }

    /* BRANDING */

    #branding { display: block; position: absolute; top: 19px; left: 0; width: 152px;  }
    #branding img { display: block;  }

    /* MAIN NAV */

    nav.main { position: relative; float: right; }
    nav.main > button { display: none; float: right; width: 60px; height: 60px; }
    nav.main > button i { font-size: 24px; }
    nav.main .indicator { position: absolute; left: 0; bottom: 0; width: 0; height: 6px; line-height: 0; font-size: 0; background: #3eb5f1; z-index: 20;
        -webkit-transition: all 300ms ease-in-out; -moz-transition: all 300ms ease-in-out; -ms-transition: all 300ms ease-in-out; -o-transition: all 300ms ease-in-out; transition: all 300ms ease-in-out; }
    /* lvl 1 */
    nav.main > ul { position: relative; z-index: 30; }
    nav.main > ul > li { font-family: 'PT Sans Narrow', sans-serif; /*font-size:16px; */text-transform: uppercase; float: left; position: relative; margin-top: 40px;}
    nav.main > ul > li > a { display: block; position: relative; padding: 0 27px 36px 27px; z-index: 30;
        -webkit-transition: border-color 300ms ease-in-out; -moz-transition: border-color 300ms ease-in-out; -ms-transition: border-color 300ms ease-in-out; -o-transition: border-color 300ms ease-in-out; transition: border-color 300ms ease-in-out;}
    nav.main > ul > li:last-child a,
    nav.main > ul > li.last a { padding-right: 0; }
    nav.main > ul > li > a strong { display: block; font-size: 1.2em; }
    nav.main > ul > li > .arrow { display: block; position: absolute; left: -0; top: 4px; width: 14px; height: 14px; z-index: 20; }
    nav.main > ul > li > .arrow i { display: block; width: 14px; height: 14px; }
    /* lvl 2 */
    nav.main > ul > li > ul { display: none; position: absolute; left: 27px; }
    nav.main > ul > li > ul li { border-top: 1px solid transparent;}
    nav.main > ul > li > ul li:first-child { border: 0; }
    nav.main > ul > li > ul a { display: block; padding: 15px 17px; white-space: nowrap; }


/* -----------------------------------------------------------------------------

    6.) MAIN SLIDER

----------------------------------------------------------------------------- */

#slider { position: relative; }
#slider .slider-inner { position: relative; }
#slider .carousel { margin: 0; }

    /* ----------------------------------
        ITEMS
    ---------------------------------- */

    #slider .carousel-inner .item { height: 650px; background-position: center; background-size: cover; background-repeat: no-repeat; }
    #slider .carousel-inner .item-inner { display: table; width: 80%; height: 100%; margin: auto;}
    #slider .carousel-inner .item-content { display: table-cell; padding: 0 30px 0 30px; vertical-align: middle; }
    #slider .carousel-inner .item h2 { margin: 40px 0; line-height: 1.5em; font-size: 2.5em; font-weight: normal; background: rgba(121, 121, 121, 0.5);}
    #slider .carousel-inner .item p { margin: 40px 0 0 0; font-size: 1.4em; }
    #slider .carousel-inner .item p:first-child { margin-top: 0; }
    #slider .carousel-inner .item .button { margin: 10px 10px; line-height: normal; font-size: 0.75em; font-weight: normal; text-decoration: none; }

    /* ----------------------------------
        CONTROLS
    ---------------------------------- */

    #slider .nav { position: absolute; top: 50%; }
    #slider .nav button { display: block; position: relative; top: -23px; width: 46px; height: 46px; border-radius: 7px; }
    #slider .nav button i { display: block; position: absolute; top: 8px; left: 8px; width: 30px; height: 30px;
        -webkit-transition: all 300ms ease-in-out; -moz-transition: all 300ms ease-in-out; -ms-transition: all 300ms ease-in-out; -o-transition: all 300ms ease-in-out; transition: all 300ms ease-in-out; }    #slider .nav.prev { left: 20px; }
    #slider .nav.prev button:active i { left: 5px; }
    #slider .nav.next { right: 20px; }
    #slider .nav.next button:active i { left: 11px; }
    #slider button.pause { display: block; position: absolute; bottom: 25px; right: 20px; width: 46px; height: 46px; border-radius: 7px; }

    /* ----------------------------------
        INDICATOR
    ---------------------------------- */

    #slider .indicator { position: absolute; bottom: 0; left: 0; width: 100%; height: 6px; font-size: 0; line-height: 0; }
    #slider .indicator .progressbar { height: 6px; width: 0; }

    /* ----------------------------------
        LOADING
    ---------------------------------- */

    #slider .loading-anim { display: block; position: absolute; top: 20px; right: 20px; width: 50px; height: 50px; z-index: 50; }


/* -----------------------------------------------------------------------------

    7.) HOMEPAGE

----------------------------------------------------------------------------- */

    /* ----------------------------------
        WELCOME
    ---------------------------------- */

    #welcome .welcome-inner { padding: 55px 20px; }
    #welcome.big .welcome-inner { padding: 150px 20px; }
    #welcome h1 { font-family: 'PT Sans', Georgia, 'Times New Roman', Times, serif; font-style:normal; font-size: 1.50em; font-weight: normal; line-height: 1.5em; margin: 0;}
    #welcome a { text-decoration: underline; }

    /* ----------------------------------
        HOME SERVICES
    ---------------------------------- */

    .home-services-inner { padding: 30px 0 40px 0; }
    #home-services .service { padding: 30px 20px 25px 20px; text-align: center; border-radius: 7px;
        -webkit-transition: background-color 300ms ease-in-out; -moz-transition: background-color 300ms ease-in-out; -ms-transition: background-color 300ms ease-in-out; -o-transition: background-color 300ms ease-in-out; transition: background-color 300ms ease-in-out; cursor:pointer; }
	#home-services	.service p:first-child { min-height: 65px; }
    #home-services .ico { display: block; margin: 0 auto 20px auto; width: 62px; height: 62px; border-radius: 50%; }
    #home-services .ico i { position: relative; top: 17px; font-size: 28px; }
    #home-services h2 { margin: 20px 0 10px 0; font-weight: normal; font-size: 1.5em; }
    #home-services p { margin: 24px 0 0 0; line-height: 1.6em; }
    #home-services .service *:first-child { margin-top: 0; }

    /* ----------------------------------
        HOMEPAGE CORE
    ---------------------------------- */

    #homepage-core { padding: 80px 0 100px 0; }
    #homepage-core .cta-message { margin-top: 0; }
    #homepage-core section { margin-top: 80px; }
    #homepage-core section:first-child { margin-top: 0; }

    /* ----------------------------------
        BOTTOM BANNERS
    ---------------------------------- */

    .home-page .bottom-banners { margin-top: 80px; padding-top: 55px; border-top: 1px solid transparent; }
    .home-page .bottom-banners a { opacity: .6;
        -webkit-transition: opacity 300ms ease-in-out; -moz-transition: opacity 300ms ease-in-out; -ms-transition: opacity 300ms ease-in-out; -o-transition: opacity 300ms ease-in-out; transition: opacity 300ms ease-in-out; }
    .home-page .bottom-banners a:hover { opacity: 1; }
    .home-page .bottom-banners a:active { opacity: .3; }

    /* ----------------------------------
        RECENT ARTICLES
    ---------------------------------- */

    .home-page .recent-articles h2.section-title { padding-right: 150px; }
    .home-page .recent-articles .articles { margin-top: 80px; }
    .home-page .recent-articles .article .ico { position: absolute; left: 0; bottom: 0; width: 45px; height: 45px; text-align: center; z-index: 40; }
    .home-page .recent-articles .article .ico i { position: relative; top: 13px; font-size: 18px; }
    .home-page .recent-articles .article .title { position: relative; margin-bottom: 25px; padding: 0 0 20px 0; border-bottom: 1px solid transparent; }
    .home-page .recent-articles .article h3 { margin: 0; font-size: 1.1em; text-transform: uppercase; }
    .home-page .recent-articles .article .date { position: absolute; top: 4px; right: 0; margin: 0; font-size: 0.8em; }
    .home-page .recent-articles .article .text p { line-height: 1.7em; font-size: 0.95em; }

    /* IMAGE & VIDEO ARTICLE */

    .home-page .recent-articles .article.image .thumb,
    .home-page .recent-articles .article.video .thumb { position: relative; margin-bottom: 24px; padding-bottom: 70%; width: 100%; height: 0; background-position: center; overflow: hidden; }
    .home-page .recent-articles .article.video .thumb a { display: block; position: absolute; top: 0; left: 0; width: 100%; height: 100%; overflow: hidden; z-index: 30; }

    /* AUDIO ARTICLE */

    .home-page .recent-articles .article.audio .audio-player { margin-bottom: 24px; }

    /* ----------------------------------
        RECENT PROJECTS
    ---------------------------------- */

    .home-page .recent-projects .projects { margin-top: 60px; }
    .home-page .recent-projects h2.section-title { padding-right: 150px; }


/* -----------------------------------------------------------------------------

    8.) PAGE TYPES

----------------------------------------------------------------------------- */

    /* ----------------------------------
        PAGE TITLE
    ---------------------------------- */

    #page-title { padding: 13px 20px; }
    #page-title h1 { margin: 0; font-weight: normal; font-size: 2.3em; }
    #page-title h1 span { position: relative; left: 20px; top: -4px; font-size: 0.45em; }

    /* ----------------------------------
        PAGE CORE
    ---------------------------------- */

    #page-core { padding: 60px 0 60px 0; }

    /* ----------------------------------
        ABOUT PAGE
    ---------------------------------- */

    .about-page section { margin-top: 80px; }
    .about-page section:first-child,
    .about-page section > *:first-child { margin-top: 0; }

    /* ABOUT INTRO */

    /* .about-page .about-intro { font-size: 1.1em; }*/
    .about-page .about-intro img { border-radius: 7px; }

    /* ABOUT TEAM */

    .about-page .team-member { margin-top: 60px; border: 1px solid transparent; border-radius: 12px; }
    .about-page .team-member .thumb { position: relative; padding-bottom: 70%; width: 100%; height: 0; overflow: hidden; border-radius: 12px 12px 0 0; }
    .about-page .team-member .thumb .overlay { position: absolute; top: 0; left: 0; width: 100%; height: 100%; opacity: 0;
        -webkit-transition: opacity 300ms ease-in-out; -moz-transition: opacity 300ms ease-in-out; -ms-transition: opacity 300ms ease-in-out; -o-transition: opacity 300ms ease-in-out; transition: opacity 300ms ease-in-out; }
    .about-page .team-member .thumb .overlay-inner { position: absolute; width: 100%; height: 40px; top: 50%; text-align: center; }
    .about-page .team-member .thumb .overlay a { position: relative; top: 200px; display: inline-block; margin: 0 2px 0 2px; width: 40px; height: 40px; text-align: center; border-radius: 7px; opacity: 0;
        -webkit-transition: all 300ms ease-in-out; -moz-transition: all 300ms ease-in-out; -ms-transition: all 300ms ease-in-out; -o-transition: all 300ms ease-in-out; transition: all 300ms ease-in-out; }
    .about-page .team-member .thumb .overlay a i { display: block; position: relative; top: 5px; left: 5px; width: 30px; height: 30px; }
    .about-page .team-member .thumb.hover .overlay { opacity: 1; }
    .about-page .team-member .thumb.hover .overlay a { top: -20px; opacity: 1; }
    .about-page .team-member .thumb.hover .overlay a:hover { top: -16px; }
    .about-page .team-member .thumb.hover .overlay a:active { top: -13px; }
    .about-page .team-member .thumb.hover .overlay a.ico2 { -webkit-transition: all 400ms ease-in-out; -moz-transition: all 400ms ease-in-out; -ms-transition: all 400ms ease-in-out; -o-transition: all 400ms ease-in-out; transition: all 400ms ease-in-out; }
    .about-page .team-member .thumb.hover .overlay a.ico3 { -webkit-transition: all 500ms ease-in-out; -moz-transition: all 500ms ease-in-out; -ms-transition: all 500ms ease-in-out; -o-transition: all 500ms ease-in-out; transition: all 500ms ease-in-out; }
    .about-page .team-member .thumb.hover .overlay a.ico4 { -webkit-transition: all 600ms ease-in-out; -moz-transition: all 600ms ease-in-out; -ms-transition: all 600ms ease-in-out; -o-transition: all 600ms ease-in-out; transition: all 600ms ease-in-out; }
    .about-page .team-member .thumb.hovered .overlay a.ico2,
    .about-page .team-member .thumb.hovered .overlay a.ico3,
    .about-page .team-member .thumb.hovered .overlay a.ico4 { -webkit-transition: all 300ms ease-in-out; -moz-transition: all 300ms ease-in-out; -ms-transition: all 300ms ease-in-out; -o-transition: all 300ms ease-in-out; transition: all 300ms ease-in-out; }
    .about-page .team-member .thumb img { display: block; }
    .about-page .team-member .description { padding: 35px 40px 40px 40px; }
    .about-page .team-member h3 { margin: 0 0 5px 0; font-size: 1.7em; font-weight: normal; }
    .about-page .team-member h4 { margin: 0; font-size: 1.15em; font-weight: normal; }
    .about-page .team-member .various-content { padding-top: 30px; }
    .about-page .team-member .various-content > * { margin: 0 0 30px 0; }
    .about-page .team-member .various-content > *:last-child { margin: 0; }
    .about-page .team-member .various-content p { line-height: 1.6em; }

    /* ----------------------------------
        BLOG PAGE
    ---------------------------------- */

    /* ARTICLE LIST */

    .blog-page .article-list article { margin-top: 70px; }
    .blog-page .article-list article:first-child { margin-top: 0; }

    /* ARTICLE IMAGE */

    .blog-page .article-image { position: relative; }
    .blog-page .article-image .ico { position: absolute; left: 0; bottom: 0; width: 45px; height: 45px; text-align: center; z-index: 30; }
    .blog-page .article-image .ico i { position: relative; top: 12px; font-size: 18px; }
    .blog-page .article-image .thumb { position: relative; padding-bottom: 40%; width: 100%; height: 0; overflow: hidden; }
    .blog-page .article-image .thumb img { position: absolute; top: -30%; z-index: 20; }

    /* ARTICLE TITLE */

    .blog-page .article-title { margin-top: 40px; padding-bottom: 18px; border-bottom: 1px solid transparent; }
    .blog-page .article-title:first-child { margin-top: 0; }
    .blog-page .article-title .date { margin: 0 0 5px 0; }
    .blog-page .article-title h1 { margin: 0; font-weight: normal; font-size: 2.2em; }

    /* AUDIO PLAYER */

    .blog-page .audio-player { margin-top: 35px; }

    /* ARTICLE LINK */

    .blog-page .article-link { position: relative; margin-top: 35px; width: 100%; height: 45px; overflow: hidden; }
    .blog-page .article-link .ico { display: block; position: absolute; top: 0; left: 0; width: 45px; height: 45px; text-align: center; }
    .blog-page .article-link .ico i { position: relative; top: 13px; font-size: 18px; }
    .blog-page .article-link a { display: block; padding: 14px 20px 0 65px; white-space: nowrap; }
    .blog-page .article-link a:hover { text-decoration: underline; }

    /* ARTICLE CONTENT */

    .blog-page .article-content { margin-top: 20px; /*padding-bottom: 40px; border-bottom: 1px solid transparent; */}
    .blog-page .article-detail .article-content { padding-bottom: 0; }

    /* ARTICLE FOOTER */

    .blog-page .article-footer { position: relative; margin-top: 40px; }
    .blog-page .article-footer .button { top: -9px; left: 0; z-index: 30; }
    .blog-page .article-info { display: inline-block; position: relative; top: 4px; line-height: 1.8em; z-index: 20; }
    .blog-page .article-list .article-info { padding: 0 0 10px 200px; color: #99a4aa;}
    .blog-page .article-info li { float: left; padding-right: 20px; }
    .blog-page .article-info li i { margin-right: 5px; font-size: 14px; }

    /* AUDIO ARTICLE */

    .blog-page article.audio .article-title { padding: 0; border: 0; }

    /* VIDEO ARTICLE */

    .blog-page article.video .article-image .thumb { background-position: center; background-repeat: no-repeat; background-size: cover; }

    /* LINK ARTICLE */

    .blog-page article.link .article-title { padding: 0; border: 0; }

    /* ARTICLE COMMENTS */

    .blog-page .article-comments { margin-top: 60px; }

    /* ----------------------------------
        CONTACT PAGE
    ---------------------------------- */

    /* CONTACT MAP */

    .contact-page .contact-map iframe { display: block; margin: 0; width: 100%; border: 0; }

    /* CONTACT FORM */

    .contact-page .contact-form-inner { padding: 50px 0 80px 0; }
    .contact-page .contact-form-inner form { margin-top: 60px; }
    .contact-page .contact-form p { position: relative; margin: 0 0 25px 0; }
    .contact-page .contact-form p .error-ico { position: absolute; bottom: 12px; right: 10px; font-size: 24px; }
    .contact-page .contact-form p:last-child { margin: 0; }
    .contact-page .contact-form p.alert { margin: 30px 0; }
    .contact-page .contact-form label { display: block; margin: 0 0 16px 0; font-size: 1.1em; }
/*	.contact-page .contact-form label>span {font-size: 1.3em; color: #3498db;}
*/  .contact-page .contact-form input,
    .contact-page .contact-form textarea { display: block; margin: 0; padding: 14px 20px; width: 100%; font-size: 16px; resize: none; border-radius: 7px; border: 0;
        -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; }
/*    .contact-page .contact-form textarea { height: 160px; }
*/  .contact-page .contact-form textarea { height: 186px; }
    .contact-page .contact-form button.submit { margin: 15px 0 0 0; padding: 15px 22px 14px 22px; font-size: 1.05em; text-transform: uppercase; border-radius: 7px; }
    .contact-page .contact-map { border-bottom: 6px solid #ffffff; border-top: 6px solid #ededed;}

    /* CONTACT BOTTOM */

    .contact-page .contact-info { margin-top: 40px; }
    .contact-page .contact-info li { position: relative; padding: 3px 0 3px 115px; line-height: 1.8em; }
    .contact-page .contact-info li a { underline:none; color: #444444; }
    .contact-page .contact-info li .ico { position: absolute; top: 7px; left: 0; font-size: 18px; }
    .contact-page .contact-info li .fa { position: absolute; top: 7px; left: 0; font-size: 18px; }
    .contact-page .contact-info li .fa-at { position: initial; top: 7px; left: 0; font-size: 18px; }
    .contact-page .contact-info li h3 { margin: 0; position: absolute; top: 3px; left: 32px; width: 75px; font-size: 1em; }
    .contact-page .contact-info.hours li { padding-left: 150px; }
    .contact-page .contact-info.hours h3 { width: 100px; }

    .contact-page .contact-description p { line-height: 1.6em; }
    .contact-page .contact-description p.lead { font-size: 1.2em; }

    /* ----------------------------------
        PORTFOLIO PAGE
    ---------------------------------- */

    .portfolio-page .projects .row { margin-top: 60px; }
    .portfolio-page .projects .row:first-child { margin-top: 0; }

    /* PROJECT IMAGES */

    .portfolio-page .project-images p { margin: 30px 0 0 0; }
    .portfolio-page .project-images p:first-child { margin-top: 0; }

    /* PROJECT DESCRIPTION */

    .portfolio-page .project-description .section-title { margin-bottom: 35px; }
    .portfolio-page .project-description .info { margin-bottom: 35px; padding: 12px 0 12px; border: 1px solid transparent; border-left: 0; border-right: 0; }
    .portfolio-page .project-description .info li { position: relative; padding: 2px 0 2px 75px; line-height: 1.8em; }
    .portfolio-page .project-description .info h3 { position: absolute; top: 2px; left: 0; margin: 0; width: 60px; font-size: 1em; text-transform: uppercase; }
    .portfolio-page .project-description .info span { margin-right: 10px; }
    .portfolio-page .project-description .info span:last-child {margin: 0; }
    .portfolio-page .project-description .text > * { margin: 0 0 30px 0; }
    .portfolio-page .project-description .text p { line-height: 1.8em; }
    .portfolio-page .project-nav { margin: 50px 0 0 0; }
    .portfolio-page .project-nav a,
    .portfolio-page .project-nav span { display: inline-block; position: relative; width: 28px; height: 28px;  }
    .portfolio-page .project-nav i { display: block; position: absolute; top: -1px; left: -1px; width: 30px; height: 30px; text-indent: -1000em;
        -webkit-transition: left 300ms ease-in-out; -moz-transition: left 300ms ease-in-out; -ms-transition: left 300ms ease-in-out; -o-transition: left 300ms ease-in-out; transition: left 300ms ease-in-out; }
    .portfolio-page .project-nav .prev:active i { left: -5px; }
    .portfolio-page .project-nav .next:active i { left: 3px; }
    .portfolio-page .project-nav span.prev:active i,
    .portfolio-page .project-nav span.next:active i { left: -1px; }

    /* RECENT PROJECT */

    .portfolio-page .recent-projects { margin-top: 80px; }
    .portfolio-page .recent-projects .projects { margin-top: 60px; }

    /* ----------------------------------
        SEARCH RESULTS PAGE
    ---------------------------------- */

    .search-results-page .search-results > li { margin-top: 50px; padding-bottom: 50px; border-bottom: 1px solid transparent; }
    .search-results-page .search-results > li:first-child { margin-top: 0; }
    .search-results-page h2 { margin: 0; font-weight: normal; font-size: 1.5em; }
    .search-results-page h2 a { text-decoration: underline; }
    .search-results-page .link { margin: 18px 0 0 0; width: 100%; overflow-x: hidden; }
    .search-results-page .link a { text-decoration: underline; }
    .search-results-page .various-content { margin-top: 18px; }
    .search-results-page .various-content .string { padding: 0 2px; }
	.search-results-page .search-results > li img.logo { margin-bottom: 15px; width: 200px; height: 60px; }
    /* ----------------------------------
        ARTICLES PAGE
    ---------------------------------- */
	.articles-page .article-title { padding-bottom: 18px; border-bottom: 1px solid; border-bottom-color:#e5e5e5}
	.articles-page .article-title h2 { margin: 0; font-weight: normal; font-size: 2.2em; color: #667279;}
	.articles-page .article-content { margin-top: 20px;}
	.articles-page .article-content p.lead { font-size: 1.3em; line-height: 1.5em;}
	.articles-page .article-content div.span6.article { margin:0 0 0 0; padding:0 30px 15px 0;}
	.articles-page .article-content div.span6.article-right { float:right; margin:0 0 0 0; padding:0 0 15px 30px;}
	.articles-page .article-content div.span6.article-right img { float: right; }
	.articles-page .service { padding: 12px 20px 35px 20px; text-align: center; border-radius: 7px; -webkit-transition: background-color 300ms ease-in-out; -moz-transition: background-color 300ms ease-in-out; -ms-transition: background-color 300ms ease-in-out; -o-transition: background-color 300ms ease-in-out; transition: background-color 300ms ease-in-out; cursor:pointer; }
	.articles-page .service p:first-child { min-height: 65px; }
	.articles-page .service .ico { background: #f7f7f7; display: block; margin: 0 auto 20px auto; width: 62px; height: 62px; border-radius: 50%; }
	.articles-page .service .ico i { position: relative; top: 17px; font-size: 28px; }
	.articles-page .service h2 { color: #3498db; margin: 24px 0 10px 0; font-weight: normal; font-size: 1.5em; }
	.articles-page .service p { margin: 24px 0 0 0; line-height: 1.6em; }
	.articles-page .service *:first-child { margin-top: 0; }
	.articles-page .service.hover { background: #f7f7f7; }
	.articles-page .recent-projects {margin-top: 45px;}
	.articles-page .recent-projects h2 { color: #3498db; margin-bottom: 20px; font-weight: normal; font-size: 1.8em;}
	.articles-page .list-slider-nav {position: absolute; right: 0; top: -55px;}

    /* ----------------------------------
        SERVICES PAGE
    ---------------------------------- */

    .services-page section { margin-top: 80px; }
    .services-page section:first-child,
    .services-page section > *:first-child { margin-top: 0; }

    /* SERVICES INTRO */

    .services-page .services-intro { padding-bottom: 50px; border-bottom: 1px solid transparent;}

    /* SERVICES LIST */

    .services-page .services-list .service { padding: 30px 20px; border-radius: 7px; border: 1px solid transparent; cursor:pointer; }
    .services-page .services-list .service .ico { display: inline-block; margin-bottom: 40px; width: 60px; height: 60px; text-align: center; border-radius: 7px; }
    .services-page .services-list .service .ico i { position: relative; top: 16px; font-size: 25px; }
    .services-page .services-list .service h2 { margin: 0 0 16px 0; font-weight: normal; font-size: 1.4em; }
    .services-page .services-list .service .various-content { margin: 0 0 0px 0; }
    .services-page .services-list .service .various-content p { line-height: 1.5em; min-height: 80px;}
    .services-page .services-list .service .btn { margin: 0; }

    /* SERVICES FEATURES */

    .services-page .services-features-inner { margin-top: 30px; }
    .services-page .feature { position: relative; margin-top: 30px; padding: 10px 0 0 60px; }
    .services-page .feature .ico { display: block; position: absolute; top: 0; left: 0; width: 46px; height: 46px; text-align: center; border-radius: 5px; }
    .services-page .feature .ico i { position: relative; top: 13px; font-size: 19px;  }
    .services-page .feature h3 { margin: 0 0 10px; font-weight: normal; font-size: 1.3em; }
    .services-page .feature p { margin: 0;}

    /* SERVICES DESCRIPTION */

    .services-page .services-description-inner { margin-top: 60px; }
    .services-page .services-description p.lead { font-size: 1.2em; }


/* -----------------------------------------------------------------------------

    9.) SIDEBAR

----------------------------------------------------------------------------- */

    /* ----------------------------------
        WIDGETS
    ---------------------------------- */

    #sidebar .widget { margin-top: 50px; }
    #sidebar .widget:first-child { margin-top: 0; }
    #sidebar .widget h3 { margin: 0; font-size: 1.05em; text-transform: uppercase; }
    #sidebar .widget-content { margin-top: 22px; }
    #sidebar .widget-content:first-child { margin-top: 0; }
	#sidebar .widget-content .side-menu a { padding: 14px 30px!important; font-size:0.8em !important;}
	#sidebar .widget-content .side-menu ul { margin: 0px; list-style-type: decimal!important; }
    #sidebar .widget-content .side-menu ul li { margin: 0px; list-style-position: inside!important; }
	#sidebar .widget-content .side-menu .active2 li  { padding: 14px 30px!important; font-size:0.8em !important; background-color:#FFFFFF !important; font-weight:bold !important;border-bottom: 1px solid; border-bottom-color: #e5e5e5;}
    #sidebar .widget-content .side-menu ul li:first-child { margin-top: 0; }
	#sidebar .widget-content .active p { display: block; padding: 11px 14px; font-size: 1.15em; border-bottom: 1px solid;  color: #FFF; background: #9db1ba; margin-bottom: 0px;}

    /* SEARCH WIDGET */

    #sidebar .widget.search .input { position: relative; height: 48px; border-radius: 7px; }
    #sidebar .widget.search input { padding: 15px 50px 0 20px; width: 100%; font-size: 16px; background: transparent; border: 0;
        -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; }
    #sidebar .widget.search button { display: block; position: absolute; top: 0; right: 0; width: 48px; height: 48px; border-radius: 7px; }
    #sidebar .widget.search button i { font-size: 18px; opacity: 1;
        -webkit-transition: opacity 300ms ease-in-out; -moz-transition: opacity 300ms ease-in-out; -ms-transition: opacity 300ms ease-in-out; -o-transition: opacity 300ms ease-in-out; transition: opacity 300ms ease-in-out; }
    #sidebar .widget.search button:active i { opacity: .8; }

    /* CATEGORIES WIDGET */

    #sidebar .widget.categories a { display: block; padding: 13px 14px; font-size: 1.15em; border-bottom: 1px solid transparent; }

    /* IMAGES WIDGET */

    #sidebar .widget.images .widget-content { position: relative; min-height: 50px; }
    #sidebar .widget.images.loading .loading-anim { display: block; }
    #sidebar .widget.images .feed { display: none; }
    #sidebar .widget.images li { float: left; margin: 0 15px 15px 0; width: 78px; }
    #sidebar .widget.images li.third { margin-right: 0; }
    #sidebar .widget.images li a { display: block; padding-bottom: 100%; width: 100%; height: 0; background-position: center; background-size: cover; opacity: 1;
        -webkit-transform: translate3d(0,0,0);
        -webkit-transition: opacity 300ms ease-in-out; -moz-transition: opacity 300ms ease-in-out; -ms-transition: opacity 300ms ease-in-out; -o-transition: opacity 300ms ease-in-out; transition: opacity 300ms ease-in-out;}
    #sidebar .widget.images li a:hover { opacity: .7; }
    #sidebar .widget.images li a:active { opacity: .5; }
    #sidebar .widget.images li img { display: none; }


/* -----------------------------------------------------------------------------

    10.) TWITTER FEED

----------------------------------------------------------------------------- */

.twitter-feed-inner { padding: 50px 0; }
#twitter-feed .title { position: relative; text-align: right; }
#twitter-feed .title i { position: absolute; left: 0; top: 0; font-size: 28px; }
#twitter-feed h3 { margin: 0; padding-left: 40px;  font-size: 1.6em; font-weight: normal; }
#twitter-feed p.tweet { margin: 5px 0 10px 0; font-size: 1.2em; }
#twitter-feed p.date { margin: 0; font-size: 0.95em; }
#twitter-feed a { text-decoration: underline; }
#twitter-feed a:hover { text-decoration: none; }


/* -----------------------------------------------------------------------------

    11.) BOTTOM

----------------------------------------------------------------------------- */

.bottom-inner { padding: 60px 0; }

    /* ----------------------------------
        WIDGETS
    ---------------------------------- */

    #bottom .widget h3 { position: relative; margin: 0 0 42px 0; padding-bottom: 20px; font-size: 1.2em; border-bottom: 1px solid transparent; }
    #bottom .widget h3 i { display: block; position: absolute; left: 0; bottom: -1px; width: 22px; height: 1px; line-height: 1px; font-size: 0; }
    #bottom .widget-content { position: relative; }

    /* TEXT WIDGET */

    #bottom .widget.text .widget-content > * { margin: 30px 0 0 0; }
    #bottom .widget.text .widget-content > *:first-child { margin-top: 0; }
    /* #bottom .widget.text .widget-content p { font-size: 1.05em; line-height: 1.5em; } */

    /* ARTICLES WIDGET */

    #bottom .widget.articles li { padding: 10px 0 0 0;; border-top: 1px solid transparent; }
    #bottom .widget.articles li:first-child { padding-top: 0; border: 0; }
    #bottom .widget.articles li:last-child { padding-bottom: 0; }
    #bottom .widget.articles h4 { margin: 0 0 10px 0; line-height: 1.6em; font-weight: normal; font-size: 1.05em; }
    #bottom .widget.articles .date { margin: 0; font-size: 0.9em; }

    /* TAGS WIDGET */

    #bottom .widget.tags li { display: inline-block; margin: 0 3px 7px 0;  }
    #bottom .widget.tags a { display: block; padding: 6px 9px; font-size: 0.8em; text-transform: uppercase; border: 1px solid transparent;
        -webkit-transition: border-color 300ms ease-in-out; -moz-transition: border-color 300ms ease-in-out; -ms-transition: border-color 300ms ease-in-out; -o-transition: border-color 300ms ease-in-out; transition: border-color 300ms ease-in-out; }

    /* IMAGES WIDGET */

    #bottom .widget.images .widget-content { min-height: 50px; }
    #bottom .widget.images .loading-anim { display: block; }
    #bottom .widget.images .feed { display: none; }
    #bottom .widget.images li { float: left; margin: 0 8px 8px 0; width: 60px; }
    #bottom .widget.images li.fourth { margin-right: 0; }
    #bottom .widget.images li a { display: block; padding-bottom: 100%; width: 100%; height: 0; background-position: center; background-size: cover; opacity: 1;
        -webkit-transform: translate3d(0,0,0);
        -webkit-transition: opacity 300ms ease-in-out; -moz-transition: opacity 300ms ease-in-out; -ms-transition: opacity 300ms ease-in-out; -o-transition: opacity 300ms ease-in-out; transition: opacity 300ms ease-in-out;}
    #bottom .widget.images li a:hover { opacity: .7; }
    #bottom .widget.images li a:active { opacity: .5; }
    #bottom .widget.images li img { display: none; }


/* -----------------------------------------------------------------------------

    12.) FOOTER

----------------------------------------------------------------------------- */

footer { font-size: 0.95em; }
.footer-inner { padding: 30px 0; }

    /* ----------------------------------
        COPYRIGHT
    ---------------------------------- */

    footer .copyright { float: left; margin: 0; }

    /* ----------------------------------
        FOOTER NAV
    ---------------------------------- */

    nav.footer { float: right; }
    nav.footer li { display: inline-block; }


/* -----------------------------------------------------------------------------

    13.) RESPONSIVE

----------------------------------------------------------------------------- */

    /* ----------------------------------
        LARGE DESKTOP (default)
    ---------------------------------- */

    #screen-width,
    #screen-width span:before { content: "1200"; }

    /* ----------------------------------
        SMALL DESKTOP
    ---------------------------------- */

    @media (max-width: 1199px) {

    /* SIDEBAR */

    #sidebar .widget.images li { float: left; margin: 0 14px 14px 0; width: 61px; }

    /* BOTTOM */

    #bottom .widget.images li,
    #bottom .widget.images li.fourth { margin: 0 8px 8px 0; width: 65px; }
    #bottom .widget.images li.third { margin-right: 0; }

    /* SCREEN WIDTH */

    #screen-width,
    #screen-width span:before { content: "1199"; }

    }

    /* ----------------------------------
        LARGE TABLET
    ---------------------------------- */

    @media (max-width: 979px) {

    /* COMPONENTS */

    /* buttons */
    .button.wide { padding-left: 20px; padding-right: 20px; }

    /* list slider */
    .list-slider-nav { top: -110px; }
    .list-slider-nav button { width: 40px; height: 40px; }
    .list-slider-nav button i { top: 5px; left: 5px; }
    .list-slider-nav button.prev:active i { left: 2px; }
    .list-slider-nav button.next:active i { left: 8px; }
    /* tabs */
    .tabs .tab { padding: 14px 20px 12px 20px; }
    .tabs .tab span { display: none; }
    .tabs .tab i { position: relative; top: auto; left: auto; }

    /* HEADER */

    /* topbar*/
    #topbar { padding: 15px 20px 5px 20px; }
    .topbar-inner { height: auto; }
    #topbar .responsive-controls { display: block; padding-bottom: 10px;}
    #topbar .responsive-controls .social { float: left; }
    #topbar .responsive-controls .search { float: right; }
    #topbar .social-icons { display: none; margin-top: 10px; }
    #topbar .social-icons li a { margin-bottom: 10px; width: 60px; height: 60px; }
    #topbar .social-icons li a i { font-size: 24px; top: 18px; left: 18px; }
    #topbar .search-form { display: none; position: relative; margin: 10px 0 10px 0; width: auto; height: 60px; }
    #topbar .search-form .input { display: block; position: relative; height: 60px; }
    #topbar .search-form .input input { padding-top: 22px; width: 80%; padding-left: 20px; font-size: 14px; }
    #topbar .search-form button.submit { width: 60px; height: 60px; }
    #topbar .search-form button.submit i { font-size: 24px; }
    #topbar .search-form .input button.close { display: none; }

	/* telephhone */
	#topbar .telephone .number {top: 5px;}
	#topbar .telephone .callback {top: 30px;}
	
    /* navbar */
    .navbar-inner { min-height: 150px; }
    #branding { max-width: 70%; top: 45px;}
    nav.main { float: none; padding-top: 46px; }
    nav.main > button { display: block; }
    nav.main .indicator { display: none; }
    nav.main > ul { display: none; clear: both; padding: 20px 0 10px 0; }
    nav.main > ul > li { position: relative; float: none; margin: 0; padding-bottom: 10px; border-top: 1px solid transparent; }
    nav.main > ul > li:first-child { border: 0; }
    nav.main > ul > li > a { position: relative; padding: 20px 60px 10px 0; z-index: 20; font-size: 1.2em; }
    nav.main > ul > li > a > span { display: none; }
    nav.main > ul > li .arrow { display: block; position: absolute; top: 14px; left: auto; right: 9px; width: 42px; height: 42px; cursor: pointer; z-index: 30; }
    nav.main > ul > li .arrow i { position: relative; top: 6px; left: 6px; width: 30px; height: 30px;
        transform: rotate(0); -ms-transform: rotate(0); -webkit-transform: rotate(0);
        -webkit-transition: all 150ms ease-in-out; -moz-transition: all 150ms ease-in-out; -ms-transition: all 150ms ease-in-out; -o-transition: all 150ms ease-in-out; transition: all 150ms ease-in-out; }
    nav.main > ul > li .arrow.active i { transform: rotate(-180deg); -ms-transform: rotate(-180deg); -webkit-transform: rotate(-180deg); }
    nav.main > ul > li > ul { position: relative; left: auto; top: auto; padding-bottom: 5px; }
    nav.main > ul > li > ul li { border: 0; }
    nav.main > ul > li > ul li a { padding: 5px 0; font-size: 1.2em; line-height: 1.5em; white-space: normal; }

    /* HOMEPAGE */

    /* welcome */
    #welcome br { display: none; }

    /* PAGE TYPES */

    /* page title */
    #page-title h1 span { display: block; left: auto; top: auto; margin-top: 5px; }
    /* blog page */
    .blog-page .article-list .article-info { padding-left: 0; }
    /* contact page */
    .contact-page .contact-info li,
    .contact-page .contact-info.hours li { padding-left: 0;  }
    .contact-page .contact-info li h3 { display: block; position: relative; top: auto; left: auto; width: auto; padding-left: 32px; }
    /* portfolio page */
    .portfolio-page .project-nav a,
    .portfolio-page .project-nav span { width: 40px; height: 40px; }
    .portfolio-page .project-nav i { top: 5px; left: 5px; }
    .portfolio-page .project-nav .prev:active i { left: 2px; }
    .portfolio-page .project-nav .next:active i { left: 8px; }

    /* SIDEBAR */

    #sidebar .widget.images li { float: left; margin: 0 14px 14px 0; width: 76px; }
    #sidebar .widget.images li.third { margin-right: 14px; }
    #sidebar .widget.images li.second { margin-right: 0; }

    /* TWITTER FEED */

    #twitter-feed { padding: 0 20px; }
    #twitter-feed .title { margin-bottom: 20px; text-align: left; }

    /* BOTTOM */

    #bottom .widget.images li,
    #bottom .widget.images li.third,
    #bottom .widget.images li.fourth { margin: 0 10px 10px 0; width: 78px; }
    #bottom .widget.images li.second { margin-right: 0; }

    /* FOOTER */

    footer .copyright { float: none; text-align: center; }
    nav.footer { float: none; margin-top: 30px; text-align: center; }

    /* SCREEN WIDTH */

    #screen-width,
    #screen-width span:before { content: "979"; }

    }

    /* ----------------------------------
        SMALL TABLET
    ---------------------------------- */

    @media (max-width: 767px) {

    /* GENERAL */

    body { padding: 0; }

    /* TYPOGRAPHY */

    .various-content section .row > * > *:first-child { margin-top: 30px; }
    .various-content section .row > *:first-child > *:first-child { margin-top: 0; }

    /* COMPONENTS */

    /* cta message */
    .cta-message .button { display: inline-block; float: none; margin-top: 20px; }
    /* button pagination */
    .button-pagination p.status { position: static; left: auto; top: auto; margin-bottom: 30px; }
    /* list slider */
    .list-slider-nav { position: relative; top: auto; right: auto; margin: 0 auto 30px auto; width: 85px; height: 40px; }
    .list-slider-items { margin: auto; width: 430px; }
    .list-slider-items > ul > li { width: 430px; }
    /* pagination */
    .pagination { text-align: center; }

    /* HEADER */

    #navbar { padding: 0 20px; }
    #branding { max-width: 60%; }

    /* MAIN SLIDER */

    #slider .carousel-inner .item h2 { font-size: 2em; margin: 40px 45px;}

    /* HOMEPAGE */

    /* bottom banners */
    .home-page .bottom-banners { text-align: center;}
	.home-page .bottom-banners a { opacity: 0.9; -webkit-transition: none; transition: none;}
	.home-page .bottom-banners .span3 { margin-bottom: 25px;}
    /* home services */
    .home-services-inner { padding-left: 20px; padding-right: 20px; }
    /* homepage core*/
    #homepage-core { padding-left: 20px; padding-right: 20px; }
    #homepage-core .cta-message .button { margin-top: 30px; }

    /* PAGE TYPES */

    /* page core */
    #page-core { padding-left: 20px; padding-right: 20px; }
    /* about page */
    .about-page .about-intro .various-content { padding-bottom: 30px; }
    .about-page .team-member { margin-left: auto; margin-right: auto; width: 430px; }
    /* blog page */
    .blog-page .article-footer .button { position: static; }
    .blog-page .article-info { display: block; padding: 0; margin-bottom: 30px;  }
    /* contact page */
    .contact-page .contact-form { padding: 0 20px 0 20px; }
    .contact-page .contact-form p:last-child { margin-bottom: 25px; }
    .contact-page .contact-form-inner { padding-bottom: 50px; }
    .contact-page .contact-info { margin-bottom: 60px; }
    /* portfolio page */
    .portfolio-page .projects ul.row { margin-left: auto; margin-right: auto; width: 430px; }
    .portfolio-page .projects ul.row > li { margin-top: 60px; width: 430px; }
    .portfolio-page .projects ul.row > li:first-child { margin-top: 0; }
    .portfolio-page .recent-projects .projects ul.row > li { margin-top: 0; }
    .portfolio-page .project-description { margin-top: 60px; }
    /* services page */
    .services-page .services-list .row > * .service { margin-top: 30px; }
    .services-page .services-list .row > *:first-child .service { margin-top: 0; }
    .services-page .services-description { margin-top: 60px; }

    /* SIDEBAR */

    #sidebar { margin-top: 100px; }
    #sidebar .widget.images li,
    #sidebar .widget.images li.third,
    #sidebar .widget.images li.second { margin-right: 14px; }

    /* BOTTOM */

    #bottom { padding: 0 20px; }
    .bottom-inner { padding-bottom: 0; }
    #bottom .widget { margin-bottom: 60px; }
    #bottom .widget.images li,
    #bottom .widget.images li.second,
    #bottom .widget.images li.third,
    #bottom .widget.images li.fourth { margin: 0 10px 10px 0; width: 70px; }

    /* FOOTER */

    footer { padding: 0 20px; }

    /* SCREEN WIDTH */

    #screen-width,
    #screen-width span:before { content: "767"; }

    }

    /* ----------------------------------
        PHONE
    ---------------------------------- */

    @media (max-width: 480px) {

	.home-page .recent-projects h2.section-title {padding-right: 0; text-align: center;}
	.home-page .recent-articles h2.section-title {padding-right: 0; text-align: center;}

    /* COMPONENTS */

    /* list slider */
    .list-slider-items { width: 250px; }
    .list-slider-items > ul > li { width: 250px; }

    /* PAGE TYPES */

    /* about page */
    .about-page .team-member { width: 250px; }
    /* portfolio page */
    .portfolio-page .projects ul.row { width: 250px; }
    .portfolio-page .projects ul.row > li { width: 250px; }

    /* SCREEN WIDTH */

    #screen-width,
    #screen-width span:before { content: "480"; }

    }
    
/* -----------------------------------------------------------------------------

    14.) BITRIX24

----------------------------------------------------------------------------- */
    
    @media (min-width: 1200px) {
    #contact-form-cont .b24-form-btn-container {margin: 0 0 0 42px !important;}
    }
    @media (min-width: 980px) and (max-width: 1199px)  {
    #contact-form-cont .b24-form-btn-container {margin: 0 0 0 32px !important;}
    }
    @media (min-width: 768px) and (max-width: 979px) {
    #contact-form-cont .b24-form-btn-container {margin: 0 0 0 20px !important;}
    }
    @media (max-width: 767px) {
    #contact-form-cont .b24-form-btn-container {margin: 0 0 0 0 !important;}
    }
    
    #contact-form-cont .b24-form-control-container {
    margin-bottom: 15px !important;
    }
    #contact-form-cont .b24-form-wrapper {
    max-width: none!important;
    }
    #contact-form-cont .b24-form-content {
    padding: 0px !important;
    }
    .contact-page .contact-form .b24-form-field-agreement input {
    width: auto !important;
    display: inline !important;
    }
    .contact-page .contact-form .b24-form-field-agreement-link label>span {
    font-size: initial !important;
    color: #66737a !important;
    }
    #contact-form-cont .b24-form-padding-side {
    padding: 0px !important;
    }
    #contact-form-cont input.b24-form-control {
    font-size: 14px !important;
    margin: 0 !important;
    outline: medium none !important;
    padding: 8px 20px 8px 15px !important;
    }
    #contact-form-cont textarea.b24-form-control {
/*    border-bottom: 1px solid #a6a7a9 !important;
    border-radius: 0 !important;
    background: transparent !important;
    color: #4b4e53 !important;
    font-size: 14px !important;
*/  margin: 0 !important;
    outline: medium none !important;
    padding: 8px 20px 8px 15px !important;
    }
    #contact-form-cont .b24-form-control:focus+.b24-form-control-label, #contact-form-cont .b24-form-control-not-empty+.b24-form-control-label {
    display: none !important;
    }
    #contact-form-cont .b24-form-control:focus {
    border: none !important;
    border-bottom: 1px solid #3398db!important;	
    }
    #contact-form-cont .b24-form-control-label {
    padding: 0 0 0 15px !important;
    font-size: 17px !important;
    }
    #contact-form-cont .b24-form-control-alert.b24-form-control-string .b24-form-control, #contact-form-cont .b24-form-control-alert.b24-form-control-text .b24-form-control {
    border: none !important;
    border-bottom: 1px solid red !important;
    margin-bottom: 0px !important;
    }
    #contact-form-cont .b24-form-field.b24-form-field-name.b24-form-control-string.b24-form-control-alert, #contact-form-cont .b24-form-field.b24-form-field-email.b24-form-control-string.b24-form-control-alert, #contact-form-cont .b24-form-field.b24-form-field-phone.b24-form-control-string.b24-form-control-alert, #contact-form-cont .b24-form-field.b24-form-field-text.b24-form-control-text.b24-form-control-alert {
    margin-bottom: 0px !important;
    }
    /*#contact-form-cont .b24-form-control-string .b24-form-control-label, #contact-form-cont .b24-form-control-text .b24-form-control-label {
    padding-left: 0 !important;
    }*/
    .b24-form-sign {
    display: none !important;
    }
    #contact-form-cont .b24-form-recaptcha {
    justify-content: flex-start !important;
    margin: 10px 0px 20px 0px !important;
    }
    .grecaptcha-badge {
    box-shadow: none !important;
    }
    #contact-form-cont .b24-form-state-container .b24-form-success {
    border-radius: none !important;
    }
    #contact-form-cont .b24-form-field {
    margin-bottom: 0px !important;
    }
    #contact-form-cont .b24-form-field-agreement{
    margin-top: 15px !important;
    }
    .b24-form-control-alert-message, .b24-form-header-padding {
    display: none !important;
    }
    #contact-form-cont button.b24-form-btn {
    box-shadow: none;
    border-radius: 0;
    margin: 10px 0px 5px 0px;
    }
    #contact-form-cont .b24-form-btn-block {
    padding: 0px !important;
    }