body{
	background-color:	#F8F8FF;
	width:81%;
	height:95%;
	font-family: "Montserrat", sans-serif;
	color: #414141;
}
#swt-lan{
	width:10%;
	margin:1.5% 1% 1% 3%;
	padding:1% 1% 1% 1%;
	float: right;
}
.dropdown-menu{
	width: 20%;
	margin:1.5% 1% 1% 3%;
	padding:1% 1% 1% 1%;
	float: left;
}
#header{
	width:80%;
	height:100px;
	text-align: center;
	font-size: 80%;
	padding: 1% 1% 1% 1%;
}
p{
	font-size: 15px;
}
h5{
	font-size: 20px;
}
h4{
	font-size: 22.5px;
}
#ework h1, #eeducation h1, #eskills h1, #iwork h1, #ieducation h1, #iskills h1{
	text-align:center;
	color:#8CD2DB;
}
#ework h4, #iwork h4{
	text-align:center;
}
h3{
	font-size: 25px;
}
#menu{
	float:left;
	background-color: #fcfcfc;
	width: 23%;
	height:80%;
	margin: 1% 1% 0% 1%;
	padding:1% 1% 1% 1%;
	border-radius: 5px;
	box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2);
	overflow-y:scroll;
	overflow-x:hidden;
	overflow-x:hidden;
}
#image img{
	width: 70%;
	margin: 2% 15% 2% 15%;
}
#menu li{
	list-style: none;
	font-weight: bold;
	padding:1% 1% 1% 1%;
}
#menu ul li ul.dropdown {
	display:  inline-block; /* Display the dropdown*/
}
/*#menu ul li ul.dropdown {
	min-width: 10%;/* Set width of the dropdown */
	/*display: none;
	background-color: #fcfcfc;
	z-index:1;
	border-radius: 5px;
	box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}*/
#menu a{
	text-decoration:none;
	color:#272727;
}
#menu a:hover{
	color:#8CD2DB;
}
#contain{
	margin:1% 1% 0% 1%;
	padding:1% 1% 1% 2%;
	float:right;
	width:68%;
	height:80%;
	background-color: #fcfcfc;
	overflow-x:hidden;
	overflow-y:scroll;
	border-radius: 5px;
	box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2);
}
#contain h3{
	text-align: center;
	font-style: italic;
}
#contain a{
	text-decoration: none;
	color:#8CD2DB;
}
#contacts{
	text-align:center;
}
#contacts img{
	width:35px;
}
#eskills, #iskills{
	font-weight: bold;
}
#eabout, #ework, #ek2inn, #ecorteco, #eunipol, #meng, #ceng, #den{
	display:block;
}
#mita, #eeducation, #edegree, #ehschool, #eworkmenu, #eeducatonmenu, #eskills, #epskills, #elanguages, #etechskills, #iabout, #iwork, #ik2inn, #icorteco, #iunipol, #ieducation, #idegree, #ihschool, #iworkmenu, #ieducatonmenu,#iskills, #ipskills,#ilanguages,#itechskills, #dit {	
	display:none;	
}
#eabout, #iabout {
	text-align:center;
}
/*Skill bars*/
.skillcontainer p{
	margin:2% 0% 0% 0%;
}
.skillbar{
	border-radius: 20px;
	text-align:center;
	width:95%;
	border-style:solid;
	border-width:1px;
	border-color:#B0E0E6;
	background-color: #F0F8FF;
	margin: 2% 1% 0% 3%;
}
.skillbarIn{
	border-radius: 20px;
	background-color:#B0E0E6;
	font-weight: bold;
}
.excel, .office, .enovia, .html, .css {/*Advanced*/
	width:100%;
}
.vba{/*Intermediate*/
	width:67%;
}
.sql, .catia, .solidworks, .sap, .sharepoint, .project{/*Basic*/
	width: 34%;
}
.comm, .p-solving, .accurate, .multitask, .flexibility{
	width:80%;
}

.engwriting{
	width: 67%;
}
.englisten, .engread, .engspeak{
	width:83%;
}
.frread, .frwriting, .frspeak, .frlisten{
	width:17%;
}
/*Scroll bar*/
::-webkit-scrollbar{
	width:0.8em;
	height:0.8em;
	background: #E6F5F7;
	margin-right: 5px;
	border-radius: 5px;
}
::-webkit-scrollbar:hover{
	background-color: #C2E7EC;
	border: none;
}
::-webkit-resizer{
    -webkit-border-radius:4px;
    background-color: #8DB3B83;
border: none;
}
::-webkit-scrollbar-thumb{
    min-height:0.8em;
    min-width:0.8em;
    -webkit-border-radius:4px;
    background-color: #9ED9E0;
	border: none;
}
::-webkit-scrollbar-thumb:hover{
    background-color: #8CD2DB;
	border: none;
}
::-webkit-scrollbar-thumb:active{
    background-color: #7ACBD5;
	border: none;
}

/*Switch language*/
.switch {
  position: absolute;
  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-image: url("./img/select.png");
  background-size: cover;
  background-color: #012169;
  -webkit-transition: .4s;
  transition: .4s;
}

.slider:before {
  position: absolute;
  content: "";
  height: 26px;
  width: 26px;
  left: 4px;
  bottom: 4px;
  background-color: white;
  background-size:cover;
  background-image: url("./img/plane-it.png");
  -webkit-transition: .4s;
  transition: .4s;
}

input:checked + .slider {
  background-color: #009246;
  background-image: url("./img/select.png");
  background-size: cover;
}

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

input:checked + .slider:before {
  -webkit-transform: translateX(26px);
  -ms-transform: translateX(26px);
  transform: translateX(26px);
  background-size:cover;
  background-image: url("./img/plane-uk.png");
}

/* Rounded sliders */
.slider.round {
  border-radius: 34px;
  box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
  
}

.slider.round:before {
  border-radius: 50%;
  box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2);
}

/*Dropdown menu*/

.dropmenubt{
  /*background-color: #4CAF50;*/
  /*color: white;*/
  width:30px;
  height:30px;
}
.dropmenubt{
	 border: none;
	 background-color: none;
}

.dropdown-menu {
  display: inline-block;
}

.drpdwn-cnt {
  display: none;
  position: absolute;
  background-color: #f1f1f1;
  z-index: 1;
  border-radius: 5px;
  box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}
/*.drpdwn-cnt li{
	list-style: none;
	font-weight: bold;
	padding:1% 1% 1% 1%;
}*/
.drpdwn-cnt a {
  color: black;
  text-decoration: none;
  display: block;
}

.dropdown-menu:hover .drpdwn-cnt {display: block;}

.dropdown-menu li{
	list-style: none;
	font-weight: bold;
	padding:1% 1% 1% 1%;
}
.dropdown-menu ul li ul.dropdown {
	display:  inline-block; /* Display the dropdown*/
}
.dropdown-menu ul li ul.dropdown {
	min-width: 10%;/* Set width of the dropdown */
	display: none;
	background-color: #fcfcfc;
	z-index:1;
	border-radius: 5px;
	box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}*/
.dropdown-menu a{
	text-decoration:none;
	color:#272727;
}
.dropdown-menu a:hover{
	color:#8CD2DB;
}

@media screen and (max-width:500px) {
	body{
		width:95%;
	}
	#image img{
		width: 40%;
		margin: 2% 30% 2% 30%;
	}
	#menu{
        background-color:	#F8F8FF;
		margin-top: 130px;
		width: 96%;
		height: 100%;
		overflow:visible;
		box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0);
    }
	#contain{
		width:96%;
		height:100%;
		background-color:	#F8F8FF;
		overflow:visible;
		box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0);
	}
	#swt-lan{
		float:right;
		width:12%;
		/*margin:1.5% 1% 1% 3%;
		padding:1% 1% 1% 1%;*/
	}
	.dropdown-menu{
		float:left;
		width: 20%;
		/*margin:1.5% 1% 1% 3%;
		padding:1% 1% 1% 1%;*/
	}
	#header{
		width:80%;
		height:90px;
		text-align: center;
		font-size: 60%;
	}
	#header-container{
		margin: -10px;
		background-color:	#F8F8FF;
		width: 100%;
		position: fixed;
		border-radius: 5px;
		box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2);
	}
}