@font-face {
    	font-family: "OpenSans-Regular";
    	src: url('../fonts/OpenSans-Regular.eot') format('embedded-opentype'), url('../fonts/OpenSans-Regular.woff2') format('woff2'), url('../fonts/OpenSans-Regular.woff') format('woff'), url('../fonts/OpenSans-Regular.ttf') format('truetype');
    }

@font-face {
    	font-family: "OpenSans-Light";
    	src: url('../fonts/OpenSans-Light.eot') format('embedded-opentype'), url('../fonts/OpenSans-Light.woff2') format('woff2'), url('../fonts/OpenSans-Light.woff') format('woff'), url('../fonts/OpenSans-Light.ttf') format('truetype');
    }

@font-face {
    	font-family: "OpenSans-Bold";
    	src: url('../fonts/OpenSans-Bold.eot') format('embedded-opentype'), url('../fonts/OpenSans-Bold.woff2') format('woff2'), url('../fonts/OpenSans-Bold.woff') format('woff'), url('../fonts/OpenSans-Bold.ttf') format('truetype');
    }

@font-face {
    	font-family: "OpenSans-Semibold";
    	src: url('../fonts/OpenSans-Semibold.eot') format('embedded-opentype'), url('../fonts/OpenSans-Semibold.woff2') format('woff2'), url('../fonts/OpenSans-Semibold.woff') format('woff'), url('../fonts/OpenSans-Semibold.ttf') format('truetype');
    }
@font-face {
    	font-family: "Glyphicons";
    	src: url('../fonts/glyphicons-halflings-regular.eot') format('embedded-opentype'), url('../fonts/glyphicons-halflings-regular.woff2') format('woff2'), url('../fonts/glyphicons-halflings-regular.woff') format('woff'), url('../fonts/glyphicons-halflings-regular.ttf') format('truetype');
    }

@font-face {
    	font-family: "fontawesome";
    	src: url('../fonts/fontawesome.eot') format('embedded-opentype'), url('../fonts/fontawesome.woff2') format('woff2'), url('../fonts/fontawesome.woff') format('woff'), url('../fonts/fontawesome.ttf') format('truetype');
    }



body {
	background-color: transparent;
	color: #000;
	font-family: "OpenSans-Regular", arial, "OpenSans-Regular";
	font-size: 14px;
	margin:0;
	min-height:100vh;
	position:relative;
	overflow-x: hidden;
	background-image: linear-gradient(to bottom right, #9e3311, #ff5000);
	background-attachment: fixed;
	background-repeat: no-repeat;
	background-size: cover;
}

.scroll-scontent {
   overflow: auto;
}

html {
    height: 100%;	
	width:100%;
}

a {
    color: #171717;
}

a:hover {
	text-decoration: none;
	color: #ff5000;
}


.shape {
    width: 62%;
    height: 100vh; 
    min-height: 100%; 
  	background-color: #fff;
  	-webkit-clip-path: polygon(0% 0%, 90% 0%, 50% 100%, 0% 100%);
	clip-path: polygon(0% 0%, 90% 0%, 50% 100%, 0% 100%);
	float: left;
	position: absolute;
	background-image: linear-gradient(to right top, #e6e6e6, #fff);
	background-image: url(../images/bg.png);
	background-repeat: no-repeat;
	background-position: center;
	background-attachment: fixed;
	position: fixed;
}

.shape2 {
    width: 165%;
	height: 30vh;
  	background-color: #fff;
  	-webkit-clip-path: polygon(0% 0%, 52% 0%, 50% 100%, 0% 100%);
	clip-path: polygon(0% 0%, 52% 0%, 50% 100%, 0% 100%);
	float: left;
	position: absolute;
	background-image: linear-gradient(to right top, #e6e6e6, #fff);
	background-image: url(../images/bg.png);
	background-repeat: no-repeat;
	background-position: center;
	background-attachment: fixed;
	position: fixed;
}

.phone img {
    width: 260px;
	margin-top: 10%;
	margin-bottom: 10%;
}

.download img {
    width: 160px;
	padding: 5px;
}

.logo-oo {
	margin-top: 70px;
	position: absolute;
	text-align: right;
}

.logo-oo img {
    width: 140px;
	margin-top: 2px !important;
}

.logo-oo2 {
	padding: 20px;
}

.logo-oo2 img {
    width: 120px;
}

.logo-iweb {
    width: 140px;
	margin-top: 60px;
	margin-bottom: 50px;
}

.logo-iweb2 {
	margin-top: 15px;
	margin-bottom: 0px;
	margin-left: 37px;
}

.download {
	display: block;
	}

@media only screen and (max-width : 990px) {
	.shape {
		width: 70%;
	}
	.offset-1 {
    margin-left: 0%;
	}
	.logo-oo {
		margin-top: 70px;	
	}
	.logo-oo img {
		width: 120px;
		margin-top: 10px !important;
	}
}

@media only screen and (max-width : 850px) {
	.logo-oo img {
		width: 120px;
		margin-top: 0px;
	}
	.phone img {
    width: 240px;
	}

}

@media only screen and (max-width : 768px) {
	.logo-oo img {
		width: 100px;
		margin-right: 10px;
	}
	.phone img {
    width: 200px;
	}
	
	.tagline {
	font-size: 20px !important;
	}

    .tagline b {
        font-size: 24px !important;
    }
	.linked2 {
    margin-top: 0rem !important;
	margin-bottom: 1rem;
	}
}

@media only screen and (max-width : 577px) {
	.logo-oo img {
		margin-top: 0px;
		width: 80px;
		margin-right: 10px;
	}
	.phone img {
	margin-left: 10%;
	}
	
	.tagline {
	font-size: 18px !important;
	margin-top: 15px;
	margin-bottom: 0rem !important;
	}

    .tagline b {
        font-size: 20px !important;
    }
	.shape {
    width: 100%;
    height: 100vh; 
  	-webkit-clip-path: polygon(0% 0%, 160% 0%, -150% 100%, 0% 100%);
	clip-path: polygon(0% 0%, 160% 0%, -150% 100%, 0% 100%);
	}
	.shape2 {
    width: 100%;
    height: 100vh; 
  	-webkit-clip-path: polygon(0% 0%, 75% 0%, -15% 100%, 0% 100%);
	clip-path: polygon(0% 0%, 75% 0%, -15% 100%, 0% 100%);
	}
	
	.logo-iweb {
    width: 140px;
    margin-top: 20px;
    margin-bottom: 10px;
	}
	.linked {
    font-size: 14px;
    margin-top: 2rem !important;
	margin-bottom: 1rem;
	}
	.download {
	padding-top: 20%;
	}
	.linked2 {
    margin-top: 0rem !important;
    margin-bottom: 1rem;
	}
}

@media only screen and (max-width : 620px) {
	.small-device {
		text-align: center;
	}
}

@media only screen and (max-width : 320px) {
	.download img {
    width: 150px;
    padding: 5px;
	}
}



.tagline {
	font-size: 26px;
	font-family: "OpenSans-Light";
	margin-bottom: 3rem;
}

.tagline b {
    font-size: 30px;
    font-family: "OpenSans-Regular";
}

.linked2 {
	margin-left: 4%;
}

.linked {
	font-size: 14px;
	z-index: 9999;
}

.linked a {
	margin-right: 20px;
	color: #4f5859;
}

.linked a:hover {
	color: #ff5000 !important;
	border-bottom: 1.5px solid #ff5000;
}

.copyright {
	font-size: 11px;
	padding: 20px;
	color: #fff;
	line-height: 12px;
	text-align: right;
}

.vertical-center {
  min-height: 100%;
  min-height: 100vh;
  display: flex;
  align-items: center;
}

@media only screen and (max-width : 450px) {
	.vertical-center {
		min-height: inherit;
	  display: inherit;
	}
	.logo-oo {
    margin-top: 20px;
	}
	.logo-iweb {
    width: 130px;
    margin-top: 20px;
    margin-bottom: 10px;
	}	
}

.white {
  	background-color: #fff;
	padding: 10px 30px 30px 30px;
	width: 100%;
}

.sequence {
	text-align: center;
	margin-bottom: 30px;
	display: inline;
}

.sequence img {
	width: 240px;
	margin: 10px 0px;
}


.card-box {
            background: #FAFAFA;
            height: 200px;
            position: relative;
            padding: 30px 30px 20px;
            margin-bottom: 20px;
            display: -ms-flexbox;
            display: flex;
            -ms-flex-direction: column;
            flex-direction: column;
            -webkit-box-pack: justify;
            -ms-flex-pack: justify;
            justify-content: space-between;
            position: relative;
            cursor: pointer;
			border-radius: 10px;
        }

        .card-box:hover {
            background: #fff2e9 ;
        }


        .card-title h2 {
            margin: 0;
            padding-top: 1%;
            color: #000;
            font-size: 18px;
            line-height: 1;
            margin-bottom: 15px;
        }

        .card-title p {
            margin: 0;
            margin-bottom: 10px;
            font-size: 14px;
        }

        .card-link a {
            text-decoration: none;
            color: #FF5722;
            font-size: 12px;
        }

		.card-link span {
            text-decoration: none;
            color: #ff5000;
            font-size: 12px;
        }

.modal-dialog {
    min-width: 40% !important;
	text-align: center;
}

.modal-dialog p {
	text-align: left;
}