body {

	background-color: #34495e !important;

	color: #FFFFFF;

}



.jumbotron {

	background-color: #34495e;

}



@font-face {

  font-family: Roboto;

  src: url("../fonts/Roboto-Regular.ttf");

}



.fuel-pane {

-webkit-border-radius: 20px;

-moz-border-radius: 20px;

border-radius: 20px;

	background-color: #4f6a85;

	width: 300px;

	height: 150px;

	text-align: center;

	font-family: Roboto;

	font-size: 36px;

}



.fuel-txinc {

	font-size: 12px;

}



.font-red {

	color: #ffea00 !important;

}



.default-text {

	font-family: Roboto;

	font-size: 24px;

}



.aircraft-bg {

	  background: url("../images/back_aircraft.png") no-repeat center center fixed;

  -webkit-background-size: cover;

  -moz-background-size: cover;

  -o-background-size: cover;

  background-size: cover;

	font-family: Roboto;

	font-size: 24px;

}

.logo {
    font-weight: bold;
    font-style: normal;
    font-size: 36px;
}

a:link {

	text-decoration: underline;

	color: #DDDDDD;

}



a:active {

	text-decoration: none;

	color: #FFFCBB;

}

a:visited, a:hover {
	text-decoration: underline;
	color: #DDDDDD;
}

.dropdown-item:hover, .dropdown-item:focus {
	color: #FFFFFF;
	background-color: #4f6a85;
}

.dropdown-item {
	color: #FFFFFF;
}


.dropdown-menu {
	color: #FFFFFF;
	background-color: #34495e;
}


.iframe-container, #iframe-container, .wxlink {
	position: relative;
	top: -100px;
}


/*---start-projects----*/
.box img {
  	color: transparent;
	font-size: 0;
	vertical-align: middle;
	-ms-interpolation-mode: bicubic;
	position: relative;
	z-index: 2;
	border-radius: 0.3em;
	-webkit-border-radius: 0.3em;
	-moz-border-radius: 0.3em;
	-o-border-radius: 0.3em;
	height: 276px;
}
.project-grid1{
	float:left;
	width:23%;
	margin-right:2%;
	border-radius: 0.3em;
	-webkit-border-radius: 0.3em;
	-moz-border-radius: 0.3em;
	-o-border-radius: 0.3em;
	text-align:center;
}
.last-project-grid1{
	margin-right:0;
}






/*---start-projects----*/
.feature-grid-head-top1 span{
	background: url(../images/projects-icon.png) no-repeat 50%;
}
.projects {
	margin-top: 2em;
}
.feature-grid-head1 p{
	color: #484848;
	font-size: 0.875em;
	padding: 0.2em 0;
	line-height: 1.5em;
	text-align: center;
}
.feature-grid-head1 h3{
	padding-bottom:0;
}
.box{
	-webkit-border-radius: 0.3em;
	-moz-border-radius: 0.3em;
	-o-border-radius: 0.3em;
}
.box img {
  	color: transparent;
	font-size: 0;
	vertical-align: middle;
	-ms-interpolation-mode: bicubic;
	position: relative;
	z-index: 2;
	border-radius: 0.3em;
	-webkit-border-radius: 0.3em;
	-moz-border-radius: 0.3em;
	-o-border-radius: 0.3em;
	height: 276px;
}
.project-grid1{
	float:left;
	width:23%;
	margin-right:2%;
	border-radius: 0.3em;
	-webkit-border-radius: 0.3em;
	-moz-border-radius: 0.3em;
	-o-border-radius: 0.3em;
	text-align:center;
}
.slickHoverZoom{
	border-radius: 0.3em;
	-webkit-border-radius: 0.3em;
	-moz-border-radius: 0.3em;
	-o-border-radius: 0.3em;
}
.last-project-grid1{
	margin-right:0;
}
.project-name{
	font-size: 1.2em;
	color: #484848;
	display: block;
	text-align: center;
	transition:0.5 all;
	-webkit-transition:0.5 all;
	-moz-transition:0.5 all;
	-o-transition:0.5 all;
}
.project-tag{
	text-align: center;
	color: #484848;
	font-size: 0.875em;
	line-height: 1.5em;
	transition:0.5 all;
	-webkit-transition:0.5 all;
	-moz-transition:0.5 all;
	-o-transition:0.5 all;
}
.project-name:hover,.project-tag:hover{
	color:#71B6D5;
}

#fuel-categories {
	display: grid;
	max-width: 1200px;
	grid-template-columns: repeat(3, 1fr);
	gap: 1rem;
	margin: auto;
}

#fuel-header {
	font-size: 2rem;
	font-color: white;
	font-align: center;
}

@media only screen and (max-width: 950px) {
	#fuel-categories {
		grid-template-columns: 1fr; /* 1 column */
		grid-template-rows: auto; 
	}
	.fuel-pane {
		font-size: 2rem;
	}
}


@media only screen and (max-width: 768px) and (min-width:640px) {
	.wrap{
		width:80%;
	}
	.footer-grid {
		width:100%;
		float:none;
		margin-right:0px;
		margin-left:0px;
		margin-top:2em;
	}
	.footer {
		padding: 1em 0 3em 0;
	}
	.footer-grid:nth-child(2){
		display:none;
	}
	.right-protfolio-grid {
		width: 33%;
	}
	.caption-social {
		margin-top: 2em;
	}
	.recent-tweet-info {
		width: 86%;
	}
	.header {
		background-size: 100% 100%;
	}
	.top-grid-head-icon {
		left: 41%;
	}
	.wellcome-note p {
		margin: 2em 0 3em 0;
	}
	.top-grid-head{
		background-size: 104%;
	}
	.feature-grid-head-top label {
		width: 43%;
	}
	.text-box input[type="text"], .textarea-box textarea {
		width: 86%;
	}
	.textarea-box textarea {
		width: 93%;
		resize:none;
	}
	.contact-form input[type="submit"] {
		width: 98%;
	}
	.wellcome-note {
		width: 100%;
	}
	.top-grid {
		width:100%;
		float:none;
		margin-right:0px;
		margin-bottom: 4em;
	}
	.feature-grid-left {
		float:none;
		width:100%;
		margin-right:0;
		margin-left:0;
		text-align:center;
	}
	.feature-grid-right{
		width:100%;
		float:none;
		margin-right:0;
		margin-left:0;
		margin-top:1em;
	}
	.project-grid1 {
		width: 48%;
		margin-bottom:2em;
	}
	.slider-mask-wrap {
		margin: 0 20px;
	}
	.left-sidebar{
		width: 97%;
		margin-right:0px;
		margin-left:0px;
		float:none;
		margin-bottom:1em;
	}
	.right-protfolio-grids{
		float:none;
		width:100%;
		margin-top:1em;
	}
	.side-search-box input[type="text"] {
		width: 96%;
	}
	.c-top-grid {
		width:50%;
		margin-right:0;
		margin-left:0px;
		margin-bottom:2em;
	}
	.contact-form form {
		width: 80%;
	}
}
@media only screen and (max-width: 640px) and (min-width:480px) {
	.wrap{
		width:80%;
	}
	.footer-grid {
		width:100%;
		float:none;
		margin-right:0px;
		margin-left:0px;
		margin-top:2em;
	}
	.footer {
		padding: 1em 0 3em 0;
	}
	.footer-grid:nth-child(2){
		display:none;
	}
	.right-protfolio-grid {
		width: 33%;
	}
	.caption-social {
		margin-top: 2em;
	}
	.recent-tweet-info {
		width: 86%;
	}
	.header {
		background-size: 100% 100%;
	}
	.top-grid-head-icon {
		left: 40%;
	}
	.wellcome-note p {
		margin: 2em 0 3em 0;
	}
	.top-grid-head{
		background-size: 104%;
	}
	.feature-grid-head-top label {
		width: 42%;
	}
	.text-box input[type="text"], .textarea-box textarea {
		width: 86%;
	}
	.textarea-box textarea {
		width: 93%;
		resize:none;
	}
	.contact-form input[type="submit"] {
		width: 98%;
	}
	.wellcome-note {
		width: 100%;
	}
	.top-grid {
		width:100%;
		float:none;
		margin-right:0px;
		margin-bottom: 4em;
	}
	.feature-grid-left {
		float:none;
		width:100%;
		margin-right:0;
		margin-left:0;
		text-align:center;
	}
	.feature-grid-right{
		width:100%;
		float:none;
		margin-right:0;
		margin-left:0;
		margin-top:1em;
	}
	.project-grid1 {
		width: 48%;
		margin-bottom:2em;
	}
	.slider-mask-wrap {
		margin: 0 20px;
	}
	.left-sidebar{
		width: 97%;
		margin-right:0px;
		margin-left:0px;
		float:none;
		margin-bottom:1em;
	}
	.right-protfolio-grids{
		float:none;
		width:100%;
		margin-top:1em;
	}
	.side-search-box input[type="text"] {
		width: 96%;
	}
	.c-top-grid {
		width:50%;
		margin-right:0;
		margin-left:0px;
		margin-bottom:2em;
	}
	.contact-form form {
		width: 80%;
	}
}
@media only screen and (max-width: 480px) and (min-width:320px) {
	.wrap{
		width:80%;
	}
	.logo {
		float: none;
		padding-top: 1.4em;
		text-align:center;
		margin-top:0px;
	}
	.top-nav {
		float: none;
		text-align:center;
	}
	.footer-grid {
		width:100%;
		float:none;
		margin-right:0px;
		margin-left:0px;
		margin-top:2em;
	}
	.footer {
		padding: 1em 0 3em 0;
	}
	.footer-grid:nth-child(2){
		display:none;
	}
	.right-protfolio-grid {
		width: 49.3%;
	}
	.caption-social {
		margin-top: 2em;
	}
	.recent-tweet-info {
		width: 86%;
	}
	.header {
		background-size: 100% 100%;
	}
	.top-grid-head-icon {
		left: 36%;
	}
	.wellcome-note {
		display:none;
	}
	.top-grid-head{
		background-size: 104%;
	}
	.feature-grid-head-top label {
		width: 40%;
	}
	.text-box input[type="text"], .textarea-box textarea {
		width: 94%;
	}
	.text-box {
		float: none;
		width: 100%;
		margin-bottom: 0.5em;
	}
	.textarea-box textarea {
		width: 94%;
		resize:none;
	}
	.contact-form input[type="submit"] {
		width: 100%;
	}
	.wellcome-note {
		width: 100%;
	}
	.top-grid {
		width:100%;
		float:none;
		margin-right:0px;
		margin-bottom: 4em;
	}
	.feature-grid-left {
		float:none;
		width:100%;
		margin-right:0;
		margin-left:0;
		text-align:center;
	}
	.feature-grid-right{
		width:100%;
		float:none;
		margin-right:0;
		margin-left:0;
		margin-top:1em;
	}
	.project-grid1 {
		width: 48%;
		margin-bottom:2em;
	}
	.slider-mask-wrap {
		margin: 0 0px;
	}
	.left-sidebar{
		width: 97%;
		margin-right:0px;
		margin-left:0px;
		float:none;
		margin-bottom:1em;
	}
	.right-protfolio-grids{
		float:none;
		width:100%;
		margin-top:1em;
	}
	.side-search-box input[type="text"] {
		width: 92%;
	}
	.c-top-grid {
		width:50%;
		margin-right:0;
		margin-left:0px;
		margin-bottom:2em;
	}
	.contact-form form {
		width:100%;
	}
	.project-name {
		font-size: 1em;
	}
	.project-tag {
		font-size: 0.8em;
	}
	.copy-right-left,.copy-right-right{
		float:none;
		margin-bottom:0.5em;
		text-align:center;
	}
	.right-protfolio-grid:nth-child(2),.right-protfolio-grid:nth-child(5),.right-protfolio-grid:nth-child(8){
		display:none;
	}
	.contact-head h3 {
		margin-top: 0.7em;
	}
	.contact-map{
		display:none;
	}
	.contact-top-grids {
		padding: 1em 0em;
	}
}
/*---*/
@media only screen and (max-width: 320px) and (min-width:240px) {
	.wrap{
		width:90%;
	}
	.logo {
		float: none;
		padding-top: 1.4em;
		text-align:center;
		margin-top:0px;
	}
	.top-nav {
		float: none;
		text-align:center;
	}
	.footer-grid {
		width:100%;
		float:none;
		margin-right:0px;
		margin-left:0px;
		margin-top:2em;
	}
	.footer {
		padding: 1em 0 3em 0;
	}
	.footer-grid:nth-child(2){
		display:none;
	}
	.right-protfolio-grid {
		width:100%;
		border: 1px solid #E6E3E3;
	}
	.caption-social {
		margin-top: 2em;
	}
	.recent-tweet-info {
		width: 86%;
	}
	.header {
		background-size: 100% 100%;
	}
	.top-grid-head-icon {
		left: 33%;
	}
	.wellcome-note {
		display:none;
	}
	.top-grid-head{
		background-size: 104%;
	}
	.feature-grid-head-top label {
		width: 36%;
	}
	.feature-grids {
		margin-top: 1em;
	}	
	.feature-grids {
		margin-top: 4em;
	}
	.text-box input[type="text"], .textarea-box textarea {
		width: 92%;
	}
	.text-box {
		float: none;
		width: 100%;
		margin-bottom: 0.5em;
	}
	.textarea-box textarea {
		width: 92%;
		resize:none;
	}
	.contact-form input[type="submit"] {
		width: 100%;
	}
	.wellcome-note {
		width: 100%;
	}
	.top-grid {
		width:100%;
		float:none;
		margin-right:0px;
		margin-bottom: 4em;
	}
	.feature-grid-left {
		float:none;
		width:100%;
		margin-right:0;
		margin-left:0;
		text-align:center;
	}
	.feature-grid-right{
		width:100%;
		float:none;
		margin-right:0;
		margin-left:0;
		margin-top:1em;
	}
	.project-grid1 {
		width:100%;
		margin-bottom:1em;
	}
	.slider-mask-wrap {
		margin: 0 0px;
	}
	.left-sidebar{
		width: 97%;
		margin-right:0px;
		margin-left:0px;
		float:none;
		margin-bottom:1em;
	}
	.right-protfolio-grids{
		float:none;
		width:100%;
		margin-top:1em;
	}
	.side-search-box input[type="text"] {
		width: 92%;
	}
	.c-top-grid {
		width:100%;
		margin-right:0;
		margin-left:0px;
		margin-bottom:1em;
	}
	.contact-form form {
		width:100%;
	}
	.project-name {
		font-size: 1em;
	}
	.project-tag {
		font-size: 0.8em;
	}
	.copy-right-left,.copy-right-right{
		float:none;
		margin-bottom:0.5em;
		text-align:center;
	}
	.right-protfolio-grid:nth-child(2),.right-protfolio-grid:nth-child(5),.right-protfolio-grid:nth-child(8){
		display:none;
	}
	.contact-head h3 {
		margin-top: 0.7em;
		font: 300 2.2em/48px 'Pacifico';
	}
	.contact-map{
		display:none;
	}
	.contact-top-grids {
		padding: 1em 0em;
	}
}