/**
 * This file should get overwritten if Method 1 is used. If Method 2 is chosen,
 * remove this comment and start adding your styles to this file.
 */

/*
 *page regions
 */
.front p{font-size: 15px;}
.page-header{
    display: none;
}

.page-node .page-header, .page-mutation-history .page-header{
    display: block;
    color: #314b8a;
    font-size: 18px;
    margin-top: 5px;
     padding: 10px;
    border: 1px solid #cfcfcf;
    -webkit-border-radius: 11px;
    -moz-border-radius: 11px;
    border-radius: 11px;
    -webkit-box-shadow: 0px 0px 9px 3px rgba(0,0,0,0.25);
    -moz-box-shadow: 0px 0px 9px 3px rgba(0,0,0,0.25);
    box-shadow: 0px 0px 9px 3px rgba(0,0,0,0.25);
    margin: 20px 0;
    
}


#empty{border-bottom: 1px solid #e7e7e7; margin-left: auto; margin-right: auto;}

.logo{
    margin-top: 20px;
}

/*turn off responsive for now 
.container, .navbar.container {
  width: 1170px !important;
}
*/
.navbar.container {
      max-width: 1140px !important;
}

.navbar-collapse.collapse {
display: block!important;
margin-right: 0;
    margin-left: 0;
}

.navbar-nav>li, .navbar-nav {
float: right !important;
    margin: 0;
}

.navbar-nav.navbar-right:last-child {
margin-right: -15px !important;
}

.navbar-right {
float: right!important;
}
.navbar-header{display: none;}
.navbar-nav>li>a {
    padding: 15px 12px;
}
/*end responsive switch */

.input-group-addon{
    padding: 0px 4px;
    
}

.input-group-addon .glyphicon{
    font-size: 11px;
}

#cftr2-search-form .form-control{
    padding: 6px 11px;
    font-size: 13px;
}

footer .region-footer{
    border: none;
    min-height: 56px;
    color: #fff;
    text-align: center
    -webkit-border-radius: 20px;
    -moz-border-radius: 20px;
    border-radius: 20px;
    background: #4e8cb2; /* Old browsers */
    background: -moz-linear-gradient(top,  #4e8cb2 0%, #314b8a 100%); /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#4e8cb2), color-stop(100%,#314b8a)); /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top,  #4e8cb2 0%,#314b8a 100%); /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top,  #4e8cb2 0%,#314b8a 100%); /* Opera 11.10+ */
    background: -ms-linear-gradient(top,  #4e8cb2 0%,#314b8a 100%); /* IE10+ */
    background: linear-gradient(to bottom,  #4e8cb2 0%,#314b8a 100%); /* W3C */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#4e8cb2', endColorstr='#314b8a',GradientType=0 ); /* IE6-9 */
    -webkit-box-shadow: 0px 0px 9px 3px rgba(0,0,0,0.25);
    -moz-box-shadow: 0px 0px 9px 3px rgba(0,0,0,0.25);
    box-shadow: 0px 0px 9px 3px rgba(0,0,0,0.25);
}

.footer{
    padding: 0px 15px;
    border: none;
}

.region-navigation{
    float: left;
}

.go_science{
    font-size: 18px;
}

@media (min-width: 768px)
.navbar-nav {
  float: right;
  margin: 0;
}

.navbar-nav{
    float: right;
    margin-right: 28px;
    margin-top: 4px;
}


#cftr2-search-form label{
    display: none;
}

#navbar{
    margin: 0px auto;
    padding: 0px;
    margin-bottom: 25px;
}

.navbar-nav a{
    color: #304b8a;
    font-weight: bold;
}

.page-landing .panel-separator{
    display: inline-block;
}

.navbar-default{
   padding: 0px;
   min-height: 56px;
   color: #fff;
   -webkit-border-radius: 20px;
   -moz-border-radius: 20px;
   border-radius: 20px;
   background-color: #d1d2d3;
   border: none;
   -webkit-box-shadow: 0px 0px 9px 3px rgba(0,0,0,0.10);
    -moz-box-shadow: 0px 0px 9px 3px rgba(0,0,0,0.10);
    box-shadow: 0px 0px 9px 3px rgba(0,0,0,0.11);
}

.navbar-collapse{
    padding: 0px;
}

#block-cftr2-cftr2-search-block
{
    padding-right: 10px;
    border: none;
    min-height: 56px;
    color: #fff;
    -webkit-border-radius: 20px;
    -moz-border-radius: 20px;
    border-radius: 20px;
    background: #4e8cb2; /* Old browsers */
    background: -moz-linear-gradient(top,  #4e8cb2 0%, #314b8a 100%); /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#4e8cb2), color-stop(100%,#314b8a)); /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top,  #4e8cb2 0%,#314b8a 100%); /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top,  #4e8cb2 0%,#314b8a 100%); /* Opera 11.10+ */
    background: -ms-linear-gradient(top,  #4e8cb2 0%,#314b8a 100%); /* IE10+ */
    background: linear-gradient(to bottom,  #4e8cb2 0%,#314b8a 100%); /* W3C */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#4e8cb2', endColorstr='#314b8a',GradientType=0 ); /* IE6-9 */
    
}

.form-item-mutation1{
    width: 200px;
    float: left;
    margin-top: 10px;
    margin-left: 10px;
    margin-right: 10px;
}

.form-item-mutation2{
    width: 200px;
    float: left;
    margin-top: 10px;
    margin-left: 10px;
    margin-right: 10px;
}

.footer_links{
    margin-top: 14px;
    text-align: center;
    line-height:30px;
}

.footer_links li{
    list-style:none;
    margin: 0 7px;
    display:inline;
    padding: 0 0 0 20px;
    border-left: 1px solid #fff;
}

.footer_links li:first-of-type{
    border-left: none;
}
    
.footer_links li a{
    color: #fff;
    font-size: 14px;
}

#cftr2-search-form button{
    float: left; margin-top: 10px;
    color: #333333;
    font-weight: bold;
    background: #7db9e8; /* Old browsers */
    background: -moz-linear-gradient(top,  #7db9e8 0%, #ffffff 0%, #b6b2b2 100%); /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#7db9e8), color-stop(0%,#ffffff), color-stop(100%,#b6b2b2)); /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top,  #7db9e8 0%,#ffffff 0%,#b6b2b2 100%); /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top,  #7db9e8 0%,#ffffff 0%,#b6b2b2 100%); /* Opera 11.10+ */
    background: -ms-linear-gradient(top,  #7db9e8 0%,#ffffff 0%,#b6b2b2 100%); /* IE10+ */
    background: linear-gradient(to bottom,  #7db9e8 0%,#ffffff 0%,#b6b2b2 100%); /* W3C */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#7db9e8', endColorstr='#b6b2b2',GradientType=0 ); /* IE6-9 */
 }
 
 .colab_logos {
    width: 50%;
    float: right;
  }
 .colab_logos p{
    font-size: 10px;
    font-weight: bold;
    color: #999;
    margin-left: 50px;
 }
 /*Page Classes
  */
 .navbar-default .navbar-nav>.active>a, .navbar-default .navbar-nav>.active>a:hover, .navbar-default .navbar-nav>.active>a:focus
 {background-color: transparent;}
 
 .hide_mutation_legal{
    color: #fad53a;
 }
 
 .media_link{
    width: 20px;
    height: 20px;
    margin-left: 5px;
    display: inline-block;
    background-image: url('/sites/all/themes/cftr2_bootstrap/icons/video_thum.png');
 }
 
 .hide_mutation_legal:hover{
    text-decoration: underline;
    cursor: pointer;
 }
 
 .inlinelist{
    list-style: none;
    float: right;
 }
 .inlinelist li{
    display: inline-block;
    margin-left: 10px;
 }
 
 h2{
    color: #314b8a;
    font-size: 18px;
    margin-top: 5px;
 }
 
 .video{
    width: 50%;
    display: inline-block;
 }
 
  .video_description{
    width: 45%;
    display: block;
    float: right;
    margin-left: 20px;
 }
 
 .warning_text p{
    color: #9c3636;
    margin: 20px 0;
 }
 
 .warning_box{
    padding: 10px;
    color: #fff;
    background-color: #9c3636;
    border: 1px solid #000;
    -webkit-border-radius: 11px;
    -moz-border-radius: 11px;
    border-radius: 11px;
    -webkit-box-shadow: 0px 0px 9px 3px rgba(0,0,0,0.25);
    -moz-box-shadow: 0px 0px 9px 3px rgba(0,0,0,0.25);
    box-shadow: 0px 0px 9px 3px rgba(0,0,0,0.25);
    margin: 20px 0;
 }
 .green_box{
    padding: 10px;
    color: #fff;
    background-color: #207428;
    border: 1px solid #000;
    -webkit-border-radius: 11px;
    -moz-border-radius: 11px;
    border-radius: 11px;
    -webkit-box-shadow: 0px 0px 9px 3px rgba(0,0,0,0.25);
    -moz-box-shadow: 0px 0px 9px 3px rgba(0,0,0,0.25);
    box-shadow: 0px 0px 9px 3px rgba(0,0,0,0.25);
    margin: 20px 0;
 }
 
 .green_box h2, .warning_box h2{
    color: #fff;
    font-size: 14px;
    display: block;
    width: 100%;
    
    height: 37px;
    background-repeat: no-repeat;
    background-position-x: right;
    padding-top: 10px;
    margin-top: 0px;
 }
 
 .green_box h2{
    background-image: url(/sites/all/themes/cftr2_bootstrap/icons/ok.gif);
 }
 
 .warning_box h2{
    background-image: url(/sites/all/themes/cftr2_bootstrap/icons/no.gif);
 }
 
 button.disabled {
    color: #777;
    background: #aaa;
 }
 
 .panel-col-last .green_box, .panel-col-last .warning_box{
    height: 500px;
    width: 330px;
    display: block;
    margin-top: 20px;
    float: left;
 }
 
 .panel-col-last .green_box{
    margin-right: 15px;
 }

.front .panel-2col-stacked .panel-col-last .inside{
    height: 200px;
    overflow: visible;
}

 .front .panel-2col-stacked .panel-col-first .drop_box{
    height: 500px;
 }
 
 .panel-2col-stacked .panel-col-first { 
  float: left; 
  width: 40%; 
}
html .panel-2col-stacked .panel-col-last {
  width: 59.9%;
}

 .warning_box a{
    color: #fad53a;
 }
 .drop_box, .page-node .content{
    padding: 10px;
    border: 1px solid #cfcfcf;
    -webkit-border-radius: 11px;
    -moz-border-radius: 11px;
    border-radius: 11px;
    -webkit-box-shadow: 0px 0px 9px 3px rgba(0,0,0,0.25);
    -moz-box-shadow: 0px 0px 9px 3px rgba(0,0,0,0.25);
    box-shadow: 0px 0px 9px 3px rgba(0,0,0,0.25);
    margin: 20px 0;
 }
 
 .border_box{
    padding: 10px;
    border: 1px solid #cfcfcf;
    -webkit-border-radius: 11px;
    -moz-border-radius: 11px;
    border-radius: 11px;
    margin: 20px 0;
 }
 
 .drop_box h3{
    font-size: 15px;
    font-weight: bold;
 }
 
 .ui-widget-header{
    border: none;
    background: none;
 }
 
 .ui-widget-content{
    border: none;
 }
 
 .ui-widget{
    font-size: 1em;
 }
 
 #hidee{display: none;}
 
.ui-tabs .ui-tabs-panel{
    border: 1px solid #cfcfcf;
    -webkit-border-radius: 11px;
    -moz-border-radius: 11px;
    border-radius: 11px;
    -webkit-box-shadow: 0px 0px 9px 3px rgba(0,0,0,0.25);
    -moz-box-shadow: 0px 0px 9px 3px rgba(0,0,0,0.25);
    box-shadow: 0px 0px 9px 3px rgba(0,0,0,0.25);
    
 }
 
 .ui-tabs .ui-tabs-nav{
    margin-left: 11px;
 }
 
 .ui-tabs .ui-tabs-nav a:focus{
    outline: none;
 }
 
 .ui-accordion-header-icon{
    float:left;
 }
 
 .ui-accordion-header {padding: 5px;}
 .ui-accordion-content {padding: 20px;}
 
 .dropdown-menu {width: 600px}
.dropdown-menu li {clear:both;}
 .underline_break{
    border-bottom: 1px solid #c2c2c2;
    padding-bottom: 5px;
    margin-bottom: 10px;
 }
 
 .cf_scale_img {text-align: center; margin-top: 25px;}
 
 .US{background-image: url('../icons/United-States.png'); }
 .Canada{background-image: url('../icons/Canada.png'); }
 .EU{background-image: url('../icons/European-Union.png'); }
 
 .US, .Canada, .EU {
    background-repeat: no-repeat;
    height: 32px;
    display: block;
    padding: 6px 0px 1px 38px;
 }
 
 /*tables */
 table {
    border-collapse: collapse; text-align: left; width: 100%;
    }
    
.hidden_table tbody tr td{
    border: none !important;
}
 table {background: #fff; -webkit-border-radius: 11px; -moz-border-radius: 11px; border-radius: 11px; }
 
 table td, table th { padding: 5px 10px; }
 table td.nested {padding: 0px;}
 table td.nested table tbody td:last-child { border-right: none; }
 table td.nested table tbody td:first-child { border-left: none; }
 table td.nested table tbody tr:last-child td { border-bottom: none; }
 
 table thead tr td{background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #4E8CB2), color-stop(1, #314B8A) );background:-moz-linear-gradient( center top, #4E8CB2 5%, #314B8A 100% );filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#4E8CB2', endColorstr='#314B8A');background-color:#4E8CB2; color:#FFFFFF; font-weight: bold; }
 
 .page-resources table tr:first-child { border-top: 2px solid #E1EEF4; }
 table thead th:first-child { border: none; }
 
 table tbody td { color: #000000; border-left: 2px solid #E1EEF4; border-bottom: 2px solid #E1EEF4; font-size: 14px;font-weight: normal; vertical-align: top;}
 
 table tbody td:last-child { border-right: 2px solid #E1EEF4; }
 
 
 table.missense_table tbody tr td tbody tr:nth-child(odd) {
   
}


table.missense_table tbody tr td table{
    -webkit-border-radius: 0px; -moz-border-radius: 0px; border-radius: 0px;
}

table table.missense_table tbody td, table.clinical tbody td {border-bottom: 2px solid #E1EEF4;}
table table.missense_table tbody td table td {border-bottom: 0px solid #E1EEF4;}
table.clinical tbody td {text-align: center;}

.centered {text-align: center;}
.vcentered {vertical-align: middle;}

.chartWithOverlay {
    position: relative;
    width: 400px;
}
.overlay {
    width: 58px;
    height: 20px;
    position: absolute;
    top: 111px;  /* chartArea top  */
}
.overlay_left {
    left: 90px; /* chartArea left */
}
.overlay_center {
    left: 171px; /* chartArea left */
}
.overlay_right {
    left: 253px; /* chartArea left */
}
.chartWithOverlay .overlay div{text-align: center; font-size: 10px;}

#cftr2-agreement-form span.form-required {display: none;}

.cboxLoadedContent{overflow-y: scroll;}

.halfbox{
    width: 45%;
    margin-right: 5%;
    float: left;
}
.clear{clear: both;}

.overlay1 {
position: absolute;
top: 56px;
font-size: 10px;
left: 57px;
}

.sampleSize {
	/* display: inline-block; */
	margin-bottom: 9px;
}

.overlay2 {
    position: relative;
    top: -94px;
    left: 0px;
    font-size: 10px;
}

.overlay3 {
    position: relative;
    top: -94px;
    left: 325px;
    font-size: 10px;
}

/*Responsive styles */
.colab_logos ul li{width: 26%;}
.colab_logos ul li img {width: 100%; height: auto;}
a.logo img {width:100%; height:auto; max-width: 225px;}
.page-welcome iframe {width:100%}
@media only screen and (max-width: 991px) { .responsive_table {overflow-x: scroll !important; } }
.responsive_table {overflow-x: hidden}
.cf_scale_img {width:100%}
.cf_scale_img img {width: 100%; max-width: 805px;}

@media only screen and (max-width: 1200px) {
.panel-col-last .green_box, .panel-col-last .warning_box {width: 46%; height:560px;}
.panel-col-last .green_box h2, .panel-col-last .warning_box h2 {padding-right: 40px;}
.front .panel-2col-stacked .panel-col-first .drop_box{height:auto}
.navbar-nav li a{ padding:15px 6px;}
.form-item-mutation1{
    width: 180px !important;
    float: left;
    margin-top: 10px;
    margin-left: 10px;
    margin-right: 10px;
}

.form-item-mutation2{
    width: 180px !important;
    float: left;
    margin-top: 10px;
    margin-left: 10px;
    margin-right: 10px;
}
}

@media only screen and (max-width: 991px) {
.breaking_table tr td.break {width:100%; display:block;}


.form-item-mutation1{
    width: 35% !important;
    float: left;
    margin-top: 10px;
    margin-left: 10px;
    margin-right: 10px;
}

.form-item-mutation2{
    width: 35% !important;
    float: left;
    margin-top: 10px;
    margin-left: 10px;
    margin-right: 10px;
}

.region-navigation{width:100%; }

.front .panel-2col-stacked .panel-col-first{width: 100%;}
.front .panel-2col-stacked .panel-col-first .drop_box{height:auto}
.panel-col-last .green_box, .panel-col-last .warning_box {width: 100%; height:auto;}
html .panel-2col-stacked .panel-col-last{width: 100%;}
.video {width:100%; display:block;}
.video_description {width:100%; float:none;}
.front .ui-tabs .ui-tabs-panel {height:500px; }
.ui-tabs .ui-tabs-nav li a {padding: 0.5em .5em; font-size: 12px;}

}

@media only screen and (min-width: 640px) {.ui-tabs-panel h3{display:none;}
}


/* css hamburger stuff */

header {
  width: 100%;
  z-index: 3;
}

header ul {
  margin: 0;
  padding: 0;
  list-style: none;
  overflow: hidden;
} 

header li a {
  display: block;
  padding: 20px 20px;
  text-decoration: none;
}


/* menu */

header .menu_switch {
  max-height: 0;
  transition: max-height .2s ease-out;
}

/* menu icon */

header .menu-icon {
  cursor: pointer;
  display: inline-block;
  float: right;
  padding: 28px 20px;
  position: relative;
  user-select: none;
}

header .menu-icon .navicon {
  background: #333;
  display: block;
  height: 2px;
  position: relative;
  transition: background .2s ease-out;
  width: 18px;
}

header .menu-icon .navicon:before,
header .menu-icon .navicon:after {
  background: #333;
  content: '';
  display: block;
  height: 100%;
  position: absolute;
  transition: all .2s ease-out;
  width: 100%;
}

header .menu-icon .navicon:before {
  top: 5px;
}

header .menu-icon .navicon:after {
  top: -5px;
}

/* menu btn */

header .menu-btn {
  display: none;
}

header .menu-btn:checked ~ .menu_switch {
  overflow: visible;
  max-height: 540px;
}

header .menu-btn:checked ~ .menu-icon .navicon {
  background: transparent;
}

header .menu-btn:checked ~ .menu-icon .navicon:before {
  transform: rotate(-45deg);
}

header .menu-btn:checked ~ .menu-icon .navicon:after {
  transform: rotate(45deg);
}

header .menu-btn:checked ~ .menu-icon:not(.steps) .navicon:before,
header .menu-btn:checked ~ .menu-icon:not(.steps) .navicon:after {
  top: 0;
}


header .menu-btn:checked ~ header ul{
overflow: visible;
}

/* 48em = 768px */

@media (min-width: 48em) {
  header li {
    float: left;
  }
  header li a {
    padding: 20px 30px;
  }
  header .menu_switch {
    clear: none;
    float: left;
    max-height: none;
  }
  header .menu-icon {
    display: none;
  }
  header ul {
  margin: 0;
  padding: 0;
  list-style: none;
  overflow: visible !important;
}
}

@media (max-width: 48em) {
.navbar-nav>li { float: none !important;}
.navbar-nav {float:left !important; width:100%;} 
.navbar-nav>li a{width:100%; border-bottom:1px solid darkgrey;}
.form-item-mutation1{width:90% !important; float:none;}
.form-item-mutation2{width:90% !important; float:none;}
.video_description{margin-left: 0px;}

#block-cftr2-cftr2-search-block {-webkit-border-radius: 1px;
-webkit-border-bottom-right-radius: 20px;
-webkit-border-bottom-left-radius: 20px;
-moz-border-radius: 1px;
-moz-border-radius-bottomright: 20px;
-moz-border-radius-bottomleft: 20px;
border-radius: 1px;
border-bottom-right-radius: 20px;
border-bottom-left-radius: 20px;}
.region-footer .centered{text-align: left; padding: 15px;}
.footer_links {text-align: left; padding: 0px}
.footer_links li:first-of-type {padding: 11px; border:none }
.footer_links li {padding: 11px; border:none }
.breaking_table .break, .hidden_table td {padding: 0px;}
.ui-accordion-content {padding: 20px 0px;}
ul {padding-left: 12px;}
}

.lastupdated {
    float: left;
border: 1px solid;
padding: 12px 10px;
margin-top: 22px;
margin-left: 114px;
font-weight: bold;
background-color: #304b8a;
color: white;
margin-right: auto;
}