body {
  margin-top: 20px;
  margin-bottom: 20px;
}


.tooltips {
	position: relative;
	display: block;
	border-bottom: 1px dotted black;
	text-align: center;
}

.tooltips .tooltiptext {
	visibility: hidden;
	width: auto;
	background-color: black;
	color: #fff;
	text-align: center;
	border-radius: 6px;
	padding: 5px 0;

	/* Position the tooltip */
	position: absolute;
	z-index: 1;
	top: -5px;
	right: 105%;
}

.tooltips:hover .tooltiptext {
	visibility: visible;
}

.message-show{
	display: none;
}


#log-out, #admin{
	display: none;
}
#social-media{
	display: none;
}

#facebook{
	color: black;
	display: none;
}
#github{
	color: black;
	display: none;
}

#twitter{
	color: rgb(38, 181, 247);
	display: none;
}
#instagram{
	color: rgb(245, 141, 141);
	display: none;
}
#google{
	color: red;
	display: none;
}

#worker, #student{
	display: none;
}

#snackbar {
	visibility: hidden;
	min-width: 250px;
	margin-left: -125px;
	background-color: #333;
	color: #fff;
	text-align: center;
	border-radius: 2px;
	padding: 16px;
	position: fixed;
	z-index: 1;
	left: 50%;
	bottom: 30px;
	font-size: 17px;
  }
  
  #snackbar.show {
	visibility: visible;
	-webkit-animation: fadein 0.5s, fadeout 0.5s 2.5s;
	animation: fadein 0.5s, fadeout 0.5s 2.5s;
  }
  
  @-webkit-keyframes fadein {
	from {bottom: 0; opacity: 0;} 
	to {bottom: 30px; opacity: 1;}
  }
  
  @keyframes fadein {
	from {bottom: 0; opacity: 0;}
	to {bottom: 30px; opacity: 1;}
  }
  
  @-webkit-keyframes fadeout {
	from {bottom: 30px; opacity: 1;} 
	to {bottom: 0; opacity: 0;}
  }
  
  @keyframes fadeout {
	from {bottom: 30px; opacity: 1;}
	to {bottom: 0; opacity: 0;}
  }

  .container #admin_picture_select{
	position: absolute; bottom:40%; left:40%;
	text-align: center;
	justify-content: center;
	display: none;
  }

  .row .col-sm-2:hover #admin_picture_select{
	display: block;

  }


@media screen and (max-width: 768px){
	.container #admin_picture_select{
		position: absolute; top:70%; left:0%;
		text-align: center;
		justify-content: center;
		display: none;
	  }
}

@media screen and (max-width: 1000px){
	.container #admin_picture_select{
		position: absolute; top:40%; left:40%;
		text-align: center;
		justify-content: center;
		display: none;
		font-size: 10px;
	  }
}
  

.switch {
  position: relative;
  display: inline-block;
  width: 60px;
  height: 34px;
}

.switch input { 
  opacity: 0;
  width: 0;
  height: 0;
}

.slider {
  position: absolute;
  cursor: pointer;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: #ccc;
  -webkit-transition: .4s;
  transition: .4s;
}

.slider:before {
  position: absolute;
  content: "";
  height: 26px;
  width: 26px;
  left: 4px;
  bottom: 4px;
  background-color: white;
  -webkit-transition: .4s;
  transition: .4s;
}

input:checked + .slider {
  background-color: #2196F3;
}

input:focus + .slider {
  box-shadow: 0 0 1px #2196F3;
}

input:checked + .slider:before {
  -webkit-transform: translateX(26px);
  -ms-transform: translateX(26px);
  transform: translateX(26px);
}

/* Rounded sliders */
.slider.round {
  border-radius: 34px;
}

.slider.round:before {
  border-radius: 50%;
}



.no-js #loader { display: none;  }
.js #loader { display: block; position: absolute; left: 100px; top: 0; }
.se-pre-con {
	position: fixed;
	left: 0px;
	top: 0px;
	width: 100%;
	height: 100%;
	z-index: 9999;
	background: url(/img/giphy.gif) center no-repeat rgb(236, 237, 238);
}







.font-size38 {
  font-size: 38px;
}
.team-single-text .section-heading h4,
.section-heading h5 {
  font-size: 36px
}

.team-single-text .section-heading.half {
  margin-bottom: 20px
}

@media screen and (max-width: 1199px) {
  .team-single-text .section-heading h4,
  .section-heading h5 {
      font-size: 32px
  }
  .team-single-text .section-heading.half {
      margin-bottom: 15px
  }
}

@media screen and (max-width: 991px) {
  .team-single-text .section-heading h4,
  .section-heading h5 {
      font-size: 28px
  }
  .team-single-text .section-heading.half {
      margin-bottom: 10px
  }
}

@media screen and (max-width: 767px) {
  .team-single-text .section-heading h4,
  .section-heading h5 {
      font-size: 24px
  }
}


.team-single-icons ul li {
  display: inline-block;
  border: 1px solid #02c2c7;
  border-radius: 50%;
  color: #86bc42;
  margin-right: 8px;
  margin-bottom: 5px;
  -webkit-transition-duration: .3s;
  transition-duration: .3s
}

.team-single-icons ul li a {
  color: #02c2c7;
  display: block;
  font-size: 14px;
  height: 25px;
  line-height: 26px;
  text-align: center;
  width: 25px
}

.team-single-icons ul li:hover {
  background: #02c2c7;
  border-color: #02c2c7
}

.team-single-icons ul li:hover a {
  color: #fff
}

.team-social-icon li {
  display: inline-block;
  margin-right: 5px
}

.team-social-icon li:last-child {
  margin-right: 0
}

.team-social-icon i {
  width: 30px;
  height: 30px;
  line-height: 30px;
  text-align: center;
  font-size: 15px;
  border-radius: 50px
}

.padding-30px-all {
  padding: 30px;
}
.bg-light-gray {
  background-color: #f7f7f7;
}
.text-center {
  text-align: center!important;
}
img {
  max-width: 100%;
  height: auto;
}


.list-style9 {
  list-style: none;
  padding: 0
}

.list-style9 li {
  position: relative;
  padding: 0 0 15px 0;
  margin: 0 0 15px 0;
  border-bottom: 1px dashed rgba(0, 0, 0, 0.1)
}

.list-style9 li:last-child {
  border-bottom: none;
  padding-bottom: 0;
  margin-bottom: 0
}


.text-sky {
  color: #02c2c7
}

.text-orange {
  color: #e95601
}

.text-green {
  color: #5bbd2a
}

.text-yellow {
  color: #f0d001
}

.text-pink {
  color: #ff48a4
}

.text-purple {
  color: #9d60ff
}

.text-lightred {
  color: #ff5722
}

a.text-sky:hover {
  opacity: 0.8;
  color: #02c2c7
}

a.text-orange:hover {
  opacity: 0.8;
  color: #e95601
}

a.text-green:hover {
  opacity: 0.8;
  color: #5bbd2a
}

a.text-yellow:hover {
  opacity: 0.8;
  color: #f0d001
}

a.text-pink:hover {
  opacity: 0.8;
  color: #ff48a4
}

a.text-purple:hover {
  opacity: 0.8;
  color: #9d60ff
}

a.text-lightred:hover {
  opacity: 0.8;
  color: #ff5722
}

.custom-progress {
  height: 2000px;
  border-radius: 50px;
  box-shadow: none;
  margin-bottom: 25px;
}
.progress {
  display: -ms-flexbox;
  display: flex;
  height: 1rem;
  overflow: hidden;
  font-size: .75rem;
  background-color: #e9ecef;
  border-radius: .25rem;
}


.bg-sky {
  background-color: #02c2c7
}

.bg-orange {
  background-color: #e95601
}

.bg-green {
  background-color: #5bbd2a
}

.bg-yellow {
  background-color: #f0d001
}

.bg-pink {
  background-color: #ff48a4
}

.bg-purple {
  background-color: #9d60ff
}

.bg-lightred {
  background-color: #ff5722
}

body{
  font-size: 16px;
  color: #6f6f6f;
  font-weight: 400;
  line-height: 28px;
  letter-spacing: 0.8px;
  margin-top:20px;
  background-color: rgba(255, 0, 149, 0.04);
}

#about .container{
  max-width: 900px;
}

.textarea {
  border: 1px solid #ccc;
  font-family: inherit;
  font-size: inherit;
  padding: 1px 6px;
}
.textarea {
  display: block;
  width: 100%;
  overflow: hidden;
  resize: both;
  min-height: 40px;
  line-height: 20px;
}

.textarea[contenteditable]:empty::before {
  content: "Add an article";
  color: gray;
}


.slidecontainer-progress {
  width: 100%;
}

.slider-progress {
  -webkit-appearance: none;
  width: 100%;
  height: 25px;
  background: #d3d3d3;
  outline: none;
  opacity: 0.7;
  -webkit-transition: .2s;
  transition: opacity .2s;
}

.slider-progress:hover {
  opacity: 1;
}

.slider-progress::-webkit-slider-thumb {
  -webkit-appearance: none;
  appearance: none;
  width: 25px;
  height: 25px;
  background: #4CAF50;
  cursor: pointer;
}

.slider-progress ::-moz-range-thumb {
  width: 25px;
  height: 25px;
  background: #4CAF50;
  cursor: pointer;
}

#usr_show_phone{
  display: none;
}


.at-section__title {
  margin: 0 0 70px;
  color: #000;
  font-family: 'Roboto', sans-serif;
  font-size: 3.5rem;
  font-weight: 300;
  line-height: 2.625rem;
  text-align: center;
}
.at-grid {
  display: -webkit-box;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
          flex-direction: row;
  flex-wrap: wrap;
  background: #FFF;
  border: 1px solid #E2E9ED;
}
.at-grid[data-column="1"] .at-column {
  width: 100%;
  max-width: 100%;
  min-width: 100%;
  flex-basis: 100%;
}
.at-grid[data-column="2"] .at-column {
  width: 50%;
  max-width: 50%;
  min-width: 50%;
  flex-basis: 50%;
}
.at-grid[data-column="3"] .at-column {
  width: 33.3333333333%;
  max-width: 33.3333333333%;
  min-width: 33.3333333333%;
  flex-basis: 33.3333333333%;
}
.at-grid[data-column="4"] .at-column {
  width: 25%;
  max-width: 25%;
  min-width: 25%;
  flex-basis: 25%;
}
.at-grid[data-column="5"] .at-column {
  width: 20%;
  max-width: 20%;
  min-width: 20%;
  flex-basis: 20%;
}
.at-grid[data-column="6"] .at-column {
  width: 16.6666666667%;
  max-width: 16.6666666667%;
  min-width: 16.6666666667%;
  flex-basis: 16.6666666667%;
}
.at-grid[data-column="7"] .at-column {
  width: 14.2857142857%;
  max-width: 14.2857142857%;
  min-width: 14.2857142857%;
  flex-basis: 14.2857142857%;
}
.at-grid[data-column="8"] .at-column {
  width: 12.5%;
  max-width: 12.5%;
  min-width: 12.5%;
  flex-basis: 12.5%;
}
.at-grid[data-column="9"] .at-column {
  width: 11.1111111111%;
  max-width: 11.1111111111%;
  min-width: 11.1111111111%;
  flex-basis: 11.1111111111%;
}
.at-column {
  z-index: 0;
  position: relative;
  background: #FFF;
  box-shadow: 0 0 0 1px #E2E9ED;
  padding: 10px;
  box-sizing: border-box;
  -webkit-transition: box-shadow 0.2s ease, z-index 0s 0.2s ease, -webkit-transform 0.2s ease;
  transition: box-shadow 0.2s ease, z-index 0s 0.2s ease, -webkit-transform 0.2s ease;
  transition: box-shadow 0.2s ease, transform 0.2s ease, z-index 0s 0.2s ease;
  transition: box-shadow 0.2s ease, transform 0.2s ease, z-index 0s 0.2s ease, -webkit-transform 0.2s ease;
}
.at-column:before {
  content: "";
  display: block;
  padding-top: 100%;
}
.at-column:hover {
  z-index: 1;
  box-shadow: 0 8px 50px rgba(0, 0, 0, 0.2);
  -webkit-transform: scale(1.05);
          transform: scale(1.05);
  -webkit-transition: box-shadow 0.2s ease, z-index 0s 0s ease, -webkit-transform 0.2s ease;
  transition: box-shadow 0.2s ease, z-index 0s 0s ease, -webkit-transform 0.2s ease;
  transition: box-shadow 0.2s ease, transform 0.2s ease, z-index 0s 0s ease;
  transition: box-shadow 0.2s ease, transform 0.2s ease, z-index 0s 0s ease, -webkit-transform 0.2s ease;
}
.at-column:hover .at-social {
  margin: 16px 0 0;
  opacity: 1;
}
@media (max-width: 800px) {
  .at-column {
    width: 50% !important;
    max-width: 50% !important;
    min-width: 50% !important;
    flex-basis: 50% !important;
  }
}
@media (max-width: 600px) {
  .at-column {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 100% !important;
    flex-basis: 100% !important;
  }
}
.at-user {
  position: absolute;
  top: 50%;
  left: 0;
  width: 100%;
  -webkit-transform: translate(0, -50%);
          transform: translate(0, -50%);
  text-align: center;
}
.at-user__avatar {
  width: 98px;
  height: 98px;
  border-radius: 100%;
  margin: 0 auto 20px;
  overflow: hidden;
}
.at-user__avatar img {
  display: block;
  width: 100%;
  max-width: 100%;
}
.at-user__name {
  color: #313435;
  font-family: 'Roboto', sans-serif;
  font-size: 20px;
  font-weight: 500;
  line-height: 2.625rem;
}
.at-user__title {
  color: #6F808A;
  font-family: 'Roboto', sans-serif;
  font-size: 15px;
  line-height: 2.375rem;
}
.at-social {
  margin: 0 0 -18px;
  opacity: 0;
  -webkit-transition: margin 0.2s ease, opacity 0.2s ease;
  transition: margin 0.2s ease, opacity 0.2s ease;
}
.at-social__item {
  display: inline-block;
  margin: 0 10px;
}
.at-social__item a {
  display: block;
}
.at-social__item svg {
  fill: #515F65;
  display: block;
  height: 18px;
  -webkit-transition: fill 0.2s ease;
  transition: fill 0.2s ease;
}
.at-social__item svg:hover {
  fill: #788D96;
}

 body {
  /* background: #FFF; */
  font-family: 'Roboto', sans-serif;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
} 

.container-user {
  max-width: 1170px;
  width: 100%;
  margin: 100px auto;
  padding: 0 20px;
  box-sizing: border-box;
  -webkit-transform-origin: top center;
          transform-origin: top center;
  -webkit-transform: scale(0.8);
          transform: scale(0.8);
}


#add-degree, #add-experience, #add-skill{
  cursor: pointer
}
#delete-degree, #delete-experience, #delete-skill{
  cursor: pointer
}
#close-degree, #close-experience, #close-skill{
  cursor: pointer
}