﻿body {
    font-family: 'Prompt', sans-serif;
  
}
 a{
     text-decoration-line: none;
     text-decoration: none;
     color: #000;
}
a:active{
    text-decoration: none;
    text-decoration-line: none;
}
a:focus{ text-decoration: none;}
.ullist {
    font-family: 'Prompt', sans-serif;
    background: rgb(0, 0, 0); background: rgba(0, 0, 0, 0.5);
    position:fixed;
    margin-top:0;
    list-style-type:none;
    width:100%;
    display:inline-block;
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
    z-index:2;
   
}
.barwelcome 
{    position: absolute;
    background: rgb(0 15 25 / 12%);
    width: 100%;
    height: 100vh;
    z-index: 4;
    /* text-align: center; */
}
.colHome{ margin-top: 6%;margin-left: 6%;}
.barSMS{
    position: absolute;
    width: 25%;
    height: 50vh;
    z-index: 4;
    text-align: center;
    margin-left: 70%;
    margin-top: 25%;
}
.barApp{
    position: absolute;
    width: 4%;
    height: 14vh;
    z-index: 4;
    text-align: center;
    margin-left: 95%;
    margin-top: 28%;
    border-top-left-radius: 10px;
    border-bottom-left-radius: 10px;
    animation: barapp 0.5s;
}
 @keyframes barapp{
     from{margin-left:110%}
     to{margin-left:95%;}
 } 
.logowelcome {
    width: 9%;
    float: left;
    margin-left: 4%;
    text-shadow: 2px 2px 4px #000000;
}
.Down {
  width:60%;
  margin-top:30%;
  margin-left:-2%;
 }
 .fontwel{  position:absolute;
            margin-top:25vh;
            margin-left:36%;
            font-size:20px;
            font-weight:bold;
            background: -webkit-linear-gradient(white, white);
            -webkit-background-clip: text;-webkit-text-fill-color: transparent; 
            
 } 
 .fontwelEN{ position: absolute;
    margin-top: 25vh;
    margin-left: 15.5vh;
    font-size: 20px;
    font-weight: bold;
    background: -webkit-linear-gradient(#ffffff, white);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    
} 
.visit {
    width: 13%;
    text-align: center;
    background: rgb(6 30 43);
    padding: 6px;
    border-radius: 6px;
    cursor: pointer;  
}
    
.logo {
    width:400px;
    margin:1px; 
    padding:5px;
   
   }
.fontsub{
    margin-top: 2%;
    margin-left: 1%;
    font-size: 35px;
}
.fontcasal{
    color:white; font-size: 21px;
}
.fontbar {
    float:right;
    text-align:center;
    height:100%;
    display:inline-block;
    border-radius: 5px;
    margin:12px; 
    padding:10px;
    margin-right:20px;
    font-weight:bold;
    color:white;
    font-size:12px;
}
.fontbar:hover {
    background-color:white;
    text-decoration:none;
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}
.fonthomewel {
    position:absolute;
    color:white;
 
}
.foot {
    background-color:#1f6b9d;
    color:whitesmoke;
}
.carosalScle { 
    margin-left: 9%;
    text-align: center;
    width: 32%;
    height: 20vh;
    /* border: 3px solid #e6e6e6; */
    border-radius: 5px;
    background: rgb(146 227 251 / 25%);
    padding: 39px;
}
.line {
    margin-left:8vh;
    margin-top:2vh;
    width:250px;
    border:0.5px solid #dbdbdb;
}
.fontcas1 {
    text-shadow: 2px 2px 4px #000000;
    font-size: 38px;
}
.fontcas1EN {
    text-shadow: 2px 2px 4px #000000;
    font-size: 21px;
    margin-left: -32vh;
}
.fontcas2 {
        text-shadow: 2px 2px 4px #000000;
     font-size:20px; margin-left:5vh;
}
.fontcas2EN {
    text-shadow: 2px 2px 4px #000000;
    font-size: 17px;
    margin-left: -4vh;
}
.fontcS1{
       text-shadow: 2px 2px 4px #000000;
     font-size:25px;
     margin-left:-10vh
}
.fontcS1EN{
    text-shadow: 2px 2px 4px #000000;
    font-size: 19px;
    margin-left: -2vh;
}
.fontcS2{
       text-shadow: 2px 2px 4px #000000;
     font-size:20px;
     margin-left:14vh;
}
.fontcS2EN{
    text-shadow: 2px 2px 4px #000000;
    font-size: 18px;
    margin-left: 12vh;

}
.fontperson {
       text-shadow: 2px 2px 4px #000000;
    font-size:20px;
    margin-left:-10vh
}
.fontpersonEN {
    text-shadow: 2px 2px 4px #000000;
 font-size:20px;
 margin-left:-6vh
}
.fontperson2 {
       text-shadow: 2px 2px 4px #000000;
    font-size:20px;
    margin-left:27vh
}
#menu li {
	display:inline-block;
	margin: 10px;
	color: #000;
	background:#fff;
	background: rgba(255,255,255, 0.8);
	-webkit-border-radius: 10px;
            border-radius: 10px;
}
#menu li.active{
	background:#666;
	background: rgba(0, 28, 58, 0.5);;
	color: #fff;
}
#menu li a{
	text-decoration:none;
	color: #000;
}
#menu li.active a:hover{
	color: #000;
}
#menu li:hover{
	
}
#menu li a,
#menu li.active a{
	padding: 9px 18px;
	display:block;
     
}
#menu li.active a{
    font-size: 16px;
    font-weight: bold;
    background: -webkit-linear-gradient(white, white);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}
#menu{
	position:fixed;
	top:0;
	left:54%;
	height: 40px;
	z-index: 1;
	width: 100%;
	padding: 0;
	margin:0;
  
}

.menumo{display: none;}



.iconmanu{position:absolute; width:80%; z-index:1; cursor:pointer; }
.iconJOB{margin-left: -48%;margin-top: 14vh; }#hoverJob{position: absolute;width: 88%;margin-left: -1.5%;margin-top: 13.54vh;animation: hoverapp 0.3s; }
.iconHR{margin-left: -48%;margin-top: 21vh;}#hoverHR{position: absolute;width: 88%;margin-left: -1.5%;margin-top: 20.54vh;animation: hoverapp 0.3s;}
.iconAVL{margin-left: -48%;margin-top: 28vh; }#hoverAVL{position: absolute;width: 88%;margin-left: -1.5%;margin-top: 27.54vh;animation: hoverapp 0.3s; }
.iconS{margin-left: -48%;margin-top: 35vh; }#hoverS{position:absolute; width:88%; margin-left:-1.5%; margin-top:34.54vh; animation:hoverapp 0.3s; }
.iconT{width: 82%;margin-top: 87%; margin-left: -52%;}#hoverT{position: absolute;width: 89%;margin-left: -5%;margin-top: 6.3vh;animation: hoverapp 0.3s; }
.talk{position:absolute; width:60%; margin-left:-5vh;}.talk2{position:absolute; color:#012a7e; width:80%;  }
.talkJob{margin-top: 15vh;}.talkJob2{margin-top: 17vh;margin-left: 15vh;}
.talkHR{margin-top:22vh;}.talkHR2{margin-top: 24vh;margin-left: 14vh;}
.talkAVL{margin-top: 29vh;}.talkAVL2{margin-top: 31vh;margin-left: 15vh;}
.talkS{margin-top:36vh;}.talkS2{margin-top:38vh; margin-left:15vh; }
.talkT{margin-top: 8vh;}.talkT2{margin-top: 10vh; margin-left: 15vh; }

.scalapp{
    position: absolute;
    width: 100%;
    margin-top: -2%;
}
 @keyframes hoverapp{
     from{ transform:scale(0);opacity:0; }
     to{ transform:scale(1,1); opacity:1;  }
 } 
  @keyframes hoverapp2{
     from{ margin-left:10%; opacity:0; }
     to{ opacity:1;  }
 } 
  @keyframes hoverout{
     0%{  opacity:1; }25%{opacity:1;}50%{opacity:1;}75%{opacity:0.5;}
     100%{   margin-left:13%; opacity:0;  }
 } 
 @media screen and (min-width: 300px) and (max-width:500px) { 
    .mosy{display: none;}
    .barSMS {position: absolute;width: 25%;height: 50vh;z-index: 4;text-align: center;margin-left: 70%;margin-top: 4%;}
    .barApp {width: 14%;margin-left: 87%;margin-top: 26%;}
    .iconAVL {margin-top: 18vh;}.iconHR {margin-top: 11vh;}.iconJOB {margin-top: 4vh;}.iconT{margin-top: -40%;}
    .talkJob2 {margin-top: 15vh; margin-left: -3vh;}
    .talk2 {position: absolute;color: #012a7e;width: 80%;font-size: 9px;}.talkJob {margin-top: 14vh;}.talk {position: absolute;width: 100%;margin-left: -12vh;}
    .talkT { margin-top: 8vh;}.talkHR {margin-top: 21vh;}.talkAVL {margin-top: 29vh;}
    .talkT2 {margin-top: 9vh;margin-left: -3vh;}.talkHR2 {margin-top: 21vh;margin-left: -4vh;}
    .talkAVL2 {margin-top: 30vh;margin-left: -4vh;}
    /* .barwelcome {display: block;margin-left: 10%;width: 79%;height: 13%; margin-top: 72%;} */
    .fontsub{margin-top: 5%;margin-left: 13%;font-size: 14px;}
    .fontwel {display: block;margin-top: 38%;margin-left: 33%;}
    .carosalScle{width: 100%; margin-left: 0; height: 27vh;}
    .fontcasal{font-size: 13px;}
    .logowelcome {width: 27%;margin-top: 16%;margin-left: 20vh;}
    .colHome{ margin-left: 0%;}
    .fontperson {font-size: 13px; margin-left: -5%;}
    .fontperson2 {font-size: 13px; margin-left: -4%;}
    .fontcS2{font-size: 14px;margin-left: -9%;}
    .fontcS1{font-size: 14px;margin-left: -9%;}
    .fontcas1{font-size: 17px;margin-left: -7%;}
    .fontcas2{font-size: 14px;margin-top: -3%;margin-left: -10%;}
    .fontcas1EN,.fontcas2EN,.fontcS1EN,.fontcS2EN,.fontpersonEN {font-size: 12px;}
    .fontcas1EN {margin-left: -29vh;}
    .Down{display: block;margin-left: 17%; margin-top: 37%;}
    .boxfont1{font-size: 10px;margin-top: 0%;margin-left: 13%;}
    .visit{width: 56%; font-size: 14px; margin-left: 4%;}
    #hoverT {width: 87%;margin-left: -5%;margin-top: -3.05vh;}
    #hoverHR {margin-top: 10.54vh;}#hoverAVL {margin-top: 17.54vh;}
    #hoverJob {margin-top: 3.54vh;}
    .menuweb{display: none;}
    .menumo{position: absolute;display: block;z-index: 1;margin-left: 84%;}
    #menu {
        position: fixed;
        top: 0;
        left: 46%;
        height: 40px;
        z-index: 70;
        width: 100%;
        padding: 0;
        margin: 0;
    }
    .mocon{
        position: absolute;
        font-size: 12px;
        width: 11vh;
        height: 3vh;
        margin-left: -4vh;
        margin-top: 1vh;
        background: rgba(255,255,255,0.5);
        text-align: center;
        border-radius: 5px;}
    .moLan{position: absolute;font-size: 12px;margin-left: -15vh;margin-top: 1vh;
           text-align: center;background: rgba(255,255,255,0.5);width: 9vh;height: 3vh;border-radius: 5px;}
.fontwelEN{margin-top: 16vh; margin-left: 14.5vh; font-size: 18px;} 
}
@media screen and (min-width: 500px) and (max-width:750px){ 
    .mosy{display: none;}
    .barSMS {position: absolute;width: 11%;height: 50vh;z-index: 4;text-align: center;margin-left: 86%;margin-top: 8%;}
    .carosalScle {margin-top: 7%;margin-left: 5%;text-align: center;width: 100%;}
    .barApp {width: 5%;margin-left: 95%; margin-top: 15%;}
    .iconAVL {margin-top: 30vh;}.iconHR {margin-top: 17vh;}.iconJOB {margin-top: 4vh;}.iconT{margin-top: -73%;}
    .talkJob2 {margin-top: 15vh; margin-left: -3vh;}
    .talk2 {position: absolute;color: #012a7e;width: 80%;font-size: 7px;}.talkJob {margin-top: 14vh;}.talk {position: absolute;width: 100%;margin-left: -21vh;}
    .talkT { margin-top: 8vh;}.talkHR {margin-top: 34vh;}.talkAVL {margin-top: 48vh;}
    .talkT2 {margin-top: 9vh;margin-left: -3vh;}.talkHR2 {margin-top: 34vh;margin-left: -4vh;}
    .talkAVL2 {margin-top: 50vh;margin-left: -4vh;}
    .barwelcome {margin-left: 27%; width: 45%;height: 24%;margin-top: 18%;}
    .fontwel {margin-top: 24%;margin-left: 33%;}
    .fontcasal{font-size: 13px;}
    .logowelcome {width: 27%;margin-top: 16%;margin-left: 20vh;}
    .fontperson {font-size: 13px; margin-left: -5%;}
    .fontperson2 {font-size: 13px; margin-left: -4%;}
    .fontcS2{font-size: 14px;margin-left: -9%;}
    .fontcS1{font-size: 14px;margin-left: -9%;}
    .fontcas1{font-size: 17px;margin-left: -7%;}
    .fontcas2{font-size: 14px;margin-top: -3%;margin-left: -10%;}
    .fontcas1EN,.fontcas2EN,.fontcS1EN,.fontcS2EN,.fontpersonEN {font-size: 12px;}
    .fontcas1EN {margin-left: -29vh;}
    .Down{display: block;margin-left: 17%; margin-top: 37%;}
    .boxfont1{font-size: 10px;margin-top: 0%;margin-left: 8%;}
    .visit{display: block;margin-top: 31%;margin-left: 45%; width: 7%;}
    #hoverT {width: 87%;margin-left: -5%;margin-top: -10.05vh;}
    #hoverHR {margin-top: 16.54vh;}#hoverAVL {margin-top: 29.54vh;}
    #hoverJob {margin-top: 3.54vh;}
    .menuweb{display: none;}
    .menumo{position: absolute;display: block;z-index: 1;margin-left: 84%;}
    #menu {
        position: fixed;
        top: 0;
        left: 46%;
        height: 40px;
        z-index: 70;
        width: 100%;
        padding: 0;
        margin: 0;
    }
    .mocon{position: absolute;
    position: absolute;
    font-size: 12px;
    width: 20vh;
    height: 5vh;
    margin-left: -4vh;
    margin-top: 1vh;
    background: rgba(255,255,255,0.5);
    text-align: center;
    border-radius: 5px;
    }
    .moLan{position: absolute;
        font-size: 12px;
        margin-left: -18vh;
        margin-top: 1vh;
        text-align: center;
        background: rgba(255,255,255,0.5);
        width: 12vh;
        height: 5vh;
        border-radius: 5px;}
}
@media screen and (min-width: 750px) and (max-width:800px) { 
    .mosy{display: none;}
    .barSMS {position: absolute;width: 17%;height: 50vh;z-index: 4;text-align: center;margin-left: 79%;margin-top: 4%;}
    .barApp {width: 9%; margin-left: 91%; margin-top: 19%;}
    .iconAVL {margin-top: 18vh;}.iconHR {margin-top: 11vh;}.iconJOB {margin-top: 4vh;}.iconT{margin-top: -40%;}
    .talkJob2 {margin-top: 15vh; margin-left: -3vh;}
    .talk2 {position: absolute;color: #012a7e;width: 80%;font-size: 9px;}.talkJob {margin-top: 14vh;}.talk {position: absolute;width: 100%;margin-left: -12vh;}
    .talkT { margin-top: 8vh;}.talkHR {margin-top: 21vh;}.talkAVL {margin-top: 29vh;}
    .talkT2 {margin-top: 9vh;margin-left: -3vh;}.talkHR2 {margin-top: 21vh;margin-left: -4vh;}
    .talkAVL2 {margin-top: 30vh;margin-left: -4vh;}
    .barwelcome {display: block;margin-left: 10%;width: 79%;height: 13%; margin-top: 52%;}
    .fontwel {display: block;margin-top: 21%;margin-left: 42%;}
    .fontwelEN {display: block;margin-top: 21%;margin-left: 40%;}
    .logowelcome {width: 27%;margin-top: 16%;margin-left: 20vh;}
    .fontperson {font-size: 13px; margin-left: -10%;}
    .fontperson2 {font-size: 13px;margin-left: -9%;}
    .fontcS2{font-size: 14px;margin-left: -9%;}
    .fontcS1{font-size: 14px;margin-left: -9%;}
    .fontcas1{font-size: 17px;margin-left: -9%;margin-top: -1%;}
    .fontcas2{font-size: 14px;margin-top: -1%;margin-left: -11%;}
    .fontcas1EN,.fontcas2EN,.fontcS1EN,.fontcS2EN,.fontpersonEN {font-size: 12px;}
    .fontcas1EN {margin-left: -29vh;}
    .Down{display: block;margin-left: 17%; margin-top: 37%;}
    .boxfont1{font-size: 10px;margin-top: 0%;margin-left: -1%;}
    .visit{display: block;margin-top: 28%;margin-left: 44%;width: 10%;}
    #hoverT {width: 87%;margin-left: -5%;margin-top: -3.05vh;}
    #hoverHR {margin-top: 10.54vh;}#hoverAVL {margin-top: 17.54vh;}
    #hoverJob {margin-top: 3.54vh;}
    .menuweb{display: none;}
    .menumo{position: absolute;display: block;z-index: 1;margin-left: 84%;}
    #menu {
        position: fixed;
        top: 0;
        left: 46%;
        height: 40px;
        z-index: 70;
        width: 100%;
        padding: 0;
        margin: 0;
    }
    .mocon{position: absolute;
        font-size: 12px;
        width: 11vh;
        height: 3vh;
        margin-left: -4vh;
        margin-top: 1vh;
        background: rgba(255,255,255,0.5);
        text-align: center;
        border-radius: 5px;}
    .moLan{position: absolute;font-size: 12px;margin-left: -15vh;margin-top: 1vh;
           text-align: center;background: rgba(255,255,255,0.5);width: 9vh;height: 3vh;border-radius: 5px;}
}                                                                     
@media screen and (min-width:1300px) and (max-width:1400px) { 
   .fontcas1 {
    
     font-size:20px;
     margin-left:-20vh;
}
.fontcas1EN {
    text-shadow: 2px 2px 4px #000000;
    font-size: 21px;
    margin-left: -25vh;
}
.fontcas2EN {
    text-shadow: 2px 2px 4px #000000;
    font-size: 15px;
    margin-left: 1vh;
}
.fontcS1EN {
    text-shadow: 2px 2px 4px #000000;
    font-size: 15px;
    margin-left: -2vh;
}
.fontcS2EN {
    text-shadow: 2px 2px 4px #000000;
    font-size: 15px;
    margin-left: 12vh;
}
.fontpersonEN {
    text-shadow: 2px 2px 4px #000000;
    font-size: 15px;
    margin-left: -6vh;
}
.fontperson2 {
    font-size: 15px;
    margin-left: 27vh;
}
.fontcas2 {
        
     font-size:15px; margin-left:5vh;
}
.fontcS1{

     font-size:20px;
     margin-left:-9vh
}
.fontcS2{
      
     font-size:15px;
     margin-left:20vh;
}
.fontperson {
       
    font-size:18px;
    margin-left:-8vh
}
.fontperson2 {
       
    font-size:18px;
    margin-left:27vh
}
.boxfont1{font-size: 13px;margin-left: 4%;width: 100%;}
.talkHR2 {font-size:14px; margin-left:16vh;}
#menu{margin-left: -12%;}
} 
@media screen and (min-width: 1000px) and (max-width:1100px) { 
    .fontwelEN {
    
        margin-top: 25vh;
        margin-left: 10.5vh;
        font-size: 18px;
       
    }
    .fontcas1 {
        font-size: 16px;
        margin-left: -20vh;
 }
 .fontcas1EN {
    text-shadow: 2px 2px 4px #000000;
    font-size: 15px;
    margin-left: -19vh;
 }
 .fontcas2EN {
    text-shadow: 2px 2px 4px #000000;
    font-size: 11px;
    margin-left: 1vh;
 }
 .fontcS1EN {
    text-shadow: 2px 2px 4px #000000;
    font-size: 12px;
    margin-left: -2vh;
 }
 .fontcS2EN {
    text-shadow: 2px 2px 4px #000000;
    font-size: 11px;
    margin-left: 12vh;
 }
 .fontpersonEN {
    text-shadow: 2px 2px 4px #000000;
    font-size: 12px;
    margin-left: -6vh;
 }
 .fontperson2 {
    font-size: 13px;
    margin-left: 15vh;
 }
 .fontcas2 {
         
    font-size: 11px;
    margin-left: 5vh;
 }
 .fontcS1{
 
    font-size: 12px;
    margin-left: -9vh;
 }
 .fontcS2{
       
    font-size: 12px;
    margin-left: 10vh;
 }
 .fontperson {
        
     font-size:13px;
     margin-left:-8vh
 }
 .fontperson2 {
     font-size: 13px;
    margin-left: 15vh;
 }
 .boxfont1{font-size: 10px; margin-left: 4%; width: 108%;}
 .talkHR2 {font-size:14px; margin-left:16vh;}
 #menu{    margin-left: -19%;width: 80%;font-size: 12px;}

 .scalapp {
    position: absolute;
    width: 100%;
    margin-top: 5%;
}
.barApp {
 
    width: 6%;
   
}
.talkT2 {
    margin-top: 10vh;
    margin-left: 9vh;
}
.talkS2 {
    margin-top: 37vh;
    margin-left: 10vh;
}
.talkAVL2 {
    margin-top: 30vh;
    margin-left: 9vh;
}
.talkHR2 {
    font-size: 10px;
    margin-left: 8vh;
}
.talkJob2 {
    margin-top: 16vh;
    margin-left: 9vh;
}
.visit {width: 20%;}

 } 
 #bg_load{ position:fixed; width:100%; height:100%; top:0px; left:0px; background-color:#666; } 