/* ============ TELSTOCK FEATURES ============ */
#tft .tft-menu{
	margin:5px auto 15px;
	padding:10px 20px;
    height: 350px;
    overflow: hidden;
    -webkit-box-shadow: 1px 1px 2px rgba(0,0,0,0.35);
    -moz-box-shadow: 1px 1px 2px rgba(0,0,0,0.35);
    box-shadow: 1px 1px 2px rgba(0,0,0,0.35);
    -webkit-transition: all 300ms linear;
    -moz-transition: all 300ms linear;
    -o-transition: all 300ms linear;
    -ms-transition: all 300ms linear;
    transition: all 300ms linear;}
#tft .tft-menu span{
    text-align: center;
    width: 100%;
    height: 100%;
    display: block;
    position: relative;}
#tft .tft-menu span i{
    font-size: 80px;
    line-height: 100px;
	display:block;
	margin:25px auto 15px;
    width: 100%;
    -webkit-transition: all 400ms linear;
    -moz-transition: all 400ms linear;
    -o-transition: all 400ms linear;
    -ms-transition: all 400ms linear;
    transition: all 400ms linear;}
#tft .tft-menu .f-content{
	display:block;
	width:100%;
	margin:5px auto;
    text-align: center;
	padding:0;
    font-size: 18px;
    line-height: 28px;
    -webkit-transition: all 200ms linear both;
    -moz-transition: all 200ms linear both;
    -o-transition: all 200ms linear both;
    -ms-transition: all 200ms linear both;
    transition: all 200ms linear both;}	
#tft .tft-menu .f-content h3{
	padding:10px 0;}
#tft .tft-menu:hover{
	cursor: default;
    z-index:999;
    -webkit-transform: scale(1.1);  
    -moz-transform: scale(1.1);  
    -ms-transform: scale(1.1);   
    -o-transform: scale(1.1);   
    transform: scale(1.1);}
#tft .tft-menu:hover span{
	cursor: default;}
#tft .tft-menu:hover i{
	cursor: default;
    font-size: 110px;}
		
@-webkit-keyframes mTtft {
	0% {top: 30%;}
	100% {top: 35%;}	}
@-moz-keyframes mTtft {
	0% {top: 30%;}
	100% {top: 35%;}		}
@-ms-keyframes mTtft {
	0% {top: 30%;}
	100% {top: 35%;}		}
@keyframes mTtft {
	0% {top: 30%;}
	100% {top: 35%;}		}
@-webkit-keyframes sTtft{
	0% {font-size: 24px; top: 100px;}
	100% {font-size: 26px; top: 50px;}	}
@-moz-keyframes sTtft{
	0% {font-size: 24px; top: 100px;}
	100% {font-size: 26px; top: 50px;}}
@-ms-keyframes sTtft{
	0% {font-size: 24px; top: 100px;}
	100% {font-size: 26px; top: 50px;}}
@keyframes sTtft{
	0% {font-size: 24px; top: 100px;}
	100% {font-size: 26px; top: 50px;}}	
	
#tft .tft-menu{
    background: #454945;}
#tft .tft-menu span{
    color: #FFF;}
#tft .tft-menu span i{
    color: #99CC00;
    text-shadow: 1px 1px 1px rgba(0,0,0,0.5);}
#tft .tft-menu .f-content{
    text-shadow: 2px 2px 2px rgba(0,0,0,0.25);}
#tft .tft-menu:hover{
    background-color: #FFF;}
#tft .tft-menu:hover i{
    color: rgba(119,178,0,0.1);
    text-shadow: 0px 0px 0px rgba(0,0,0,0);}
#tft .tft-menu:hover .f-main{
    color: #99CC00;
    text-shadow: 0px 0px 0px rgba(0,0,0,0);}
#tft .tft-menu:hover .f-content{
    color: #353935;
    text-shadow: 0px 0px 0px rgba(0,0,0,0);}	

@media (min-width:0px) and (max-width:479px){
#tft .tft-menu{
	margin:5px 0 15px;
	padding:20px;
    height: 200px;}
#tft .tft-menu span{
    text-align: left;
    width: 100%;
    height: 100%;
    display: block;
    position: relative;}
#tft .tft-menu span i{
    font-size: 120px;
	line-height:80px;
    position: relative;
	display:block;
    width: 100%;
	margin:40px auto 20px;
    text-align: center;
    color: rgba(119,178,0,0.55);}	
#tft .tft-menu .f-content {
    text-align: center;
	display: block;
	position:absolute;
	top:-20px;
    width: auto;
    height: auto !important;
    margin: 0 auto;
    text-shadow: 2px 2px 1px rgba(0, 0, 0, 0.75);}
#tft .tft-menu .f-content p{
    font-size: 20px;
    line-height: 28px;}
#tft .tft-menu:hover{
	cursor: default;
    z-index:999;
    -webkit-transform: none !important;
    -moz-transform: none !important;
    -ms-transform: none !important;
    -o-transform: none !important;
    transform: none !important;}
#tft .tft-menu:hover i{
    font-size: 150px;
    color: rgba(119,178,0,0.1);}}	
@media (min-width:480px) and (max-width:767px){
#tft .tft-menu{
	margin:5px 0 15px;
	padding:10px 40px;
    height: 175px;}
#tft .tft-menu span{
    text-align: center;
    width: 100%;
    height: 100%;
    display: block;
    position: relative;}
#tft .tft-menu span i{
    font-size: 80px;
	line-height:80px;
    position: relative;
	display:block;
    width: 80px;
    height: 80px;
	float:left;
    text-align: left;
	color: rgba(119,178,0,0.55);}	
#tft .tft-menu .f-content {
	display: block;
    float: left;
    left: 130px;
    position: absolute;
    text-align: left;
    top: 0px;
    width: 70%;}
#tft .tft-menu .f-content p{
    font-size: 20px;
    line-height: 26px;}
#tft .tft-menu:hover{
	cursor: default;
    z-index:999;
    -webkit-transform: none !important;
    -moz-transform: none !important;
    -ms-transform: none !important;
    -o-transform: none !important;
    transform: none !important;}
#tft .tft-menu:hover i{
	cursor: default;
    font-size: 80px;
    color:#99CC00;
    text-shadow: 1px 1px 1px rgba(0,0,0,0.25);}}
@media (min-width:768px) and (max-width:991px){
#tft .tft-menu{ height: 250px; margin:5px 0; padding:20px;}
#tft .tft-menu .f-content h3 {
	font-size: 20px;
    line-height: 34px;
    margin: 0 0 0 -8px;
    padding: 0 0 10px;}
#tft .tft-menu span i{
    font-size: 80px;
    line-height: 100px;
	display:block;
	margin:0px auto 20px;
    width: 100%;
    position: relative;
    text-align: center;
    color: rgba(119,178,0,0.55);}
#tft .tft-menu .f-content{
	display:block;
    position: absolute;
	width:100%;
	margin:5px auto;
    text-align: center;
	padding:0;
	top:0;}
#tft .tft-menu:hover i{
	cursor: default;
    font-size: 80px;
    color: rgba(119,178,0,0.1);}}
@media (min-width:992px){	
 #tft .tft-menu .f-main {
    height: 50%;
    left: 0;
    position: absolute;
    text-align: center;
    top: 100px;
    width: 100%;}
#tft .tft-menu .f-sub {
    left: 0;
    position: absolute;
    text-align: center;
    top: 160px;
    width: 100%;}
#tft .tft-menu:hover .f-main{
	cursor: default;
    -webkit-animation: sTtft 300ms ease both;
    -moz-animation: sTtft 300ms ease both;
    -ms-animation: sTtft 300ms ease both;}
#tft .tft-menu:hover .f-sub{
	cursor: default;
    -webkit-animation: mTtft 500ms ease both;
    -moz-animation: mTtft 500ms ease both;
    -ms-animation: mTtft 500ms ease both;}}
	
/* ============ TELSTOCK US ============ */
#t-us .f-menu{
	margin:5px auto 15px;
	padding:10px 20px;
    height: 475px;
    overflow: hidden;
    -webkit-box-shadow: 1px 1px 2px rgba(0,0,0,0.35);
    -moz-box-shadow: 1px 1px 2px rgba(0,0,0,0.35);
    box-shadow: 1px 1px 2px rgba(0,0,0,0.35);
    -webkit-transition: all 300ms linear;
    -moz-transition: all 300ms linear;
    -o-transition: all 300ms linear;
    -ms-transition: all 300ms linear;
    transition: all 300ms linear;}
#t-us .f-menu span{
    text-align: center;
    width: 100%;
    height: 100%;
    display: block;
    position: relative;}
#t-us .f-menu span i{
    font-size: 80px;
    line-height: 100px;
	display:block;
	margin:25px auto 15px;
    width: 100%;
    -webkit-transition: all 400ms linear;
    -moz-transition: all 400ms linear;
    -o-transition: all 400ms linear;
    -ms-transition: all 400ms linear;
    transition: all 400ms linear;}
#t-us .f-menu .f-content{
	display:block;
	width:100%;
	margin:5px auto;
    text-align: center;
	padding:0;
    font-size: 18px;
    line-height: 28px;
    -webkit-transition: all 200ms linear both;
    -moz-transition: all 200ms linear both;
    -o-transition: all 200ms linear both;
    -ms-transition: all 200ms linear both;
    transition: all 200ms linear both;}	
#t-us .f-menu .f-content h3{
	padding:10px 0;}
#t-us .f-menu .f-sub {
    text-align: left;
	font-family: "Helvetica-Light",sans-serif;}
#t-us .f-menu:hover{
	cursor: default;
    z-index:999;
    -webkit-transform: scale(1.1);  
    -moz-transform: scale(1.1);  
    -ms-transform: scale(1.1);   
    -o-transform: scale(1.1);   
    transform: scale(1.1);}
#t-us .f-menu:hover span{
	cursor: default;}
#t-us .f-menu:hover i{
	cursor: default;
    font-size: 110px;}
	
#t-us .f-menu{
    background: #454945;}
#t-us .f-menu span{
    color: #FFF;}
#t-us .f-menu span i{
    color: #99CC00;
    text-shadow: 1px 1px 1px rgba(0,0,0,0.5);}
#t-us .f-menu .f-content{
    text-shadow: 2px 2px 2px rgba(0,0,0,0.25);}
#t-us .f-menu:hover{
    background-color: #FFF;}
#t-us .f-menu:hover i{
    color: rgba(119,178,0,0.1);
    text-shadow: 0px 0px 0px rgba(0,0,0,0);}
#t-us .f-menu:hover .f-main{
    color: #99CC00;
    text-shadow: 0px 0px 0px rgba(0,0,0,0);}
#t-us .f-menu:hover .f-content{
    color: #353935;
    text-shadow: 0px 0px 0px rgba(0,0,0,0);}	
	
@media (min-width:0px) and (max-width:479px){
#t-us .f-menu{
	margin:5px 0 15px;
	padding:20px;
    height: 625px;}
#t-us .f-menu span{
    text-align: left;
    width: 100%;
    height: 100%;
    display: block;
    position: relative;}
#t-us .f-menu span i{
    font-size: 120px;
	line-height:80px;
    position: relative;
	display:block;
    width: 100%;
	margin:40px auto 20px;
    text-align: center;
    color: rgba(119,178,0,0.55);}	
#t-us .f-menu .f-content {
    text-align: center;
	display: block;
	position:absolute;
    width: auto;
    height: auto !important;
    margin: 0 auto;
    text-shadow: none;}
#t-us .f-menu .f-content p{
    font-size: 18px;
    line-height: 28px;
	padding-top:10px;}
#t-us .f-menu:hover{
	cursor: default;
    z-index:999;
    -webkit-transform: none !important;
    -moz-transform: none !important;
    -ms-transform: none !important;
    -o-transform: none !important;
    transform: none !important;}
#t-us .f-menu:hover i{
    font-size: 150px;
    color: rgba(119,178,0,0.1);}}	
@media (min-width:480px) and (max-width:767px){
#t-us .f-menu{
	margin:5px 0 15px;
	padding:10px 40px;
    height: 275px;}
#t-us .f-menu span{
    text-align: center;
    width: 100%;
    height: 100%;
    display: block;
    position: relative;}
#t-us .f-menu span i{
    font-size: 80px;
	line-height:80px;
    position: relative;
	display:block;
    width: 80px;
    height: 80px;
	float:left;
    text-align: left;
	color: rgba(119,178,0,0.55);}	
#t-us .f-menu .f-content {
	display: block;
    float: left;
    left: 130px;
    position: absolute;
    text-align: left;
    top: 0px;
    width: 70%;}
#t-us .f-menu .f-content p{
    font-size: 18px;
    line-height: 28px;}
#t-us .f-menu:hover{
	cursor: default;
    z-index:999;
    -webkit-transform: none !important;
    -moz-transform: none !important;
    -ms-transform: none !important;
    -o-transform: none !important;
    transform: none !important;}
#t-us .f-menu:hover i{
	cursor: default;
    font-size: 80px;
    color:#99CC00;
    text-shadow: none;}}
@media (min-width:768px) and (max-width:991px){
#t-us .f-menu{ height: 300px; margin:5px 0 20px; padding:20px 40px;}
#t-us .f-menu .f-content h3 {
	font-size: 20px;
    line-height: 34px;
    margin: 0 0 0 -8px;
    padding: 0 0 10px;}
#t-us .f-menu span i{
    font-size: 80px;
    line-height: 100px;
	display:block;
	margin:0px auto;
    width: 100%;
    position: relative;
    text-align: center;
    color: rgba(119,178,0,0.55);}
#t-us .f-menu .f-content{
	display:block;
    position: absolute;
	width:100%;
	margin:0px auto 5px;
    text-align: center;
	padding:0;}
#t-us .f-menu:hover i{
	cursor: default;
    font-size: 80px;
    color: #99CC00;}}
@media (min-width:992px){	
 #t-us .f-menu .f-main {
    height: 50%;
    left: 0;
    position: absolute;
    text-align: center;
    top: 100px;
    width: 100%;}
#t-us .f-menu .f-sub {
    text-align: left;
    left: 0;
    position: absolute;
    top: 160px;
    width: 100%;}
#t-us .f-menu:hover .f-main{
	cursor: default;
    -webkit-animation: sTtft 300ms ease both;
    -moz-animation: sTtft 300ms ease both;
    -ms-animation: sTtft 300ms ease both;}
#t-us .f-menu:hover .f-sub{
	cursor: default;
    -webkit-animation: mTtft 500ms ease both;
    -moz-animation: mTtft 500ms ease both;
    -ms-animation: mTtft 500ms ease both;}}
	
/* ============ ABOUT US ============ */
#about-us .f-menu{
	margin:15px auto;
	padding:0 30px;
    height: 450px;
    overflow: hidden;
    -webkit-box-shadow: 1px 1px 2px rgba(0,0,0,0.35);
    -moz-box-shadow: 1px 1px 2px rgba(0,0,0,0.35);
    box-shadow: 1px 1px 2px rgba(0,0,0,0.35);
    -webkit-transition: all 300ms linear;
    -moz-transition: all 300ms linear;
    -o-transition: all 300ms linear;
    -ms-transition: all 300ms linear;
    transition: all 300ms linear;}
#about-us .f-menu a{
    text-align: left;
    width: 100%;
    height: 100%;
    display: block;
    position: relative;}
#about-us .f-menu a i{
    font-size: 80px;
    line-height: 120px;
    position: absolute;
    width: 100%;
    height: 50%;
    left: 0px;
    top: 10px;
    text-align: center;
    -webkit-transition: all 400ms linear;
    -moz-transition: all 400ms linear;
    -o-transition: all 400ms linear;
    -ms-transition: all 400ms linear;
    transition: all 400ms linear;}
#about-us .f-menu a i, #about-us .f-menu a:hover i, #about-us .f-menu a:focus i, #about-us .f-menu a:active i{
	text-decoration:none;}	
#about-us .f-menu .f-content{}
#about-us .f-menu .f-content h3{
	padding:0;}
#about-us .f-menu .f-main{
    position: absolute;
    left: 0px;
    width: 100%;
    height: 50%;
    top: 100px;
    /*opacity: 0.8;*/
    text-align: center;
    -webkit-transition: all 200ms linear both;
    -moz-transition: all 200ms linear both;
    -o-transition: all 200ms linear both;
    -ms-transition: all 200ms linear both;
    transition: all 200ms linear both;}
#about-us .f-menu .f-sub{
    text-align: left;
    position: absolute;
    top: 170px;
    width: 100%;
    left: 0px;
    -webkit-transition: all 200ms linear both;
    -moz-transition: all 200ms linear both;
    -o-transition: all 200ms linear both;
    -ms-transition: all 200ms linear both;
    transition: all 200ms linear both;}
#about-us .f-menu:hover{
	cursor: default;
    z-index:999;
    -webkit-transform: scale(1.1);  
    -moz-transform: scale(1.1);  
    -ms-transform: scale(1.1);   
    -o-transform: scale(1.1);   
    transform: scale(1.1);}
#about-us .f-menu:hover a{
	cursor: default;}
#about-us .f-menu:hover i{
	cursor: default;
    font-size: 110px;
	top:15px;}
#about-us .f-menu:hover .f-main{
	cursor: default;
    -webkit-animation: smallToBig3 300ms ease both;
    -moz-animation: smallToBig3 300ms ease both;
    -ms-animation: smallToBig3 300ms ease both;}
#about-us .f-menu:hover .f-sub{
	cursor: default;
    -webkit-animation: moveFromBottom 500ms ease both;
    -moz-animation: moveFromBottom 500ms ease both;
    -ms-animation: moveFromBottom 500ms ease both;}

@-webkit-keyframes smallToBig3{
	0% {font-size: 24px; top: 100px;}
	100% {font-size: 26px; top: 50px;}}
@-moz-keyframes smallToBig3{
	0% {font-size: 24px; top: 100px;}
	100% {font-size: 26px; top: 50px;}}
@-ms-keyframes smallToBig3{
	0% {font-size: 24px; top: 100px;}
	100% {font-size: 26px; top: 50px;}}
@keyframes smallToBig3{
	0% {font-size: 24px; top: 100px;}
	100% {font-size: 26px; top: 50px;}}	
		
#about-us .f-menu{
    background: #454945;}
#about-us .f-menu a{
    color: #FFF;}
#about-us .f-menu a i{
    color: #99CC00;
    text-shadow: 1px 1px 1px rgba(0,0,0,0.5);}
#about-us .f-menu .f-main{
    color: #99CC00;
    text-shadow: 0px 0px 0px rgba(0,0,0,0);}
#about-us .f-menu:hover{
    background-color: #FFF;}
#about-us .f-menu:hover i{
    color: rgba(119,178,0,0.1);
    text-shadow: 0px 0px 0px rgba(0,0,0,0);}
#about-us .f-menu:hover .f-main{
    color: #99CC00;
    text-shadow: 0px 0px 0px rgba(0,0,0,0);}
#about-us .f-menu:hover .f-sub{
    color: #353935;
    text-shadow: 0px 0px 0px rgba(0,0,0,0);}	
	
@media (max-width:767px){
#about-us .f-menu{ height: 500px; margin:5px 0 25px;}	}
 @media (min-width:768px) and (max-width:991px){
#about-us .f-menu{ height: 300px;}	}