@charset "utf-8";

/* Retina Ready Images */



@media only screen and (-Webkit-min-device-pixel-ratio: 1.5),

only screen and (-moz-min-device-pixel-ratio: 1.5),

only screen and (-o-min-device-pixel-ratio: 3/2),

only screen and (min--moz-device-pixel-ratio: 1.5),

only screen and (min-device-pixel-ratio: 1.5) {

h1#logo a { background:url(../images/bg-logo@2x.png) center no-repeat; background-size:200px 131px; }



.map {background:url(../images/icons/bg-map@2x.png) no-repeat center left; background-size:48px 48px;  }

.winner {background:url(../images/icons/bg-winner@2x.png) no-repeat center; background-size:48px 48px; }

.time {background:url(../images/icons/bg-time@2x.png) no-repeat center; background-size:48px 48px; }

.pig {background:url(../images/icons/bg-pig@2x.png) no-repeat center; background-size:48px 48px; }

.adjust {background:url(../images/icons/bg-adjust@2x.png) no-repeat center; background-size:48px 48px; }

.team {background:url(../images/icons/bg-team@2x.png) no-repeat center; background-size:48px 48px; }

.works {background:url(../images/icons/bg-works@2x.png) no-repeat center; background-size:48px 48px; }

.chat {background:url(../images/icons/bg-chat@2x.png) no-repeat center; background-size:48px 48px; }

.notes {background:url(../images/icons/bg-notes@2x.png) no-repeat center; background-size:48px 48px; }

.camera {background:url(../images/icons/bg-camera@2x.png) no-repeat center; background-size:48px 48px; }

.illustration {background:url(../images/icons/bg-illustration@2x.png) no-repeat center; background-size:48px 48px; }

.social {background:url(../images/icons/bg-social@2x.png) no-repeat center; background-size:48px 48px; }

.vector {background:url(../images/icons/bg-vector@2x.png) no-repeat center; background-size:48px 48px; }

.commerce {background:url(../images/icons/bg-commerce@2x.png) no-repeat center; background-size:48px 48px; }

.search {background:url(../images/icons/bg-search@2x.png) no-repeat center; background-size:48px 48px; }

.like { background:url(../images/icons/bg-like@2x.png) center no-repeat; background-size:48px 48px; }

.share { background:url(../images/icons/bg-share@2x.png) center no-repeat; background-size:48px 48px; }

.document { background:url(../images/icons/bg-document@2x.png) center no-repeat; background-size:48px 48px; }

.apple { background:url(../images/icons/bg-apple@2x.png) center no-repeat; background-size:48px 48px; }

.balance { background:url(../images/icons/bg-balance@2x.png) center no-repeat; background-size:48px 48px; }

.beaker { background:url(../images/icons/bg-beaker@2x.png) center no-repeat; background-size:48px 48px; }

.beer { background:url(../images/icons/bg-beer@2x.png) center no-repeat; background-size:48px 48px; }

.books { background:url(../images/icons/bg-books@2x.png) center no-repeat; background-size:48px 48px; }

.box { background:url(../images/icons/bg-box@2x.png) center no-repeat; background-size:48px 48px; }

.cake { background:url(../images/icons/bg-cake@2x.png) center no-repeat; background-size:48px 48px; }

.calculator { background:url(../images/icons/bg-calculator@2x.png) center no-repeat; background-size:48px 48px; }

.cd { background:url(../images/icons/bg-cd@2x.png) center no-repeat; background-size:48px 48px; }

.champagne { background:url(../images/icons/bg-champagne@2x.png) center no-repeat; background-size:48px 48px; }

.chart { background:url(../images/icons/bg-chart@2x.png) center no-repeat; background-size:48px 48px; }

.cheese { background:url(../images/icons/bg-cheese@2x.png) center no-repeat; background-size:48px 48px; }

.court { background:url(../images/icons/bg-court@2x.png) center no-repeat; background-size:48px 48px; }

.delivery { background:url(../images/icons/bg-delivery@2x.png) center no-repeat; background-size:48px 48px; }

.dvd { background:url(../images/icons/bg-dvd@2x.png) center no-repeat; background-size:48px 48px; }

.eco { background:url(../images/icons/bg-eco@2x.png) center no-repeat; background-size:48px 48px; }

.film { background:url(../images/icons/bg-film@2x.png) center no-repeat; background-size:48px 48px; }

.grape { background:url(../images/icons/bg-grape@2x.png) center no-repeat; background-size:48px 48px; }

.hot { background:url(../images/icons/bg-hot@2x.png) center no-repeat; background-size:48px 48px; }

.house { background:url(../images/icons/bg-house@2x.png) center no-repeat; background-size:48px 48px; }

.icecream { background:url(../images/icons/bg-icecream@2x.png) center no-repeat; background-size:48px 48px; }

.joystick { background:url(../images/icons/bg-joystick@2x.png) center no-repeat; background-size:48px 48px; }

.keynote { background:url(../images/icons/bg-keynote@2x.png) center no-repeat; background-size:48px 48px; }

.link { background:url(../images/icons/bg-link@2x.png) center no-repeat; background-size:48px 48px; }

.magic { background:url(../images/icons/bg-magic@2x.png) center no-repeat; background-size:48px 48px; }

.mail { background:url(../images/icons/bg-mail@2x.png) center no-repeat; background-size:48px 48px; }

.microphone { background:url(../images/icons/bg-microphone@2x.png) center no-repeat; background-size:48px 48px; }

.network { background:url(../images/icons/bg-network@2x.png) center no-repeat; background-size:48px 48px; }

.palette { background:url(../images/icons/bg-palette@2x.png) center no-repeat; background-size:48px 48px; }

.plaster { background:url(../images/icons/bg-plaster@2x.png) center no-repeat; background-size:48px 48px; }

.player { background:url(../images/icons/bg-player@2x.png) center no-repeat; background-size:48px 48px; }

.polaroid { background:url(../images/icons/bg-polaroid@2x.png) center no-repeat; background-size:48px 48px; }

.printer { background:url(../images/icons/bg-printer@2x.png) center no-repeat; background-size:48px 48px; }

.pulse { background:url(../images/icons/bg-pulse@2x.png) center no-repeat; background-size:48px 48px; }

.quote { background:url(../images/icons/bg-quote@2x.png) center no-repeat; background-size:48px 48px; }

.radio { background:url(../images/icons/bg-radio@2x.png) center no-repeat; background-size:48px 48px; }

.recorder { background:url(../images/icons/bg-recorder@2x.png) center no-repeat; background-size:48px 48px; }

.scissors { background:url(../images/icons/bg-scissors@2x.png) center no-repeat; background-size:48px 48px; }

.select { background:url(../images/icons/bg-select@2x.png) center no-repeat; background-size:48px 48px; }

.serving { background:url(../images/icons/bg-serving@2x.png) center no-repeat; background-size:48px 48px; }

.share { background:url(../images/icons/bg-share@2x.png) center no-repeat; background-size:48px 48px; }

.shop { background:url(../images/icons/bg-shop@2x.png) center no-repeat; background-size:48px 48px; }

.shopping { background:url(../images/icons/bg-shopping@2x.png) center no-repeat; background-size:48px 48px; }

.smartphone { background:url(../images/icons/bg-smartphone@2x.png) center no-repeat; background-size:48px 48px; }

.sofa { background:url(../images/icons/bg-sofa@2x.png) center no-repeat; background-size:48px 48px; }

.syringe { background:url(../images/icons/bg-syringe@2x.png) center no-repeat; background-size:48px 48px; }

.tape { background:url(../images/icons/bg-tape@2x.png) center no-repeat; background-size:48px 48px; }

.target { background:url(../images/icons/bg-target@2x.png) center no-repeat; background-size:48px 48px; }

.television { background:url(../images/icons/bg-television@2x.png) center no-repeat; background-size:48px 48px; }

.video { background:url(../images/icons/bg-video@2x.png) center no-repeat; background-size:48px 48px; }

.walkman { background:url(../images/icons/bg-walkman@2x.png) center no-repeat; background-size:48px 48px; }

.zoom { background:url(../images/icons/bg-zoom@2x.png) center no-repeat; background-size:48px 48px; }

.tags { background:url(../images/icons/bg-tags@2x.png) center no-repeat; background-size:48px 48px; }



.flex-direction-nav .flex-next {background:url(../images/icons/bg-next@2x.png) center no-repeat #fff; background-size:48px 48px; }

.flex-direction-nav .flex-prev {background:url(../images/icons/bg-prev@2x.png) center no-repeat #fff; background-size:48px 48px; }



.fancybox-close {background: url(../images/bg-close@2x.png) center no-repeat; background-size:48px 48px;}

.fancybox-prev span {background: url(../images/bg-prev@2x.png) center no-repeat; background-size:48px 48px;}

.fancybox-next span {background: url(../images/bg-next@2x.png) center no-repeat; background-size:48px 48px;}



.form-part .send-btn { background: url(../images/icons/bg-mail@2x.png) no-repeat scroll top right transparent; background-size:48px 48px; }



.comment-form-icon-wrapper { background:url(../images/icons/bg-quote@2x.png) no-repeat center; background-size:48px 48px; }



.comment-form .send-btn { background: url(../images/icons/bg-mail@2x.png) no-repeat scroll top right transparent; background-size:48px 48px; }



.ajax-prev { background: url(../images/icons/bg-prev@2x.png) center no-repeat #fff; background-size: 48px 48px; }

.ajax-next { background: url(../images/icons/bg-next@2x.png) center no-repeat #fff; background-size: 48px 48px; }



}





/*@media only screen and (min-width: 1800px) {

.col1-3 { width:25%; }

}*/



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

#content {position:absolute; padding-left:0px; z-index:102 }

.container {width:900px; }

	header {  /*position:absolute;*/ min-height:100%; height:auto }

	#background-color { background:#f5f5f5; height:100%; width:100%; position:fixed; z-index:101; -webkit-overflow-scrolling: touch; top:0; left:0; display:block }

	#bottom-header { position:relative; bottom:auto; width:100%; text-align:center; }

	#menu-button {display:block; }
	
	.col1-3 { width:350px; padding:8px 12px 8px 0; }
	
	.col3-3 { margin-bottom:20px;}
	
	.thumbs { width:35%; }
	
	blockquote p { font-size:17px; line-height:23px; padding-bottom:25px; margin-top: 30px; }
	
	


}



@media only screen and (min-width: 1470px) {
	
	 .container {width:900px; }

	.col3-3, .about-col3-3, .contact-col2-3 { width:900px; height:auto;   }
	

	.col1-3 { width:300px; padding:8px 12px 8px 0; }

	.col2-3 { width:940px; }

	.col3-3, .col4-3 { width:900px; height:auto;  }

	.videos { width:400px; height:225px }
	
	.thumbs { width:33%; }
	
	.col3-3 { margin-bottom:20px;}
	
	

    
}

/* Desktop-only rules */

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

    #container { padding-top:45px }
	
	/*footer { width:900px;}*/
	

}



/* Desktop-only rules */

@media only screen and (min-width: 980px) and (max-width: 1469px) {

    .container {width:906px;}

	.col3-3, .about-col3-3, .contact-col2-3 /*, footer*/ { width:900px; height:auto;  }

	.col1-3 { width:300px; padding:8px 12px 8px 0; }

	.col2-3 { width:940px; }

	.col3-3 { margin-top:20px; margin-bottom:5px;}

	.videos { width:400px; height:225px }
	
	.thumbs { width:33%; }
	
	blockquote p { font-size:17px; line-height:23px; padding-bottom:25px; }

	

}




/* Tablet Portrait size to standard 960 (devices and browsers) */

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

    .container {width:600px; }
	
	#container { padding:50px 0 0 0px }
	
	.competences { float:left; padding:0px; width:300px; position:relative; margin:0 auto; padding-top:0px; }

	.col1-3 { width:300px;  padding:5px 0px 5px 8px; }
	.about-col1-3 { width:600px; }

	.col2-3, .col2-3m /*, footer*/ { width:620px; }

    .col3-3, .contact-col2-3, .about-col3-3, .col4-3, .col2-2, .col1-2{ width:620px; height:auto; }
    .col3-3, .contact-col2-3, .about-col3-3, .col4-3, .col2-2, .col1-2, .col2-3, footer { margin-left:0; margin-right:0; }
	
	.col3-3 { margin-top:10px; /*padding:8px;*/}
	
	.col1-3-large { width:600px; }
	
	#slide_2{ width:320px;}

	footer .social-list {margin-left:0 }
	
	#liens { margin:0 auto; width:205px; height:90%; z-index:98; padding: 0 5px 0 5px; }
	#service {width:190px; float:left; height:100%; z-index:98; padding: 20px 5px 0 5px; margin: 0 10px  10px 0; border-top:1px dotted #d8d8d8; }
	

	.thumbs { width:49%; }

	.blog-overview .element.blog-teaser:nth-child(2){

        margin-top: 10px;

    }

.blog-overview .element.blog-teaser:nth-child(3){

        margin-top: 10px;

    }

	

	.blog-author-description {width:55%; }

	.comment-content {width:340px; }

	.comment.reply.level-1 {padding-left:0 }

	

	

	.col3-3.centered blockquote {padding:5px 75px 10px }

	

	.service_item {min-width:162px; }

	

	.videos { width:400px; height:225px }
	
	blockquote p { font-size:15px; line-height:23px; padding-bottom:25px; margin-top: 30px; }

}



/* All Mobile Sizes (devices and browser) */

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

    .container {width:320px;}
	
	#container { padding:40px 0 0 0px }
	
	

	.col1-3, footer { width:300px; }
	.col1-3 { width:300px;  padding:5px; }
	.about-col1-3 { width:300px; }

   .col3-3, .contact-col2-3, .about-col3-3, .col4-3, .col2-2, .col1-2{ width:300px; height:auto; }
	 .about-col3-3 { width:300px; height:180px;  }
	 
	 .col3-3 { margin-top:15px;}
	 
	 	.col1-3-large { width:300px; }
    

	h2 {font-size:25px; line-height:40px; letter-spacing:0; padding-top:-5px; font-weight:400; }
	blockquote p { font-size:19px; line-height:23px; padding-bottom:25px; text-align:center;  }

	
	

	.arrow-left	{ display:inline-block; font:30px 'Roboto', 'Helvetica Neue', Arial, Helvetica, sans-serif; font-style:normal !important; line-height:1; text-decoration:none !important; float:left; padding-top:4px; width:45px; color:#999 }
	.arrow-right { display:inline-block; font:30px 'Roboto', 'Helvetica Neue', Arial, Helvetica, sans-serif; font-style:normal !important; line-height:1; text-decoration:none !important; float:right; padding-top:4px; width:45px; color:#999 }

	footer h5 {padding-right:0 }
	footer { margin:30px 0 30px 0; padding:0; width:100%; position:relative; text-align:center; }
	footer div.center { padding:20px 0px; border-top:1px dotted #d8d8d8; }
	
	#liens { margin:0 auto; width:250px; height:100%; z-index:98; padding: 0 5px 0 5px; float: none; }

	.home.portfolio.element {}
	.sliphoveritem, .sliphoveritemTitle { position:static !important; height:auto !important; }
	.sliphoveritemTitle div { text-align:center !important; width:100% !important; }
	.sliphoveritemTitle div span, .sliphoveritemTitle div h6 { margin-left:0 !important; display:inline-block !important; }
	.sliphoveritemTitle div span { margin-right:8px; }

	#map {width:300px; height:200px;}

	

	.thumbs { width:50%; }

	

	.pagination-wrapper {width:100%; top:0; padding:0; }

	.pagination {display:inline-block; float:none; }

	.pagination > li {margin:0 5px; }

	

	.blog-overview .element.blog-teaser:nth-child(2){

        margin-top: 10px;

    }

.blog-overview .element.blog-teaser:nth-child(3){

        margin-top: 10px;

    }

	

	.blog-author-picture {

        float: none;

        margin:0 auto;

        padding: 0;

    }

	.blog-author-description {width:auto; padding-top:20px; padding-right:0; text-align:center }

	.comment, .comment-count {text-align:center; }

    .commenter-avatar{

        padding: 0;

        margin: 0 auto;

        width: 150px;

		display:inline-block;

		float:none

    }

    .comment-content{

        padding-top:20px; display:block; width:auto; max-width:100%;

    }

	.comment.reply.level-1 {padding-left:0 }

	.comment-reply-button-column {float:none; }

	

	.comment-form-icon-wrapper{

        position: relative;

        top: 0;

        left: 0;

        width: 100%;

        padding: 0;

        text-align: center;

		background-position:center top;

    }

    .comment-form-icon-wrapper:before{

        display: inline-block;

    }

    .comment-form{

        padding: 0;

    }

    .comment-form > input, .comment-form > textarea {

        width: 100%;

    }

	

	.col3-3.centered blockquote, .col2-3 blockquote {padding:5px 25px 10px !important }

	

	.column-count2 { -webkit-column-count:1; -moz-column-count:1; column-count:1; -webkit-column-gap:0px; -moz-column-gap:0px; column-gap:0px; }

	

	.videos { width:400px; height:225px }


}



/* Small mobile sizes */

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

 	.competences { float:left; padding:0px; width:300px; position:relative; margin:0 auto; padding-top:0px; }
	
	#container { padding:40px 0 0 0px }
	
	h2 { font-size:20px; font-weight:900; line-height:35px; letter-spacing:4px; margin-top:-5px; padding-bottom:3px; }
	strong { font-weight:700; }
	.tagline { font-family:"Lato", "Open Sans", Arial, Helvetica, sans-serif; font-size:13px; font-weight:600; margin:0px auto; position:relative; line-height:1; color: #000; padding:5px 0 0 0; }

	
	footer { text-align:center;}
	#liens { margin:0 auto; width:250px; height:100%; z-index:98; padding: 0 5px 0 5px; float: none; }
	
	 h5 { font-size:15px; font-weight:400; line-height:13px;  }
	
	

	
.col3-3, .contact-col2-3, .about-col3-3, .col4-3, .col2-2, .col2-3, .col1-2{ width:300px; height:auto; }

.col3-3 { margin-top:15px;}
.col1-3 {  padding:10px;}

.image-container { width:320px; padding:0px 0 0px 0; overflow:hidden; text-align:center; }
	
	blockquote { color:#2b2b2b; font-size:24px; font-style:italic; width:auto; padding:0 5px 0 5px; color:#555; text-align:center; }

	.next-to-icon { margin-left:70px; margin-bottom:15px; }

	.thumbs { width:100%; }

	

	.videos { width:300px; height:169px }
	

}