@charset "utf-8";
/*** CSS3 code | Bálint Baár | 2014 @ 8 Ways Media SA | www.8ways.ch ***/

/* * * * * * * * * B O D Y * * * * * * * * */

body{
	min-width: 320px;
}

/* * * * * * * * * H E A D E R * * * * * * * * */

header#header,
header#header .col-big{
	height: 55px;
	min-width: 320px
}
		nav#logo{
            display: block;
            background-color: #9BBA5E;
            height: 100%;
            width: 75px;
            line-height: 55px;
            border-radius: 0px 45px 45px 0px;
        }
        nav#logo * {
			width: 44px;
			height: 44px;
		}
            nav#logo a{
                padding: 5px 0px 0px 24px;
            }
                nav#logo a:hover img{
                    transform: rotate(15deg);
                }
        nav#main_menu{
            position: absolute;
            top: 0px;
            right: 0px;
			z-index: 5;
        }
            nav#main_menu ul{
                padding-top: 55px;
                max-height: 0px;
                overflow: hidden;
            }
            nav#main_menu.active ul{
                max-height: 1000px;
            }
                nav#main_menu li{
                    float: none;
                    width: 75px;
                    padding: 0px 20px;
                    line-height: 36px;
                    margin-top: -1px;
					text-align: right;
                }
                    nav#main_menu li a{
                        font-size: 12px;
                        color: #1e1e1e;
                    }
                        nav#main_menu li a:hover,
                        nav#main_menu li.active a{
                            color: #9bba5e;
                        }

            nav#main_menu li.hamburger a{
				color: #FFFFFF;
                display: block;
				font-size: 0;
				line-height: 0;
				overflow: hidden;
				text-indent: -20000px;
            }

/* * * * * * * * * C O N T E N T * * * * * * * * */

/* Backgrounds */
#bg{
	top: 55px;
}

	#bg .bg01{
		height: 330px;
	}
	#bg .bg02{
		height: 225px;
	}

/* -- Main page -- */

main#main{

}

    /* Welcome */

    #welcome{
        height: 320px;
    }
        #welcome img{
            margin: 70px auto 50px auto;
            width: 80%;
        }
        #welcome h2{
            font-size: 14px;
            line-height: 16px;
            margin-bottom: 45px;
        }
        #welcome p{
            color: #9BBA5E;
            line-height: 18px;
            letter-spacing: 5px;
        }
            #welcome small{
                font-size: 10px;
                line-height: 18px;
                margin: 0px 25px;
            }

        /* Scroll Down */

        #scrolldown{
            height: 110px;
        }
            #scrolldown a{
                top: 32px;
                width: 45px;
                height: 45px;
                /* borders */
                border-radius: 25px;
                -moz-border-radius: 25px;
                -webkit-border-radius: 25px;
            }
            #scrolldown p{
                display: block;
                padding-top: 38px;
                width: 50%;
                margin: 0px auto;
                font-size: 14px;
                line-height: 18px;
            }

        /* Gallery */

        #gallery{

        }
            #gallery .gallery-img {
                margin: 10px;
                height: 160px;
            }
				#gallery .gallery-img:nth-child(2) {
					width: 140px;
				}
  				#gallery .img-holder {
					height: 320px;
					line-height: 320px;
					margin-top: -160px;
				}
					#gallery .img-holder img {
						line-height: 320px;
						max-height: 320px;
						min-height: 160px;
					}
					#gallery .gallery-img:nth-child(2) .img-holder,
					.col-small .img-holder {
						margin-left: -140px;
						width: 280px;
					}
						#gallery .gallery-img:nth-child(2) .img-holder img,
						.col-small .img-holder img {
							max-width: 280px;
							min-width: 140px;
						}
					.col-medium .img-holder {
						margin-left: -300px;
						width: 600px;
					}
						.col-medium .img-holder img {
							max-width: 600px;
							min-width: 300px;
						}
                .gallery-img div.text-holder{
                    height: 160px;
                    line-height: 160px
                }
                    .gallery-img.col-medium div.text-holder article{
                        padding: 0px 80px;
                        line-height: 160px;
                        text-align: center;
                    }
					#gallery .gallery-img:nth-child(2) div.text-holder article,
                    .gallery-img.col-small div.text-holder article{
                        padding: 0px 20px;
                        line-height: 160px;
                        text-align: center;
                    }
                        .gallery-img article p,
                        .gallery-img article p.title,
                        .gallery-img article span{
                            display: none;
                        }
                            ul.icons{
                                display: inline-block;
                                vertical-align: middle;
                                line-height: normal;
                            }
                            ul.icons li{
                                margin: 0px 4px;
                            }
                                ul.icons li a{
                                    width: 35px;
                                    height: 35px;
                                    /* borders */
                                    border-radius: 25px;
                                    -moz-border-radius: 25px;
                                    -webkit-border-radius: 25px;
                                }

                        .gallery-img.center{
                            display: none;
                        }

        /* Partners */

        #partners{

        }
            #partners nav ul{
                margin-top: -20px;
            }
                #partners nav ul li{
                    margin: 0 10px;
                }
                    #partners nav ul li,
                    #partners nav ul li a{
                        width: 85px;
                        height: 55px;
                        line-height: 55px;
                    }
                    #partners nav ul li img,
                    #partners nav ul li a img{
                        height: auto;
                    }

				#partners.white nav ul li{
					margin-bottom: 5px;
					margin-top: 5px;
				}

/* -- Subpages -- */

    /* Subpage header */

    #subpage-header{
        height: 215px;
    }
        #subpage-header div{
            height: 215px;
            line-height: 215px;
            text-align: center;
        }
        #subpage-header h2{
            display: inline-block;
            vertical-align: middle;
            font-size: 34px;
            line-height: normal;
        }
	.service-text span.dots {
		margin: 20px 0 20px 0;
	}

    /* Subpage subline */

    #subpage-subline{
        height: 90px;
        line-height: 90px;
    }
        #subpage-subline p{
            vertical-align: middle;
            font-size: 16px;
            line-height: normal;
        }
        #subpage-subline p span{
            display: none;
        }

    /* Services */

    div.slider-container{
        position: relative;
        width: 255px;
        margin: 0px auto;
        overflow: hidden;
    }

    ul#services-slider{
        width: 1000%;
    }
        #services-slider li{
            width: 175px;
            margin: 0px 40px;
        }
            #services-slider li img{
                margin-bottom: 30px;
            }

        ul.slider-arrows{

        }
            .slider-arrows li{

            }
                .slider-arrows li a{
                    position: absolute;
                    top: 135px;
                    display: block;
                    width:25px;
                    height: 35px;
                    text-indent: -9999px;
                    overflow: hidden;
                    background-position: center center;
                    background-repeat: no-repeat;
                }
                    .slider-arrows li.slider-prev a{
                        left: 0px;
                        background-image: url(../img/grid/slider-prev.png);
                    }
                    .slider-arrows li.slider-next a{
                        right: 0px;
                        background-image: url(../img/grid/slider-next.png);
                    }

        /* Our Work */

        #our-work{

        }
        #our-work ul li{
            margin: 0px 13px 13px 13px;
        }
            #our-work ul li figure{
                width: 130px;
                height: 130px;
            }
            #our-work ul li figure div{
                line-height: 130px;
            }
            #our-work ul.icons li{
                margin: 0px 5px;
            }

    /* Form */

    .textfield,
    .textarea{
        font-size: 14px;
    }

    .textfield{
        width: 258px;
        height: 40px;
        line-height: 40px;
    }

    .textarea{
        width: 258px;
        max-width: 258px;
        min-width: 258px;
        height: 110px;
        max-height: 110px;
        min-height: 110px;
        line-height: 20px;
    }

    /* Projects */

        #projects-slider li{
            width: 320px;
            height: 320px;
        }
            #projects-slider li img{
                display: block;
                margin: 0px auto;
                height: 320px;
            }
            ul.projects-slider.slider-arrows li a{
                width: 65px;
                height: 90px;
                top: 50%;
                margin-top: -45px;
             }


/* * * * * * * * * F O O T E R * * * * * * * * */

footer#footer {
	height:115px;
    line-height: 55px;
	min-width:320px;
}
	footer#footer,
	footer#footer *{
		font-size:10px;
        line-height:30px;
	}
        footer#footer small{
            display: block;
            width: 100%;
            float: none;
            text-align: center;
            padding-top: 8px;
        }
        footer#footer p{
            display: block;
            width: 100%;
            float: none;
            text-align: center;
        }
		footer#footer a.footer-logo{
            position: absolute;
            left: 50%;
            bottom: 0px;
            margin-left: -20px;
		}


/* * * * * * * * * G R I D * * * * * * * * */

/* cols */

	.col-full{
		width:100%;
	}
	.col-big{
		width:320px;
		margin:0px auto;
	}
        .col-big-plus{
            width:320px;
            margin:0px auto;
        }
	.col-medium{
		width: 300px;
	}
	.col-small{
        width: 140px;
	}

/* paddings */

	.padding-small{

	}
	.padding-medium{
		padding:60px 0px;
	}
	.padding-small{

	}


/* * * * * * * * * T E X T S * * * * * * * * */

/* basic elements */


    h3{
        font-size: 18px;
        line-height: 32px;
    }
        span.dots{
            margin: 55px auto 55px auto;;
        }

    /* texts */

    .texts{
        padding: 0px 20px;
    }
        .texts h3{
            font-size: 20px;
            line-height: 21px;
        }
        .texts h4{
            font-size: 14px;
            line-height: 16px;
            margin-bottom: 10px;
        }
        .texts p{
            font-size: 14px;
            line-height: 16px;
            margin-bottom: 30px;
        }
        .texts a{
            font-size: 14px;
            line-height: 16px;
        }
        .texts .dots{
            margin: 20px auto;
        }

        .btn1,
        a.btn1{
            width: 280px;
            height: 60px;
            line-height: 60px;
            margin: 40px auto;
            font-size: 24px;
            /* borders */
            border-radius: 35px;
            -moz-border-radius: 35px;
            -webkit-border-radius: 35px;
        }