 * {
     font-family:"Figtree", sans-serif;
}

#userCharge{
 	background: #EC6730;
 }
 
 
#simpleInfoCubeInfo{
	display:none;
}
 #theImg{
 
	width: 65%;
	min-width:650px;
	margin-bottom:100px;
	display:inline-block;
 }
 

 
#portlet_com_example_portlet_MainchoisemvcportletPortlet_INSTANCE_YtjsmgLXlB6q .mainChoiseContainer,
#portlet_com_example_portlet_MainchoisemvcportletPortlet_INSTANCE_3MtvamqQgR1y .mainChoiseContainer{
	height:75px;
}
#portlet_com_example_portlet_MainchoisemvcportletPortlet_INSTANCE_YtjsmgLXlB6q .mainChoise,
#portlet_com_example_portlet_MainchoisemvcportletPortlet_INSTANCE_3MtvamqQgR1y .mainChoise{
	height:75px;
}

table {
	margin: 1% auto;
	border-collapse: collapse;
	width: 85%;
}

#mobileVersion table {
	width: 95%;
}

.category {
	color: #016a82;
	font-size: 50px;
}

#mobileVersion .category {
	font-size: 40px;
}

.tg.threeAxles, .tg.fourAxles {
	font-weight: 600;
	font-size: 30px;
}

#mobileVersion .tg.threeAxles, #mobileVersion .tg.fourAxles {
	font-size: 20px;
}

#desktopView tr:nth-child(odd):nth-child(n+4) td, #mobileVersion tr:nth-child(5) td,
	#mobileVersion tr:nth-child(7) td, #mobileVersion tr:nth-child(9) td,
	#mobileVersion tr:nth-child(14) td, #mobileVersion tr:nth-child(16) td,
	#mobileVersion tr:nth-child(18) td {
	background: #e4e7ea;
}

.mainChooseIcon, .findTruckVinette, .menuIcon, .loginIcon, .paidRoads, .sellPoints, .userCharge{
	width:45px; 
	margin-bottom:0px;
}
.mainChooseIcon:hover, .findTruckVinette:hover, .menuIcon:hover, .loginIcon:hover, .paidRoads:hover,  .sellPoints:hover, .userCharge:hover{
	width:45px; 
	margin-bottom:0px;
}


.mainChoise {
    margin-left: 15px;
    margin-right: 15px;
    display: inline;
    padding-top: 5px;
    height: 75px;
    max-width: 240px;
    width: 20%;
    text-align: center;
    transition: width,background,0.1s,0.2s;
    transition-timing-function: ease-in;
    transition-delay: .1s;
    color: #fff;
    font-weight: 500;
    font-size: 14px;
    background: #1D1B1D;
}


.secondaryMainChoise{	

	margin-left:15px;
	margin-right:15px;
 	display: inline;
	padding-top: 30px;
	height: 70px;
	max-width:240px;
	width: 20%;
	text-align: center;
	transition: width, background, 0.1s, 0.2s;
	transition-timing-function: ease-in;
	transition-delay: 0.1s;
	color: #ffffff;
	font-weight:500;
	font-size:14px;
    background: #EC6730;

}


.secondaryMainChoise:hover{
	color:#ffffff;
	background: #565656;
	transition: background, color, 0.1s;
	transition-timing-function: ease-in;
	cursor: pointer;
}


.secondaryChoiseContainer {
    width: 100%;
    min-width: 830px;
    padding-bottom: 55px;
    height: 70px;
    position: relative;
    left: 0;
    top: 0;
    padding: 0!important;
    display: flex;
    font-size: 13px;
    background: #EC6730;
    right: 0;
    margin-top: 0;
}
.mainChooseIcon, .findTruckVinette, .menuIcon, .loginIcon {
    width: 45px;
    margin-bottom: 0px;
}

 
@media screen and (max-width:860px) {

#portlet_com_example_portlet_MainchoisemvcportletPortlet_INSTANCE_YtjsmgLXlB6q .mainChoiseContainer,
#portlet_com_example_portlet_MainchoisemvcportletPortlet_INSTANCE_3MtvamqQgR1y .mainChoiseContainer{
    height: 50px;
}
#portlet_com_example_portlet_MainchoisemvcportletPortlet_INSTANCE_YtjsmgLXlB6q .mainChoise,
#portlet_com_example_portlet_MainchoisemvcportletPortlet_INSTANCE_3MtvamqQgR1y .mainChoise{
    height: 50px;
}

	.logo {
    	margin-left: 15px;
	}


	.mainChooseText{
		display: none;
	}
	#infoCubeIdName{
		display:none;
	}
	#simpleInfoCubeInfo{
		display:block;
	}
	#paidRoadsTable{

		margin: auto;
		padding:7px!important;
	}
	
	#theImg {
    	min-width: 280px;
    	width: 100%;
   		margin-bottom: 30px;
   	}
   	body {
    	min-width: 320px;
	}
	
	
	.mainChoiseContainer {
   		min-width: 320px;
	}
	.mainChoiseContainer img {
   		max-width: 50px;
   		margin-top:-3px!important;
	}
	
	.footerTexts{
		font-size:12px;
		margin:10px;
	}
	.mainChoise {
  	  	margin-left: auto!important;
    	margin-right: auto!important;
    }
	
	
}

/*********************************/
.tg {
	border-collapse: collapse;
	border-spacing: 0;
	width: 10%;
	padding: 10px 15px;
	font-size: 20px;
	font-weight: 600;
}

#mobileVersion .tg {
	width: 20%;
	font-size: 12px;
}

   .tg td {
   font-family: Figtree, sans-serif;
   font-size: 14px;
   padding: 10px 5px;
   border-style: solid;
   border-width: 1px;
   overflow: hidden;
   word-break: normal;
   }
   .tg th {
   font-family: Figtree, sans-serif;
   font-size: 14px;
   font-weight: normal;
   padding: 10px 5px;
   border-style: solid;
   border-width: 1px;
   overflow: hidden;
   word-break: normal;
   }
   .tg .tg {
   vertical-align: middle
   }
   td.cargoVehicles, 
   td.specVehicles,
   td.bus{
   	 text-align: left;
   }

   @media screen and (max-width: 767px) {
   .tg col {
   width: auto !important;
   }
   .tg-wrap {
   overflow-x: auto;
   -webkit-overflow-scrolling: touch;
   }
   }

.tableImg {
	width: auto;
	max-width: 75%;
	max-height: 100%;
	margin-top: 10%;
}

.tableHeader {
	background: #EC6730;
	color: #ffffff;
	font-weight: bold;
	font-size: 20px;
}

#mobileVersion .tableHeader {
	font-size: 15px;
}

   td#bus,
   td#specVehicles,
   td#cargoVehicles {
   border: none;
   background: #d5d5d5;
   font-weight: bold;
   font-size: 17px;
   text-align: left!important;
   padding: 3px;
   padding-left: 10px;
   }
   .tg {
   vertical-align: middle;
   text-align: center;
   border: 1px solid #cacaca;
   color: #006a82;
   }
   .classDescription {
   background: #006a82;
   color: #ffffff;
   font-weight: normal !important;
   }
   td {
   border: solid 1px #cacaca !important;
   background: #fcfcfc;
   font-weight: 900;
   }

.tableHeader td, .tableHeader th {
	background: #006a82;
	font-weight: 600;
	border: 1px solid #cacaca;
	padding: 25px;
}

   #vehicle {
   font-size: 28px;
   }
   /*************Mobile version css*************/
   th.tg.threeAxles, th.tg.fourAxles  {
   font-size: 10px;
   padding: 2px;
   }
   .tgHM{
   font-size:10px;
   }
   .tgM{
   border:1px solid #cacaca !important;
   }
   .typeVehicle{
   border:none!important;
   }
   .typeVehicleBlock{
   border: 1px solid #cacaca!important;
   }
   .classDescription{
   border: 1px solid #cacaca!important;
   }