
/* 
Colors:
Blue #36379C
Rollover Blue #3769FF */

@import url(https://fonts.googleapis.com/css?family=Averia+Libre:400italic);

.clear {clear:both; }

body {padding-bottom: 30px; margin-top:-8px;}

.container p {font-size:13pt }
.container ul {font-size:13pt }

.container h1 {color:#36379C }








#head-container {width:100%; background-color:#F6DA23; background-image:url('../images/bg.png'); background-repeat:repeat-x;}

#head-inner {width:1200px; margin:0 auto; min-height:134px; padding-top:8px}
            @media only screen and (max-device-width: 980px) {#head-inner {width:100%; padding:10px 10px; min-height:165px} }
            
#head-logo {float:left; margin-top:18px; width:500px } 
           @media only screen and (max-device-width: 980px) {#head-logo {float:none; width:90%; margin:8px auto 0 auto; } }

#head-type {float:right; width:290px; text-align:right; } 
            @media only screen and (max-device-width: 980px) {#head-type {float:none; margin:-3px auto 0 auto; text-align:center; width:90%} }  
            
#head-type h1 {color:#36379C; font-family:'Averia Libre', cursive, sans-serif; font-size:17pt; letter-spacing:-1px} 
            @media only screen and (max-device-width: 980px) {#head-type h1 {} }        


#page-wrapper {background-image:url('../images/paper-bg.jpg'); background-size:100%; width:100%; background-color:#DDB26E; }

#page-area {width:1200px; background-color:#fff; margin:0 auto }
           @media only screen and (max-device-width: 980px) {#page-area {width:100%} }


         

/* ++++++++++++++++  MENU  ++++++++++++++++++ */
.navbar {background-color:#0000FF; font-size:11pt;}
.navbar li {font-size:11pt;}

/*space between screen buttons 
.nav>li>a{position:relative;display:block;padding:0px 16px}*/ 

/*Main menu "Tap for main Menu" */
#main-menu-type {float:left; font-size:1.4em;color:white;padding:15px 0 10px 0; font-family: 'Oswald', sans-serif; font-weight:400; border:0px white solid}
@media (min-width:980px){#main-menu-type{display:none;}}


.navbar-nav > li a {color:#000;  }
@media (max-width:500px){.navbar-nav > li a {font-size:16pt }}
@media (max-width:500px){.navbar-nav > li a, a:hover {font-size:14pt }}
@media (max-width:500px){.navbar-nav .open .dropdown-menu > li > a:hover, .navbar-nav .open .dropdown-menu > li > a:focus {font-size:14pt }}
/* @media (max-width:500px){.navbar-nav .open .dropdown-menu > li > a  {background-color:#333 }} */
@media (max-width:500px){.toggle-navigation {float:left; display:inline; color:#FFF; font-size:14pt; margin:10px 0 0 10px }}
@media (min-width:900px){.toggle-navigation {display:none;}}

.dropdown-header {
  display: block;
  padding: 3px 20px;
  font-size: 10pt;
  line-height: 1.42857143;
  color: #1873CC;
  white-space: nowrap;
  text-transform:uppercase;
  font-weight:600;
  }
  @media (max-width:500px){.dropdown-header {font-size:12pt;text-transform:uppercase;font-weight:bold; color:#EFEFEF}}
  
  /* Phone sub menu type */
  @media (max-width:500px){.dropdown-menu li a {font-size:14pt;}}
  @media (max-width:500px){.dropdown-menu li a:focus {font-size:16pt; color:red}}
 
 
 
/* ++++++++++++++++  END MENU  ++++++++++++++++++ */

.theme-dropdown .dropdown-menu {
  position: static;
  display: block;
  margin-bottom: 20px;
}

.theme-showcase > p > .btn {
  margin: 5px 0;
}

.theme-showcase .navbar .container {
  width: auto;
}

.navbar-default { }
.navbar { }
.dropdown-menu {}

@media only screen and (max-device-width: 980px) {.carousel-caption h1 {font-size: 60px; line-height:140%} }

/* ------------   Tabs  ------------------------------ */

.tab-pane {background-color:#1873CC; padding:10px 15px 10px 15px; color:white; border-radius:4px; border-color:#0000FF; margin-top:-1px}

.nav-tabs > li.active > a,
.nav-tabs > li.active > a:hover,
.nav-tabs > li.active > a:focus {
  color: #fff;
  cursor: default;
  background-color: #1873CC;
  border: 1px solid #1873CC;
  border-bottom-color: transparent;
}

.nav-tabs {
  border-bottom: 0px solid red;
}

.nav-tabs > li > a {color:##0000FF;}

.nav-tabs > li > a:hover{background-color: #0000FF; color:#fff;}

.nav-tabs > li > a:hover {border-color: #0000FF;}

/* ------------   End Tabs  ------------------------------ */



/* +++++++++++++  Carousel  +++++++++++ */

#Carousel-container { max-width:1200px; margin:0 auto;}
#myCarousel {margin-top:-20px }


.col-lg-4 h2 {color:#1873CC; }


.carousel-caption h1 {font-size:50pt; text-shadow:2px 2px 2px #000; color:#fff }

.carousel-caption p {font-size:18pt; text-shadow:1px 1px 2px #000; color:#fff }


/* ------------   Home Page  ------------------------------ */

@media only screen and (max-device-width: 980px) { .container .marketing h1 {font-size:28px; line-height:130%;} }


/* ------------   Contact Page  ------------------------------ */

.address {float:left; width:620px; border:0px pink dotted }
          @media only screen and (max-device-width: 520px) { .address {width:100%}  }


.contact-form { float:right; width:350px; margin-bottom:20px; border:0px dotted}
                @media only screen and (max-device-width: 520px) { .contact-form {float:none; width:100%}  }

#map {width:620px; height:400px; margin-bottom:20px;}

form input[type=text] {width:90% }

textarea { font-family: inherit; font-size: inherit; width:90%; min-height:160px}



@media only screen and (max-device-width: 520px) { #map, iframe, {width:85%}  }

@media only screen and (max-device-width: 970px) { input[type=text]{font-size:14px;width:90%; } 
                                                   textarea{ width:90%; }
                                                   input[type=submit] {font-size:13pt }
                                                   }


#space-250 {width:20px; height:250px }
           @media only screen and (max-device-width: 520px) {#space-250 {display:none;}  }


/* ------------   Product Page  ------------------------------ */

.category-image {float:right; width:500px; margin-left:10px; margin-top:5px; position:relative; }
                @media only screen and (max-device-width: 500px) { .category-image {width:100%; float:none; margin-right:10px;}  }
                
.about-image {float:right; width:600px; margin-left:10px; margin-top:5px; margin-bottom:25px; position:relative; }
                @media only screen and (max-device-width: 500px) { .about-image {width:100%; float:none; margin-right:10px;}  }
    
/* ------------   Footer  ------------------------------ */

#footer-container {width:100%; background-color:#BEA708; background-image:url('images/bg-footer.jpg'); background-repeat:repeat-x;}

footer {width:1200px; border:0px red dashed; margin:0 auto 0 auto; min-height:133px; padding-top:10px; }
       @media only screen and (max-device-width: 980px){footer {width:100%; padding:0 10px;}}

footer p {color:#fff }
footer p a {color:#fff }

.footer-phone-number { font-size:24pt; font-weight: 300; line-height: 1; letter-spacing: -1px; margin:10px 0 25px 0}
                     @media only screen and (max-device-width: 500px){.footer-phone-number {display:none;}}

.footer-phone-number-mobile { display:none;}
                     @media only screen and (max-device-width: 500px){.footer-phone-number-mobile {display:inline; padding-left:10px; margin-top:25px}}

#footer-logo {width:200px; text-align:center; float:right; } 
             @media only screen and (max-device-width: 500px){#footer-logo {width:260px; margin:0 auto; float:none;text-align:center; padding-top:10px}}

#footer-logo p { text-align:right; color:#36379C; font-family:'Averia Libre', cursive, sans-serif; line-height:110%; }
               @media only screen and (max-device-width: 500px){#footer-logo p {text-align:center;}}

.address {float:left; margin-right:40px; color:#666666;}
         @media only screen and (max-device-width: 500px){.address {width:100%; text-align:center;}}
                                         
.address p {color:#666666;}

.address span {font-size:130%; }
              @media only screen and (max-device-width: 500px){.address span {font-size:150%}}

#site-map {margin:10px 0 0 0 } 
          @media only screen and (max-device-width: 980px){#site-map {display:none;}}

          
.copyright {margin-top:-20px; margin-bottom:8px }

.copyright p {color:#666666; font-size:75% }
   
      
#ideo {margin:10px auto 15px auto; width:1200px;}
      @media only screen and (max-device-width: 980px){#ideo {width:100%;padding-left:10px}}
      
            
#ideo a {
    font-size:8pt;
	color:#000000;
    text-decoration:none;
    padding-bottom:20px;
    }
    @media only screen and (max-device-width: 980px){#ideo a {font-size:0.6em;}}
    
#ideo a:hover {
	color:#DADADA;
	text-decoration:none;
    padding-bottom:20px;
    }
 
    
/* UP TAB  */    
#tab {margin-right:-4px }
     @media only screen and (max-device-width: 980px){#tab {display:none;}}


  
#tab button{
      
      background-color:#36379C;
      border-top:1px #36379C solid; 
      border-left:1px #36379C solid;
      border-bottom:1px #36379C solid;
      border-top-left-radius:10px;
      border-bottom-left-radius:10px;
      position:fixed; 
      bottom:50px; 
      right:0; 
      text-align:right;
      padding-right:10px;
      padding-left:10px;
      padding-top:5px;
      padding-bottom:7px;
      box-shadow: 6px 6px 5px #888888;
      font-size:0.9em;
      color:white;
      }
       @media only screen and (max-device-width: 980px){#tab button {display:none;}}


.caret2{display:inline-block;
        width:0;height:0;margin-left:2px;vertical-align:middle;
        border-bottom:8px white solid;
        border-right:8px solid transparent;
        border-left:8px solid transparent
        }
        @media only screen and (max-device-width: 980px){.caret2 {display:none;}}
        
/* Page up Button for phone */      
.page-up {display:none;} 
         @media only screen and (max-device-width: 980px){.page-up {display:block; padding:10px; margin:5px auto; text-align:center;}}
         
.caret3  {display:inline-block;
         width:0;height:0;
         margin-left:2px;
         vertical-align:middle;
         border-bottom:8px black solid;
         border-right:8px solid transparent;
         border-left:8px solid transparent}
 @media only screen and (max-device-width: 980px){.page-up button {color:black; padding-bottom:10px}}

.copyright {display:inline;}
 @media only screen and (max-device-width: 500px){.copyright {display:none;}}


/* ------------   End footer  ------------------------------ */