﻿
@import url(http://fonts.googleapis.com/css?family=Roboto:100,300,400,500,700,900);


/*homepage css statrt */
.Topname_heading {
    float: left;
    margin-left: 45px;
    margin-top: 4px;
    color: #fff;
    text-align: left;
    font-size: 11px;
    width: 40%;
}

.toplogo {
    float: right;
    display: block;
    width: 64%;
    position: absolute;
    right: 0;
    text-align: right;
    margin-top: 5px;
    /*margin-top: 10px;*/
}

    .toplogo img {
        right: 0;
        text-align: right;
        position: relative !important;
        margin-right: 4px;
        left: 0;
    }

.reponsive_IMG {
    width: 100%;
    height: auto;
}

.top3_block {
    display: block;
    clear: both;
   
    float: left;
   
    width: 100%;
    text-align: center;
    background: #fadd38;
   
}

    .top3_block .top3_tab {
        display: inline-block;
        width: 33.33%;
        margin: 0px -2px 0px -3px;
        text-align: center;
        vertical-align: top;
    }

        .top3_block .top3_tab:active {
            background: #f9ce05;
        }

    .top3_block .top3_center:active {
        background: #f9ce05;
    }

    .top3_block .top3_center {
        display: inline-block;
        width: 33.33%;
        margin: 0px -2px 0px -3px;
        border-left: solid 1px #a68605;
        border-right: solid 1px #a68605;
        text-align: center;
        vertical-align: top;
        position: relative;
    }

    .top3_block span {
        text-align: center;
        width: 100%;
        display: block;
        color: #000;
        font-size: 11px;
        height: 32px;
        margin-top: 6px;
    }

    .top3_block Div {
        font-size: 11px;
        line-height: 14px;
        font-weight: 500;
         margin-bottom: 4px;
    }

    .Blue_Areaicon {
    padding-top: 30px;
width: 20%
}
  

.Blue_Area {
    width: 100%;
    height: auto;
    float: left;
    margin-bottom: 0%;
}

.blue_areabig {
    width: 100%;
    margin: auto;
    margin-top: 8px;
    overflow: auto;
    margin-bottom: 5px;
	background-color:#fff;
}

.blue_AreaBigContainer {
    display: table;
    height: auto;
    width: 49%;
  
  
    float: left;
    min-height: 109px;
    color: #555555;
}

.blue_AreaBigContainerright {
    display: table;
    height: auto;
    width: 49%;
    background: #f4f5f6;
    float: right;
  
    min-height: 109px;
    color: #555555;
}

.blue_AreaBigContainer:active {
    border: 1px solid #0085c8;
    color: #005387 !important;
}

.blue_AreaBigContainerright:active {
    border: 1px solid #0085c8;
    color: #005387 !important;
}

.blueArea_Vertical {
    display: table-cell;
    vertical-align: middle;
    padding: 4px;
    text-align:center;
}

.blueArea_VerticalText {
    width: 100%;
    text-align: center;
    font-size:17px ;
    font-weight: normal;
    padding-top:8px;
}




.white_box {
    display: inline-block;
    height: auto;
    width: 49%;
   

    
    float: left;
    min-height: 50px;
    display: table;
}

.white_boxright {
    display: inline-block;
    height: auto;
    width: 49%;
   
    float: right;
   

    min-height: 50px;
    display: table;
}

.white_box:active {
    background: #f2fbff;
    border: 1px solid #8ab9d0;
}

.white_boxright:active {
    background: #f2fbff;
    border: 1px solid #8ab9d0;
}

.whitebox_textarea span:active {
    color: #0084c7 !important;
}

.whitebox_imagearea {
    float: left;
    margin-right: 6px;
    margin-top: 10px;
}

    .whitebox_imagearea img {
        float: left;
        margin-right: 3px;
        max-width: 39px;
        max-height: 40px;
        margin-left: 1%;
    }

.whitebox_textarea {
    float: left;
    min-width: 100px;
    min-height: 35px;
    display: table;
    word-wrap: break-word;
    margin-top: 6px;
}

    .whitebox_textarea span {
        font-size: 11px;
        line-height: 18px;
        color: #000;
        display: table-cell;
        vertical-align: middle;
        word-wrap: break-word;
        font-weight: 500;
    }



.tools_area {
    width: 100%;
    /* margin-top: 1%; */
    background: #fff;

    height: auto;
    /* margin-left: 1%; */
    float: left;
    margin: auto;
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
}

    .tools_area .heading {
        background: #555555;
        color: #fff;
        font-size: 12px;
        font-weight: 500;
        width: 100%;
        display: block;
    }

        .tools_area .heading span {
            margin-left: 15px;
            line-height: 35px;
        }

.tools_areaScroll {
    max-width: 900px;
    overflow-x: scroll;
    min-height: 75px;
     margin-right:5px;
}

    .tools_areaScroll::-webkit-scrollbar {
        display: none;
    }

.tools_area ul {
    width: 1000px;
    padding: 0;
    margin-top: 2%;
    margin-bottom: 2%;
    text-align: center;
}

    .tools_area ul li {
        display: inline-block;
        width: 23%;

        height: auto;
        vertical-align: top;
        max-width: 100px;
        float: left;
        margin-left: 10px;
    }

        .tools_area ul li:active {
            background: #cdcdcd;
        }

        .tools_area ul li span {
            width: 100%;
            display: block;
            text-align: center;
            min-height: 35px;
            margin-top: 5px;
        }

        .tools_area ul li Div {
            text-align: center;
            line-height: 18px;
            font-size: 10px;
            color: #000;
            font-weight: 500;
        }

        .tools_area ul li span img {
            width: 30px;
            height: 28px;
            text-align: center;
            padding-top: 2%;
        }


.financial_area {
    width: 98%;
    margin-top: 1%;
    background: #014672;
    border: 1px solid #d6d6d6;
    height: auto;
    margin-left: 1%;
    float: left;
    margin-bottom: 37px;
}

    .financial_area .heading {
        background: #005387;
        color: #fff;
        font-size: 12px;
        font-weight: 500;
        width: 100%;
        display: block;
        border-bottom: 1px solid #296e99;
    }

        .financial_area .heading span {
            margin-left: 15px;
            line-height: 20px;
        }


    .financial_area ul {
        width: 100%;
        padding: 0;
        margin-top: 2%;
        margin-bottom: 2%;
        margin: auto;
        padding-top: 2px;
        padding-bottom: 4px;
        text-align: center;
    }

        .financial_area ul li {
            display: inline-block;
            width: 31%;
            border: 1px solid #0074bc;
            height: auto;
        }

.financial_imagearea {
    float: left;
    margin-right: 6px;
    padding-top: 5%;
    padding-left: 4%;
}

    .financial_imagearea div {
        border-radius: 50%;
        width: 40px;
        height: 40px;
        background: #fff;
        margin: auto;
        box-shadow: inset 5px 4px 6px #C7C7C7;
    }

        .financial_imagearea div img {
            margin-top: 4px;
        }

.financial_textarea {
    float: left;
    min-width: 100px;
    height: 70px;
    display: table;
}

    .financial_textarea span {
        height: 50px;
        font-size: 12px;
        line-height: 20px;
        color: #fff;
        display: table-cell;
        vertical-align: middle;
    }


    /* ios 4 */
@media only screen 
  and (min-device-width: 320px) 
  and (max-device-height: 480px)
  and (-webkit-min-device-pixel-ratio: 2)
  and (orientation: portrait) {
    .whitebox_imagearea {
    float: left;
    margin-right: 3px;
    margin-top: 13px !important;}
    
    .whitebox_imagearea img {
    float: left;
    margin-right: 3px;
    max-width: 23px;
    max-height: 24px;
    margin-left: 3px;}
    .whitebox_textarea {
    float: left;
    min-width: 100px;
    min-height: 35px;
    display: table;
    word-wrap: break-word;
    margin-top: 8px !important;
	}
	
	
    .Blue_Area {
    width: 304px;
    height: auto;
    float: none;
    margin-bottom: 0%;
    margin: auto;
    }
    
    .top3_block {
    display: block;
    clear: both;
    float: none;
   
    width: 100%;
    text-align: center;
    background: #fadd38;}
	
	.top3_block span {
    margin-top: 6px !important;
	}
    
    .blue_AreaBigContainer{
   height: 104px !important;
min-height: 100px !important;
width: 100%;



    }
    .blue_AreaBigContainerright{

    height: 104px !important;
min-height: 100px !important;
width: 100%;




    }
    .tools_area .heading span{ line-height:25px !important;
    }
    .white_box{ 
    min-height:50px !important;
width: 100%;

height: 50px !important;

    }
    .white_boxright{ 

 min-height: 45px !important;
width: 100%;

height: 50px !important;

    }
    .blueArea_VerticalText {
   width: 100%;
text-align: center;
font-size: 15px !important;
font-weight: normal;
padding-top: 4px !important;
line-height: 18px
	}
    .tools_areaScroll {
    min-height: 80px !important;
     margin-right:5px;
    }
    .top3_block Div {
        line-height: 12px !important;
    }



       .white_boxright img {
       min-height: 50px;
width: 125px;
height: 50px;
    }

    .white_box img {
     min-height: 50px;
width: 125px;
height: 50px;

    }
    .blue_AreaBigContainer img {
       
width: 104px;
height: 104px;
    }

    .blue_AreaBigContainerright img {
        /* height: 70px !important; */
width: 104px;
height: 104px;
    }
     .tools_area {
      min-height: 100px;
height: 104px;
    }
      .tools_area ul
      {
      margin-top:1% !important;

      }  
 .top3_block span img
 {
 height:30px !important;
 }
    
}
  


  /*  ios 5 */

@media only screen 
  and (min-device-width: 320px) 
  and (max-device-width: 568px)
  and (-webkit-min-device-pixel-ratio: 2)
  and (orientation: portrait)
 
    {
	
	.whitebox_imagearea {
    float: left;
    margin-right: 3px;
    margin-top: 20px;}
    
    .whitebox_imagearea img {
    float: left;
    margin-right: 3px;
    max-width: 23px;
    max-height: 24px;
    margin-left: 3px;}
	.whitebox_textarea {
    float: left;
    min-width: 100px;
    min-height: 35px;
    display: table;
    word-wrap: break-word;
    margin-top: 14px;
	}
    
    .Blue_Area {
    width: 304px;
    height: auto;
    float: none;
    margin-bottom: 0%;
    margin: auto;
    }
    
    .top3_block {
    display: block;
    clear: both;
    float: none;

    width: 100%;
    text-align: center;
    background: #fadd38;}
	
	.top3_block span {
    margin-top: 12px;
	}
	.blueArea_VerticalText {
    padding-top: 17px ;
	font-size:19px;

    }
	
   .blue_AreaBigContainer {
       min-height: 126px;
width: 100%;

    }

    .blue_AreaBigContainerright {
        min-height: 126px;
width: 100%;

    }

    .tools_areaScroll {
        min-height: 85px;
         margin-right:10px;
    }

    .tools_area ul {
        margin-top: 3%;
    }

    .white_boxright {
       min-height: 61px;
width: 100%;

    }

    .white_box {
      min-height: 61px;
width: 100%;

    }

    .top3_block Div {
        line-height: 20px;
    }


        .white_boxright img {
     min-height: 61px;
width: 150px;
height: 61px;
    }

    .white_box img {
     min-height: 61px;
width: 150px;
height: 61px;
    }
    .blue_AreaBigContainer img {
       height: 127px;
width: 127px;
    }

    .blue_AreaBigContainerright img {
       min-height: 127px;
width: 127px;
    }
     .tools_area {
      min-height: 127px;
    }  
      
}



/* ios 6 */


@media only screen 
  and (min-device-width: 375px) 
  and (max-device-width: 667px) 
  and (-webkit-min-device-pixel-ratio: 2)
  and (orientation: portrait) {
	  
	.whitebox_imagearea {
    float: left;
    margin-right: 3px;
    margin-top: 20px;}
    
    .whitebox_imagearea img {
    float: left;
    margin-right: 3px;
    max-width: 30px;
    max-height: 31px;
    margin-left:5px;}
	
	.whitebox_textarea {
    float: left;
    min-width: 100px;
    min-height: 35px;
    display: table;
    word-wrap: break-word;
    margin-top: 17px;
	}
	.whitebox_textarea span{
		font-size:12px;
		
	}

	.Blue_Area {
    width: 359px;
    }
	.blue_areabig {
    margin-bottom: 8px;

    }
	.blue_AreaBigContainer {
       min-height: 156px;
width: 100%;

    }

    .blue_AreaBigContainerright {
       min-height: 156px;
width: 100%;

    }

    .tools_areaScroll {
        min-height: 98px;
         margin-right:5px;
    }

    .tools_area ul {
        margin-top: 3%;
    }

    .white_boxright {
       min-height: 75px;
width: 100%;

    }

    .white_box {
       min-height: 75px;
width: 100%;

    }

    .top3_block Div {
    line-height: 24px;
	font-size: 13px;
    font-weight: normal;

    }

    .top3_block span {
        height: 35px;
        margin-top: 13px;
    }

    .tools_area .heading span {
        line-height: 46px;
		font-size:17px;
		font-weight:normal;
    }

    .tools_area ul li span {
        min-height: 45px;
    }

    .tools_area ul li span img {
            padding-top: 6%;
        }
	.blueArea_VerticalText {
	font-size:19px;
    }


      .white_boxright img {
       min-height: 75px;
width: 182px;
height: 75px;
    }

    .white_box img {
      min-height: 75px;
width: 182px;
height: 75px;
    }
    .blue_AreaBigContainer img {
        min-height: 156px;
width: 156px;
    }

    .blue_AreaBigContainerright img {
        min-height: 156px;
width: 156px;
    }
     .tools_area {
       min-height: 156px;
    }

}


/*  ios 6s plus */
@media only screen 
  and (min-device-width: 414px) 
  and (max-device-width: 736px) 
  and (-webkit-min-device-pixel-ratio: 3)
  and (orientation: portrait) { 
  
	.whitebox_imagearea {
    float: left;
    margin-right: 3px;
    margin-top: 20px;}
    
    .whitebox_imagearea img {
    float: left;
    margin-right: 3px;
    max-width: 35px;
    max-height: 36px;
    margin-left:9px;}
	
	.whitebox_textarea {
    float: left;
    min-width: 100px;
    min-height: 35px;
    display: table;
    word-wrap: break-word;
    margin-top: 18px;
	}
	.whitebox_textarea span{
	font-size: 13px;
    font-weight: normal;
		
	}

	.Blue_Area {
    width: 398px;
    }
	.blue_areabig{
	margin-bottom: 8px;	
	}
	.blueArea_VerticalText {
	font-size:21px;
    }
	
   .blue_AreaBigContainer {
      min-height: 179px;
width: 100%;

    }

    .blue_AreaBigContainerright {
        min-height: 179px;
width: 100%;

    }

    .tools_areaScroll {
        min-height: 98px;
        margin-right:5px;
    }

    .tools_area ul {
        margin-top: 3%;
    }

    .white_boxright {
       min-height: 86px;
width: 100%;

    }

    .white_box {
      min-height: 86px;
width: 100%;

    }

    .top3_block Div {
    line-height: 35px;
	font-size: 14px;
    font-weight: normal;
    margin-bottom: 4px;
    }

    .top3_block span {
    height: 26px;
    margin-top: 17px;
    }

    .tools_area .heading span {
        line-height: 46px;
		font-size: 17px;
    }

    .tools_area ul li span {
        min-height: 45px;
    }

    .tools_area ul li span img {
            padding-top: 6%;
        }




     

    .tools_areaScroll {
        min-height: 98px;
         margin-right:5px;
    }

    .tools_area ul {
        margin-top: 3%;
    }

  

    .top3_block Div {
    line-height: 24px;
	font-size: 13px;
    font-weight: normal;

    }

    .top3_block span {
        height: 35px;
        margin-top: 13px;
    }

    .tools_area .heading span {
        line-height: 46px;
		font-size:17px;
		font-weight:normal;
    }

    .tools_area ul li span {
        min-height: 45px;
    }

    .tools_area ul li span img {
            padding-top: 6%;
        }
	.blueArea_VerticalText {
	font-size:19px;
    }


      .white_boxright img {
       min-height: 86px;
width: 200px;
height: 86px;
    }

    .white_box img {
     min-height: 86px;
width: 200px;
height: 86px;
    }
    .blue_AreaBigContainer img {
      height: 179px;
width: 179px;
    }

    .blue_AreaBigContainerright img {
      min-height: 179px;
width: 179px;
    }
     .tools_area {
       min-height: 179px;
    }
    .tools_area ul li  img {
           height:100px;
        }
        .tools_area ul li
        {

        width: 30% !important;

max-width: 115px !important;
        }
}

}

/*Veritical fit css statrt */

