@charset "utf-8";
/* CSS Document */

@font-face {
    font-family: 'straitregular';
    src: url('strait-regular-webfont.eot');
    src: url('strait-regular-webfont.eot?#iefix') format('embedded-opentype'),
         url('strait-regular-webfont.woff2') format('woff2'),
         url('strait-regular-webfont.woff') format('woff'),
         url('strait-regular-webfont.ttf') format('truetype'),
         url('strait-regular-webfont.svg#straitregular') format('svg');
    font-weight: normal;
    font-style: normal;

}

body{ margin:0px; padding:0px; text-align:justify; font-family:Geneva, Arial, Helvetica, sans-serif; color:#333333; font-size:13px; line-height:25px; background:#fff;}

h1{ font-family: 'straitregular'; color:#df4b30; font-size:28px; font-weight:100;}
h2{ color:#C30; font-weight:100; font-stretch:narrower; margin:0px 0px 5px 0px; padding:0px; font-size:25px; text-transform:uppercase; line-height:45px; font-family: 'straitregular';}
h3{ padding:0px; margin:0px;}
h4{  font-family: 'straitregular'; font-size:16px;}
h5{  font-family: 'straitregular'; font-size:14px; margin:10px 0px;}
a{ text-decoration:none;}
#center { width:1000px; height:auto; margin:0px auto !important; padding:0px 0px;}
#center:after {content: ".";display: block;clear: both; visibility: hidden; line-height: 0;height: 0;}

.profile{ margin:10px 0px; line-height:25px;}

.ceo{ float:left; margin:25px 25px 0 0px; width:270px; border-radius:10px; min-height:170px; border:#ccc thin solid; padding:15px 25px; /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#ffffff+0,f6f6f6+47,ededed+100;White+3D+%231 */
background: #ffffff; /* Old browsers */
background: -moz-linear-gradient(top,  #ffffff 0%, #f6f6f6 47%, #ededed 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top,  #ffffff 0%,#f6f6f6 47%,#ededed 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom,  #ffffff 0%,#f6f6f6 47%,#ededed 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#ededed',GradientType=0 ); /* IE6-9 */

}

.ceo h3{ font-family: 'straitregular'; font-size:14px; margin:10px 0px; text-transform:uppercase;}

#top{ float:left; width:100%; min-height:25px; padding:5px 0px 5px 0px; background:#f2f2f0; border-bottom:#f2f2f2 thin solid; border-top:#b6b4b6 thin solid;}
.top{ float:left; width:430px;}
.top-phone{ float:left; width:80px; padding:2px 0px 2px 37px; background:url(../images/phone-icon.png) no-repeat; margin-right:40px;}
#top h3{ color:#a7a7a7; font-size:19px; font-family:"Calibri", Georgia, "Times New Roman", Times, serif; font-weight:100;}
.top-cell{ float:left; width:60px; padding:2px 0px 2px 37px; background:url(../images/cell-icon.png) no-repeat; margin-right:100px;}

header{ float:left; width:100%; min-height:77px;}
.logo{ float:left; width:300px;}
nav{ float:left; width:650px; margin:80px 0px 0px 30px;}

#animation{ float:left; width:100%; min-height:400px;}

#ani{ float:left; width:100%; min-height:55px; background:#33b7f5;}
.ani{ float:left; background:url(../images/arrow1.jpg) no-repeat; padding:12px 0px 10px 60px; margin:0px 35px 0 0; font-family: "Calibri", Georgia, "Times New Roman", Times, serif; font-weight:100; color:#f5f5f5; font-size:21px; }

article{ float:left; width:100%; height:auto; padding:30px 0px; background:#FFFFFF;}

.article-box{ float:left; width:300px; margin:60px 15px 60px 16px; background:#fff; min-height:300px; color:#1f1b1b; font-size:13px; border:#ced4e0 thin solid; padding-bottom:30px;}
.article-box h5{ font-family: 'straitregular'; font-size:18px; color:#f02057; text-align:center; font-weight:100; padding:0px 0px 5px 0px; margin:20px 0px 0px 0px; }

.article-software{ float:left; width:350px; margin:40px 0px 0px 0px;}
.article-software h5{ font-family: 'straitregular'; font-size:18px; color:#f02057; text-align:center; font-weight:100; padding:0px 0px 5px 0px; margin:20px 0px 0px 0px; }
.article-features{ float:left; width:600px; margin:0px 0px 0px 50px;}
.article-features h3{ color:#33b7f5;  font-family: 'straitregular'; font-size:18px; margin:0px 0px 15px 0px; text-transform:uppercase;}

.article-features ul{ margin:0px; padding:0px; list-style:none;}
.article-features ul li{ float:left; width:94%; padding:3px 3%; font-weight:bold; border-bottom-right-radius:10px; margin:0px 0px 8px 0px; 
/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#a0d8ef+1,ddf1f9+59,f4f4f4+100 */
background: #a0d8ef; /* Old browsers */
background: -moz-linear-gradient(45deg,  #a0d8ef 1%, #ddf1f9 59%, #f4f4f4 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(45deg,  #a0d8ef 1%,#ddf1f9 59%,#f4f4f4 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(45deg,  #a0d8ef 1%,#ddf1f9 59%,#f4f4f4 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#a0d8ef', endColorstr='#f4f4f4',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */
}

#ani-bot{ float:left; width:100%; min-height:450px; padding:80px 0px 40px 0px;}
.ani-bot{ float:left; width:208px; height:245px; padding:50px 12px 0px 5px; margin:0px 25px 0px 0px; border-radius:12px; text-align:center;}
#ani-bot h1{  font-family: 'straitregular'; color:#FFFFFF; font-size:36px; padding:30px 0px 0px 0px; line-height:35px;}

#inner-ani-bot{ float:left; width:100%; min-height:100px; padding:30px 0px 50px 0px;}
#inner-ani-bot h1{  font-family: 'straitregular'; color:#FFFFFF; font-size:36px; padding:30px 0px 30px 0px; line-height:35px; text-align:center;}

.contact{ float:left; width:330px; min-height:370px; text-align:justify; padding:15px 20px; margin:0px 30px 0px 0px;/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#f0f9ff+0,a1dbff+100 */
background: #f0f9ff; /* Old browsers */
background: -moz-linear-gradient(top,  #f0f9ff 0%, #a1dbff 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top,  #f0f9ff 0%,#a1dbff 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom,  #f0f9ff 0%,#a1dbff 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f0f9ff', endColorstr='#a1dbff',GradientType=0 ); /* IE6-9 */

}
.contact p{border-bottom:#fff thin solid; margin:10px 0px; padding:5px 0px;}
.contact p a{ color:#000; text-decoration:underline;}

.box{ float:left; width:230px; min-height:390px; background:url(../images/soft-back.png); padding:20px 12px; border-radius:6px; margin:30px 8px; text-align:center;}
.box h3{ font-family: 'straitregular'; color:#26282c; font-size:16px; text-align: center; font-weight:100;}
.box p{ font-family: 'straitregular'; color:#FFFFFF; font-size:18px; margin:10px 5%; padding:10px 5%; background:#33b7f5; width:90%; height:150px; border-radius:5px;}

.box-link{ float:left; padding:0px 10px; margin:10px 26px 10px 70px; border-radius:3px; min-width:40px; /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#a90329+0,8f0222+44,6d0019+100;Brown+Red+3D */
background: #a90329; /* Old browsers */
background: -moz-linear-gradient(top, #a90329 0%, #8f0222 44%, #6d0019 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top, #a90329 0%,#8f0222 44%,#6d0019 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom, #a90329 0%,#8f0222 44%,#6d0019 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#a90329', endColorstr='#6d0019',GradientType=0 ); /* IE6-9 */}

.box-link a{ color:#f5f5f5;}

#feed-back{ float:left; width:100%; min-height:300px; padding:35px 0px; background:#33b7f5;}
.feed-back{ float:left; width:300px;}
.feed-back-msg{ float:left; width:650px; margin:30px 0px 0px 50px; color:#FFF;}
.feed-back-msg h3{ font-family: 'straitregular'; color:#efefee; font-size:24px; font-weight:100; text-transform:uppercase; margin-bottom:10px;}
.feed-back-msg h4{ font-family: 'straitregular'; color:#efefee; font-size:16px; font-weight:100; text-transform:uppercase; margin-bottom:13px;}

footer{ float:left; width:100%; min-height:30px; padding:50px 0px 0px 0px; background:#fff;}
.footer-box{ float:left; width:225px; margin:20px 6px 20px 6px; padding:20px 6px 25px 6px; background:url(../images/footer-box-back.png); text-align:left; min-height:285px; border-top-left-radius:10px;}
.footer-box h3{ font-size:22px; color:#f5f5f5; font-weight:100; margin:15px 0px 15px 10px;}
.footer-box ul{ margin:0px; padding:0px; list-style:none;}
.footer-box ul li{ color:#fff; margin:6px 0px 6px 10px; font-weight:bold;}

.footer-bot{ float:left; width:100%; padding:5px 0px; background:#33b7f5; min-height:20px;}

input[type=text] {
    width: 100%;
    padding: 7px 20px;
    margin: 5px 0;
    box-sizing: border-box;
	border-radius:4px;
	color:#666666;
}
input[type=password] {
    width: 100%;
    padding: 7px 20px;
    margin: 5px 0;
    box-sizing: border-box;
	border-radius:4px;
	color:#666666;
}
.textarea1 {
   
    padding: 3px 10px;
    margin: 5px 0;
    box-sizing: border-box;
	border-radius:4px;
	color:#666666;
	
}

.button1 {
    box-shadow: 0 8px 16px 0 rgba(0,0,0,0.2), 0 6px 20px 0 rgba(0,0,0,0.19);
	width:200px; padding:10px 20px;
	font-size:16px;
	
}

/*----ENQUIRY FORM-----------------------------------------------------------------------------------------------------------------------------------*/
.enquiry-form{ float:left; width:500px; min-height:370px; text-align:justify; padding:15px 20px; margin:0px 30px 0px 0px;/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#f0f9ff+0,a1dbff+100 */
background: #f0f9ff; /* Old browsers */
background: -moz-linear-gradient(top,  #f0f9ff 0%, #a1dbff 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top,  #f0f9ff 0%,#a1dbff 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom,  #f0f9ff 0%,#a1dbff 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f0f9ff', endColorstr='#a1dbff',GradientType=0 ); /* IE6-9 */}
.enquiry{ width:100%; height:auto; float:left;}
.enquiry ul{ margin:0px; padding:0px; text-align:justify; list-style:none;}
.enquiry ul li{ float:left; width:350px; margin:0px 0px 0px 0px;}
/*----ENQUIRY FORM-----------------------------------------------------------------------------------------------------------------------------------*/