/* version 1.6 */

/*Buttons*/

.FREETRIAL-btn{
	background-color: #008ed6;
  border: none;
  color: white;
  width: 160px;
  height: 50px;
  padding: 15px 40px;
  text-align: center;
  font-size: 16px;
  margin: 4px 2px;
  border-radius: 4px;
  text-transform: uppercase;
  font-size: 14px;
  font-weight: 600;
}
	
.FREETRIAL-btn:hover {
  color: white;
  text-decoration: 0
}
	
.FREETRIAL-btn:focus {
  color: rgb(255, 255, 255);
  text-decoration: none;
}
	
.BUYNOW-btn{
	background-color: #000000;
	border-radius: 4px;
	border: 1px solid #444348;
	color: white;
	width: 160px;
	height: 50px;
	padding: 15px 40px;
	text-align: center;
	vertical-align: middle;
	font-size: 16px;
	margin: 4px 2px;
	border-radius: 4px;
	text-transform: uppercase;
	font-size: 14px;
	font-weight: 600;
	}
	
	.BUYNOW-btn:hover {
	  color: white;
	  text-decoration: 0
	}
	
	.BUYNOW-btn:focus {
	  color: rgb(255, 255, 255);
	  text-decoration: none;
	}
	
.TableBlue-btn{
	background-color: #008ed6;
	border: none;
	color: white;
	padding: 17px 40px;
	text-align: center;
	margin: 4px 2px;
	border-radius: 4px;
	text-transform: uppercase;
	font-size: 16px;
	font-weight: 700;
}
	
.TableBlue-btn:hover {
  color: white;
  text-decoration: 0
}

.single-table:hover .table-description .TableWhite-btn{
  background: #008ed6;
  color: #fff;
  border:0;
}
	
.table-description .TableWhite-btn{
	padding: 17px 40px;
	border:1px solid #e0e0e0;
	color: #008ed6;
	border-radius: 4px;
	background: transparent;
	margin-bottom: 30px;
	font-weight: 700;
	transition:all .5s ease 0s;
	-webkit-transition:all .5s ease 0s;
	-moz-transition:all .5s ease 0s;
	-o-transition:all .5s ease 0s;
	-ms-transition:all .5s ease 0s;
	text-transform: uppercase;
}
	
.TableWhite-btn:focus {
  text-decoration: none;
}

.DynamicBlue-btn{

	background-color: #008ed6;
	border: none;
	color: white;
	padding: 15px 40px;
	text-align: center;
	margin: 4px 2px;
	border-radius: 4px;
	text-transform: uppercase;
	font-size: 14px;
	font-weight: 600;
}
	
.DynamicBlue-btn:hover {
  color: white;
  text-decoration: 0
}
	
.DynamicBlue-btn:focus {
  color: rgb(255, 255, 255);
  text-decoration: none;
}

.DynamicBlack-btn{

	background-color: #000000;
	border: none;
	color: white;
	padding: 15px 40px;
	text-align: center;
	margin: 4px 2px;
	border-radius: 4px;
	text-transform: uppercase;
	font-size: 14px;
	font-weight: 600;	
}
	
.DynamicBlack-btn:hover {
  color: white;
  text-decoration: 0
}

.DynamicBlack-btn:focus {
  color: rgb(255, 255, 255);
  text-decoration: none;
}

/* This has a larger font for readability with some languages */

.DynamicBlueLF-btn{
	background-color: #008ed6;
	border: none;
	color: white;
	padding: 15px 40px;
	text-align: center;
	margin: 4px 2px;
	border-radius: 4px;
	text-transform: uppercase;
	font-size: 16px;
	font-weight: 600;
}

.DynamicBlueLF-btn:hover {
	color: white;
	text-decoration: 0
}

.DynamicBlueLF-btn:focus {
	color: rgb(255, 255, 255);
	text-decoration: none;
}

/* Button for long descpriptions and multiple lines */

.BlueML-btn{
	background-color: #008ed6;
	border: none;
	color: white;
	padding: 5px 5px;
	text-align: center;
	margin: 6px 4px;
	border-radius: 4px;
	text-transform: uppercase;
	font-size: 14px;
	font-weight: 600;
	width: 200px ;
	white-space: normal;
	display: inline-block;
	line-height: 1.5;
}

.BlueML-btn:hover {
	color: white;
	text-decoration: 0
}

.BlueML-btn:focus {
	color: rgb(255, 255, 255);
	text-decoration: none;
}


/* this is neccessary because the style.css version of table-description ends up defining button behavoir through <a>, so I seperated that out by defining <a> only under <p> */

.table-descriptionBLUE p{
	font-size: 18px;
	color: #000;
	padding: 40px 20px;
	margin-bottom: 0;
	transition:all .5s ease 0s;
	-webkit-transition:all .5s ease 0s;
	-moz-transition:all .5s ease 0s;
	-o-transition:all .5s ease 0s;
	-ms-transition:all .5s ease 0s;
}

.table-descriptionBLUE p a{
  color: #008ed6;
  transition:all .5s ease 0s;
  -webkit-transition:all .5s ease 0s;
  -moz-transition:all .5s ease 0s;
  -o-transition:all .5s ease 0s;
  -ms-transition:all .5s ease 0s;
}

.table-descriptionBLUE button{
  width: 160px;
  height: 50px;
  border:1px solid #e0e0e0;
  color: #008ed6;
  border-radius: 4px;
  background: transparent;
  margin-bottom: 30px;
  font-weight: 700;
  transition:all .5s ease 0s;
  -webkit-transition:all .5s ease 0s;
  -moz-transition:all .5s ease 0s;
  -o-transition:all .5s ease 0s;
  -ms-transition:all .5s ease 0s;
}

.single-table:hover .table-descriptionBLUE button{
  background: #008ed6;
  color: #fff;
  border:0;
}

.TableBlue-btn:hover {
  color: white;
  text-decoration: 0
}
	
.TableBlue-btn:focus {
  color: rgb(255, 255, 255);
  text-decoration: none;
}

/*currency for tables*/

.dollar:before {
	content: '$';
	font-size: 0.65em;
	vertical-align: 20%;
}

.USDollar:before {
	content: 'US$';
	font-size: 0.65em;
	vertical-align: 20%;
}
	
.euro:before {
	content: '€';
	font-size: 0.65em;
	vertical-align: 20%;
}

/*border for images*/

.imgborder {
	border: 1px solid rgb(0, 0, 0);
}

/*feature table*/

table {
  border-collapse: collapse;
  width: 100%;
  border: 2px solid #ddd;
  border-color:black
}

th, td {
  padding: 5px 10px; 
  border: 1px solid #ddd;
  border-color:black
}

th { 
  background-color: #2196F3;
  color:  #fff;               
  font-weight:  normal;
}

td {
  padding-left: 25px;  
}

/*colors for fonts*/

.red {
  color: red;
}

.skyblue { 
  color: #00c4ff; 
}

.black { 
  color: black; 
}

.white {
  color: white;
}

/*centering*/

.centercss {
  text-align: center;
}

.imgcentercss {
  display: block;
  margin-left: auto;
  margin-right: auto;
  max-width: 100%;
  height: auto;
}

/* logo menu fix */
    
@media only screen and (min-width: 768px) {
  #logo1 {
      display: none;
  }
}

@media only screen and (max-width: 769px) {
  #logo2 {
      display: none;
  }
}

/* collapsed dropdown menu color fix */

.dropdown-header {
  color: black;
}

@media (max-width: 767px) {
.navbar-default .navbar-nav .open .dropdown-menu>li>a {
    color: black;
}
}

/* Improved Buttons */

.DynamicBlue-normal{
  display:inline-block;
  background-color: #008ed6;
  border: none;
  color: white;
  padding: 15px 40px;
  text-align: center;
  margin-left: 25px;
  margin-top: 25px;
  margin-bottom: 25px;
  border-radius: 4px;
  text-transform: uppercase;
  font-size: 14px;
  font-weight: 600;
}
    
.DynamicBlue-normal:hover {
  color: white;
  text-decoration: 0
}
    
.DynamicBlue-normal:focus {
  color: rgb(255, 255, 255);
  text-decoration: none;
}
    
.DynamicBlack-normal{
  display:inline-block;
  background-color: #000000;
  border: 1px solid #444348;
  color: white;
  padding: 15px 40px;
  text-align: center;
  margin-left: 25px;
  margin-top: 25px;
  margin-bottom: 25px;
  border-radius: 4px;
  text-transform: uppercase;
  font-size: 14px;
  font-weight: 600;
}
    
.DynamicBlack-normal:hover {
  color: white;
  text-decoration: 0
}
    
.DynamicBlack-normal:focus {
  color: rgb(255, 255, 255);
  text-decoration: none;
}
    
@media (max-width: 500px){
  .DynamicBlue-normal {
    display: block;
    margin-top: 10px;    
    margin-bottom: 0px;
    margin-left: 0px;
  
  }
  .DynamicBlack-normal {
    display: block;
    margin-top: 10px;
    margin-bottom: 0px;
    margin-left: 0px;
  }

}

/* smooth scroll */

html {
  scroll-behavior: smooth;
}