/*All-rights-reserved, 2018 | VIDEOOWIDE | SOCIOWIDE
Created by Bayu Tara Wijaya
Email: contact@mastara.net
*/

/*TextCharacter*/
body{font-family:'Montserrat', sans-serif;}
h1{line-height:1em;font-size:50px;letter-spacing:-1px;}
h2{font-size:40px;line-height:1.2em;}
h3{font-size:30px;line-height:1.2em;}
h4{font-size:20px;line-height:1.2em;}
h5{font-size:18px;letter-spacing:-0.5px;}
h6{font-size:14px;line-height:1.5em;}
p{font-size:16px;line-height:1.5em;letter-spacing:0px;font-weight:400;color:#333333;}
.montserrat{font-family:'Montserrat'!important;}
.typo-35px{font-size:35px;}


/*SectionDetails*/
section{padding:50px 0px;text-align:center;}
#main{padding-top:30px;padding-bottom:70px;}
#kita{padding:20px 0px 20px 0px;}

/*TextColor*/
.white{color:white;}
.white-50{color:#c5c5c5;}
.black{color:#333;}
.black-50{color:#868686;}
.orange{color:#ff9800;}
.tosca{color:#00ebc1;}
.tosca-dark{color:#2e635e;}
.red-pink{color:#ff0753;}
.text-gradient-1{background:-webkit-linear-gradient(right top, #02ebfb 34%, #FFEB3B 100%);-webkit-background-clip:text;-webkit-text-fill-color:transparent;}
.text-gradient-2{background:-webkit-linear-gradient(right top, #FF5722 34%, #FFC107 100%);-webkit-background-clip:text;-webkit-text-fill-color:transparent;}
 
/*VIDEO*/
.box-video-header{padding-bottom:55.0%;border:6px solid #fff;border-radius:0px;max-width:100%;background:#ffffff;box-shadow:0px 30px 40px -19px #000000;}
.video{position:relative;padding-bottom:56.25%;margin:30px 0px 30px 0px;height:0;background:none;border-radius:10px;}
.video-modul{margin: 20px;}
.video iframe{background:#1e515c;border:5px solid #4b8996;position:relative;top:0;left:0;width:100%;height:100%;}
.video img{position:relative;top:0;left:0;}
.border-video{border:3px solid #dedede;max-width:100%;/*box-shadow:0px 0px 10px 1px #ef90ff;*/border-radius:10px;background:#333;}
.border-video-module{border: 10px solid #f3f3f3;max-width: 100%;box-shadow: 0px 0px 30px #1b1b1b40;border-radius: 10px;background: #efefef;}
.play{width:90px;margin-top:-64%;margin-left:1%;opacity:0.9;box-shadow:0px 0px 80px #ff9800;border-radius:100%;}
.play:hover{opacity:1;box-shadow:0px 0px 80px #000;}
.play-demo{width:90px;margin-top:-64%;margin-left:1%;opacity:1;box-shadow:0px 0px 80px #03a9f4;border-radius:100%;}
.play-demo:hover{opacity:1;box-shadow:0px 0px 80px #000;}
.grow{-webkit-transition:all 0.3s ease-out;-moz-transition:all 0.3s ease-out;-ms-transition:all 0.3s ease-out;-o-transition:all 0.3s ease-out;transition:all 0.3s ease-out;}
.grow:hover{-webkit-transform:scale(1.05);-moz-transform:scale(1.05);-ms-transform:scale(1.05);-o-transform:scale(1.05);transform:scale(1.05);}
.title-modul{color: #fff;margin-bottom: -21px;margin-left: -15px;height: auto;padding: 5px 20px 0px 10px;z-index: 9999;position: relative;display: inline-block;float: left;border-radius: 7px;background: #ff0753;box-shadow: 6px 9px 20px -5px #6b6b6b;}
.title-modul-tosca{background:#17c39c;}
.title-text{margin-bottom:5px;color:#fff;}

/*Background*/
.bg-img-main-1{background:#031111 url(../img/bg1.jpg) no-repeat center center;background-size:cover;} 
.bg-img-main-2{background:#031111 url(../img/bg2.jpg) no-repeat center center;background-size:cover;}
.bg-img-intro{background:#2b56c9 url(../img/bg3.jpg) no-repeat center center;background-size:cover;}
.bg-img-white{background:linear-gradient(90deg, #ffffff 0%, #ffffffed 50%),url(../img/image3.jpg) no-repeat center center;background-size:cover;}
.bg-img-matter{background:#00434b url(../img/bg3.jpg) no-repeat center center;background-size:cover;}
.bg-color-white{background:#fff;}
.bg-color-white-semu{background:#f7f7f7;}
.bg-color-green-dark{background:linear-gradient(10deg, #004a46 0%, #006158 25%, #001b2c 100%);}
.bg-color-dark{background:linear-gradient(50deg, #313131 0%, #404040 100%);margin-bottom: -2px;}
.bg-color-gradient-1{background:linear-gradient(90deg, #FF9800 0%, #ff0057 100%);}
.bg-color-green-fulldark{background:#006158;}
.bg-overlay-white{background: linear-gradient(90deg, #efefeffa 0%, #ffffffed 50%),url(../img/image3.jpg) center center no-repeat scroll;-webkit-background-size: cover;-moz-background-size: cover;background-size: cover;-o-background-size: cover;}
.bg-overlay-white-bonus{background: linear-gradient(70deg, #efefeffa 0%, #ffffffed 50%),url(../img/image3.jpg) center center no-repeat scroll;-webkit-background-size: cover;-moz-background-size: cover;background-size: cover;-o-background-size: cover;}
.bg-overlay-green-dark{background:linear-gradient(90deg, #006c65eb 0%, #002130fa 50%),url(../img/image1.jpg) center center no-repeat scroll;-webkit-background-size: cover;-moz-background-size: cover;background-size: cover;-o-background-size: cover;}
.bg-overlay-black-dark{background:linear-gradient(90deg, #313131eb 0%, #246b5ffa 50%),url(../img/image2.jpg) center center no-repeat scroll;-webkit-background-size: cover;-moz-background-size: cover;background-size: cover;-o-background-size: cover;}
.bg-overlay-black{background:linear-gradient(90deg, #000000eb 0%, #246b5ffa 50%),url(../img/image2.jpg) center center no-repeat scroll;-webkit-background-size: cover;-moz-background-size: cover;background-size: cover;-o-background-size: cover;}




/*Box*/
.box-text-header{background:#00f1e2;font-weight: 400;color: #fff;margin: 15px 0px;border-radius: 25px;padding: 10px 25px 0px 25px;width: auto;display: inline-block;}
.box-simple{margin-top: -100px;border-radius: 10px;padding: 20px;box-shadow: 0px 0px 40px #33333373;background: #fff;}
.box-module{background: #d2d2d226;padding: 20px 10px;border-radius: 10px;box-shadow: 0px 0px 30px #00000029;}
.box-title-modul{background: linear-gradient(50deg, #008679 0%, #00cea9 100%);display: table;text-align: left;padding: 5px 20px 0px 20px;border-radius: 25px;
margin: 0 0 -10px 0;}
.box-title-modul-orange{background: linear-gradient(50deg, #FF5722 0%, #ff0753 100%);display: table;text-align: left;padding: 5px 20px 0px 20px;border-radius: 25px;margin: 0 0 -10px 0;}
.box-title-modul-green{background: linear-gradient(50deg, #009688 0%, #8de822 100%);display: table;text-align: left;padding: 5px 20px 0px 20px;border-radius: 25px;margin: 0 0 -10px 0;}



.circle-icon{opacity:0.9;background:linear-gradient(150deg, #ff0554 0%, #ff9303 100%);border-radius:50%;;padding:25px;display:inline-block;margin:0px 125px;}
.circle-icon:hover{opacity:1;background:linear-gradient(150deg, #ff9303 0%, #ff0554 100%)}
.circle-icon-white{background: #fff;padding: 30px 30px;margin-bottom: -5px;margin-top: 15px;box-shadow: 0px 0px 30px #cccccca6;display: inline-block;border-radius: 50%;}
.items li{background:url(../img/checked.png) no-repeat left top;padding:0px 0px 1px 33px;list-style:none;opacity:0.9;margin-bottom:-2px;text-align:left;font-weight:300;margin-left:-42px;}
.items-text{color:#000;line-height: 1.4em;font-weight:400;}
.items-select{color:#043843;font-weight:600;}
.items2 li{background:url(../img/cancel-mark.png) no-repeat left top;padding:0px 0px 5px 45px;list-style:none;opacity:0.9;margin-bottom:6px;margin-left:-10px;}
.items3 li{background:url(../img/play-button.png) no-repeat left top;padding:3px 0px 1px 33px;list-style:none;margin-bottom:-2px;text-align:left;font-weight:300;margin-left:-39px;}
.items4 li{background:url(../img/multimedia.png) no-repeat left top;padding:3px 0px 1px 33px;list-style:none;margin-bottom:-2px;text-align:left;font-weight:300;margin-left:-39px;}
.items-text3{margin-top: -6px;color:#fff;}
.fak li{background:url(../img/chat.png) no-repeat left top;padding:2px 0px 10px 40px;list-style:none;opacity:0.9;margin-bottom:6px;}

/*TESTIMONI*/
.testimonial{margin-bottom:10px;}
.testimonial-section{width:100%;height:auto;padding:15px;-webkit-border-radius:5px;-moz-border-radius:5px;border-radius:10px;position:relative;background:#fff;box-shadow:0px 2px 40px #3333331f;}
.testimonial-section:after{top:100%;left:50px;border:solid transparent;content:" ";position:absolute;border-top-color:#ffffffed;border-width:15px;margin-left:-15px;}
.testimonial-section-right{width:100%;height:auto;padding:15px;-webkit-border-radius:5px;-moz-border-radius:5px;border-radius:0px;position:relative;background:#fadbfff0;}
.testimonial-section-right:after{top:100%;right:50px;border:solid transparent;content:" ";position:absolute;border-top-color:#fadbfff0;border-width:15px;margin-left:-15px;}
.testimonial-desc{margin-top:20px;text-align:left;padding-left:15px;}
.testimonial-desc img{box-shadow:0px 0px 40px #3333331f;border:3px solid #6b6b6b;border-radius:150px;height:70px;padding:0px;width:70px;display:inline-block;vertical-align:top;}
.testimonial-writer{display:inline-block;vertical-align:middle;padding-left:10px;padding-top:15px;}
.testimonial-writer-name{font-weight:bold;color:#333;}
.testimonial-writer-designation{font-size:85%;color:#009688;}
.testimonial-writer-company{font-size:85%;}

/*BUTTON*/
.btn-color1{padding:5px 25px 4px 25px;background:linear-gradient(90deg, #FF9800 0%, #ff0057 100%);color:#fff !important;border-radius:50px;-moz-box-shadow::6px 6px 5px #fc6804;-webkit-box-shadow::6px 6px 5px #fc6804;box-shadow::6px 6px 5px #fc6804;white-space:normal;/*transition:0.5s;*/text-decoration:none;display:inline-block;}
.btn-color1:hover{background:linear-gradient(90deg, #ff0057 0%, #FF9800 100%);box-shadow: 0px 0px 20px #ec480b85;}


/*TIMER*/
.times{padding:15px 5px 5px 3px;text-align:center;font-size:25pt;line-height:18pt;color:#fff;border-radius:5px;margin:5px;background:#00d0b6;font-weight:600;}
.smalltext{font-size:10px;font-weight:400;}

/*Steps*/
.laptop {position: absolute;margin-top: -57%;}
.laptop-module {position: absolute;margin-top: -58%;}
.isi-laptop {padding: 9.3%;margin-right: -3.6%;margin-bottom: -2.2%;}
.isi-laptop-module{padding: 13.3%;margin-right: -3.6%;margin-bottom: -3.2%;margin-top: -6%;}
.icon-step{background: #fcfeff;display: inline-block;padding: 20px;border-radius: 100%;margin: 35px 0px 10px 0px;border: 0px solid #6dbbf382;box-shadow: 0px 0px 30px #cecece;}

/*More*/
.img-silang{margin-top:-55px;margin-bottom:20px;margin-left:5px;width:40px;height:auto;}
.img-gu{margin:-5px 0px 0px 10px;}

/*Animation*/
.animated {-webkit-animation-duration: 1s;animation-duration: 1.;-webkit-animation-fill-mode: both;animation-fill-mode: both;animation: mymove 3s infinite;}
.grow{-webkit-transition:all 0.3s ease-out;-moz-transition:all 0.3s ease-out;-ms-transition:all 0.3s ease-out;-o-transition:all 0.3s ease-out;transition:all 0.3s ease-out;}
.grow:hover{-webkit-transform:scale(1.05);-moz-transform:scale(1.05);-ms-transform:scale(1.05);-o-transform:scale(1.05);transform:scale(1.05);}
.buy{-webkit-transition:all 0.2s ease-out;-moz-transition:all 0.2s ease-out;-ms-transition:all 0.2s ease-out;-o-transition:all 0.2s ease-out;transition:all 0.2s ease-out;opacity:1;}
.buy:hover{-webkit-transform:scale(1.02);-moz-transform:scale(1.02);-ms-transform:scale(1.02);-o-transform:scale(1.02);transform:scale(1.02);opacity:1;}

/*PULSE*/
.pulse {-webkit-animation-name: pulse;animation-name: pulse;}
@keyframes pulse{
	0% {-webkit-transform: scale3d(1, 1, 1);transform: scale3d(1, 1, 1);}
	50% {-webkit-transform: scale3d(1.05, 1.05, 1.05);transform: scale3d(1.05, 1.05, 1.05);}
	100% {-webkit-transform: scale3d(1, 1, 1);transform: scale3d(1, 1, 1);}
}


@media screen and (max-width:768px){
	#main{background-attachment:fixed;}
	body{font-size:13px;}
	h1{font-size:34px;}
	h2{font-size:29px;}
	h3{font-size:26px;}
	h4{font-size:23px;}
	p{font-size:14px;}
	.laptop-module {position: absolute;margin-top: -56%;margin-right: 2%;}
}

@media screen and (max-width:480px){
	#main{background-attachment:fixed;background-position: right;}
	body{font-size:12px;}
	h1{font-size:30px;}
	h2{font-size:25px;}
	h3{font-size:22px;}
	h4{font-size:18px;}
	p{font-size:12px;}
	.circle-icon{margin: 0px 20px;}
	.edit-step-laptop{padding-top: 45px;margin-top: -170%;margin-bottom: 93%;}
	.edit-step-img{margin-top: 60%;}
	.laptop-module {position: absolute;margin-top: -56%;margin-right: 2%;}
}