/* custom css */

@font-face {
  font-family: 'gt-walsheim';
  src: url('fonts/GT-Walsheim-Regular.eot'); /* IE 5-8 */
  src: local('\u263a'),             /* sneakily trick IE */
        url('fonts/GT-Walsheim-Regular.woff') format('woff'),    /* FF 3.6, Chrome 5, IE9 */
        url('fonts/GT-Walsheim-Regular.ttf') format('truetype') /* Opera, Safari */

}

@font-face {
  font-family: 'gt-walsheim-bold';
  src: url('fonts/GT-Walsheim-Bold.eot'); /* IE 5-8 */
  src: local('\u263a'),             /* sneakily trick IE */
        url('fonts/GT-Walsheim-Bold.woff') format('woff'),    /* FF 3.6, Chrome 5, IE9 */
        url('fonts/GT-Walsheim-Bold.ttf') format('truetype') /* Opera, Safari */
}

body {
  font-family: gt-walsheim;
  font-size: 18px;
  overflow: hidden;
}

strong, b {
  font-family: gt-walsheim-bold;
  font-weight: normal;
}

.konsultointi img {
  border-radius: 10px;
}



:root {
  --ratio: 1500;
  --fixedratio: 1500;
}

html {
  scroll-behavior: smooth;
}

h1 {
  font-weight: normal;
}

.centered {
  text-align: center;
}

.kiltabg {
  background-repeat: no-repeat;
  /*background: url('images/kryptobg.png');*/
  background-repeat: no-repeat;
  background-position: center;
  color:#ffffff;
  background-color:#000000;
  background-image: linear-gradient( 135deg, #000000 60%, #ffffff 100%);
}

.slanted {

  background:
  linear-gradient(170deg, transparent 50%, white 70%, white 100%),
  linear-gradient(100deg, #000 0%, #000 28%, transparent 50%);



  /*
    -webkit-clip-path: polygon(0 0, 100% 0%, 100% 20%, 0 100%);
    clip-path:         polygon(0 0, 100% 0%, 100% 20%, 0 100%);
    */
}

.bg-video {
    position: absolute;
    top: 0%;
    left: 20%;
    width: 80%;
    height: 80%;
    object-fit: cover;
    z-index: -1;
    filter: brightness(0.5) grayscale(100%);

}

.mainbg {
  position: relative;
  /*background: #12d21f;*/
  padding-bottom: 25vw;
  color: #ffffff!important;
  /*background-image: url('images/struktuuri_vaal.png');
  background-size: contain;*/

}



.kryptogreenbg {
  background-color: transparent;
}




.navbar {
  padding-top: 18px;
  padding-left: 18px;
  padding-right: 18px;
  height: 88px;
}

.navbar-item {
  font-size: 18px; /*20px;*/
  color: #ffffff;
  font-family: gt-walsheim;

}

.slantednav {
  background: url('/images/slant.png');
  width: 61px;
  margin-left: 0px;
  height: 88px;
}

.puhujattitle {
  font-size: 50px;
  font-family: gt-walsheim;
  letter-spacing: 2;
  line-height: calc(100*85vw/var(--ratio)); /*60px*/
  margin: 0;
  padding: 0;
}

#maintitle {
  font-size: calc(100*75vw/var(--ratio)); /*4.17vw; 50px*/
  font-family: gt-walsheim;
  letter-spacing: 2;
  line-height: calc(100*85vw/var(--ratio)); /*60px*/
  margin-bottom: 3vw;
}

#mainlead {

  font-family: gt-walsheim-bold;
  font-size: calc(100*30vw/var(--ratio));
  color: #000000;
  letter-spacing: 0;
  line-height: calc(100*39vw/var(--ratio)); /*34px*/
  margin-bottom: 2.5vw;



}

#maintext {


  font-size: calc(100*24vw/var(--ratio));
  color: #000000;
  letter-spacing: 0;
  line-height: calc(100*34vw/var(--ratio)); /*34px*/
  margin-bottom: 2.5vw;
  height: 180px;


}




#mainbutton {
  /*text-align: center;*/
  margin-top: 20px;
  padding-bottom: 38px;
  outline: none;
}

#mainbutton a {
    outline: none;
}

#mainbutton a:hover {
  color: #ffffff!important;
  background: linear-gradient(to bottom right, #ee0000, #ee0000)!important;
}

#mainbutton:hover {

}



.getintouchbutton {
  background: #444444;
  border-radius: 8px;
  border: 0px;
  font-size: calc(100*22vw/var(--ratio)); /*22px;*/
  line-height: calc(100*42vw/var(--ratio)); /*62px;*/
  color: #ffffff;
  letter-spacing: calc(100*0.8vw/var(--ratio)); /*0.8px*/
  text-align: center;
  width: calc(100*248vw/var(--ratio)); /*248px*/
  font-family: gt-walsheim-bold;
  margin-bottom: 12px;

}

.navbar-burger {
  margin-top: 18px;
}

.navbar-burger span {
  height: 4px;
  left: calc(50% - 15px);
  width: 30px;
}

.navbar-burger span:nth-child(1) {
    top: 15px;
}

.navbar-burger span:nth-child(2) {
    top: 23px;
}

.navbar-burger span:nth-child(3) {
    top: 31px;
}



.bold {
  font-family: gt-walsheim-bold;
}


 .container {
   max-width:1152px;
 }

 .rightpad div {
   margin-right: calc(100*40vw/var(--ratio));
 }

 .leftpad div {
   margin-left: calc(100*40vw/var(--ratio));
 }

 .right {
   text-align: right;
 }

 a {
   color: inherit;
   text-decoration: underline;
 }

 a:hover {
   color: inherit;
 }

 a.navbar-item {
   text-decoration: none;

 }

 .navbar-item {
   margin-left: 20px;
 }

 .custlogos {
   min-height: 120px;
 }




 #footer {
   /*margin-bottom: 0px;*/
   padding-bottom: 4vw;
 }

 #footerlogo {
   max-width: calc(100*142vw/var(--ratio)); /*142*/
   width: 100%;
 }

 #footerlogo img {
   width: 100%;
   margin-bottom: 1.5vw;
 }

 #footercountries {
   margin-bottom: 5vw;
   /*opacity: 0.8*/;
  color: #4fff00;
 }

 #footerfollowusicons {
  font-size: calc(100*18vw/var(--ratio));
  color: #333333;


 }

 #footerfollowusicons img {
   margin-right: 1vw;
   max-width: calc(100*28vw/var(--ratio)); /*28px*/
   width: 100%;
   border: 0px;

 }

 #footerfollowusicons a {
   text-decoration: none;
 }

 #footerdomain {
   /*opacity: 0.8*/;
  font-size: calc(100*24vw/var(--ratio)); /*24px;*/
  color: #333333;
  letter-spacing: 0;
  calc(100*28vw/var(--ratio)); /*28px*/
 }

 #footercopyright {

  /*opacity: 0.8*/;
  font-size: calc(100*17vw/var(--ratio));  /*17px;*/
  color: #4fff00;
  margin-top: 8vw;

 }

 #footerprivacy {
   /*opacity: 0.8*/;
   font-size: calc(100*17vw/var(--ratio));  /*17px;*/
   color: #4fff00;
   text-align: right;
   margin-top: 8vw;
 }

 .footertitle {
  font-size: calc(100*22vw/var(--ratio)); /*22px*/
  color: #4fff00;
  margin-bottom: 2.35vw;
 }

 #footercontacttext {
   /*opacity: 0.8*/;
   font-size: calc(100*18vw/var(--ratio)); /*18px*/
   color: #ffffff;
   line-height: calc(100*30vw/var(--ratio)); /*30px*/
}

#footercontacttext b {
  font-weight: normal;
  font-family: gt-walsheim-bold;
}

#footerdownloadstext {
  /*opacity: 0.8*/;
  font-size: calc(100*18vw/var(--ratio)); /*17px*/
  color: #ffffff;
  line-height: calc(100*38vw/var(--ratio)); /*38px*/
  margin-top: -0.35vw;
}

#footersubscribetext {
  /*opacity: 0.8*/;
  font-size: calc(100*17vw/var(--ratio)); /*17px*/
  color: #ffffff;
  line-height: calc(100*28vw/var(--ratio)); /*28px*/
  margin-top: -0.15vw;
}

a.button {
  text-decoration: none;
}

#footerprivacy a {
  text-decoration: none !important;
}

#footerprivacy a:hover {
  text-decoration: underline !important;
}

.columntext {
  max-width: 90%;
}

.palvelut-kuvaus {
  margin-top: 20px;
}


@media screen and (max-width: 1084px) {
  .navbar-item {
    margin-left: 0px;
  }
}

@media screen and (max-width: 1023px) {
  .gsc-control-cse {
    display: block!important;
    position: relative;
    width: auto;
    top: inherit;
    right: inherit;
  }

  Xsection {
    padding-top: 88px;
  }

  .navbar-item, .navbar-item:hover {
    color: #333333;
    height: auto!important;
  }

  .navbar-item a, .navbar-item a:hover {
    color: #333333;
    height: auto!important;
  }

  #navSearch {
    display: none;
  }

  #langselection {
    background-color: #ffffff;
  }




}




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

  .endusertitle {
    padding-top: 4vw;
    font-size: calc(100*45vw/var(--ratio));
    padding-bottom: 1vw;

  }



  .feedbacksection {
    height: 60.7vw;
  }




  .enduserfeedbacktext {
    font-size: calc(100*25vw/var(--ratio));
  }

  .enduserfeedbackname {
    font-size: calc(100*30vw/var(--ratio));
    padding-top: 2vw;
  }

  .enduserfeedbackdesc {
    font-size: calc(100*18vw/var(--ratio));
    padding-left: 1.2vw;
  }


  .endusercolumn div {
    max-width: 22vw;
  }

  #endusercolumn1 {
    padding-top: 2.5vw;
  }

  #endusercolumn1 div {
    margin-left: 7.5vw;
  }

  #endusercolumn2 {
    padding-top: 13.5vw;
  }

  #endusercolumn2 div {
    margin-left: 5.3vw;
  }

  #endusercolumn3 {
    padding-top: 5.5vw;
  }

  #endusercolumn3 div {
    margin-left: 5vw;
  }

  #endusercolumn2 .enduserfeedbackdesc {
    max-width: 25vw;
  }

  .enduserfeedbackbutton {
    padding-top: 10vw;
  }
}

@media screen and (max-width: 880px) {
  #mainright {
    display: none;
  }
  .slanted {
    background-image: linear-gradient( 135deg, #000000 70%, #ffffff 100%);
  }
  #xmaintext {
    width: 80%;
  }

  .mainbg {
    padding-bottom: 0px;
  }

  .palvelut {
    padding-top: 40px;
  }

}



@media screen and (max-width: 768px) {
  body {
    overflow: hidden;
  }

  .kryptobg {
    background-image: linear-gradient( 135deg, #009900 80%, #4fff00 95%, #4fff00 100%);

  }

  .mainbg {
    margin-bottom: 0px!important;
  }

  .palvelut .linebreak {
    display: none;
  }

  .palvelut-kuvaus::before {
    content: "●";
    margin-right: 0.5em;
  }

  .palvelut-kuvaus {
    margin-top: 0px;
  }



  .columntext {
    max-width: 100%;
  }

  .is-one-third {
    text-align: center;
  }

  .is-one-third img {
    display: none;
  }

  #domainit, #yllapito {
    padding-bottom: 40px;
  }
}


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


   :root {
     /*--ratio: 768;*/
     --ratio: 600;
   }

   #packageinfoimg {
     margin-top: 0px;
   }

   .customerlogo {
     height: 110px;
   }

   .custlogos {
     padding-top: 50px;
     padding-bottom: 30px;
   }



   .whoshouldusebuttonleft, .testimonialsbutton {
     padding-bottom: 40px;
   }



   .feedback {
     margin-left: 20px;
     margin-right: 20px;
   }

   .twocolorbg {
     background: none;
   }

   .options2 {
     margin-left: 0px;
   }

   .options {
     padding-top: 10%;
     padding-bottom: 7%;
     padding-left: 2rem;
     padding-right: 1.5rem;
   }

   #optionsimage1 {
     margin-left: -6%;
   }

   #optionsimage2 {
     margin-left: 0px;
   }

   #options-or {
     display: none;
   }

   .optionscontainer {
     padding-top: 0px;
   }

   .optionstitlesection {
     padding-bottom: 0px;
   }

   .optionstitlecolumn {
     padding-bottom: 2rem;
   }

   .optionssection {
     padding: 0px;
     overflow-x: hidden;
   }



   #cycleimage {
     margin-top: 0px;
   }

   #footerprivacy {
     text-align: left;
   }

   .newsimage {
     height: 55vw;
   }

   #wordfirst {
     margin-bottom: 80px;
   }

   .customerlogo {
     text-align: center;
   }

   .newsitem {
     padding-bottom: 20px;
   }

   .ctaitem {
     padding-bottom: 70px;
   }

    .cycleleft {
      padding-right: .75rem;
    }

    .cycleslogans {
      width: 100%;
    }

    .cyclebutton {
      text-align: center;
    }
 }

 @media screen and (max-width: 600px) {
   #maintext {
     height: 212px;
   }

   .hidemobilesmall {
     display: none;
   }


 }

 @media screen and (max-width: 500px) {
   #maintext {
     height: 254px;
   }

   .rightpad div {
     margin-right: 5px;
   }
 }

 @media screen and (max-width: 400px) {
   #maintext {
     height: 298px;
   }
 }