/*

Template: The Corps — Responsive Multi-purpose HTML5 Template
Author: potenzaglobalsolutions.com
Version:  2.0
Design and Developed by: potenzaglobalsolutions.com

Note: This is shortcodes stylesheet of template, This file contains the styling for all template shortcodes.

*/

/* Your custom css codes start from here: */


/*================================================
[  Table of contents  ]
================================================
 :: buttons
 :: Accordions


======================================
[ End table content ]
======================================*/
 

/*************************
		buttons
*************************/
a.button.large {margin-right: 0px; }
a.button.large span { padding: 16px 80px; font-size: 18px;  }
a.button.large i { padding: 20px; width: 60px; font-size: 18px; }
a.button.medium span { padding: 14px 60px; font-size: 16px; }
a.button.medium i { padding: 17px; width: 50px; font-size: 16px; }
a.button.small span { padding: 12px 40px; }
a.button.small i { padding: 14px; width: 45px; }
a.button.small span { padding: 12px 40px; }
a.button.small i { padding: 14px; width: 45px; }
a.button.extra-small span { padding: 8px 20px; font-size: 13px; }
a.button.extra-small i { padding: 10px; width: 38px; font-size: 13px; }

/*************************
		Accordions
*************************/
.accordion-2 .accordion-2-title { margin-bottom: 10px; font-size: 15px; font-weight: normal; }
.accordion-2 .accordion-2-title a { display: block; position: relative; color: #777; font-size: 16px; text-decoration: none; padding: 14px 20px; border: 1px solid #e5e5e5; -webkit-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000);  -moz-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000); -o-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000);-ms-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000);  transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000); }
.accordion-2 .accordion-2-title a:hover { text-decoration: none; border-color: #ddd; background-color: #00a9da;	color: #fff; }
.accordion-2 .accordion-2-title a.active { color: #fff; border-color: #ddd; background-color: #00a9da; }
.accordion-2 .accordion-2-title a:after { content: "\f107"; width: 15px; height: 15px; margin-top: -8px; position: absolute; top: 50%; right: 10px; font-family: 'FontAwesome'; speak: none; font-style: normal; font-weight: normal; font-variant: normal; text-transform: none; font-size: 20px; line-height: 20px; text-align: center; color: #999; -webkit-font-smoothing: antialiased;
	-webkit-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000);  -moz-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000); -o-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000); -ms-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000);  transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000); }
.accordion-2 .accordion-2-title a.active:after,
.accordion-2 .accordion-2-title a.active:hover:after { content: "\f106"; color: #fff; }
.accordion-2 .accordion-2-title a:hover:after { color: #444; }
.accordion-2 .accordion-2-content { margin-bottom: 10px; padding: 10px 20px 10px; font-size: 14px; color: #777; }
 
/*************************
	  list-style
*************************/
ul.list-style-1 li { font-size: 14px; color: #626262; margin-bottom: 15px; }
ul.list-style-1 li i { padding-right: 20px; }
ul.list-style-1 li span { padding-right: 20px; }
ul.list-style-2 li { font-size: 14px; color: #626262; margin-bottom: 15px; }
ul.list-style-2 li i { background: #00a9da; width: 25px; height: 25px; line-height: 25px; color: #fff; border-radius: 50%; text-align: center; margin-right: 20px; }
ul.list-style-2 li span {background: #00a9da; width: 25px; height: 25px; line-height: 25px; color: #fff; border-radius: 50%; text-align: center; margin-right: 20px; display: inline-block; }
ul.list-style-3 li { font-size: 14px; color: #626262; margin-bottom: 15px; border-bottom: 1px solid #f2f2f2; padding-bottom: 15px; }
ul.list-style-3 li i { background: #00a9da; width: 25px; height: 25px; line-height: 25px; color: #fff; border-radius: 50%; text-align: center; margin-right: 20px; }
ul.list-style-3 li span {background: #00a9da; width: 25px; height: 25px; line-height: 25px; color: #fff; border-radius: 50%; text-align: center; margin-right: 20px; display: inline-block; }

/*************************
	   columns
*************************/
.columns .gray-bg { padding: 15px; border-radius: 3px;}
.columns .gray-bg h5 { margin-bottom: 0px; }

/*************************
	   social-icon
*************************/
.social-icon-list ul { margin: 0; padding: 0; }
.social-icon-list ul li { display: inline-block; list-style: none; }
.social-icon-list ul li a { display: block; margin: 3px; width: 50px; height: 50px; line-height: 50px; font-size: 16px; color: #fff; background: #00a9da; text-align: center; border-radius: 50%; }
.social-icon-list ul li a:hover { background: #323232; }
.social-icon-list.list-2 ul li a { color: #fff; background: #323232; }
.social-icon-list.list-2 ul li a:hover { background: #00a9da; }
.social-icon-list.list-3 ul li a { color: #fff; background: transparent; border:1px solid #fff; }
.social-icon-list.list-3 ul li a:hover { background: #00a9da; border-color:#00a9da; }

/*************************
	   content-box
*************************/
.content-box .feature-3 .feature-3-image img { width: 100%; }

/*************************
	Typography
*************************/
.typography del, s, u { font-size: 14px; }
.typography .mark, mark { background: #00a9da; color: #fff;  }

/*************************
	data table
*************************/
.data-table .table thead { background: #00a9da; color: #fff; text-align: center; }
.data-table .table thead tr th { border: medium none;   font-weight: normal;  text-align: center;}
.data-table .table tbody tr td { color: #7e8890; font-size: 14px; padding: 12px 0; text-align: center; }
.data-table .table tbody tr.tr-bg td { background: #f7f7f7; }
.data-table .table-bordered tbody tr td { border-color: #eee; }
.data-table .table-2 .table thead { background: transparent; color: #00a9da; font-weight: 600; text-align: center; }
.data-table .table-2 .table thead tr th { border: 1px solid #00a9da; }
.data-table .table-3 .table thead { background: #dfdfdf; color: #323232; font-weight: 600; text-align: center; }
.data-table .table-3 .table thead tr th { border:none; }

/*************************
   alerts and callouts
*************************/
.alerts-and-callouts  { font-size: 14px;  }
.alerts-and-callouts .bs-callout { padding: 20px; margin: 20px 0; border: 1px solid #eee; border-left-width: 5px; border-radius: 3px; }
.alerts-and-callouts .bs-callout h4 {  margin-top: 0; margin-bottom: 5px; }
.alerts-and-callouts .bs-callout p:last-child { margin-bottom: 0; }
.alerts-and-callouts .bs-callout code { border-radius: 3px; }
.alerts-and-callouts .bs-callout+.bs-callout { margin-top: -5px; }
.alerts-and-callouts .bs-callout-default { border-left-color: #777; }
.alerts-and-callouts .bs-callout-default h4 { color: #777; }
.alerts-and-callouts .bs-callout-primary { border-left-color: #428bca; }
.alerts-and-callouts .bs-callout-primary h4 { color: #428bca; }
.alerts-and-callouts .bs-callout-success { border-left-color: #5cb85c; }
.alerts-and-callouts .bs-callout-success h4 { color: #5cb85c; }
.alerts-and-callouts .bs-callout-danger { border-left-color: #d9534f; }
.alerts-and-callouts .bs-callout-danger h4 { color: #d9534f; }
.alerts-and-callouts .bs-callout-warning { border-left-color: #f0ad4e; }
.alerts-and-callouts .bs-callout-warning h4 { color: #f0ad4e; }
.alerts-and-callouts .bs-callout-info { border-left-color: #5bc0de; }
.alerts-and-callouts .bs-callout-info h4 { color: #5bc0de; }

/*************************
        carousel
*************************/
.owl-carousel .owl-item img { width: 100%; }
.owl-theme .owl-controls { text-align: center; margin-top: 20px; }
.owl-theme .owl-controls .owl-nav [class*="owl-"] { background: #d6d6d6; border-radius: 3px; color: #fff; cursor: pointer; display: inline-block;  font-size: 14px; margin: 5px; padding: 4px 7px; }

/*************************
        tab
*************************/
 .tab-1 { border:1px solid #eceff7; padding: 20px; }
 .tab-1 ul { font-size: 0; position: relative; padding: 0; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none;  user-select: none; }
 .tab-1 li { display: inline-block;  background: #eceff7;  font-size: 16px;  text-align: letter-spacing: ;  line-height: 60px;  color: #fff;  text-transform: uppercase;
  position: relative; overflow: hidden; cursor: pointer; margin-right: 10px; }
 .tab-1 .fade.active { opacity: 1; }
.nav-tabs li a { border: none; padding: 10px 15px; border-radius: 0px; margin-right: 0px; color: #626262; }
.nav-tabs li strong { color: #caced8; }
.nav-tabs { border: 0px; }
.nav-tabs li:focus strong, .nav-tabs li:hover strong { color: #007da1; }
.nav-tabs li.active strong, .nav-tabs li.active strong:focus, .nav-tabs li.active strong:hover { color: #007da1;}
.nav-tabs li a:focus, .nav-tabs li a:hover { background: #00a9da; border:none; color: #fff; }
.nav-tabs li.active a, .nav-tabs li.active a:focus, .nav-tabs li.active a:hover { background: #00a9da; border:none; color: #fff;}
.tab-content {margin-top: 25px; }
.tab-content p { text-align: center; text-align: justify; margin-bottom: 0px; }
.tab-pane.fade.active { opacity: 1; }
.tab-2 #tabs { overflow: hidden; margin: 0;  padding: 0; font-size: 13px; line-height: 25px; background: #fff; border:1px solid #dcdee4; }
.tab-2 #tabs .tabs { overflow: hidden; margin: 0; float: left; width: 250px; text-align: center; }
.tab-2 #tabs .tabs li { padding: 17px 15px; font-weight: 600; color: #999999; background: #eceff7; font-size: 15px; border-bottom: 1px solid #dcdee4; margin-bottom: 0px; display: block; overflow: hidden; margin: 0; cursor: pointer; text-transform: uppercase; position: relative; -webkit-transition: all 0.4s ease; -o-transition: all 0.4s ease; -moz-transition: all 0.4s ease; -ms-transition: all 0.4s ease; transition: all 0.4s ease; }
.tab-2 #tabs .tabcontent { overflow: hidden; }
.tab-2 #tabs .tabs li:last-child { border-bottom: 0px; }
.tab-2 #tabs ul.tabs li.active, .tab-2 #tabs ul.tabs li.active:focus, .tab-2 #tabs ul.tabs li:hover { color: #fff; }
 
.pulse{ animation-name: pulse; -webkit-animation-name: pulse; -o-animation-name: pulse; -ms-animation-name: pulse; -moz-animation-name: pulse; animation-duration: 0.4s; -webkit-animation-duration: 0.4s; -o-animation-duration: 0.4s; -ms-animation-duration: 0.4s; -moz-animation-duration: 0.4s; }
@keyframes pulse {
  0% { transform: scale(0.8); opacity: 0; } 
  100% { transform: scale(1); opacity: 1; }     
}
@-webkit-keyframes pulse {
  0% { transform: scale(0.8); opacity: 0; } 
  100% { transform: scale(1); opacity: 1; }       
}
@-ms-keyframes pulse {
  0% { transform: scale(0.8); opacity: 0; } 
  100% { transform: scale(1); opacity: 1; }       
}
@-moz-keyframes pulse {
  0% { transform: scale(0.8); opacity: 0; } 
  100% { transform: scale(1); opacity: 1; }       
}
@-o-keyframes pulse {
  0% { transform: scale(0.8); opacity: 0; } 
  100% { transform: scale(1); opacity: 1; } 
}
.tab-2 .tabcontent {  background: #fff; padding: 20px 20px 0px; text-align: left; }
.tab-2 .tabcontent ul li { color: #888888; font-size: 14px; line-height: 31px; }
.tab-2 .tabcontent ul li i { padding-right: 10px; color: #888888; } 

 /*************************
    maintenance
*************************/
 .skills-2 .pct.text-white { color: #fff !important; }
 .maintenance-progress-bar.skills-3 { margin: 0px 0px 40px 0px; }
 .maintenance-progress-bar.skills-4 { margin: 0px; padding-bottom: 100px; }
 .maintenance-progress-bar.skills-4 span { color: #fff; }

 /*************************
        counter
*************************/
.counter-1.counter-main b { color: #00a9da; }
.counter-1.counter-main span { color: #00a9da; font-size: 40px; }

 /*************************
        skills 3
*************************/ 
.skills-3 li {position: relative; margin-bottom: 55px; font-size:16px;}
.skills-3 .bar_container,  .bar { position: absolute; left: 0; height: 7px; border-radius: 3px; content: ""; top:30px; }
.skills-3 .bar_container {bottom: -8px; width: 100%; background-color: #eceff8; text-align: right; }
.skills-3 .bar { top: 0; }
.skills-3 .pct { position: absolute; top: -30px; right: 0; opacity: 0; transition: opacity 0.3s linear; color: #fff !important; }

@media screen and (max-width: 767px) {
.accordion-2  { margin-top: 30px; }
.data-table .table tbody tr td { padding: 12px 10px; }
.tab-2 #tabs .tabs { width: 100%; }
.nav-tabs li a { font-size: 14px; }
.tab-1 li { margin-right: 2px; }

}
