*{
  	outline: none;
    padding: 0;
    margin: 0;
}
body{
  width: 100%;
  padding: 0;
  margin: 0;
  font-family: 'Montserrat', sans-serif !important ;
  background: #fff;
 
}


/* FORM */




.new-border{
    background-color: rgba(0,0,0,0.7);
    text-align:justify;
    height: auto;
    width :70%;
    margin:auto;
    border-radius:20px;
    border-color:orange;
    padding-bottom : 20px;
    
}

.new-border:before{
     -webkit-filter: blur(10px);
     -moz-filter: blur(10px);
     -o-filter: blur(10px);
     -ms-filter: blur(10px);
      filter: blur(10px);
}


.container 
{
   /* height: 100%;*/
    width:100%;
	background-size: cover;
	background-repeat:no-repeat;    
}
.container-box
{
	display:inline-block; 
	padding:10px; 
	background: rgba(255, 255, 255, .8);
	border: 1px solid #fff;	
	position: fixed;
  	top: 55%;
  	left: 0;

}

.modal-content
{
	background: rgba(255, 255, 255, .7);	
}


.rotated
{
	-moz-transform:rotate(-90deg);
    -ms-transform:rotate(-90deg);
    -o-transform:rotate(-90deg);
    -webkit-transform:rotate(-90deg);
    transform-origin: top left;  
}




.btn-success{
    background-color :orange !important;
    border-color:orange !important;
}

.btn-success:hover{
    background-color: #FF9B00 !important;
    border-color:#FF9B00 !important;
}


article{
  transition: all 0.5s ease-in-out;
}

footer{
  transition: all 0.5s ease-in-out;
  padding-bottom: 0;
}

.nav-hide{
    opacity: 1;
}
.nav-middle{
  opacity: 0;
}
.nav-show {
    opacity: 1;
    margin-left: 300px;
}

/* UPPER-BAR */

.upper-bar{
  height: 150px;
  position: fixed;
  top: 0;
  width: 100%;
  background-image: url(../img/nav_back.png);
  background-size: cover;
  z-index: 2;
  pointer-events: none;
}

.upper-bar .upper-menu-btn{
  float: left;
  height: 70px;
  width: 70px;
  background: rgba(0,0,0,0.3);
  margin: 25px;
  border-radius: 50%;
  pointer-events: auto;
}

.upper-bar .upper-menu-btn button{
  width: 100%;
  height: 100%;
  background: rgba(0,0,0,0);
  border: 0;
  font-size: 28px;
  color: #fff;
  cursor: pointer;
}

.upper-bar .upper-menu-btn:hover{
  background: rgba(255,255,255,0.2);
}

.upper-bar button img{
  max-width: 30px;
  /*padding: 20px;*/

  filter: invert(100%);
}

.upper-bar p{
  margin-top: 41px;
  float: left;
  color: #fff;
  font-size: 30px;
}

.upper-bar a img{
  height: 100px;
  padding: 10px;
}

.upper-bar a{
  float: right;
  background: rgba(0,0,0,0);
  padding: 0px 10px;
  margin: 20px 1.5%;
  border: 0;
  border-radius: 3px;
  color: #000;
  pointer-events: auto;
}

.upper-bar a:hover{
  background: rgba(255,255,255,0.1);
}

/* NAVBAR */

.nav-wrapper{
  transition: all 0.5s ease-in-out;
  position: fixed;
  top: 0px;
  left: 0px;
  background-color: rgba(255,255,255,0.7);
  width: 300px;
  height: 100%;
  z-index: 1;
}
.nav-wrapper-hide{
    opacity: 0;
    transform: translateX(-300px);
}
.nav-wrapper-show{
    opacity: 1;
    transform: translateX(0px);
}

nav ul{
  padding: 0;
  margin: 0;
}
.main-ul{
  margin-top: 150px;
}

nav .list-main{
  padding: 15px 10px;
  list-style: none;
  background: #ddd;
  text-align: left;
  border-bottom: 1px solid #aaa;
  box-shadow: 0px 14px 25px 1px rgba(0,0,0,0.3);
}

nav .list-main-current{
  padding: 15px 10px;
  list-style: none;
  background: #888;
  text-align: left;
  border-bottom: 1px solid #777;
  box-shadow: 0px 14px 25px 1px rgba(0,0,0,0.3);
}

nav .list-sub{
  margin: 5px;
  margin-left: 20px;
  padding: 6px 10px;
  list-style: none;
}

nav .list-sub-current{
  margin: 5px;
  margin-left: 20px;
  padding: 6px 10px;
  list-style: none;
}

nav li .link-main{
  width: 100%;
  padding: 0px;
  margin: 6px;
  font-size: 21px;
  text-transform: uppercase;
  text-decoration: none;
  color: #222;
}

nav li .link-main-current{
  width: 100%;
  padding: 0px;
  margin: 6px;
  font-size: 21px;
  text-transform: uppercase;
  text-decoration: none;
  color: #fff;
}



nav li .link-main:hover{
  color: #fff;
}

nav li .link-sub{
  font-size: 18px;
  text-decoration: none;
  color: #444;
}

nav li .link-sub:hover{
  color: rgba(203,115,5,0.9);
}

@media only screen and (min-width: 768px) {

/*ARTICLE*/
.boxes{
  text-align: center;
}
.boxes img{
  width: 15%;
  min-width: 190px;
  margin: 3%;
  border-radius: 50%;
}
.service{
  padding: 20px 20px 20px 0px;
}
.service img{
  margin: 0px 20px 0px 0px;
  padding: 10px 20px 10px 0;
  float: left;
  width: 15%;
  min-width: 190px;
}



.artic{
  width: 90%;
  margin: auto;
  padding: 10px 30px;
}

.artic h1{
  padding: 25px 0;
  margin-top: 150px;
  text-align:center;
  font-size:50px;
  color: #fff;
  
}

.artic h2{
  padding: 25px 0;
  margin-top: 30px;
  text-align: center;
  font-size:37px;
  color: #fff;
}

.artic h3{
  padding: 15px 0;
  text-align: left;
  font-size:23px;
  color: #fff;
}


.artic p{
  padding: 15px 0;
  text-align: justify;
  font-size:23px;
  color: #fff;
}

.artic-bcg{
  margin-top: -150px;
}

.artic-bcg-home{
  background-repeat: no-repeat;
  background-size: auto;
  /*background-size:cover;*/
  background-position: center ;
  height :auto;
  
}



.artic-bgfixed{
   min-height: 100vh;
   background-attachment: fixed;
   background-size:cover;
   height :auto;
   width :auto;
}


.artic-bcg-home:nth-child(6){
    background-image: url(../img/background.jpeg);
}


.artic-bcg-home:nth-child(5){
    background-image: url(../img/background_alt_2.jpeg );
}

.artic-bcg-home:nth-child(4){
    background-image: url(../img/background_alt.jpeg);

    
}




.cabinets{
  margin: auto;
  height: 300px;
}

.cabinets img{
  min-width: 200px;
  max-width: 300px;
  width: 20%;
  float: left;
}

.cabinets p{
  width: 75%;
  margin-right: 50px;
  float: left;
}

/*CONTACT FOOTER*/
.footy{
  width: 100%;
  text-align: center;
  display: inline-block;
  /*height: 400px;*/
  background: #ddd;
	padding-bottom: 50px;
}

.footy h2{
	color: #111;
  font-size: 30px;
}

.footy h3{
  padding: 15px 0;
  font-size: 23px;
  color: #444;
}

.footy p{
  color: #777;
}

.footy button{
  transition: all 0.3s ease-in-out;
  font-size: 18px;
  border-radius: 3px;
  border: 0;
  background: #ccc;
  color: #000;
  height: 50px;
  width: 110px;
}

.footy button:hover{
  transition: all 0.3s ease-in-out;
  background: #CB7305;
  color: #fff;
  cursor: pointer;
}

.footy-box{
  width: 33.3%;
  margin: 40px 0;
  display: block;
  float: left;
}


.footy-below{
  text-align: center;
  margin-top: -16px;
  height: 100px;
  position: relative;
  background: #ccc;
}

.footy-button{
  transition: all 0.3s ease-in-out;
  background-color: #505050;
  margin: 20px 10px;
  width: 55px;
  height: 55px;
  border: 0px solid #fff;
  border-radius: 50%;
  background-position: center;
  background-size: cover;
}

.footy-button:hover{
  transition: all 0.3s ease-in-out;
  cursor: pointer;
  filter: invert(95%);
  -webkit-filter: invert(95%);
}

.insta{
  background-image: url(../img/footy/in.png);
}
.fb{
  background-image: url(../img/footy/fb.png);
}
.pint{
  background-image: url(../img/footy/pi.png);
}
.gplus{
  background-image: url(../img/footy/gp.png);
}
.ytb{
  background-image: url(../img/footy/yt.png);
}
.twit{
  background-image: url(../img/footy/tw.png);
}



/*TRACKING STUFF */

.bcg-modal{
    width:100%;
    height:100%;
    background-color : rgba(0,0,0,0.7);
    position:absolute;
    top:0;
    display:flex;
    justify-content:center;
    align-items:center;
}


.modal-content{
   /* width:300px;
    height:300px;*/
    background-color:white;
    border-radius:4px;
    
}

.cu{
    border-radius:20px;
    padding:10px;
    width: 50%;
    height:50%;
    margin:auto;
    font-family:'Montserrat', sans-serif;
    font-size: 20px;
    background-color : orange;
}

.cu:hover{
    background-color : #FF9B00;;
}


.login input[type="button"]{
    padding : 10px;
    height : 20%;
    width:45%;
    border-radius: 30px;
    text-align :center;
    margin:auto;
    margin-left:auto;
    margin-right:auto;
    margin-top : 40px;
    background-color : orange;
    cursor:pointer;
}



.login input[type="button"]:hover{
    
    background-color : #FF9B00;
    
}



.login input{
    border-radius :20px;
    padding :10px;
    width: 50%  ;
    height : 50%;
    display : block;
    margin : auto;
    margin-top : 50px;
    border :2px;
    text-align :center;
    font-family:'Montserrat', sans-serif;
    font-size :20px;
}

.login input[type="submit"]:hover{
    background-color : #FF9B00;
}


.login input[type="submit"]{
    padding : 10px;
    width: 45%;
    height : 20%;
    border-radius: 30px;
    text-align :center;
    margin:auto;
    margin-left:auto;
    margin-right:auto;
    margin-top : 40px;
    background-color : orange;
    cursor:pointer;
}



.center {
  display: block;
  margin-left: auto;
  margin-right: auto;
  width: 100px;
}

/*CUSTUM SHEET*/

input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
    /* display: none; <- Crashes Chrome on hover */
    -webkit-appearance: none;
    margin: 0; /* <-- Apparently some margin are still there even though it's hidden */
}


.login input[type=number] {
    -moz-appearance:textfield; /* Firefox */
}


/*MOBILE ACCESS*/

}
@media only screen and (max-width: 767px) {
    
.artic-bgfixed{
   min-height: 45VH;
   background-attachment: fixed;
   height :auto;
   width :auto;
}

*{
  	outline: none;
    padding: 0;
    margin: 0;
}
body{
  width: 100%;
  padding: 0;
  margin: 0;
  font-family: 'Montserrat', sans-serif ;
  background: #fff;
  
}

article{
  transition: all 0.5s ease-in-out;
}

footer{
  transition: all 0.5s ease-in-out;
  padding-bottom: 0;
}

.nav-hide{
    opacity: 1;
}
.nav-middle{
  opacity: 0;
}
.nav-show {
    opacity: 1;
    margin-left: 300px;
}

/* UPPER-BAR */

.upper-bar{
  height: 150px;
  position: fixed;
  top: 0;
  width: 100%;
  background-image: url(../img/nav_back.png);
  background-size: cover;
  z-index: 2;
}

.upper-bar .upper-menu-btn{
  float: left;
  height: 70px;
  width: 70px;
  background: rgba(0,0,0,0.3);
  margin: 25px;
  border-radius: 50%;
}

.upper-bar .upper-menu-btn button{
  width: 100%;
  height: 100%;
  background: rgba(0,0,0,0);
  border: 0;
  font-size: 28px;
  color: #fff;
  cursor: pointer;
}

.upper-bar .upper-menu-btn:hover{
  background: rgba(255,255,255,0.2);
}

.upper-bar button img{
  max-width: 30px;
  /*padding: 20px;*/

  filter: invert(100%);
}

.upper-bar p{
  margin-top: 41px;
  float: left;
  color: #fff;
  font-size: 30px;
}

.upper-bar a img{
  height: 50px;
  padding: 10px;
}

.upper-bar a{
  float: right;
  background: rgba(0,0,0,0);
  padding: 0px 10px;
  margin: 20px 1.5%;
  border: 0;
  border-radius: 3px;
  color: #000;
}

.upper-bar a:hover{
  background: rgba(255,255,255,0.1);
}

/* NAVBAR */

.nav-wrapper{
  transition: all 0.5s ease-in-out;
  position: fixed;
  top: 0px;
  left: 0px;
  background-color: rgba(255,255,255,0.7);
  width: 300px;
  height: 100%;
  z-index: 1;
}
.nav-wrapper-hide{
    opacity: 0;
    transform: translateX(-300px);
}
.nav-wrapper-show{
    opacity: 1;
    transform: translateX(0px);
}

nav ul{
  padding: 0;
  margin: 0;
}
.main-ul{
  margin-top: 150px;
}

nav .list-main{
  padding: 15px 10px;
  list-style: none;
  background: #ddd;
  text-align: left;
  border-bottom: 1px solid #aaa;
  box-shadow: 0px 14px 25px 1px rgba(0,0,0,0.3);
}

nav .list-main-current{
  padding: 15px 10px;
  list-style: none;
  background: #888;
  text-align: left;
  border-bottom: 1px solid #777;
  box-shadow: 0px 14px 25px 1px rgba(0,0,0,0.3);
}

nav .list-sub{
  margin: 5px;
  margin-left: 20px;
  padding: 6px 10px;
  list-style: none;
}

nav .list-sub-current{
  margin: 5px;
  margin-left: 20px;
  padding: 6px 10px;
  list-style: none;
}

nav li .link-main{
  width: 100%;
  padding: 0px;
  margin: 6px;
  font-size: 21px;
  text-transform: uppercase;
  text-decoration: none;
  color: #222;
}

nav li .link-main-current{
  width: 100%;
  padding: 0px;
  margin: 6px;
  font-size: 21px;
  text-transform: uppercase;
  text-decoration: none;
  color: #fff;
}



nav li .link-main:hover{
  color: #fff;
}

nav li .link-sub{
  font-size: 18px;
  text-decoration: none;
  color: #444;
}

nav li .link-sub:hover{
  color: rgba(203,115,5,0.9);
}

/*ARTICLE*/
.boxes{
  text-align: center;
}
.boxes img{
  width: 15%;
  min-width: 190px;
  margin: 3%;
  border-radius: 50%;
}
.service{
  padding: 20px 20px 20px 0px;
}
.service img{
  margin: 0px 20px 0px 0px;
  padding: 10px 20px 10px 0;
  float: left;
  width: 15%;
  min-width: 190px;
}

.artic{
  width: 100%;
  margin: auto;
  padding: 10px 30px;
}

.artic h1{
  padding: 25px 0;
  margin-top: 150px;
  text-align:center;
  font-size:50px;
  color: #fff;
  
}

.artic h2{
  padding: 25px 0;
  margin-top: 30px;
  text-align: center;
  font-size:37px;
  color: #fff;
}

.artic h3{
  padding: 15px 0;
  text-align: left;
  font-size:23px;
  color: #fff;
}


.artic p{
  padding: 15px 0;
  text-align: justify;
  font-size:23px;
  color: #fff;
}

.artic-bcg{
  margin-top: -150px;
}

.artic-bcg-home{
  background-size: contain fixed;
  background-position: center   ;
  height :auto;
  background-repeat: no-repeat;
  background-attachment : fixed;
}


.artic-bcg-home:nth-child(6){
    background-image: url(../img/background.jpeg);

    
}


.artic-bcg-home:nth-child(5){
    background-image:url(../img/background_alt_2.jpeg) ;

}

.artic-bcg-home:nth-child(4){
    background-image: url(../img/background_alt.jpeg );
}


.cabinets{
  margin: auto;
  height: 300px;
}

.cabinets img{
  min-width: 200px;
  max-width: 300px;
  width: 20%;
  float: left;
}

.cabinets p{
  width: 75%;
  margin-right: 50px;
  float: left;
}

/*CONTACT FOOTER*/
.footy{
  width: 100%;
  text-align: center;
  display: inline-block;
  /*height: 400px;*/
  background: #ddd;
	padding-bottom: 50px;
}

.footy h2{
	color: #111;
  font-size: 30px;
}

.footy h3{
  padding: 15px 0;
  font-size: 23px;
  color: #444;
}

.footy p{
  color: #777;
}

.footy button{
  transition: all 0.3s ease-in-out;
  font-size: 18px;
  border-radius: 3px;
  border: 0;
  background: #ccc;
  color: #000;
  height: 50px;
  width: 110px;
}

.footy button:hover{
  transition: all 0.3s ease-in-out;
  background: #CB7305;
  color: #fff;
  cursor: pointer;
}

.footy-box{
  width: 33.3%;
  margin: 40px 0;
  display: block;
  float: left;
}


.footy-below{
  text-align: center;
  margin-top: -16px;
  height: 100px;
  position: relative;
  background: #ccc;
}

.footy-button{
  transition: all 0.3s ease-in-out;
  background-color: #505050;
  margin: 20px 10px;
  width: 55px;
  height: 55px;
  border: 0px solid #fff;
  border-radius: 50%;
  background-position: center;
  background-size: cover;
}

.footy-button:hover{
  transition: all 0.3s ease-in-out;
  cursor: pointer;
  filter: invert(95%);
  -webkit-filter: invert(95%);
}

.insta{
  background-image: url(../img/footy/in.png);
}
.fb{
  background-image: url(../img/footy/fb.png);
}
.pint{
  background-image: url(../img/footy/pi.png);
}
.gplus{
  background-image: url(../img/footy/gp.png);
}
.ytb{
  background-image: url(../img/footy/yt.png);
}
.twit{
  background-image: url(../img/footy/tw.png);
}



/*TRACKING STUFF */


.login input{
    border-radius :20px;
    padding :10px;
    width: 50%  ;
    height : 50%;
    display : block;
    margin : auto;
    margin-top : 50px;
    border :2px;
    text-align :center;
    font-family:'Montserrat', sans-serif;
    font-size :20px;
}

.login input[type="submit"]:hover{
    background-color :  #FF9B00;
}


.login input[type="submit"]{
    padding : 10px;
    width: 30%;
    height : 20%;
    border-radius: 30px;
    text-align :center;
    margin:auto;
    margin-left:auto;
    margin-right:auto;
    margin-top : 80px;
    background-color : orange;
    cursor:pointer;
   
}

.login input[type="button"]{
    padding : 10px;
    height : 20%;
    width:auto;
    border-radius: 30px;
    text-align :center;
    margin:auto;
    margin-left:auto;
    margin-right:auto;
    margin-top : 40px;
    background-color : orange;
    cursor:pointer;
}


.center {
  display: block;
  margin-left: auto;
  margin-right: auto;
  width: 100px;
}

}