/* common layout */
*                                                       { box-sizing: border-box; }
.overHidden                                             { overflow: hidden !important; }
.error                                                  { background-color: #f2dede; border-left: 5px solid #990000; color: #900; font-weight: 100; padding: 7px; }

a                                                       { text-decoration: none; transition: all.2s linear;}
a img                                                   { border: none !important; }

h1 ,h2, h3, h4, h5, h6                                  { margin: 0; line-height: 1.15em; padding: 0 0 .75em; }

h1                                                      { font-size: 2em; }
h2                                                      { font-size: 1.5em; }
h3                                                      { font-size: 1.17em; }
h4                                                      { font-size: 1.12em; padding: 0 0 0.65em; }
h5                                                      { font-size: .83em; padding: 0 0 0.65em; }
h6                                                      { font-size: .75em; padding: 0 0 0.65em; }

p                                                       { margin: 0; padding: 0 0 1.1em; }
input,
textarea,
select                                                  { font-size: 14px; font-weight: 400; line-height: 1em; padding: 4px 6px; }
textarea                                                { line-height: 1.1em; min-height: 7.2em; }
.tnormal                                                { font-weight: normal; }

html,
#header,
#content,
#footer                                                 { min-width: 960px; }
#content.popit                                          { min-width: 0; }
#navigation.scroll-to-fixed-fixed                       { transform: translate3d(0, 0, 0); }

.fixWidth                                               { width: 960px; margin: 0 auto; padding: 0; position: relative; }

img.spacer                                              { visibility: hidden; height: 0; }
.selectCircle                                           { display: inline-block; height: 30px; width: 30px; border-radius: 25px; margin: 4px; }

.button                                                 { border: none !important; border-radius: 0 !important; text-decoration: none !important; transition: all 0.2s linear; }
.buttonHolder                                           { padding: 35px 0; }
.btnHolder .button                                      { margin: 0 7px 7px 0; }

.required:after                                         { top: auto; }

/* columns */
#content .sidebar                                       { display: none; }
#content .columns.content                               { width: 100%; }
body[class*="hasColumn"] #content .columns.content      { width: calc(100% - 250px); }
body[class*="hasColumn"] #content .columns.sidebar      { width: 250px; display: block; }
body.hasColumnRight #content .columns.sidebar,
body.hasColumnLeft #content .columns.content            { float: right; padding: 0 0 0 15px; }
body.hasColumnLeft #content .columns.sidebar,
body.hasColumnRight #content .columns.content           { float: left; padding: 0 15px 0 0; }

body[class*="hasColumn"] #progress_buttons              { width: calc(100% - 250px) !important; padding-right: 25px; }

.stripe div:not(.headerHolder) .colmnH                  { border-top: 1px solid #FFF; border-bottom: 1px solid #CCC; }
.stripe div:not(.headerHolder):first-of-type .colmnH    { border-top: 1px solid transparent; }
.stripe div:not(.headerHolder):last-of-type .colmnH     { border-bottom: 1px solid transparent; }

/* table divs */
.tbl                                                    { display: table; }
.tbl > .row                                             { display: table-row-group; }
.tbl .row > .cell                                       { display: table-cell; }

.sidr .sidr-inner                                       { padding-top: 50px; }
.sidrClose                                              { display: none; position: fixed; top: 10px; right: -260px; z-index: 1000000; font-size: 25px; transition: right .2s linear; }

.fieldHolder,
.fieldHolder > div                                      { width: 100%; }
.fieldHolder .labelHolder                               { line-height: 23px; }
.fieldHolder label                                      { padding: 1px 0 3px 0; }
.labelHolder > label > div                              { display: inline-block; }
.labelHolder > label p,
.labelHolder                                            { max-width: 165px; width: 100%; padding-right: .5em; }
.inputHolder                                            { max-width: calc(100% - 165px); }
.labelHolder > label p                                  { padding: 0; }

.stacked .labelHolder                                   { max-width: 100% !important; }
.stacked:not(.nomargin) .inputHolder                    { margin-left: 165px; }
.stacked.nomargin .inputHolder                          { max-width: 100%; }

.button p,
#sidebar_header p                                       { padding: 0px; }
.sidebar h1                                             { font-size: 1.4em; padding: 0.4em 0 0.65em; }

#content .chosen-container                              { width: 100% !important; margin-top: -3px; }
#content .chosen-container .chosen-single               { height: auto; }
#content .chosen-container a                            { padding: 0 !important; color: #000 !important; background: #FFF;}
#content .chosen-container a span                       { padding: 1px 6px !important; }

/* Template Layout */

#header #hero                                           { min-height: 375px; background-image: url(../images/theme01_hero_place_holder.jpg); background-size: cover; }
#header #hero .heroText                                 { display: table-cell; vertical-align: middle; height: 340px; }
#header #hero .heroText .title                          { font-size: 60px; line-height: 1em; text-shadow: 0px 1px 5px rgba(0,0,0,.48); }
#header #hero .heroText .subTitle                       { font-size: 24px; }

#navigation .logo                                       { display: block; width: 200px; float: left; height: 67px; padding: 13px 0; }
#navigation .logo img                                   { max-height: 40px; max-width: 176px; }

#navigation #menu-button                                { font-size: 21px; line-height: 67px; display: none; cursor: pointer; }

#navigation .steps,
#navigation ul.menu                                     { display: block; max-width: calc(100% - 200px); float: right; }
#navigation ul.menu li                                  { display: inline-block; float: left; margin: 0; padding: 0; }
#navigation ul.menu li a                                { padding: 25px 15px; font-size: 14px; text-decoration: none; display: block; }
#navigation ul.menu li.active a,
#navigation ul.menu li a:hover                          { background-color: rgba(0,0,0, 0.34); }
#navigation .steps .step                                { padding: 12px 25px 10px 0; }
#navigation .steps .step > span                         { line-height: 40px; font-size: 14px; }
#navigation .steps .step:before                         { line-height: 38px; }
#navigation .steps .step:last-of-type:before            { display: none; }
ul.menu li.noHover a:after,
ul.menu li.noHover > ul                                 { display: none !important; }

#content                                                { padding: 50px 0; min-height: 475px; }

#footer                                                 { font-size: .9em; }
#footer .fixWidth                                       { padding: 10px 0; }
#footer .legal                                          { font-size: 12px; text-align: right; }
#footer a                                               { display: block; clear: both; }
#footer .cell                                           { padding: 0 30px 15px; width: 33%; }
#footer .cell:not(:first-of-type)                       { border-left: 1px solid rgba(255,255,255,0.2); }

/* userTab */
#userTab                                                { display: table; float: right; margin: 0 25px; min-width: 300px; }
#userTab > *                                            { display: table-cell; vertical-align: middle; height: 90px; float: none !important; }
#userTab > .profileImg                                  { width: 60px; }
#userTab > .profileImg img                              { display: block; max-height: 60px; max-width: 100%; }
#userTab > .profileImg img[src*="no-profile-picture.png"] { background-color: #5f6062; }
#userTab > .userTabContent                              { width: calc(100% - 65px); }
#userTab > .userTabContent .leftSide                    { float: left; width: 90px; text-align: right; padding-right: .5em; }
#userTab > .userTabContent .rightSide                   { float: left; width: calc(100% - 90px); }
#userTab .userName                                      { font-weight: bold; }
#user_tab_role                                          { cursor: default; }

#userTab.noLeftSide > .userTabContent .rightSide        { float: left; width: 100%; }
#userTab.noLeftSide > .userTabContent                   { padding-left: 5px; }

#userTab li                                             { position: relative; float: left; min-width: 125px; }
#userTab li > ul                                        { display: none; position: absolute; background-color: #fff; z-index: 10000; min-width: 100%; }
#userTab li:hover > ul                                  { display: block; }
#userTab li > ul > li                                   { clear: both; width: 100%; }
#userTab li.hassub ul > li > a                          { text-align: center; width: 100%; display: block; padding: 10px 7px; line-height: 1em; color: #222 !important; }
#userTab li.hassub ul > li > a:hover                    { color: #000 !important; background-color: #E4E4E4; }
#userTab li.hassub > a:after,
#userTab li.hassub > .role:after                        { content: '\f107'; font-family: 'FontAwesome'; display: inline-block; padding: 0 .4em; font-weight: bold; }

#userTab.noProfileImg                                   { min-width: 145px; }
#userTab.noProfileImg .profileImg                       { display: none; }
#userTab.noProfileImg > .userTabContent .rightSide      { float: left; width: 100%; }
#userTab #user_roles.dNone                              { display: none !important; }

.tabMenu                                                { position: relative; display: block; padding: 0 0 25px; }
.tabMenu ul li                                          { float: left; border-bottom: 3px solid transparent; }
.tabMenu ul li:hover,
.tabMenu ul li.active                                   { border-color: #CCC; }
.tabMenu ul li > a                                      { display: block; padding: 10px 20px; color: #000 !important; }

.sidr #userTab                                          { display: none !important; }
.sidr #userTab li.hassub                                { cursor: pointer; }
.sidr #userTab,
.sidr #userTab > *                                      { display: block; height: auto; width: 100%; min-width: 0; margin: 0; }
.sidr #userTab .profileImg                              { padding: 5px; position: absolute; top: 0; }
.sidr #userTab .leftSide                                { display: none; }
.sidr #userTab .rightSide                               { width: 100%; padding: 0 10px; }
.sidr #userTab li                                       { float: none; width: 100%; border-top-color: rgba(0, 0, 0, 0); border-bottom: 1px solid #4d4d4d; }
.sidr #userTab ul.rightSide                             { padding: 0; }
.sidr #userTab ul.rightSide ul                          { position: relative; background-color: #555 !important; }
.sidr #userTab ul.rightSide ul > li > a                 { color: #FFF !important; }
.sidr #userTab ul.rightSide ul > li:hover > a           { background-color: rgba(255,255,255,.15) !important; box-shadow: none; }
.sidr #userTab #user_tab_role,
.sidr #userTab .role                                    { padding: 0 0 0 50px; }
.sidr #userTab #user_tab_role                           { padding: 0 0 0 50px; }
.sidr #userTab li.hassub ul > li.hassub > a:after       { content: '\f107'; float: none; font-weight: bold; padding-left: .5em;}
.sidr #userTab li.hassub ul > li.hassub:hover > a:after { content: '\f106'; }
.sidr #userTab li.hassub ul > li.hassub:hover > ul      { display: block; position: relative !important; left: auto !important; top: auto !important; }
.sidr #userTab li.hassub ul > li.hassub:hover > ul > li { background-color: rgba(255,255,255,.15) !important; padding-left: 10px; white-space: normal; }

/* cfp messages */
#author_box label                                       { float: none; padding: 0; width: 100%; }
#author_box input, #author_box textarea                 { float: none;margin: 0; width: 100%; }
#author_box select                                      { margin: 0; }
.message_info.row                                       { font-size: .85em; font-style: italic; padding-right: 85px; }
.message_info.row b                                     { white-space: nowrap; }

#attachments .uploadFile                                { display: none; }
.uploadFile .inputHolder                                { height: 35px; overflow: hidden; position: relative; }
.uploadFile input[type=file]                            { display: none; }
.uploadFile .button                                     { border-radius: 0; margin: 0 !important; position: absolute; right: -1px; top: -1px; line-height: 1.3em; }
.uploadFile .icon.cancel,
.uploadFile .upload                                     { display: none; }
.uploadText                                             { padding: 6px; background-color: #FFFFFF; }
.bSubmit                                                { display: none; }
.bSubmit .columns.two                                   { width: 125px; }
.bSubmit .columns.fourteen                              { width: calc(100% - 125px); }
.bSubmit .button                                        { margin-right: 0; }
#progress-container                                     { padding: 19px 0 0; }
#progress-container svg                                 { height: 5px; }
#progress-container svg path:nth-child(2)               { stroke: #f00; }

#navigation .fixWidth                                   { padding: 0; }

/*filter */
#search_filters .share                                  { padding-top: 30px; }
#url                                                    { min-width: 420px; max-width: calc(100% - 30px); margin: 0 auto; }
#url .button.fa.fa-clipboard                            { line-height: 24px; padding: 0; border: none !important; right: -1px; }

#content a.search-choice-close {
    background-image: none !important;
    border-color: transparent !important;
}
/* for chosen */
#content a.search-choice-close:before {
    content: '\f00d';
    display: block;
    font-family: fontawesome;
    font-size: 12px;
    color: #999;
    line-height: 11px;
    text-decoration: none;
}
#content a.search-choice-close:hover:before {
    color: #000;
}

@media only screen and (max-width: 960px) {
    .fixWidth                                           { padding: 0 12px; }
    #footer .fixWidth                                   { padding: 10px 12px; }
}

@media only screen and (max-width: 850px) {
    html,
    #header,
    #content,
    #footer                                             { min-width: 0; }
    body                                                { overflow-x: hidden; }
    .sidrClose,
    #navigation #menu-button                            { display: block; }
    .sidr-open .sidrClose                               { right: 0; }

    body[class*="hasColumn"] #content .columns.content,
    body[class*="hasColumn"] #content .columns.sidebar  { float: none; padding: 0; display: block; }

    .stacked .inputHolder                               { margin-left: 0; }
    #content .columns                                   { width: 100% !important; }

    .stripe .colmnH                                     { border-top: none !important; border-bottom: none !important; }
    .stripe .tblRow:not(:first-of-type)                 { border-top: 1px solid #FFF; }
    .stripe .tblRow:not(:last-of-type)                  { border-bottom: 1px solid #CCC; }

    .step:not(.active)                                  { display: none; }

    .tabMenu ul li                                      { margin-bottom: 5px !important; }

    #navigation ul.menu                                 { display: none; }
    .fixWidth                                           { width: 100% !important; max-width: 100%; }
    #content .labelHolder                               { text-align: right !important; }
    #content .stacked .labelHolder                      { text-align: left !important; }
    .stacked:not(.nomargin) .inputHolder                { margin-left: 0; max-width: 100%; }
}

@media only screen and (max-width: 675px) {
    #content .labelHolder                               { text-align: left !important; }
    .fieldHolder > div                                  { max-width: 100% !important; }

    .btnHolder .button                                  { width: 100%; }

    .tabMenu ul:after                                   { height: 48px; content: ''; display: block; }
    .tabMenu ul li                                      { float: none; width: 100%; }
    .tabMenu ul li.active                               { position: absolute; bottom: 24px; }

    #userTab                                            { display: none; }
    .sidr #userTab                                      { display: block !important; }
    .sidr .sidr-inner                                   { padding-top: 70px; }

    .fieldTable:not(.inputBorder) .fieldHolder > div    { padding: 2px 7px; }
    #footer .tbl,
    #footer .tbl .row .cell,
    #footer .tbl .row                                   { display: block;  width: 100% !important; padding: 0; border: none !important; }
    #footer .tbl .row .cell                             { padding: 10px !important; }
}

@media only screen and (max-width: 320px) {
    body                                                { overflow-x: auto; min-width: 320px; }
}
