.banner-container
{
	position:relative;
	background-color: #2780e3;

	height:50px;

}


#logo
{
	position:absolute;
	top:10px;
	width:150px;
	height:130px;
	
}
#clg-name
{
	color:white;
	position:absolute;
	top:10px;
	left:180px;

	height:130px;
	
	
}
	
	
.clg-name
{
	

	margin-top:50px;
	color:white;
	
	
}
#clg-name-1
{
	color:white;
	font-size:25px;
	font-weight:bold;

}

#clg-name-2
{
	color:white;
	font-size:40px;
	font-weight:bold;

}
#clg-name-3
{
	color:white;
	font-size:12px;

}



@media (min-width: 360px) and (max-width: 384px) 
{

	.banner-container
{
	position:relative;
	background-color: #2780e3;

	height:50px;

}

	#logo
	{
		position:absolute;
		width:100;
		height:100px;
	
	}

		#clg-name-1
{
	color:white;
	font-size:16px;
	font-weight:bold;


}

#clg-name-2
{
	color:white;
	font-size:20px;
	font-weight:bold;

}
#clg-name-3
{
	color:white;
	font-size:5px;

}



/*For width 320px devices*/
@media (min-width: 300px) and (max-width: 350px) 
{

	.banner-container
{
	position:relative;
	background-color:#2780e3;

	height:50px;

}

	#logo
	{
		position:absolute;
		width:50px;
		height:50px;
	
	}

		#clg-name-1
{
	color:white;
	font-size:12px;
	font-weight:bold;

}

#clg-name-2
{
	color:white;
	font-size:14px;
	font-weight:bold;

}
#clg-name-3
{
	display:none;

}