/* GLOBAL STYLES */
body {
    background: #fff;
    /* display: flex;
    justify-content: center; */
    height:100vh;
    width:100vw;
}

.typeText {
  font-size: 4vw;
  padding-left: 20px;
  padding-right:20px
}


.mainText {
    /* font-size: 4vw; */
    font-size: 2.5rem;
    /* padding-left: 20px;
    padding-right:20px */
}



.is-primary {
  background-color: #007bff;
  color: #fff;
}

.subText {
  font-size: 1.75rem;
  /* font-size: 2vw; */
}

.section.skills {
  margin-top: -14rem;
  padding-bottom: 1rem;
}

.section {
  padding: 5rem 1.5rem;
}


.adjust-section {
  margin-top: -12rem;
  /* padding-bottom: 1rem; */
}

.title-1 {
  font-size: 1.5rem !important;
  margin-bottom: 1.5rem;
  font-family: "eurostile",sans-serif;
  font-weight: 800;
  color: #293347;
}

.title-4 {
  font-size: 1.5rem !important;
  margin-bottom: 1.5rem;
  font-family: "eurostile",sans-serif;
  font-weight: 800;
  color: #fff;
}

.portfolio-filter {
  list-style: none outside none;
  margin: 0px 0 40px 0;
  padding: 0;
  text-align: center;
}

.portfolio-filter > li {
  display: inline-block;
}


.portfolio-filter > li a {
  background: none repeat scroll 0 0 #FFFFFF;
  font-size: 2vw;
  font-weight: 400;
  margin-right: 20px;
  margin-top:20px;
  text-transform: uppercase;
  transition: all 0.9s ease 0s;
  -moz-transition: all 0.9s ease 0s;
  -webkit-transition: all 0.9s ease 0s;
  -o-transition: all 0.9s ease 0s;
  border: 1px solid #F2F2F2;
  outline: none;
  border-radius: 3px;
}

/* portfolio-images  */

.portfolio-items{
    list-style: none outside none;
    /* margin: 0 0 40px 0; */
    /* margin-left: -100px; */
    padding: 0;
    text-align: center;
}

.isotope {
  -webkit-transition-property: height, width;
  -moz-transition-property: height, width;
  -ms-transition-property: height, width;
  -o-transition-property: height, width;
  transition-property: height, width;

}

.isotope, .isotope .isotope-item {
  -webkit-transition-duration: 0.8s;
  -moz-transition-duration: 0.8s;
  -ms-transition-duration: 0.8s;
  -o-transition-duration: 0.8s;
  transition-duration: 0.8s;
}

.btn {
  padding: .5rem .95rem;
}
.flex {
  padding:4px;
}

.card_media_background{
  height: 190px;
  width: 250px;
}

.card_media_backgroundwinner{
  height: 200px;
  width: 300px;
}

/* card size */

.card {
  height: auto; 
  width: auto;
}

.container {
  padding-right: 0px; 
}

/* Chip Design */

.chip {
  background: #e0e0e0;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  vertical-align: middle;
  border-radius: 28px;
  border: 1px solid transparent;
  font-size: 13px;
  margin: 2px;
  outline: none;
  position: relative;
  -webkit-transition: .3s cubic-bezier(.25,.8,.5,1);
  transition: .3s cubic-bezier(.25,.8,.5,1);
  padding-right: 5px;

}

.chip_content {
  border-radius: 28px;
  cursor: default;
  height: 32px;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  padding: 0 12px;
  white-space: nowrap;
  z-index: 1;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  vertical-align: middle;
}

.white_text {
  color: #fff !important;
}

.icon {
  width:25px;
  height:15px;
  padding-left: 8px;

  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-font-feature-settings: "liga";
  font-feature-settings: "liga";
  font-size: 20px;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  line-height: 1;
  -webkit-transition: .3s cubic-bezier(.25,.8,.5,1);
  transition: .3s cubic-bezier(.25,.8,.5,1);
  vertical-align: middle;

}

.headline {
  font-size: 24px!important;
  font-weight: 400;
  line-height: 32px!important;
  letter-spacing: normal!important;
  margin-bottom: 0!important;
}

.card__actions {
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  padding: 8px 4px;
  display: flex;
}

.btn__content {
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  border-radius: inherit;
  color: inherit;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  height: inherit;
  -webkit-box-flex: 1;
  -ms-flex: 1 0 auto;
  flex: 1 0 auto;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  margin: 0 auto;
  /* padding: 0 16px; */
  -webkit-transition: .3s cubic-bezier(.25,.8,.5,1);
  transition: .3s cubic-bezier(.25,.8,.5,1);
  white-space: nowrap;
  width: inherit;
}

.hearticon {
 margin-top:3px;
}

.likesText {
  color:#1976d2 !important;
  padding-left: 10px;
  margin-top:3px;
}

.leftPush {
  padding-left:10px;
}

/* Colours */

.dark-blue-1 {
  background-color: #37474f!important;
  border-color: #37474f!important;
}

.blue {
  background-color: #1565c0!important;
  border-color: #1565c0!important;
}

.orange {
  background-color: #f4511e!important;
  border-color: #f4511e!important;
}

.light-orange {
  background-color: #ff9800!important;
  border-color: #ff9800!important;
}


.green {
  background-color: #4caf50!important;
  border-color: #4caf50!important;
}

.light-green {
  background-color: #43a047!important;
  border-color: #43a047!important;
}

.lime-green {
  background-color: #64dd17!important;
  border-color: #64dd17!important;
}

.light-blue {
  background-color: #61dafb !important;
  border-color: #61dafb !important;
}

/* experience */

#experience {
  padding: 50px 15px;
  text-align: center;
  border-bottom: 1px solid #dcd9d9;
}

#experience-timeline {
  margin: -10px auto 0 auto;
  position: relative;
  
}

#experience-timeline:before {
  position: absolute;
  content: '';
  top: 0;
  bottom: 0;
  left: 153px;
  right: auto;
  height: 100%;
  width: 3px;
  background: #3498db;
  z-index: 0;
}

#experience-timeline:after {
  position: absolute;
  content: '';
  width: 3px;
  height: 40px;
  background: #3498db;
  background: linear-gradient(to bottom, #3498db, rgba(52,152,219,0));
  top: 100%;
  left: 153px;
}

.vtimeline-date {
  width: 260px;
  text-align: right;
  position: absolute;
  left: 0;
  top: 10px;
  font-weight: 300;
  color: #374054;
}

.vtimeline-point {
  position: relative;
  display: block;
  vertical-align:top;
  margin-bottom: 30px;
}
/* the icon */
.vtimeline-icon {
  position: relative;
  color: #fff;
  width: 50px;
  height: 50px;
  background: #3498db;
  border-radius: 50%;
  float: left;
  z-index: 99;
  margin-left: 130px;
}

.vtimeline-icon i {
  display: block;
  font-size: 2em;
  margin-top: 10px;
  text-align: center;
}

/* the box */
.vtimeline-content {
  margin-left: 250px;
  background: #fff;
  border: 1px solid #e6e6e6;
  padding: 15px;
  border-radius: 3px;
  text-align: left;
  width:70%;
}

/* Last Section */

.helpText {
  font-size: 1.5rem;
}

.section.call-to-action .box {
  padding: 1.5rem 2rem;
  margin-top: -8rem;
  background-color: #293347;
  box-shadow: 0 5px 5px 0 rgba(0,0,0,0.2), 0 0 0 1px #293347;
}

/* Black Box */

.column {
  display: block;
  flex-basis: 0;
  flex-grow: 1;
  flex-shrink: 1;
  padding: .75rem;
}

.columns {
  margin-left: -.75rem;
  margin-right: -.75rem;
  margin-top: -.75rem;
  display: flex;
}

.level-item {
  align-items: center;
  display: flex;
  flex-basis: auto;
  flex-grow: 1;
  flex-shrink: 0;
  justify-content: center;
  color: #fff;
}

.title {
  color: #fff;
  font-size: 2rem;
  font-weight: 800;
  line-height: 1.125;
}

.section.call-to-action .box p {
  font-size: 18px;
}


.section.call-to-action .box .buttonContact.is-outlined.is-rounded.is-medium {
  color: #fff;
  padding: 1.25em 2em;
  font-weight: 400;
  border-width: 2px;
}

.level {
  align-items: center;
  justify-content: space-between;
}

.buttonContact.is-primary.is-outlined {
  background-color: transparent;
  border-color: #3498db;
  color:#3498db;
}

.buttonContact.is-rounded {
  border-radius: 290486px;
  padding-left: 1em;
  padding-right: 1em;
}

.buttonContact.is-rounded {
  border-radius: 290486px;
  padding-left: 1em;
  padding-right: 1em;
}

.buttonContact{
  -webkit-appearance: none;
    align-items: center;
    border: 1px solid transparent;
    border-radius: 4px;
    box-shadow: none;
    display: inline-flex;
    font-size: 1rem;
    height: 2.25em;
    justify-content: flex-start;
    line-height: 1.5;
    padding-bottom: calc(0.375em - 1px);
    padding-left: calc(0.625em - 1px);
    padding-right: calc(0.625em - 1px);
    padding-top: calc(0.375em - 1px);
    position: relative;
    vertical-align: top;
    user-select: none;
    cursor: pointer;
    justify-content: center;
    text-align: center;
    white-space: nowrap;
}

.row {
  margin-left: 0px;
  margin-right: 0px;
}
.column{
  padding-right: 15px;
}



.box {
  background-color: #fff;
  border-radius: 6px;
  box-shadow: 0 5px 5px 0 rgba(233,240,243,0.5), 0 0 0 1px #E6ECF8;
  color: #293347;
  display: block;
  padding: 1.25rem;
}


.single-card  {
  padding:2rem;
}


/* contact form */

.navbar.is-planner {
  border-bottom: 1px solid #E6ECF8;
}

.title-2 {
  color: #293347;
  font-size: 2rem;
  font-weight: 400;
  line-height: 1.125;
  word-break: break-word;
}

.share h4 {
  font-size: 1.4em;
  line-height: 1.7em;
  color: #8a8a8a;
  font-weight: 700;
  font-family: MontSerrat,Tahoma,Arial,sans-serif;
  font-weight: 700;
}

.is-half, .column.is-half-tablet {
  flex: none;
  width: 50%;
}

.label {
  color: #363636;
  display: block;
  font-size: 1rem;
  font-weight: 700;
}

.is-form-page .container form label.label {
  font-weight: 400;
  font-family: "eurostile",sans-serif;
  font-size: 1.2rem;
  color: rgba(41,51,71,0.65);
}

.control {
  box-sizing: border-box;
  clear: both;
  font-size: 1rem;
  position: relative;
  text-align: left;
}

form textarea {
  border-color: #E6ECF8;
  color: #293347;
  box-shadow: none;
  font-weight: 300;
}

.textarea {
  display: block;
  max-width: 100%;
  min-width: 100%;
  padding: 0.625em;
  width:100%;
  resize: vertical;
}

.input {
  -webkit-appearance: none;
  align-items: center;
  border: 1px solid transparent;
  border-radius: 4px;
  box-shadow: none;
  display: inline-flex;
  font-size: 1rem;
  height: 2.25em;
  justify-content: flex-start;
  line-height: 1.5;
  padding-bottom: calc(0.375em - 1px);
  padding-left: calc(0.625em - 1px);
  padding-right: calc(0.625em - 1px);
  padding-top: calc(0.375em - 1px);
  position: relative;
  vertical-align: top;
  background-color: #fff;
  max-width: 100%;
  width: 100%;
  border-color: #E6ECF8;
  color: #293347;
  box-shadow: none;
  font-weight: 300;

}

.portfolio-filter > li a:hover,
.portfolio-filter > li a.active{
  color:#fff;
  background: #007bff;
  border: 1px solid #007bff;
  box-shadow: none;
  -webkit-box-shadow: none;
}

.btn__content:hover {
  color:#fff;
  box-shadow: none;
  -webkit-box-shadow: none;
  background: #007bff;
  padding:5px;
}



 /* Extra small devices (portrait phones, less than 576px) */
@media (max-width: 575px) { 
  
  .space{
    padding-top:20px;
  }

  .title-mobile {
    font-size: 2rem;
  }

  .vtimeline-content {
    margin-left: 80px;
    background: #fff;
    border: 1px solid #e6e6e6;
    padding: 15px;
    border-radius: 3px;
    text-align: left;
    /* width:20%; */
  }

  #experience-timeline:before {
    position: absolute;
    content: '';
    top: 0;
    bottom: 0;
    left: 33px;
    right: auto;
    height: 100%;
    width: 3px;
    background: #3498db;
    z-index: 0;
  }

  /* the icon */
  .vtimeline-icon {
    position: relative;
    color: #fff;
    width: 50px;
    height: 50px;
    background: #3498db;
    border-radius: 50%;
    float: left;
    z-index: 99;
    margin-left: 10px;
  }
  
  #experience-timeline:after {
    position: absolute;
    content: '';
    width: 3px;
    height: 40px;
    background: #3498db;
    background: linear-gradient(to bottom, #3498db, rgba(52,152,219,0));
    top: 100%;
    left: 33px;
  }
    
  .mainText {
    font-size: 6vw;
    /* padding-left: 20px;
    padding-right:20px */
  }
    
  .subText {
    font-size: 4vw;
  }

}