*,
*:after,
*:before    {  -webkit-font-smoothing:antialiased; font-smoothing:antialiased; -moz-osx-font-smoothing:grayscale; text-rendering:optimizeLegibility;}
html        { font-family:sans-serif; -webkit-text-size-adjust:100%; -ms-text-size-adjust:100%; -webkit-tap-highlight-color:rgba(0, 0, 0, 0);}
img         { max-width: 100%;}
.project-carousel{ display: none;}

/* header */
.slider-mobile,
#nav-main-mobile,
.touch #audio-player{ display: none;}

.press-wrap .press-item:nth-child(2n-1){ clear: left;}

.logo-mobile{ display: none;}
.logo-desktop{ display: block;}

#b-mobile                   { display: none; position: absolute; top: 13px; right: 20px; width: 50px; height: 50px; cursor: pointer; }
#b-mobile span              { position: absolute; left: 5px; width: 40px; height: 9px; display: block; background-color: #858a8d; -webkit-border-radius: 4px; border-radius: 4px;
-webkit-transition: all 0.2s ease;
-moz-transition: all 0.2s ease;
-ms-transition: all 0.2s ease;
-o-transition: all 0.2s ease;
transition: all 0.2s ease;}
#b-mobile .row-1            { top: 7px;}
#b-mobile .row-2            { top: 20px;}
#b-mobile .row-3            { top: 34px;}
#b-mobile.active .row-1     { background-color: #a64387;}
#b-mobile.active .row-2     { background-color: #ee5811;}
#b-mobile.active .row-3     { background-color: #dddd2a;}


#menu-home-mobile-big           { width: 500px; max-width: none; margin: 0 auto 20px; display: none;}
#menu-home-mobile-small         { width: 287px; max-width: none; margin: 0 auto 20px; display: none;}
#menu-mobile-home-horizontal    { width: 575px; max-width: none; margin: 0 auto 20px; display: none;}

#nav-main-mobile                { display: none; margin-bottom: 20px;}
#nav-main-mobile li             { margin-bottom: 10px;}
#nav-main-mobile a              { display: inline-block; height: 45px; background: url(images/menu-mobile-txt.png) no-repeat;}
#nav-main-mobile .b-about-us    { width: 308px; background-position: 0 0;}
#nav-main-mobile .b-clients     { width: 250px; background-position: 0 -60px;}
#nav-main-mobile .b-our-work    { width: 332px; background-position: 0 -130px;}
#nav-main-mobile .b-services    { width: 290px; background-position: 0 -192px;}
#nav-main-mobile .b-press       { width: 195px; background-position: 0 -256px;}
#nav-main-mobile .b-contact     { width: 375px; background-position: 0 -320px; margin:0;}

.page-template-page-about-us-php #nav-main-mobile .b-about-us,
.single-about-us #nav-main-mobile .b-about-us,
.page-id-1215 #nav-main-mobile .b-about-us                          { background-position: -405px 0;}
.page-template-page-clients-php #nav-main-mobile .b-clients         { background-position: -405px -60px;}
.page-template-page-our-work-php #nav-main-mobile .b-our-work,
.single-our-work #nav-main-mobile .b-our-work,
.page-template-page-otherprojects-php #nav-main-mobile .b-our-work  { background-position: -405px -130px;}
.page-template-page-services-php #nav-main-mobile .b-services,
.single-services #nav-main-mobile .b-services                       { background-position: -405px -192px;}
.page-template-page-press-php #nav-main-mobile .b-press,
.post-type-archive-press #nav-main-mobile .b-press                  { background-position: -405px -256px;}
.page-template-page-contact #nav-main-mobile .b-contact,
.post-type-archive-press #nav-main-mobile .b-contact                  { background-position: -405px -320px;}

/* top-nav */
.top-nav                    { color:#A9A9A9; margin:0 0 15px;}
.top-nav li                 { float:left;}
.top-nav a:before           { content:'+ ';}
.top-nav a.active           { color:#313131;}
.top-nav a.active:before    { content:'';}
.top-nav .separator         { padding:0 10px;}

/* footer */
#colophon .v-fb             { display: none;}

/* our-work */
#other-projects-mobile{ display: none;}
.project-carousel-wrap .slidesjs-pagination                     { z-index:50; position:absolute; bottom:50px; right:20px;}
.project-carousel-wrap .slidesjs-pagination li                  { float:left; margin-bottom: 2px;}
.project-carousel-wrap .slidesjs-pagination a                   { display:block; text-align:center; background-repeat:no-repeat; background-position:left top; height:17px; line-height:1.4;}
.project-carousel-wrap .slidesjs-pagination a.active            { color:#fff; background-position:left bottom;}
.project-carousel-wrap .slidesjs-pagination .item-1 a           { background-image:url(images/slider-pagination-1.png); width:34px;}
.project-carousel-wrap .slidesjs-pagination .item-2 a           { background-image:url(images/slider-pagination-2.png); width:34px; margin:0 2px 0 0;}
.project-carousel-wrap .slidesjs-pagination .item-3 a           { background-image:url(images/slider-pagination-3.png); width:33px;}
.project-carousel-wrap .slidesjs-pagination .item-4 a           { background-image:url(images/slider-pagination-4.png); width:34px; margin:0 2px 0 0;}

.project-carousel-wrap .project-carousel        { height: 318px; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; }
.project-carousel-wrap .slidesjs-container,
.project-carousel-wrap .slidesjs-control,
.project-carousel-wrap .carousel-item           { height: 100% !important;}
.project-carousel-wrap .carousel-item a         { height: 100%; width: 100%; -webkit-border-radius: 5px; border-radius: 5px; overflow: hidden; background: no-repeat center center; background-size: cover;}
.project-carousel-wrap .carousel-item .item-mobile{ display: none; height: 100%; width: 100%; -webkit-border-radius: 5px; border-radius: 5px; overflow: hidden; background: no-repeat center center; background-size: cover;}

.our-work-content-wrap .other-clients-wrap     { width: 260px;}
.our-work-content-wrap .other-clients-wrap a   { white-space: nowrap;}


/* services */
.services-gallery                   { margin: 0 -5px;}
.services-gallery a                 { float:left; display:block; margin:0; padding: 0 1% 1%; width:25%; -moz-box-sizing:border-box; -webkit-box-sizing:border-box; box-sizing:border-box;}
.services-gallery .services-border  { display:none;}
.services-gallery img               { width: 100%; overflow: hidden; -webkit-border-radius: 3px; border-radius: 3px;}

/* press */
#year-select-mobile,
#clients-select-mobile{ display: none;}


/* queries */
@media only screen and (max-width:1040px) {

    /* header */
    .logo-mobile{ display: block;}
    .logo-desktop{ display: none;}
    #branding           { width: 100%; padding: 20px 20px 0; height: auto; -moz-box-sizing:border-box; -webkit-box-sizing:border-box; box-sizing:border-box;}
    #page #site-title   { margin-bottom: 40px;}
    #page #site-title a { position: relative; top: auto; left: auto; width: 375px; height: auto; max-width: 100%; background: url(images/logo-mobile.png) no-repeat 0 0; background-size: contain;}
    #nav-main,
    #main-menu-map,
    #main-menu-links,
    #nav-top      { display: none;}
    #nav-main-mobile.visible    { display: block;}
    /*.home #nav-main-mobile    { display: none;}*/
    #site-title{ padding-right: 80px;}
    #b-mobile{ display: block;}

    /* top-nav */
    .top-nav                    { font-size: 16px;}
    .top-nav li                 { float:none;}
    .top-nav .separator         { display: none;}

    /* footer */
    #colophon                   { width: auto; padding:10px 10px 0; height: auto; text-align: center; font-size: 14px;}
    #colophon .footer-copy      { position: relative; top: auto; right: auto; text-align: center; margin-bottom: 10px;}
    #colophon .link-disci       { position: relative; top: auto; right: auto;}
    #colophon .link-disci img   { display: block; margin:0 auto;}
    #menu-footer                { width: 100%; text-align: center; margin-bottom: 10px;}
    #colophon .widget-area li   { float: none; display: inline-block;}
    #colophon .v-fb             { display: inline-block; margin: 0 0 15px; font-size: 16px; height: 36px; padding: 8px 0 0 42px; background: url(images/fb-mobile.png) no-repeat 0 0; -moz-box-sizing:border-box; -webkit-box-sizing:border-box; box-sizing:border-box;}
    #nav_menu-3                 { display: none;}

    /* main */
    #main{ width: 100%; padding: 0 20px; -moz-box-sizing:border-box; -webkit-box-sizing:border-box; box-sizing:border-box;}

    /* home */
    .home #main                 { padding: 0; margin: 0 0 20px; width: 100% !important;}
    .slider-mobile              { display: block; overflow-y: hidden; overflow-x: scroll; width: 100%;}
    .slider-shadow,
    #slider-nav                 { display: none;}
    .slider-mobile-element      { width:4863px; height: 407px; background:url(images/element.jpg) no-repeat 0 0;}

    /* about-us */
    .single-about-us .thumb-wrap .thumb-col     { float: none; width: auto; text-align: center;}
    .single-about-us .thumb-wrap .article-wrap  { float: none; width: 100%;}
    .awards-intro{ padding: 0;}

    /* services */
    .services-image-wrap,
    #map_primaryservices                            { display: none;}
    #main .primary-services-wrap .links-list        { height: auto; font-size: 16px;}
    #main .primary-services-wrap .links-list li     { position: relative; top: 0; left: auto;}
    .services-content-wrap .article-wrap            { width: 60%;}
    .services-content-wrap .other-services-wrap     { width: 35%;}

    /* press */
    .press-wrap                     { width: 720px; margin: 0 auto;}
    .press-wrap .press-list-wrap,
    .press-wrap .press-archives     { width: 340px;}

    /* contact */
    .content-contact{ width: 100%; background-position: right top; background-size:contain;}
    .page-template-page-contact-php #main{ padding: 0;}
    .content-contact .contact-address{position: relative;color:#000; width:100%; text-align: center; margin: 20px;}
    .content-contact-container .adress-container  { position:relative; top: 0; right: 0; width: 200px; text-align: center; color: #000; margin: 0 auto;}
    .content-contact-container .contact-email     { position: relative; right: 0;}
    /* our-work */
    #other-projects-mobile{ display: block;}
    #our-work-carousel-container{ display: none;}
    .our-work-content-wrap .article-wrap        { float: none; width: 100%;}
    .our-work-content-wrap .other-clients-wrap  { float: none; padding: 0; margin: 0 auto;}
    .project-carousel-wrap{ background: transparent;}
    #other-projects-mobile select{ background: #fff; border: 1px solid #ebebeb; padding: 5px 10px; max-width: 100%;}

    #other-projects-wrap{ overflow-y: hidden; overflow-x: scroll;}
    #other-projects-wrap img{ max-width: none;}

    .flow-wrap .flow-description{ padding: 0;}
    .flow-wrap .flow-links .link-1,
    .flow-wrap .flow-links .link-2{ margin-bottom: 20px;}
    .flow-wrap .flow-links .link-3{ float: left; position: relative; bottom: auto; right: auto; padding-right: 50px;}

}

@media only screen and (min-width:768px) and (max-width:1040px) {

    /* about-us */
    .event-container                    { width: 720px; margin: 0 auto;}
    .event-container .col-right-event   { width: 420px;}
    .awards-wrap                        { width: 720px; margin: 0 auto 30px;}
    .awards-wrap .awards-right          { width: 420px;}

    /* clients */
    .clients-content-wrap                       { width: 100%;}
    .clients-content-wrap .article-wrap         { float: none; width: 100%;}
    .clients-content-wrap .clients-col          { width: 30%; margin-right: 3%;}
    .clients-content-wrap .our-clients-wrap     { float: none; width: 100%;}

}

@media only screen and (max-width:1040px) and (orientation: landscape){

    /* header */
    .home #menu-mobile-home-horizontal{ display: block;}


}

@media only screen and (min-width:540px) and (max-width:1040px) and (orientation: portrait){

    /* header */
    .home #menu-home-mobile-big{ display: block;}

}

 
@media only screen and (max-width:767px) {

    /* header */
    #nav-top{ top: 90px;}

    #content{ font-size: 14px;}

    /* about-us */
    .ul-two-col{ width: 50%;}

    .event-container .col-left-event    { display: none;}
    .event-container .col-right-event   { float: none; width: 100%;}

    .awards-wrap                        { width: 100%;}
    .awards-wrap .awards-left           { float: none; width: 100%;}
    .awards-wrap .awards-left img       { margin: 0 auto;}
    .awards-wrap .awards-right          { float: none; width: 100%;}

    /* services */
    .services-content-wrap .article-wrap,
    .services-content-wrap .other-services-wrap{ float: left; width: 100%;}

    /* press */
    .press-wrap                     { width: 340px;}
    .press-wrap .press-list-wrap    { margin-bottom: 30px;}
    .press-wrap .press-list-wrap,
    .press-wrap .press-archives     { float: none; width: 100%;}

    /* our-work */
    .project-carousel-wrap .slidesjs-pagination     { padding: 0 0 0 20px; /*padding: 10px 0 0; position:relative; bottom: auto; right: auto;*/}
    .project-carousel-wrap .b-ribbon                    { width: 90px; height: 90px; background-size: contain;}
    .project-carousel-wrap .b-fullscreen                { display: none;}
    .project-carousel-wrap .project-carousel            { overflow: visible !important;}
    .project-carousel-wrap .carousel-item a             { display: none;}
    .project-carousel-wrap .carousel-item .item-mobile  { display: block;}


    /* error-404 */
    .error-404-msg{ width: 460px; height: 150px; background-size: contain;}
    .error-404-msg .set-btn{ bottom: 30px;}

    /* colorbox info */
    .colorbox-info{ width: 460px;}

    /* press */
    .press-wrap{ font-size: 14px;}
    .year-select-desktop,
    .clients-select-desktop{ display: none;}
    #year-select-mobile,
    #clients-select-mobile          { display: block;}
    #year-select-mobile select,
    #clients-select-mobile select   { background: #fff; border: 1px solid #ebebeb; padding: 5px 10px; max-width: 100%;}

    /* footer */
    #colophon #nav_menu-3       { display: none;}
    #colophon #menu-footer,
    #colophon #menu-footer li   { display: block; margin: 0;}
    /*#colophon .v-fb             { display: inline-block; margin: 0 0 15px -15px; background-position: 0 5px;}*/



}

@media only screen and (min-width:480px) and (max-width:767px) {

    /* clients */
    .clients-content-wrap .article-wrap         { float: left; width: 49%;}
    .clients-content-wrap .our-clients-wrap     { float: right; width: 49%;}

}


@media only screen and (max-width:539px) and (orientation: portrait){

    /* header */
    .home #menu-home-mobile-small{ display: block;}

}

@media only screen and (max-width:479px) {


    /* about-us */
    .ul-two-col{ float: none; width: 100%; margin: 0;}

    /* clients */
    .clients-content-wrap .article-wrap,
    .clients-content-wrap .our-clients-wrap     { float: none; width: 100%;}

    /* press */
    .press-wrap,
    .press-wrap .press-item         { width: 100%;}
    .press-wrap .press-item img     { height: auto !important;}

    /* our-work */
    .project-carousel-wrap .b-ribbon{ width: 60px; height: 60px;}
    .project-carousel-wrap .b-fullscreen{ width: 90px; background-size: contain;}

    /* error-404 */
    .error-404-msg{ width: 320px; height: 100px;}
    .error-404-msg .set-btn{ bottom: 20px;}

    /* colorbox info */
    .colorbox-info{ width: 320px;}
}

/* services */
@media only screen and (max-width:960px) {
    .services-gallery a{ width: 33.3%;}
}
@media only screen and (max-width:768px) {
    .services-gallery a{ width: 25%;}
}
@media only screen and (max-width:768px) {
    .services-gallery a{ width: 33.3%;}
}
@media only screen and (max-width:500px) {
    .services-gallery a{ width: 50%;}
}

/* menu */
@media only screen and (max-width:400px) {
    #nav-main-mobile a              { display: inline-block; height: 27px; background: url(images/menu-mobile-txt-small.png) no-repeat;}
    #nav-main-mobile .b-about-us    { width: 184px; background-position: 0 -1px;}
    #nav-main-mobile .b-clients     { width: 149px; background-position: 0 -36px;}
    #nav-main-mobile .b-our-work    { width: 200px; background-position: 0 -78px;}
    #nav-main-mobile .b-services    { width: 174px; background-position: 0 -115px;}
    #nav-main-mobile .b-press       { width: 116px; background-position: 0 -153px;}
    #nav-main-mobile .b-contact     { width: 116px; background-position: 0 -191px; width: 220px;}

    .page-template-page-about-us-php #nav-main-mobile .b-about-us,
    .single-about-us #nav-main-mobile .b-about-us,
    .page-id-1215 #nav-main-mobile .b-about-us                          { background-position: -242px 0;}
    .page-template-page-clients-php #nav-main-mobile .b-clients         { background-position: -242px -36px;}
    .page-template-page-our-work-php #nav-main-mobile .b-our-work,
    .single-our-work #nav-main-mobile .b-our-work,
    .page-template-page-otherprojects-php #nav-main-mobile .b-our-work  { background-position: -242px -78px;}
    .page-template-page-services-php #nav-main-mobile .b-services,
    .single-services #nav-main-mobile .b-services                       { background-position: -242px -115px;}
    .page-template-page-press-php #nav-main-mobile .b-press,
    .post-type-archive-press #nav-main-mobile .b-press                  { background-position: -242px -154px;}
    .page-template-page-contact #nav-main-mobile .b-contact,
    .post-type-archive-press #nav-main-mobile .b-contact                  { background-position: -242px -191px;}
}