/*
* ============LICENSE_START=======================================================
* ONAP : SDNC-FEATURES
* ================================================================================
* Copyright 2018 TechMahindra
*=================================================================================
* Licensed under the Apache License, Version 2.0 (the "License");
* you may not use this file except in compliance with the License.
* You may obtain a copy of the License at
*
*     http://www.apache.org/licenses/LICENSE-2.0
*
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS,
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
* See the License for the specific language governing permissions and
* limitations under the License.
* ============LICENSE_END=========================================================
*/
 
 body{ 
 padding-top:10px; 
 overflow-y:scroll;
 padding-bottom:10px;
 } 

/* form styling */
#form-container{  
	margin-bottom:20px;
    border-radius:5px;
}
#form-container .page-header{  
	margin:0; padding:30px; 
    border-top-left-radius:5px; border-top-right-radius:5px;
     }
    
 table.tableDisplay{
     font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
     border-collapse: collapse;
     width: 100%;
     table-layout: auto;
}
 table.tableDisplay tr:nth-child(even){
     background-color: #E1E0DA;
}
 table.tableDisplay th{
     padding-top: 12px;
     padding-bottom: 12px;
     text-align: left;
     background: linear-gradient(to top, #f8f8f8 0%, #cce5ff 83%);
     color: black;
}
 table.tableDisplay td,table.tableDisplay th {
     border: 1px solid #ABABAB;
     padding: 8px;
     width:30px;
     height:10%;
     
}
 table.tableDisplay tr:{
     text-align: left;
     height:105;;
}
 table.tableDisplay tr:hover {
     background-color:#cce5ff;
}
 .first_row{
     background-color: #cce5ff;
     color: black;
     text-align:left;
}
 .column {
     float: left;
     width: 32.2%;
     padding: 10px;
     margin-left:20px;
     height: 60px;
    /* Should be removed. Only for demonstration */
}
.columnComp{
	float: left;
     width: 22%;
     padding: 10px;
     margin-left:20px;
     height: 60px;
}
/* Clear floats after the columns */
 .row:after {
     content: "";
     display: table;
     clear: both;
}
 #btnSubmit{
     background-color: #AED6F1;
     margin-top:20px;
     margin-left:20px;
     margin-bottom:10px;
     width:75px;
     height:28px;
     font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
     border-collapse: collapse;
     border: 1px solid #5DADE2;
     font-weight:700;
}
 .btndownload{
     background-color: #AED6F1;
     margin-top:20px;
     margin-bottom:10px;
     margin-left:20px;
     width:130px;
     height:30px;
     font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
     border-collapse: collapse;
     border: 1px solid #5DADE2;
     font-weight:700;
}
 #exampleInput{
     margin-left:25px;
     width:160px;
}
 #exampleEndInput{
     margin-left:10px;
}
 .error{
     font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
     color:Red;
     font-size: 14px;
     margin-bottom:10px;
}
 .labeltext{
     font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
}
 .sort-icon {
     font-size: 9px;
     margin-left: 5px;
}
 th {
     cursor:pointer;
}
 .heading{  
     margin-top:10px;
     width:100%;
     height:45px;
     margin-bottom:20px;
     font-family:Trebuchet MS, Arial, Helvetica, sans-serif;
     margin-top: 15px;
     margin-right: auto;
     margin-left: auto;
     font-size: 20px;
      background: linear-gradient(to top, #f8f8f8 0%, #cce5ff 83%);
     padding-top: 15px;
     padding-bottom: 50px;

}
form_validationBody{
	width:900px;
	margin-left:15px;
	margin-top:60px;
	margin-bottom:20px;
}
button:hover {
    position: relative;
}
button[title]:hover:after {
     padding: 4px 8px;
     position: absolute;
     left: 0;
     top: 100%;
     white-space: nowrap;
     z-index: 20px;
     background:red;
}
.pagination{
display: inline-block;
  padding-left: 0;
  margin: 5px 0;
  border-radius: 4px;
  border: 1px solid #ABABAB;
  font-size: 13px;
}
.pagination > li > span {
  position: relative;
  float: left;
  padding: 6px 12px;
  line-height: 1.42857143;
  text-decoration: none;
  color: #337ab7;
  background-color: #fff;
  border: 1px solid #ABABAB;
  margin-left: -1px;
}
.pagination > .active >a{
  z-index: 3;
  color: #fff;
  background-color: #337ab7;
  border-color: #337ab7;
  cursor: default;
}
.arrowRed {
font-size: 30px;
color: red;
}
.arrowGreen {
font-size: 30px;
color: green;
}
.ng-invalid  { border: 1px ridge #ddd; }
.testMain{
	width:100%;
	margin-bottom:20px;
	min-height:400px;
	margin-top:10px;
}
.testNotification{
	padding:0px;
}
.testImgIcon{
	margin-left:5px;
	margin-right:10px;
	padding-right:10px;
}
.testCol{
	background-color:#f2f2f2;
	width:25%;
	margin-left:35px;
}
.check{
	 margin-left:10px;
	margin-right:10px;
}
.btnRunTest{
	background-color:#f2f2f2;
	width:75%;
	height:75px;
	margin-left:35px;
	margin-bottom:35px;
}
.ReportMain{
	width:100%;
    min-height:400px;
    margin-top:10px;
}
.ReportNotification{
	padding:0px;
	margin-right:10px;
	text-align:center;
}
.ReportImgIcon{
	margin-left:5px;
	margin-right:10px;
}
input[type=checkbox] { 
	padding-right: 3px;
	!important;
	}
	
.header{  
     margin-top:20px;
     width:1145px;
     height:45px;
     margin-bottom:5px;
     font-family:Trebuchet MS, Arial, Helvetica, sans-serif;
     font-size: 20px;
     background: linear-gradient(to top, #f8f8f8 0%, #8F8484 83%);
     padding-top:15px;

}
.footer{  
     margin-top:10px;
     width:1145px;
     height:30px;
     margin-bottom:5px;
     font-family:Trebuchet MS, Arial, Helvetica, sans-serif;
     font-size: 15px;
     background: linear-gradient(to top, #f8f8f8 0%, #8F8484 83%);
     padding-top:15px;

}
.btn-danger{
	background-color: #ffb3b3;
	width: 1090px;
	text-align: left;
	color:black;
	height:45px;
}
.btn-success{
	width: 1090px;
	text-align: left;
	color:black;
	background-color: #66cc66;
	height:45px;
	
}
.btn-warning{
	width: 1090px;
	text-align: left;
	color:black;
	height:45px;
	background-color: #ffff99;
}
/* Dropdown Button */
.dropbtn {
    background-color: #ffe0b3;
    font-family: Trebuchet MS, Arial, Helvetica, sans-serif;
    color: #333333;
    padding: 15px;
    font-size: 17px;
    border: none;
    padding-right:20px;
    padding-left: 30px;
}

/* The container <div> - needed to position the dropdown content */
.dropdown {
    position: relative;
    display: inline-block;
}

/* Dropdown Content (Hidden by Default) */
.dropdown-content {
    display: none;
    position: absolute;
    background-color: #f1f1f1;
    min-width: 240px;
    box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
    z-index: 1;
}

/* Links inside the dropdown */
.dropdown-content a {
    color: black;
    padding: 12px 16px;
    text-decoration: none;
    display: block;
    font-family: Trebuchet MS, Arial, Helvetica, sans-serif;
}

/* Change color of dropdown links on hover */
.dropdown-content a:hover {background-color: #ddd}

/* Show the dropdown menu on hover */
.dropdown:hover .dropdown-content {
    display: block;
    color: black;
}


.navbar-default .navbar-nav>li> a:hover {background-color: #ddd}
.btnapply{
     background-color:#AED6F1 ;
     margin-top:10px;
     margin-bottom:10px;
     margin-right:20px;
     width:150px;
     height:30px;
     font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
     border-collapse: collapse;
     border: 1px solid #5DADE2;
     font-weight:700;
}


.btnview{
    background-color: #AED6F1;
     margin-top:8px;
     margin-bottom:10px;
     margin-right:20px;
     width:150px;
     height:30px;
     font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
     border-collapse: collapse;
     border: 1px solid #5DADE2;
     font-weight:700;
}
.btnview:hover {background-color:  #85C1E9}

.btnview:active {
  background-color:  #85C1E9;
  box-shadow: 0 5px  #85C1E9;
  transform: translateY(4px);
}

.btnapplycfg{
     background-color: #AED6F1;
     margin-top:8px;
     margin-bottom:10px;
     margin-right:20px;
     width:150px;
     height:30px;
     font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
     border-collapse: collapse;
     border: 1px solid #5DADE2;
     font-weight:700;
}
.btnapplycfg:hover {background-color: #85C1E9}

.btnapplycfg:active {
  background-color: #85C1E9;
  box-shadow: 0 5px  #85C1E9;
  transform: translateY(4px);
}

.navbar-default .navbar-nav>li> a:hover {background-color: #FFFF00}

 .btnCompareVersion{
     background-color: #AED6F1;
     margin-top:8px;
     margin-bottom:10px;
     margin-right:20px;
     width:150px;
     height:30px;
     font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
     border-collapse: collapse;
     border: 1px solid #5DADE2;
     font-weight:700;
}

.btnCompareVersion:hover {background-color:  #85C1E9}

.btnCompareVersion:active {
  background-color: #85C1E9;
  box-shadow: 0 5px  #85C1E9;
  transform: translateY(4px);
  border-collapse: collapse;
  border: 2px solid #5DADE2;
}

.btnapply{
     background-color: #AED6F1;
     margin-top:8px;
     margin-bottom:10px;
     margin-right:20px;
     width:150px;
     height:30px;
     font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
     border-collapse: collapse;
     border: 1px solid #5DADE2;
     font-weight:700;
}

.btnapply:hover {background-color: #85C1E9}

.btnapply:active {
  background-color: #85C1E9;
  box-shadow: 0 5px #85C1E9;
  transform: translateY(4px);
  border-collapse: collapse;
  border: 2px solid #5DADE2;
}

.Formclass{
	width:100%;
    margin-top:30px;
    min-height:10000;
} 

.VersionMain{
	width:100%;
    margin-top:60px;
    min-height:2200px;
    border: 0.5px solid lightgrey;
} 

.versionHeading{
     width:100%;
     height:35px;
     margin-bottom:20px;
     background-color: #cce5ff;
     font-family:Trebuchet MS, Arial, Helvetica, sans-serif;
     margin-right: -15px;
     font-size: 15px;
     padding-top:5px;
     color:black;

}
{
    box-sizing: border-box;

}

.columnsVersion {
    float: left;
    width: 33.3%;
    padding: 8px;
    border-radius: 15px;
}

.columnsVersionview{
    float: left;
    width: 50%;
    padding: 8px;
    border-radius: 15px;
}

.price {
    list-style-type: none;
    border: 1px solid grey;
    border-radius: 25px;
    margin: 0;
    padding: 0;
    -webkit-transition: 0.3s;
    transition: 0.3s;
}

.price:hover {
    box-shadow: 0 8px 12px 0 rgba(0,0,0,0.2)
}

.price .headerVersion {
    background-color:#484848;
    color: white;
    font-size: 15px;
    border-radius: 50px;
    height:40px;
}

.price li {
    border-bottom: 1px solid #eee;
    padding: 5px;
    text-align: center;
    font-size: 12px;
    word-wrap: break-word;
}

.price .grey {
    background-color: #FFCCCC;
    font-size: 12px;
    margin-left:20px;
    margin-right:20px;
}

@media only screen and (max-width: 600px) {
    .columnsVersion {
        width: 100%;
    }
}
.separator{
	border-color:darkgrey;
	min-height:2px;
}
.listHeading{
	background-color: #ffcccc;
}