* { -webkit-box-sizing: border-box; box-sizing: border-box;} 

#video .descriptionBox { position:relative;z-index: 2; display:flex; align-items: flex-end; padding-bottom: 300px; height:100vh; width:100%; } 
#video .description { width:1200px; margin:0 auto 0px auto; text-align:left; position:relative; } 
#video .parallax-section { background-attachment: fixed !important; background-size: cover !important; padding:0; margin:0;} 
#home {position:relative; overflow:hidden; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; 
-webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; height: 100vh; position: relative; z-index:1; } 
#home video {border:0; padding:0; margin:0; position: absolute; top: 50%; left: 50%; min-width: 100%; min-height: 100%; 
width: auto; height: auto; z-index: -100; 
transform: translateX(-50%) translateY(-50%); background-size: cover; transition: 1s opacity;} 

#video .description .head {text-align:center; padding-bottom:0px;} 
 
#video .description h3{ font-size: 48px; font-weight:900; line-height:75px; color:#fff }
  
#video .description .txt01{ font-size: 22px; padding:30px 0; line-height:34px;} 

#video .flex {display:none; justify-content: space-between; flex-wrap: wrap; width:900px; margin:0 auto; padding:20px 0 } 

#video .flex .item { width:170px; transition:0.2s all; } #video .flex .item a {display:block; height:170px; width:170px; font-size:18px; text-align:center; padding-top:110px; font-weight:500; background-repeat:no-repeat; background-position:center 30px ; color:#fff; position:relative; transition:0.2s all; background-size:70px;} 
#video .flex .item a:after {content:""; position:absolute; height:170px; width:170px; background-color:rgb(0,0,0,0.8); border-radius:50px; transform: rotate( 45deg ); top:0; left:0; z-index: -1 } 
#video .flex .item01 a {background-image:url(../img/ico1.png); } 
#video .flex .item02 a {background-image:url(../img/ico2.png); } 
#video .flex .item03 a {background-image:url(../img/ico3.png); } 
#video .flex .item04 a {background-image:url(../img/ico4.png); } 
#video .flex .item:hover {transition:0.2s all; background:url(../img/b2.png)no-repeat center;} 
#video .flex .item a:hover {background-position:center 25px ;} 
#video .flex .item a:hover:after { color:#fff;background-color:rgb(237,28,36,0.8);transition:0.2s all; }


/*--------------------------------------- 
MOBILE RESPONSIVE 
-----------------------------------------*/ 
@media (max-width: 1023px) { #video .description { padding-bottom: 10px; width:100%; } 
#video .description .head {text-align:center; padding-bottom:0px;} 
#video .description h3{ font-size: 30px; line-height:40px; } 
#video .description .txt01{ font-size: 16px; padding:15px 0 25px 0; line-height:26px;} 
#video .flex {justify-content: space-around; flex-wrap: wrap; flex-wrap: wrap; width:90%; padding:0px 0 } 
#video .flex .item { width:120px; flex: 1 1 40%; text-align:center; } 
#video .flex .item a {display:block; height:120px; width:120px; font-size:15px; margin:15px auto; padding-top:85px; font-weight:500; background-position:center 20px ; background-size:60px;} 
#video .flex .item a:after {content:""; position:absolute; height:120px; width:120px; background-color:rgb(0,0,0,0.5); border-radius:50px; transform: rotate( 45deg ); top:0; left:0; z-index: -1 } } @media (max-width: 768px) { } @media (max-width: 640px) { } @media (max-width: 480px) { } @media (max-width: 320px) { }