﻿body {
    background-color: black;
    color: white;
    margin: 0px;
    padding: 0px;
   
   
    /*background-image: url('../images/2021_layout/diamond_plate_and_opaque_rectangle/diamondtread2000x175px_50.jpg');
    background-repeat: no-repeat;
    height: 100%;*/
}

html {
    margin: 0px;
    padding: 0px;
    height: 100%;
}

.bg-dark {
    background-color: black;
    
}

footer {
    /*background: linear-gradient(#115fa3, black);*/
    /*background-image: url('../images/2021_layout/diamond_plate_and_opaque_rectangle/diamondtread2000x175px_50.jpg');*/
}
p {
    color:white;
}

h1 {
    text-align: center;
    padding: 0 ;
    margin: 0 ;
    line-height: 60px;
    font-size: 40px;
}


.DropMenuBG {
    background-color: black;
}

MainPageCategories {
    background-color: white;
    margin: 5px;
}

a {
    color: white;
    text-decoration: none;
}

    a:hover {
        color: white;
        text-decoration: none;
    }

hr {
    color: white;
    border-color: white;
}

nav-link {
    color: white !important;
}

agm-nav-link {
    color: white ;
}

.ml-auto .dropdown-menu {
    left: auto;
    right: 0px;
}

.nav-link {
    padding-right: .5rem;
    padding-left: .5rem;
    color: white;
}


.imageList {
    padding: 35px
}

.blinky {
    -webkit-animation-name: example; /* Safari 4.0 - 8.0 */
    -webkit-animation-duration: 4s; /* Safari 4.0 - 8.0 */
    animation-name: example;
    animation-duration: 1s;
    background-color: red;
    width:100px;
    height:100px;

}

.blinkMan1 {
    animation: blinker 2s linear 0s forwards;
}


/* Safari 4.0 - 8.0 */
@@-webkit-keyframes example {
    from {
        background-color: red;
    }

    to {
        background-color: white;
    }
}

/* Standard syntax */
@@keyframes example {
    from {
        background-color: red;
    }

    to {
        background-color: white;
    }
}


/* Chrome, Safari, Opera */
@@-webkit-keyframes blinker {

    to {
        /*background-color: rgba(115, 242, 203, 0.80);*/
        background-color: black;
    }
}

/* Standard syntax */
@@keyframes blinker {

    to {
        /*background-color: rgba(115, 242, 203, 0.80);*/
        background-color: black;
    }
}

#cardBG {
    /*background-image: url('../images/2021_layout/project_section/nuts and bolts background/nutsandboltsbackgrounddarkdiamond_25.jpg');*/
    background-image: url('../images/2021_layout/project_section/nuts and bolts background/nutsbolts_2000x2600_25.jpg');
    background-size: 100%;
    color: white;
}

.WelderBG {
  
    background-size: 100%;
    background-color:#000060;
    color: white;
}

#LettuceBG {
    background-image: url('../images/2021_layout/greenrowcrops_25.jpg');
    background-size: 100%;
    color: white;
}

#EmploymentBG {
    /*background: linear-gradient(to right, black, white, white,white,black);*/
    background-size: 100%;
    color: white;
    padding: 50px;
    background-color:white;

}

.partial-width {
    width: 85%;
    margin: auto;
}

#FooterBG {
    background-image: url('../images/2021_layout/diamond_plate_and_opaque_rectangle/DiamondTread2000px_25.jpg');
    background-size: 100%;
    color: white;
    background-repeat: no-repeat;
}



.parallax {
    /* The image used */
    /*background-image: url('img_parallax.jpg');*/
    background-image: url('../images/2021_layout/vegetables_and_circuits_background/veggiesandcircuitsbackground_25.jpg');
    /* Full height */
    height: 100%;
    /* Create the parallax scrolling effect */
    background-attachment: fixed;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
}

/* Turn off parallax scrolling for tablets and phones. Increase the pixels if needed */
@media only screen and (max-device-width: 1366px) {
    .parallax {
        background-attachment: scroll;
    }
}

.centered {
    position: fixed;
    top: 50%;
    left: 50%;
    /* bring your own prefixes */
    transform: translate(-50%, -50%);
}

.WelderLine1 {
    font-size:35px; 
    color:white;
}

.WelderLine2 {
    font-size: 20;
    color: red;
}

.AutoAgSolutions {
    font-size: 40px;
    background: -webkit-linear-gradient(white,black);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

.WelderColumn {
   padding:100px;
}

.container-fluid {
    width: 100%;
    padding-right: 0px;
    padding-left: 0px;
    margin-right: auto;
    margin-left: auto;
}

.DiamondtreadBG {

    height: 100%;
}

/*from https://stackoverflow.com/questions/40526500/css-for-different-screen-resolutions and https://www.w3schools.com/cssref/css3_pr_mediaquery.asp*/
@media screen and (min-width: 992px) {
    /*large screens*/
    .DiamondtreadBG {
        background-image: url('../images/2021_layout/diamond_plate_and_opaque_rectangle/diamondtread2000x175px_50.jpg');
        background-repeat: no-repeat;
    }

    .WelderBG {
        background-image: url('../images/2021_layout/bluewelder_25.jpg');
    }
    }
@media screen and (max-width: 992px) {
    /*small Screens*/
    .DiamondtreadBG {
        background-image:  none;
    }
    .WelderBG {
        background-image: none;
    }
}