/* CSS Document */
.clear{width:100%;
clear:both;}

[class*="cols-"] {
    float: left;
	width: 100%;
}
[class*="global-"] {
    margin:auto;
	width: 100%;
}
.bg00 {background: var(--color-white);}
.bg01 {background:var(--color-biru-op00);}
.bg02 {background:var(--color-hijau-op06);}
.bg03 {background:var(--color-biru3);}
.bg04 {background:var(--color-biru-06);}

.bl00 {border: 1px solid var(--color-hijau-04); border-width: 1px 0;}
.bl01 {border: 1px solid var(--color-hijau-04); border-width: 0 0 1px 0;}



.hg1 { height:10px;}
.hg2 { height:20px;}
.hg3 { height:30px;}
.hg4 { height:40px;}
.hg5 { height:40px;}

	.ltr0{ letter-spacing:1px;}
	.ltr1{ letter-spacing:1px;}
	.ltr2{ letter-spacing:2px;}
	.ltr3{ letter-spacing:3px;}
	
	

	.mgb0{margin-bottom:5px;}
	.mgb1{margin-bottom:15px;}
	.mgb2{margin-bottom:20px;}
	.mgb3{margin-bottom:25px;}
	.mgb4{margin-bottom:30px;}
	.mgb5{margin-bottom:35px;}
	.mgb6{margin-bottom:45px;}
	.mgb7{margin-bottom:75px;}
	.mgb8{margin-bottom:100px;}
	
	.mgt1{margin-top:15px;}
	.mgt2{margin-top:20px;}
	.mgt3{margin-top:25px;}
	.mgt4{margin-top:30px;}
	.mgt5{margin-top:35px;}
	.mgt6{margin-top:45px;}
	.mgt7{margin-top:65px;}
	.mgt8{margin-top:100px;}
	.mgt10{margin-top:1000px;}
	
	.mgl1{margin-left:5px;}
	.mgl2{margin-left:10px;}
	.mgl3{margin-left:15px;}
	.mgl4{margin-left:20px;}
	.mgl5{margin-left:25px;}
	.mgl6{margin-left:30px;}
	.mgl7{margin-left:35px;}

	.mgr1{margin-right:5px;}
	.mgr2{margin-right:10px;}
	.mgr3{margin-right:15px;}
	.mgr4{margin-right:20px;}
	.mgr5{margin-right:25px;}


	.ta1{text-align:left;}
	.ta2{text-align: center;}
	.ta3{text-align: justify;}
	.ta4{text-align: right;}
	
	.flo1{ float:left;}
	.flo2{ float:right;}
	.flo3{ float:inherit;}
	
	.con-cen {margin-left:auto;
	margin-right:auto;}




 /* Media Query for Mobile Devices */
@media all and (max-width: 480px) {
    .fz-smm{font-size:8px;}
	.fz-sm{font-size:9px;}
	.fz1{font-size:10px;}
	.fz2{font-size:11px;}
	.fz3{font-size:12px;}
	.fz4{font-size:13px;}
	.fz5{font-size:16px;}
	.fz6{font-size:18px;}
	.fzbig{font-size:20px;}
	.fzbiga{font-size:25px;}
	.fzbigb{font-size:30px;}
	.fzbigc{font-size:35px;}
			
	.cols-s-0 {width: 0%;}
	.cols-s-1 {width: 5%;}
    .cols-s-2 {width: 10%;}
    .cols-s-3 {width: 15%;}
    .cols-s-4 {width: 20%;}
    .cols-s-5 {width: 25%;}
    .cols-s-6 {width: 30%;}
    .cols-s-7 {width: 35%;}
    .cols-s-8 {width: 40%;}
    .cols-s-9 {width: 45%;}
    .cols-s-10 {width: 50%;}
    .cols-s-11 {width: 55%;}
    .cols-s-12 {width: 60%;}
	.cols-s-13 {width: 65%;}
	.cols-s-14 {width: 70%;}
	.cols-s-15 {width: 75%;}
	.cols-s-16 {width: 80%;}
	.cols-s-17 {width: 85%;}
	.cols-s-18 {width: 90%;}
	.cols-s-19 {width: 95%;}
	.cols-s-20 {width: 100%;}
	
	.form-w0 {width: 95%;}
	.form-w1 {width: 5%;}
	.form-w2 {width: 100%;}
	.form-w3 {width: 100%;}
	
	
    .form-x0 {width: 95%;}
	.form-x1 {width: 5%;}
	.form-x2 {width: 100%;}
	.form-x3 {width: 100%;}

	.global-s-0 {width: 50%;}
	.global-s-1 {width: 55%;}
    .global-s-2 {width: 60%;}
    .global-s-3 {width: 65%;}
    .global-s-4 {width: 70%;}
    .global-s-5 {width: 75%;}
    .global-s-6 {width: 80%;}
    .global-s-7 {width: 85%;}
    .global-s-8 {width: 90%;}
    .global-s-9 {width: 95%;}
    .global-s-10 {width: 100%;}

	.pop-0 {width: 80%; height:70%}
	.pop-1 {width: 90%; height:90%}
	.pop-2 {width: 80%; height:90%}
	
	.lh0{line-height:4px;}
	.lh1{line-height:10px;}
	.lh2{line-height:15px;}
	.lh3{line-height:20px;}
	.lh4{line-height:25px;}
	.lh5{line-height:30px;}
	.lh6{line-height:35px;}
	.lh7{line-height:40px;}
	
    .pdl0{padding-left:2px;}
   	.pdl1{padding-left:5px;}
	.pdl2{padding-left:10px;}
	.pdl3{padding-left:15px;}
	.pdl4{padding-left:20px;}
	.pdl5{padding-left:25px;}
	
	.pdr0{padding-right:2px;}
	.pdr1{padding-right:5px;}
	.pdr2{padding-right:10px;}
	.pdr3{padding-right:15px;}
	.pdr4{padding-right:20px;}
	.pdr5{padding-right:25px;}
	
	.pda1{padding-top:10px;}
	.pda2{padding-top:15px;}
	.pda3{padding-top:20px;}
	.pda4{padding-top:25px;}
	.pda5{padding-top:30px;}
	
	.pdb1{padding-bottom:10px;}
	.pdb2{padding-bottom:15px;}
	.pdb3{padding-bottom:20px;}
	.pdb4{padding-bottom:25px;}
	.pdb5{padding-bottom:30px;}
	

	.container{width:100%;
	margin-left:auto;
	margin-right:auto;
	border:0px dashed #FF0000;}
	
	#dekstop{display:none;}
	#mobile{display:block;}
}
          
        /* Media Query for low resolution  Tablets, Ipads */
@media all and (min-width: 481px) and (max-width: 767px) {
    .fz-smm{font-size:8px;}
	.fz-sm{font-size:10px;}
	.fz1{font-size:11px;}
	.fz2{font-size:12px;}
	.fz3{font-size:12px;}
	.fz4{font-size:13px;}
	.fz5{font-size:16px;}
	.fz6{font-size:18px;}
	.fzbig{font-size:20px;}
	.fzbiga{font-size:25px;}
	.fzbigb{font-size:30px;}
	.fzbigc{font-size:35px;}
			
	.cols-sm-0 {width: 0%;}
	.cols-sm-1 {width: 5%;}
    .cols-sm-2 {width: 10%;}
    .cols-sm-3 {width: 15%;}
    .cols-sm-4 {width: 20%;}
    .cols-sm-5 {width: 25%;}
    .cols-sm-6 {width: 30%;}
    .cols-sm-7 {width: 35%;}
    .cols-sm-8 {width: 40%;}
    .cols-sm-9 {width: 45%;}
    .cols-sm-10 {width: 50%;}
    .cols-sm-11 {width: 55%;}
    .cols-sm-12 {width: 60%;}
	.cols-sm-13 {width: 65%;}
	.cols-sm-14 {width: 70%;}
	.cols-sm-15 {width: 75%;}
	.cols-sm-16 {width: 80%;}
	.cols-sm-17 {width: 85%;}
	.cols-sm-18 {width: 90%;}
	.cols-sm-19 {width: 95%;}
	.cols-sm-20 {width: 100%;}
	
	.form-w0 {width: 95%;}
	.form-w1 {width: 5%;}
	.form-w2 {width: 100%;}
	.form-w3 {width: 100%;}
	
	
    .form-x0 {width: 95%;}
	.form-x1 {width: 5%;}
	.form-x2 {width: 100%;}
	.form-x3 {width: 100%;}
	
		
    .global-sm-0 {width: 50%;}
	.global-sm-1 {width: 55%;}
    .global-sm-2 {width: 60%;}
    .global-sm-3 {width: 65%;}
    .global-sm-4 {width: 70%;}
    .global-sm-5 {width: 75%;}
    .global-sm-6 {width: 80%;}
    .global-sm-7 {width: 85%;}
    .global-sm-8 {width: 90%;}
    .global-sm-9 {width: 95%;}
    .global-sm-10 {width: 100%;}	
	
	.pop-0 {width: 80%; height:70%}
	.pop-1 {width: 90%; height:90%}
	.pop-2 {width: 80%; height:90%}
	
	.lh0{line-height:4px;}
	.lh1{line-height:10px;}
	.lh2{line-height:15px;}
	.lh3{line-height:20px;}
	.lh4{line-height:25px;}
	.lh5{line-height:30px;}
	.lh6{line-height:35px;}
	.lh7{line-height:40px;}

    .pdl0{padding-left:2px;}
   	.pdl1{padding-left:5px;}
	.pdl2{padding-left:10px;}
	.pdl3{padding-left:15px;}
	.pdl4{padding-left:20px;}
	.pdl5{padding-left:25px;}
	
	.pdr0{padding-right:2px;}
	.pdr1{padding-right:5px;}
	.pdr2{padding-right:10px;}
	.pdr3{padding-right:15px;}
	.pdr4{padding-right:20px;}
	.pdr5{padding-right:25px;}
	
	.pda1{padding-top:10px;}
	.pda2{padding-top:15px;}
	.pda3{padding-top:20px;}
	.pda4{padding-top:25px;}
	.pda5{padding-top:30px;}
	
	.pdb1{padding-bottom:10px;}
	.pdb2{padding-bottom:15px;}
	.pdb3{padding-bottom:20px;}
	.pdb4{padding-bottom:25px;}
	.pdb5{padding-bottom:30px;}

	.container{width:100%;
	margin-left:auto;
	margin-right:auto;
	border:0px dashed #FF0000;}
	
	#dekstop{display:none;}
	#mobile{display:block;}
}
          
        /* Media Query for Tablets Ipads portrait mode */
@media all and (min-width: 768px) and (max-width: 1024px){
    .fz-smm{font-size:8px;}
	.fz-sm{font-size:10px;}
	.fz1{font-size:11px;}
	.fz2{font-size:12px;}
	.fz3{font-size:13px;}
	.fz4{font-size:15px;}
	.fz5{font-size:16px;}
	.fz6{font-size:18px;}
	.fzbig{font-size:25px;}
	.fzbiga{font-size:30px;}
	.fzbigb{font-size:35px;}
	.fzbigc{font-size:40px;}
	
			
	.cols-m-0 {width: 0%;}
	.cols-m-1 {width: 5%;}
    .cols-m-2 {width: 10%;}
    .cols-m-3 {width: 15%;}
    .cols-m-4 {width: 20%;}
    .cols-m-5 {width: 25%;}
    .cols-m-6 {width: 30%;}
    .cols-m-7 {width: 35%;}
    .cols-m-8 {width: 40%;}
    .cols-m-9 {width: 45%;}
    .cols-m-10 {width: 50%;}
    .cols-m-11 {width: 55%;}
    .cols-m-12 {width: 60%;}
	.cols-m-13 {width: 65%;}
	.cols-m-14 {width: 70%;}
	.cols-m-15 {width: 75%;}
	.cols-m-16 {width: 80%;}
	.cols-m-17 {width: 85%;}
	.cols-m-18 {width: 90%;}
	.cols-m-19 {width: 95%;}
	.cols-m-20 {width: 100%;}
	
	.form-w0 {width: 19%;}
	.form-w1 {width: 1%;}
	.form-w2 {width: 80%;}
	.form-w3 {width: 30%;}
	
    .form-x0 {width: 29%;}
	.form-x1 {width: 1%;}
	.form-x2 {width: 70%;}
	.form-x3 {width: 20%;}
	
	
    .global-m-0 {width: 50%;}
	.global-m-1 {width: 55%;}
    .global-m-2 {width: 60%;}
    .global-m-3 {width: 65%;}
    .global-m-4 {width: 70%;}
    .global-m-5 {width: 75%;}
    .global-m-6 {width: 80%;}
    .global-m-7 {width: 85%;}
    .global-m-8 {width: 90%;}
    .global-m-9 {width: 95%;}
    .global-m-10 {width: 100%;}	
	
	.pop-0 {width: 60%; height:70%}
	.pop-1 {width: 90%; height:90%}
	.pop-2 {width: 80%; height:90%}
	
	.lh0{line-height:8px;}
	.lh1{line-height:15px;}
	.lh2{line-height:20px;}
	.lh3{line-height:25px;}
	.lh4{line-height:30px;}
	.lh5{line-height:35px;}
	.lh6{line-height:40px;}
	.lh7{line-height:45px;}

	
    .pdl0{padding-left:2px;}
   	.pdl1{padding-left:5px;}
	.pdl2{padding-left:10px;}
	.pdl3{padding-left:15px;}
	.pdl4{padding-left:20px;}
	.pdl5{padding-left:25px;}
	
	.pdr0{padding-right:2px;}
	.pdr1{padding-right:5px;}
	.pdr2{padding-right:10px;}
	.pdr3{padding-right:15px;}
	.pdr4{padding-right:20px;}
	.pdr5{padding-right:25px;}
	
	.pda1{padding-top:10px;}
	.pda2{padding-top:20px;}
	.pda3{padding-top:30px;}
	.pda4{padding-top:40px;}
	.pda5{padding-top:50px;}
	
	.pdb1{padding-bottom:10px;}
	.pdb2{padding-bottom:20px;}
	.pdb3{padding-bottom:30px;}
	.pdb4{padding-bottom:40px;}
	.pdb5{padding-bottom:50px;}
	
			
	.container{width:100%;
	margin-left:auto;
	margin-right:auto;
	border:0px dashed #FF0000;}
	
	#dekstop{display:block;}
	#mobile{display:none;}
}
          
        /* Media Query for Laptops and Desktops */
@media all and (min-width: 1025px) and (max-width: 1280px){
    .fz-smm{font-size:8px;}
	.fz-sm{font-size:10px;}
	.fz1{font-size:12px;}
	.fz2{font-size:13px;}
	.fz3{font-size:14px;}
	.fz4{font-size:15px;}
	.fz5{font-size:18px;}
	.fz6{font-size:20px;}
	.fzbig{font-size:25px;}
	.fzbiga{font-size:30px;}
	.fzbigb{font-size:35px;}
	.fzbigc{font-size:45px;}
	
			
	.cols-l-0 {width: 0%;}
	.cols-l-1 {width: 5%;}
    .cols-l-2 {width: 10%;}
    .cols-l-3 {width: 15%;}
    .cols-l-4 {width: 20%;}
    .cols-l-5 {width: 25%;}
    .cols-l-6 {width: 30%;}
    .cols-l-7 {width: 35%;}
    .cols-l-8 {width: 40%;}
    .cols-l-9 {width: 45%;}
    .cols-l-10 {width: 50%;}
    .cols-l-11 {width: 55%;}
    .cols-l-12 {width: 60%;}
	.cols-l-13 {width: 65%;}
	.cols-l-14 {width: 70%;}
	.cols-l-15 {width: 75%;}
	.cols-l-16 {width: 80%;}
	.cols-l-17 {width: 85%;}
	.cols-l-18 {width: 90%;}
	.cols-l-19 {width: 95%;}
	.cols-l-20 {width: 100%;}
	
	.form-w0 {width: 19%;}
	.form-w1 {width: 1%;}
	.form-w2 {width: 80%;}
	.form-w3 {width: 30%;}
	
    .form-x0 {width: 29%;}
	.form-x1 {width: 1%;}
	.form-x2 {width: 70%;}
	.form-x3 {width: 20%;}

	.global-l-0 {width: 50%;}
	.global-l-1 {width: 55%;}
    .global-l-2 {width: 60%;}
    .global-l-3 {width: 65%;}
    .global-l-4 {width: 70%;}
    .global-l-5 {width: 75%;}
    .global-l-6 {width: 80%;}
    .global-l-7 {width: 85%;}
    .global-l-8 {width: 90%;}
    .global-l-9 {width: 95%;}
    .global-l-10 {width: 100%;}
	
	
	.pop-0 {width: 50%; height:60%}
	.pop-1 {width: 90%; height:90%}
	.pop-2 {width: 80%; height:90%}
	
	.lh0{line-height:8px;}
	.lh1{line-height:15px;}
	.lh2{line-height:20px;}
	.lh3{line-height:25px;}
	.lh4{line-height:30px;}
	.lh5{line-height:35px;}
	.lh6{line-height:40px;}
	.lh7{line-height:45px;}

	
    .pdl0{padding-left:2px;}
   	.pdl1{padding-left:5px;}
	.pdl2{padding-left:10px;}
	.pdl3{padding-left:15px;}
	.pdl4{padding-left:20px;}
	.pdl5{padding-left:25px;}
	
	.pdr0{padding-right:2px;}
	.pdr1{padding-right:5px;}
	.pdr2{padding-right:10px;}
	.pdr3{padding-right:15px;}
	.pdr4{padding-right:20px;}
	.pdr5{padding-right:25px;}
	
	.pda1{padding-top:10px;}
	.pda2{padding-top:20px;}
	.pda3{padding-top:30px;}
	.pda4{padding-top:40px;}
	.pda5{padding-top:50px;}
	
	.pdb1{padding-bottom:10px;}
	.pdb2{padding-bottom:20px;}
	.pdb3{padding-bottom:30px;}
	.pdb4{padding-bottom:40px;}
	.pdb5{padding-bottom:50px;}
		
	.container{width:100%;
	margin-left:auto;
	margin-right:auto;
	border:0px dashed #FF0000;}
	
	#dekstop{display:block;}
	#mobile{display:none;}
}
          
        /* Media Query for Large screens */
@media all and (min-width: 1281px) {
    .fz-smm{font-size:8px;}
	.fz-sm{font-size:10px;}
	.fz1{font-size:12px;}
	.fz2{font-size:13px;}
	.fz3{font-size:14px;}
	.fz4{font-size:15px;}
	.fz5{font-size:18px;}
	.fz6{font-size:20px;}
	.fzbig{font-size:25px;}
	.fzbiga{font-size:30px;}
	.fzbigb{font-size:40px;}
	.fzbigc{font-size:50px;}
			
	.cols-xl-0 {width: 0%;}
	.cols-xl-1 {width: 5%;}
    .cols-xl-2 {width: 10%;}
    .cols-xl-3 {width: 15%;}
    .cols-xl-4 {width: 20%;}
    .cols-xl-5 {width: 25%;}
    .cols-xl-6 {width: 30%;}
    .cols-xl-7 {width: 35%;}
    .cols-xl-8 {width: 40%;}
    .cols-xl-9 {width: 45%;}
    .cols-xl-10 {width: 50%;}
    .cols-xl-11 {width: 55%;}
    .cols-xl-12 {width: 60%;}
	.cols-xl-13 {width: 65%;}
	.cols-xl-14 {width: 70%;}
	.cols-xl-15 {width: 75%;}
	.cols-xl-16 {width: 80%;}
	.cols-xl-17 {width: 85%;}
	.cols-xl-18 {width: 90%;}
	.cols-xl-19 {width: 95%;}
	.cols-xl-20 {width: 100%;}
	
	.form-w0 {width: 19%;}
	.form-w1 {width: 1%;}
	.form-w2 {width: 80%;}
	.form-w3 {width: 30%;}
	
	.form-x0 {width: 29%;}
	.form-x1 {width: 1%;}
	.form-x2 {width: 70%;}
	.form-x3 {width: 20%;}
	
	.box-xl-1 {width: 98%;}
	
	.global-xl-0 {width: 50%;}
	.global-xl-1 {width: 55%;}
    .global-xl-2 {width: 60%;}
    .global-xl-3 {width: 65%;}
    .global-xl-4 {width: 70%;}
    .global-xl-5 {width: 75%;}
    .global-xl-6 {width: 80%;}
    .global-xl-7 {width: 85%;}
    .global-xl-8 {width: 90%;}
    .global-xl-9 {width: 95%;}
    .global-xl-10 {width: 100%;}	
	
	
	.pop-0 {width: 40%; height:60%}
	.pop-1 {width: 90%; height:90%}
	.pop-2 {width: 80%; height:90%}
	
	.lh0{line-height:8px;}
	.lh1{line-height:15px;}
	.lh2{line-height:20px;}
	.lh3{line-height:25px;}
	.lh4{line-height:30px;}
	.lh5{line-height:35px;}
	.lh6{line-height:40px;}
	.lh7{line-height:45px;}
	
    .pdl0{padding-left:2px;}
   	.pdl1{padding-left:5px;}
	.pdl2{padding-left:10px;}
	.pdl3{padding-left:15px;}
	.pdl4{padding-left:20px;}
	.pdl5{padding-left:25px;}
	
	.pdr0{padding-right:2px;}
	.pdr1{padding-right:5px;}
	.pdr2{padding-right:10px;}
	.pdr3{padding-right:15px;}
	.pdr4{padding-right:20px;}
	.pdr5{padding-right:25px;}
	
	.pda1{padding-top:10px;}
	.pda2{padding-top:20px;}
	.pda3{padding-top:30px;}
	.pda4{padding-top:40px;}
	.pda5{padding-top:50px;}
	
	.pdb1{padding-bottom:10px;}
	.pdb2{padding-bottom:20px;}
	.pdb3{padding-bottom:30px;}
	.pdb4{padding-bottom:40px;}
	.pdb5{padding-bottom:50px;}
	
	#dekstop{display:block;}
	#mobile{display:none;}
}
		
 /* different techniques for iPad screening */
@media only screen and (min-device-width: 481px) and (max-device-width: 1024px) and (orientation:portrait) {
      /* For portrait layouts only */
	  
	.container{width:100%;
	margin-left:auto;
	margin-right:auto;
	border:0px dashed #FF0000;}
	
	#dekstop{display:block;}
	#mobile{display:none;}
}

@media only screen and (min-device-width: 481px) and (max-device-width: 1024px) and (orientation:landscape) {
      /* For landscape layouts only */
	  
	.container{width:100%;
	margin-left:auto;
	margin-right:auto;
	border:0px dashed #FF0000;}
	
	#dekstop{display:none;}
	#mobile{display:block;}

}