/*  Revised 01.20.2016 Devi 
    ______ ______________  ___ _____ 
    |  ___|  _  | ___ \  \/  |/  ___|
    | |_  | | | | |_/ / .  . |\ `--. 
    |  _| | | | |    /| |\/| | `--. \
    | |   \ \_/ / |\ \| |  | |/\__/ /
    \_|    \___/\_| \_\_|  |_/\____/ 

    Table of Content
    ----------------------------
    # General/Default fields 
    # Layout - Stacked 
    # Layout - Aligned 
    # Layout - Grouped 
    # Buttons & Faux CSS Buttons
    # Search 

*/

/*  ----------------------------------------------
    FORMS - General/Default
    ---------------------------------------------- */

input[type="text"],
input[type="password"],
input[type="email"],
input[type="url"],
input[type="date"],
input[type="month"],
input[type="time"],
input[type="datetime"],
input[type="datetime-local"],
input[type="week"],
input[type="number"],
input[type="search"],
input[type="tel"],
input[type="color"],
select,
textarea {
    padding: 0.75em;
    margin:  0.25em 0;
    width: 98%; 
    font-size: 1em;
    transition: border-color 0.6s ease 0s;
    display: inline-block;
    border: 1px solid #ccc;
    /* box-shadow: inset 0 1px 3px #ddd; */
    border-radius: 6px;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}

/*
Need to separate out the :not() selector from the rest of the CSS 2.1 selectors
since IE8 won't execute CSS that contains a CSS3 selector.
*/
input:not([type]) {
    padding: 0.5em 0.6em;
    display: inline-block;
    border: 1px solid #ccc;
    /*box-shadow: inset 0 1px 3px #ddd;*/
    border-radius: 4px;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}


/* Chrome (as of v.32/34 on OS X) needs additional room for color to display. */
/* May be able to remove this tweak as color inputs become more standardized across browsers. */
input[type="color"] {
    padding: 0.2em 0.5em;
}


input[type="text"]:focus,
input[type="password"]:focus,
input[type="email"]:focus,
input[type="url"]:focus,
input[type="date"]:focus,
input[type="month"]:focus,
input[type="time"]:focus,
input[type="datetime"]:focus,
input[type="datetime-local"]:focus,
input[type="week"]:focus,
input[type="number"]:focus,
input[type="search"]:focus,
input[type="tel"]:focus,
input[type="color"]:focus,
select:focus,
textarea:focus,
input[type="text"]:hover,
input[type="password"]:hover,
input[type="email"]:hover,
input[type="url"]:hover,
input[type="date"]:hover,
input[type="month"]:hover,
input[type="time"]:hover,
input[type="datetime"]:hover,
input[type="datetime-local"]:hover,
input[type="week"]:hover,
input[type="number"]:hover,
input[type="search"]:hover,
input[type="tel"]:hover,
input[type="color"]:hover,
select:hover,
textarea:hover {
    outline: 0;
    outline: thin dotted \9; /* IE6-9 */
    border-color: #60B6CF;
    color: #363636;
}


/*
Need to separate out the :not() selector from the rest of the CSS 2.1 selectors
since IE8 won't execute CSS that contains a CSS3 selector.
*/
input:not([type]):focus {
    outline: 0;
    outline: thin dotted \9; /* IE6-9 */
    border-color: #129FEA;
}

input[type="file"]:focus,
input[type="radio"]:focus,
input[type="checkbox"]:focus {
    outline: thin dotted #333;
    outline: 1px auto #129FEA;
}
.pure-checkbox,
.pure-radio {
    margin: 0.5em 0;
    display: block;
}

input[type="text"][disabled],
input[type="password"][disabled],
input[type="email"][disabled],
input[type="url"][disabled],
input[type="date"][disabled],
input[type="month"][disabled],
input[type="time"][disabled],
input[type="datetime"][disabled],
input[type="datetime-local"][disabled],
input[type="week"][disabled],
input[type="number"][disabled],
input[type="search"][disabled],
input[type="tel"][disabled],
input[type="color"][disabled],
select[disabled],
textarea[disabled] {
    cursor: not-allowed;
    background-color: #eaeded;
    color: #cad2d3;
}

/*
Need to separate out the :not() selector from the rest of the CSS 2.1 selectors
since IE8 won't execute CSS that contains a CSS3 selector.
*/
input:not([type])[disabled] {
    cursor: not-allowed;
    background-color: #eaeded;
    color: #cad2d3;
}
input[readonly],
select[readonly],
textarea[readonly] {
    background: #eee; /* menu hover bg color */
    color: #777; /* menu text color */
    border-color: #ccc;
}

input:focus:invalid,
textarea:focus:invalid,
select:focus:invalid {
    color: #b94a48;
    border-color: #ee5f5b;
}
input:focus:invalid:focus,
textarea:focus:invalid:focus,
select:focus:invalid:focus {
    border-color: #e9322d;
}
input[type="file"]:focus:invalid:focus,
input[type="radio"]:focus:invalid:focus,
input[type="checkbox"]:focus:invalid:focus {
    outline-color: #e9322d;
}
select {
    border: 1px solid #ccc;
    background-color: white;
}
select[multiple] {
    height: auto;
}
label {
    margin: 0.5em 0 0.2em;
}
fieldset {
    margin: 0;
    padding: 0.35em 0 0.75em;
    border: 0;
}
legend {
    display: block;
    width: 100%;
    padding: 0.3em 0;
    margin-bottom: 0.3em;
    color: #333;
    border-bottom: 1px solid #e5e5e5;
}


/*  ----------------------------------------------
    FORMS - Stacked Layout 
    ---------------------------------------------- */
.pure-form-stacked input[type="text"],
.pure-form-stacked input[type="password"],
.pure-form-stacked input[type="email"],
.pure-form-stacked input[type="url"],
.pure-form-stacked input[type="date"],
.pure-form-stacked input[type="month"],
.pure-form-stacked input[type="time"],
.pure-form-stacked input[type="datetime"],
.pure-form-stacked input[type="datetime-local"],
.pure-form-stacked input[type="week"],
.pure-form-stacked input[type="number"],
.pure-form-stacked input[type="search"],
.pure-form-stacked input[type="tel"],
.pure-form-stacked input[type="color"],
.pure-form-stacked select,
.pure-form-stacked label,
.pure-form-stacked textarea {
    display: block;
    margin: 0.25em 0;
}

/*
Need to separate out the :not() selector from the rest of the CSS 2.1 selectors
since IE8 won't execute CSS that contains a CSS3 selector.
*/
.pure-form-stacked input:not([type]) {
    display: block;
    margin: 0.25em 0;
}

/*  ----------------------------------------------
    FORMS - Aligned Layout 
    ---------------------------------------------- */
.pure-form-aligned input,
.pure-form-aligned textarea,
.pure-form-aligned select,
/* NOTE: pure-help-inline is deprecated. Use .pure-form-message-inline instead. */
.pure-form-aligned .pure-help-inline,
.pure-form-message-inline {
    display: inline-block;
    *display: inline;
    *zoom: 1;
    vertical-align: middle;
}
.pure-form-aligned textarea {
    vertical-align: top;
}

/* Aligned Forms */
.pure-form-aligned .pure-control-group {
    margin-bottom: 0.5em;
}
.pure-form-aligned .pure-control-group label {
    text-align: right;
    display: inline-block;
    vertical-align: middle;
    width: 10em;
    margin: 0 1em 0 0;
}
.pure-form-aligned .pure-controls {
    margin: 1.5em 0 0 10em;
}

/* Rounded Inputs */
input.pure-input-rounded,
.pure-input-rounded {
    border-radius: 2em;
    padding: 0.5em 1em;
}


/*  ----------------------------------------------
    FORMS - Grouped
    ---------------------------------------------- */
.pure-group fieldset {
    margin-bottom: 10px;
}
.pure-group input {
    display: block;
    padding: 10px;
    margin: 0;
    border-radius: 0;
    position: relative;
    top: -1px;
}
.pure-group input:focus {
    z-index: 2;
}
.pure-group input:first-child {
    top: 1px;
    border-radius: 4px 4px 0 0;
}
.pure-group input:last-child {
    top: -2px;
    border-radius: 0 0 4px 4px;
}
.pure-group button {
    margin: 0.35em 0;
}

.pure-input-1 {
    width: 100%;
}
.pure-input-2-3 {
    width: 66%;
}
.pure-input-1-2 {
    width: 50%;
}
.pure-input-1-3 {
    width: 33%;
}
.pure-input-1-4 {
    width: 25%;
}

/* Inline help for forms */
/* NOTE: pure-help-inline is deprecated. Use .pure-form-message-inline instead. */
.pure-help-inline,
.pure-form-message-inline {
    display: inline-block;
    padding-left: 0.3em;
    color: #666;
    vertical-align: middle;
    font-size: 0.875em;
}

/* Block help for forms */
.pure-form-message {
    display: block;
    color: #666;
    font-size: 0.875em;
}

@media only screen and (max-width : 480px) {
    button[type="submit"] {
        margin: 0.7em 0 0;
    }

    input:not([type]),
    input[type="text"],
    input[type="password"],
    input[type="email"],
    input[type="url"],
    input[type="date"],
    input[type="month"],
    input[type="time"],
    input[type="datetime"],
    input[type="datetime-local"],
    input[type="week"],
    input[type="number"],
    input[type="search"],
    input[type="tel"],
    input[type="color"],
    label {
        margin-bottom: 0.3em;
        display: block;
    }

    .pure-group input:not([type]),
    .pure-group input[type="text"],
    .pure-group input[type="password"],
    .pure-group input[type="email"],
    .pure-group input[type="url"],
    .pure-group input[type="date"],
    .pure-group input[type="month"],
    .pure-group input[type="time"],
    .pure-group input[type="datetime"],
    .pure-group input[type="datetime-local"],
    .pure-group input[type="week"],
    .pure-group input[type="number"],
    .pure-group input[type="search"],
    .pure-group input[type="tel"],
    .pure-group input[type="color"] {
        margin-bottom: 0;
    }

    .pure-form-aligned .pure-control-group label {
        margin-bottom: 0.3em;
        text-align: left;
        display: block;
        width: 100%;
    }

    .pure-form-aligned .pure-controls {
        margin: 1.5em 0 0 0;
    }

    /* NOTE: pure-help-inline is deprecated. Use .pure-form-message-inline instead. */
    .pure-help-inline,
    .pure-form-message-inline,
    .pure-form-message {
        display: block;
        font-size: 0.75em;
        /* Increased bottom padding to make it group with its related input element. */
        padding: 0.2em 0 0.8em;
    }
}

/*  ----------------------------------------------
    FORMS - Buttons & Faux CSS Buttons
    ---------------------------------------------- */
input[type=submit], 
input[type=button], 
.button {
    font-family: 'Open Sans', Arial, sans-serif;
    font-size: 1em;
    font-weight: bold;
    line-height: 1.4;
    text-transform: uppercase;
    text-align: center;
    text-decoration: none;
    text-rendering: optimizelegibility;
    behavior: url(/docs/default-source/css/PIE.htc);
    -webkit-font-smoothing: antialiased;
    padding: 0.3em 1.5em;
    margin: 1em 0;
    position: relative;
    display: inline-block;    
    border: 0;
    border-radius: 6px;
    -moz-border-radius: 6px;
    -webkit-border-radius: 6px;
    outline-color: #FFFFFF;
    outline-style: none;
    outline-width: 0px;
    /*-ms-filter: "progid:DXImageTransform.Microsoft.Shadow(Strength=4, Direction=135, Color='#888888')";*/
    box-shadow: 0px 1px 3px #888888;
    -moz-box-shadow: 0px 1px 3px #888888;
    -webkit-box-shadow: 0px 1px 3px #888888;
}

input[type=button],
.button {
    color: #008AB0;
    background-color: #FFF;  
    border: #FFF rgba(0, 0, 0, 0.247) solid 1px;
}

    input[type=button]:hover, 
    .button:hover {
        text-shadow: rgba(0, 0, 0, 0.1) 0px -1px 1px;
        text-decoration: none;
        behavior: url(/docs/default-source/css/PIE.htc);
    }

/* Blue Button & Default Submit Button */
input[type=submit],  
input[type=button].blue, 
.button.blue {
    background-color: #003876 ;
    color: #FFFFFF ;
}

    .button.blue a {
        color: #FFFFFF;
    }

    input[type=submit]:hover,  
    input[type=button].blue:hover,
    .button.blue:hover {
        background-color: #284A99;
    }

/* Teal Button */
input[type=button].teal, 
.button.teal {
    background-color: #008AAE;
    color: #FFFFFF;
}

    .button.teal a {
        color: #FFFFFF;
    }

    input[type=button].teal:hover, 
    .button.teal:hover {
        color: #ffffff;
        background-color: #60B6CF;
    }

/* Green Button */
input[type=button].green,
.button.green {
    background-color: #7bb836;
    color: #ffffff;
}

    .button.green a {
        color: #FFFFFF;
    }

    input[type=button].green:hover,
    .button.green:hover {
        background-color: #7ECF30;
        text-decoration: none;
        color: #ffffff;
    }

/* Orange Button */
input[type=button].orange,
.button.orange {
    background-color: #FE9900;
    color: #ffffff;
}

    .button.orange a {
        color: #FFFFFF;
    }

    input[type=button].orange:hover,
    .button.orange:hover {
        background-color: #FFA831;
        text-decoration: none;
        color: #FFFFFF;
    }

/* Grey Button */
input[type=button].gray,
.button.gray, 
input[type=button].grey,
.button.grey {
    background-color: #dedede;
    color: #000000;
}

    .button.grey a,
    .button.gray a {
        color: #FFFFFF;
    }

    input[type=button].gray:hover,
    .button.gray:hover,
    input[type=button].grey:hover,
    .button.grey:hover {
        text-decoration: none;
        background-color: #C4C4C4;
    }

/* White Button */
input[type=button].white,
.button.white {
    background-color: #FFFFFF;
    color: #000000;
}

    input[type=button].white:hover, 
    .button.white:hover {
        text-decoration: none;
        color: #FFFFFF;
        background-color: #003876;
    }

/* Small Button */
input[type=button].small, 
.button.small {
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
    font-size: 11px;
    line-height: 10px;
    padding-bottom: 0px;
    padding-left: 6px;
    padding-right: 6px;
    padding-top: 5px;
}

/* Login & Search buttons on smartphone view */
.button.mobileloginsearch {
   /* width: 45%;
    height: 1.0em;
    padding: 1.5%;
    font-size: 75%;
    margin: 0;*/
    width: 48%;
    height: 1.0em;
    padding: 2% 0 4% 0;
    font-size: 75%;
    margin: 0 0 1em 0;
}

/* Add right margin to button if aligning more than one in same row */
input[type=submit].marginRight, 
input[type=button].marginRight,
.button.marginRight {
    margin-right: 2%;
}

/* Buy Now Buttons on Featured CE */ 
.p_type {
	font-size:10px;
	font-weight:bold;
	text-transform: uppercase;
}

.buy_button, 
.buy_button:visited, 
.buy_button:active {
	background-color: #008AB0;
	color: #ffffff;
	-moz-box-shadow: 0px 1px 3px #888888;
	-webkit-box-shadow: 0px 1px 3px #888888;
	box-shadow: 0px 1px 3px #888888;
	/*-ms-filter: "progid:DXImageTransform.Microsoft.Shadow(Strength=4, Direction=135, Color='#888888')";*/
	-webkit-font-smoothing: antialiased;
	background-attachment: scroll;
	background-clip: border-box;
	background-origin: padding-box;
	border-bottom-color: rgba(0, 0, 0, 0.246094);
	border-bottom-style: solid;
	border-bottom-width: 1px;
	border-left-color: #FFFFFF;
	border-left-style: none;
	border-left-width: 0px;
	border-right-color: #FFFFFF;
	border-right-style: none;
	border-right-width: 0px;
	border-top-color: #FFFFFF;
	border-top-style: none;
	border-top-width: 0px;
	-moz-border-radius: 6px;
	-webkit-border-radius: 6px;
	border-radius: 6px;
	cursor: pointer;
	display: inline-block;
	font-family: Arial, Helvetica, 'Helvetica Neue', Verdana, sans-serif;
	font-size: 9px;
	font-style: normal;
	text-transform: uppercase;
	font-weight: bold;
	height: 10px;
	line-height: 10px;
	margin-bottom: 0px;
	margin-left: 0px;
	margin-right: 0px;
	margin-top: 0px;
	outline-color: #FFFFFF;
	outline-style: none;
	outline-width: 0px;
	padding-bottom: 8px;
	padding-left: 12px;
	padding-right: 12px;
	padding-top: 8px;
	position: relative;
	text-align: left;
	text-decoration: none;
	text-rendering: optimizelegibility;
	text-shadow: rgba(0, 0, 0, 0.246094) 0px -1px 1px;
	text-align: center;
	behavior: url(/docs/default-source/css/PIE.htc);
}

    .buy_button:hover {
        background-color: #05c6fb;
        color: #ffffff;
        -moz-box-shadow: 0px 1px 1px #aaaaaa;
        -webkit-box-shadow: 0px 1px 1px #aaaaaa;
        box-shadow: 0px 1px 1px #aaaaaa;
        /*-ms-filter: "progid:DXImageTransform.Microsoft.Shadow(Strength=4, Direction=135, Color='#aaaaaa')";*/
        text-decoration: none !important;
        text-shadow: rgba(0, 0, 0, 0.1) 0px -1px 1px;
        behavior: url(/docs/default-source/css/PIE.htc);
    }

/*  END - CSS Buttons */ 


/*  ----------------------------------------------
    FORMS - Search  
    ---------------------------------------------- */

/* Sitefinity Search Submit Button (seen in login container) */
.sfsearchSubmit {
    background: white url(https://media.asrt.org/images/cms_template/search-button.jpg) top left no-repeat !important; 
    color: white;
    text-indent: -9999px;
    border: none;
    width: 24px !important;
    height: 23px !important;
    padding: 0 !important;
    margin: 0 !important;
    float: left;
}
    .sfsearchSubmit:before {
        padding-right: 1.5%;
        /* font-family: 'FontAwesome';
        content: '\f002'; 
        color: #666; */  
    }

.search-btn input[type=submit], .search-btn input[type="button"]:hover, .search-btn input[type=submit]:hover {
    border: 0;
    width: 22px;
    height: 22px;
    cursor: pointer;
}

.sfsearchText {
    width: 95% !important;
    background: white;
    border: none !important;
    height: 24px !important;
    padding:  1% 16% 1% 4%;
}

    input[type="text"].sfsearchText {
        margin: 0;
        padding: 0.25em;
        border-radius: 0;
        float: left;
    }