@media screen {

html, body {
    width: 100% !important;
    height: 100%;
    min-height: 100%;
    display: block !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
    position: relative;
}

form {
    min-height: 100%;
    display: block;
    overflow: auto;
}

body {
    font-family: Arial;
    font-size: medium;
    color: white;
    background-color: #f8f8f8;
    max-width: 1000px !important;
    min-height: 100%;
    padding-left: 0 !important;
    padding-right: 0 !important;
    overflow-x: hidden;
    -webkit-animation: bugfix infinite 1s;
    -moz-animation: bugfix infinite 1s;
    -o-animation: bugfix infinite 1s;
    animation: bugfix infinite 1s;
}

#crossfadebig {
    display: none;
}

@-webkit-keyframes bugfix {
    from{padding: 0;}
    to{padding: 0;}
}
@-moz-keyframes bugfix {
    from{padding: 0;}
    to {padding: 0;}
}
@-o-keyframes bugfix {
    from{padding: 0;}
    to{padding: 0;}
}
@keyframes bugfix {
    from {padding:0;}
    to{padding:0;}
}

#sidebar {
    display: none;
}

#wrapper {
    max-width: 100% !important;
    height: 100%;
    min-height: 100% !important;
    bottom: 0;
    right: 0;
    left: 0;
    margin: 0;
    padding: 0;
    position: absolute;
    background-color: #f8f8f8;
    text-align: left;
    box-shadow: 0 !important;
    overflow-x: hidden;
}

#banner a span img {
    height: 92% !important;
    max-width: 90% !important;
    margin: 0 4% 8% 6% !important;
    z-index: 1 !important;
    position: relative;
}

#crossfadesmall > img {
    width: 100%;
    min-height: 50px !important;
    height: 18% !important;
    position: absolute;
    top: 0;
    left: 0;
    color: transparent;
    opacity: 0;
    z-index: 0;
    -webkit-backface-visibility: hidden;
    -moz-backface-visibility: hidden;
    backface-visibility: hidden;
    -webkit-animation: imageAnimation 72s linear infinite 0s;
    -moz-animation: imageAnimation 72s linear infinite 0s;
    -o-animation: imageAnimation 72s linear infinite 0s;
    animation: imageAnimation 72s linear infinite 0s;
}

#crossfadesmall > img:nth-child(1) {
    background-image: url(../Images/1.JPG);
    -webkit-animation-delay: 0s;
    -moz-animation-delay: 0s;
    -o-animation-delay: 0s;
    animation-delay: 0s;
}

#crossfadesmall > img:nth-child(2) {
    background-image: url(../Images/2.png);
    -webkit-animation-delay: 6s;
    -moz-animation-delay: 6s;
    -o-animation-delay: 6s;
    animation-delay: 6s;
}

#crossfadesmall > img:nth-child(3) { 
    background-image: url(../Images/DSC_0238.JPG);
    -webkit-animation-delay: 12s;
    -moz-animation-delay: 12s;
    -o-animation-delay: 12s;
    animation-delay: 12s; 
}
#crossfadesmall > img:nth-child(4) { 
    background-image: url(../Images/4m.png);
    -webkit-animation-delay: 18s;
    -moz-animation-delay: 18s;
    -o-animation-delay: 18s;
    animation-delay: 18s; 
}
#crossfadesmall > img:nth-child(5) { 
    background-image: url(../Images/6.JPG);
    -webkit-animation-delay: 24s;
    -moz-animation-delay: 24s;
    -o-animation-delay: 24s;
    animation-delay: 24s; 
}

#crossfadesmall > img:nth-child(6) {
    background-image: url(../Images/try5m.JPG);
    -webkit-animation-delay: 30s;
    -moz-animation-delay: 30s;
    -o-animation-delay: 30s;
    animation-delay: 30s;
}

#crossfadesmall > img:nth-child(7) {
    background-image: url(../Images/try6.JPG);
    -webkit-animation-delay: 36s;
    -moz-animation-delay: 36s;
    -o-animation-delay: 36s;
    animation-delay: 36s;
}

#crossfadesmall > img:nth-child(8) {
    background-image: url(../Images/try4m.JPG);
    -webkit-animation-delay: 42s;
    -moz-animation-delay: 42s;
    -o-animation-delay: 42s;
    animation-delay: 42s;
}

#crossfadesmall > img:nth-child(9) {
    background-image: url(../Images/3m.png);
    -webkit-animation-delay: 48s;
    -moz-animation-delay: 48s;
    -o-animation-delay: 48s;
    animation-delay: 48s;
}

#crossfadesmall > img:nth-child(10) {
    background-image: url(../Images/5.png);
    -webkit-animation-delay: 54s;
    -moz-animation-delay: 54s;
    -o-animation-delay: 54s;
    animation-delay: 54s;
}

#crossfadesmall > img:nth-child(11) {
    background-image: url(../Images/8m.JPG);
    -webkit-animation-delay: 60s;
    -moz-animation-delay: 60s;
    -o-animation-delay: 60s;
    animation-delay: 60s
}

#crossfadesmall > img:nth-child(12) {
    background-image: url(../Images/try7.JPG);
    -webkit-animation-delay: 66s;
    -moz-animation-delay: 66s;
    -o-animation-delay: 66s;
    animation-delay: 66s;
}

@-webkit-keyframes imageAnimation { 
    0% { opacity: 1;
    -webkit-animation-timing-function: ease-in;
    -moz-animation-timing-function: ease-in;
    -o-animation-timing-function: ease-in;
    animation-timing-function: ease-in; 
    }
    10.5% { opacity: 1;
         -webkit-animation-timing-function: ease-out;
         -moz-animation-timing-function: ease-out;
         -o-animation-timing-function: ease-out;
         animation-timing-function: ease-out;
    }
    12.5% { opacity: 0 }
    97% {opacity: 0 }
    100% { opacity: 1 }
}

@-moz-keyframes imageAnimation { 
    0% { opacity: 1;
    -webkit-animation-timing-function: ease-in;
    -moz-animation-timing-function: ease-in;
    -o-animation-timing-function: ease-in;
    animation-timing-function: ease-in; 
    }
    10.5% { opacity: 1;
         -webkit-animation-timing-function: ease-out;
         -moz-animation-timing-function: ease-out;
         -o-animation-timing-function: ease-out;
         animation-timing-function: ease-out;
    }
    12.5% { opacity: 0 }
    97% {opacity: 0 }
    100% { opacity: 1 }
}

@-o-keyframes imageAnimation { 
    0% { opacity: 1;
    -webkit-animation-timing-function: ease-in;
    -moz-animation-timing-function: ease-in;
    -o-animation-timing-function: ease-in;
    animation-timing-function: ease-in; 
    }
    10.5% { opacity: 1;
         -webkit-animation-timing-function: ease-out;
         -moz-animation-timing-function: ease-out;
         -o-animation-timing-function: ease-out;
         animation-timing-function: ease-out;
    }
    12.5% { opacity: 0 }
    97% {opacity: 0 }
    100% { opacity: 1 }
}


@keyframes imageAnimation { 
    0% { opacity: 1;
    -webkit-animation-timing-function: ease-in;
    -moz-animation-timing-function: ease-in;
    -o-animation-timing-function: ease-in;
    animation-timing-function: ease-in; 
    }
    10.5% { opacity: 1;
         -webkit-animation-timing-function: ease-out;
         -moz-animation-timing-function: ease-out;
         -o-animation-timing-function: ease-out;
         animation-timing-function: ease-out;
    }
    12.5% { opacity: 0 }
    97% {opacity: 0 }
    100% { opacity: 1 }
}

* {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    -webkit-transition: 0.25s ease-in-out;
    -moz-transition: 0.25s ease-in-out;
    -o-transition: 0.25s ease-in-out;
    transition: 0.25s ease-in-out;
}

#nav.menu {
    padding-left: 0 !important;
}

#drawer-toggle {
    position: absolute;
    opacity: 0;
}

#drawer-toggle-label {
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    top: 0.5%;
    left: 1%;
    height: 4%;
    width: 10%;
    display: block;
    position: absolute;
    background: rgba(255,255,255,0);
    z-index: 500;
}

#drawer-toggle-label:before {
    content:'';
    display: block;
    position: absolute;
    height: 3px;
    width: 24px;
    background: black;
    left: 1%;
    top: 0.5%;
    box-shadow: 0 6px 0 black, 0 12px 0 black;
    z-index: 5;
}

#navigation {
    max-width: 85%;
    position: absolute;
    top: 18%;
    left: -1500px;
    min-height: 100%;
    max-height: 1000%;
    background: rgba(0,0,0,0.8);
    padding: 0;
    overflow-x: hidden;
    overflow-y: visible;
    font-size: medium;
    z-index: 3;
    text-align: center;
    -webkit-overflow-scrolling: touch;
}

#navigation li {
    font-weight: bold;
    list-style: none;
    margin: 3.5% 1% 4% 1% !important;
}

#navigation ul li ul li a {
    font-weight: normal;
    font-size: small;
    color: white;
    list-style: none;
}

#navigation a {
    color: white;
    text-decoration: none;
    list-style: none;
    margin: 2% 1% 1% 1%;
}

#drawer-toggle:checked ~ #drawer-toggle-label {
    height: 100%;
    width: 100%;
    z-index: 2 !important;
    background: rgba(255,255,255,0);
}

#drawer-toggle:checked, #drawer-toggle:checked ~ #navigation {
    left: 0;
    z-index: 50;
    margin-right: 20%;
}

#drawer-toggle:checked, #drawer-toggle:checked ~ #content_area {
    margin-left: 40% !important;
    width: 100%;
    float: right;
}

#content_area {
    margin: 0 1% 0 1% !important;
    padding: 0 0 33px 0 !important;
    float: right;
    top: 22% !important;
    max-width: 98% !important;
    min-width: 98%;
    height: auto !important;
    min-height: 100%;
    z-index: 1;
    position: absolute;
    left: 0 !important;
    background-color: #f8f8f8;
    -ms-word-wrap: break-word;    
    word-wrap: break-word;
}

#wrapper:after {
    clear: both;
    content:"";
    display: table;
}

#footer {
    display: none;
}

#content_area p.blanks {
    display: none;    
}

#content_area p span.auto-style13 {
    background-color: #f8f8f8 !important;
}

#content_area p.auto-style17 {
    margin-left: 0 !important;    
}

#content_area p {
    background-color: #f8f8f8 !important;
}

/*Changes container size around image*/

#content_area #left {    
    max-width: 41% !important;
    height: auto !important;
    margin: 1% 5% 0 0 !important;
    padding: 0 0 0 0 !important;
    pointer-events: none !important;
}

#content_area #left img {
    height: auto !important;
    max-width: 100% !important;
    padding-bottom: 0;
}

#content_area #enlarge {
    max-width: 41% !important;
    height: auto !important;
    margin: 1% 0 0 5% !important;
    padding: 0 0 0 0 !important;
    pointer-events: none !important;
    overflow: hidden;
}

#content_area #enlarge img {
    height: auto !important;
    max-width: 100% !important;
    padding-bottom: 0;
}

#content_area #enlarge2 {
    max-width: 41% !important;
    height: auto !important;
    margin: 1% 0 0 5% !important;
    padding: 0 0 0 0 !important;
    pointer-events: none !important;
}

#content_area #enlarge2 li {
    left: 0 !important;
}

#content_area #enlarge2 img {
    height: auto !important;
    max-width: 100% !important;
    padding-bottom: 0;
}

/*Formats any images not in enlarge tags*/

#content_area img {
    max-width: 41% !important;
    height: auto !important;
    margin: 1% 1% 0 1% !important;
    padding: 0 0 0 0 !important;
}

/*Makes sure gifs appear instead of thumbnail images*/

#content_area #enlarge2 li span.gif img {
    right: 0 !important;
    left: 0 !important;
    float: right !important;
    width: 100% !important;
    max-width: 100% !important;
    height: auto !important;
    top: 0 !important;
    -webkit-perspective-origin: 0 50% !important;
    -moz-perspective-origin: 0 50% !important;
    -ms-perspective-origin: 0 50% !important;
    perspective-origin: 0 50% !important;
}

#content_area ul#enlarge2.enlarge2 {
    width: 35% !important;
    max-width: 41%;
    right: 0 !important;
    margin-right: 1% !important;
}

#content_area ul.enlarge2 span {
    right: 0 !important;
    position: relative !important;
}

#content_area #left li span.gif img {
    right: 0 !important;
    float: right !important;
    width: 100% !important;
    max-width: 100% !important;
    height: auto !important;
    top: 0 !important;
    -webkit-perspective-origin: 0 50% !important;
    -moz-perspective-origin: 0 50% !important;
    -ms-perspective-origin: 0 50% !important;
    perspective-origin: 0 50% !important;
}

#content_area ul li img.gif {
    display: none;
}

#content_area ul#left.enlarge {
    width: 35% !important;
    max-width: 41%;
    right: 0 !important;
    margin-right: 1% !important;
}

#content_area ul.enlarge span {
    right: 0 !important;
    position: relative !important;
}

/*Makes sure enlarged image does not appear*/

#content_area ul {
    background-color: #f8f8f8 !important;
}

#content_area ul li span.blank {
    display: none;
}

/*Removes 'header' images*/

#content_area div img {
    display: none;
}

/*Removing Rig and Mitigation and Repairs pictures*/

#content_area ul.enlarge2 img.last {
    display: none;
}

#content_area img.rig {
    display: none;
}

#content_area ul.enlarge li img.first {
    width: 75% !important;
}

#content_area img.second {
    width: 30% !important;
}

/*Change headers so they fit*/

#content_area h3 {
    margin: 1.5% 0 1% 0 !important;
    height: auto !important;
    max-width: 100% !important;
    font-size: large;
    padding: 0;
    background-color: #f8f8f8;
}

}