/*-----------------------------------------
   --------->> PREVIEW BUTTONS <<-------
-----------------------------------------*/
@import url('https://fonts.googleapis.com/css?family=Poppins:300,400,500,600,700,800&display=swap');

html, body{	
    height:100%;	
}
body{
	border:0; 
	padding:0;
	margin:0;
	width:100%;    
	font-family: 'Poppins', Helvathika, Arial sans-serif;
	background-color:#ffffff;
	overflow:hidden;
}

img, button {
	border : 0;
}

a {
	text-decoration:none;
	outline:none !important;
}

#strip-header{
	width: 100%;
	background: linear-gradient(#3C3C3C, #070707);
	background: -moz-linear-gradient(#3C3C3C, #070707);
	background: -webkit-linear-gradient(#3C3C3C, #070707);
	background: -o-linear-gradient(#3C3C3C, #070707);
	background-color: #070707;
	height: 60px;
	position: relative;
	top:0;
	z-index:99999;
}

#strip-header div{
	display:inline-block;
}
.logo{	
	
	position:absolute;
	left: 0;
	top: 0;
}
.logo img{
	margin:0;
}
.preview-menus{
    position:absolute;
    width: 300px;
	margin-left: 550px;
	margin-top: 15px;
}

.preview-menus button{
	background:transparent;
	border: 0;
	margin: 0;	
	cursor: pointer;
	padding: 0 5px;;
    outline: none !important;
    outline: 0 !important;
	height: 32px;
}

.preview-menus img{
	border: 0;
	margin: 0;
	padding:0 2px;
	opacity: 0.3;
	vertical-align: middle;
}

.preview_screens:hover img, .active img{	
	opacity: 1;	
	color: blue;
}

.header-button{	
	position:absolute;
	right:50px;
	margin-top: 21px;	
}

.help-btn{ 
	padding:7px 20px; 
	background-color:#82b440; 	
	border-radius: 3px;
	color:#ffffff; 
	font-size:12px;
	font-weight:600;
	letter-spacing:1px;
	transition: 300ms ease-in;
}

.help-btn img{
	margin-right:5px;	
}

.help-btn:hover, .help-btn:focus{
	background-color:#6f9a37; 
	color:#ffffff; 
	text-decoration:none;
}

#preview-container{   
   width: 100%;
   height: 100%;
   position: relative;
   z-index:0;
   overflow:auto;
}

#preview-content-frame{   
    width: 100%;   
    height: 100%;  
}

#preview-content-frame iframe{   
   display: table;
   margin: 0 auto;
}

/* Iframe BG */

.ipad-portrait{
    background-attachment: scroll;
    background-clip: border-box;
    background-color: rgba(0, 0, 0, 0);
	background-image: url('../images/ipad-portrait.png');	
    background-origin: padding-box;
    background-position-x: 0;
    background-position-y: 0;
    background-repeat: no-repeat;
    background-size: auto auto;
    height: 1240px !important;
	width: 902px !important;
    margin-bottom: 20px;
    margin-left: auto;
    margin-right: auto;
    margin-top: 40px;    
}

.ipad-landscape{
    background-attachment: scroll;
    background-clip: border-box;
    background-color: rgba(0, 0, 0, 0);
	background-image: url('../images/ipad-landscape.png');	
    background-origin: padding-box;
    background-position-x: 0;
    background-position-y: 0;
    background-repeat: no-repeat;
    background-size: auto auto;
    height: 902px !important;
	width: 1240% !important;
    margin-bottom: 40px;
    margin-left: 33px;
    margin-right: 33px;
    margin-top: 40px;    
}

.iphone-portrait{
    background-attachment: scroll;
    background-clip: border-box;
    background-color: rgba(0, 0, 0, 0);
	background-image: url('../images/iphone-portrait.png');	
    background-origin: padding-box;
    background-position-x: 0;
    background-position-y: 0;
    background-repeat: no-repeat;
    background-size: auto auto;
    height: 796px !important;
	width: 380px !important;
    margin-bottom: 20px;
    margin-left: auto;
    margin-right: auto;
    margin-top: 40px;    
}

.iphone-landscape{
    background-attachment: scroll;
    background-clip: border-box;
    background-color: rgba(0, 0, 0, 0);
	background-image: url('../images/iphone-landscape.png');	
    background-origin: padding-box;
    background-position-x: 0;
    background-position-y: 0;
    background-repeat: no-repeat;
    background-size: auto auto;
    height: 380px !important;
	width: 797px !important;
    margin-bottom: 20px;
    margin-left: auto;
    margin-right: auto;
    margin-top: 40px;    
}

.ipad-portrait #main_frame {   
    margin-bottom: 0;
    margin-left: 46px !important;
    margin-right: 0;
    margin-top: 126px !important;
	position:absolute;	
}

.ipad-landscape #main_frame
{   
    margin-bottom: 0;
    margin-left: 128px !important;
    margin-right: 0;
    margin-top: 46px !important;
	position:absolute;	
}

.iphone-portrait #main_frame {   
    margin-bottom: 0;
    margin-left: 30px !important;
    margin-right: 0;
    margin-top: 105px !important;
	position:absolute;	
}

.iphone-landscape #main_frame {   
    margin-bottom: 0;
    margin-left: 106px !important;
    margin-right: 0;
    margin-top: 39px !important;
	position:absolute;	
}

a, button, a:hover, a:active, a:focus, button:hover, button:active, button:focus , img{ 
  -moz-outline-style: none !important;
   outline:none !important;
   outline: 0 !important;
   border: none !important;
   outline-style: none !important;
}

*:focus {
    -moz-outline-style: none !important;
   outline:none !important;
   outline: 0 !important;
   border: none !important;
   outline-style: none !important;
}
.price-rel{position:relative;}
.price-abs{position:absolute; right:220px; top:9px; z-index:99;}
.price-fs{ color:#ffffff;
		font-size: 30px;
		font-weight: 600;
		line-height: 38px;
		letter-spacing:1px; margin:0;}
p{margin:0;}