/* My Styles */

/* Contents */
/*
Lightbox: BeginningLightbox - EndLightbox
Slider:   BeginningSlider - EndSlider 
Tags: OverWrite ShowHide
*/
html, body { margin: 0; padding: 0;}              
div, span, article, aside, footer, header, hgroup, nav, section,
h1, h2, h3, h4, h5, h6, p, blockquote, a, ol, ul, li, 
table, tr, th,td, tbody, tfoot, thead {
        margin: 0;
        padding: 0;
        border: 0;
        vertical-align: baseline;        
        }

        img    { margin:0;padding:0;border:0;}

       /* vertical-align:baseline;*/        
table, tr, th,td, tbody, tfoot, thead {
     margin:0;padding:0;border:0;
     vertical-align:baseline;
     *background:red;       
        }
        
table {border-collapse: collapse; border-spacing: 0;}

input, select , textarea, form , fieldset {
      margin: 0; padding:0; *border: thin !important;
      }
            
      article, aside , dialog , figure , footer, header, hgroup, nav, section {
     display:block;}
 
h1,h2,h3,h4,h5,h6,p,li,blockquote,td,th,a,caption,em,strong,strike{
     font-family:Arial, Helvetica, sans-serif;
     font-size:100%;
     font-weight:normal;
     font-style:normal;
     line-height:100%;
     text-align: left;
     text-decoration:none;     
     color:#000;
    }


/*heading*/
h1,h2,h3,h4,h5,h6 {font-weight:normal}

h1{font-size:24px;}  
h2{font-size:20px;}
h3{font-size:16px;}
h4{font-size:14px;} 
h5{font-size:14px;} 
h6{font-size:14px;} 

h1 img,h2 img,h3 img,h4 img,h5 img,h6 img {margin:0;} 

/* Text Elememets */
p                   {color:#000;font-size:12px; line-height:150%}
p .left             {margin:1.5em 1.5em 1.5em 0; padding:0;}
p .right            {margin:1.5em 0 1.5em 1.5em; padding:0;}
      
a                    { font-size:25px }
a:link               {color:#f00;}  
a:visited            {color:#000;}
a:hover              {color:#f00;}
a:focus              {color:#666;}
a:hover              {color:#f00;}

blockquote           {color:#000;font-size:12px;}

strong               {font-weight: bold;}
em                   {font-style:italic;}


/* Lists*/
ul                   { list-style-type:disc}
ol                   {list-style-type:decimal;}

ul  li               {color:#fff; font-size:15px;  }
ol  li               {color:#fff; font-size:20px;}

dl                   {}
dt                   {}
dd                   {}


/* Table */
table               {width:100%;}

tr                  {}
.odd                {background-color:#eee;}
.even               {background-color:#fff;}

th                  {font-weight:bold;}
.thead,th           {background-color:#ccc;}

tbody               {}

th,td,caption       {}
caption             {}

tfoot               {}
p.tfooter           {background-color:#ccc;text-align:center;font-style:italic; font-size:medium}

caption             {background:#efefef;}
  

/* Global */
html {}
body {}
#banner              { width:100%; margin:0px auto;padding: 20px 0; }
#subbanner           {width:100%;background-color:#555555;
                    padding:10px 0; overflow:hidden;}
#subbanner h3        {color:#ffffff;font-size:16px; font-weight:bold;
                         text-align:center;line-height:180%}
                         
#content             {float:left;width:650px;padding :20px;}
#content h1          {margin:0 0 20px 0;font-size:32px; 
                      border-bottom:1px #777777 solid;padding :20px 0}
#content p            { margin :16px 0; line-height:160%;}
#content h2           {margin :20px 0 0 0;}
#content img          {padding : 8px; border:1px #888888 solid ; margin :8px;}

#rightside           {padding :20px;margin-left:675px;}
#rightside h2        {margin :20px 0 10px 0;}
#rightside p         {margin:8px 0;line-height:160%;}

#box1    {}

#box2    {}

/* Navigation Extra  */


/*sub menu*/

/*ShowHide*/
input[type=checkbox], input[type=checkbox]:checked ~ .remove-check, #option{
    display: none;
}
.sh-hi{
    display: none;
    margin: 10px;
} 
input[type=checkbox]:checked ~ #option, input[type=checkbox]:checked ~ .sh-hi{
    display: block;
}


/*Background Images*/
        .montreal {
  display: table;
  height: 100%;
  width: 100%;
  position: relative;
  background: url('../images/Montreal.jpg') no-repeat center center fixed; 
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover; 
}

        .toronto {
  display: table;
  height: 100%;
  width: 100%;
  position: relative;
  background: url('../images/Toronto.jpg') no-repeat center center fixed; 
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;   
}

        .vancouver {
  display: table;
  height: 100%;
  width: 100%;
  position: relative;
  background: url('../images/vancouver.jpg') no-repeat center center fixed; 
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover; 
}

        .bugatti {
  display: table;
  height: 100%;
  width: 100%;
  position: relative;
  background: url('../images/bugatti.jpg') no-repeat center center fixed; 
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover; 
}

     .sea {
  display: table;
  height: 100%;
  width: 100%;
  position: relative;
  background: url('../images/sea.jpg') no-repeat center center fixed; 
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover; 
  }

/* OverWrite  */
.h2-center h2  {text-align: center;}
.mthumbnail {
  /* display: block; */
  /* padding: 4px; */
  margin-bottom: 20px;
  line-height: 1.42857143;
  /* background-color: #fff; */
  border: 3px solid #ddd;
  border-radius: 4px;
  -webkit-transition: border .2s ease-in-out;
  -o-transition: border .2s ease-in-out;
  transition: border .2s ease-in-out;
}

/* Layout Extra */
#social-media        {float :right;margin :0 10px 0 0;}
#social-media p      { color:#ffffff;font-size:11px; margin:4px 10px 4px 0px;}
#social-media img    { width:24px; height:24px;}
#social-media  li    {display:inline;}  

/* Header */
@media (max-width: 768px) {
        .topcenter {  
    margin-right: 12.5% !important;
    margin-left: 12.5% !important;
    } 
    #topright, #topleft {
      display: none;
    }   
  }

/* Containers */    
#wrapper             {margin:10px auto; border: thin black solid; overflow:hidden }
#wrapper ul li       {list-style: none;}

#tops ul li,h1,h3    {text-align:center; color:#fff !important; font-size:xx-large }

#logo ul li          {text-align: center; ;margin-top:1%;}
#logo                {margin-top:1%}
#topleft             {background-color:#333333;float:left;margin:1%}
#topleft   a         { padding:10px; display:block;border-bottom:3px solid}  
#topleft a:link      { color:#ffffff;}
#topleft a:visited   { color:#ffffff;}
#topleft a:active    { color:#ffffff;}
#topleft a:hover     { color:#ffffff;background-color:#C5C5C5}
#topleft a:focus     { color:#ffffff;}

#topright            {background-color:#333333;float:right;margin:1%}
#topright   a        { padding:10px; display:block;border-bottom:3px solid}   
#topright a:link     { color:#ffffff;}
#topright a:visited  { color:#ffffff;}
#topright a:active   { color:#ffffff;}
#topright a:hover    { color:#ffffff;background-color:#C5C5C5}
#topright a:focus    { color:#ffffff;}

#Controller           { margin:auto 10px}

/* Content */
#text                 {background:#333;width:540px;margin:10px;border-bottom:3px solid}
#text p               {color: white}

#text-education       {background:#333;width:528px;margin:20px;border-bottom:3px solid}
#text-education p     {color: white}

#text-objective       {background:#333;width:540px;margin:10px;border-bottom:3px solid}
#text-objective ul li {list-style: square;margin: 10px;font-size: 20px}

#contacts             {border:thin black solid;margin:20px ; display:inline-block} 
#contacts p, ol li    { list-style-type:none; color:black} 

/* Footer */
#footer              {clear :both;background-color:rgba(0, 0, 0,0.6);padding :10px;}
#footer p            {text-align:center;color :#ffffff;}

/* -- AddIn -- */
  

/* Lightbox: BeginningLightbox */
/* Preload images */
body:after {
  content: url(../img/close.png) url(../img/loading.gif) url(../img/prev.png) url(../img/next.png);
  display: none;
}

.lightboxOverlay {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 9999;
  background-color: black;
  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=80);
  opacity: 0.8;
  display: none;
}

.lightbox {
  position: absolute;
  left: 0;
  width: 100%;
  z-index: 10000;
  text-align: center;
  line-height: 0;
  font-weight: normal;
}

.lightbox .lb-image {
  display: block;
  height: auto;
  max-width: inherit;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  -ms-border-radius: 3px;
  -o-border-radius: 3px;
  border-radius: 3px;
}

.lightbox a img {
  border: none;
}

.lb-outerContainer {
  position: relative;
  background-color: white;
  *zoom: 1;
  width: 250px;
  height: 250px;
  margin: 0 auto;
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  -ms-border-radius: 4px;
  -o-border-radius: 4px;
  border-radius: 4px;
}

.lb-outerContainer:after {
  content: "";
  display: table;
  clear: both;
}

.lb-container {
  padding: 4px;
}

.lb-loader {
  position: absolute;
  top: 43%;
  left: 0;
  height: 25%;
  width: 100%;
  text-align: center;
  line-height: 0;
}

.lb-cancel {
  display: block;
  width: 32px;
  height: 32px;
  margin: 0 auto;
  background: url(../img/loading.gif) no-repeat;
}

.lb-nav {
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
  z-index: 10;
}

.lb-container > .nav {
  left: 0;
}

.lb-nav a {
  outline: none;
  background-image: url('data:image/gif;base64,R0lGODlhAQABAPAAAP///wAAACH5BAEAAAAALAAAAAABAAEAAAICRAEAOw==');
}

.lb-prev, .lb-next {
  height: 100%;
  cursor: pointer;
  display: block;
}

.lb-nav a.lb-prev {
  width: 34%;
  left: 0;
  float: left;
  background: url(../img/prev.png) left 48% no-repeat;
  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);
  opacity: 0;
  -webkit-transition: opacity 0.6s;
  -moz-transition: opacity 0.6s;
  -o-transition: opacity 0.6s;
  transition: opacity 0.6s;
}

.lb-nav a.lb-prev:hover {
  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);
  opacity: 1;
}

.lb-nav a.lb-next {
  width: 64%;
  right: 0;
  float: right;
  background: url(../img/next.png) right 48% no-repeat;
  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);
  opacity: 0;
  -webkit-transition: opacity 0.6s;
  -moz-transition: opacity 0.6s;
  -o-transition: opacity 0.6s;
  transition: opacity 0.6s;
}

.lb-nav a.lb-next:hover {
  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);
  opacity: 1;
}

.lb-dataContainer {
  margin: 0 auto;
  padding-top: 5px;
  *zoom: 1;
  width: 100%;
  -moz-border-radius-bottomleft: 4px;
  -webkit-border-bottom-left-radius: 4px;
  border-bottom-left-radius: 4px;
  -moz-border-radius-bottomright: 4px;
  -webkit-border-bottom-right-radius: 4px;
  border-bottom-right-radius: 4px;
}

.lb-dataContainer:after {
  content: "";
  display: table;
  clear: both;
}

.lb-data {
  padding: 0 4px;
  color: #ccc;
}

.lb-data .lb-details {
  width: 85%;
  float: left;
  text-align: left;
  line-height: 1.1em;
}

.lb-data .lb-caption {
  font-size: 13px;
  font-weight: bold;
  line-height: 1em;
}

.lb-data .lb-number {
  display: block;
  clear: left;
  padding-bottom: 1em;
  font-size: 12px;
  color: #999999;
}

.lb-data .lb-close {
  display: block;
  float: right;
  width: 30px;
  height: 30px;
  background: url(../img/close.png) top right no-repeat;
  text-align: right;
  outline: none;
  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=70);
  opacity: 0.7;
  -webkit-transition: opacity 0.2s;
  -moz-transition: opacity 0.2s;
  -o-transition: opacity 0.2s;
  transition: opacity 0.2s;
}

.lb-data .lb-close:hover {
  cursor: pointer;
  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);
  opacity: 1;
}
/* Lightbox: EndLightbox */

/* Slider: BeginningSlider */
 /* Caption Style */
    
       .captionOrange, .captionBlack
        {
            color: #fff;
            font-size: 20px;
            line-height: 30px;
            text-align: center;
            border-radius: 4px;
        }
        .captionOrange
        {
            background: #EB5100;
            background-color: rgba(235, 81, 0, 0.6);
        }
        .captionBlack
        {
          font-size:16px;
            background: #000;
            background-color: rgba(0, 0, 0, 0.4);
            
        }
           .captionWhite 
        {
          font-size:16px;
            background:#fff;
            background-color:rgba(255, 255, 255,0.8) !important; 
            
        }

        a.captionOrange, A.captionOrange:active, A.captionOrange:visited
        {
          color: #ffffff;
          text-decoration: none;
        }
        a.captionOrange:hover
        {
            color: #eb5100;
            text-decoration: underline;
            background-color: #eeeeee;
            background-color: rgba(238, 238, 238, 0.7);
        }
        .bricon
        {
            background: url('../img/browser-icons.png');
        }


    
           /* this line can be removed, but it really helps in case of css conflicts in your page */
            .slider1 div { position: relative; margin: 0px; padding: 0px; }
      
      
      
           /*Navigator Skin Begin*/
           
           
                  
            /* jssor slider navigator skin 03 css */
            /*
            .jssorn03 div           (normal)
            .jssorn03 div:hover     (normal mouseover)
            .jssorn03 .av           (active)
            .jssorn03 .av:hover     (active mouseover)
            .jssorn03 .dn           (mousedown)
            */
            .jssorn03 div, .jssorn03 div:hover, .jssorn03 .av
            {
                background: url(../img/n03.png) no-repeat;
                overflow:hidden;
                cursor: pointer;
            }
            .jssorn03 div { background-position: -5px -4px; }
            .jssorn03 div:hover, .jssorn03 .av:hover { background-position: -35px -4px; }
            .jssorn03 .av { background-position: -65px -4px; }
            .jssorn03 .dn, .jssorn03 .dn:hover { background-position: -95px -4px; }
        
        
        
         /* Direction Navigator Skin Begin */        
          
        
            /* jssor slider direction navigator skin 20 css */
            /*
            .jssord20l              (normal)
            .jssord20r              (normal)
            .jssord20l:hover        (normal mouseover)
            .jssord20r:hover        (normal mouseover)
            .jssord20ldn            (mousedown)
            .jssord20rdn            (mousedown)
            */
            .jssord20l, .jssord20r, .jssord20ldn, .jssord20rdn
            {
              position: absolute;
              cursor: pointer;
              display: block;
                background: url(../img/d20.png) no-repeat;
                overflow:hidden;
            }
            .jssord20l { background-position: -3px -33px; }
            .jssord20r { background-position: -63px -33px; }
            .jssord20l:hover { background-position: -123px -33px; }
            .jssord20r:hover { background-position: -183px -33px; }
            .jssord20ldn { background-position: -243px -33px; }
            .jssord20rdn { background-position: -303px -33px; }       
/* Slider: EndSlider */