/* Devices Images Element */
.el-di {position: relative;}
.el-di-dir--ltr {direction:ltr; max-height: none !important; }
.el-di__laptop { position: relative; width: 1160px; background-repeat: no-repeat; background-size: contain;}
.el-di__laptop-img {position: absolute; background-repeat: no-repeat; background-size: cover; border-radius: 3px; }
.el-di-type--img .el-di__laptop { height: 670px;}
.el-di-type--img .el-di__laptop-img {left: 14%; top: 7.6%; /*bottom: 13.3%; right: 13.9%; */width: calc(100% - 27.9%); height: calc(100% - 20.9%);}
.el-di-type--vector .el-di__laptop { height: 600px;}
.el-di-type--vector .el-di__laptop-img { left: 16.6%; top: 6.3%; /*bottom: 11.8%; right: 16.6%;*/ box-shadow: inset 0 0 3px rgba(0, 0, 0, 0.24); width: calc(100% - 33.2%); height: calc(100% - 18.1%);}
.el-di__smartphone { position: absolute; width: 220px; background-repeat: no-repeat; background-size: contain; bottom: -20px; left: 70px;}
.el-di__smartphone-img {position: absolute; background-repeat: no-repeat; background-size: cover; border-radius: 3px; }
.el-di-type--img .el-di__smartphone { height: 403px; width: 245px; }
.el-di-type--img .el-di__smartphone-img {left: 15.9%; top: 11.6%; /*bottom: 13.8%; right: 14.8%;*/ width: calc(100% - 30.7%); height: calc(100% - 25.4%); }
.el-di-type--vector .el-di__smartphone { height: 400px; width: 200px; left: 110px; }
.el-di-type--vector .el-di__smartphone-img { left: 7.3%; top: 14%; width: calc(100% - 14.7%); height: calc(100% - 25.7%); }
/* Frame */
.el-di__frame {position: relative; width: 1160px; height: 520px; padding-top:30px; padding-bottom: 5px; border-radius: 4px 4px 0 0; background-color: #dcdee7; border:2px solid #fff; box-shadow: 0 10px 13px -10px rgba(0, 0, 0, 0.3); }
.el-di__frame:before {content: ""; position: absolute; top: 12px; margin-top: 0; left: 25px; display: block; background: #ababab; border-radius: 30px; width: 7px; height: 7px; box-shadow: -12px 0 0 #ababab,12px 0 0 #ababab; }
.el-di__frame-img {position: absolute; background-repeat: no-repeat; background-size: cover; left:0; top:30px; bottom: 5px; right:0; width: 100%; height: calc(100% - 35px);}

/* Custom sized frame */
.el-di.el-di-imgtype--custom_frame .el-di__frame {padding-bottom: 0;}

/* Right to left */
.el-di-dir--rtl {direction:rtl; max-height: none !important;}
.el-di-dir--rtl.el-di-type--img .el-di__smartphone {left:auto; right: 70px;}
.el-di-dir--rtl.el-di-type--vector .el-di__smartphone {left:auto; right: 110px;}
.el-di-dir--rtl .el-di__frame:before {left:auto; right: 25px;}
/* Center */
.el-di-dir--center.el-di-imgtype--frame {overflow: hidden; min-height: 100px}
.el-di-dir--center .el-di__frame {width: 100%; height: 0; padding-bottom: 45%; }
.el-di-dir--center.el-di-imgtype--custom_frame {max-height: none !important;}
.el-di-dir--center.el-di-imgtype--custom_frame .el-di__frame {margin:0 auto;}
/* MQ's */
@media screen and (min-width: 992px) and (max-width: 1199px){
	.el-di-type--img .el-di__laptop { height: 490px; width: 850px;}
	.el-di-type--vector .el-di__laptop { height: 428px; width: 845px;}
	.el-di__frame { width: 900px; height: 490px;}
	.el-di-type--vector .el-di__smartphone { height: 330px; width: 166px;}
	.el-di-type--img .el-di__smartphone { height: 324px; width: 197px;}
}
@media screen and (min-width: 768px) and (max-width: 991px){
	.el-di-type--img .el-di__laptop { height: 416px; width: 720px;}
	.el-di-type--vector .el-di__laptop { height: 370px; width: 720px;}
	.el-di__frame { width:720px; height: 440px;}
	.el-di-type--vector .el-di__smartphone { height: 250px; width: 125px;}
	.el-di-type--img .el-di__smartphone { height: 274px; width: 167px;}
	.el-di-type--vector .el-di__smartphone { left: 70px; }
	.el-di-dir--rtl.el-di-type--img .el-di__smartphone {right: 40px;}
	.el-di-dir--rtl.el-di-type--vector .el-di__smartphone {right: 70px;}
}
@media screen and (max-width: 767px){
	.el-di-type--img .el-di__laptop {width: 100%; height: 0 !important; padding-bottom: 57.77%; }
	.el-di-type--vector .el-di__laptop {width: 100%; height: 0 !important; padding-bottom: 51%; }
	.el-di__frame {width: 100%; padding-bottom: 63%; height: 0 !important; }
	.el-di__smartphone {display: none}
}