body, html {
  height: 100%;
}

body { }
    /* Column Drop Layout Pattern CSS */ /* =Media query for screen */
	@media only screen and (max-width:600px){
	    td[class="column"] {
	        display: block;
            width: 100%;
            -moz-box-sizing: border-box;
            -webkit-box-sizing: border-box;
            box-sizing: border-box;
	    }
		img[class="flexibleImage"]{height:auto !important; width:100% !important; display:block;}
	}
    /* =Media query for tablets and smartphones */
	@media handheld, only screen and (max-width: 300px), only screen and (max-device-width: 400px) and (orientation:portrait){
	    td[class="column"] {
	        display: block;
            width: 100%;
            -moz-box-sizing: border-box;
            -webkit-box-sizing: border-box;
            box-sizing: border-box;
	    }
		img[class="flexibleImage"]{height:auto !important; width:100% !important; display:block;}
	}
	
	
	
	
.parallaxForm {
  /* The image used */
  background-image: url("https://www.timeteccloud.com/landing/visitor/img/0422/bg-form2.jpg");

  /* Full height */
  height: auto;

  /* Create the parallax scrolling effect */
  background-attachment: fixed;
  background-position: center;
  background-repeat: no-repeat;
  background-size: 100%;
  
}
.parallaxForm {
  /* The image used */
  background-image: url("https://www.timeteccloud.com/landing/visitor/img/0422/bg-form2.jpg");

  /* Set a specific height */
  min-height: 500px;

  /* Create the parallax scrolling effect */
  background-attachment: fixed;
  background-position: center;
  background-repeat: no-repeat;
  background-size: 100%;
} 



.h1, .h2, .h3, .h4, .h5, .h6, .h7, .h8, .h9, .h10, .h11{
display: block;
margin-block-start:0px;
margin-block-end: 0px;
margin-inline-start: 0px;
margin-inline-end: 0px;
}
h1,
.h1 {
font-size:60px;
display: block;
margin-block-start:0px;
margin-block-end: 8px;
margin-inline-start: 0px;
margin-inline-end: 0px; 
}
h2,
.h2 {
font-size: 50px;
display: block;
margin-block-start:0px;
margin-block-end: 8px;
margin-inline-start: 0px;
margin-inline-end: 0px;
}
h3,
.h3 {
font-size: 40px;
display: block;
margin-block-start:0px;
margin-block-end: 8px;
margin-inline-start: 0px;
margin-inline-end: 0px;
}
h4,
.h4 {
font-size: 35px;
display: block;
margin-block-start:0px;
margin-block-end: 5px;
margin-inline-start: 0px;
margin-inline-end: 0px;
}
h5,
.h5 {
font-size: 30px;
display: block;
margin-block-start:0px;
margin-block-end: 5px;
margin-inline-start: 0px;
margin-inline-end: 0px;
}
h6,
.h6 {
font-size: 25px;
display: block;
margin-block-start:5px;
margin-block-end: 5px;
margin-inline-start: 0px;
margin-inline-end: 0px;
}

h7,
.h7 {
font-size: 20px;
display: block;
margin-block-start:0px;
margin-block-end: 5px;
margin-inline-start: 0px;
margin-inline-end: 0px;
}

h8,
.h8 {
font-size: 18px;
display: block;
margin-block-start:0px;
margin-block-end: 5px;
margin-inline-start: 0px;
margin-inline-end: 0px;
}

h9,
.h9 {
font-size: 15px;
display: block;
margin-block-start:0px;
margin-block-end: 5px;
margin-inline-start: 0px;
margin-inline-end: 0px;
}

h10,
.h10 {
font-size: 13px;
display: block;
margin-block-start:0px;
margin-block-end: 5px;
margin-inline-start: 0px;
margin-inline-end: 0px;
}

h11,
.h11 {
font-size: 12px;
display: block;
margin-block-start:0px;
margin-block-end: 5px;
margin-inline-start: 0px;
margin-inline-end: 0px;
}

.RotateImg {
    -webkit-animation: spin 8s linear infinite;
    -moz-animation: spin 8s linear infinite;
    animation: spin 8s linear infinite;
}

.separateDemo {
    border-right-width: 1px;
    border-top-style: none;
    border-right-style: solid;
    border-bottom-style: none;
    border-left-style: none;
    border-right-color: #cea017;
}

.Shadow2 {
    text-shadow: 0px 1px 1px rgb(0 0 0 / 75%);
}

.Main-Title{
	font-size: 60px;
	text-decoration: none;
	line-height: 1.1;
	color: #031d57;
	text-shadow: 0px 3px 3px rgba(255,255,255,0.75);
}


.SolutionTitle {
    display: inline-block;
    font-size: 20px;
    line-height: 1;
    font-weight: 800;
    letter-spacing: .1em;
    text-transform: uppercase;
}
.mainTitle1 {
	font-size: 60px;
	line-height: 1.1;
    letter-spacing: -0.05em;
	font-weight: 300;
}
.f_slogan1{
	font-size: 80px;
	line-height: 1.1;

}
.f_slogan2{
	font-size: 70px;
	line-height: 1.1;
}

.f_slogan3{
	font-size: 60px;
	line-height: 1.1;
}

.f_slogan4{
	font-size: 50px;
	line-height: 1.1;
}

.f_slogan5{
	font-size: 40px;
	line-height: 1.1;
}

.f_slogan6{
	font-size: 30px;
	line-height: 1.1;
}

.f_slogan7{
	font-size: 25px;
	line-height: 1.1;
}



.buttonHbig {
  display: inline-block;
  border-radius: 30px;
  border: none;
  color: #FFFFFF!important;
  text-align: center;
  font-size: 23px;
  padding: 12px 36px 13px 36px;
  transition: all 0.5s;
  cursor: pointer;
  margin: 5px;
  font-family: 'Barlow Semi Condensed'!important;
  min-width: 170px;
}

.buttonHbig span {
  cursor: pointer;
  display: inline-block;
  position: relative;
  transition: 0.5s;
}

.buttonHbig span:after {
  content: '\f105';
  font-family:FontAwesome;
  position: absolute;
  opacity: 0;
  top: 0;
  right: -15px;
  transition: 0.5s;
}

.buttonHbig:hover span {
  padding-right: 20px;
}

.buttonHbig:hover span:after {
  opacity: 1;
  right: 0;
}


.buttonHbig2 {
  display: inline-block;
  border-radius: 30px;
  border: none;
  color: #000!important;
  text-align: center;
  font-size: 20px;
  padding: 15px 32px 16px 32px;
  transition: all 0.5s;
  cursor: pointer;
  margin: 5px;
  font-family: 'Barlow Semi Condensed'!important;
  min-width: 180px;
}

.buttonHbig2 span {
  cursor: pointer;
  display: inline-block;
  position: relative;
  transition: 0.5s;
}

.buttonHbig2 span:after {
  content: '\f105';
  font-family:FontAwesome;
  position: absolute;
  opacity: 0;
  top: 0;
  right: -15px;
  transition: 0.5s;
}

.buttonHbig2:hover span {
  padding-right: 20px;
}

.buttonHbig2:hover span:after {
  opacity: 1;
  right: 0;
}

.t_100x{
    display: table;
    width: 100%;
	height:100px;
}

/***/
.ttblue{
    background-color: #00aeef;
}
.tiffblue{
    background-color: #00dbe2;
}
.sk2{
    background-color: #98102f;
}
.grape{
    background-color: #820f51;
}
.cherry {
    background-color: #f23e4f;
}
.coco{
    background-color: #67221e;
}
.eggplant {
    background-color: #9879c3;
}
.metal {
    background-color: #3b3663;
}
.banana {
    background-color: #f9e500;
}
.mango {
    background-color: #ffb44f;
}
.leaf {
    background-color: #139e00;
}

.blueberry {
    background-color: #3350d0;
}

.seablue {
    background-color: #54c8fd;
}

.peach {
    background-color: #ef7635;
}
.tree {
    background-color: #45d9c2;
}

.greengrape {
    background-color: #64e70d;
}

.greenapple {
    background-color: #7eca52;
}

 
 .overlay {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    content: '';
    opacity: 0;

	background-image: linear-gradient(#3d3e3f, #3d3e3f);
	}
	
	 .overlayWhite {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    content: '';
    opacity: 0.2;

	background-image: linear-gradient(#fff, #fff);
	}

.services-section {
    margin-top: -150px;
}

.services-section2 {
    margin-top: -250px;
}
.lineSeparate {
    border-width: 0px 1px 0px 0px;
    border-style: solid;
    border-color: #CCCCCC;
}
svg {
            display: inline-block;
            position: absolute;
            top: 0;
            left: 0;
            z-index: -1;
        }
        .container {
            display: inline-block;
            position: absolute;
            width: 100%;
            padding-bottom: 100%;
            vertical-align: middle;
            overflow: hidden;
            top: 0;
            left: 0;
        }
		
		
#fixmeX{
}

.mobile-hide {
	display: block;
}

.diagramA {
	display: block;
}

.diagramB {
	display: none;
}

.iconX {
	display: block;
}
		


.CurveLeft{
border-top-left-radius: 200px;
}

.Helvetica2 {
    font-family: Helvetica, sans-serif!important;
    font-weight: 300;
    text-decoration: none;
}	

.separateLines{
border-right:1px solid #bcbec0;
   
}

.ic-features{
	background-color:#f5f4e9;
	padding: 5px;
    border-radius: 15px 15px 15px 0px;
   
}

.ic-features2{
	background-color:#f2fef1;
	padding: 5px;
    border-radius: 15px 15px 15px 0px;
   
}

.ic-features3{
	background-color:#fef2f1;
	padding: 5px;
    border-radius: 15px 15px 15px 0px;
   
}

.t-shadow-w {
text-shadow: 1px 1px #fff;
}

.t-shadow-b {
text-shadow: 1px 1px #000;
}
.t_space{
    display: table;
    width: 100%;
    height: 70px;
}


.t_productX{
    display: table;
    width: 100%;
    height: 380px;
	background-color:#FFFFFF;
	border-bottom:5px solid #f7cc36;
	padding: 40px 40px 80px 40px;
    border-radius: 70px;
    border-bottom-right-radius: 200px;
}

.t_product{
    display: table;
    width: 100%;
    height: 350px;
	background-color:#fff;
	border-bottom:3px solid #f7cc36;
}

.t_product:hover{
    display: table;
    width: 100%;
    height: 350px;
	background-color:#ffffe7;
	border-bottom:3px solid #f7cc36;
}

.c_white {
background-color:#FFFFFF;
border-radius:50%;
padding:6px;
}


.tra-yellow{
	background-image: url(https://www.timeteccloud.com/landing/visitor/img/0422/tranparent-yellow.png);
	background-repeat: repeat;
}

/*
.boxShadow {
background-color:#FFFFFF;
border-radius:8px;
padding:10px;
box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.1);
}

.boxShadow2 {
background-color:#FFFFFF;
border-radius:8px;
padding:10px;
box-shadow: 0 3px 5px 0 rgba(0, 0, 0, 0.3);
}
*/
	
/**PC_Scroll**/
/* Container DIV */
.simply-scroll {
width: 400px;
height: 1000px;
margin-bottom: 1em;
}
	
	
.computer-empty {
    overflow: hidden;
    position: relative;
    width: 630px;
}
.computer-screen {
    overflow: hidden;
    position: absolute;
    height: 320px;
    width: 570px;
    left: 30px;
    top: 30px;
}
.screen-landing {
    left: 0;
    line-height: 0;
    position: absolute;
    width: 100%;
    transition: all 6s;
    -o-transition: all 6s;
    -ms-transition: all 6s;
    -moz-transition: all 6s;
    -webkit-transition: all 6s;
}
.screen-landing:hover {
    cursor: pointer;
    margin-top: -1036px;
}
img {
    max-width: 100%;
    width: auto\9;
    height: auto;
    vertical-align: middle;
    border: 0;
    -ms-interpolation-mode: bicubic;
}
.computer-empty img.computer {
    width: 100%;
}	

.img-box{
        width: 800px;
        height: 468px;
        overflow: scroll;
    }
/**EndPC_Scroll**/

.padding50{
padding:50px 20px;
    }
	
	
.padding80{
padding:80px 20px;
    }
	
.padding100{
padding:100px 20px;
    }	

.padding150{
padding:150px 20px;
    }		


/*Viewport=768px*/
@media screen and (max-width: 48em)  {
.mobile-hide {
	display: none;
}

.separateDemo {
    border-top-style: none;
    border-right-style: none;
    border-bottom-style: solid;
    border-left-style: none;
    border-bottom-width: 1px;
    border-bottom-color: #cea017;
}



}

/*Viewport=600px*/
@media screen and (max-width: 33.75em) {

.mobile-hide {
	display: none;
}

.padding80{
padding:50px 20px;
    }
	
.padding100{
padding:50px 20px;
    }	

.padding150{
padding:50px 20px;
    }	


.t_product{
    display: table;
    width: 100%;
    height: 200px;
	background-color:#FFFFFF;
	border-bottom:5px solid #f7cc36;
}

.t_product:hover{
    display: table;
    width: 100%;
    height: 200px;
	background-color:#ffffe7;
	border-bottom:5px solid #f7cc36;
}
.separateLines{
border-bottom:1px solid #bcbec0;
border-right:0px solid #bcbec0;  
}
.diagramA {
	display:none;
}

.diagramB {
	display: block;
}

.separateDemo {
    border-top-style: none;
    border-right-style: none;
    border-bottom-style: solid;
    border-left-style: none;
    border-bottom-width: 1px;
    border-bottom-color: #cea017;
}
}

/*Viewport = 480px*/
@media screen and (max-width: 30em){
.padding80{
padding:50px 20px;
    }
	
.padding100{
padding:50px 20px;
    }	

.padding150{
padding:50px 20px;
    }	



.t_product{
    display: table;
    width: 100%;
    height: 250px;
	background-color:#FFFFFF;
	border-bottom:5px solid #f7cc36;
}

.t_product:hover{
    display: table;
    width: 100%;
    height: 250px;
	background-color:#ffffe7;
	border-bottom:5px solid #f7cc36;
}

.mobile-hide {
	display: none;
}
.separateLines{
border-bottom:1px solid #bcbec0;
border-right:0px solid #bcbec0;  
}

.CurveLeft{
border-top-left-radius: 100px;
}
.diagramA {
	display:none;
}

.diagramB {
	display: block;
}

.f_slogan1{
	font-size: 70px;
	line-height: 1.1;

}
.f_slogan2{
	font-size: 60px;
	line-height: 1.1;
}

.f_slogan3{
	font-size: 50px;
	line-height: 1.1;
}

.f_slogan4{
	font-size: 40px;
	line-height: 1.1;
}

.f_slogan5{
	font-size: 30px;
	line-height: 1.1;
}

.f_slogan6{
	font-size: 20px;
	line-height: 1.1;
}

.f_slogan7{
	font-size: 15px;
	line-height: 1.1;
}

.mainTitle1 {
	font-size: 40px;
	line-height: 1.1;
    letter-spacing: -0.05em;
	font-weight: 300;
}

.separateDemo {
    border-top-style: none;
    border-right-style: none;
    border-bottom-style: solid;
    border-left-style: none;
    border-bottom-width: 1px;
    border-bottom-color: #cea017;
}
.t_100x{
    display: table;
    width: 100%;
	height:50px;
}
}


@media screen and (max-width: 24em) {
.padding80{
padding:50px 20px;
    }
	
.padding100{
padding:50px 20px;
    }	

.padding150{
padding:50px 20px;
    }	



.t_product{
    display: table;
    width: 100%;
    height: 250px;
	background-color:#FFFFFF;
	border-bottom:5px solid #f7cc36;
}

.t_product:hover{
    display: table;
    width: 100%;
    height: 250px;
	background-color:#ffffe7;
	border-bottom:5px solid #f7cc36;
}

.mobile-hide {
	display: none;
}
.separateLines{
border-bottom:1px solid #bcbec0;
   
}

.CurveLeft{
border-top-left-radius: 100px;
}

.diagramA {
	display:none;
}

.diagramB {
	display: block;
}

.f_slogan1{
	font-size: 70px;
	line-height: 1.1;

}
.f_slogan2{
	font-size: 60px;
	line-height: 1.1;
}

.f_slogan3{
	font-size: 50px;
	line-height: 1.1;
}

.f_slogan4{
	font-size: 40px;
	line-height: 1.1;
}

.f_slogan5{
	font-size: 30px;
	line-height: 1.1;
}

.f_slogan6{
	font-size: 20px;
	line-height: 1.1;
}

.f_slogan7{
	font-size: 15px;
	line-height: 1.1;
}

.mainTitle1 {
	font-size: 40px;
	line-height: 1.1;
    letter-spacing: -0.05em;
	font-weight: 300;
}

.separateDemo {
    border-top-style: none;
    border-right-style: none;
    border-bottom-style: solid;
    border-left-style: none;
    border-bottom-width: 1px;
    border-bottom-color: #cea017;
}

.t_100x{
    display: table;
    width: 100%;
	height:50px;
}
}

@media screen and (max-width: 20em){
.padding80{
padding:50px 20px;
    }
	
.padding100{
padding:50px 20px;
    }	

.padding150{
padding:50px 20px;
    }	

.iconX {
	display: none;
}

.mobile-hide {
	display: none;
}

.t_product{
    display: table;
    width: 100%;
    height: 250px;
	background-color:#FFFFFF;
	border-bottom:5px solid #f7cc36;
}

.t_product:hover{
    display: table;
    width: 100%;
    height: 250px;
	background-color:#ffffe7;
	border-bottom:5px solid #f7cc36;
}

.separateLines{
border-bottom:1px solid #bcbec0;
border-right:0px solid #bcbec0;  
}

.CurveLeft{
border-top-left-radius: 100px;
}

.diagramA {
	display:none;
}

.diagramB {
	display: block;
}


.f_slogan1{
	font-size: 70px;
	line-height: 1.1;

}
.f_slogan2{
	font-size: 60px;
	line-height: 1.1;
}

.f_slogan3{
	font-size: 50px;
	line-height: 1.1;
}

.f_slogan4{
	font-size: 40px;
	line-height: 1.1;
}

.f_slogan5{
	font-size: 30px;
	line-height: 1.1;
}

.f_slogan6{
	font-size: 20px;
	line-height: 1.1;
}

.f_slogan7{
	font-size: 15px;
	line-height: 1.1;
}

.mainTitle1 {
	font-size: 40px;
	line-height: 1.1;
    letter-spacing: -0.05em;
	font-weight: 300;
}

.separateDemo {
    border-top-style: none;
    border-right-style: none;
    border-bottom-style: solid;
    border-left-style: none;
    border-bottom-width: 1px;
    border-bottom-color: #cea017;
}

.t_100x{
    display: table;
    width: 100%;
	height:50px;
}
}