@media screen and (max-width: 1920px) {
    #maincont{
	height: 1600px;
	width: 100%;
	background-color: #c8d2db;
	}

	.Top{
		background-color: #c8d2db;
		font-size: 35px;
		width: 32%;
		height: 31.03%;
		margin: 30px 1% 0 1%;
		float: left;
		line-height: 55px;
		font-family: Calisto MT;
	}
	.logos{
		background-color: #c8d2db;
		font-size: 35px;
		width: 32%;
		height: 60%;
		margin: 30px 1% 0 1%;
		float: left;
		line-height: 55px;
		font-family: Calisto MT;
	}

	.test{
		background-color: #c8d2db;
		float: left;
		width:30%;
		height:60%;
		font-size: 35px;
		font-family: Calisto MT;
		margin: 30px 1% 10px 1%;
		line-height: 100px;
	}
	
	.test2{
		background-color: #c8d2db;
		float: right;
		width:30%;
		height:27.59%;
		font-size: 35px;
		font-family: Calisto MT;
		text-align:center;
		margin: 60px 10px 30px 10px;

	}

	.logos img{
		height:100px;
		margin: 20% auto 5% auto;
		display:block;
		
	}
	.test img{
		width: 50%;
		margin: 0 3% 0 3%;
		display: block;
	}
	.test2 img{
		height: 2%;
		width: 45%;
		margin: 7% 3%;
		display:block;
	}


	.main img{
		height:100px;
		margin: 15% auto 10% auto;
		display:block;
	}


	.main{
		background-color: #c8d2db;
		font-size: 35px;
		width: 32%;
		height: 24.14%;
		margin: 45px 1% 30px 1%;
		float: left;
		line-height: 55px;
		font-family: Calisto MT;
	}

	nav{
		width:100%;
		background-color: #c8d2db;
		
	}
	
	.banner{
		width:80%;
		text-align: center;
		background-color: #c8e2f7w;
		
	}
	
	.banner img{
		width:100%;
		
	}

	.service{
		height:100px;
		width:24%;
		float: left;
		margin: 0 9px;
	}

	.bottom{
		
		margin: 40px 0 30px 0;
		font-family: Calisto MT;
		display: block;
		
	}

	footer{
		background-color: #c8e2f7;
		font-size: 35px;
		font-family: Calisto MT;
		height:60px;
		width:100%;
		margin: 0 auto;
		text-align: center;
		font-style: italic;
		color: red;
	}
	
	.logos2{
		display:none;
	}
	
	.service{
		display: none;
	}
	
	.info2{
		display:none;
	}
	
	.logos3{
		display:none;
		
	}
	
	.service2{
		display:none;
	
	}
	
	.info{
		display:none;
		
	}
	
	.service1 img{
		width: 40%;
		margin: 7% 3%;
		display:block;
		float: left;
		
	}
}

@media screen and (max-width: 1600px) {
    #maincont{
	height: 1000px;
	width: 100%;
	background-color: #c8d2db;
	}

	.TopLeft{
		background-color: #c8d2db;
		font-size: 25px;
		text-align: inline;
		width: 25%;
		height: 250px;
		margin: 110px 1% 30px 20%;
		float: left;
		line-height: 55px;
		font-family: Calisto MT;
	}
	
	.TopRight{
		background-color: #c8d2db;
		font-size: 25px;
		text-align: inline;
		width: 35%;
		height: 250px;
		margin: 90px 1% 30px 10%;
		float: left;
		line-height: 50px;
		font-family: Calisto MT;
	}
	
	.TopRight article{
		margin-bottom: 35px;
		
		
	}
	
	.Bottom
	{
		display:none;
		
	}
	
	.finetext
	{
		font-size: 25px;
		line-height: 45px;
		margin-top: 10px;
	}
	
		
	
	.navigation 
	{
		background-color: #c8d2db;
		width: 100%;
		height: 100px;
		
	}
	
	.banner{
		width:100%;
		text-align: center;
		background-color: #c8e2f7w;
		
	}
	
	.banner img{
		width:50%;
		
	}
	
	.battery{
		width:50%;
		position: relative;
		float: left;
		left: -45%;
		top: 20%
		
	}
	
	.motocaddy
	{
		width: 50%;
		position: relative;
		top: -10px;
		left: -50%;
		float:left;
		
	}
	 
	.powakaddy
	{
		width: 50%;
		position: relative;
		top: -5px;
		float: left;
	}
	
	.button
	{
		background-color: #5088b3;
		width: 15%;
		height: 40%;
		margin: 5% 10px 0px 8%;
		text-align: center;
		font-family: Calisto MT;
		color: white;
		font-weight: bold;
		
	}
	
	.button:hover
	{
		background-color: #2d95fc;
	}
	
	footer{
		display: none;
	}
	
	
	
}

@media screen and (max-width: 1250px) {
    #maincont{
	height: 1100px;
	width: 100%;
	background-color: #c8d2db;
	}

	.TopRight{
		background-color: #c8d2db;
		font-size: 22px;
		text-align: inline;
		width: 80%;
		height: 22%;
		margin: 50px 10%;
		float: left;
		line-height: 40px;
		font-family: Calisto MT;
	}
	
	.finetext
	{
	    font-size: 22px;
	    
	}
	
	.logos{
		background-color: #c8d2db;
		font-size: 22px;
		text-align: inline;
		width: 32%;
		height: 60%;
		margin: 30px 1% 0 1%;
		float: left;
		line-height: 55px;
		font-family: Calisto MT;
	}

	.test{
		background-color: #c8d2db;
		float: right;
		width:30%;
		height:60%;
		font-size: 25px;
		font-family: Calisto MT;
		margin: 3% 1% 0 1%;
		line-height: 0;
		text-align: center;
	}
	.test2{
		background-color: #c8d2db;
		float: right;
		width:30%;
		height:27.59%;
		font-size: 25px;
		font-family: Calisto MT;
		text-align:center;
		margin: 80px 1% 30px 1%;

	}
	
	.banner img{
		width:56%;
		
	}

	.logos img{
		height:100px;
		margin: 30% auto;
		display:block;
		
	}

	.test img{
		margin: 0 auto 30%;
		width: 65%
	}


	.main img{
		height:100px;
		margin: 15% auto 10% auto;
		display:block;
	}


	.main{
		background-color: #c8d2db;
		font-size: 22px;
		text-align: inline;
		width: 32%;
		height: 24.14%;
		margin: 45px 1% 30px 1%;
		float: left;
		line-height: 55px;
		font-family: Calisto MT;
	}

	nav{
		width:100%;
		background-color: #c8d2db;
		
	}
	.banner{
		width:100%;
		text-align: center;
		background-color: #c8e2f7w;
		
	}

	.service{
		height:100px;
		width:24%;
		float: left;
		margin: 0 9px;
	}

	.bottom{
		
		display: none;
		
	}

	footer{
		background-color: #c8e2f7;
		font-size: 22px;
		font-family: Calisto MT;
		height:50px;
		width:100%;
		margin: 0 auto;
		text-align: center;
		font-style: italic;
		color: red;
	}
	
	.logos2{
		display:none;
	}
	
	.service{
		display: none;
	}
	
	.info2{
		display:none;
	}
	
	.logos3{
		display:none;
		
	}
	
	.service2{
		display:none;
	
	}
	
	.info{
		display:none;
		
	}
	
	.service1 img{
		width: 40%;
		margin: 7% 3%;
		display:block;
		float: left;
		
	}
	

	
	.navigation 
	{
		background-color: #c8d2db;
		width: 100%;
		height: 50px;
		margin-top: 20px;
		margin-bottom:20px;
		
	}
	
	.button
	{
		background-color: #5088b3;
		width: 20%;
		height: 90%;
		margin: 10px 10px 0px 3%;
		text-align: center;
		font-size: 16px;
		transition-duration: 0.4s;
		font-family: Calisto MT;
		
	}
	
	.button:hover
	{
		background-color: #2d95fc;
	}
	
	.TopLeft
	{
	    display:none;    
	
	}
	
	.Bottom
	{
		display:inline-block;
		width: 100%;
		height: 100px;
		float: left;
		margin-top: 3%;
		
	}
	
	.motocaddy
	{
		width:25%;
		top: 0;
		left: 0;
		float: left;
		margin: 0 0 0 8%;
	}
	
	.powakaddy
	{
		width:25%;
		top: 0;
		left: 0;
		float: left;
		margin: 0 0 0 5%;
	}
	
	.battery
	{
		width: 20%;
		top: 0;
		left: 0;
		float: left;
		margin: 5% 0 0 5%;
	}
	
}


@media screen and (max-width: 750px) {
	#maincont{
        height: 800px;
		width: 100%;
		background-color: #c8d2db;
	}
	
	.banner img{
		width:80%;	
	}
	
	.navigation 
	{
		background-color: #c8d2db;
		width: 90%;
		height: 50px;
		margin: 20px 0 0 7%;
		
	}
	
	.button
	{
	    display:inline-block;
		background-color: #5088b3;
		width: 23%;
		height: 60%;
		margin: 0 0 0 0%;
		font-size:9px;
		text-align: center;
		font-family: Calisto MT;
		
	}
	
	.button:hover
	{
		background-color: #2d95fc;
	}
	
	
	.TopRight
	{
		background-color: #c8d2db;
		font-size:20px;
		text-align: left;
		width: 80%;
		height: 350px;
		margin: 25px 0 0px 11%;
		line-height:30px;
		font-family: Calisto MT;
	}
	
	.TopRight article
	{
	   margin: 0 0 22px 0;
	    
	}
	
	.finetext
	{
		font-size: 20px;
		line-height: 30px;
	}
	
	.TopLeft{
		display:none;
	}
	
	.Bottom
	{
		display:inline-block;
		width: 100%;
		height: 100px;
		float: left;
		margin-top: 3%;
		
	}
	
	.motocaddy
	{
		width:25%;
		top: 0;
		left: 0;
		float: left;
		margin: 0 0 0 7%;
	}
	
	.powakaddy
	{
		width:25%;
		top: 0;
		left: 0;
		float: left;
		margin: 0 0 0 5%;
	}
	
	.battery
	{
		width: 25%;
		top: 0;
		left: 0;
		float: left;
		margin: 5% 0 0 5%;
	}
	
	
	footer{
		background-color: #c8e2f7;
		font-size: 18px;
		font-family: Calisto MT;
		height:55px;
		width:100%;
		margin: 0 auto;
		text-align: center;
		font-style: italic;
		color: red;
	}
}













