@charset "utf-8";
/* CSS Document */

/* GLOBAL STYLES
-------------------------------------------------- */
*{
	margin:0;
	padding:0;	
	font-size:14px;
}
img{
	border:none;	
}
body{
	width:100%;
	height:100%;
}
a{
	font-family: "europa";
}
/* FONTS
-------------------------------------------------- */
.balloon-tk-li{
	font-family: "balloon-urw";
	font-weight:300;
}
.balloon-tk-bo{
	font-family: "balloon-urw";
	font-weight:700;
}
.balloon-tk-eb{
	font-family: "balloon-urw";
	font-weight:800;
}
.europa-tk-re{
	font-family: "europa";
	font-weight: 	400;
}
.europa-tk-li{
	font-family: "europa";
	font-weight: 	100;
}
.bungee-tk-re{
	font-family: "bungee";
	font-weight: 400;
}
.bungee-tk-ol{
	font-family: "bungee";
	font-weight: 700;
}
.ff-cocon-pro-tk-re{
	font-family: "ff-cocon-pro";
	font-weight: 400;
}
.ff-cocon-pro-tk-bo{
	font-family: "ff-cocon-pro";
	font-weight: 700;
}
/* GLOBAL CUSTOM STYLES
------------------------------------------------------------------------------------------------------------------------------------------------------ */
.video-responsive{
  overflow:hidden;
  padding-bottom:56.25%;
  position:relative;
  height:0;
  border-radius: 25px;
  box-shadow: 2px 2px 9px rgba(0, 0, 0, 1.0);  
}
.video-responsive iframe{
  left:0;
  top:0;
  height:100%;
  width:100%;
	position:absolute;
}
.outer-container {
  display: flex;
  align-items: center;
  justify-content: center;
  height: auto;
}
.inner-container {
  width: 87%; /* or any other width value */
  height: 50%; /* or any other height value */
  text-align: center; /* optional, for text centering */
}
/* Site Header
-------------------------------------------------- */
.head-contain{
	background:linear-gradient(rgba(198,198,198,1.00),rgba(100,100,100,1.00));
}
.company-name{
	font-size:220%;
  font-weight:bold;
}
.site-logo {
	padding:38px 2%;
}	
.site-logo img{
	box-shadow: 0 2px 5px rgba(0,0,0,1.0);
}
.top-quote{
	text-align: center;
	margin-top:75px;
}
.top-quote h2, .top-quote a{
	color:rgba(255,255,255,1.00);
	font-size:26px;
	text-shadow: 0 0 5px rgba(0,0,0,1.0);
  text-decoration: none;
}
.site-social{
	margin-top:10px;
}
.phone{
	color:rgba(255,255,255,1.00);
	font-size:170%;
	display: block;
	text-align: center;
}
.address{
	color:rgba(255,255,255,1.00);
	font-size:135%;
	display:block;
	text-align: center;
}
.address:hover, .phone:hover{
	text-decoration: none;
	color:rgba(34,38,115,1.00);
}
.icons{
	margin-top:10px;
}
/* Navigation
-------------------------------------------------- */
.full-nav{
	display:inline;
}
.mobile-nav, .open-nav{
	display:none;
}
.site-nav{
	background: rgba(0,23,51,1.00);
}
.site-nav ul{
	width:100%;
	display: flex;
  flex-direction: row;	
	list-style: none;
	margin-bottom:0;
}
.site-nav ul li{
	flex-grow: 1;
	padding:28.5px 2%;
}
.site-nav ul li a{
	display:block;
	text-align: center;
	font-size:150%;
	color: rgba(255,255,255,1.00);
}
.site-nav ul li:hover{
	background: rgba(42,115,150,1.00);
}
.site-nav ul li a:hover{
	text-decoration: none;
}
.site-nav .dropdown-menu{
	width:20%;
	display:inline;
	padding:0%;
	margin-left:20%;
	margin-top:-40px;
	overflow: hidden;
	max-height:0;
	opacity:0.0;
	transition: all .5s ease-in-out;
}
.site-nav .drop:hover .dropdown-menu{
	max-height:175px;
	opacity:1.0;
	transition: all .5s ease-in-out;
}
/* Footer
-------------------------------------------------- */
.footer{
	background: url(../images/footer-backer.jpg);
	background-color:rgba(193,242,255,1.00);
	background-position: top;
	background-size:contain;
}
.footer-boxes{
	margin-top:60px;
}
.footer h2{
  font-size: 2.5rem;
  text-shadow: 0 0 6px rgba(0,0,0,1.0);
}
.footer h3 a{
	color:rgba(255,255,255,1.0);
	font-size:135%;
}
.footer-contact{
	color:rgba(255,255,255,1.00);
}
.footer-links{
	color:rgba(255,255,255,1.00);
}
.footer-links ul{

}
.footer-links ul li{
	
}
.footer-links ul a{
	list-style: none;
	font-family: "europa";
	font-weight: 	100;
	color:rgba(255,255,255,1.00);	
}
.footer .social-media{
	color:rgba(255,255,255,1.00);
}
.footer .l7{
	color:rgba(255,255,255,1.00);
	font-size:75%;
	text-align:center;
}
.footer .l7 a{
	color:rgba(255,255,255,1.00);
	text-align:center;
	font-size:90%;
}
/* PAGE STYLES
------------------------------------------------------------------------------------------------------------------------------------------------------ */
/* Homepage
-------------------------------------------------- */
.container-fluid{
	background:rgba(245,245,245,1.00);
}
.home-banner{
	padding:125px 0;
	background: url(../images/banner-backer.jpg);
	background-position: center;
	background-size: cover;
}
.home-banner h1{
	color:rgba(255,255,255,1.0);
	text-shadow: 0 0 10px rgba(0,0,0,1.0);
	font-size:200%;
}
.home-banner h2{
	color:rgba(255,255,255,1.0);
	text-shadow: 0 0 10px rgba(0,0,0,1.0);
	font-size:300%;
}
.home-banner h3{
	color:rgba(255,255,255,1.0);
	text-shadow: 0 0 10px rgba(0,0,0,1.0);
	font-size:200%;
}
.home-banner a{
	font-size:150%;
	margin-top:2%;
}
.home-services{
	padding:20px 0;
}
.home-ser-box{
	padding:20px;
	box-shadow:0 0 5px rgba(0,0,0,.4);
	border-radius: 5px;
	max-width: 31.333333333%;
  flex: 0 0 31.333333%;	
	margin-left:1%;
	margin-right:1%;
	background:rgba(255,255,255,1.00);
}
.home-ser-box i{
	font-size:1300%;
	padding:40px 0;
	color:rgba(206,179,0,1.00);
	text-shadow: 0 4px 6px rgba(0,0,0,.40);
}
.home-ser-box h2{
	font-size:240%;
	color:rgba(44,145,217,1.00);
	margin-bottom:4%;
}
.home-ser-box p{
	font-size:115%;
	line-height: 240%;
	margin-bottom:4%;
	padding:0 5%;
	min-height:300px;
	color:rgba(118,118,118,1.00);
}
.home-ser-box a{
	margin-top:7%;
	font-size:210%;
	box-shadow: 0 3px 5px rgba(0,0,0,.4);
	height:50px;
	overflow:hidden;	
	margin-bottom: 5px;
	transition: all .25s ease-in-out;	
}
.home-ser-box a:hover{
	font-size:230%;
	margin-top:5%;
	margin-bottom:.5%;	
	box-shadow: 0 15px 10px rgba(0,0,0,.4);
	color:#31b0d5;
	height:55px;
	transition: all .25s ease-in-out;	
}
.white-backer{
	background:rgba(255,255,255,1.0);
	margin-top:50px;
	margin-left:-30%;
	height:75px;
	width:150%;
	transition: all .25s ease-in-out;		
}
.home-ser-box a:hover .white-backer{
	margin-top:-55px;
	transition: all .25s ease-in-out;	
}
.home-blog{
	background: url(../images/blog-backer.jpg);
	background-repeat: no-repeat;
	background-size:cover;
	padding:40px 0;
}
.home-blog h2{
	color:rgba(255,255,255,1.0);
	font-size:300%;
}
.home-blog p{
	color:rgba(255,255,255,1.0);
	font-size:115%;
	line-height:250%;
}
.before-after{
	background:url(../images/now-fixed-backer.jpg);
	background-repeat: no-repeat;
	background-size: cover;
	padding-top:30px;
	padding-bottom:30px;
	box-shadow:inset 0 0 10px rgba(0,0,0,1.0)
}
.before-after h2{
	color: rgba(221,203,51,1.0);
	text-shadow: 0 4px 6px rgba(0,0,0,.60);
	font-size:350%;
}
.before-after h3{
	color: rgba(255,255,255,1.0);
	text-shadow: 0 0 10px rgba(0,0,0,1.0);
	font-size:200%;
}
.before-after img{
	border-radius: 5px;
	box-shadow: 0 3px 6px rgba(0,0,0,1.0);
}
.home-learn{
	padding:40px;
}
.home-learn a{
	font-size:150%;
}

/* Content Pages
-------------------------------------------------- */
.content-banner{
	padding:45px;
}
.content-banner h2{
	color:rgba(255,255,255,1.0);
	text-shadow: 0 0 4px rgba(0,0,0,1.0);
	font-size:300%;
}
.content{
	padding:20px;
}
.content p{
	font-size:125%;
	line-height:200%;
}
.content .about-photo{
	box-shadow: 0 5px 6px rgba(0,0,0,.6);
	margin-top:50px;
}
.content .service-photo{
	box-shadow: 0 5px 6px rgba(0,0,0,.6);
	margin-top:10px;
}
.circle{
	width:115px;
	height:115px;
	border-radius: 50%;
	background:rgba(117,180,255,1.00);
	box-shadow: 0 2px 6px rgba(0,0,0,.60);
	padding-top:25px;
	margin:25px auto;
	border:solid 5px rgba(255,255,255,1.0);
}
.circle i{
	color:rgba(255,255,255,1.0);
	font-size:450%;
}
.service-box{
	box-shadow: 0 3px 6px rgba(0,0,0,.60);
	background:rgba(46,68,85,1.00);
	padding:85px 8% 15px;
	margin-top:-85px;
	border-radius: 5px;
}
.service-box h2{
	color:rgba(223,191,22,1.00);
	min-height:60px;
  font-size: 195%;		
}
.service-box p{
	color: rgba(225,225,225,1.0);
	min-height:290px;	
}
.service-box .col-12{
	position: absolute;
	bottom:3%;
	padding:0;
	margin:0 auto;
	width:78%;
}
.service-box a{
	font-size:210%;
	box-shadow: 0 3px 5px rgba(0,0,0,.4);
	height:50px;
	overflow:hidden;	
	transition: all .25s ease-in-out;	
	margin-bottom: 20px;
}
.service-box a:hover{
	font-size:230%;
	margin-bottom:15px;
	box-shadow: 0 15px 10px rgba(0,0,0,.4);
	color:#31b0d5;
	height:55px;
	transition: all .25s ease-in-out;	
}
.white-backer{
	background:rgba(255,255,255,1.0);
	margin-top:50px;
	margin-left:-30%;
	height:75px;
	width:150%;
	transition: all .25s ease-in-out;		
}
.service-box a:hover .white-backer{
	margin-top:-55px;
	transition: all .25s ease-in-out;	
}
.business h2{
	color:#31b0d5;
}
.faq h3{
	font-size:280%;
	margin-bottom:0;
}
.faq a{
	font-size:100%;
}
.discount-page h1{
	font-size:205%;
}
.discount-page .europa-tk-re{
	font-size:180%;
}
.discount-page .ff-cocon-pro-tk-bo{
  color: rgba(44,145,217,1.00);
	font-size:350%;
}
.discount-page h5{
	color:rgba(193,175,23,1.00);
	font-size:240%;
}
/* Blog 
-------------------------------------------------- */
.blog-list-item h2 a{
	font-size:150%;
}
.blog-content p{
	font-size:150%;
	line-height:200%;
}
/* For Sale
-------------------------------------------------- */
.for-sale img{
	box-shadow: 0 3px 6px rgba(0,0,0,1.0);
	border-radius: 3px;
}
.for-sale h2{
	color:#31b0d5;
}
.for-sale h3{
	font-size:300%;
	color:rgba(26,197,18,1.00);
}
/* Content Page Headers 
-------------------------------------------------- */
.about-bradenton-pc-repair{
	background:url(../images/content-page-backers/about.jpg);
	background-repeat: no-repeat;
	background-size:cover;
}
.bradenton-pc-repair-services, .computer-diagnostic-virus-scan, .computer-class, .pc-deep-clean, .virus-removal, .software-install, .printer-setup, .data-backup, .in-home-computer-lessons, .home-networking-setup, .desktop-laptop-computer-repair, .new-computer-setup{
	background:url(../images/content-page-backers/services.jpg);
	background-repeat: no-repeat;
	background-size:cover;
}
.small-business-it-support-service, .hdmi-repair{
	background:url(../images/content-page-backers/business.jpg);
	background-repeat: no-repeat;
	background-size:cover;
}
.frequently-asked-questions{
	background:url(../images/content-page-backers/faq.jpg);
	background-repeat: no-repeat;
	background-size:cover;
}
.discounts{
	background:url(../images/content-page-backers/discounts.jpg);
	background-repeat: no-repeat;
	background-size:cover;
}
.computers-for-sale{
	background:url(../images/content-page-backers/computers.jpg);
	background-repeat: no-repeat;
	background-size:cover;
}
.contact-bradenton-pc-repair{
	background:url(../images/content-page-backers/contact.jpg);
	background-repeat: no-repeat;
	background-size:cover;
}
.blog, .blogs{
	background:url(../images/content-page-backers/blog.jpg);
	background-repeat: no-repeat;
	background-size:cover;
}
.reviews, .electronics-repair{
	background:url(../images/content-page-backers/business.jpg);
	background-repeat: no-repeat;
	background-size:cover;
}
.xbox-repair{
	background:url(../images/content-page-backers/xbox.webp);
	background-repeat: no-repeat;
	background-size:cover;
}
.ps5-repair{
	background:url("../images/content-page-backers/play-station.webp");
	background-repeat: no-repeat;
	background-size:cover;
}
.microsoft-surface-repair{
	background:url("../images/content-page-backers/microsoft-surface-repair.webp");
	background-repeat: no-repeat;
	background-size:cover;
}
.nintendo-switch-repair{
	background:url("../images/content-page-backers/nintendo-switch-repair.webp");
	background-repeat: no-repeat;
	background-size:cover;
}
.in-home-computer-repair{
	background:url("../images/content-page-backers/in-home-computer-repair.webp");
	background-repeat: no-repeat;
	background-size:cover;
}
.screen-replacement-repair{
	background:url("../images/content-page-backers/screen-repair.webp");
	background-repeat: no-repeat;
	background-size:cover;
}
.small-business-network-install{
	background:url("../images/content-page-backers/small-business-networking.webp");
	background-repeat: no-repeat;
	background-size:cover;
}
.console-repair{
	background:url("../images/content-page-backers/console-repair.webp");
	background-repeat: no-repeat;
	background-size:cover;
}
.review-box{
	box-shadow: 0 3px 6px rgba(0,0,0,.60);
	background:rgba(46,68,85,1.00);
	border-radius: 5px;
	margin-left:2.5px;
	margin-right:2.5px;
}
.review-box h2, .review-box p{
  color:rgba(255,255,255,1.0);
}
.review .checked {
  color: orange;
}
.review{
color:rgba(255,255,255,1.0);
}

@media (min-width: 310px) and (max-width:767px){
.mobile-nav{
	display:none;
}
.open-nav{
	display:block;
	cursor: pointer;
	font-size:150%;
	text-align: center;
	border: solid 1px rgba(0,0,0,.30);
	box-shadow: 0 0 5px rgba(0,0,0,.30);
	font-weight: 400;
	margin:0 0 0;
	padding:20px;
	background-color:rgba(81,181,236,1.00);
	text-shadow:0 2px 6px rgba(0,0,0,1.0);
	color:rgba(255,255,255,1.0);	
}
.full-nav{
	display:none;
}
.site-nav ul{
	display:inline;
	height:0px;
	transition:none;
}
.site-nav ul li{
	padding: 4.5px 2%;
}
.site-nav .dropdown-menu{
	opacity: 1.0;
	height:inherit;
	max-height:inherit;
	position: relative;
	width:100%;
	border: none;
	background: none;
	margin:inherit;
}
.company-name {
  font-size: 270%;
  font-weight: bold;
}
.site-logo {
	padding: 15px 2%;
}
.site-logo img{
max-width:85px;
}
.top-quote, .icons, .home-blog,.before-after{
	display:none;
}
.home-learn{
	padding-left:0px;
	padding-right:0px;
}
.site-social{
	margin-top:10px;
	margin-bottom:10px;
}
.home-banner{
	padding:35px 0;
}
.home-banner h1{
	font-size:185%;
}
.home-banner h2{
	font-size:125%;
}
.home-ser-box{
	max-width: 95%;
	flex: 0 0 95%;
	margin:0 auto 10px;
}
.home-ser-box i {
    font-size: 600%;
    padding: 10px 0;
}
.home-ser-box p {
    line-height: 215%;
    margin-bottom: 0%;
		min-height:auto;
}
.home-blog h2 {
    font-size: 200%;
}
.home-blog p {
    line-height: 200%;
}
.before-after h2 {
    font-size: 230%;
}
.footer-links, .social-media .row, .social-media .mt-5{
	display:none;
}
.footer-contact h4{
  font-size:16px;
}
.footer{
	background-size:cover;
}
.content{
	padding: 0px;
}
.content-banner h2 {
    font-size: 200%;
}
.content-banner{
    padding: 20px;
}
.content p{
	font-size:100%;
}
.circle{
	margin:10px auto 25px;
}
.service-box{
	padding:85px 8% 10px;
	min-height:auto;
}
.faq h3 {
  font-size: 175%;
}
.discount-page h1 {
  font-size: 170%;
}
.discount-page .europa-tk-re {
  font-size: 130%;
}
.discount-page .ff-cocon-pro-tk-bo {
  font-size: 270%;
}
.discount-page h5 {
  font-size: 145%;
}
}
@media (min-width: 576px) and (max-width:767px){
/* --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------*/
/*checked*/
}
@media (min-width: 768px) and (max-width:991px){
/* --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------*/
.site-logo {
    padding: 10px 2%;
}
.site-logo img{
max-width:85px;
}
.company-name {
  font-size: 270%;
  font-weight: bold;
}
.mobile-nav{
	display:none;
}
.open-nav{
	display:block;
	cursor: pointer;
	font-size:150%;
	text-align: center;
	border: solid 1px rgba(0,0,0,.30);
	box-shadow: 0 0 5px rgba(0,0,0,.30);
	font-weight: 400;
	margin:0 0 0;
	padding:20px;
	background-color:rgba(81,181,236,1.00);
	text-shadow:0 2px 6px rgba(0,0,0,1.0);
	color:rgba(255,255,255,1.0);	
}
.full-nav{
	display:none;
}
.site-nav ul{
	display:inline;
	height:0px;
	transition:none;
}
.site-nav ul li{
	padding: 4.5px 2%;
}
.site-nav .dropdown-menu{
	opacity: 1.0;
	height:inherit;
	max-height:inherit;
	position: relative;
	width:100%;
	border: none;
	background: none;
	margin:inherit;
}
.top-quote {
    text-align: center;
    margin-top: 25px;
}
.site-social{
	margin-bottom:15px;
}
.home-ser-box i{
	font-size:1000%;
}
.home-ser-box h2 {
    font-size: 175%;
		min-height:55px;
}
.home-ser-box p {
    min-height: 575px;
}
.before-after h2 {
	font-size: 200%;
}
.home-learn a {
 font-size: 125%;
}
.footer{
	background-size: cover;
}
.footer-links ul a {
	font-size:125%;
}
.footer h2{
	font-size: 225%;
}
.footer h2 a {
  font-size: 90%;
}
.footer h3{
  font-size: 130%;
}
.footer h5{
	font-size:100%;
}
/*-- Services Page --*/
.service-box h2 {
    font-size: 150%;
}
.service-box p {
    min-height: 355px;
}
.for-sale img{
	box-shadow: 0 3px 6px rgba(0,0,0,1.0);
	border-radius: 3px;
	margin-top:50px;
}
.for-sale h2{
	color:#31b0d5;
	font-size:200%;
}
.for-sale h3{
	font-size:250%;
	color:rgba(26,197,18,1.00);
}
}
@media only screen and (min-width: 850px) and (max-width:991px){
.site-nav ul li {
	padding: 4.5px 2%;
	width:20%;
	float:left;
	min-height:75px;
}
}
@media only screen and (min-width: 992px) and (max-width:1199px){
/* --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------*/
.site-nav ul li a{
	font-size:95%;
}
.top-quote {
    text-align: center;
    margin-top: 25px;
}
.company-name {
  font-size: 200%;
  font-weight: bold;
}
.phone{
	font-size:140%;
}
.address{
	font-size:100%;
}
.site-logo {
    padding: 10px 2%;
}
.site-social{
	margin-bottom:15px;
}
.home-ser-box i{
	font-size:1000%;
}
.home-ser-box h2 {
    font-size: 175%;
		min-height:55px;
}
.home-ser-box p {
    min-height: 420px;
}
.before-after h2 {
	font-size: 150%;
}
.home-learn a {
 font-size: 125%;
}
.footer{
	background-size: cover;
}
.footer-links ul a {
	font-size:125%;
}
.footer h2{
	font-size: 225%;
}
.footer h2 a {
  font-size: 90%;
}
.footer h3{
  font-size: 130%;
}
.footer h5{
	font-size:100%;
}
.service-box h2 {
    min-height: 50px;
    font-size: 150%;
}
.service-box p {
  color: rgba(225,225,225,1.0);
  min-height: 380px;
}
.for-sale img{
	box-shadow: 0 3px 6px rgba(0,0,0,1.0);
	border-radius: 3px;
	margin-top:50px;
}
.for-sale h2{
	color:#31b0d5;
	font-size:200%;
}
.for-sale h3{
	font-size:250%;
	color:rgba(26,197,18,1.00);
}
}
@media only screen and (min-width: 1200px) and (max-width:1609px){
/* --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------*/
.site-nav ul li a{
	font-size:115%;
}
.company-name {
  font-size: 250%;
  font-weight: bold;
}
.site-logo img{
  max-width:82px;
}
.top-quote {
    text-align: center;
    margin-top: 25px;
}
.phone{
	font-size:140%;
}
.address{
	font-size:100%;
}
.site-logo {
    padding: 10px 2%;
}
.site-social{
	margin-bottom:15px;
}
.home-banner h1 {
    font-size: 250%;
}
.home-ser-box i{
	font-size:1000%;
}
.home-ser-box h2 {
    font-size: 175%;
		min-height:55px;
}
.home-ser-box p {
    min-height: 460px;
}
.before-after h2 {
	font-size: 135%;
}
.home-learn a {
 font-size: 125%;
}
.footer{
	background-size: cover;
}
.footer-links ul a {
	font-size:125%;
}
.footer h2{
	font-size: 225%;
}
.footer h2 a {
  font-size: 90%;
}
.footer h3{
  font-size: 130%;
}
.footer h5{
	font-size:100%;
}
.service-box h2 {
  min-height: 50px;
  font-size: 125%;
}
.service-box p {
    min-height: 400px;
}
.for-sale h2{
	color:#31b0d5;
	font-size:200%;
}
.for-sale h3{
	font-size:250%;
	color:rgba(26,197,18,1.00);
}
}
@media only screen and (min-width: 1610px) {
/* --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------*/
.container{
width:1600px;
}
.company-name {
  font-size: 270%;
  font-weight: bold;
}
.site-logo img{
  max-width:82px;
}
.before-after h2 {
    font-size: 325%;
}
.home-ser-box h2 {
		min-height:60px;
}
.home-ser-box p {
    min-height: 380px;
}
.service-box p {
  min-height: 345px;
}
.service-box h2 {
  min-height: 60px;
  font-size: 160%;
}
}