@charset "utf-8";
/* CSS Document */

@media only screen and (max-width: 1450px){
    section.about div.info h2{font-size:50px; line-height:54px;}
    section.about div.info strong{margin:0px 0px 15px 0px;}
}

@media only screen and (max-width: 1300px){
    section.welcome h1,
    section.headline div.info h1{font-size:130px; line-height:120px;}
}

@media only screen and (max-width: 1200px){
    section.welcome h1,
    section.headline div.info h1{font-size:120px; line-height:110px;}
    
    section.about div.info p{font-size:14px; line-height:20px;}
    section.about div.info h2{font-size:36px; line-height:40px; margin:0px 0px 15px 0px;}
    section.about div.info strong{font-size:14px; margin:15px 0px 0px 0px;}
    
    section.services a p{font-size:12px; line-height:16px;}
    section.services a h4{font-size:20px;}
}

@media only screen and (max-width: 1150px){
    section.gallery article a.big{height:450px;}
    section.gallery article a.small{height:200px;}
}

@media only screen and (max-width: 1100px){
    section.welcome h1,
    section.headline div.info h1{font-size:110px; line-height:100px;}
    
    section.infos article p{font-size:14px; line-height:20px;}
    section.infos article h3{font-size:36px; line-height:40px;}
    section.infos article h5{font-size:14px; margin:0px 0px 15px 0px;}
}

@media only screen and (max-width: 1050px){
    section.blog a h5{font-size:14px; line-height:18px;}
    
    section.page.video a.video{width:-moz-calc(33.3334% - 10px); width:-webkit-calc(33.3334% - 10px); width:-o-calc(33.3334% - 10px); width:calc(33.3334% - 10px); margin:0px 0px 15px 15px;}
    section.page.video a.video:nth-of-type(4n + 1){clear:none; margin:0px 0px 15px 15px;}
    section.page.video a.video:nth-of-type(3n + 1){clear:left; margin:0px 0px 15px 0px;}
    section.page.video a.video span p{font-size:15px; line-height:19px;}
}

@media only screen and (max-width: 1000px){
    section.welcome h1,
    section.headline div.info h1{font-size:100px; line-height:90px;}
    
    section.gallery article a.big{height:400px;}
    section.gallery article a.small{height:150px;}
    section.gallery article a strong{font-size:20px; line-height:24px;}
    
    section.page.service a.category{min-height:425px;}
}

@media only screen and (max-width: 950px){
    section.about{padding:50px 0px;}
    section.about div.info p{width:auto; font-size:14px; line-height:20px;}
    section.about div.info h2{width:auto; margin:0px 0px 15px 0px;}
    section.about div.info strong{font-size:14px; margin:15px 0px 0px 0px;}
        
    section.infos,
    section.page{padding:50px 0px;}
    
    footer div.social a{margin:0px 0px 0px 30px;}
    footer ul li{margin:0px 10px 0px 0px;}
    
    section.blog.inner a{width:-moz-calc(50% - 5px); width:-webkit-calc(50% - 5px); width:-o-calc(50% - 5px); width:calc(50% - 5px); margin:0px 0px 15px 10px;}
    section.blog.inner a:nth-of-type(3n + 1){clear:none; margin:0px 0px 15px 10px;}
    section.blog.inner a:nth-of-type(2n + 1){clear:left; margin:0px 0px 15px 0px;}
    
    section.page.aboutus div.image{width:100%; max-width:540px; float:none; margin:0px auto 30px auto;}
    section.page.aboutus div.team{width:100%; min-height:30px; display:block; float:none; margin:0px 0px 50px 0px; -webkit-align-items:baseline; align-items:baseline;}
}

@media only screen and (max-width: 900px){
    section.welcome h1,
    section.headline div.info h1{font-size:90px; line-height:80px;}
    
    section.page h2{font-size:36px; line-height:40px;}
    
    section.page.contacts aside{width:270px; margin:0px 15px 0px 0px;}
    section.page.contacts article{width:-moz-calc(100% - 285px); width:-webkit-calc(100% - 285px); width:-o-calc(100% - 285px); width:calc(100% - 285px);}
    
    section.page.service a.category{min-height:400px;}
}

@media only screen and (max-width: 850px){
    header nav ul li{margin:0px 15px;}
    
    section.infos article h3{font-size:30px; line-height:34px;}
    
    footer div.social a{margin:0px 0px 0px 10px;}
    
    section.page.post p{font-size:14px; line-height:21px;}
    section.page.post h4{margin:0px 0px 30px 0px;}
    
    section.about div.info{width:auto; float:none; margin:0px 0px 30px 0px;}
    section.about img{float:none; margin:0px auto 30px auto;}
}

@media only screen and (max-width: 800px){
    header nav ul li{margin:0px 10px;}
    
    section.welcome h1,
    section.headline div.info h1{font-size:80px; line-height:70px;}
    
    footer ul{float:none; text-align:center;}
    footer div.social{float:none; text-align:center; margin:0px 0px 15px 0px;}
    
    section.page.aboutus h2{font-size:28px; line-height:32px;}
    
    section.page.service a.category{min-height:375px;}
    
    section.page.video div.columns{width:auto; float:none; margin:0px 0px 30px 0px;}
}

@media only screen and (max-width: 750px){
    header{padding:0px;}
    header a.logo{margin:30px auto 0px auto;}    
    header a.show{display:block;}
    header nav{width:100%; height:100%; display:none; position:fixed; top:0px; left:0px; background-color:rgba(0,0,0,0.9); margin:0px; z-index:9999; -webkit-align-items:center; align-items:center;}
    header nav a.close{display:block;}
    header nav.visible{display:-webkit-flex !important; display:flex !important;}
    header nav ul{margin:0px auto;}
    header nav ul li{display:block; margin:0px;}
    header nav ul li.hide{display:block;}
    header nav ul li a{font-size:16px; line-height:24px;}
    
    section.infos article{width:auto; float:none;}
    section.infos article:first-of-type{margin:0px 0px 30px 0px;}
    
    section.gallery article{width:auto; float:none;}
    section.gallery article:first-of-type{margin:0px 0px 15px 0px;}
    
    section.page.service a.category{text-align:center; -webkit-align-items:center; align-items:center;}
    section.page.service a.category aside h2{float:none;}
    section.page.service a.category aside em{float:none; margin:15px 0px 0px 0px;}
    
    footer ul{display:none;}
}

@media only screen and (max-width: 700px){
    section.welcome h1,
    section.headline div.info h1{font-size:70px; line-height:60px;}
    
    section.services a{width:auto; float:none; margin:15px 0px 0px 0px;}
    
    section.blog.inner a{float:left;}
    section.blog a{width:auto; float:none; margin:30px 0px 0px 0px;}
    section.blog a img{margin:0px 0px 15px 0px;}
    
    section.page.contacts aside{width:100%; clear:left; margin:0px 0px 30px 0px;}
    section.page.contacts article{width:100%; clear:left;}
    
    section.page.video a.video{width:-moz-calc(50% - 5px); width:-webkit-calc(50% - 5px); width:-o-calc(50% - 5px); width:calc(50% - 5px); margin:0px 0px 10px 10px;}
    section.page.video a.video:nth-of-type(3n + 1){clear:none; margin:0px 0px 10px 10px;}
    section.page.video a.video:nth-of-type(2n + 1){clear:left; margin:0px 0px 10px 0px;}
    section.page.video a.video span p{font-size:14px; line-height:18px;}
    
    section.page.service a.category{min-height:350px;}
    
    section.welcome{-webkit-align-items:flex-end; align-items:flex-end;}
    section.welcome a{bottom:40px;}
    section.welcome a:hover{bottom:20px;}
    section.welcome h1{padding:0px 0px 100px 0px;}
}

@media only screen and (max-height: 650px){    
    section.welcome{-webkit-align-items:flex-end; align-items:flex-end;}
    section.welcome h1{padding:0px 0px 100px 0px;}
}

@media only screen and (max-width: 650px){
    section.about h3{width:auto; float:none; margin:0px 0px 15px 0px;}
    section.about aside{width:auto; float:none;}
    
    section.page h2{font-size:30px; line-height:34px; margin:0px 0px 15px 0px;}
    section.page h3{font-size:20px; line-height:24px; margin:0px;}
    section.page h4{font-size:14px; line-height:18px; margin:0px;}
    
    section.page.service a.category{min-height:325px;}
    
    section.page.video div.icon{margin:15px 0px 0px 0px;}
    section.page.video div.icon img{margin:0px 15px 0px 0px;}
    section.page.video div.icon aside{width:-moz-calc(100% - 135px); width:-webkit-calc(100% - 135px); width:-o-calc(100% - 135px); width:calc(100% - 135px);}
}

@media only screen and (max-height: 600px){    
    section.welcome h1{font-size:72px; line-height:76px;}
}

@media only screen and (max-width: 600px){
    section.welcome h1,
    section.headline div.info h1{font-size:60px; line-height:50px;}
    
    section.page.aboutus h2{font-size:24px; line-height:28px;}
    
    section.page.video div.columns{width:100%;}
    section.page.video a.video span p{font-size:13px; line-height:17px;}
    
    section.page.service a.category{min-height:300px;}
}

@media only screen and (max-height: 550px){    
    section.welcome h1{font-size:36px; line-height:40px;}
}

@media only screen and (max-width: 550px){
    section.about,    
    section.infos,
    section.blog,
    section.blog.inner,
    section.page,
    footer{padding:30px 0px;}
    
    section.welcome h1,
    section.headline div.info h1{font-size:50px; line-height:45px;}
    
    section.gallery{padding:30px 0px;}
    section.gallery h5{font-size:14px; line-height:18px;}
    section.gallery h4{font-size:36px; line-height:36px; margin:0px 0px 30px 0px;}
    
    section.page.service a.category{min-height:275px;}
    
    section.page.video div.columns .price li{font-size:12px; padding:5px;}
    section.page.video div.columns .price .grey{font-size:16px; padding:10px;}
    section.page.video div.columns .price .header{font-size:20px; padding:15px;}
}

@media only screen and (max-height: 500px){    
    section.welcome a{display:none;}
    section.welcome h1{padding:0px 0px 30px 0px;}
}

@media only screen and (max-width: 500px){
    a.btn{font-size:14px;}
    
    section.welcome h1,
    section.headline div.info h1{font-size:46px; line-height:42px;}
    
    section.about h3{font-size:24px; line-height:28px;}
    section.about div.info h2{font-size:36px; line-height:40px;}
    section.about div.info p,
    section.about div.info h6{font-size:14px; line-height:20px;}
    
    section.blog.inner a{width:auto; float:none; clear:left; margin:0px 0px 15px 0px;}
    section.blog.inner a:nth-of-type(3n + 1){margin:0px 0px 15px 0px;}
    
    section.page.video{font-size:14px; line-height:20px;}
    section.page.video a.video span p{font-size:12px; line-height:16px;}
    section.page.video div.icon{text-align:center;}
    section.page.video div.icon img{float:none; margin:0px auto 15px auto;}
    section.page.video div.icon aside{width:auto; float:none;}
    
    section.page.service a.category{min-height:250px;}
    
    section.welcome a{bottom:30px;}
    section.welcome a:hover{bottom:15px;}
}

@media only screen and (max-width: 450px){
    section.welcome h1,
    section.headline div.info h1{font-size:40px; line-height:40px;}
    
    section.gallery article a.big{height:300px;}
    section.gallery article a.small{height:100px;}
    section.gallery article a strong{font-size:14px; line-height:18px;}
    
    section.page h2{font-size:24px; line-height:28px;}
    section.page h3{font-size:16px; line-height:20px;}
    section.page h4{font-size:12px; line-height:16px;}
    
    section.page.post p{font-size:12px; line-height:18px;}
    section.page.post h4{margin:0px 0px 15px 0px;}
    
    section.page.aboutus div.image img.one{display:block; margin:0px auto;}
    section.page.aboutus div.image img.two{display:none;}
    
    section.page.service a.category{min-height:225px;}
}

@media only screen and (max-height: 400px){    
    section.welcome h1{display:none;}
}

@media only screen and (max-width: 400px){  
    section.welcome h1,
    section.headline div.info h1{font-size:36px; line-height:38px;}
    
    section.about h3{font-size:18px; line-height:22px;}
    section.about div.info h2{font-size:24px; line-height:28px;}
    section.about div.info strong{font-size:12px; margin:0px;}
    section.about div.info div.text{margin:0px 0px 15px 0px;}
    
    section.infos article p{font-size:12px; line-height:18px;}
    section.infos article h3{font-size:24px; line-height:28px;}
    section.infos article h5{font-size:12px; margin:0px 0px 15px 0px;}
    
    section.page.aboutus h2{font-size:20px; line-height:24px;}
    
    section.page.video a.video,
    section.page.video a.video:nth-of-type(3n + 1),
    section.page.video a.video:nth-of-type(2n + 1){width:100%; clear:left; margin:0px 0px 10px 0px;}
    
    section.page.service a.category{min-height:200px;}
}

@media only screen and (max-width: 350px){
    section.welcome h1,
    section.headline div.info h1{font-size:32px; line-height:34px;}
    
    header a.show{margin:15px auto 0px auto;}
    header a.logo{width:200px; height:106px; background-size:cover;}
    
    section.infos{padding:15px 0px;}
    section.infos article:first-of-type{margin:0px 0px 15px 0px;}
    
    section.about,
    section.blog,
    section.blog.inner,
    section.page,
    footer{padding:15px 0px;}
    
    section.gallery{padding:15px 0px;}
    section.gallery h5{font-size:12px; line-height:16px;}
    section.gallery h4{font-size:24px; line-height:28px; margin:0px 0px 15px 0px;}
    
    section.page.service a.category{min-height:175px;}
    
    section.welcome a{bottom:20px;}
    section.welcome a:hover{bottom:10px;}
}

@media only screen and (max-width: 300px){  
    section.welcome h1,
    section.headline div.info h1{font-size:26px; line-height:30px;}
    
    section.page.service a.category{min-height:150px;}
}