/*===================== 

	RESET 

=======================*/
    article,aside,details,figcaption,figure,footer,.header,hgroup,
    main,nav,section,summary {display: block;}
    pre {white-space: pre-wrap;}
    small { font-size: 80%;}

/*===================== 

	BASE LAYOUT

=======================*/

    html, body {
        font-family: 'Open Sans', sans-serif;
        margin:0;
        padding:0;
        background:#fff;
        color:#000;
        -webkit-text-size-adjust: none;
    }
	body {overflow-x: hidden;}
    svg:not(:root) {overflow: hidden;/*reset*/}
    .group:before,.group:after {content: ""; display: table;} .group:after {clear: both;}.group {zoom: 1;}	
    .hide-text {text-indent:  100%;white-space:  nowrap;overflow:  hidden;}	
    hr {-moz-box-sizing: content-box;box-sizing: content-box;border-style: solid;height: 0;color: #fff} 

    .column2 {width:48%; float:left; margin: 0 1%;  box-sizing: border-box;}
    .column3 {width:33.33333%; float:left; padding:0 ; box-sizing: border-box;}
    .column4 {width:23%; margin-right:2%; float:left;  box-sizing: border-box;}
    .column5 {width:20%; float:left; padding-right:1%; box-sizing: border-box;}
    .column6 {width:16%; float:left; padding-right:1%; box-sizing: border-box;}	

    .clear { clear: both;}

/*===================== 

	TYPOGRAPHY

=======================*/

    h2, h4, h5, h6 {font-family: 'Open Sans Condensed', sans-serif;}
    h1, h2, h3, h4, h5, h6 {margin: 0;line-height:1.1; font-family: 'Open Sans Condensed', sans-serif;}

    h1 {font-size: 36px; font-weight:900; text-transform: uppercase; color: #000; margin:0 0 20px 0}
    h2 {font-size: 30px; font-weight:900; text-transform: uppercase; color: #fdd92f}
    #popup1 h3, #mainbackphoto h3 {font-size: 70px; font-weight: 900; text-transform: uppercase; color: #fff}
    h4 {font-size: 26px; font-weight: 900; text-transform: uppercase; color: #fff}
    h5 {font-size: 18px;}

    p {
        font-size:16px;
        line-height:1.5em;
        margin: 0;
        font-weight:400;
        color:#444444;
        }
    b{font-weight:600;}
    strong{font-weight:900;}
    .forceblue{color: #244783}

/*===================== 

	LINKS

=======================*/

    a { text-decoration:none; color:inherit;}
    a:hover  {text-decoration: none;color: #244783;transition: all 300ms ease;} 

    .appbutton a{background:#38b749; padding:5px 10px;color:#fff; border-radius:3px;}
    .appbutton a:hover{background:#262626; padding:5px 10px;color:#fff; border-radius:3px;}

/*===================== 

	HEADER

=======================*/
    .header{
        width:100%;
        margin:0 auto;
        background:rgba(255, 255, 255, 0.7);
        padding:1em 0;
        z-index: 999;
        position: relative;
        box-shadow:0px 1px 3px 0px #00000078;
    }

    .headerwrap{width:100%;margin:0 auto;}
    .main-logo{width: 40%;}
    .main-logo img{max-width: 230px; display: block; width:100%}
    .navbar{width: 60%; display: flex; justify-content: flex-end;}

    #top{background: #000; padding: 10px 0; position: relative;}
	.header .wrapper, #top .wrapper {display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap;}

    .manulogostop{width: 60%;}
    .manulogostop img, .manulogostop a{display: inline-block;width: 100%; max-width: 200px; margin-right: 10px}

    .addressbar{color:#fff; width: 40%; position:relative; text-align: right;}
    .addressbar p{display: inline-block; font-size:16px; font-weight: 600; color:#fff; font-family: 'Open Sans Condensed', sans-serif!important; line-height: 1.2;}
    .addressbar p a{color:#fff!important; font-family: 'Open Sans Condensed', sans-serif!important;}
    .addressbar a:hover{color:#244783;}
    .addressbar i{margin-left:20px;}

/*===================== 
	
    CONTENT

=======================*/

    .wrapper{width:90%;max-width:1300px;margin:0 auto;padding:0;}    
    .companyinfo{background: #363636; padding: 2em; margin: 0 auto 2em auto}
        .companyinfo p{color: #fff}
        .companyinfo p span{color:#a1a1a1 } 

/*=====================

	SCROLLING INV

=======================*/

    .scrolling-wrap {
        width:100%;
        height:90px;
        overflow:hidden;
    }

    .scrolling{
        width:100%;
        height:92px;
    }


.nh-banner {
	display: flex;
    justify-content: space-between;
    align-items: center;
    background: linear-gradient(#2a4f90, #244783);
    color: #fff;
    padding: 2.25em 5%;
}
.nh-banner div {width: 100%; padding-right: 3%;}
.nh-banner h2 {width: 100%; color: #fff;}
.nh-banner p {color: #fff; width: 100%; display: block; margin-top: .75em;}
.nh-banner a.yellowbtn {max-width: 150px; padding: 10px; margin: 10px;}



.finance-wrapper {text-align: center; padding: 2em;}
.finance-wrapper img {width: 100%; margin: 0 auto; display: block; max-width: 300px;}

.finance-grid {
  display: grid;
  grid-template-columns: 1fr 1fr; /* two columns */
  gap: 24px;
}

.finance-col {
  display: grid;
  gap: 16px; /* spacing between cards in a column */
}

.finance-wrapper {
  display: flex;
  flex-direction: column;  /* stack image on top of button */
  align-items: center;     /* center image and button */
  gap: 12px;
  padding: 16px;
  border: 1px solid #eee;
  border-radius: 8px;
  background: #fff;
}

.finance-wrapper img {
  display: block;
  max-width: 220px;   /* adjust as needed */
  width: 100%;
  height: auto;
  object-fit: contain;
}

.yellowbtn {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  background: #ffc815;
  color: #222;
  padding: 10px 14px;
  border-radius: 6px;
  text-decoration: none;
  font-weight: 600;
  line-height: 1;
  white-space: nowrap;
}

.yellowbtn:hover {
  filter: brightness(0.95);
}


.finance-wrapper.cnh-center {

  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;    
  text-align: center;

  min-height: 120px;/
}

@media (max-width: 768px) {
  .finance-grid {
    grid-template-columns: 1fr; /* stack columns on mobile */
  }
}

/*===================== 

	WELCOME

=======================*/

    .padit{padding:5em 0;}
    .welcome{background:#fff;position:relative;padding:3em 0 1em 0 }
    .welcomeleft,.welcomeright{display:inline-block;vertical-align:middle; float: left}
    .welcomeleft{width:60%;margin-right:6%;}	
    .welcomeright{width:28%; background: #363636; padding: 2% 3%}
        .welcomeright p{color: #fff}
        .welcomeright p span{color:#a1a1a1 } 

    a.yellowbtn{background:#fdd92f; text-transform: uppercase; width: 100%; margin: 10px auto 0 auto; display: block; padding:10px 0; text-align: center; color:#363636; font-weight: 600;}
    a.yellowbtn:hover{background:#fff; }

    .equipmentlineup{position:relative; margin:0 auto 3px auto ; text-align: center; border-bottom: 8px #000 solid; }
        .equipmentlineup img{display: block; margin: 0 auto -30px auto; max-width: 1000px; width: 100%}

    #mainbackphoto{
        background:url("../siteart/HomePage.jpg") no-repeat;
        -webkit-background-size: cover;
        -moz-background-size: cover;
        -o-background-size: cover;
        background-size: cover; 
        padding: 30em 0 0 0;
        display: block;
        width: 100%;
        z-index: 0;
        text-align: center;
        margin: -9em auto 0 auto;
    }

    #mainbackphoto h3{text-shadow: 0px 3px 4px #000; margin: 0 auto 1em auto; line-height: 1.25;}
    a.mainbuttons{background:#244783; width: 18%; float: left; margin: 0 2.5% 0 0; display: block; padding:10px 0; text-align: center; color:#fff; font-weight: 600;}
    a.mainbuttons:hover{background:#fff; color: #244783 }
    .ultimo{margin: 0!important}

/*===================== 

	BRANDBAR STYLES

=======================*/

    .brandbar{background:#244783;text-align:center; padding: 20px 0}
    #brandwrap{max-width:none;}
    .brandbar a{display:inline-block;margin:0 15px;}

    .brandbar img{display:inline-block;max-width:200px;}
    .brandbar img:hover{
        margin-bottom:-5px;
        -webkit-transition:.4s ease-in;
        -moz-transition:.2s ease-in;
        -o-transition:.2s ease-in;
        transition:.2s ease-in;
    }

/*===================== 

	FORM

=======================*/

    .onethird{width:31%;margin:0 1%;display:inline-block;text-align:left;}
    #headinternal{margin:10px 0;padding-bottom:0;}
    .commentbox{width:99%;}
    #formpage{padding:1em; background: #eee; margin: 1em auto 0 auto}

    #contact-form form{
        margin:0 0 0;
    }
    #contact-form label{
        display:block;
        font-size:16px;
        padding-top: 4%;
        width:100%;
    }
    #contact-form input{
        font-family: 'Open Sans', sans-serif;
        border: #999999 solid 1px;
        border-radius: 2px;
        padding: 1%;
        font-size:14px;
        width:97%;
        margin-bottom:10px;
    }
    #contact-form input:focus{
        border: #244783 solid 1px;
    }
    #contact-form input.button2{
        display:block;
        width:50%;
        margin:0 auto 5% auto;
        border:#277e32 solid 1px;
        background-color:#38b749;
        color:#fff;
        border-radius: 2px;
    }

    #contact-form input.button2:hover{
        background-color:#277e32;
        cursor:pointer;
    }

    #contact-form select{
        font-family: 'Open Sans', sans-serif;
        border: #999999 solid 1px;
        padding: 1%;
        font-size:14px;
        width:100%;
    }

    #contact-form textarea{
        font-family: 'Open Sans', sans-serif;
        border: #999999 solid 1px;
        border-radius: 2px;
        padding: 1%;
        font-size:14px;
        width:98%;
    }

    #contact-form input[type='checkbox'],input[type='radio']{width:15px !important;min-width:15px !important;margin-right:2px;}

    #sendsearch{width:50%;margin-top:0.5%;}
    #sendsearch input,.sendbutton{width:100%;background:#244783;border:none;color:#fff;font-weight:bold;padding: 27px 0;}
    #sendsearch:hover > input{cursor:pointer;background:#fff;color:#244783;-webkit-transition:.4s ease-in;-moz-transition:.2s ease-in;-o-transition:.2s ease-in;transition:.2s ease-in;}
    .sendbutton:hover{background:#000;cursor:pointer;color:#fff;-webkit-transition:.4s ease-in;-moz-transition:.2s ease-in;-o-transition:.2s ease-in;transition:.2s ease-in;}


/*===================== 

	QUICK SEARCH

=======================*/

    .search{float:right; width:100%; position: relative;}
    .searchTerm{width:80%; padding:17px 0; font-size: 15px; line-height: 17px; text-indent: 15px; outline: 0; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box;}

    .searchButton{
        width:19%;
        color: #fff ;
        background:#244783 ;
        padding:18px 0 ;
        margin:0 ;
        text-transform:none ;
        letter-spacing:0 ;
        float:none ;
        border:0 ;
        box-sizing:border-box;
        -webkit-border-radius:0 ;
        -webkit-appearance: none;
        border-radius:0 ;
        font-size: 15px ; 
        line-height: 17px;
        cursor: pointer;
        
    }
    .searchButton:hover{color:#fff ; background:#000;}



/*===================== 

	CAPTCHA

=======================*/

    .CaptchaPanel {margin: 0px!important;padding: 10px!important;}
    .CaptchaMessagePanel {padding: 0!important; font-size: 12px;}
    .CaptchaWhatsThisPanel {padding: 0!important;}
    .CaptchaAnswerPanel input{margin:0!important}


/*===================== 

	MAPA

=======================*/

    .mapblock{position:relative; z-index: 0;}
    .locationwedge{
        position:absolute;
        z-index:1;
        width:20%;
        left:0;
        top:0;
        background:#244783;
        /*padding:2% 2% 3% 5%;
		bottom:-22px;*/
		padding: 0 5%;       
        -moz-box-shadow:0px 5px 5px rgba(0,0,0,0.3);
        -webkit-box-shadow:0px 5px 5px rgba(0,0,0,0.3);
        box-shadow:0px 5px 5px rgba(0,0,0,0.3);
    }
	.locationwedge h4 {display: block; padding-top: 1.25em;}

    .mapblock iframe{height:350px; display: block}
    .locationwedge:after {
        content: " ";
        position: absolute;
        display: block;
        width: 100%;
        height: 100%;
        top: 0;
        right: 0;
        z-index: -1;
        background: #244783;
        transform-origin: bottom left;
        -ms-transform: skew(-15deg, 0deg);
        -webkit-transform: skew(-15deg, 0deg);
        transform: skew(-15deg, 0deg);
    }
    .locationwedge h3,.locationwedge h1,.locationwedge p{color:#fff;}
    .locationwedge h3{font-weight:normal;line-height:1.1em;padding:0;}
    .locationwedge h1{line-height:1.3em;}
    .locationwedge p{padding-bottom:5%;}
    .locationwedge p span{display:block;}
    .locationwedge p a:hover{color:#ccc;-webkit-transition:.4s ease-in;-moz-transition:.2s ease-in;-o-transition:.2s ease-in;transition:.2s ease-in;}


/*=====================

	FOOTER

=======================*/

    .pagebottom{background:#000; padding: 2em 0; text-align: center}
    .pagebottom p, .pagebottom a{color:#ccc; font-size:15px; font-weight: 600; text-transform: uppercase; font-family: 'Open Sans Condensed', sans-serif;}
    .pagebottom a:hover{color:#fff;}


/*===================== 
	
    RESPONSIVE

=======================*/

@media screen and (max-width: 1100px) {   
    h3 {font-size: 45px;}
    #mainbackphoto {padding: 20em 0 0 0;margin: -9em auto 0 auto;}
    #sendsearch input,.sendbutton{padding: 20px 0;}
}

@media screen and (max-width: 1025px) {
    .welcomeright {width: 38%;}
    .welcomeleft {width: 50%;}
    .equipmentlineup img { margin: 0 auto -10px auto;}
	
	.nh-banner {flex-wrap: wrap; padding: 2.25em 10%; text-align: center;}
	.nh-banner a.yellowbtn {max-width: 43%; margin: 1em 5px 0;}
    
    .mapblock{background:  #244783}
    .mapblock iframe {width: 50%}
    .locationwedge,.mapblock iframe{display:inline-block;zoom: 1;vertical-align:top;float: left;}
    .locationwedge{position:relative; text-align: center;width:50%;padding: 0; -moz-box-shadow:none;-webkit-box-shadow:none;box-shadow:none;}
    .locationwedge:after{display:none;}
    
}

@media screen and (max-width: 768px) {
    #mainbackphoto h3 {margin: 0 auto 0.5em auto;}
    #popup1 h3, #mainbackphoto h3 {font-size: 40px;}
    .addressbar {width:100% ;float:none;text-align: center; margin: 10px auto 0;}
    .manulogostop {width:100% ;float:none;text-align: center; margin: 0 auto;}
    
    .header {background: #fff; padding: 0; width:100% ;float:none;text-align: center; margin: 0 auto;}
    .main-logo {width: 100%!important; padding: 10px 0!important;}
    .main-logo img {max-width:220px; display: block; margin: 0 auto!important;}
    .navbar {width:100% ;float:none;text-align: center; border-top: 2px solid #000; margin: 0 auto; padding: 10px 0}
	.manulogostop img, .manulogostop a {max-width: 190px;}
    #mainbackphoto {padding: 12em 0 10px 0;margin: 0;}
    a.mainbuttons {
        width: 48%;
        float: left;
        margin: 1%;
    }
    .ultimo{margin: 1%!important;}
    .column2{float: none;width: 100%;margin: 0 auto}	
}


/* iPhone 5, 6, 6+ ----------- */

@media screen and (max-width: 736px){
    .addressbar i {margin: 0;}
    .padit{padding:2em 0;}

}


/* Galaxy (portrait and landscape) ----------- */

@media screen and (max-width:640px){
    h1, h2, h3, h4, h5, h6, p{text-align: center}
    #popup1 h3, #mainbackphoto h3 {font-size:30px;}
    
    .welcome{padding: 1em 0}
    .welcomeright {width: 100%; margin: 1em auto 0 auto; float: none; padding: 20px 0}
    .welcomeleft {width: 100%; margin: 0 auto; float: none}
    a.yellowbtn {width: 90%;}
    
     .locationwedge,.mapblock iframe{display:block;float:none; width: 100%}
    .padit{padding:1em 0;}
	
	.nh-banner a.yellowbtn {max-width: none; margin: 1em 0 0; width: 100%;}
}


/* Smartphones (portrait and landscape) ----------- */

@media screen and (max-width: 480px){
     .addressbar p {display:block;}
    
    a.mainbuttons {
        width: 100%;
        float: none;
        margin: 1% auto;
    }
    .ultimo{margin: 1% auto!important;}
}
 
@media screen and (max-width: 320px){
    .manulogostop img, .manulogostop a {
        display: block;
        margin: 2.5px auto 5px;
    }
}