* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
  border: none;
  font-family: Verdana, Geneva, Tahoma, sans-serif;
}
* h1{
  font-size: 13.9vh;
}
* h2{
  font-size: 5vh;
}
* p {
  font-size: 3.24vh;
}
#main {
  background-color: white;
  overflow: hidden;
}

/* START INTRODUCTION */

.introduction {
  height: 100vh;
  background-image: url("Mask_Group_29.png");
  background-size: cover;
}

#introduction-content {
  position: relative;
  width: 46.04vw;
  height: 28.63vh;
  top: 30%;
  margin: auto;
}
#introduction-content-text {
  position: relative;
  width: calc(46.04vw - 28.54vh);
  height: 10.75vh;
  top: 8.99vh;
  float: right;
}
#Patrik_Muniak {
  left: 4.36vw;
  font-size: 5vh;
  position: absolute;
  line-height: 4.73vh;
  color: rgba(255, 255, 255, 1);
  white-space: nowrap;
}
#Web_Developer {
  left: 4.36vw;
  top: 5.09vh;
  font-size: 4vh;
  position: absolute;
  color: rgba(252, 215, 136, 1);
}

#introduction-content-img {
  position: relative;
  width: 28.54vh;
  height: 28.63vh;
  left: 0px;
  float: left;
}

#shapes-bottom-right {
  position: absolute;
  bottom: -22vh;
  right: 0;
  width: 26.51vw;
  height: 53.01vh;
  overflow: hidden;
}


#contact-icons {
  position: absolute;
  top: 0;
  right: 0;
  display: inline-block;
  overflow: visible;

}

#contact-icons img {
  margin: 1vh 0.5vw 0 0 ;
} 

#email-icon {
  position: relative;
  width: 3.5vh;
  height: 3.5vh;
  float: left;
  overflow: visible;
}
#medium-icon {
  position: relative;
  /* margin: 2vh 2vw 0 0 ; */
  float: left;
  width: 3.5vh;
  height: 3.5vh;
  overflow: visible;
}
#github-icon {
  position: relative;
  float: left;
  width: 3.5vh;
  height: 3.5vh;
  overflow: visible;
}

#linkedin-icon {
  position: relative;
  float: left;
  width: 3.5vh;
  height: 3.5vh;
  overflow: visible;
}

.dark-blue {
  fill: rgba(26, 40, 65, 1);
}

#Group_341 {
  position: relative;
  top: 30vh;
  right: 0;
  width: 18.75vw;
  height: 27.89vh;
  overflow: visible;
}


.light-acqua {
  fill: rgba(167, 219, 216, 1);
}

/* END INTRODUCTION */

/* START KNOW ME BETTER */

/* START PART ONE */

.line {
  position: relative;
  margin: 5vh 0 5vh 0;
  border-radius: 4rem;
  clear: both;
  display: block;
  width: 100%;
  background-color:rgba(167, 219, 216, 1);
  height: 1.3vh;
}

.chunky-line {
    position: relative;
    margin: 5vh 0 5vh 0;
    border-radius: 4rem;
    clear: both;
    display: block;
    width: 100%;
    background-color:rgba(167, 219, 216, 1);
    height: 2vh;
}

.know-me-one {
  height: 123vh;
  overflow: visible;
}
#know-me-one-left {
  width:50%;
  height: 100%;
  float: left;
}
#know-me-visual {
  width: 47.86vw;
  height: 58.39vh;
  position: relative;
  right: 3vw;
  background-color: rgba(167, 219, 216, 1);
  border-radius: 30vh 6vh 6vh 6vh ;
  margin-top: 28vh;
  display: inline-block;
  z-index: 0;
}
#know-me-one-right {
  width:50%;
  height: 100%;
  float: left;

}
.know-me-content {
  position: relative;
  margin: 28vh 0 0 5vw;
  width: 50vw;
  overflow: visible;
}
#know-me-title {
  display:inline-block;
  background-color: rgba(167, 219, 216, 1);
  border-radius: 3rem 0.2rem ;
  margin-bottom: 7vh;
  font-size: 4vh;
}

#polish-content {
  position: relative;
  width: 35.36vw;
  height: 34.66vh;
  overflow: visible;
  font-size: 3.24vh;
}
#polish-content p{
  width: 100%;
}

 #yellow_bubble_under_polish {
  fill: transparent;
  stroke: rgba(252, 215, 136, 1);
  stroke-width: 0.74vh;
  stroke-linejoin: miter;
  stroke-linecap: butt;
  stroke-miterlimit: 4;
  shape-rendering: auto;
}
.yellow_bubble_under_polish {
  position: absolute;
  overflow: visible;
  width: 6.67vh;
  height: 6.67vh;
  right: 10vw;
  top: 200vh;

}

#green_bubble_under_polish {
  fill: rgba(247, 247, 247, 1);
  stroke: rgba(195, 225, 199, 1);
  stroke-width: 0.74vh;
  stroke-linejoin: miter;
  stroke-linecap: butt;
  stroke-miterlimit: 4;
  shape-rendering: auto;
}
.green_bubble_under_polish {
  position: absolute;
  overflow: visible;
  width: 10.19vh;
  height: 10.19vh;
  right: 30vw;
  top: 220vh;
} 

#rome {
  position: relative;
  width: 35.55vw;
  height: 66.26vh;
  overflow: visible;
  margin-left: 7vw;
  bottom: 8vh;
}
#know-me-yellow-lines {
  width: 90%;
  position: relative;
  bottom: 7vh
}
.yellow {
  background-color: rgba(252, 215, 136, 1) !important;
}
#Ellipse_71 {
  fill: transparent;
  stroke: rgba(252, 215, 136, 1);
  stroke-width: 0.74vh;
  stroke-linejoin: miter;
  stroke-linecap: butt;
  stroke-miterlimit: 4;
  shape-rendering: auto;
}
.Ellipse_71 {
  position: absolute;
  overflow: visible;
  width: 6.67vh;
  height: 6.67vh;
  margin: 20vh 0 0 0;

  z-index: 5;
}

/* END PART ONE */

/* START PART TWO */

.know-me-two{
    height: 105vh;
    overflow: visible;
}
#know-me-two-left{
  float: left;
  height: 100%;
  width: 50%
}

#After_my_graduation_I_came_to_ {
  line-height: 4.17vh;
  margin-top: -0.46vh;
  font-size: 3.24vh;
  color: rgba(24, 40, 65, 1);
}

#after-grad-container {
  padding-top: 10%;
  background-color: rgba(167, 219, 216, 1);
  border-radius: 6vh 6vh 30vh 6vh ;
  width: 47.86vw;
  height: 58.39vh;
  position: relative;
  right: 3vw;
  z-index: 15;
}

.text-wrapper {
  border-left: 0.5vw solid rgba(24, 40, 65, 1);
  border-radius: 0.4rem;
  padding-left: 5vw
}
#after-grad-wrapper {
  margin:5% auto 0 auto;
  width: 70%;
}

.Ellipse_77 {
  position: absolute;
  overflow: visible;
  width: 17.61vh;
  height: 17.61vh;
  left: 32vw;
  top: 280vh;
  z-index: 16;
  fill: transparent;
  stroke: rgba(155, 199, 161, 1);
  stroke-width: 1.39vh;
  stroke-linejoin: miter;
  stroke-linecap: butt;
  stroke-miterlimit: 4;
  shape-rendering: auto;
}


#london_001_Converted-02 {
    position: absolute;
    width: 102.13vh;
    height: 65.70vh;
    bottom:-220vh;
    right:0;
    z-index: 10;

    overflow: visible;
  }
#Line_1150 {
  fill: transparent;
  stroke: rgba(195,225,199,1);
  stroke-width: 1.85vh;
  stroke-linejoin: miter;
  stroke-linecap: round;
  stroke-miterlimit: 4;
  shape-rendering: auto;
}
.Line_1150 {
  overflow: visible;
  position: absolute;
  width: 52.92vw;
  height: 1.85vh;
  right: 0;
  bottom: -222vh;
  z-index: 5;

}

#right-big-circle-grad {
  position: absolute;
    width: 119.83vh;
    height: 252.46vh;
    right:0;
    bottom: -360vh;
    overflow: hidden;
    z-index: 0;
    transform: rotate(180deg);
}
#know-me-acqua-bubbles {
  position: absolute;
  width: 30vh;
  height:30vh;
  top: 230vh;
  right: 0;
  z-index: 5;
  transform: rotate(90deg);
  overflow: hidden;
}

#shapes-bottom-know-me {
  width: 11.88vw;
  height: 23.73vh;
  top: 311vh;
  left: 8vw;
  position: absolute;
}

/* END PART TWO */

/* END KNOW ME BETTER */

/* START DONE SO FAR */

.done-so-far {
    height: 503vh;
}
.to_right {
  margin: 0 2vh 0 auto;
}
.large_line {
  position: relative;
  border-radius: 4rem;
  clear: both;
  width: 90%;
  background-color:rgba(24, 40, 65, 1);
  height: 0.8rem;
}


#done_so_far_title {
  padding: 8vh 2vw 8vh 0;
  overflow: visible;
  display: block;
  line-height: 15.29vh;
  float: right;
  color: transparent;
  position:relative;
  z-index: 10;
  
}
.dark_blue_stroke{
  -webkit-text-stroke: 0.5vh rgba(26, 40, 65, 1);
}

.orange_stroke {
  -webkit-text-stroke: 0.5vh rgba(243, 134, 48, 1);
}

#Ellipse_74 {
  fill: transparent;
  stroke: rgba(252, 215, 136, 1);
  stroke-width: 0.74vh;
  stroke-linejoin: miter;
  stroke-linecap: butt;
  stroke-miterlimit: 4;
  shape-rendering: auto;
}
.Ellipse_74 {
  position: absolute;
  overflow: visible;
  width: 21.04vh;
  height: 21.04vh;
  left: 20vw;
  top: 385vh;
}
.fill-yellow { 
  fill: rgba(252, 215, 136, 1);
}

  .automatising-tasks {
    height:140vh
  }
  #white-bubbles-and-circles{
    position: absolute;
    width: 25vw;
    height: 50vh;
    right: 0;
    bottom: -360vh;
    z-index: 11;
  }

  #accounting_project {
    margin: 10vh auto 0 auto;
    background-color: rgba(222, 222, 223, 0.314);
    border-radius: 0 15vh 40vh 10vh;
    min-width:680px;
    width: 64.88vw;
    height: 110vh;
    position: relative;
    z-index: 10;
  }

  #accounting_header {
    background-color: rgba(24, 40, 65, 1);
    min-width:680px;
    width: 64.88vw;
    height: 19.93vh;
    display:inline-block;
    border-radius: 1vh 15vh 1vh 15vh;
    white-space: nowrap;
  }
  
  #accounting_nr {
    filter: drop-shadow(0px 3px 6px rgba(0, 0, 0, 0.161));
    position: relative;
    font-size: 5.56vh;
    color: rgba(255, 255, 255, 1);
    z-index: 10;
    padding: 2vh 3vh ;
    display: inline-block;
    background-color: rgba(252, 215, 136, 1);
    border-radius: 1vh 6vh 1vh 6vh;
    margin: 5vh 0 0 11.56vh;
    width: 9.79vw;
    height: 8.43vh;
    text-align: center;
  }

  #accounting_nr span {
    display: inline-block;
    vertical-align: 2vh;
  }


  #accounting_title {
    position: relative;
    font-size: 5.25vh;
    color: rgba(252, 215, 136, 1);
    width: 70%;
    white-space: normal ;
    float: right;
    top: 6vh;

    
  }

  #accounting_text_wrapper {
    position: relative;
    width: 40.57vw;
    margin: 10vh 2vw 0vh 3vw;
    overflow: visible;
    border-left-color: rgba(252, 215, 136, 1);
    
  }
  #While_working_as_a_Compliance_ {
    position: relative;
    width: 70%;
    overflow: visible;
    line-height: 4.63vh;
    text-align: left;
    font-family: Objektiv Mk2;
    font-style: normal;
    font-weight: normal;
    font-size: 3.24vh;
    color: rgba(24, 40, 65, 1);
  }
#accounting-image {
  position: absolute;
  width:63.58vh;
  height:56.90vh;
  left: 39vw;
  bottom: -5vh;
}

  /* start motion detection */




  #motion-detection-image {
    margin: 8vh 4vw 0 auto;
    display: block;
    width: 38vw;
    height: 55.33vh;
    overflow: visible;
    position: relative;
    z-index: 10;
  }
  .motion-detection {
   height: 70vh;
  }
  #motion-detection-left{
    width: 50%;
    height: 100%;
    float: left;
    
  }

  #motion-detection-right{
    width: 50%;
    height: 100%;
    float: left;

  }

  .motion-content {
    position: relative;
    margin: 0vh 0 0 5vw;
    width: 50vw;
    overflow: visible;
  }
  #motion-title {
    display:inline-block;
    background-color: rgba(167, 219, 216, 1);
    border-radius: 3rem 0.2rem ;
    margin-bottom: 7vh;
  }
  
  #motion-content {
    position: relative;
    width: 35.36vw;
    height: 34.66vh;
    overflow: visible;
    font-size: 3.24vh;
  }
  #motion-content p{
    width: 100%;
  }


  #left-big-circle-motion {
    position: absolute;
    width: 119.83vh;
    height: 252.46vh;
    bottom: -750vh;
    overflow: hidden;
    z-index: 0;
  }
  /* end motion detection */


/* start Raspberry server */
.respberry-server {
  height: 120vh;
}

#raspi_server_project {
  margin: 10vh auto 0 auto;
  background-color: rgba(24, 40, 65, 1);
  border-radius: 2vh 17vh 35vh 10vh;
  min-width:750px;
  width: 64.88vw;
  height: 100vh;
  position: relative;
  z-index: 10;
}

#raspi_server_header {
  background-color: rgba(251, 214, 135, 1);
  display: block;
  border-radius: 1vh 15vh 1vh 15vh;
  min-width:750px;
  width: 64.88vw;
  height: 19.93vh;
  white-space: nowrap;
}

#raspi_server_nr {
  filter: drop-shadow(0px 3px 6px rgba(0, 0, 0, 0.161));
  position: relative;
  font-size: 5.56vh;
  color: rgba(24, 40, 65, 1);
  z-index: 10;
  padding: 2vh 3vh;
  display: inline-block;
  background-color: white;
  border-radius: 1vh 6vh 1vh 6vh;
  margin: 5vh 0 0 11.56vh;
  width: 9.79vw;
  height: 8.43vh;
  text-align: center;
}


#raspi_server_title {
  position: relative;
  font-size: 5.25vh;
  color: rgba(24, 40, 65, 1);
  position: relative;
  width: 70%;
  white-space: normal ;
  float: right;
  top: 7vh;
}

.text-box {
  background-color: rgba(251, 214, 135, 1);
  min-width:500px;
  width: 40vw;
  min-height:48.29vh;
  margin: 7vh 0 0 9vw;
  border-radius: 3vh 40vh 3vh 40vh;
  padding: 4% 0 0 10% ;

}

#raspi_server_text_wrapper {
  position: relative;
  width: 33.57vw;
  overflow: visible;
  border-left-color: white;
}
#raspi_server_text {
  position: relative;
  width: 80%;
  overflow: visible;
  line-height: 4.63vh;
  font-size: 3.24vh;
  color: white;
  z-index: 30;
}
#raspi-server-image {
position: relative;
width: 50.97vh;
height: 35.40vh;
left: 39vw;
bottom: 16vh;
}

.Ellipse_78 {
  position: absolute;
  overflow: visible;
  width: 10vh;
  height: 10vh;
  left: 20vw;
  top: 90vh;
  fill: transparent;
  stroke: rgba(252,215,136,1);
  stroke-width: 0.74vh;
  stroke-linejoin: miter;
  stroke-linecap: butt;
  stroke-miterlimit: 4;
  shape-rendering: auto;
  z-index: 30;
}
.Ellipse_79 {
  position: absolute;
  overflow: visible;
  width: 5vh;
  height: 5vh;
  left: 10vw;
  top: 27vh;
  fill: transparent;
  stroke: rgba(155,199,161,1);
  stroke-width: 1.4vh;
  stroke-linejoin: miter;
  stroke-linecap: butt;
  stroke-miterlimit: 4;
  shape-rendering: auto;
  z-index: 10;
}

.Ellipse_80 {
  width: 4.63vh;
  height: 4.63vh;
  position: absolute;
  overflow: visible;
  transform: matrix(1,0,0,1,1589,7300) rotate(180deg);
  transform-origin: center;
  fill: rgba(195,225,199,1);
  z-index: 10;
}

.Ellipse_81 {
  width: 6.67vh;
  height: 6.67vh;
  position: absolute;
  overflow: visible;
  right: 5vw;
  top: 45vh;
  transform-origin: center;
  fill: transparent;
  stroke: rgba(247,247,247,1);
  stroke-width: 0.74vh;
  stroke-linejoin: miter;
  stroke-linecap: butt;
  stroke-miterlimit: 4;
  shape-rendering: auto;
  z-index: 10;
}
.Ellipse_82 {
  width: 4.63vh;
  height: 4.63vh;
  position: absolute;
  overflow: visible;
  right: 3vw;
  top: 85vh;
  transform-origin: center;
  fill: rgba(167,219,216,1);
  z-index: 10;
}


/* end Raspberry server */


/* start recyppo */
.recyppo {
  height: 83vh
}


/* end recyppo */


/* END DONE SO FAR */


/* START TOOLS */
#tools {
  height: 500vh;
}
#tools-header {
  height: 130vh
}

#tools-title {
  color: transparent;
  -webkit-text-stroke: 2px white;
  background-color: rgba(26, 40, 65, 1);
  width: 71.20vw;
  height: 84vh;
  padding: 20vh 7vw;
  border-radius: 5.19vh 5.19vh 33.73vh 5.19vh;
  position: relative;
  z-index: 10;

}
#tools-header-top-line {
  position:relative;
  top: 5vh;
  z-index: 20;
}
#tools-header-bottom-line {
  position:relative;
  bottom: 5vh;
  z-index: 20;
}


#tools-shapes {
  position: absolute;
  width: 25vw;
  height: 50vh;
  bottom: -795vh;
  right:9vw;
  z-index: 15;
}

#tools-yellow-bubbles {
  position: absolute;
  width: 40vh;
  height:30vh;
  top: -30vh;
  left: 8vw;
}
#tools-circles-right {
  position: absolute;
  width: 40vw;
  height:50vh;
  top: -30vh;
  right:5vw;
  z-index: 5;
}

#right-big-circle-tools {
  position: absolute;
    width: 119.83vh;
    height: 252.46vh;
    right:0;
    top: 0vh;
    overflow: visible;
    z-index: 0;
    transform: rotate(180deg);
}
 
/* tools list */
 #tools-list {
  height:360vh;
  position: relative;
  z-index: 10;
}

#tools-list  li{
  padding:  0 0 0 8vw;
  font-size: 20.39vh;
  color: rgba(26, 40, 65, 1);
  font-weight: bolder;
  height: 29vh
}

#tools-list span{
  position: relative;
  z-index: 10;
}


.transparent-blue-stroke {
  -webkit-text-stroke: 0.6vh rgba(26, 40, 65, 1);
  color: transparent !important;
}

.green {
  background-color: rgba(195,225,199,1);
}
.tool-highlight {
  position: relative;
  height: 7vh;
  width:21vw;
  top: 19vh;
  z-index: 0;
  border-radius: 0.5vh 6vh 0.5vh 6vh;
}


#tools-yellow-line-group {
  position: absolute;
  display: inline-block;
  right: 1vw;
  bottom: 60vh
}

.tools-yellow-line {
  position: relative;
  margin: 5vh 0 5vh 0;
  border-radius: 4rem;
  clear: both;
  display: block;
  width: 40vw;
  background-color:rgba(252,215,136,1);
  height: 0.7rem;
}

#tools-end-yellow-bubbles {
  position: absolute;
  width: 40vh;
  height: 30vh;
  bottom: 30vh;
  left: 8vw;
  z-index: 11;
}
#tools-circles-bottom-right {
  position: absolute;
  width: 40vw;
  height:50vh;
  bottom: 0;
  right:5vw;
  z-index: 5;
}

/* END TOOLS */


/* START HOBBIES */

#hobbies {
  height: 470vh;
}


#hobbies-header {
  height: 90vh;
  position: relative;
  z-index: 10;
}
#hobbies-title-wrapper {
  width: 100vw;
  height: 70vh;
  text-align: center;
  
}
#hobbies-title {
  color: white;
  -webkit-text-stroke: 0.4vh rgba(26, 40, 65, 1);
  width: 45vw;
  vertical-align: 10vh;
  padding-top: 10%;
  margin: 0% 10% 0 auto;
}
.center {
  margin: 0 auto 0 auto;
}

#left-big-circle-hobbies {
  position: absolute;
  width: 119.83vh;
  height: 252.46vh;
  left: 0px;
  bottom: -1500vh;
  z-index: 0;
}

#hobbies-header-shapes {
  position: absolute;
  width: 39.69vw;
  height: 54.77vh;
  left: 0;
  top: 8vh;
  overflow: visible;
  z-index: 5;
}


/* Cooking */


.cooking {
  height: 83vh
}


.simple-layout-image {
  margin: 0 auto 0 8vw ;
  display: block;
  width: 40vw;
  height: 30vw;
  overflow: visible;
  position: relative;
  z-index: 10;
}

.simple-layout-left{
  width: 50%;
  height: 100%;
  float: left;
  
}

.simple-layout-right{
  width: 50%;
  height: 100%;
  float: left;

}

.simple-layout-content {
  position: relative;
  width: 35.36vw;
  margin: 0 8vw 0 auto ;
  display: block;
  overflow: visible;
}
.simple-layout-title {
  display:inline-block;
  background-color: rgba(251, 214, 135, 1);
  border-radius: 3rem 0.2rem ;
  margin-bottom: 7vh;
}

.simple-layout-text-wrap {
  position: relative;
  width: 35.36vw;
  height: 34.66vh;
  overflow: visible;
  font-size: 3.24vh;
}
.simple-layout-text-wrap p{
  width: 100%;
}


/* gym */
#gym {
  height: 57vh
}
.hobbies-layout {
  position: relative;
  z-index: 10;
}

.hobbies-layout-content {
  margin: 0 auto 0 auto;
  width: 94.64vw;
  height: 48.29vh;
  background-color: rgba(26, 40, 65, 0.96);
  border-radius: 3.15vh 32.16vh 3.15vh 32.16vh;
}
.green-text{
  color: #A8D8D6;
}
.yellow-text { 
  color: rgba(252, 215, 136, 1);
}


.hobbies-layout-header {
  margin-left: 3vw;
  margin-bottom: 0.5vh;
  width: 21.46vw;
  height: 6.49vh;
  background-color: rgba(251, 214, 135, 1);
  text-align: center;
  border-radius: 6vh 0.5vh 6vh 0.5vh;

}
.hobbies-layout-header h2{
  display: inline-block;
}


.hl-yellow {
  border: 0.75vh solid rgba(251, 214, 135, 1);
}
.hl-green {
  border: 0.75vh solid #A8D8D6;
}

.hobbies-layout-visual {
  height: 100%;
  width: 50%;
  float: left;
}

.hobbies-layout-image {
  width: 54.31vh;
  height: 31.60vh;
  display: block;
  margin: 4vh 5vw 0 auto;
}

.hobbies-layout-text-box {
  height: 100%;
  width: 50%;
  float: left;
}
.hobbies-layout-text-wrapper {
  margin: 13vh auto 0 0vw;
  border-left: 0.5vw solid rgba(251, 214, 135, 1);
  border-radius: 0.4rem;
  padding-left: 5vw;
  width: 30vw;
}
 

/* reading  */

#reading {
  height: 57vh;
}
#reading-layout-image {
  margin: 9vh auto 0 2vw;
  width: 47.54vh;
  height: 29.84vh ;
}

#reading-layout-text-wrapper {
  margin: 15vh 2vw 0 auto;
}

/* skiing */
 #skiing {
  height: 65vh;
}
#skiing-layout-image {
  margin: 4vh auto 0 2vw;
  width: 44.02vh;
  height: 32.44vh;
}
#skiing-layout-text-wrapper {
  margin: 19vh 2vw 0 auto;
}



/* hiking */
#hiking {
  height: 75vh
}

.hiking-header {
  margin-left: 0vw;
  width: 21.46vw;
  height: 6.49vh;
  background-color: rgba(251, 214, 135, 1);
  text-align: center;
  border-radius: 6vh 0.5vh 6vh 0.5vh;

}
.hiking-header h2{
  display: inline-block;
}
#hiking-image {
  margin: 0vh 8vw 0 auto;


}
#hiking-content {
  width: 35.36vw;
  display: block;
  margin: 0 auto 0 8vw;
}


/* END HOBBIES */




/* START END */


#end {
  height: 47.73vh;
  background-color: rgba(24, 40, 65, 1);
  border: 1px solid rgba(24, 40, 65, 1);
  text-align: center;
}

#muniak-logo {
  width: 16.56vw;
  height: 14.83vh;
  margin: 10vh auto 9vh auto;
}

#end-contacts {
  color: white;
  font-weight: 700;
  display: inline-block;
}
#end-contacts span{
  vertical-align: 0.5vh;
  margin-left: 0.5vw;
}

#end-email-icon {
  width: 3.9vh;
  height: 3vh;
  overflow: visible;
}
#end-medium-icon {
  width: 3.45vh;
  height: 3.45vh;
  overflow: visible;
}
#end-github-icon {
  width: 3.45vh;
  height: 3.45vh;
  overflow: visible;
}

#end-linkedin-icon {
  width: 3.45vh;
  height: 3.45vh;
  overflow: visible;
}
#end-copyright-wrapper {
  text-align: left;
  margin-top: 5vh;
}

#end-copyright {
  
 margin-left: 1vw;
  color: white;
}
#end-copyright img {
  width: 2vh;
  height: 2vh;
}
#end-copyright span{
  vertical-align: 0.3vh;
  font-size: 2vh
}



/* END END  */






/* RESPONSIVE WEBSITE START */


@media only screen and (max-width: 995px) {
  .not-display-small{
    display: none;
  }
  
}



@media only screen and (max-width: 759px) {
  .screen-content{
    display: none;
  }
  .mobile-content {
    font-family: Verdana, Geneva, Tahoma, sans-serif;
  } 
  .mobile-content p {
    font-size: 1.6rem;
    width: 80vw;
    margin: 2rem 0 2rem 0;
  } 
  .mobile-content h2 {
    position: relative;
    overflow: visible;
    text-align: left;
    width: 90vw;
    margin: 7vw 5vh;
    font-weight: bold;
  } 

  .mobile-content h1 {
    width: 90vw;
    margin: 2rem 5vw;
    font-size: 7vh
  } 
  

  .mobile-introduction {
    height: 100vh;
    background-image: url("Mask_Group_29.png");
    background-size: cover;
  }
  #mobile-email-icon {
    position: absolute;
    width: 3.5vh;
    height: 3.45vh;
    right:1vh;
    top:1vh;
    overflow: visible;
  }

  #mobile-github-icon {
    position: absolute;
    top: 1vh;
    right: 6vh;
    width: 3.45vh;
    height: 3.45vh;
    overflow: visible;
  }
  
  #mobile-linkedin-icon {
    position: absolute;
    top: 1vh;
    right: 11vh;
    width: 3.45vh;
    height: 3.45vh;
    overflow: visible;
  }
  
  #mobile-medium-icon {
    position: absolute;
    top: 1vh;
    right: 16vh;
    width: 3.45vh;
    height: 3.45vh;
    overflow: visible;
  }
  
  #mobile-introduction-content {
    position: relative;
    top: 20%;
    margin: auto;
    text-align: center;
  }
  #mobile-introduction-content-text {
    position: relative;
    margin-top: 5vh;
    text-align: center;
  }
  #mobile-introduction-content-img {
    
    width: 28.54vh;
    height: 28.63vh;
    left: 0px;
  }
  #mobile-title {
    overflow: hidden;
    line-height: 4.73vh;
    text-align: left;
    font-family: Geneva, Tahoma, Verdana, sans-serif;
    font-style: normal;
    font-weight: bold;
    font-size: 3.7vh;
    color: rgba(255, 255, 255, 1);
    text-transform: uppercase;
  }
  #mobile-subtitle {
    overflow: visible;
    line-height: 4.49vh;
    margin-top: 0.62vh;
    text-align: left;
    font-family: Geneva, Tahoma, Verdana, sans-serif;
    font-style: normal;
    font-weight: bold;
    font-size: 3.24vh;

  }
.yellow-text { 
  color: rgba(252, 215, 136, 1);
}
  .blue-text { 
    color: rgba(26, 40, 65, 1);
    
  }

#mobile-know-me-title {
  margin: 5vh auto 0 auto;
  width:90%;
  height: 8vh;
  display: block;
  
  background-color: rgba(167, 219, 216, 1);
  border-radius: 3rem 0.2rem ;
  white-space: nowrap;

}
#mobile-know-me-title h1{
  margin-top: 0;
  position: relative;
  z-index: 10;
  font-size: 5vh;
}
#mobile-know-me-highlight {
  position: relative;
  width:80vw;
  bottom: 9vh;
  z-index: 5;
}
#mobile-know-me-text {
  width: 80vw;
  margin: 0 auto 0 auto;
}
#mobile-polish-guy {
  display: block;
}
#mobile-after-grad {
  display: block;
}

.line {
  position: relative;
  right: 5vw;
  border-radius: 1rem;
  clear: both;
  display: block;
  width: 90vw;

  background-color:rgba(167, 219, 216, 1);;
  height: 0.35rem;
}



#mobile-done-so-far-title {
  position: relative;
  overflow: visible;
  text-align: left;
  width: 90vw;
  margin: 0 5vw;
  font-weight: bold;
  color: rgba(255, 255, 255, 1);

}
.section {
  width: 80vw;
  margin: 0 auto 0 auto;
}
#mobile-automation-accounting-title {
  color: rgba(252, 215, 136, 1);
}

.blue-stroke {
  -webkit-text-stroke: 2px rgba(26, 40, 65, 1);
}

.orange-stroke {
  -webkit-text-stroke: 2px rgba(243, 134, 48, 1);
}

#mobile-tools-title {
  color: white;
}

#mobile-tools-list {
  list-style-type: none;
}

#mobile-tools-list li {
  font-size: 1.6rem;
  margin: 2rem 0 2rem 0;
}
#mobile-end {
  height:58vh;
  background-color: rgba(26, 40, 65, 1);
  border: 1px solid rgba(26, 40, 65, 1);
  color: white;
  text-align: center;
}

#mobile-muniak-logo {
  position: relative;
  width: 27.92vw;
  height: 10vh;
  margin: 15vh auto 0 auto;
  overflow: visible;
}
#mobile-end-copyright-wrapper {
  text-align: left;
  margin-top: 15vh;
}

#mobile-end-copyright {
  position: absolute;
  top:1004vh;
  left: 2vw;
   color: white;

 }
 #mobile-end-copyright img {
   width: 2vh;
   height: 2vh;
 }
 #mobile-end-copyright span{
   vertical-align: 0.3vh;
   font-size: 2vh
 }

}

@media only screen and (min-width: 759px) {
  .mobile-content{
    display: none;
  }


  
}








/* RESPONSIVE WEBSITE END */