/*
 * HTML5 Boilerplate
 *
 * What follows is the result of much research on cross-browser styling.
 * Credit left inline and big thanks to Nicolas Gallagher, Jonathan Neal,
 * Kroc Camen, and the H5BP dev community and team.
 */

/* ==========================================================================
   Base styles: opinionated defaults
   ==========================================================================
on swiper.min.css line 15
.swiper-pagination-bullet -- change width and height to 40px
.swiper-container-horizontal>.swiper-pagination .swiper-pagination-bullet --change margin to 0 15px
*/
/*changes to swiper.css*/
.tyContainer{
    background-color:#eceff1 !important;
    text-align:center;
}
.swiper-pagination-bullet {
    width:15px;
    height: 15px;
}
p.field-p
{
    margin-bottom: 1em !important;
}

.swiper-slide{
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
}
.swiper-slideDelta{
    background-size: 90%;
    background-repeat: no-repeat;
    background-position: 50% 40%;
}
.swiper-container-horizontal>.swiper-pagination .swiper-pagination-bullet {
    margin: 0 15px;
}
#SignUp
{
    clear:both;
}
#verInformant 
{
    text-align:right;
    z-index:999;
    position:fixed;
    right:1em;
    bottom:1em;
    color:#EC948E;
    font-size:2em;
}
@media(max-width:768px) {
    #verInformant {
        font-size: 1.3em;
    }
}
#appleButton 
{
    margin-right:20px;
}
.swiper-slide p 
{
    text-align:left;
    position:absolute;
    top:1em;
    left:0;
    padding: 10px 1em;
    background-color: rgba(0,0,0,0.5);
    font-size:2em;
    color:#fff;
}

.moreButton {
    background-color: #da291c;
    padding: 10px 1em;
    font-size: 1em !important;
    position: relative;
    float: right;
    right: 0px;
    top: 1em;
    clear: both;
    color: white;
}

div.swiper-slide a {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    text-decoration: none; /* No underlines on the link */
    z-index: 10; /* Places the link above everything else in the div */
    background-color: #FFF; /* Fix to make div clickable in IE */
    opacity: 0; /* Fix to make div clickable in IE */
    filter: alpha(opacity=1); /* Fix to make div clickable in IE */
}

/*changes to bootstrap.min.css*/
.form-control {
    font-size:18px;
    height:44px;
}
.ndfHFb-c4YZDc-GSQQnc-LgbsSe.ndfHFb-c4YZDc-to915-LgbsSe.VIpgJd-TzA9Ye-eEGnhe.ndfHFb-c4YZDc-LgbsSe{
    display: none;
}

input[type=checkbox], input[type=radio] {
/*  -ms-transform: scale(2); 
  -moz-transform: scale(2); 
  -webkit-transform: scale(2); 
  -o-transform: scale(2); */
  padding: 10px;
  border: 1px solid #8c8279;
  background: #fff;
  border-radius: 3px;
  box-shadow: none;
}

.entry-content > label, p {
    font-weight: 300;
    font-size: 24px;
}

label {
 font-weight: 300;   
}

/*main.css*/

#details > .list td {
 padding-bottom:5px;   
    font-size: 20px;
}

.details-wrap > .list {
 padding-bottom:0px !important;
}

.details-wrap > .list td {
 padding: 0px !important;   
}

.details-wrap > .list th {
 padding: 0px !important;   
}

.details-wrap > .list td {
    font-size: 1em !important;
}

body 
{
    font-family:'Source Sans Pro', sans-serif !important;
    src: local('../fonts/SourceSansPro-Regular.ttf'), format('truetype');
    overflow-x:hidden;
    //overflow-y:scroll;
    
}

input,
input,
select,
textarea {
    color: #222;
}

html {
    font-family:"Source Sans Pro", sans-serif  !important;
    src: local('../fonts/SourceSansPro-Regular.ttf'), format('truetype');
    color: #fff;
    overflow-y: auto;
}
    button.locConn, html input[type="button"], input[type="reset"], input[type="submit"] {
        background: #84bd00;
        border-radius: 3px;
        color: #fff;
        margin: 0px;
        border: 1px solid #84BD00;
        font-size:1.75em;
    }
   #connLibSub,#filterSub,#email-results-button{
        padding:0.3em 1.5em;
    }

#filterClear 
{
    float:right;
    z-index:1;
    padding: 0.3em 1.5em;
    background-color:#009cde;
    color:#fff;
    border-radius: 3px;
    text-align:center;
}

#filterClear p {
    margin: 5px auto;
    font-weight:400;
}


#connection-type, #connection-name{
    margin-bottom: 1em;
}

select {
    padding: 3px;
    position: relative;
    width: 60%;
}


h1, h2, h3, h4, h5, h6 {
    font-size: 1em;
    margin: 0 0 1em 0;
}

a {
    color: #d91f05;
    text-decoration: none;
}

/*
 * Remove text-shadow in selection highlight: h5bp.com/i
 * These selection declarations have to be separate.
 * Customize the background color to match your design.
 */

::-moz-selection {
    background: #b3d4fc;
    text-shadow: none;
}

::selection {
    background: #b3d4fc;
    text-shadow: none;
}

/*
 * A better looking default horizontal rule
 */

hr {
    display: block;
    height: 1px;
    border: 0;
    border-top: 1px solid #ccc;
    margin: 1em 0;
    padding: 0;
}

/*
 * Remove the gap between images and the bottom of their containers: h5bp.com/i/440
 */

img {
    vertical-align: middle;
}

/*
 * Remove default fieldset styles.
 */

fieldset {
    border: 0;
    margin: 0;
    padding: 0;
}

/*
 * Allow only vertical resizing of textareas.
 */

textarea {
    resize: vertical;
}

/* ==========================================================================
   Chrome Frame prompt
   ========================================================================== */

.chromeframe {
    margin: 0.2em 0;
    background: #ccc;
    color: #000;
    padding: 0.2em 0;
}

/* ==========================================================================
   Author's custom styles
   ========================================================================== */
#header {
    background-color:#DA291C;
    margin: 0px auto;
    position: fixed;
    width: 100%;
    overflow-x: hidden;
    overflow-y: auto;
    z-index:998;
    /*padding-top:10px;*/ /*apple only*/
    
    transition-duration:.75s;
    -webkit-transition: all .75s;
    -moz-transition: all .75s;
    -ms-transition: all .75s;
    -o-transition: all .75s;
    transition: all .75s;

    -webkit-transform:translate3d(0,0,0);
    -moz-transform:translate3d(0,0,0);
    -ms-transform:translate3d(0,0,0);
    -o-transform:translate3d(0,0,0);
    transform:translate3d(0,0,0);
}
#bodyMainStyle{
    background-color:#eceff1;
    margin: 0px auto;
    position: relative;
    width: 100%;
    overflow-x: hidden;
    overflow-y: auto;
    float:left;
    margin-top:70px;
}

#bodyMainStyle .col-md-12 {
    padding-left: 0px;
    padding-right: 0px;
}

#bodyMainStyleHome{
    background-color:#eceff1;
    margin: 0px auto;
    position: relative;
    width: 100%;
    margin-top: 1.25em;
    overflow-x: hidden;
    overflow-y: auto;
    float:left;
}

#bodyMainStyleHome .col-md-12 {
    padding-left: 0px;
    padding-right: 0px;
}

#footer{
    margin: 0px auto;
    position: relative;
    width: 100%;
    overflow-x: hidden;
    overflow-y: auto;
    min-height: 280px;
}

.swiper-container {
            width: 100% !important;
            color:#DA291C;
}
 
.swiper-slide {
            text-align: center;
            font-size: 18px;
            /*background: #fff;*/
            /* Center slide text vertically */
            display: -webkit-box;
            display: -ms-flexbox;
            display: -webkit-flex;
            display: flex;
            -webkit-box-pack: center;
            -ms-flex-pack: center;
            -webkit-justify-content: center;
            justify-content: center;
            -webkit-box-align: center;
            -ms-flex-align: center;
            -webkit-align-items: center;
            align-items: center;
}

.GP2GOLogo 
{
    margin: 0px auto;
    float:left;
    width:80%;
    padding-top:1em;
}
.GP2GOLogo p 
{
    color:#fff;
    float:left;
    text-align:center;
    vertical-align:middle;
    width:100%;
    font-size:2.5em;
}
#hamburgerButton 
{
    float:left;
    width:10%;
    margin-top: 1.5em;
}

 #hamburgerButton img {
         width: 30px;
        height: auto;
        }
#contactButton 
{
    float:right;
    width:10%;
    margin-top: 1.5em;
    margin-right: 0;
    right: 0px;
}

#contactButton img {
    width:35px;
    height: auto;
    float: right;
    margin-right:10px;
}
.catRow 
{
    border-bottom: 1px solid #ECEFF1;
    float:left;
    clear:both;
    width:100%;
        padding: 2em;
}
.configRow 
{
    border-bottom:1px solid #ECEFF1;
    float:left;
    clear:both;
    width:100%;
    padding: 2em;
}

.connRow 
{
    border-bottom:1px solid #ECEFF1;
    float:left;
    clear:both;
    width:100%;
    padding: 2em;
}

.connFooter 
{
    background-color:#fff;
    color:#333;
    font-family:'Source Sans Pro';
}

.connFooter a {
 color: #75787b !important;   
}

.connFooter > .info-block {
    font-size: 16px;   
}

.connFooter > td {
    font-size: 16px; 
    padding-left:0px;
}
#bottomConn 
{
    position:fixed;
    left: 0;
    visibility:hidden;
    color:#fff;
    background-color:#00A499;
    height:7em;
    width:100%;
    z-index:16;
    -webkit-transition: -webkit-transform 0.75s ease-in-out;
    -webkit-transition: -webkit-transform 0.75s ease-in-out;
    -webkit-transition: -webkit-transform 0.75s ease-in-out;
    -webkit-transition: -webkit-transform 0.75s ease-in-out;
    transition: transform 0.75s ease-in-out;
    
    -webkit-transform:translate3d(0,18%,0);
    -moz-transform:translate3d(0,18%,0);
    -ms-transform:translate3d(0,18%,0);
    -o-transform:translate3d(0,18%,0);
    transform:translate3d(0,18%,0);
}

#bottomConn.connLib {
    top:0;
}
#bottomConn .col-md-4 
{
    width:33%;
    height:100%;
    float:left;
    text-align:center;
    vertical-align:middle;
    font-size:2.5em;
    text-decoration:none;
    border-left:solid;
    padding:.45em 0px;
}

#bottomConn.cataConn .col-md-4 {
    width:50%;
    height:100%;
    float:left;
    top:0;
    text-align:center;
    vertical-align:middle;
    font-size:2.5em;
    text-decoration:none;
    border-left:solid;
    padding:.45em 0px;
}

#bottomConn.locConn{
   
    position:fixed;
    bottom: 0;
    visibility:hidden;
    left: 0;
    color:#fff;
    background-color:#00A499;

}
#bottomConn.locConn .col-md-4 {
    width:50%;
    height:100%;
    float:left;
    text-align:center;
    vertical-align:middle;
    font-size:2.5em;
    text-decoration:none;
    border-left:solid;
    padding:.45em 0px;
}

button.locConn{
    background: #00A499;
    border-radius: 3px;
    color: #fff;
    margin: 0px;
    border: 1px solid #00A499;
    font-size:1.75em;
}

#bottomConn .col-md-4 p {
 margin-bottom: 0px;   
}

#filter.locConn{
    width: 50%;
    height: 100%;
    float: left;
    text-align: center;
    vertical-align: middle;
}
#show-all-details {
    width: 50%;
    height: 100%;
    float: right;
    text-align: center;
    vertical-align: middle;
}
@media(max-width:768px) {
    #bottomConn p {
        margin-top: 1em;
    }
}

#show-details p {
    width: 50%;
    height: 100%;
    float: right;
    text-align: center;
    vertical-align: middle;
    margin-top:.25em;
}

@media(max-width:768px) {
    #bottomConn .col-md-4 {
        font-size:1em;
    }
}

#bottomConn.click
    {
        position:fixed;
        top: 0;
        left: 0;
        visibility:visible;
        color:#fff;
        background-color:#00A499;
        height:7em;
        width:100%;
        float:left;
        z-index:16;
        
        -webkit-transition: -webkit-transform 0.75s ease-in-out;
        -webkit-transition: -webkit-transform 0.75s ease-in-out;
        -webkit-transition: -webkit-transform 0.75s ease-in-out;
        -webkit-transition: -webkit-transform 0.75s ease-in-out;
        transition: transform 0.75s ease-in-out;
        
        -webkit-transform:translate3d(0%,0,0);
        -moz-transform:translate3d(0%,0,0);
        -ms-transform:translate3d(0%,0,0);
        -o-transform:translate3d(0%,0,0);
        transform:translate3d(0%,0,0);
    }
    @media(max-width:768px) {
    #bottomConn .col-md-4 {
        font-size:1.5em;
    }
}
.ndfHFb-c4YZDc-GSQQnc-LgbsSe.ndfHFb-c4YZDc-to915-LgbsSe.VIpgJd-TzA9Ye-eEGnhe.ndfHFb-c4YZDc-LgbsSe
{
    display:none !important;
}
.emailSuccess 
{
    float:left;
    width:100%;
    padding:1em;
    text-align:center;
    margin-top:0px !important;
}
    .emailSuccess p 
    {
        clear:both;
        font-size:3em;
        margin-bottom:1em;
    }
    .emailSuccess .glyphicon-ok-circle
    {
        color:#84bd00;
        font-size:5em;
        text-align:center;
        width:100%;
        padding:.5em;
    }
    .emailSuccess a 
    {
        font-size:2.5em;
        color:#333;

    }


    .subSuccess 
{
    float:left;
    width:100%;
    padding:2em;
    text-align:center;
    margin-top:0px !important;
}
    .subSuccess p 
    {
        font-size:3em;
        margin-bottom:1em;
    }
    .subSuccess .glyphicon-ok-circle
    {
        color:#84bd00;
        font-size:5em;
        text-align:center;
        width:100%;
        padding:.5em;
    }
    .subSuccess a 
    {
        font-size:2.5em;
        color:#333;

    }
.whiteOut
{
    background-color: white;
    width: 10%;
    z-index: 12;
    height: 100%;
    float: right;
    position: absolute;
    margin-left: 90%;
}
.whiteOutLeft
{
    background-color: white;
    width: 10%;
    z-index: 12;
    height: 100%;
    float: left;
    position: absolute;
}



div.Infobox{
   background-color:transparent !important;
   border: none !important;

}
div.infobox-stalk{
    opacity:0 !important;
}

#hiddenHamburger 
{   
    /*visibility:hidden;for testing*/
    width: 66%;
    height:100%;
    position: relative;
    float: left;
    background-color: #75787B;
    margin-right:80%;
    margin-left:-12%;
    position: fixed;
    padding-left: 2%;
    /*z-index:4;forTesting*/

    transition-duration: all .75s;
    -webkit-transition: all .75s;
    -moz-transition: all .75s;
    -ms-transition: all .75s;
    -o-transition: all .75s;
    transition: all .75s;

     -webkit-transform:translate3d(0,0,0);
    -moz-transform:translate3d(0,0,0);
    -ms-transform:translate3d(0,0,0);
    -o-transform:translate3d(0,0,0);
    transform:translate3d(0,0,0);
}
@media(max-width:768px) {
    #hiddenHamburger{
        font-size:.75em;
    }
}

#hiddenHamburger.click 
{
    overflow-y:auto;/*add scrolling so that the text can stay a readable size and still fit on any device*/  
                      /*keep only on the "click" class so that the scroll bar dosn't persist*/

    -webkit-transform:translate3d(18%,0,0);
    -moz-transform:translate3d(18%,0,0);
    -ms-transform:translate3d(18%,0,0);
    -o-transform:translate3d(18%,0,0);
    transform:translate3d(18%,0,0);

}
#hiddenHamburger div
{   
   float:left;
   clear:both;
   width:100%;
}

#hiddenHamburger .col-md-8
{   
   padding:.025%;
}
    #hiddenHamburger p 
    {
        float:left;
        font-size:2em;
        /*padding:.75em;*/
        color:#ffffff;

    }
    #hamHome 
    {
        border-bottom: 1px solid #9E9E9E;
        padding: 2em;
    }

#hamHome p {
 margin:0px;   
}

     #hamConn
    {
        border-bottom: 1px solid #9E9E9E;
        padding: 2em;
    }
#hamConn p {
 margin:0px;   
}

    #hamCat
    {
        border-bottom: 1px solid #9E9E9E;
        padding: 2em;
    }
#hamCat p {
 margin:0px;   
}
    #hamCont
    {
        border-bottom: 1px solid #9E9E9E;
        padding: 2em;
    }
#hamCont p {
 margin:0px;   
}
    #hamLoc
    {
        border-bottom: 1px solid #9E9E9E;
        padding: 2em;
    }
#hamLoc p {
 margin:0px;   
}
    #hamConfig
    {
        border-bottom: 1px solid #9E9E9E;
        padding: 2em;
    }
#hamConfig p {
 margin:0px;   
}
        .loginContainer{
            text-align:center;
            margin-top:60px;
            width:100%;
        }
        .loginContainer div {
            width:40%;
            float:left;

            padding:2em;

            background-color: #84bd00;
            border-radius:3px;
            margin-left:6.66666666%;
            color:#fff;
        }
        
        @media(max-width:768px) {
         .loginContainer div {
            margin-top:10%;
            width:80%;
            background-color: #84bd00;
            border-radius:3px;
            margin:0px auto;
            color:#fff;
            float:none;
        }
        }

         @media(max-width:768px) {
            #faqButton {
                margin-top:10%;
            }
         }


#hamInfo 
{
    padding: 3.5%;
}
#buttonHolder 
{
    float:left;
    width:100%;
    padding:1%;
    text-align:center;
}

#hamInfo img {
 width: 40px;
    height: auto;
}

     #hamOther
    {
        border-bottom: 1px solid #9E9E9E;
        padding: 2em;
    }
#hamOther p {
 margin:0px;   
}

#hamOther img {
    margin:0px;
    padding:0px;
    float:right;
    right:0;
    width: 45px;
    height: auto;
}
#hamCont img {
    margin:0px;
    padding:0px;
    float:right;
    right:0;
    width: 45px;
    height: auto;
}
#hamLoc img {
    margin:0px;
    padding:0px;
    float:right;
    right:0;
    width: 45px;
    height: auto;
}
#hamHome img {
    margin:0px;
    padding:0px;
    float:right;
    right:0;
    width: 45px;
    height: auto;
}
#hamConn img {
    margin:0px;
    padding:0px;
    float:right;
    right:0;
    width: 45px;
    height: auto;
}
#hamConfig img {
    margin:0px;
    padding:0px;
    float:right;
    right:0;
    width: 45px;
    height: auto;
}
#hamCat img {
    margin:0px;
    padding:0px;
    float:right;
    right:0;
    width: 45px;
    height: auto;
}
    #hamOther .leavePage img {
     margin-left:15px !important; 
        margin-top:5px !important;
        width:20px !important;
        height: auto !important;
        float: left !important;
    }
    #legal img {
     margin-left:15px; 
        width:15px;
        height: auto;
    }
    #aboutGP img {
     margin-left:15px; 
        width:15px;
        height: auto;
    }

#hamLogo 
{
    float:left;
    height:100%;
    padding:4.5em 1.5em 1.5em;
}

#hiddenHamburger .glyphicon-menu-right 
{
    float:right;
    height:100%;
    font-size:2.5em;
    /*padding-top:.7em;
    padding-right:1em;*/
    color:#9E9E9E;
}
#footer p 
    {
        float:left;
        font-size:2em;
        /*padding:1em;*/
        margin-bottom: 0px;
        color:#75787b;

    }

#footer img {
 width: 35px;
    height: auto;
    float: right;
}


#footer .glyphicon-menu-right 
{
    float:right;
    height:100%;
    font-size:2.5em;
    padding-top:.85em;
    padding-right:1em;
    color:#DA291C;
}

#hiddenEmail 
{
    position:fixed;
    bottom:0;
    left:0;

    z-index:99;
    background-color:white;
    width:100%;
    height:100%;
    margin-left:500%;
    padding:1em;
    margin-top:-29em;
    border-top:solid;
    border-color:#75787b;

    transition-duration:.75s;
    -webkit-transition: all .75s;
    -moz-transition: all .75s;
    -ms-transition: all .75s;
    -o-transition: all .75s;
    transition: all .75s;

     -webkit-transform:translate3d(0,0,0);
    -moz-transform:translate3d(0,0,0);
    -ms-transform:translate3d(0,0,0);
    -o-transform:translate3d(0,0,0);
    transform:translate3d(0,0,0);
}
#hiddenEmail.click
    {
        position:fixed;
        bottom:0;
        left:0;

        z-index:99;
        background-color:white;
        width:100%;
        height:100%;
        margin-top:-29em;
        margin-left:500%;
        border-top:solid;
        border-color:#75787b;

        transition-duration:.75s;
        -webkit-transition: all .75s;
        -moz-transition: all .75s;
        -ms-transition: all .75s;
        -o-transition: all .75s;
        transition: all .75s;

         -webkit-transform:translate3d(-500%,0,0);
        -moz-transform:translate3d(-500%,0,0);
        -ms-transform:translate3d(-500%,0,0);
        -o-transform:translate3d(-500%,0,0);
        transform:translate3d(-500%,0,0);
    }

#hiddenSub 
{
    position:absolute;
    background-color:white;
    width:100%;
    height:100%;
    border-top:solid;
    border-color:#75787b;
    border-top:solid;

    display:none;

    margin-top:200%;

    transition-duration:.75s;
    -webkit-transition: all .75s;
    -moz-transition: all .75s;
    -ms-transition: all .75s;
    -o-transition: all .75s;
    transition: all .75s;

    outline: 1px solid transparent;/*style to prevent the box from drawing garbage lines*/

    /*-webkit-transform:translate3d(0,-19%,0);
    -moz-transform:translate3d(0,-19%,0);
    -ms-transform:translate3d(0,-19%,0);
    -o-transform:translate3d(0,-19%,0);testarino
    transform:translate3d(0,-19%,0);*/
}
#checkEmAll 
{
    background-color:#C0C0C0;
}
#options 
{
    z-index:25;
    margin-top:-16em;

    position: absolute;
    width: 100%;

    color:#fff;
    background-color:#fff;
    border-bottom: 2px solid #84bd00;
}
#options.locConn
{
    border-bottom: 2px solid #00A499;

    margin-top:0;

    position: absolute;
    width: 100%;

    color:#fff;
    background-color:#00A499;
}
#options.click
{
   
    transition-duration:.5s;
    -webkit-transition: all .5s;
    -moz-transition: all .5s;
    -ms-transition: all .5s;
    -o-transition: all .5s;
    transition: all .5s;

     -webkit-transform:translate3d(0,16em,0);
    -moz-transform:translate3d(0,16em,0);
    -ms-transform:translate3d(0,16em,0);
    -o-transform:translate3d(0,16em,0);
    transform:translate3d(0,16em,0);
}
#xButton
{
    float:right;
    font-size:1.5em;
    color:#75787b;
    padding:.5em;
}
#xTwo
{
float:right;
font-size:1.5em;
color:#75787b;
z-index:4;
clear:both;
padding:.75em;
}

#xLoc{
float:right;
font-size:1.5em;
padding:1.5em;
color:#75787b;
padding-top:.5em;
right:0em;
width: 100%;
position: fixed;
text-align: right;
padding-bottom: 2em;
}

#emailSection {
clear:both;
 margin-top: 10px;   
}
#emailSection p 
{
    font-size:1.5em;
    clear: both;
    color: #75787b;
}
#emailSection label 
{
    font-size:2em;
}
#email {
    margin-bottom: 2em;
}
#from {
    margin-bottom: 2em;
}
#submitButton 
{
    width:100%;
    margin-top:3em;
}
#bodyWrapper 
{
    padding:1em;
    background-color:#ECEFF1;
    text-decoration:none;
    float:left;
    width:100%;
    margin-top: 70px;
}

.subSec 
{
    background-color:#fff;
    z-index:1;
    width:30%;
    margin:0 1.5%;
    float:left;
    text-align:center;
    padding:2em;
    margin-top:2em;
}
.subSec span
{
    width:100%;
    float:left;
}
@media(max-width:768px){
    .subSec
    {
        display:block;
        width:100%;
        margin:2.5% auto;
        padding:.85em;
        vertical-align:middle;
    }
}
#icpsignup1685 {
    top:0px;
    left:0px;
    padding:2em;
    height: 100%;
    background-color:#fff;
    clear:both;
}

#SignUp .signupframe {
 border: 0px;

}

#SignUp .signupframe td {
 padding: 5px;   
}
.errorMsg {
visibility:hidden;
color: red;
text-align: left;
}
#SignUp .signupframe label {
    display: inline;
    margin-left: 5px;
    line-height: 32px;
}

#SignUp .signupframe label {
    display: inline;
    margin-left: 5px;
    line-height: 32px;
}
.signupframe tr 
{

}
#legal 
{
    float:left;
    margin-top:5em;
    margin-left: 1.5%;
    color:#333;
    font-family:'Source Sans Pro';
    font-size: 0.8em;
}

#MyNOVPortal {
    float:left;
}
#MyNOVPortal.info {
    margin-left:1.5%;
}
* {
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}

html.pdf-viewer, .pdf-viewer body, .pdf-viewer #pdf-viewer .content {
    height: 100%;
}

#pdf-viewer {
    display: none;
}

ul.main-menu {
    list-style: none;
    margin: 0px;
    padding: 0px;
}

.main-menu a {
    display: block;
    font-weight: bold;
    color: #fff;
    padding: 10px 15px;
    background: #911e0e;
    border-bottom: 1px solid #700f03;
    border-top: 1px solid #ab3828;
}

    .main-menu a:hover, .main-menu a:active {
        background: #700f03;
    }

#content iframe {
}

a.back-btn {
    color:#fff;
    text-align:center;
    vertical-align:middle;
    font-size:1.5em;
    padding-top:.25em;
    padding-left: .5em;
}

html.view-details, .view-details body, .view-details #container {
}

.csstransitions.view-details .site-header {
    -webkit-transition: background-color 500ms ease;
    -moz-transition: background-color 500ms ease;
    -o-transition: background-color 500ms ease;
    transition: background-color 500ms ease;
}

.view-details #content {
}

.view-details #details {
    display: block;
}

#details {
    display: none;

    margin-left:200%;

    transition-duration:.75s;
    -webkit-transition: all .75s;
    -moz-transition: all .75s;
    -ms-transition: all .75s;
    -o-transition: all .75s;
    transition: all .75s;

     -webkit-transform:translate3d(0,0,0);
    -moz-transform:translate3d(0,0,0);
    -ms-transform:translate3d(0,0,0);
    -o-transform:translate3d(0,0,0);
    transform:translate3d(0,0,0);
}

    #details h1 {
        padding-right: 40px;
    }

    #details ul {
        margin: 0 0 20px 20px;
        padding: 0px;
    }


#sendFeedbackEmail input {
    display: block;
    width: 90%;
}

    #sendFeedbackEmail input[type=submit] {
        width: auto;
    }

#sendFeedbackEmail label {
    display: block;
}

#sendFeedbackEmail textarea {
    display: block;
    width: 90%;
    height: 300px;
}

.highlight {
    margin: 0 20px 20px 20px;
    padding: 15px;
    background: #B7AfAc;
}

    .highlight p {
        margin: 0px;
    }

.search-term {
    padding-left: 60px;
    background: #000 url( ../images/close.png ) no-repeat 20px center;
    cursor: pointer;
}

#logo {
}

    #logo a {
        display: block;
        padding: 20px 0 20px 35px;
        background: url( ../images/home-icon.png ) 10px center no-repeat;
    }

    #logo img {
        display: block;
        width: 231px;
        height: 20px;
    }

#container {
    margin: 0px auto;
    position: relative;
    width:100%;

    z-index:15;/*above the whiteout divs*/
    overflow-x: hidden;
    overflow-y: auto;
    background-color:white;

    transition-duration:.75s;
    -webkit-transition: all .75s;
    -moz-transition: all .75s;
    -ms-transition: all .75s;
    -o-transition: all .75s;
    transition: all .75s;

    -webkit-transform:translate3d(0,0,0);
    -moz-transform:translate3d(0,0,0);
    -ms-transform:translate3d(0,0,0);
    -o-transform:translate3d(0,0,0);
    transform:translate3d(0,0,0);
}

#container.click
{
    -webkit-transform:translate3d(65%,0,0);
    -moz-transform:translate3d(65%,0,0);
    -ms-transform:translate3d(65%,0,0);
    -o-transform:translate3d(65%,0,0);
    transform:translate3d(65%,0,0);
}


#container-contact {
    margin: 0px auto;
    position: relative;
    height:100%;
    background-color:#ECEFF1;
    overflow-x: hidden;
    overflow-y: hidden;
    background-color:white;
    margin-bottom:16em;
    -webkit-transition: all .75s ease-out;
    -moz-transition: all .75s ease-out;
    -ms-transition: all .75s ease-out;
    -o-transition: all .75s ease-out;
    transition: all .75s ease-out;
    transition: transform 0.75s ease-in-out;
}

#connLib p {
    /*float: left !important;*/
}

#thankYouMsg1 
{
    font-size:2.5em;
    color:#757876;
    text-align:center;
}
#thankYouMsg2
{
    font-size:1.75em;
    color:#444;
    text-align:center;
}
#backToHome 
{
    background-color:#DA291C;
    color:#ffffff;
    padding-top:.5em;
    padding-bottom:.5em;
    margin:0px auto;
    display: inline-block;
    border-radius:.25em;
    margin-top:10em;
    margin-bottom:10em;
}
    #backToHome p 
    {
         text-align:center;
         vertical-align:middle;
         margin:0px;
         margin-left: 1em;
        margin-right: 1em;
    }
.entry-content .glyphicon-ok-circle {
    font-size:4em;
    color:#84bd00;
    width:100%;
    text-align:center;
    padding-top:1em;
}

.on #container, html.on, .on body, .on {
    height: 100%;
}

    .on #show-results {
        display: none;
    }

.entry-content {
    padding: 20px;
}

.tempHide {
    display: none;
}
a.button {
    background: #454545;
    background: -moz-linear-gradient(top, #454545 0%, #000000 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#454545), color-stop(100%,#000000));
    background: -webkit-linear-gradient(top, #454545 0%,#000000 100%);
    background: -o-linear-gradient(top, #454545 0%,#000000 100%);
    background: -ms-linear-gradient(top, #262626 0%,#000000 100%);
    background: linear-gradient(to bottom, #454545 0%,#000000 100%);
    padding: 10px 20px;
    color: #fff;
    display: inline-block;
    text-transform: uppercase;
    text-align: center;
}

/* ==========================================================================
   Front Page
   ========================================================================== */
a.info-button {
    background: url( ../images/info-icon.png ) no-repeat;
    width: 17px;
    height: 18px;
    text-indent: -9999px;
    display: block;
    margin-left: 1em;
}

/* ==========================================================================
   Drill Specification Page
   ========================================================================== */
form#login {
    width: 100%;
}
    #loginButton img {
     margin-left:15px; 
        width:20px;
        height: auto;
    }

    #faqButton img {
     margin-left:15px; 
        width:20px;
        height: auto;
    }

#login input {
    margin-bottom: 10px;
    padding: 2%;
    width: 96%;
}

    #login input[type=submit] {
      
        padding: 10px 20px;
        color: #fff;
        display: inline-block;
        text-transform: uppercase;
        text-align: center;
        float: left;
        width: 45%;
    }

#login-form {
    position: relative;
    width: 100%;
}

    #login-form a.forgot {
        left: 0px;
        bottom: 25px;
        width: 45%;
        display: block;
        color: #fff;
    }

#create-account {
    margin: 2em 0 1em 0;
    text-align: center;
}

    #create-account a.button {
        margin: 0 auto;
        background:#84BD00;
        color:#fff !important;
        border-radius:3px;
    }

#user-agreement {
    padding: 20px;
    background: #d5d5d5;
    color: #000;
}

/* ==========================================================================
   Events
   ========================================================================== */
td.item-title {
    cursor: pointer;
}

#searchForm {
    padding: 1em;
}

    #searchForm input#search {
        border-radius: 20px;
        padding: 2%;
        width: 60%;
        background: #fff url( ../images/search-icon.png ) no-repeat 2% center;
        text-indent: 1.5em;
    }

    #searchForm input#searchMap {
        width: 28%;
        border-radius: 20px;
        padding: 2%;
    }

.filters {
    background: #343434;
    padding: 20px;
    border: 1px solid #1f1f1f;
    box-shadow: 0 0 3px 0px #5a5a5a inset;
}

.filter form {
    margin-bottom: 40px;
}

.filter {
}

form#event-search, form#sendEmail, form#tech-papers-search {
    margin-bottom: 40px;
}

form#sendEmail {
 overflow-y:auto;
 clear:both;  
}

    form#sendEmail input {
        display: block;
        height: 44px;
        width: 100%;
    }

    form#sendEmail label {
        display: block;
        color: #000;
        font-family: 'Source Sans Pro';
        font-weight: 300;
    }

.filter label {
    margin-bottom: 10px;
    display: block;
}

.filter input {
    display: inline;
    width: 60%;
    margin: 0;
}

form#region {
    text-align: center;
}

.js form#region {
    display: none;
}

#region label {
    display: block;
    margin-bottom: 10px;
}

#region input {
    margin: 0px;
}

#region select {
    margin: 0px;
}

.filter input[type=submit] {
    width: auto;
}
.legend{
    position:fixed;
    float:left;
    z-index:1;
    visibility:hidden;
    bottom:0;
    left:0;
    background: rgba(255,255,255,.9);
    border-top: 5px solid #da291c;
}
.legend table {
    margin-bottom: 20px;
}

.legend img {
    max-width:15px;
    height: auto;
}

    .legend table td {
        padding: 5px 10px;
    }

.details-wrap > div {
    display: none;
}

.details-wrap {
    padding: 20px 20px 40px 20px;
    z-index:5;
    margin-top:3em;
    background:#fff;
}

#details a {
    color: #fff;
    text-decoration: underline;
}

button.x-button {
    background: #000 url( ../images/close.png ) center no-repeat;
    width: 35px;
    height: 61px;
    position: absolute;
    top: 0px;
    right: 0px;
    display: block;
    border: none;
    box-shadow: none;
    text-indent: -9999px;
    z-index: 10;
    display: none;
    border: 0;
    filter: none;
    border-radius: 0;
}

.open-options button.x-button {
    background: #75170a url( ../images/close.png ) center no-repeat;
    border-left: 1px solid #5a0b00;
}

.csstransitions button.x-button {
    display: block;
    opacity: 0;
    z-index: -1;
}

button.x-button:hover, button.x-button:active {
    background: #454545 url( ../images/close.png ) center no-repeat;
}

.open-options button.x-button:hover, .open-options button.x-button:active {
    background: #5a0b00 url( ../images/close.png ) center no-repeat;
}
#options ul 
{
    list-style:none;
}

.view-details button.x-button, .open-options button.x-button {
    display: block;
}

.csstransitions.view-details button.x-button, .csstransitions.open-options button.x-button {
    display: block;
    opacity: 1;
    -webkit-transition: opacity 1500ms ease;
    -moz-transition: opacity 1500ms ease;
    -o-transition: opacity 1500ms ease;
    transition: opacity 1500ms ease;
    z-index: 10;
}

html.facility-locator, .facility-locator body, .facility-locator #container, .facility-locator #inner-container {
    height: 100%;
}

.facility-locator #container {
    min-height: 0px;
}

.facility-locator #content {
    height: 100%;
    border: 0;
    width: 100%;
}

.facility-locator.view-details #content {
    height: 0;
}

html.facility-locator.view-details, .facility-locator.view-details body, .facility-locator.view-details #container, .facility-locator.view-details #inner-container, .facility-locator.view-details #content {
    /*height: auto;*/
}

.facility-locator .site-header {
    position: absolute;
    width: 100%;
}

.facility-locator.csstransforms.csstransitions #details {
    top: 0px;
    position: absolute;
    width: 100%;
    z-index:5;
    background:#fff;
    height:95%;
}

.facility-locator #loading {
    width: 300px;
    margin: 0px auto;
    padding-top: 83px;
    text-align: center;
}

.facility-locator #details {
    margin-top: 63px;
}

.info-block p {
    margin: 0px;
}

.info-block h3 {
    text-transform: capitalize;
}

.info-block {
    list-style: none;
    margin: 0px;
    padding: 0px;
}

    .info-block h3.item-title {
        margin: 0px;
        cursor: pointer;
    }

    .info-block .details {
        display: none;
    }

        .info-block .details a {
            text-decoration: underline;
        }

.clicked .info-block .details {
    display: block;
}

.clicked .info-block h3.item-title {
    display: none;
}

table.list {
    width: 100%;
    margin-bottom: 20px;
    
}
 #catTab a {
        color: #75787b !important;
}
    #catTab td {
        vertical-align: middle;
        background-color: #fff;
    }

#catTab .info-block {
 font-size: 16px;   
}
.list input {
    margin: 0px;
}

.list td {
    width: 100%;
}

.list th {
    font-family:'Source Sans Pro' !important;
    font-weight: 300;
    font-size:1.4em !important;
    text-align:left !important;
    text-align: left;
    width: 100%;
}

.list .clicked td.first {
    background: #75170a;
    color: #fff;
}

.list td.first, .list td.second {
    width: auto;
    text-align: center;
    padding: 0px 15px;
}

.list td.second {
    width: 12%;
}

.list td, .list th {
    padding: 15px;
    font-family: 'Source Sans Pro';
}

.list a {
    color: #333;
    display: block;
    text-decoration:underline;
}
.info-block a:hover 
{
    color:#da291c !important;
}

.details {
    display: none;
}

#details .list td, .list th {
 padding: 5px;   
}

#details .results p {
    margin: 0px;
}

#inner-container {
    position: relative;
}

#show-results {
    display: none;
}

/* ==========================================================================
Technical Papers
========================================================================== */

/* ==========================================================================
   Flex Slider
   ========================================================================== */
/* Browser Resets */
.flex-container a:active,
.flexslider a:active,
.flex-container a:focus,
.flexslider a:focus {
    outline: none;
}

.slides,
.flex-control-nav,
.flex-direction-nav {
    margin: 0;
    padding: 0;
    list-style: none;
}

/* FlexSlider Necessary Styles
*********************************/
.flexslider {
    margin: 0;
    padding: 0;
    display: block;
    position: relative;
    zoom: 1;
    width: 100%;
    min-height: 300px;
    margin: 0 auto 40px;
}

    .flexslider .slides > li {
        display: block;
        width: 100%;
        -webkit-backface-visibility: hidden;
    }
    /* Hide the slides before the JS is loaded. Avoids image jumping */
    .flexslider .slides img {
        max-width: 100%;
        margin: 0 auto;
        display: block;
    }

.flex-pauseplay span {
    text-transform: capitalize;
}

/* Clearfix for the .slides element */
.slides:after {
    content: ".";
    display: block;
    clear: both;
    visibility: hidden;
    line-height: 0;
    height: 0;
}

html[xmlns] .slides {
    display: block;
}

* html .slides {
    height: 1%;
}

/* No JavaScript Fallback */
/* If you are not using another script, such as Modernizr, make sure you
 * include js that eliminates this class on page load */
.no-js .slides > li:first-child {
    display: block;
}


/* FlexSlider Default Theme
*********************************/
.flex-viewport {
    max-height: 2000px;
    -webkit-transition: all 1s ease;
    -moz-transition: all 1s ease;
    transition: all 1s ease;
}

.loading .flex-viewport {
    max-height: 300px;
}

.flexslider .slides {
    zoom: 1;
}

.carousel li {
    margin-right: 5px;
}

.flexslider p.caption {
    padding: 10px 0;
    color: #fff;
    text-align: center;
    font-weight: bold;
}

/* Direction Nav */
.flex-direction-nav a {
    margin: 0;
    display: block;
    position: absolute;
    z-index: 1;
    cursor: pointer;
    padding: 5px 15px;
    text-align: center;
    color: #fff;
    font-weight: bold;
    background: #d91f05; /* Old browsers */
    background: -moz-linear-gradient(top, #d91f05 0%, #a82816 100%); /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#d91f05), color-stop(100%,#a82816)); /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top, #d91f05 0%,#a82816 100%); /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top, #d91f05 0%,#a82816 100%); /* Opera 11.10+ */
    background: -ms-linear-gradient(top, #d91f05 0%,#a82816 100%); /* IE10+ */
    background: linear-gradient(to bottom, #d91f05 0%,#a82816 100%); /* W3C */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#d91f05', endColorstr='#a82816',GradientType=0 ); /* IE6-9 */
    border-radius: 3px;
    box-shadow: 0px 0px 3px 0px #f59183 inset;
}

    .flex-direction-nav a.flex-next {
        right: 20px;
        bottom: 0px;
    }

    .flex-direction-nav a.flex-prev {
        left: 20px;
        bottom: 0px;
    }

.flex-direction-nav .flex-disabled {
    opacity: .3 !important;
    filter: alpha(opacity=30);
    cursor: default;
}

/* Control Nav */
.flex-control-nav {
    width: 100%;
    position: absolute;
    bottom: 0px;
    text-align: center;
}

    .flex-control-nav li {
        margin: 0 6px;
        display: inline-block;
        zoom: 1;
        *display: inline;
    }

.flex-control-paging li a {
    width: 11px;
    height: 11px;
    display: block;
    background: #666;
    background: rgba(0,0,0,0.5);
    cursor: pointer;
    text-indent: -9999px;
    -webkit-border-radius: 20px;
    -moz-border-radius: 20px;
    -o-border-radius: 20px;
    border-radius: 20px;
    box-shadow: inset 0 0 3px rgba(0,0,0,0.3);
}

    .flex-control-paging li a:hover {
        background: #333;
        background: rgba(0,0,0,0.7);
    }

    .flex-control-paging li a.flex-active {
        background: #000;
        background: rgba(0,0,0,0.9);
        cursor: default;
    }

.flex-control-thumbs {
    margin: 5px 0 0;
    position: static;
    overflow: hidden;
}

    .flex-control-thumbs li {
        width: 25%;
        float: left;
        margin: 0;
    }

    .flex-control-thumbs img {
        max-width: 100%;
        display: block;
        opacity: .7;
        cursor: pointer;
    }

        .flex-control-thumbs img:hover {
            opacity: 1;
        }

    .flex-control-thumbs .flex-active {
        opacity: 1;
        cursor: default;
    }

.slides a {
    display: block;
    width: 185px;
    height: 185px;
    text-align: center;
    margin: 0 auto;
}

.menu-facility-locator a {
    background: url( ../images/coverflow-locations.png ) center top no-repeat;
}

.menu-catalog a {
    background: url( ../images/coverflow-catalog.png ) center top no-repeat;
}

.menu-drill-string a {
    background: url( ../images/coverflow-drill-string.png ) center top no-repeat;
}

.menu-conn-lib a {
    background: url( ../images/coverflow-conn-library.png ) center top no-repeat;
}

.menu-events a {
    background: url( ../images/coverflow-events.png ) center top no-repeat;
}

.menu-tech-papers a {
    background: url( ../images/coverflow-tech-papers.png ) center top no-repeat;
}

.menu-contact a {
    background: url( ../images/coverflow-contact-us.png ) center top no-repeat;
}

/* ==========================================================================
   Header
   ========================================================================== */
.site-header {
    position: relative;
    cursor: pointer;
    border-bottom: 1px solid #000;
    background: #000;
    z-index: 2;
}

.csstransforms #menu {
    display: block;
    -moz-transform: translatey(-100%);
    -ms-transform: translatey(-100%);
    -o-transform: translatey(-100%);
    -webkit-transform: translatey(-100%);
    transform: translatey(-100%);
    -moz-transition: -moz-transform 500ms ease-in, top 500ms ease-in;
    -o-transition: -o-transform 500ms ease-in, top 500ms ease-in;
    -webkit-transition: -webkit-transform 500ms ease-in, top 500ms ease-in;
    transition: transform 500ms ease-in, top 500ms ease-in;
}

#menu {
    z-index: 3;
    width: 100%;
    position: absolute;
    display: none;
    top: 0px;
    left: 0px;
    background: #a32311;
    box-shadow: 0 6px 10px 0px #000, 0 0 3px 0 #4a0c03 inset;
}

.csstransforms.open-menu #menu {
    padding: 20px 0;
    -moz-transform: translatey(0%);
    -ms-transform: translatey(0%);
    -o-transform: translatey(0%);
    -webkit-transform: translatey(0%);
    transform: translatey(0%);
    -moz-transition: -moz-transform 500ms ease-in, top 500ms ease-in;
    -o-transition: -o-transform 500ms ease-in, top 500ms ease-in;
    -webkit-transition: -webkit-transform 500ms ease-in, top 500ms ease-in;
    transition: transform 500ms ease-in, top 500ms ease-in;
}

.open-menu #menu {
    display: block;
    top: 63px;
    border-top: 1px solid #cd3b27;
}

.open-menu #content {
    z-index: -1;
}

#menu tr.two-col-row td {
    width: 50%;
}

#menu table {
    margin: 0px;
    color: #fff;
    line-height: 1em;
    border: 0px;
    width: 100%;
}

.open-menu #menu table {
}

#menu td {
    width: 30%;
    padding: 8px 5px;
    border: none;
    text-align: center;
}

    #menu td a {
        display: block;
        color: #fff;
        margin-top: 10px;
    }

#menu table img {
    max-width: 100%;
}

html.show-options-alert, .show-options-alert body, .show-options-alert #container {
    height: 100%;
}

.show-options-alert #inner-container {
    display: none;
}

#options-alert {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0px;
    left: 0px;
    z-index: 10;
    display: none;
    background: #000;
}

.show-options-alert #options-alert {
    display: block;
}

#options-alert .content {
    text-align: center;
    background: #000 url( ../images/how-to-use.gif ) center top no-repeat;
    min-height: 350px;
    position: relative;
}

#options-alert button.red-button {
    position: absolute;
    bottom: 0px;
    left: 50%;
    margin-left: -75px;
}

button.red-button {
    display: inline-block;
    width: 150px;
    height: 30px;
    text-align: center;
    color: #fff;
    margin: 0 auto;
    font-weight: bold;
    background: #a32311; /* Old browsers */
    background: -moz-linear-gradient(top, #a32311 0%, #851a0b 100%); /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#a32311), color-stop(100%,#851a0b)); /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top, #a32311 0%,#851a0b 100%); /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top, #a32311 0%,#851a0b 100%); /* Opera 11.10+ */
    background: -ms-linear-gradient(top, #a32311 0%,#851a0b 100%); /* IE10+ */
    background: linear-gradient(to bottom, #a32311 0%,#851a0b 100%); /* W3C */
    border-radius: 3px;
    border: 1px solid #661509;
    box-shadow: 0 0 2px 0px #E8604D;
}

button.red-button:hover {
        background: #A32311;
    }

button.black-button {
    display: block;
    text-align: center;
    color: #fff;
    margin: 0 auto;
    border-radius: 7px;
    border: 1px solid #00a499;
    background-color:#00a499;
}

    button.black-button:hover {
        background: #4e4e4e;
    }


.open-options #options {
    display: block;
    box-shadow: 0 0 20px 0px #000;
    visibility: visible;
}

#options a {
    color: #fff;
}

#options h2 
{
    font-size:2.5em;
    margin-top:.5em;
    margin-left:1em;
    color: #84bd00;
}

#options .content {
    padding: 10px 20px;
}

#options .content button {
    color: #fff;
    display: block;
    width: 100%;
    text-align: left;
    margin-bottom: 20px;
}

#options #optX 
{
    font-size:2em;
    color:#84bd00;
    float:right;
    margin-top:-2.45em;
    margin-right:1em;
}
#topRow 
{
    float:left;
    width:100%;
}
#options .content
{
    float:left;
    width:100%;
}
.results .content 
{
    color:#333;
}
.legend table 
{
    color:#333;
}
#buttomLic 
{
    text-decoration:none;
    color:white;
}
/* ==========================================================================
   Info
   ========================================================================== */
#info {
    padding-bottom: 4em;
}

    #info ul {
        list-style: none;
        margin: 0px;
        padding: 0px;
    }

        #info ul a {
            padding: 15px 25px;
            background: #171717 url( ../images/go-arrow.png ) no-repeat 95% center;
            box-shadow: 0 0 1px #616161;
            display: block;
            margin-bottom: .5em;
            color: #fff;
            text-transform: uppercase;
        }

p.version {
    margin: 0px;
}

#info header {
    padding: 1em;
}

#info h2 {
    margin: 0px;
}

/* Legal */
.legal #content {
}


/* ==========================================================================
   Coverflow
   ========================================================================== */
/* Our wrapper element. Has overflow:hidden and
a hardcoded value of 320 x 416 for iPhones and
iPod touch.
*/
#wrapper {
    width: 100%;
    overflow: hidden;
    margin: 0 auto;
    position: relative;
}

/*
    To activate a 3D space we need a perspective. The value of perspective determines the
    intensity of the 3D effect. Think of it as a distance from the viewer to the object.
    The greater the value, the further the distance, the less intense the visual effect.
*/
.csstransforms3d .container {
    width: 185px;
    height: 240px;
    position: relative;
    margin: 0 auto;
    -webkit-perspective: 1100;
}

/*
    If you notice, the image at the center is at translateZ:200px position which means it is 200px out of 3D space.
    So just to make the plane of the 3D space back to origin I do a translateZ(-200px). Also preserver-3D ensures
    that the child of the element lives in the same 3d co-ordinate space
*/
.csstransforms3d #coverflow {
    width: 100%;
    height: 100%;
    position: absolute;
    -webkit-transform: translateZ( -200px );
    -webkit-transform-style: preserve-3d;
}

    /* Adding CSS3 Transition rule, CSS3 reflections, CSS3 Drop Shadows
to the <div> elements containing the images.
*/
    .csstransforms3d #coverflow div {
        display: block;
        position: absolute;
        width: 185px;
        height: 185px;
        border-radius: 30px;
        -webkit-transition: -webkit-transform 0.7s ease;
        -webkit-box-reflect: below 0px -webkit-gradient(linear, left top, left bottom, from(transparent),color-stop(0.8, transparent), to(white));
        text-align: center;
    }

        .csstransforms3d #coverflow div a {
            display: block;
            width: 185px;
            height: 185px;
            cursor: pointer;
        }

        .csstransforms3d #coverflow div img {
            width: 185px;
            height: 185px;
            -webkit-box-shadow: -1px 1px 8px rgba(0, 0, 0, 0.9);
            border-radius: 40px;
        }

.csstransforms3d .caption {
    padding: 0 1em;
    color: #fff;
    text-align: center;
}

    .csstransforms3d .caption h1 {
        margin-bottom: .5em;
    }

    .csstransforms3d .caption a {
        color: #fff;
    }
/*initial position for the 7 images
This causes the 7 images to start at the rightmost
position of the screen. These are hardcoded values
just for now
*/
.csstransforms3d #coverflow div:nth-child(1) {
    -webkit-transform: translateX(100px) rotateY(-60deg);
}

.csstransforms3d #coverflow div:nth-child(2) {
    -webkit-transform: translateX(150px) rotateY(-60deg);
}

.csstransforms3d #coverflow div:nth-child(3) {
    -webkit-transform: translateX(200px) rotateY(-60deg);
}

.csstransforms3d #coverflow div:nth-child(4) {
    -webkit-transform: translateX(250px) rotateY(-60deg);
}

.csstransforms3d #coverflow div:nth-child(5) {
    -webkit-transform: translateX(300px) rotateY(-60deg);
}

.csstransforms3d #coverflow div:nth-child(6) {
    -webkit-transform: translateX(350px) rotateY(-60deg);
}

.csstransforms3d #coverflow div:nth-child(7) {
    -webkit-transform: translateX(400px) rotateY(-60deg);
}

.csstransforms3d #coverflow div:nth-child(8) {
    -webkit-transform: translateX(450px) rotateY(-60deg);
}

/* ==========================================================================
   Contact
   ========================================================================== */
.contact table {
    width: 100%;
}

    .contact table input, .contact table textarea, .contact table select {
        width: 100%;
        font-size: 20px;
    }

    .contact table textarea {
        height: 100px;
    }

    .contact table td {
        padding: 5px;
        /* border: 1px solid #5d5d5d; */
    }

    .contact table p {
        margin: 0px;
    }

/* ==========================================================================
   Marketing Catalogs
   ========================================================================== */
.catalog ul {
    list-style: none;
    margin: 0px;
    padding: 0px;
}

    .catalog ul a {
        padding: 15px 25px;
        background: #262626 url( ../images/go-arrow.png ) no-repeat 95% center;
        display: block;
        margin-bottom: .5em;
        color: #fff;
        text-transform: uppercase;
    }

/* ==========================================================================
   Google Mpas
   ========================================================================== */

#map_canvas {
    height: 100%;
    width: 100%;
    position: absolute;
    color: #000;
    margin: 0 auto;
    bottom: 0px;
    left: 0px;
}

#map_canvas {
    visibility: hidden;
}

.view-details #map_canvas {
    z-index: -1;
}

.show-map #map_canvas {
    visibility: visible;
}

.pull-out-tab {
    display: block;
    position: absolute;
    bottom: -20px;
    height: 20px;
    width: 100px;
    text-align: center;
    background: #ccc;
    line-height: 5px;
    left: 50%;
    margin-left: -50px;
    background: url( ../images/black-trans-bg.png ) repeat;
    cursor: pointer;
    border-bottom-left-radius: 3px;
    border-bottom-right-radius: 3px;
}

#search-map-input {
    text-align: center;
}

    #search-map-input input[type='text'] {
        width: 65%;
    }

    #search-map-input input[type='submit'] {
        width: 25%;
    }

.options select {
    display: block;
    max-width: 90%;
    margin: 0 auto 10px;
}

.options button {
    width: 90%;
    display: block;
    margin: 0 auto 10px;
}

button.close {
    border: 0px;
    position: absolute;
    top: 32px;
    right: 20px;
    width: 25px;
    height: 25px;
    background: url(../images/close-icon.png) no-repeat;
    text-indent: -9999px;
}

#map-options select{ 
    width: 100%;
    display: block;
    margin-bottom: 1em;
}

ul#map-content {
    list-style: none;
    margin: 0px;
    padding: 0px;
}



.sendingEmail {
    display: none;
    text-align: center;
}

#loading {
    width: 300px;
    margin: 20px auto;
    text-align: center;
}

.loading {
    width: 300px;
    margin: 20px auto;
    text-align: center;
    display: none;
}

    .loading img {
        display: block;
        margin: 0 auto 10px;
    }

    .loading p {
        margin: 0px;
    }

.results table, #sendEmail table {
    width: 100%;
    border-collapse: collapse;
    margin-bottom: 1em;
    text-align: left;
}

.results .content {
    padding: 20px 0;
    margin-bottom: 15px;
}

/* ==========================================================================
   Connection Library
   ========================================================================== */
.connection-library select {
    margin-bottom: 1.5em;
    width: 100%;
}

.connection-library ul {
    list-style: none;
    margin: 0 0 2em 0;
    padding: 0px;
}

    .connection-library ul a {
        padding: 15px 8% 15px 10px;
        background: #171717 url( ../images/go-arrow.png ) no-repeat 97% center;
        display: block;
        margin-bottom: .5em;
        color: #fff;
        text-transform: uppercase;
        box-shadow: 0 0 1px #616161;
    }

#loading-names {
    margin-bottom: 10px;
}

/* ==========================================================================
   App Alert
   ========================================================================== */
/**
 *
 * Main container
 *
 */
#addToHomeScreen {
    position: relative;
    z-index: 9999;
    -webkit-user-select: none;
    user-select: none;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    -webkit-touch-callout: none;
    touch-callout: none;
    width: 240px;
    font-size: 14px;
    padding: 12px 14px;
    text-align: left;
    background-color: rgb(238,238,238);
    border: 1px solid #505050;
    -webkit-border-radius: 8px;
    border-radius: 8px;
    -webkit-background-clip: padding-box;
    background-clip: padding-box;
    color: #333;
    line-height: 130%;
    -webkit-box-shadow: 0 0 4px rgba(0,0,0,0.5);
    box-shadow: 0 0 4px rgba(0,0,0,0.5);
}

    #addToHomeScreen.addToHomeIpad {
        width: 268px;
        font-size: 18px;
        padding: 14px;
    }

    /**
 *
 * The 'wide' class is added when the popup contains the touch icon
 *
 */
    #addToHomeScreen.addToHomeWide {
        width: 296px;
    }

    #addToHomeScreen.addToHomeIpad.addToHomeWide {
        width: 320px;
        font-size: 18px;
        padding: 14px;
    }

    /**
 *
 * The balloon arrow
 *
 */
    #addToHomeScreen .addToHomeArrow {
        position: absolute;
        background-color: #cccccc;
        border-width: 0 1px 1px 0;
        border-style: solid;
        border-color: #505050;
        width: 16px;
        height: 16px;
        -webkit-transform: rotateZ(45deg);
        transform: rotateZ(45deg);
        bottom: -9px;
        left: 50%;
        margin-left: -8px;
        -webkit-box-shadow: inset -1px -1px 0 #a9a9a9;
        -webkit-border-bottom-right-radius: 2px;
    }


    /**
 *
 * The balloon arrow for iPad
 *
 */
    #addToHomeScreen.addToHomeIpad .addToHomeArrow {
        -webkit-transform: rotateZ(-135deg);
        background-image: -webkit-gradient(linear,0 0,100% 100%,color-stop(0,rgba(238,238,238,0)),color-stop(0.4,rgba(238,238,238,0)),color-stop(0.4,#eee));
        -webkit-box-shadow: inset -1px -1px 0 #fff;
        top: -9px;
        bottom: auto;
        left: 50%;
    }


    /**
 *
 * Close button
 *
 */
    #addToHomeScreen .addToHomeClose {
        -webkit-box-sizing: border-box;
        position: absolute;
        right: 4px;
        top: 4px;
        width: 18px;
        height: 18px;
        line-height: 14px;
        text-align: center;
        text-indent: 1px;
        -webkit-border-radius: 9px;
        background: rgba(0,0,0,0.12);
        color: #707070;
        -webkit-box-shadow: 0 1px 0 #fff;
        font-size: 16px;
    }


    /**
 *
 * The '+' icon, displayed only on iOS < 4.2
 *
 */
    #addToHomeScreen .addToHomePlus {
        font-weight: bold;
        font-size: 1.3em;
    }


    /**
 *
 * The 'share' icon, displayed only on iOS >= 4.2
 *
 */
    #addToHomeScreen .addToHomeShare {
        float: none;
        display: inline-block;
        width: 18px;
        height: 15px;
        background-repeat: no-repeat;
        background-image: url(data:image/jpeg;base64,/9j/4AAQSkZJRgABAQAAAQABAAD//gA7Q1JFQVRPUjogZ2QtanBlZyB2MS4wICh1c2luZyBJSkcgSlBFRyB2NjIpLCBxdWFsaXR5ID0gOTAK/9sAQwADAgIDAgIDAwMDBAMDBAUIBQUEBAUKBwcGCAwKDAwLCgsLDQ4SEA0OEQ4LCxAWEBETFBUVFQwPFxgWFBgSFBUU/9sAQwEDBAQFBAUJBQUJFA0LDRQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQU/8AAEQgAIQAnAwEiAAIRAQMRAf/EAB8AAAEFAQEBAQEBAAAAAAAAAAABAgMEBQYHCAkKC//EALUQAAIBAwMCBAMFBQQEAAABfQECAwAEEQUSITFBBhNRYQcicRQygZGhCCNCscEVUtHwJDNicoIJChYXGBkaJSYnKCkqNDU2Nzg5OkNERUZHSElKU1RVVldYWVpjZGVmZ2hpanN0dXZ3eHl6g4SFhoeIiYqSk5SVlpeYmZqio6Slpqeoqaqys7S1tre4ubrCw8TFxsfIycrS09TV1tfY2drh4uPk5ebn6Onq8fLz9PX29/j5+v/EAB8BAAMBAQEBAQEBAQEAAAAAAAABAgMEBQYHCAkKC//EALURAAIBAgQEAwQHBQQEAAECdwABAgMRBAUhMQYSQVEHYXETIjKBCBRCkaGxwQkjM1LwFWJy0QoWJDThJfEXGBkaJicoKSo1Njc4OTpDREVGR0hJSlNUVVZXWFlaY2RlZmdoaWpzdHV2d3h5eoKDhIWGh4iJipKTlJWWl5iZmqKjpKWmp6ipqrKztLW2t7i5usLDxMXGx8jJytLT1NXW19jZ2uLj5OXm5+jp6vLz9PX29/j5+v/aAAwDAQACEQMRAD8A5aVAWJyCNxIOP5cfSqz6pZwN5b3VtG6HJUsqkdOoPNXpbabaMAnn+7z2PY/Wvo/xn8VPHfw7074ZeG/At2dNhv8Awppl0bK0sLeRp7ydnVjmSNjuZlXuASSTyc10ydnoZo+al1K1ufMEd1buzEkhJEPpgYBrd8QeC9d8IwaRLqunPbW+r2kV9YTr80dxC6BwVYDG4BgGU4IPUYIJ+00+GajTob/4y/Eu9vdQnj3Pp66yNJ06IEcqFiaMyEDIL5APUKK7jxrpnw9j+Dsdlry2b+BLKxhFtL55mCQrGFgaGUMWZyu0KysWbPU5OZ5/ILH5vSwSec/OwcdSR6+1FGrT2p1W7Gnyz/YPNb7ObwRmbywSFL4wu4jGcDGc4orURAxAXgnIJBIb2H+Jr6g1LwP4+1i4+FfjXwL4eTxGmneC7KxSdb21Rbe8WOZSSssi7mjMisOCNy4PQivmbzW3EG2J+c5BUDGQPf8AziqU+xgWFooZgWP7sHj65NS1cD2DU/2bPjRrN5Ne6h4Q1C+vp3LzXNxq1jJJITjlmNySTx6133jzwt4vHwO1aX4i6KdCOg2WlaX4asjexTBnV0juJ9sMjBpWRAAW5VS4UAbifmkohLDyEQh3B/dZ5x/9aksJ4YJJAFRCWJyFHv6UWvYaGkETnCyDk4/dsTjmiljvYi7E7SM55UHrmirEVLnrL/10aqg6L9KKKfVB0NO1/wCPmT/ro/8AI0+1/wCPo/j/ACNFFMESW3+uX6D+RooorMpH/9k=);
        background-size: 18px 15px;
        text-indent: -9999em;
        overflow: hidden;
    }


/**
 *
 * The touch icon (if available)
 *
 */
    #addToHomeScreen .addToHomeTouchIcon {
        display: block;
        float: left;
        -webkit-border-radius: 6px;
        border-radius: 6px;
        -webkit-box-shadow: 0 1px 3px rgba(0,0,0,0.5), inset 0 0 2px rgba(255,255,255,0.9);
        box-shadow: 0 1px 3px rgba(0,0,0,0.5), inset 0 0 2px rgba(255,255,255,0.9);
        background-repeat: no-repeat;
        width: 57px;
        height: 57px;
        -webkit-background-size: 57px 57px;
        background-size: 57px 57px;
        margin: 0 12px 0 0;
        border: 1px solid #333;
        -webkit-background-clip: padding-box;
        background-clip: padding-box;
    }


/**
 *
 * The 'share' icon for retina display
 *
 */
@media all and (-webkit-min-device-pixel-ratio: 2) {
    #addToHomeScreen .addToHomeShare {
        background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACQAAAAeCAQAAADu6HTYAAADPElEQVR4Xq3TX2gcRRzA8e/M7mVv2+TSNpc/TZtrY6jUGqgaSAmEChKLrYK0YH0RFC2CSCkEfCghiKU04J8qNigq6os+iQV98MHWFwVBrQQRWs21lBw5cw3NNb1/udu72RGG5Y77IzXW77D7sAwf5scyYoL6BGXSDKFZwaGpLvIUaeoCkvX1MmsM0Ny6oRSQYOLuIS+YZOpfQdqslpUxcZrzTVAz4qPwW2O3CeIwC/RSzeY6Ow1QhUrkr+YOWfEKDkEP8Rij7CHKJmrFSDHBdwGEE5wiGChPN+PnT8VdRtEIl1d4gRj/1EVe5ZSBKGh8iqQpo/Fo5+3C/gz0MYg4zgwbqday1/Q4B8BGQ45d/Hi54lakCrU5obOcidJpu1+Lg9whjabyaOYLnrIBFFaRD+xe2ybMDWY66GmP/WA9cGfGp0CWhy0wkMN8inepFiH2rV1j0NQSNQbFLRQnS8/8YSDBBpadfv4CYDub2fmeHDNAsL1MBWUel0iA+Xik6eHcyvD3vAMSU1TGuA/YRS+dD7ovCQN43GKRFCU20Kd3V/avDVVyAZ5niTEuLA5/zBGWg9EEEhfJKN200Tat8CmRAQb9+wv7soPlHt2tQorsz1uPbr0HTY4sJwrH47zJZwABBAKLMBoQXepwgTwdHCo+fXMkQ4lrxEmQ5AaXipPqDY9V2vn09tgvTPI71EEGYxM+/uMJLJ4svpgaWGKOi/xKgmqLSUGSUd5f2vIVJ/CgBaTIUsZ7ZBsn0+NzfMOXLFCXQyTcybN6ep5ZZgUOHn7jpfUpsZshdugPGf+E5zjbyHTSRyQ8xfRPPM/s63RHeuknSoT22mjmmnAOIMkUZ6D1xSfPPAfd1WFKM3sO2CMaHx8M1NjnXKHaAGGkOW0C02WeYHUz4qMtx+w5gUDS8NckYe5lHsMYwCZEPyEEmjLDZFmAS7CDviMdxyTkMNVBKEmYLvbiQQBIBBbCQG04bGQvFWz6CfsCQLWCigILFwcfkGYBiOpbYuOizTAyYyDdCtrGaRG1LCkIgMYEFhI0WqQZoSlbGRyHKe4qOx7iv2bVQW9dp4dlM/x6kmwnWQcd/Q3FCqwTEiT5s+6D5v/pb0SSHyg7uhMWAAAAAElFTkSuQmCC);
    }
}


/* ==========================================================================
   Helper classes
   ========================================================================== */

/*
 * Image replacement
 */

.ir {
    background-color: transparent;
    border: 0;
    overflow: hidden;
    /* IE 6/7 fallback */
    *text-indent: -9999px;
}

    .ir:before {
        content: "";
        display: block;
        width: 0;
        height: 100%;
    }

/*
 * Hide from both screenreaders and browsers: h5bp.com/u
 */

.hidden {
    display: none !important;
    visibility: hidden;
}

/*
 * Hide only visually, but have it available for screenreaders: h5bp.com/v
 */

.visuallyhidden {
    border: 0;
    clip: rect(0 0 0 0);
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute;
    width: 1px;
}

    /*
 * Extends the .visuallyhidden class to allow the element to be focusable
 * when navigated to via the keyboard: h5bp.com/p
 */

    .visuallyhidden.focusable:active,
    .visuallyhidden.focusable:focus {
        clip: auto;
        height: auto;
        margin: 0;
        overflow: visible;
        position: static;
        width: auto;
    }

/*
 * Hide visually and from screenreaders, but maintain layout
 */

.invisible {
    visibility: hidden;
}

/*
 * Clearfix: contain floats
 *
 * For modern browsers
 * 1. The space content is one way to avoid an Opera bug when the
 *    `contenteditable` attribute is included anywhere else in the document.
 *    Otherwise it causes space to appear at the top and bottom of elements
 *    that receive the `clearfix` class.
 * 2. The use of `table` rather than `block` is only necessary if using
 *    `:before` to contain the top-margins of child elements.
 */

.clearfix:before,
.clearfix:after {
    content: " "; /* 1 */
    display: table; /* 2 */
}

.clearfix:after {
    clear: both;
}

/*
 * For IE 6/7 only
 * Include this rule to trigger hasLayout and contain floats.
 */

.clearfix {
    *zoom: 1;
}

/* ==========================================================================
   EXAMPLE Media Queries for Responsive Design.
   Theses examples override the primary ('mobile first') styles.
   Modify as content requires.
   ========================================================================== */

@media only screen and ( min-width: 500px ) {
    .filter input, .filter select {
        width: auto;
        display: inline;
        margin: 0px;
    }
    
    
    

        .filter input[type=submit] {
            width: auto;
            display: inline;
            margin: 0px;
        }

    .filter label {
        display: inline;
        margin-right: 10px;
    }
}

@media only screen and (max-height: 700px ) {
 #hiddenHamburger {
     overflow-y: scroll;
     position: absolute;
    }
    #hamHome img
    {
        width: 30px;
    }

     #hamConn img
    {
        width: 30px;
    }
    #hamCat img
    {
       width: 30px;
    }
    #hamCont img
    {
        width: 30px;
    }
    #hamLoc img
    {
        width: 30px;
    }
    #hamConfig img
    {
        width: 30px;
    }
#hamOther img
    {
        width: 30px;
    }
    
}

@media only screen and (max-width: 500px ) {
        #hamOther .leavePage img {
        width:15px;
    }
    #loginButton img {
        width:15px;
    }
    #faqButton img {
        width:15px;
    }
     #legal img {
        width:15px;
    }
    #aboutGP img {
        width:15px;
    }
            
        #hamHome 
    {
        padding: 1em;
    }

     #hamConn
    {
        padding: 1em;
    }
    #hamCat
    {
        padding: 1em;
    }
    #hamCont
    {
        padding: 1em;
    }
    #hamLoc
    {
        padding: 1em;
    }
    #hamConfig
    {
        padding: 1em;
    }
#hamOther
    {
        padding: 1em;
    }
#hamHome img
    {
        width: 25px;
    }

     #hamConn img
    {
        width: 25px;
    }
    #hamCat img
    {
       width: 25px;
    }
    #hamCont img
    {
        width: 25px;
    }
    #hamLoc img
    {
        width: 25px;
    }
    #hamConfig img
    {
        width: 25px;
    }
#hamOther img
    {
        width: 25px;
    }
    
    #hiddenHamburger div {
     margin-bottom: 0px;   
    }
    
    #hiddenHamburger p {
     font-size: 2em;  
        max-width: 150px;
        word-wrap: normal;
        text-align: middle;
    }
    
    #hiddenHamburger .glyphicon-menu-right {
     padding-top: .5em;   
    }
    
    #footer p {
     font-size: 1.4em;   
    }
    
    #footer img {
     width:25px;
        height: auto;
    }
    
    .connRow {
     padding: 1em;   
    }
    
    .catRow {
     padding: 1em;   
    }
    
    .configRow {
     padding: 1em;   
    }
    
    #footer .glyphicon-menu-right {
        padding-top:1.2em;
        font-size: 1.2em;
    }
    
    #hamburgerButton {
     margin-top: 0.5em;
       
    }
    
     #hamburgerButton img {
         width: 25px;
        height: auto;
        }
   
    
    .GP2GOLogo {
     padding-top: 0.1em;   
    }
        .GP2GOLogo p {
     padding-top: 0.3em;   
            font-size: 1.4em;
    }
    #contactButton {
     margin-top: 0.5em;
    }
    
    #contactButton object {
     width: 25px;
     height: auto;
     float:right;
     margin-right: 0px;
    }
    
    #bodyMainStyle {
     margin-top:40px;
     min-height:300px;
    }
}
/* =iPad Specific
----------------------------------------------- */
@media only screen and (min-width: 768px ) and (max-width: 1024px ) {
}

@media only screen and (min-width: 35em) {
    /* Style adjustments for viewports that meet the condition */
}

@media only screen and (-webkit-min-device-pixel-ratio: 1.5), only screen and (min-resolution: 144dpi) {
    /* Style adjustments for high resolution devices */
}

@media only screen and (min-width : 321px) and ( max-width: 480px ) and (orientation:landscape) {
    .home #content {
        padding: 5px 0 60px 0;
    }

    .csstransforms3d #coverflow div {
        display: block;
        position: absolute;
        width: 165px;
        height: 165px;
        border-radius: 30px;
        -webkit-transition: -webkit-transform 0.7s ease;
        -webkit-box-reflect: below 0px -webkit-gradient(linear, left top, left bottom, from(transparent),color-stop(0.8, transparent), to(white));
        text-align: center;
    }

    .csstransforms3d .container {
        width: 165px;
        height: 200px;
    }

    .csstransforms3d #coverflow div a {
        display: block;
        width: 165px;
        height: 165px;
        cursor: pointer;
        background-size: 165px 165px;
    }
}

.oldie #wrapper {
    width: 100%;
}

.oldie .flexslider {
    height: 550px;
}

.oldie .slides a, #coverflow a, .oldie .csstransforms3d #coverflow div a {
    width: 403px;
    height: 403px;
    display: block;
    cursor: pointer;
}

.oldie .flexslider p.caption {
    padding: 20px 0;
    font-size: 18px;
}

.oldie .menu-facility-locator a {
    background: url( ../images/menu/large/coverflow-locations.png ) center top no-repeat;
}

.oldie .menu-catalog a {
    background: url( ../images/menu/large/coverflow-catalog.png ) center top no-repeat;
}

.oldie .menu-drill-string a {
    background: url( ../images/menu/large/coverflow-drill-string.png ) center top no-repeat;
}

.oldie .menu-conn-lib a {
    background: url( ../images/menu/large/coverflow-conn-library.png ) center top no-repeat;
}

.oldie .menu-events a {
    background: url( ../images/menu/large/coverflow-events.png ) center top no-repeat;
}

.oldie .menu-tech-papers a {
    background: url( ../images/menu/large/coverflow-tech-papers.png ) center top no-repeat;
}

.oldie .menu-contact a {
    background: url( ../images/menu/large/coverflow-contact-us.png ) center top no-repeat;
}

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

    #wrapper {
        width: 100%;
    }

    .flexslider {
        min-height: 550px;
    }

    .slides a, #coverflow a, .csstransforms3d #coverflow div a {
        width: 403px;
        height: 403px;
        display: block;
        cursor: pointer;
    }

    .flexslider p.caption {
        padding: 20px 0;
        font-size: 18px;
    }

    .menu-facility-locator a {
        background: url( ../images/menu/large/coverflow-locations.png ) center top no-repeat;
    }

    .menu-catalog a {
        background: url( ../images/menu/large/coverflow-catalog.png ) center top no-repeat;
    }

    .menu-drill-string a {
        background: url( ../images/menu/large/coverflow-drill-string.png ) center top no-repeat;
    }

    .menu-conn-lib a {
        background: url( ../images/menu/large/coverflow-conn-library.png ) center top no-repeat;
    }

    .menu-events a {
        background: url( ../images/menu/large/coverflow-events.png ) center top no-repeat;
    }

    .menu-tech-papers a {
        background: url( ../images/menu/large/coverflow-tech-papers.png ) center top no-repeat;
    }

    .menu-contact a {
        background: url( ../images/menu/large/coverflow-contact-us.png ) center top no-repeat;
    }


    /*
        To activate a 3D space we need a perspective. The value of perspective determines the
        intensity of the 3D effect. Think of it as a distance from the viewer to the object.
        The greater the value, the further the distance, the less intense the visual effect.
    */
    .csstransforms3d .container {
        width: 403px;
        height: 443px;
        position: relative;
        margin: 0 auto;
        -webkit-perspective: 1100;
    }

    /*
        If you notice, the image at the center is at translateZ:200px position which means it is 200px out of 3D space.
        So just to make the plane of the 3D space back to origin I do a translateZ(-200px). Also preserver-3D ensures
        that the child of the element lives in the same 3d co-ordinate space
    */
    .csstransforms3d #coverflow {
        width: 100%;
        height: 100%;
        position: absolute;
        -webkit-transform: translateZ( -403px );
        -webkit-transform-style: preserve-3d;
    }

        /* Adding CSS3 Transition rule, CSS3 reflections, CSS3 Drop Shadows
    to the <div> elements containing the images.
    */
        .csstransforms3d #coverflow div {
            display: block;
            position: absolute;
            width: 403px;
            height: 403px;
            border-radius: 30px;
            -webkit-transition: -webkit-transform 0.6s ease;
            -webkit-box-reflect: below 0px -webkit-gradient(linear, left top, left bottom, from(transparent),color-stop(0.8, transparent), to(white));
            text-align: center;
        }

    .csstransforms3d .caption {
        color: #fff;
        text-align: center;
        font-size: 22px;
        padding: 0px;
        margin-bottom: 30px;
    }

        .csstransforms3d .caption h1 {
            margin-bottom: .5em;
        }

        .csstransforms3d .caption a {
            color: #fff;
        }
    /*initial position for the 7 images
    This causes the 7 images to start at the rightmost
    position of the screen. These are hardcoded values
    just for now
    */
    .csstransforms3d #coverflow div:nth-child(1) {
        -webkit-transform: translateX(100px) rotateY(-60deg);
    }

    .csstransforms3d #coverflow div:nth-child(2) {
        -webkit-transform: translateX(150px) rotateY(-60deg);
    }

    .csstransforms3d #coverflow div:nth-child(3) {
        -webkit-transform: translateX(200px) rotateY(-60deg);
    }

    .csstransforms3d #coverflow div:nth-child(4) {
        -webkit-transform: translateX(250px) rotateY(-60deg);
    }

    .csstransforms3d #coverflow div:nth-child(5) {
        -webkit-transform: translateX(300px) rotateY(-60deg);
    }

    .csstransforms3d #coverflow div:nth-child(6) {
        -webkit-transform: translateX(350px) rotateY(-60deg);
    }

    .csstransforms3d #coverflow div:nth-child(7) {
        -webkit-transform: translateX(400px) rotateY(-60deg);
    }

    .csstransforms3d #coverflow div:nth-child(8) {
        -webkit-transform: translateX(500px) rotateY(-60deg);
    }
}

/* ==========================================================================
   Print styles.
   Inlined to avoid required HTTP connection: h5bp.com/r
   ========================================================================== */

@media print {
    * {
        background: transparent !important;
        color: #000 !important; /* Black prints faster: h5bp.com/s */
        box-shadow: none !important;
        text-shadow: none !important;
    }

    a, a:visited {
        text-decoration: underline;
    }

        a[href]:after {
            content: " (" attr(href) ")";
        }

    abbr[title]:after {
        content: " (" attr(title) ")";
    }

    /*
     * Don't show links for images, or javascript/internal links
     */

    .ir a:after, a[href^="javascript:"]:after, a[href^="#"]:after {
        content: "";
    }

    pre, blockquote {
        border: 1px solid #999;
        page-break-inside: avoid;
    }

    thead {
        display: table-header-group; /* h5bp.com/t */
    }

    tr, img {
        page-break-inside: avoid;
    }

    img {
        max-width: 100% !important;
    }

    @page {
        margin: 0.5cm;
    }

    p, h2, h3 {
        orphans: 3;
        widows: 3;
    }

    h2, h3 {
        page-break-after: avoid;
    }
}

@media(max-width:350px) {
    #filterClear 
    {
        width: 90%;
        margin-top: .75em;
        margin-left:5%;
        float:left;
    }

    #filterSub 
    {
        width:90%;
        margin-left:5%;
    }
}