/* 
    Document   : site
    Created on : 2012.10.14., 14:27:23
    Author     : szasza
    Description:
        Purpose of the stylesheet follows.
*/
/*html { overflow: hidden; height: 100%; }
body { overflow: auto; height: 100%; }*/
root { 
    display: block;
}

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

}

@font-face {
    font-family: 'Conv_DINPro-Bold';
    src: url('../font/DINPro-Bold.eot');
    src: local('☺'), url('../font/DINPro-Bold.ttf') format('truetype'), url('../font/DINPro-Bold.svg') format('svg');
    font-weight: normal;
    font-style: normal;
}


@font-face {
    font-family: 'Conv_DINPro-Light';
    src: url('../font/DINPro-Light.eot');
    src: local('☺'), url('../font/DINPro-Light.ttf') format('truetype'), url('../font/DINPro-Light.svg') format('svg');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'Conv_DINPro-Medium';
    src: url('../font/DINPro-Medium.eot');
    src: local('☺'), url('../font/DINPro-Medium.ttf') format('truetype'), url('../font/DINPro-Medium.svg') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'Conv_DINPro-Regular';
    src: url('../font/DINPro-Regular.eot');
    src: local('☺'), url('../font/DINPro-Regular.ttf') format('truetype'), url('../font/DINPro-Regular.svg') format('svg');
    font-weight: normal;
    font-style: normal;
}

body {
    background: white;
}

section.header {
    /*    height: 60px;
	position: fixed;
	top: 0;
	left: 0;
	right: 0;*/
    height: 60px;
    top: 0;
    left: 0;
    right: 0;
    position: absolute;
    z-index: 1000;
}

section.header .bg{
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: url(../img/header-bg.png) no-repeat center top;
    display:none;
}

.page:first-child {
    padding-top: 60px;
}

.content-container {
    width: 960px;
    margin: 0 auto;
    position:relative;
}
.the-guidency-logo {
    margin-top: 5px;
}
.the-guidency-logo a {
    width: 215px;
    height:50px;
    background: url(../img/the-guidency-logo.png);
    display:block;
}
.the-guidency-logo a span {
    color: #0e2c69;
    background-color: white;
    padding: 3px;
}
#page-about-us {
    position:relative;
    /*overflow: hidden;*/
}
#page-about-us-bg {
    /*background: url(../img/header-bg-2.png) no-repeat center top;*/
    background: url(../img/header-bg-2.jpg) no-repeat center top;
    width: 100%;
    /*height:616px;*/
    height:751px;
    top: 0px;
    position:absolute;
}
/*#page-about-us-child {
    background: url(../img/about-us-child.png) no-repeat center top;
    width: 343px;
    height:565px;
    top: 0px;
    left: 655px;
    left: 632px;
    position:absolute;
}*/
/*#page-about-us-birds {
    background: url(../img/about-us-birds.png) no-repeat center top;
    width: 102px;
    height:500px;
    top: 0px;
    left: 892px;
    position:absolute;
}*/
/*#page-about-us .balloons{
    width: 870px;
    position:absolute;
    height: 500px;
    top: 100px;
    left: -160px;
    background: url(../img/balloons.png) no-repeat;
}*/
#page-about-us h1 {
    font-family: Conv_DINPro-Light;
    font-size: 42px;
    border-bottom: solid 1px #aeaeae;
    letter-spacing: -3px;
    margin-bottom: 10px;
}
#page-about-us .content {
    padding-bottom: 40px;

}
#page-about-us .content .content-bg {
    background: url(../img/about-us-content-bg.png) no-repeat center top;
    height: 276px;
    position:absolute;
    width: 100%;
}
#page-about-us p {
    color: #666666;
    font-size: 16px;
    font-family: Georgia;
    font-style: italic;
    margin: 0;
}
#page-about-us .content .video{
    float: left;
    margin-right: 50px;
    top: -45px;
    position: relative;
}
#page-about-us .content .video iframe{
    border: solid 5px white;
}
#page-about-us .header{
    height:475px;
    /*background: rgba(0,0,0,0.1);*/
}
/*#page-about-us .circles {
    position: absolute;
    width: 695px;
    height: 1000px;
    background: url(../img/circles-2.png);
    background-repeat: no-repeat;
}*/
/*#page-about-us .circle {
    color: white;
    font-size: 37px;
    top:134px;
    position:absolute;
}*/
/*#page-about-us .circle .line-1 {
    color: white;
    font-family: Conv_DINPro-Bold;
}
#page-about-us .circle .line-2 {
    color: white;
    font-family: Conv_DINPro-Regular;
    line-height: 40px;
    margin-top: -6px;

}
#page-about-us .circle-1 {
    left: -7px;
    text-align: right;
}
#page-about-us .circle-2 {
    left: 414px;
    text-align: left;
}*/
.header nav ul {
    position: absolute;
    right: 30px;
    top: 3px;
    margin: 0;
    padding: 0;
    margin-top: 10px;
}
.header nav ul li {
    float: left;
}

.header nav ul li a {
    display:block;
    color: white;
    text-decoration: none;
    font-family: Conv_DINPro-Regular;
    font-size: 16px;
    text-transform: uppercase;
    padding: 4px 20px;
    border-right: solid 1px #556a94;
}
.header nav ul li a:hover {
    background: rgba(0,0,0,0.3);
}
.header nav ul li:last-child a {
    border-right: none;
}

.frame {
    border: solid 5px white;
}
.lifted-45 {
    margin-top: -45px;
}
div.img-shadow-400 {
    background: url(../img/img-shadow-400.png) no-repeat;
    width: 493px;
    height: 200px;
    left: -35px;
    position: absolute;
    margin-top: 99px;
}
.clear {
    clear: both;
}


#page-projects {
    height: 767px;
    /*background: url(../img/projects-bg.png) center top no-repeat;*/
    background: url(../img/projects-bg.jpg) center top no-repeat;
    overflow: hidden;
    position:relative;
}
#page-projects .content-container {
    /*height: 768px;*/
}
#page-projects .blur-1 {
    width: 1526px;
    height: 1000px;
    top: -200px;
    left: -230px;
    position: absolute;
    background: url(../img/blur-1.png) no-repeat 0px 0px;
}
#page-projects .blur-2 {
    width: 1510px;
    height: 1000px;
    /*top: 196px;*/
    left: -210px;
    top: -200px;
    position: absolute;
    background: url(../img/blur-2.png) no-repeat 0px 0px;
}
#page-projects h1 {
    font-family: Conv_DINPro-Regular;
    font-size: 42px;
    color: white;
    text-transform: uppercase;
    border-bottom: solid 1px gray;
    padding-top: 70px;
    position:relative;
    font-weight: normal;
}
#page-projects .category-pager{
    position:absolute;
    bottom: 8px;
    right: 0;
}
#page-projects .category-pager .text{
    font-size: 16px;
    color: #aeaeae;
    float: left;
    font-family: Conv_DINPro-Regular;
    padding-top: 3px;
    padding-right: 10px;
}
#page-projects .category-pager-inner{
    float: left;
    background-color: #2c2c2c;
    height: 28px;
}

#page-projects .category-pager .btn{
    /*font-family: Conv_DINPro-Light;*/
    /*font-size: 40px;*/
    /*color: white;*/
    /*text-decoration: none;*/
    float: left;
    /*color: #AEAEAE;*/
    /*font-weight: normal;*/
    margin-top: 7px;
    width: 11px;
    height: 15px;
    display: inline-block;
}
#page-projects .category-pager .btn.left{
    background: url(../img/left-small.png) no-repeat;
    margin-left: 10px;
}
#page-projects .category-pager .btn.right{
    background: url(../img/right-small.png) no-repeat;
    margin-right: 10px;
}
#page-projects .category-pager .category-name-container{
    float: left;
}
#page-projects .category-pager .category-name-container p{
    display:none;
    padding-top: 5px;
    margin: 0;
    font-size: 14px;
    padding-left: 10px;
    padding-right: 10px;
    color: #F15A24;
    width: 100px;
    text-align: center;
}
/*
#page-projects .category-container {
    height: 500px;
    width: 100%;
    position:absolute;
    overflow:hidden;
}
#page-projects .category-container .category{
    display:none;
    width: 960px;
    height: 300px;
}
#page-projects .category-container .category .category-page{
    width: 960px;
    height: 500px;
    background: rgba(255,255,255,0.1);
    display:none;
    position:absolute;
}*/
/*


#page-projects .opened-category {
    height: 500px;
    width: 100%;
    display:none;
    position:absolute;
    overflow:hidden;
}

#page-projects .opened-category .opened-category-item {
    display:none;
    width: 960px;
    height: 300px;
}
#page-projects .opened-category .prev {
    position: absolute;
    top: 214px;
    left: -69px;
    font-size: 162px;
    text-decoration: none;
    width:48px;
    height:67px;
    background: url(../img/page-projects-category-left.png);
}
#page-projects .opened-category .next {
    position: absolute;
    top: 214px;
    right: -69px;
    font-size: 162px;
    text-decoration: none;
    width:48px;
    height:67px;
    background: url(../img/page-projects-category-right.png);
}*/
/*



#page-projects .category-page-item {
    width: 190px;
    height: 165px;
    background: rgba(255,255,255, 0.1);
    float: left;
    margin: 0 2px 2px 0;
}
.category-page-item.last {
    margin-right: 0;
}
#page-projects .category .prev {
    position: absolute;
    top: 214px;
    left: -69px;
    font-size: 162px;
    text-decoration: none;
    width:48px;
    height:67px;
    background: url(../img/page-projects-category-left.png);
}
#page-projects .category .next {
    position: absolute;
    top: 214px;
    right: -69px;
    font-size: 162px;
    text-decoration: none;
    width:48px;
    height:67px;
    background: url(../img/page-projects-category-right.png);
}*/

#page-we-offer {
    /*background: url(../img/we-offer-bg.png) no-repeat center top;*/
    background: url(../img/we-offer-bg.jpg) no-repeat center top;
}
#page-we-offer .content-container{
    height: 770px;
}

#page-we-offer h1 {
    font-size: 42px;
    font-family:  Conv_DINPro-Light;
    text-transform: uppercase;
    text-align: center;
    padding-top: 61px;
    margin: 0;
}

#page-we-offer h1 span {
    font-size: 42px;
    font-family:  Conv_DINPro-Bold;
}
#page-we-offer ul{
    font-family: georgia;
    position: absolute;
    font-size: 29px;
    list-style-type: none;
}
#page-we-offer ul span{
    font-style: italic;
    font-size: 16px;
    color: black;
}
#page-we-offer ul li{
    padding: 0 0 22px 0;
    line-height: 13px;
}
#page-we-offer ul.design {
    width: 215px;
    top: 384px;
    left: 112px;
    color: #e84136;
}

#page-we-offer ul.marketing {
    width: 350px;
    top: 286px;
    left: 414px;
    color: #90C500;
}

#page-we-offer ul.pr {
    width: 300px;
    top: 496px;
    left: 506px;
    color: #05A0D6;
}


#page-contacts {
    background: url(../img/contact-us-bg.jpg) no-repeat center -1px;
    top: 0;
    position: relative;
    height: 875px;
}
#page-contacts .content-container{
    /*height: 571px;*/
}

#page-contacts h1 {
    font-size: 42px;
    font-family:  Conv_DINPro-Light;
    text-transform: uppercase;
    text-align: center;
    padding-top: 25px;
    margin: 0;
    letter-spacing: -3px;
}

#page-contacts .left {
    position: absolute;
    top: 410px;
    left: 145px;
    width: 263px;
    height: 152px;
}
#page-contacts .left p {
    font-family: verdana;
    font-size: 14px;
    text-align: center;
    margin: 11px 0;
}
#page-contacts .left a {
    color: #B56491;
    text-transform: uppercase;
}
#page-contacts .left hr {
    border-top: solid 1px #B56491;
    margin: 0 32px;
}
#page-contacts .right {
    position: absolute;
    top: 348px;
    left: 440px;
    width: 438px;
    height: 245px;

}
#page-contacts form {
    position: relative;
}
#page-contacts .contacts-us-header {
    background: url(../img/contact-us-header.png) no-repeat center top;
    height: 112px;
    top: 0;
    position: absolute;
    z-index: 10000;
    width: 100%;
}

#page-contacts div.contact-response-message {
    width: 438px;
    background: rgba(255, 255, 255, 0.4);
    height: 50px;
    position: absolute;
    display:none;
    vertical-align: middle;
    text-align: center;
    padding-top: 28px;
    color: white;
    background: rgba(0, 0, 0, 0.5);
}

#page-contacts .right input[type=text], #page-contacts .right input[type=email] {
    display: block;
    margin: 20px;
    width: 385px;
    padding: 5px;
    margin-bottom: 0;
    background: transparent;
    border: solid 1px #404040;
    text-align: center;
    font-size: 10px;
    text-transform: uppercase;
    font-size: 10px;
    font-family: verdana;
    color: white;
}
#page-contacts .right textarea {
    display: block;
    border: solid 1px #404040;
    background: transparent;
    margin: 20px;
    margin-bottom: 0;
    width: 390px;
    height: 113px;
    text-align: center;
    font-size: 10px;
    text-transform: uppercase;
    font-size: 10px;
    font-family: verdana;
    color: white;
}
#page-contacts .right input[type=submit] {
    position: absolute;
    left: 175px;
    bottom: -23px;
    background: #8C1F5D;
    border: none;
    font-size: 24px;
    font-family: Conv_DINPro-Light;
    text-transform: uppercase;
    color: white;
    padding: 1px 10px;
    z-index: 1001;
}


div.back {
    text-align: center;
    margin-top: 40px;
}
div.back a {
    background: url(../img/back.png) no-repeat 5px 8px #9E005D;
    color: white;
    font-family: Conv_DINPro-Regular;
    font-size: 18px;
    padding: 3px 8px 3px 24px;
    text-transform: uppercase;
    text-decoration: none;
}
.balloon-1 {
    width: 183px;
    height: 812px;
    background: url(../img/balloon-1.png) no-repeat 0px 650px;
    position: absolute;
    top: 0px;
    margin-left: -165px;
    top: -812px;
}
.balloon-2 {
    width: 249px;
    height: 812px;
    background: url(../img/balloon-2.png) no-repeat;
    position: absolute;
    top: -812px;
    left: 907px;
}
.balloon-3 {
    width: 200px;
    height: 576px;
    background: url(../img/balloon-3.png) no-repeat;
    position: absolute;
    top: -812px;
    left:545px;
}
.page-contacts-header {
    width:100%;
    height: 108px;
    /*background: url(../img/contact-us-header.png) no-repeat center 100px;*/
    background: url(../img/contact-us-header.png) no-repeat center top;
    position: absolute;
}

/**************************************/
.category-container {
    height: 500px;
    overflow: hidden;
    position:relative;
    width: 100%;
}
.category-container .category{
    width: 960px;
    height: 500px;
}
.category-container .category .page{
    padding: 0;
}
.category-container .category .prev, .project-content .prev {
    position: absolute;
    top: 214px;
    left: -69px;
    font-size: 162px;
    text-decoration: none;
    width:48px;
    height:67px;
    background: url(../img/page-projects-category-left.png);
}
.category-container .category .next, .project-content .next {
    position: absolute;
    top: 214px;
    right: -69px;
    font-size: 162px;
    text-decoration: none;
    width:48px;
    height:67px;
    background: url(../img/page-projects-category-right.png);
}
.category-container .category .item {
    width: 190px;
    height: 165px;
    background: rgba(255,255,255, 0.1);
    float: left;
    margin: 0 2px 2px 0;

}

.category-container .category .item.last {
    margin-right: 0;
}
.project-content {
    width: 960px;
    height: 500px;
    position:absolute;
}


.project-content .content-images-container {
    width: 485px;
    height: 486px;
    overflow: hidden;
}

.project-content .images-outer-container {
    width: 485px;
    height: 486px;
    border: solid 2px #263630;
    padding: 4px;
    float: left;
}
.project-content .video-outer-container {
    width: 485px;
    border: solid 2px #263630;
    padding: 4px;
    float: left;
}
.project-content .content-container{
    width: 450px;
    /*    height: 400px;*/
    float: left;
    /*background: rgba(255, 255, 255, 0.2);*/
    margin-left: 10px;
}
.project-content .content-container p{
    margin: 0;
}
.project-content .content-container > div{
    margin-left: 20px;
    margin-bottom: 10px;
}
.project-content .content-container hr{
    border: none;
    border-top: solid 1px #454545;
}
.project-content .content-container .header .client{
    font-family: verdana;
    font-size: 10px;
    color: #808080;
    text-transform: uppercase;

}
#page-projects .project-content .content-container .header h1{
    font-family: georgia;
    font-size: 22px;
    color: #E5E5E5;
    font-style: italic;
    text-decoration: none;
    border: none;
    text-transform: none;
    padding:0;
}
#page-projects .project-content .content-container .content{
    font-family: verdana;
    font-size: 12px;
    color: #B2B2B2;
    line-height: 180%;
    max-height: 215px;
    overflow: auto;
}
#page-projects .project-content .content-container .footer{
    width: 430px;
    margin-bottom: 26px;
}
#page-projects .project-content .content-container .footer, #page-projects .project-content .content-container .footer a{
    font-family: verdana;
    font-size: 10px;
    text-transform: uppercase;
    color: #808080;
    text-decoration: none;
    color: gray;
}
#page-projects .project-content .content-container .footer a{

    color: #B2B2B2;

}
#page-projects .project-content .content-container .footer a:hover {
    color: #ddd;
}
#page-projects .project-content .content-container .footer a.button{
    width: 20px;
    height: 20px;
    display: inline-block;
    top: 6px;
    position: relative;
    margin: 0 0 0 10px;
}
#page-projects .project-content .content-container .footer a.button:first-child{
    margin-left: 30px;
}

#page-projects .project-content .content-container .footer a.button.facebook{
    background: url(../img/icon/facebook.png) no-repeat;
}
#page-projects .project-content .content-container .footer a.button.google{
    background: url(../img/icon/google.png) no-repeat;
}
#page-projects .project-content .content-container .footer a.button.twitter{
    background: url(../img/icon/twitter.png) no-repeat;
}
#page-projects .project-content .content-container .footer a.button.linkedin{
    background: url(../img/icon/linkedin.png) no-repeat;
}
.pager-container {
    width: 100%;
    text-align: center;
}
.pager-container > div {
    background: url(../img/indicator.png) no-repeat center top;
    width: 15px;
    height: 15px;
    display: inline-block;
    margin: 18px 4px;
}
.pager-container > div.current {
    background: url(../img/indicator.png) no-repeat center bottom;
}

.list-item-hover-content {
    position:absolute;
    width: 190px;
    height: 165px;
    display: table;
    vertical-align: middle;
    text-align: center;
}
.list-item-hover-content .cell {
    display: table-cell;
    vertical-align: middle;
    text-align: center;
}
.list-item-hover-content .line-1 {
    font-size: 14px;
    font-family: Verdana;
    color: white;
}
.list-item-hover-content .line-2 {
    font-size: 10px;
    font-family: Verdana;
    color: white;
}

.placeholder
{
    color: #aaa;
}
footer, footer a {
    color: #808080;
    font-family: Conv_DINPro-Regular;
    font-size: 13px;
    padding: 3px 8px 15px 24px;
    text-transform: uppercase;
    text-align: center;
    text-decoration: none;
}

@-moz-document url-prefix() {
    #page-contacts .right textarea {
    width: 395px;
}
/*    #page-contacts .right {
	left: 440px;
    }*/
}


.lang-selector {
    position: absolute;
    right: -19px;
    width: 44px;
    height: 54px;
    top: -6px;
}
.lang-selector a {
    width: 53px;
    height: 30px;
    background-position: 0px 0px;
    display: block;
    position: absolute;
}
.lang-selector a.hu {
    background: url(../img/lang-selector-hu.png);
    top: 0px;
    left: 0px;
}
.lang-selector a.hu:hover {
    background-position: 0px 30px;
}
.lang-selector a.en {
    background: url(../img/lang-selector-en.png);
    top: 34px;
    left: 0px;

}
.lang-selector a.en:hover {
    background-position: 0px 30px;
}

.lang-selector a.active {
    background-position: 0 30px;
}